From 06fd17d2a1c0155e6432b2bce7e644a119fc77b5 Mon Sep 17 00:00:00 2001
From: wuyouming666 <2265557248@qq.com>
Date: 星期三, 05 六月 2024 08:25:03 +0800
Subject: [PATCH] Merge branch 'master' of http://10.153.19.25:10101/r/HangZhouMes

---
 UI-Project/src/views/PurchaseReturn/purchaseReturn.vue |  201 ++++++++++++++++++++++++++++++--------------------
 1 files changed, 121 insertions(+), 80 deletions(-)

diff --git a/UI-Project/src/views/PurchaseReturn/purchaseReturn.vue b/UI-Project/src/views/PurchaseReturn/purchaseReturn.vue
index b389719..8fd42ca 100644
--- a/UI-Project/src/views/PurchaseReturn/purchaseReturn.vue
+++ b/UI-Project/src/views/PurchaseReturn/purchaseReturn.vue
@@ -3,10 +3,10 @@
 import {reactive} from "vue";
 import {useRouter} from "vue-router"
 import request from "@/utils/request"
-
-import { ref, onMounted } from 'vue';  
 // import { ref } from 'vue'
-
+import { ref, onMounted, onBeforeUnmount } from 'vue';  
+import { WebSocketHost ,host} from '@/utils/constants'
+import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
 const dialogFormVisible = ref(true)
 const dialogFormVisiblea = ref(false)
 const dialogFormVisibleb = ref(false)
@@ -16,96 +16,137 @@
 const adjustedRectsa = ref([]);
 const adjustedRectsb = ref([]);
 // 杩涚倝涓�
