From e76c2f36a65dfb36a6ad6a9f7db93d90d5c54b32 Mon Sep 17 00:00:00 2001
From: 肖洋 <cathay_xy@163.com>
Date: 星期六, 21 十二月 2024 09:48:11 +0800
Subject: [PATCH] 重构AgingLibrary.vue,优化设备状态管理,添加堆垛机组件,改进数据监听逻辑

---
 Code Management/WCS/WIDESEAWCS_Client/src/views/Devicestatus/Craftlibrary/AgingLibrary.vue |  206 +++++++++++++++++++++++++--------------------------
 1 files changed, 101 insertions(+), 105 deletions(-)

diff --git a/Code Management/WCS/WIDESEAWCS_Client/src/views/Devicestatus/Craftlibrary/AgingLibrary.vue b/Code Management/WCS/WIDESEAWCS_Client/src/views/Devicestatus/Craftlibrary/AgingLibrary.vue
index 47c9bd9..e5de6b4 100644
--- a/Code Management/WCS/WIDESEAWCS_Client/src/views/Devicestatus/Craftlibrary/AgingLibrary.vue
+++ b/Code Management/WCS/WIDESEAWCS_Client/src/views/Devicestatus/Craftlibrary/AgingLibrary.vue
@@ -1,106 +1,102 @@
 <template>
