From 17fc2a65cc8630dcaa7eea4271c6a003935ccc41 Mon Sep 17 00:00:00 2001
From: ZengTao <2773468879@qq.com>
Date: 星期四, 30 五月 2024 16:50:47 +0800
Subject: [PATCH] Merge branch 'master' of http://10.153.19.25:10101/r/HangZhouMes

---
 UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue |  136 +++++++++++++++++++++++++++++++++++++--------
 1 files changed, 111 insertions(+), 25 deletions(-)

diff --git a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
index b340c83..cf75a2e 100644
--- a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
+++ b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
@@ -22,7 +22,7 @@
               :height="rack.item.height" 
               :fill="rack.item.fillColor"
             />
-            <text :x="rack.x + rack.width / 2" :y="rack.y - 10" text-anchor="middle">{{ index + 6 }}鍙峰伐浣�</text>
+            <text :x="rack.x + rack.width / 2" :y="rack.y - 10" text-anchor="middle">{{ index + 4 }}鍙峰伐浣�</text>
             <text :x="rack.x + rack.width / 2" :y="rack.y + rack.height + 20" text-anchor="middle">{{ rack.item.content }}</text>
           </g>
         </g>
@@ -32,20 +32,29 @@
 </template>
 
 <script setup>
+import { ref, watchEffect ,onMounted} from 'vue';
+
 import Swal from 'sweetalert2'
-
-const racks = [
+import request from "@/utils/request";
+import { initializeWebSocket } from '@/utils/WebSocketService';
+ import { WebSocketHost } from '@/utils/constants';
+const racks = ref([
   { x: 50, y: 100, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 90, width: 10, fillColor: 'yellow', content: 'NG123456' } },
-  { x: 50, y: 270, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 20, width: 10, fillColor: 'yellow', content: 'NG1234567' } },
-  { x: 280, y: 100, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 30, width: 20, fillColor: 'yellow', content: 'NG12345678' } },
-  { x: 280, y: 270, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 35, width: 23, fillColor: 'yellow', content: 'NG123456910' } },
-  { x: 140, y: 420, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 30, width: 100, fillColor: 'yellow', content: 'NG1234561454' } }
-];
+ 
+  { x: 280, y: 100, height: 100, width: 60, fillColor: '#6a6da9', item: { height: 90, width: 10, fillColor: 'yellow', content: 'NG12345678' } },
+ 
+  { x: 140, y: 420, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 20, width: 100, fillColor: 'yellow', content: 'NG1234561454' } }
+  
+]);
 
+watchEffect(() => {
+  // 瑙﹀彂鏁版嵁鍙樺寲鏃堕噸鏂版覆鏌�
+});
+// 璁$畻鍏冪礌浣嶇疆鐨勫嚱鏁�
 const calculateItemXPosition = (rack, item, index) => {
-  if (index === 0 || index === 1) {
+  if (index === 0) {
     return rack.x;
-  } else if (index === 2 || index === 3) {
+  } else if (index === 1) {
     return rack.x + rack.width - item.width;
   } else {
     return rack.x + (rack.width - item.width) / 2;
@@ -53,32 +62,109 @@
 };
 
 const calculateItemYPosition = (rack, item, index) => {
-  if (index === 0 || index === 1) {
+  if (index === 0) {
     return rack.y + (rack.height - item.height) / 2;
-  } else if (index === 2 || index === 3) {
+  } else if (index === 1) {
     return rack.y + (rack.height - item.height) / 2;
   } else {
     return rack.y + rack.height - item.height;
   }
 };
 
-const showCustomAlert = (content) => {
-  var str="鏋跺彿   :      111\n" +
-    "闀�     :      111\n" +
-    "瀹�     :      111\n" +
-    "鍘�     :      111\n"+
-    "鐜荤拑ID :      111\n"+
-    "鑶滅郴   :      111\n";
 
-  Swal.fire({
-    title: '鐜荤拑淇℃伅',
-    html: '<pre>' + str + '</pre>',
-    customClass: {
-      popup: 'format-pre'
+const fetchFlowCardId = async () => {
+  try {
+    const response = await request.get('unLoadGlass/downWorkStation/getwo2');
+    
+    if (response.code === 200) {
+      console.log(response); 
+      // 閬嶅巻鍝嶅簲鏁版嵁骞舵浛鎹acks鏁扮粍涓殑item灞炴��
+      response.data.forEach((itemData, index) => {
+  if (index < racks.value.length) {
+    const rack = racks.value[index];
+    const newItem = {
+      content: itemData.item.content,
+      fillColor: itemData.item.fillColor,
+      width: itemData.item.width === 0 ? "" : 10,
+      height: itemData.item.height === 0 ? "" : 90
+    };
+
+    if (index === 2 && itemData.item.width > 0) {
+      newItem.width = 100;
+      newItem.height = 20;
     }
-  });
+
+    rack.item = newItem;
+
+    console.log(racks.value); // 鎵撳嵃鏇存柊鍚庣殑 racks 鍊�
+  }
+});
+
+
+
+      
+     
+    } else {
+      ElMessage.error(response.msg);
+    }
+  } catch (error) {
+    console.error(error);
+  }
 };
 
+const socketUrl = `ws://${WebSocketHost}:8085/api/talk/unloadglass3`;
+// 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺
+const handleMessage = (data) => {
+
+  // 鏇存柊 tableData 鐨勬暟鎹�
+
+  data.glassinfo2[0].forEach((itemData, index) => {
+  if (index < racks.value.length) {
+    const rack = racks.value[index];
+    const newItem = {
+      content: itemData.item.content,
+      fillColor: itemData.item.fillColor,
+      width: itemData.item.width === 0 ? "" : 10,
+      height: itemData.item.height === 0 ? "" : 90
+    };
+
+    if (index === 2 && itemData.item.width > 0) {
+      newItem.width = 100;
+      newItem.height = 20;
+    }
+
+    rack.item = newItem;
+
+    //console.log("鏄剧ず鍥�2",racks.value); // 鎵撳嵃鏇存柊鍚庣殑 racks 鍊�
+  }
+});
+};
+
+// 鍒濆鍖� WebSocket锛屽苟浼犻�掓秷鎭鐞嗗嚱鏁�
+
+onMounted(() => {
+  fetchFlowCardId(); // 鑾峰彇鏁版嵁
+  initializeWebSocket(socketUrl, handleMessage);
+});
+
+
+// const showCustomAlert = (content) => {
+//   var str="鏋跺彿   :      111\n" +
+//     "闀�     :      111\n" +
+//     "瀹�     :      111\n" +
+//     "鍘�     :      111\n"+
+//     "鐜荤拑ID :      111\n"+
+//     "鑶滅郴   :      111\n";
+
+//   Swal.fire({
+//     title: '鐜荤拑淇℃伅',
+//     html: '<pre>' + str + '</pre>',
+//     customClass: {
+//       popup: 'format-pre'
+//     }
+//   });
+// };
+
 const showRectInfo = (rectInfo) => {
   const content = rectInfo.item.content;
   showCustomAlert(content);

--
Gitblit v1.8.0