-onMounted(async () => {  
-  try {  
-    const response = await request.get('/temperingGlass/temperingGlassInfo/SelectIntoGlass'); 
-    if (response.code === 200) {  
-      const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
-      console.log(response.data);
-      const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
-      height.value = newheight;  
-      width.value = newwidth;  
 
-      adjustedRects.value = rawRects.map(rect => ({  
+const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingGlass`;
+// 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺
+const handleMessage = (data) => {
+  // 鏇存柊 tableData 鐨勬暟鎹�
+  adjustedRects.value =  data.intoGlass[0].map(rect => ({  
+        ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
+        xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
+        ycoordinate: rect.ycoordinate,
+        width: rect.width ,
+        height: rect.height ,
+      })); 
+      adjustedRectsa.value = data.waitingGlass[0].map(rect => ({  
         ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
         xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
         ycoordinate: rect.ycoordinate,
         width: rect.width ,
         height: rect.height ,
       }));  
-        console.log(rect);
+      
+      adjustedRectsb.value = data.outGlass[0].map(rect => ({  
+        ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
+        xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
+        ycoordinate: rect.ycoordinate,
+        width: rect.width ,
+        height: rect.height ,
+      }));  
+};
 
-      //   console.log( (rect.width*100) / 300 );
-    } else {  
-      // console.error('Failed to fetch rectangles from API.');  
-      console.error('Failed to fetch rects from API.'); 
-    }  
-  } catch (error) {  
-    // console.error('Error fetching rectangles :', error);
-    console.error('Error fetching rects :', error);  
-  }  
-}); 
+// 鍒濆鍖� WebSocket锛屽苟浼犻�掓秷鎭鐞嗗嚱鏁�
+
+onMounted(() => {
+  // fetchFlowCardId();
+  // fetchTableData(); // 鑾峰彇鏁版嵁
+  initializeWebSocket(socketUrl, handleMessage);
+});
+
+onBeforeUnmount(() => {
+  console.log("鍏抽棴浜�")
+  closeWebSocket();
+});
+// onMounted(async () => {  
+//   try {  
+//     const response = await request.get('/temperingGlass/temperingGlassInfo/SelectIntoGlass'); 
+//     if (response.code === 200) {  
+//       const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
+//       console.log(response.data);
+//       const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
+//       height.value = newheight;  
+//       width.value = newwidth;  
+
+//       adjustedRects.value = rawRects.map(rect => ({  
+//         ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
+//         xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
+//         ycoordinate: rect.ycoordinate,
+//         width: rect.width ,
+//         height: rect.height ,
+//       }));  
+//         console.log(rect);
+
+//       //   console.log( (rect.width*100) / 300 );
+//     } else {  
+//       // console.error('Failed to fetch rectangles from API.');  
+//       console.error('Failed to fetch rects from API.'); 
+//     }  
+//   } catch (error) {  
+//     // console.error('Error fetching rectangles :', error);
+//     console.error('Error fetching rects :', error);  
+//   }  
+// }); 
 // 杩涚倝鍓�
-const handleConfirm = async () => {
-  try {
-    const response = await request.post('/temperingGlass/temperingGlassInfo/SelectWaitingGlass'); 
-    if (response.code === 200) {  
-      const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
-      console.log(response.data);
-      const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
-      height.value = newheight;  
-      width.value = newwidth;  
+// const handleConfirm = async () => {
+//   try {
+//     const response = await request.post('/temperingGlass/temperingGlassInfo/SelectWaitingGlass'); 
+//     if (response.code === 200) {  
+//       const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
+//       console.log(response.data);
+//       const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
+//       height.value = newheight;  
+//       width.value = newwidth;  
 
-      adjustedRectsa.value = rawRects.map(rect => ({  
-        ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
-        xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
-        ycoordinate: rect.ycoordinate,
-        width: rect.width ,
-        height: rect.height ,
-      }));  
-        console.log(rect);
+//       adjustedRectsa.value = rawRects.map(rect => ({  
+//         ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
+//         xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
+//         ycoordinate: rect.ycoordinate,
+//         width: rect.width ,
+//         height: rect.height ,
+//       }));  
+//         console.log(rect);
 
-      //   console.log( (rect.width*100) / 300 );
-    } else {  
-      // console.error('Failed to fetch rectangles from API.');  
-      console.error('Failed to fetch rects from API.'); 
-    }  
-  } catch (error) {  
-    // console.error('Error fetching rectangles :', error);
-    console.error('Error fetching rects :', error);  
-  }  
-}; 
+//       //   console.log( (rect.width*100) / 300 );
+//     } else {  
+//       // console.error('Failed to fetch rectangles from API.');  
+//       console.error('Failed to fetch rects from API.'); 
+//     }  
+//   } catch (error) {  
+//     // console.error('Error fetching rectangles :', error);
+//     console.error('Error fetching rects :', error);  
+//   }  
+// }; 
 
 // 宸插嚭鐐�
-const handleConfirma = async () => {
-  try {
-    const response = await request.get('/temperingGlass/temperingGlassInfo/SelectOutGlass'); 
-    if (response.code === 200) {  
-      const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
-      console.log(response.data);
-      const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
-      height.value = newheight;  
-      width.value = newwidth;  
+// const handleConfirma = async () => {
+//   try {
+//     const response = await request.get('/temperingGlass/temperingGlassInfo/SelectOutGlass'); 
+//     if (response.code === 200) {  
+//       const rawRects = response.data; // 璁剧疆鐭╁舰鏁版嵁  
+//       console.log(response.data);
+//       const { height: newheight,width: newwidth  } = response.data; // 鑾峰彇灏哄  
+//       height.value = newheight;  
+//       width.value = newwidth;  
 
-      adjustedRectsb.value = rawRects.map(rect => ({  
-        ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
-        xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
-        ycoordinate: rect.ycoordinate,
-        width: rect.width ,
-        height: rect.height ,
-      }));  
-        console.log(rect);
+//       adjustedRectsb.value = rawRects.map(rect => ({  
+//         ...rect, // 澶嶅埗鍘熷瀵硅薄鐨勫叾浠栧睘鎬�  
+//         xcoordinate: rect.xcoordinate, // 灏唜鍊奸櫎浠�3  
+//         ycoordinate: rect.ycoordinate,
+//         width: rect.width ,
+//         height: rect.height ,
+//       }));  
+//         console.log(rect);
 
-      //   console.log( (rect.width*100) / 300 );
-    } else {  
-      // console.error('Failed to fetch rectangles from API.');  
-      console.error('Failed to fetch rects from API.'); 
-    }  
-  } catch (error) {  
-    // console.error('Error fetching rectangles :', error);
-    console.error('Error fetching rects :', error);  
-  }  
-}; 
+//       //   console.log( (rect.width*100) / 300 );
+//     } else {  
+//       // console.error('Failed to fetch rectangles from API.');  
+//       console.error('Failed to fetch rects from API.'); 
+//     }  
+//   } catch (error) {  
+//     // console.error('Error fetching rectangles :', error);
+//     console.error('Error fetching rects :', error);  
+//   }  
+// }; 
 const gridOptions = reactive({
   border:  "full",//琛ㄦ牸鍔犺竟妗�
   keepSource: true,//淇濇寔婧愭暟鎹�
@@ -173,7 +214,7 @@
       <el-scrollbar height="630px">
     <div  style="position: relative;width: 1400px;">  
       <div  
-      v-for="(rect, index) in adjustedRects"  
+      v-for="(rect, index) in adjustedRectsa"  
       :key="index"  
       class="rect"  
       :style="{ position: 'absolute',  top: `${rect.ycoordinate}px`, left: `${rect.xcoordinate}px`, width: `${rect.width}px`, height: `${rect.height}px`  }"  
@@ -191,7 +232,7 @@
       <el-scrollbar height="630px">
     <div  style="position: relative;width: 1400px;">  
       <div  
-      v-for="(rect, index) in adjustedRects"  
+      v-for="(rect, index) in adjustedRectsb"  
       :key="index"  
       class="rect"  
       :style="{ position: 'absolute',  top: `${rect.ycoordinate}px`, left: `${rect.xcoordinate}px`, width: `${rect.width}px`, height: `${rect.height}px`  }"  

--
Gitblit v1.8.0