diff --git a/src/store/module/MicroExhibition.ts b/src/store/module/MicroExhibition.ts index 0226a2f..f7eb293 100644 --- a/src/store/module/MicroExhibition.ts +++ b/src/store/module/MicroExhibition.ts @@ -29,21 +29,21 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, { } }, tuoxie: { - 'value': [ ], + 'value': [], 'chart': { xData: [], series: [] } }, "zuoyi": { - "value": [ ], + "value": [], "chart": { "series": [], "xData": [] } }, "fengzhong": { - "value": [ ], + "value": [], "chart": { "series": [], "xData": [] @@ -89,8 +89,8 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, { this.tuoxie = data; }, setfengzhong(data) { - data.value = data.value.map((item,index) => { - item.unshift(index+1) + data.value = data.value.map((item, index) => { + item.unshift(index + 1) return item }) data.chart.series = data.chart.series.map((item) => { @@ -101,8 +101,8 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, { this.fengzhong = data; }, setbanfang(data) { - data.value = data.value.map((item,index) => { - item.unshift(index+1) + data.value = data.value.map((item, index) => { + item.unshift(index + 1) return item }) data.chart.series = data.chart.series.map((item) => { @@ -113,9 +113,9 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, { this.banfang = data; }, setzuoyi(data) { - data.value = data.value.map((item,index) => { - item.unshift(index+1) - + data.value = data.value.map((item, index) => { + item.unshift(index + 1) + return item }) data.chart.series = data.chart.series.map((item) => { @@ -127,35 +127,37 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, { }, changestatus(data) { let map = { - '1171512':'zuoyi', - '1170304':'zuoyi', - '1171902':'zuoyi', - '10201557':'zuoyi', - '116023#':'tuoxie', - '104019420':'banfang', - '104019428':'banfang', - '1131514':'banfang', - '10404393':'banfang', - '10410207':'banfang', - '10102109':'fengzhong', - 'RP2011001':'fengzhong', - 'RP2011157':'fengzhong', - 'RPO00000OLS':'fengzhong', - '10102154':'fengzhong', - '1050910':'caijian', - '1190269':'caijian', + '1170304': 'zuoyi', + '1171902': 'zuoyi', + '10201557': 'zuoyi', + '1171701': 'zuoyi', + '116023#': 'tuoxie', + '104019420': 'banfang', + '104019428': 'banfang', + '1131514': 'banfang', + '10404393': 'banfang', + '10410207': 'banfang', + '10102109': 'fengzhong', + 'RP2011001#': 'fengzhong', + 'RP2011157': 'fengzhong', + '10102154': 'fengzhong', + '1050910': 'caijian', + '1190269': 'caijian', + '1021629': 'fengzhong', } - let {RackNumber,WorkingState} = data - let key = map[RackNumber] - this[key].value.forEach((item)=>{ - let index = item.findIndex((item2)=>{ - return item2==RackNumber + let { RackNumber, WorkingState } = data + let key = map[RackNumber]; + if (this[key] && this[key].hasOwnProperty('value')) { + this[key].value.forEach((item) => { + let index = item.findIndex((item2) => { + return item2 == RackNumber + }) + if (index != -1) { + item[item.length - 1] = WorkingState + } }) - if(index!=-1){ - item[item.length-1] = WorkingState - } - }) + } } }, diff --git a/src/views/MicroExhibition/components/ringChart.vue b/src/views/MicroExhibition/components/ringChart.vue index cf2bb57..9de83ca 100644 --- a/src/views/MicroExhibition/components/ringChart.vue +++ b/src/views/MicroExhibition/components/ringChart.vue @@ -19,7 +19,10 @@ let { t } = useI18n(); let ringRef = ref(); let ringChart = null; const prop = defineProps({ - data: [] + data: { + type: Array, + default: [] + } }) const init = () => { ringChart = proxy.$echarts.init(ringRef.value, 'dark') diff --git a/src/views/MicroExhibition/index.vue b/src/views/MicroExhibition/index.vue index 629c645..d1c6cd1 100644 --- a/src/views/MicroExhibition/index.vue +++ b/src/views/MicroExhibition/index.vue @@ -110,18 +110,19 @@ import BoardBar from "./components/BoardBar.vue"; import { getTopDevice, getCismaList } from '@/http/cisma' import { ref, onMounted, onUnmounted, getCurrentInstance, watch, onUpdated, computed } from 'vue' import { useMicroExhibitionStore } from '@/store/module/MicroExhibition' -import {connectWebsocket,closeWebsocket} from "@/utils/websocket" +import { connectWebsocket, closeWebsocket } from "@/utils/websocket" import { useI18n } from 'vue-i18n' let { t } = useI18n(); const store = useMicroExhibitionStore() let ringData = computed(() => { return [ - { name: '工作', value: store.devnum.on }, - { name: '停机', value: store.devnum.off }, - { name: '待机', value: store.devnum.wait }, -] + { name: '工作', value: store.devnum.on }, + { name: '停机', value: store.devnum.off }, + { name: '待机', value: store.devnum.wait }, + ] }) +let timer = null let dev_caijian_title = ['设备名称', '设备编码', '稼动率', '状态'] let dev_tuoxie_title = ['设备编码', '稼动率', '状态'] let dev_value = [ @@ -148,35 +149,60 @@ async function getCismaListData() { } } -function getWebsocket(val){ - try{ - let data=JSON.parse(val) - - - if(data.type=='StateChart'){ - store.setDevnum(data.msg) - } - if(data.type=='WorkingState'){ - store.changestatus(data.msg) - } +function getWebsocket(val) { + try { + let data = JSON.parse(val) - }catch(err){ - console.log(err); + + if (data.type == 'StateChart') { + store.setDevnum(data.msg) + } + if (data.type == 'WorkingState') { + store.changestatus(data.msg) + } + // if(data.type=='CISMA_chart'){ + // let obj = JSON.parse(data.msg.replace(/'/g,'"')) + // console.log(obj); + + // for(let key in obj){ + // console.log(key,obj[key]); + + // if (key == "版房设备") { + // store.setbanfang(obj[key]) + // } else if(key == "裁剪设备") { + // store.setcaijian(obj[key]) + // } else if(key == "缝中设备") { + // store.setfengzhong(obj[key]) + // } else if(key == "拖鞋自动生产线") { + // store.settuoxie(obj[key]) + // } else if(key == "座椅面套生产线") { + // store.setzuoyi(obj[key]) + // } + + // } + // } + + } catch (err) { + console.log(err); } - } - function errWebsocket(val){ +} +function errWebsocket(val) { // console.log(val); } onMounted(() => { getTopDeviceData() getCismaListData() - connectWebsocket(null,null,getWebsocket,errWebsocket) + timer = setInterval(() => { + getTopDeviceData() + }, 10000) + connectWebsocket(null, null, getWebsocket, errWebsocket) document.getElementById('app').style.backgroundColor = '#0E0E0E' }) onUnmounted(() => { + clearInterval(timer) document.getElementById('app').style.backgroundColor = '#100c2a' }) @@ -377,4 +403,5 @@ h2 { border-top: 92px solid #0E1D2F; border-left: 109px solid transparent; border-right: 110px solid transparent; -} +} +