From c567aae08ef771d0461d08bc52e593362f7fda22 Mon Sep 17 00:00:00 2001 From: wxw <Administrator@DESKTOP-5BIMHQ3> Date: 星期日, 01 九月 2024 11:59:50 +0800 Subject: [PATCH] 修改页面UI --- Web/src/views/device/deviceInfo/index.vue | 54 ++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 42 insertions(+), 12 deletions(-) diff --git a/Web/src/views/device/deviceInfo/index.vue b/Web/src/views/device/deviceInfo/index.vue index b4dd519..560f5fd 100644 --- a/Web/src/views/device/deviceInfo/index.vue +++ b/Web/src/views/device/deviceInfo/index.vue @@ -18,14 +18,14 @@ <el-collapse-item title="鍫嗗灈鏈�" name="2"> <div style="overflow-x: auto;white-space: nowrap;"> <el-card v-for="(stacker, index) in stackers" :key="index" class="box-card" shadow="hover"> - <el-switch v-model="stacker.isConn" :inactive-text="`${stacker.text}`"></el-switch> + <el-switch disabled v-model="stacker.isConn" :inactive-text="`${stacker.text}`"></el-switch> </el-card> </div> </el-collapse-item> <el-collapse-item title="杈撻�佺嚎" name="3"> <el-card v-for="(conveyor, index) in conveyors" :key="index" class="box-card" shadow="hover"> - <el-switch v-model="conveyor.isConn" :inactive-text="`${conveyor.text}`"></el-switch> + <el-switch disabled v-model="conveyor.isConn" :inactive-text="`${conveyor.text}`"></el-switch> </el-card> </el-collapse-item> </el-collapse> @@ -65,9 +65,10 @@ </template> <script lang="ts" setup> -import { ref, reactive } from 'vue'; -import { Vue2 } from 'vue-demi'; +import { ref, reactive, onMounted } from 'vue'; import { listStatus } from '/@/api/wcs/wcsPlc'; +import { signalR } from './signalR'; + const state = ref<any>({}); const stackers = ref<any>({}); @@ -80,6 +81,28 @@ conveyors.value = res.data.result.listPlc.filter(s => s.type == 1 || s.type == 4); }; handleQuery(); + +//杩炴帴signalR 鐩戝惉鍙樻洿 +onMounted(async () => { + signalR.off('PublicPlcConn'); + signalR.on('PublicPlcConn', (data: any) => { + console.log(data) + if (data.type === 0) { + // 鏇挎崲 stackers 涓殑鐩稿簲椤� + const index = stackers.value.findIndex(item => item.id === data.id); + if (index !== -1) { + stackers.value[index] = data; + } + } else if (data.type === 1 || data.type === 4) { + // 鏇挎崲 conveyors 涓殑鐩稿簲椤� + const index = conveyors.value.findIndex(item => item.id === data.id); + if (index !== -1) { + conveyors.value[index] = data; + } + } + console.log(stackers.value[0].isConn) + }); +}); const activeName = ['1', '2', '3']; const value1 = ref(false); @@ -1949,12 +1972,16 @@ .grid-container-line { display: grid; - grid-template-columns: repeat(51, 1fr); /* 鑷�傚簲鍒楀 */ - grid-template-rows: 1fr; /* 鑷�傚簲琛岄珮 */ + grid-template-columns: repeat(51, 1fr); + /* 鑷�傚簲鍒楀 */ + grid-template-rows: 1fr; + /* 鑷�傚簲琛岄珮 */ gap: 0; margin-top: 25px; - width: 100%; /* 瀹藉害鑷�傚簲 */ - height: 1fr; /* 楂樺害鑷�傚簲 */ + width: 100%; + /* 瀹藉害鑷�傚簲 */ + height: 1fr; + /* 楂樺害鑷�傚簲 */ } .grid-item-line { @@ -2016,7 +2043,6 @@ } .grid-container { - margin-top: 10px; width: 100%; display: grid; grid-template-columns: repeat(51, 1fr); @@ -2025,15 +2051,19 @@ /* 姣忚楂樺害 */ gap: 0px; /* Gap between cells */ + margin-top: -20px } .grid-item { background-color: #9c9c9c; border: 1px solid #797777; text-align: center; - line-height: 1.4vw; /* 琛岄珮 */ - width: 100%; /* 鑷�傚簲瀹藉害 */ - height: 100%; /* 鑷�傚簲楂樺害 */ + line-height: 1.4vw; + /* 琛岄珮 */ + width: 100%; + /* 鑷�傚簲瀹藉害 */ + height: 100%; + /* 鑷�傚簲楂樺害 */ color: #fff; font-size: 0.7vw; } -- Gitblit v1.8.0