展会大屏修改

This commit is contained in:
hzz 2023-09-11 16:46:02 +08:00
parent 20b7885ba8
commit 296e42f621
3 changed files with 91 additions and 59 deletions

View File

@ -29,21 +29,21 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, {
} }
}, },
tuoxie: { tuoxie: {
'value': [ ], 'value': [],
'chart': { 'chart': {
xData: [], xData: [],
series: [] series: []
} }
}, },
"zuoyi": { "zuoyi": {
"value": [ ], "value": [],
"chart": { "chart": {
"series": [], "series": [],
"xData": [] "xData": []
} }
}, },
"fengzhong": { "fengzhong": {
"value": [ ], "value": [],
"chart": { "chart": {
"series": [], "series": [],
"xData": [] "xData": []
@ -89,8 +89,8 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, {
this.tuoxie = data; this.tuoxie = data;
}, },
setfengzhong(data) { setfengzhong(data) {
data.value = data.value.map((item,index) => { data.value = data.value.map((item, index) => {
item.unshift(index+1) item.unshift(index + 1)
return item return item
}) })
data.chart.series = data.chart.series.map((item) => { data.chart.series = data.chart.series.map((item) => {
@ -101,8 +101,8 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, {
this.fengzhong = data; this.fengzhong = data;
}, },
setbanfang(data) { setbanfang(data) {
data.value = data.value.map((item,index) => { data.value = data.value.map((item, index) => {
item.unshift(index+1) item.unshift(index + 1)
return item return item
}) })
data.chart.series = data.chart.series.map((item) => { data.chart.series = data.chart.series.map((item) => {
@ -113,8 +113,8 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, {
this.banfang = data; this.banfang = data;
}, },
setzuoyi(data) { setzuoyi(data) {
data.value = data.value.map((item,index) => { data.value = data.value.map((item, index) => {
item.unshift(index+1) item.unshift(index + 1)
return item return item
}) })
@ -127,36 +127,38 @@ export const useMicroExhibitionStore = defineStore(Names.MicroExhibition, {
}, },
changestatus(data) { changestatus(data) {
let map = { let map = {
'1171512':'zuoyi', '1170304': 'zuoyi',
'1170304':'zuoyi', '1171902': 'zuoyi',
'1171902':'zuoyi', '10201557': 'zuoyi',
'10201557':'zuoyi', '1171701': 'zuoyi',
'116023#':'tuoxie', '116023#': 'tuoxie',
'104019420':'banfang', '104019420': 'banfang',
'104019428':'banfang', '104019428': 'banfang',
'1131514':'banfang', '1131514': 'banfang',
'10404393':'banfang', '10404393': 'banfang',
'10410207':'banfang', '10410207': 'banfang',
'10102109':'fengzhong', '10102109': 'fengzhong',
'RP2011001':'fengzhong', 'RP2011001#': 'fengzhong',
'RP2011157':'fengzhong', 'RP2011157': 'fengzhong',
'RPO00000OLS':'fengzhong', '10102154': 'fengzhong',
'10102154':'fengzhong', '1050910': 'caijian',
'1050910':'caijian', '1190269': 'caijian',
'1190269':'caijian', '1021629': 'fengzhong',
} }
let {RackNumber,WorkingState} = data let { RackNumber, WorkingState } = data
let key = map[RackNumber] let key = map[RackNumber];
this[key].value.forEach((item)=>{ if (this[key] && this[key].hasOwnProperty('value')) {
let index = item.findIndex((item2)=>{ this[key].value.forEach((item) => {
return item2==RackNumber let index = item.findIndex((item2) => {
return item2 == RackNumber
}) })
if(index!=-1){ if (index != -1) {
item[item.length-1] = WorkingState item[item.length - 1] = WorkingState
} }
}) })
} }
}
}, },
}); });

View File

@ -19,7 +19,10 @@ let { t } = useI18n();
let ringRef = ref(); let ringRef = ref();
let ringChart = null; let ringChart = null;
const prop = defineProps({ const prop = defineProps({
data: [] data: {
type: Array,
default: []
}
}) })
const init = () => { const init = () => {
ringChart = proxy.$echarts.init(ringRef.value, 'dark') ringChart = proxy.$echarts.init(ringRef.value, 'dark')

View File

@ -110,7 +110,7 @@ import BoardBar from "./components/BoardBar.vue";
import { getTopDevice, getCismaList } from '@/http/cisma' import { getTopDevice, getCismaList } from '@/http/cisma'
import { ref, onMounted, onUnmounted, getCurrentInstance, watch, onUpdated, computed } from 'vue' import { ref, onMounted, onUnmounted, getCurrentInstance, watch, onUpdated, computed } from 'vue'
import { useMicroExhibitionStore } from '@/store/module/MicroExhibition' import { useMicroExhibitionStore } from '@/store/module/MicroExhibition'
import {connectWebsocket,closeWebsocket} from "@/utils/websocket" import { connectWebsocket, closeWebsocket } from "@/utils/websocket"
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
let { t } = useI18n(); let { t } = useI18n();
@ -120,8 +120,9 @@ let ringData = computed(() => {
{ name: '工作', value: store.devnum.on }, { name: '工作', value: store.devnum.on },
{ name: '停机', value: store.devnum.off }, { name: '停机', value: store.devnum.off },
{ name: '待机', value: store.devnum.wait }, { name: '待机', value: store.devnum.wait },
] ]
}) })
let timer = null
let dev_caijian_title = ['设备名称', '设备编码', '稼动率', '状态'] let dev_caijian_title = ['设备名称', '设备编码', '稼动率', '状态']
let dev_tuoxie_title = ['设备编码', '稼动率', '状态'] let dev_tuoxie_title = ['设备编码', '稼动率', '状态']
let dev_value = [ let dev_value = [
@ -148,35 +149,60 @@ async function getCismaListData() {
} }
} }
function getWebsocket(val){ function getWebsocket(val) {
try{ try {
let data=JSON.parse(val) let data = JSON.parse(val)
if(data.type=='StateChart'){ if (data.type == 'StateChart') {
store.setDevnum(data.msg) store.setDevnum(data.msg)
} }
if(data.type=='WorkingState'){ if (data.type == 'WorkingState') {
store.changestatus(data.msg) store.changestatus(data.msg)
} }
// if(data.type=='CISMA_chart'){
// let obj = JSON.parse(data.msg.replace(/'/g,'"'))
// console.log(obj);
}catch(err){ // 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); console.log(err);
} }
} }
function errWebsocket(val){ function errWebsocket(val) {
// console.log(val); // console.log(val);
} }
onMounted(() => { onMounted(() => {
getTopDeviceData() getTopDeviceData()
getCismaListData() getCismaListData()
connectWebsocket(null,null,getWebsocket,errWebsocket) timer = setInterval(() => {
getTopDeviceData()
}, 10000)
connectWebsocket(null, null, getWebsocket, errWebsocket)
document.getElementById('app').style.backgroundColor = '#0E0E0E' document.getElementById('app').style.backgroundColor = '#0E0E0E'
}) })
onUnmounted(() => { onUnmounted(() => {
clearInterval(timer)
document.getElementById('app').style.backgroundColor = '#100c2a' document.getElementById('app').style.backgroundColor = '#100c2a'
}) })
</script> </script>
@ -377,4 +403,5 @@ h2 {
border-top: 92px solid #0E1D2F; border-top: 92px solid #0E1D2F;
border-left: 109px solid transparent; border-left: 109px solid transparent;
border-right: 110px solid transparent; border-right: 110px solid transparent;
}</style> }
</style>