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