From b9b44b51b201e2f5a9a1f3665c7fb76b5690f9af Mon Sep 17 00:00:00 2001
From: wu <731351411@qq.com>
Date: 星期一, 23 十二月 2024 16:13:08 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue |  139 ++++++++++++++++++++++------------------------
 1 files changed, 66 insertions(+), 73 deletions(-)

diff --git a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
index cf75a2e..cd6109c 100644
--- a/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
+++ b/UI-Project/src/views/UnLoadGlass/Landingindicationtwo.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="glass-rack">
     <div >
-      <svg width="500" height="500" xmlns="http://www.w3.org/2000/svg">
+      <svg width="500" height="370" xmlns="http://www.w3.org/2000/svg">
         <g stroke="null" id="Layer_1">
           <!-- 浣跨敤 v-for 寰幆娓叉煋鏁版嵁 -->
           <g v-for="(rack, index) in racks" :key="index">
@@ -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 + 4 }}鍙峰伐浣�</text>
+            <text :x="rack.x + rack.width / 2" :y="rack.y - 10" text-anchor="middle">{{ index + 4 }}{{ $t('reportWork.workstation') }}</text>
             <text :x="rack.x + rack.width / 2" :y="rack.y + rack.height + 20" text-anchor="middle">{{ rack.item.content }}</text>
           </g>
         </g>
@@ -30,23 +30,23 @@
     </div>
   </div>
 </template>
-
 <script setup>
-import { ref, watchEffect ,onMounted} from 'vue';
-
+import { ref, watchEffect ,onMounted,onUnmounted} from 'vue';
+import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
+  let language = ref(localStorage.getItem('lang') || 'zh')
 import Swal from 'sweetalert2'
 import request from "@/utils/request";
-import { initializeWebSocket } from '@/utils/WebSocketService';
- import { WebSocketHost } from '@/utils/constants';
+import { initializeWebSocket,closeWebSocket } from '@/utils/WebSocketService';
+import { WebSocketHost ,host} 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: 140, y: 280, height: 60, width: 110, fillColor: '#6a6da9', item: { height: 20, 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(() => {
   // 瑙﹀彂鏁版嵁鍙樺寲鏃堕噸鏂版覆鏌�
 });
@@ -55,55 +55,45 @@
   if (index === 0) {
     return rack.x;
   } else if (index === 1) {
-    return rack.x + rack.width - item.width;
-  } else {
     return rack.x + (rack.width - item.width) / 2;
+  } else {
+    return rack.x + rack.width - item.width;
   }
 };
-
 const calculateItemYPosition = (rack, item, index) => {
   if (index === 0) {
     return rack.y + (rack.height - item.height) / 2;
   } else if (index === 1) {
-    return rack.y + (rack.height - item.height) / 2;
-  } else {
     return rack.y + rack.height - item.height;
+  } else {
+    return rack.y + (rack.height - item.height) / 2;
   }
 };
-
-
 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 = {
+      rack.fillColor = itemData.item.fullCardColor === 'red' ? '#911005' : '#6a6da9';
+      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) {
+    console.log(itemData.item.fullCardColor);
+    if (index === 1 && itemData.item.width > 0) {
       newItem.width = 100;
       newItem.height = 20;
     }
-
     rack.item = newItem;
-
-    console.log(racks.value); // 鎵撳嵃鏇存柊鍚庣殑 racks 鍊�
+    console.log(racks.value); 
   }
 });
-
-
-
-      
-     
     } else {
       ElMessage.error(response.msg);
     }
@@ -111,72 +101,75 @@
     console.error(error);
   }
 };
-
-const socketUrl = `ws://${WebSocketHost}:8085/api/talk/unloadglass3`;
-// 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺
+let socket = null;
+const socketUrl = `ws://${WebSocketHost}:${host}/api/unLoadGlass/api/talk/unloadglass3`;
 const handleMessage = (data) => {
-
-  // 鏇存柊 tableData 鐨勬暟鎹�
-
   data.glassinfo2[0].forEach((itemData, index) => {
   if (index < racks.value.length) {
     const rack = racks.value[index];
-    const newItem = {
+      rack.fillColor = itemData.item.fullCardColor === 'red' ? '#911005' : '#6a6da9';
+      const newItem = {
       content: itemData.item.content,
       fillColor: itemData.item.fillColor,
       width: itemData.item.width === 0 ? "" : 10,
-      height: itemData.item.height === 0 ? "" : 90
+      height: itemData.item.height === 0 ? "" : 90,
+      downGlassInfoList:itemData.item.downGlassInfoList
     };
-
-    if (index === 2 && itemData.item.width > 0) {
+    if (index === 1 && 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);
+  fetchFlowCardId();
+  socket = 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);
+  onUnmounted(() => {
+    if (socket) {
+    closeWebSocket(socket);
+    }
+    });
+const showCustomAlert = (downGlassInfoList) => {
+  let tableContent = '<table border="1" style="border-collapse: collapse; width: 100%;">';
+  tableContent += '<tr><th style="background-color: #f2f2f2;">鐜荤拑ID</th><th style="background-color: #f2f2f2;">鑶滅郴</th><th style="background-color: #f2f2f2;">鍘氬害</th><th style="background-color: #f2f2f2;">瀹藉害</th><th style="background-color: #f2f2f2;">楂樺害</th></tr>';
+  downGlassInfoList.forEach(info => {
+    tableContent += `<tr>
+      <td>${info.glassId}</td>
+      <td>${info.Filmsid}</td>
+      <td>${info.thickness}</td>
+      <td>${info.width}</td>
+      <td>${info.height}</td>
+    </tr>`;
+  });
+  tableContent += '</table>';
+  Swal.fire({
+    title: t('reportWork.glassinformation'),
+    // title: '鐜荤拑淇℃伅',
+    html: tableContent,
+    customClass: {
+      popup: 'format-pre'
+    }
+  });
 };
-
+    const showRectInfo = (rack) => {
+      const content = rack.item.content;
+      console.log(rack.item.downGlassInfoList[0].flowCardId)
+      console.log(content)
+   if(content==rack.item.downGlassInfoList[0].flowCardId){
+    const downGlassInfoList = rack.item.downGlassInfoList;
+      console.log(downGlassInfoList)
+      showCustomAlert(downGlassInfoList);
+   }
+    };
 </script>
-
 <style scoped>
 .glass-rack {
-  margin-left: 20px;
+  /* margin-left: 20px; */
   width: 500px;
-  margin-top: 10px;
+  margin-top: 5px;
 }
 .rack-rect:hover {
   cursor: pointer;

--
Gitblit v1.8.0