diff --git a/src/views/MicroExhibition/index.vue b/src/views/MicroExhibition/index.vue index 55d8156..551e5d1 100644 --- a/src/views/MicroExhibition/index.vue +++ b/src/views/MicroExhibition/index.vue @@ -78,9 +78,9 @@ import { useI18n } from 'vue-i18n' let { t } = useI18n(); const store = useMicroExhibitionStore() -let videoUrl = ref('http://tjgoa.oss-cn-beijing.aliyuncs.com/202309141%E5%BE%AE%E5%B7%A5%E5%8E%82%E5%AE%A3%E4%BC%A0%E8%A7%86%E9%A2%91%E4%BA%8E%E6%89%BF%E5%BF%97.mp4') +let videoUrl = ref('https://d.tufting222.cn/video/yzy/a.mp4') const videoElement = ref(null) - +let timer = null let fqdata = ref({ list: [], @@ -121,21 +121,13 @@ let hzdata = ref([]) let xData = ref([]) let seriesData = ref([ ]) -let list = [ - [1, '自动缝纫机', 29, 1, '95%', '12min'], - [1, '自动缝纫机', 29, 1, '95%', '12min'], - [1, '自动缝纫机', 29, 1, '95%', '12min'], - [1, '自动缝纫机', 29, 1, '95%', '12min'], - [1, '自动缝纫机', 29, 1, '95%', '12min'],] - //获取echarts数据 +//获取echarts数据 function getDeviceProduction() { getmDeviceProduction().then((res: any) => { if (res.code == 200) { let data = res.data - console.log(data.series, 'data.series'); - - seriesData.value = data.series.map(item=>{ + seriesData.value = data.series.map(item => { return { name: item.name == '计划完成' ? '计划产量' : '实际产量', type: 'bar', @@ -152,22 +144,21 @@ function getmDevList() { getmDeviceList().then((res: any) => { if (res.code == 200) { let data = res.data - console.log(data, 'data'); for (let key in data) { const devObj = { - '裁剪设备':cjdata.value, - '缝前设备':fqdata.value, - '缝中设备':fzdata.value, + '裁剪设备': cjdata.value, + '缝前设备': fqdata.value, + '缝中设备': fzdata.value, } const statusObj = { - '裁剪设备':0, - '缝前设备':1, - '缝中设备':2, + '裁剪设备': 0, + '缝前设备': 1, + '缝中设备': 2, } if (devObj.hasOwnProperty(key)) { let online = 0; devObj[key].list = data[key].map((item: any, i: number) => { - if (item.status == 'true' || item.status == '2') { + if (item.status != 'false' || item.status != '0') { online++ } let temp = item.status @@ -181,44 +172,10 @@ function getmDevList() { stepList[statusObj[key]].online = online; stepList[statusObj[key]].total = devObj[key].list.length; } - // if (key == '裁剪设备') { - // let online = 0; - // cjdata.value.list = data[key].map((item: any, i: number) => { - // if (item.status == 'true' || item.status == '2') { - // online++ - // } - // return [i + 1, item.name, item.num, item.status, item.ratio, item.workTime] - // }) - // stepList[0].online = online; - // stepList[0].total = cjdata.value.list.length; - // } - // if (key == '缝前设备') { - // let online = 0; - // fqdata.value.list = data[key].map((item: any, i: number) => { - // if (item.status == 'true' || item.status == '2') { - // online++ - // } - // return [i + 1, item.name, item.num, item.status, item.ratio, item.workTime] - // }) - // stepList[1].online = online; - // stepList[1].total = fqdata.value.list.length; - - // } - // if (key == '缝中设备') { - // let online = 0; - // fzdata.value.list = data[key].map((item: any, i: number) => { - // if (item.status == 'true' || item.status == '2') { - // online++ - // } - // return [i + 1, item.name, item.num, item.status, item.ratio, item.workTime] - // }) - // stepList[2].online = online; - // stepList[2].total = fzdata.value.list.length; - // } if (key == '后整设备') { let online = 0; hzdata.value = data[key].map((item: any, i: number) => { - if (item.status == 'true' || item.status == '2') { + if (item.status != 'false' || item.status != '0') { online++ } let temp = item.status @@ -236,8 +193,6 @@ function getmDevList() { workTime: item.workTime, } }) - console.log(hzdata.value, 'hzdata.value'); - stepList[3].online = online; stepList[3].total = hzdata.value.length; } @@ -246,6 +201,53 @@ function getmDevList() { }) } +/* + 改变设备状态 + { + step:'裁剪设备', + num:1, + status:0 + } + */ +function changestatus(val) { + const devObj = { + '裁剪设备': cjdata.value, + '缝前设备': fqdata.value, + '缝中设备': fzdata.value, + } + const statusObj = { + '裁剪设备': 0, + '缝前设备': 1, + '缝中设备': 2, + } + if (val.step == "后整设备") { + let hzdataIndex = hzdata.value.find((item, index) => { + return item.num == val.num + }) + if (hzdataIndex !== -1 && hzdata.value[hzdataIndex].status != val.status) { + hzdata.value[hzdataIndex].status = val.status + if (val.status == '0') { + stepList[3].online -= 1 + } else { + stepList[3].online += 1 + } + + } + } else { + let dataIndex = devObj[val.step].list.findIndex((item, index) => { + return item[2] == val.num + }) + if (dataIndex !== -1 && devObj[val.step].list[dataIndex][3] != val.status) { + devObj[val.step].list[dataIndex][3] = val.status + if (val.status == '0') { + stepList[statusObj[val.step]].online -= 1 + } else { + stepList[statusObj[val.step]].online += 1 + } + } + } +} + function getWebsocket(val) { @@ -270,52 +272,23 @@ function errWebsocket(val) { } -// function videoToBase64(file) { -// return new Promise((resolve, reject) => { -// let reader:any = new FileReader(); -// reader.readAsDataURL(file); -// reader.onload = () => { -// let base64 = reader.result.split(',')[1]; -// resolve(base64); -// }; -// reader.onerror = error => reject(error); -// }); -// } - -// async function loadeddataFun() { -// if (localStorage.getItem('videoUrl')) { -// return -// } - -// const response:any = await fetch(videoWebUrl); -// const blob = await response.blob(); -// const fileReader:any = new FileReader(); -// console.log(response,'21313'); - -// fileReader.readAsDataURL(response); -// fileReader.onloadend = function () { -// const file = new File([fileReader.result], 'video.mp4', { type: 'video/mp4' }); -// videoUrl.value = URL.createObjectURL(file); -// let base64 = fileReader.result.split(',')[1]; - -// localStorage.setItem('videoUrl', base64 ) -// }; -// fileReader.readAsArrayBuffer(blob); - - -// } onMounted(() => { getDeviceProduction() getmDevList() + timer = setInterval(() => { + getDeviceProduction() + getmDevList() + }, 60*1000) connectWebsocket(null, null, getWebsocket, errWebsocket) document.getElementById('app').style.backgroundColor = 'rgba(0, 11, 18, 1)' }) onUnmounted(() => { closeWebsocket() - document.getElementById('app').style.backgroundColor = 'rgba(0, 11, 18, 1)' + clearInterval(timer) + document.getElementById('app').style.backgroundColor = '#100c2a' })