From cd2afcc4b9ed5567721af7fc8917dc27941bb88a Mon Sep 17 00:00:00 2001 From: wangfei <3597712270@qq.com> Date: 星期二, 13 八月 2024 14:17:45 +0800 Subject: [PATCH] 大理片笼调整表格,更改按钮名称 --- UI-Project/src/views/largescreen/largescreen.vue | 173 ++++++++++++++++++++++++++------------------------------- 1 files changed, 80 insertions(+), 93 deletions(-) diff --git a/UI-Project/src/views/largescreen/largescreen.vue b/UI-Project/src/views/largescreen/largescreen.vue index a3831c8..e46d431 100644 --- a/UI-Project/src/views/largescreen/largescreen.vue +++ b/UI-Project/src/views/largescreen/largescreen.vue @@ -1,5 +1,5 @@ <template> - <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;" v-loading="loading"> + <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading"> <el-scrollbar height="600px"> <div id="top" style="height: 150px;display: flex;"> <div class="echarts-container"> @@ -9,7 +9,7 @@ </div> </div> <div style="display: flex;"> -<div id="centerleft" style="margin-top: 10px;height: 240px;width: 340px;background-color: #911005;"> +<!-- <div id="centerleft" style="margin-top: 10px;height: 240px;width: 340px;background-color: #911005;"> <el-table height="240" ref="table" width="340px" @selection-change="handleSelectionChange" :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> @@ -24,8 +24,8 @@ </template> </el-table-column> </el-table> -</div> -<div id="parent" style="margin-top: 10px;margin-left: 10px; height: 240px;width: 750px;"> +</div> --> +<div id="parent" style="margin-top: 10px;margin-left: 10px; height: 240px;width: 1000px;"> <img src="../../assets/dpxsa.png" alt="" style="margin-left: -10px; width: 100%;height: 100%;position: relative;"> <div id="lipiana" v-show="woshia"></div> <div id="lipianb" v-show="woshia"></div> @@ -133,21 +133,36 @@ const tableDatac = ref([]) const adjustedRects = ref([]); const chartRefs = ref([]); -const flake = ref(false) -const flakeb = ref(false) -const flakec = ref(false) -const flaked = ref(false) -const woshia = ref(false) -const woshic = ref(false) -const dalipiana = ref(false) -const dalipianb = ref(false) -const shangpian = ref(false) -const xiapian1 = ref(false) -const xiapian2 = ref(false) -const xiapian3 = ref(false) -const xiapian4 = ref(false) -const xiapian5 = ref(false) -const xiapian6 = ref(false) +// const flake = ref(false) +// const flakeb = ref(false) +// const flakec = ref(false) +// const flaked = ref(false) +// const woshia = ref(false) +// const woshic = ref(false) +// const dalipiana = ref(false) +// const dalipianb = ref(false) +// const shangpian = ref(false) +// const xiapian1 = ref(false) +// const xiapian2 = ref(false) +// const xiapian3 = ref(false) +// const xiapian4 = ref(false) +// const xiapian5 = ref(false) +// const xiapian6 = ref(false) +const flake = ref(true) +const flakeb = ref(true) +const flakec = ref(true) +const flaked = ref(true) +const woshia = ref(true) +const woshic = ref(true) +const dalipiana = ref(true) +const dalipianb = ref(true) +const shangpian = ref(true) +const xiapian1 = ref(true) +const xiapian2 = ref(true) +const xiapian3 = ref(true) +const xiapian4 = ref(true) +const xiapian5 = ref(true) +const xiapian6 = ref(true) const thisProcess = ref(); // 鐢ㄤ簬瀛樺偍process_id鐨勫搷搴斿紡寮曠敤 // 瀹氫箟涓�涓搷搴斿紡寮曠敤鏉ュ瓨鍌ㄥ浘琛ㄥ疄渚� @@ -209,50 +224,50 @@ } const socketUrl2 = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingIsRun`; const handleMessage2 = (data) => { - const tasks = data.temperingTaskType[0]; - if (tasks && tasks.length >= 4) { - flake.value = tasks[0].state === 1; - flakeb.value = tasks[1].state === 2; - flakec.value = tasks[2].state === 3; - flaked.value = tasks[3].state === 4; - } + // const tasks = data.temperingTaskType[0]; + // if (tasks && tasks.length >= 4) { + // flake.value = tasks[0].state === 1; + // flakeb.value = tasks[1].state === 2; + // flakec.value = tasks[2].state === 3; + // flaked.value = tasks[3].state === 4; + // } }; // 鍗у紡鐞嗙墖 const socketUrl3 = `ws://${WebSocketHost}:${host}/api/cacheGlass/api/talk/cacheGlassIsRun`; const handleMessage3 = (data) => { - const tasks = data.taskCaches[0]; - woshia.value = tasks.some(task => task.line == 2001); - woshic.value = tasks.some(task => task.line == 2002); - console.log(tasks); + // const tasks = data.taskCaches[0]; + // woshia.value = tasks.some(task => task.line == 2001); + // woshic.value = tasks.some(task => task.line == 2002); + // console.log(tasks); }; // 澶х悊鐗囩 const socketUrl4 = `ws://${WebSocketHost}:${host}/api/cacheVerticalGlass/api/talk/isRun`; const handleMessage4 = (data) => { - const tasks = data.bigStorageCageDetailsOutTask[0]; - const taskss = data.bigStorageCageDetailsFeedTask[0]; - dalipiana.value = tasks.some(task => task.slot !== null && task.slot !== undefined); -dalipianb.value = taskss.some(task => task.slot !== null && task.slot !== undefined); +// const tasks = data.bigStorageCageDetailsOutTask[0]; +// const taskss = data.bigStorageCageDetailsFeedTask[0]; +// dalipiana.value = tasks.some(task => task.slot !== null && task.slot !== undefined); +// dalipianb.value = taskss.some(task => task.slot !== null && task.slot !== undefined); }; // 涓婄墖 const socketUrl5 = `ws://${WebSocketHost}:${host}/api/loadGlass/api/talk/loadGlassIsRun`; const handleMessage5 = (data) => { - if(data.engineering.length !==0 ){ - shangpian.value = true; -} +// if(data.engineering.length !==0 ){ +// shangpian.value = true; +// } }; // 涓嬬墖 const socketUrl6 = `ws://${WebSocketHost}:${host}/api/unLoadGlass/api/talk/unLoadGlassIsRun`; const handleMessage6 = (data) => { const tasks = data.downWorkstation[0]; - if (tasks && tasks.length >= 6) { - xiapian1.value = tasks[0].racksNumber !== 0; - xiapian2.value = tasks[1].racksNumber !== 0; - xiapian3.value = tasks[2].racksNumber !== 0; - xiapian4.value = tasks[3].racksNumber !== 0; - xiapian5.value = tasks[4].racksNumber !== 0; - xiapian6.value = tasks[5].racksNumber !== 0; - } + // if (tasks && tasks.length >= 6) { + // xiapian1.value = tasks[0].racksNumber !== 0; + // xiapian2.value = tasks[1].racksNumber !== 0; + // xiapian3.value = tasks[2].racksNumber !== 0; + // xiapian4.value = tasks[3].racksNumber !== 0; + // xiapian5.value = tasks[4].racksNumber !== 0; + // xiapian6.value = tasks[5].racksNumber !== 0; + // } }; const renderPieCharts = () => { processesData.value.forEach((data, index) => { @@ -296,34 +311,6 @@ chart.setOption(options); }); }; - - -// onUnmounted(() => { -// socket.close(); -// socket2.close(); -// }); -// onMounted(() => { -// socket = initializeWebSocket(socketUrl, handleMessage); -// // socket = new WebSocket(socketUrl); -// socket.onmessage = (event) => { -// const data = JSON.parse(event.data); -// processesData.value = data.device[0].map(rect => ({ -// ...rect, -// completedQuantity: rect.completedQuantity, -// breakageQuantity: rect.breakageQuantity, -// thisProcess: rect.thisProcess, -// })); -// renderPieCharts(); -// console.log(processesData.value); -// // updateCharts(); -// socket2 = initializeWebSocket(socketUrl2, handleMessage2); -// // socket2 = new WebSocket(socketUrl2); -// // socket2.onmessage = (event) => { -// // const data = JSON.parse(event.data); -// // handleMessage2(data); -// // }; -// }; -// }); onMounted(() => { socket = initializeWebSocket(socketUrl, handleMessage); socket2 = initializeWebSocket(socketUrl2, handleMessage2); @@ -370,7 +357,7 @@ gap: 20px; } .echarts-item { -width: 150px; +width: 120px; height: 150px; margin: 20px; } @@ -386,74 +373,74 @@ #overlay{ position: absolute; z-index: 1; - width: 29px; + width: 36px; height: 10px; background-color: #529b2e; margin-top: -34px; - margin-left: -8px; + margin-left: -2px; } #overlayb{ position: absolute; z-index: 1; - width: 15px; + width: 17px; height: 115px; background-color: #529b2e; margin-top: -197px; - margin-left: -3px; + margin-left:4px; } #overlayc{ position: absolute; z-index: 1; - width: 14px; + width: 16px; height: 16px; background-color: #529b2e; margin-top: -243px; - margin-left: -2px; + margin-left: 5px; } #overlayd{ position: absolute; z-index: 1; - width: 28px; - height: 11px; + width: 37px; + height: 10px; background-color: #529b2e; - margin-top: -239px; - margin-left: 40px; + margin-top: -238px; + margin-left: 70px; } #lipiana{ position: absolute; z-index: 1; - width: 65px; + width: 100px; height: 10px; background-color: #529b2e; margin-top: -57px; - margin-left: 240px; + margin-left: 365px; } #lipianb{ position: absolute; z-index: 1; - width: 16px; + width: 20px; height: 10px; background-color: #529b2e; margin-top: -72px; - margin-left: 323px; + margin-left: 492px; } #lipianc{ position: absolute; z-index: 1; - width: 65px; + width: 100px; height: 10px; background-color: #529b2e; margin-top: -32px; - margin-left: 270px; + margin-left: 410px; } #lipiand{ position: absolute; z-index: 1; - width: 21px; + width: 30px; height: 10px; background-color: #529b2e; - margin-top: -48px; - margin-left: 354px; + margin-top: -47px; + margin-left: 539px; } #longa{ position: absolute; -- Gitblit v1.8.0