Merge remote-tracking branch 'origin/master'

wu

2024-08-22 cbec6e3f120344f6f2d69808aaabb447bb52a693

 UI-Project/src/views/PurchaseReturn/purchaseStorage.vue

@@ -4,18 +4,18 @@
import {useRouter} from "vue-router"
import { ElMessage, ElMessageBox } from 'element-plus'
import request from "@/utils/request"

import { ref, onMounted, onBeforeUnmount } from 'vue';  
 
import { ref, onMounted, onBeforeUnmount,onUnmounted } from 'vue';  
import { WebSocketHost ,host} from '@/utils/constants'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
const adjustedRects = ref([]);
const currentGlassId = ref(null);
const currenttemperingFeedSequence = ref(null);

 
const dialogFormVisible = ref(true)
const dialogFormVisiblea = ref(false)
const blind = ref(false)

 
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' :{
@@ -29,62 +29,139 @@
    }
  }
}

let socket = null;
const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingGlass`; 
// 定义消息处理函数，更新 receivedData 变量
const handleMessage = (data) => {
  // 更新 tableData 的数据
  if(data.overGlass!=null){
    adjustedRects.value =  data.overGlass[0].map(rect => {  
  let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta;
      const scaleFactor =  1621.78/5190; 
      let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;
      let newX = rect.yCoordinate; 
      if (rect.angle === 0) {  
    adjustedWidth = rect.width * 0.24;  
    adjustedHeight = rect.height * 0.16;  
    adjustedWidtha = rect.width;  
    adjustedHeighta = rect.height;  
    newX = 5190 - (rect.yCoordinate + rect.width);
      
      if (rect.width < rect.height) {
        widtha = rect.height;
        heighta = rect.width;
      }else {
        widtha = rect.width;
        heighta = rect.height;
      }
    if (rect.angle === 0) {  
    adjustedWidth = widtha * scaleFactor;  
    adjustedHeight = heighta * 0.16;  
    // adjustedWidtha = widtha;  
    // adjustedHeighta = heighta;  
    // newX = 5190 - (rect.yCoordinate + rect.width); 
  } else {  
    adjustedWidth = rect.height * 0.24;  
    adjustedHeight = rect.width * 0.16;  
    adjustedWidtha = rect.height;  
    adjustedHeighta = rect.width;  
    newX = 5190 - (rect.yCoordinate + rect.height);
    adjustedWidth = heighta * scaleFactor;  
    adjustedHeight = widtha * 0.16;  
    // adjustedWidtha = heighta;  
    // adjustedHeighta = widtha;  
    // newX = 5190 - (rect.yCoordinate + rect.height);  
  }  
  return {  
    ...rect, 
    xcoordinate: newX * 0.24, 
    xcoordinate: newX * scaleFactor, 
    ycoordinate: rect.xCoordinate * 0.16,
    width: adjustedWidth,  
    height: adjustedHeight,  
    widtha: adjustedWidtha, 
    heighta: adjustedHeighta,
    widtha: rect.width, 
    heighta: rect.height,
    // isActive: false,
  };  
});
  }
};
// const handleMessage = (data) => {  
//   // 假设 data.overGlass[0] 是矩形数组  
//   const newRects = data.overGlass[0].map(newRect => ({  
//     ...newRect, 
//     const scaleFactor = 1621.78 / 5190;  
//     let widtha, heighta, adjustedWidth, adjustedHeight;  
  
//     // 交换宽度和高度（如果矩形是“横向”的）  
//     if (rect.width < rect.height) {  
//       widtha = rect.height;  
//       heighta = rect.width;  
//     } else {  
//       widtha = rect.width;  
//       heighta = rect.height;  
//     }  
  
//     // 根据角度调整宽度和高度  
//     if (rect.angle === 0) {  
//       adjustedWidth = widtha * scaleFactor;  
//       adjustedHeight = heighta * 0.16;  
//     } else {  
//       adjustedWidth = heighta * scaleFactor;  
//       adjustedHeight = widtha * 0.16;  
//     }  
  
//     // 注意：这里可能需要重新考虑 newX 的计算方式  
//     // 暂时保留为原始 yCoordinate 的处理，但通常 x 坐标不应来自 y 坐标  
//     let newX = rect.yCoordinate; // 可能是个错误，除非有特定用途  
  
//     // 返回新的矩形对象  
//     return {  
//       ...rect, // 复制原始矩形的所有属性  
//       xcoordinate: newX * scaleFactor, // 注意：这里的 newX 可能需要调整  
//       ycoordinate: rect.xCoordinate * 0.16,  
//       width: adjustedWidth,  
//       height: adjustedHeight,  
//       widtha,  
//       heighta,  
//       isActive: false, // 默认为非激活状态  
//       // 可以添加其他需要的属性  
//     }
//   }));  
  
  // 使用新数据更新 adjustedRects  
  // 注意：这里我们假设 adjustedRects.value 中的矩形也有 id 属性  
//   adjustedRects.value = adjustedRects.value.map(oldRect => {  
//     const updatedRect = newRects.find(newRect => newRect.id === oldRect.id);  
//     if (updatedRect) {  
//       // 如果找到了对应的矩形，则合并属性和保留原始激活状态（如果需要的话）  
//       // 但在这个例子中，我们总是将 isActive 设置为 false  
//       return {  
//         ...oldRect,  
//         ...updatedRect, // 合并新矩形的属性，但会覆盖 isActive  
//         isActive: false, // 总是设置为 false，除非您有更复杂的逻辑  
//       };  
//     }  
//     // 如果没有找到对应的矩形，则保留原样  
//     return oldRect;  
//   }).concat(newRects.filter(newRect => !adjustedRects.value.some(oldRect => oldRect.id === newRect.id)));  
//   // concat 用于添加那些在 adjustedRects.value 中不存在的新矩形  
// };
function updateRectColors() {  
  adjustedRectsa.value.forEach(rect => {  
  adjustedRects.value.forEach(rect => {  
    if (rect.glassId === glassId) {  
      rect.state = 5;
      rect.state = 8;
    }
  });  
}  
} 
function getRectColora(state) {  
  switch (state) { 
    case 3:  
      return '#eebe77';  
    case 4:  
      return '#CD6090';
    case 5:  
    case 8:  
      return '#911005';  
  }  
}
function showDialog(rect) {  
  rect.isActive = true; 
  currentGlassId.value = rect.glassId;  
  currenttemperingFeedSequence.value = rect.temperingFeedSequence;  
  blind.value = true;  
}  
const handleDialogClose = () => {  
  adjustedRects.value.forEach(rect => {  
    rect.isActive = false; // 关闭对话框时重置所有矩形的 isActive 状态  
  });  
}; 
// 破损
const handleDamage = async () => {
  try  {
@@ -92,7 +169,7 @@
    glassId: currentGlassId.value,
    // temperingFeedSequence: currenttemperingFeedSequence.value,
    line: 4001,
    status: 2,
    status: 8,
    workingProcedure: '钢化',
    })
    if (response.code == 200) {
@@ -110,17 +187,19 @@
  }
}
onMounted(() => {
  // fetchFlowCardId();
  // fetchTableData(); // 获取数据
  initializeWebSocket(socketUrl, handleMessage);
  socket = initializeWebSocket(socketUrl, handleMessage);
});

  onUnmounted(() => {
    if (socket) {
    closeWebSocket(socket);
    }
    });
onBeforeUnmount(() => {
  console.log("关闭了")
  closeWebSocket();
});
</script>

 
<template>
  <div style="margin-top: 10px;">
<div>
@@ -137,7 +216,8 @@
      class="rect"  
      :style="{ position: 'absolute',  top: `${rect.ycoordinate}px`, left: `${rect.xcoordinate}px`,
       width: `${rect.width}px`, height: `${rect.height}px`,
      backgroundColor: getRectColora(rect.state) }">
      backgroundColor: rect.isActive ? '#ADFF2F' : getRectColora(rect.state) 
      }">
     <div  class="centered-text">
    <div >{{ rect.glassId }}</div>  
    <div >{{ rect.flowCardId }}</div>  
@@ -150,15 +230,15 @@
   </div>
    </el-card>
    </div>
    <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;">
    <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button type="warning" plain :icon="Delete" @click="handleDamage"  style="width: 140px;margin-left: 10px;">
          {{ $t('order.dilapidation') }}
        </el-button>
  </el-dialog> 
  </div>

 
</template>

 
<style scoped>
#boxa{
  border: 1px solid rgb(119, 116, 116);