-  <div>
-    <div>
-      <div class="Stackerbox">
-        <div class="card">
-          <div class="card-header">
-            <div>
-              <div class="card-body Stacker">
-                {{ StackerOne.deviceName }}
-              </div>
-            </div>
-          </div>
-          <div class="card-body">
-            <ul class="list-group">
-              <li class="list-group-item list-group-item-secondary">
-                浠诲姟鍙凤細{{ StackerOne.data.currentTaskNum || '鏆傛棤浠诲姟鍙�' }}
-              </li>
-              <li :class="getStatusClass(StackerOne.data.stackerCraneAutoStatusDes)">
-                宸ヤ綔妯″紡锛歿{ StackerOne.data.stackerCraneAutoStatusDes }}
-              </li>
-              <li :class="getStatusClass(StackerOne.data.stackerCraneStatusDes)">
-                璁惧鐘舵�侊細{{ StackerOne.data.stackerCraneStatusDes }}
-              </li>
-              <li :class="getStatusClass(StackerOne.data.stackerCraneWorkStatusDes)">
-                宸ヤ綔鐘舵�侊細{{ StackerOne.data.stackerCraneWorkStatusDes }}
-              </li>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-    <device-line v-for="device in devices" :key="device.deviceName" :device="device" />
-  </div>
-</template>
-
-<script setup>
-import { onMounted, reactive, toRefs } from "vue";
-import eventBus from "@/uitils/eventBus";
-import DeviceLine from "@/components/DeviceLine.vue";
-
-// 鍫嗗灈鏈�
-const StackerOne = reactive({
-  deviceName: "",
-  data: {
-  }
-});
-
-// 璁惧鍒楄〃锛堜慨鏀归噸澶嶈澶囧悕绉帮級
-const devices = reactive([
-  { deviceName: "闄堝寲鍑哄簱杈撻�佺嚎", data: { command: {}, commandWrite: {}, writeInteractiveSignal: [] } },
-  { deviceName: "闄堝寲鍏ュ簱杈撻�佺嚎", data: { command: {}, commandWrite: {}, writeInteractiveSignal: [] } },
-  // { deviceName: "鍫嗗灈鏈�1", data: { command: {}, commandWrite: {}, writeInteractiveSignal: [] } },
-  // Add all devices similarly...
-]);
-
-// 鑾峰彇鐘舵�佺被鍚嶏紙浼樺寲鐘舵�佸垽鏂級
-const getStatusClass = (status) => {
-  if (status === '姝e父' || status === '鑷姩' || status === '寰呮満') {
-    return 'list-group-item list-group-item-success';
-  }
-  if (status === '鏁呴殰' || status === '鍋滄満') {
-    return 'list-group-item list-group-item-danger';
-  }
-  return 'list-group-item list-group-item-warning'; // 榛樿璀﹀憡鐘舵��
-};
-
-// 鐩戝惉璁惧鏁版嵁鍙樺寲
-onMounted(() => {
-  eventBus.on('locationData', eventData => {
-    const device = devices.find(d => d.deviceName === eventData.deviceName);
-    if (device) {
-      // 浣跨敤鎵╁睍杩愮畻绗︽洿鏂板璞″睘鎬э紝淇濇寔鍝嶅簲鎬�
-      device.data = { ...device.data, ...eventData.data };
-    }
-  });
-});
-</script>
-<style scoped>
-.Stackerbox {
-  width: 220px;
-  float: left;
-}
-
-.Linebox {
-  width: 500px;
-  float: left;
-}
-
-.box1 {
-  float: left;
-}
-
-.card-body {
-  text-align: center;
-  border-radius: 6%;
-}
-
-.Stacker {
-  background-color: burlywood;
-}
-
-.lis {
-  float: left;
-  width: 233px;
-}
-</style>
\ No newline at end of file
+  <el-row>
+     <el-col :span="3">
+      
+       <device-stacker v-for="stacker in Stackers" :key="stacker.deviceName" :Stacker="stacker"></device-stacker>
+     </el-col>
+     <el-col :span="21">
+       <device-line v-for="device in devices" :key="device.deviceName" :device="device" />
+     </el-col>
+   </el-row>
+ </template>
+ 
+ <script setup>
+ import { onMounted, reactive, toRefs } from "vue";
+ import eventBus from "@/uitils/eventBus";
+ import DeviceLine from "@/components/DeviceLine.vue";
+ import DeviceStacker from "@/components/DeviceStacker.vue";
+ 
+ // 鍫嗗灈鏈�
+ const Stackers = reactive([]);
+ 
+ // 璁惧鍒楄〃锛堜慨鏀归噸澶嶈澶囧悕绉帮級
+ const devices = reactive([]);
+ 
+ const intToBitArrayFromBinaryString = (num, numBits) => {
+   let binaryString = num.toString(2).padStart(numBits, '0');
+   return Array.from({ length: numBits }, (_, index) => binaryString[index] === '1');
+ };
+ 
+ // 鐩戝惉璁惧鏁版嵁鍙樺寲
+ onMounted(() => {
+   eventBus.on('locationData', eventData => {
+     console.log(eventData)
+     if (eventData.deviceName === "闄堝寲鍏ュ簱杈撻�佺嚎"||eventData.deviceName === "闄堝寲鍏ュ簱杈撻�佺嚎") {
+ 
+       if (devices.length <= 0) {
+         devices.push({ deviceName: eventData.deviceName, data: eventData.data, childDeviceCode: eventData.childDeviceCode });
+       }
+       else {
+         const device = devices.find(c => c.childDeviceCode == eventData.childDeviceCode)
+         if (device) {
+           const number = eventData.data.commandWrite.writeInteractiveSignal;
+           const writeInteractiveSignal = intToBitArrayFromBinaryString(number, 8)
+           eventData.data.writeInteractiveSignal = writeInteractiveSignal;
+           device.data = eventData.data
+         }
+         else {
+           const number = eventData.data.commandWrite.writeInteractiveSignal;
+           const writeInteractiveSignal = intToBitArrayFromBinaryString(number, 8)
+           eventData.data.writeInteractiveSignal = writeInteractiveSignal;
+           devices.push({ deviceName: eventData.deviceName, data: eventData.data, childDeviceCode: eventData.childDeviceCode });
+         }
+       }
+     }
+   });
+   eventBus.on('stackerData', eventData => {
+     if (eventData.deviceName == "闄堝寲1鍙峰爢鍨涙満"||eventData.deviceName == "闄堝寲2鍙峰爢鍨涙満") {
+       if (Stackers.length == 0) {
+         Stackers.push({ deviceName: eventData.deviceName, data: eventData.data });
+       }
+       else {
+         const Stacker = Stackers.find(c => c.deviceName == eventData.deviceName);
+         if (Stacker) {
+           Stacker.data = eventData.data
+         }
+         else {
+           Stackers.push({ deviceName: eventData.deviceName, data: eventData.data });
+         }
+       }
+     }
+   })
+ });
+ </script>
+ <style scoped>
+ .Stackerbox {
+   width: 220px;
+   float: left;
+ }
+ 
+ .Linebox {
+   width: 500px;
+   float: left;
+ }
+ 
+ .box1 {
+   float: left;
+ }
+ 
+ .card-body {
+   text-align: center;
+   border-radius: 6%;
+ }
+ 
+ .Stacker {
+   background-color: burlywood;
+ }
+ 
+ .lis {
+   float: left;
+   width: 233px;
+ }
+ </style>
\ No newline at end of file

--
Gitblit v1.9.3