| | |
| | | }; |
| | | const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingGlass`; |
| | | const handleMessage = (data) => { |
| | | // if (data.intoGlass2 && data.intoGlass2.length > 0) { |
| | | // const newRects = data.intoGlass2[0].map(rect => { |
| | | // const scaleFactor = 794.67/5087; |
| | | // let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | // let newX = rect.yCoordinate; |
| | | // 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.1; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * 0.1; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // xcoordinate: newX * scaleFactor, |
| | | // ycoordinate: rect.xCoordinate * 0.1, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,保留 isActive 状态 |
| | | // adjustedRects2.value = adjustedRects2.value.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | | // } |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,则保留原样 |
| | | // }).concat(newRects.filter(r => !adjustedRects2.value.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | // else { |
| | | // adjustedRects2.value = '' |
| | | // } |
| | | if (data.intoGlass2 && data.intoGlass2.length > 0) { |
| | | // 提取新的矩形ID |
| | | const newGlassIds = new Set(data.intoGlass2[0].map(rect => rect.glassId)); |
| | | |
| | | // 过滤出已存在的矩形 |
| | | const existingRects = adjustedRects2.value.filter(rect => newGlassIds.has(rect.glassId)); |
| | | |
| | | // 计算新的矩形 |
| | | const newRects = data.intoGlass2[0].map(rect => { |
| | | const scaleFactor = 794.67/5087; |
| | |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | |
| | | // 合并新旧矩形,并保留 isActive 状态 |
| | | adjustedRects2.value = existingRects.map(oldRect => { |
| | | const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | |
| | | else if (data.intoGlass2 == null) { |
| | | adjustedRects2.value = [] |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | // if (data.intoGlass && data.intoGlass.length > 0) { |
| | | // const newRects = data.intoGlass[0].map(rect => { |
| | | // const scaleFactor = 794.67/5087; |
| | | // let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | // let newX = rect.yCoordinate; |
| | | // 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.1; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * 0.1; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // xcoordinate: newX * scaleFactor, |
| | | // ycoordinate: rect.xCoordinate * 0.1, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,保留 isActive 状态 |
| | | // adjustedRects1.value = adjustedRects1.value.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | | // } |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,则保留原样 |
| | | // }).concat(newRects.filter(r => !adjustedRects1.value.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | // else { |
| | | // adjustedRects1.value = '' |
| | | // } |
| | | if (data.intoGlass && data.intoGlass.length > 0) { |
| | | // 提取新的矩形ID |
| | | const newGlassIds = new Set(data.intoGlass[0].map(rect => rect.glassId)); |
| | | |
| | | // 过滤出已存在的矩形 |
| | | const existingRects = adjustedRects1.value.filter(rect => newGlassIds.has(rect.glassId)); |
| | | |
| | | // 计算新的矩形 |
| | | const newRects = data.intoGlass[0].map(rect => { |
| | | const scaleFactor = 794.67/5087; |
| | |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | |
| | | // 合并新旧矩形,并保留 isActive 状态 |
| | | adjustedRects1.value = existingRects.map(oldRect => { |
| | | const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | |
| | | else if (data.overGlass == null) { |
| | | adjustedRects1.value = [] |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | // if (data.waitingGlass && data.waitingGlass.length > 0) { |
| | | // const newRects = data.waitingGlass[0].map(rect => { |
| | | // const scaleFactor = 1621.78/5190; |
| | | // let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | // let newX = rect.yCoordinate; |
| | | // 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 + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * 0.16; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5190 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // x: newX * scaleFactor, |
| | | // y: rect.xCoordinate * 0.16, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,保留 isActive 状态 |
| | | // adjustedRectsa.value = adjustedRectsa.value.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | | // } |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,则保留原样 |
| | | // }).concat(newRects.filter(r => !adjustedRectsa.value.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | // else { |
| | | // adjustedRectsa.value = '' |
| | | // } |
| | | if (data.waitingGlass && data.waitingGlass.length > 0) { |
| | | // 提取新的矩形ID |
| | | const newGlassIds = new Set(data.waitingGlass[0].map(rect => rect.glassId)); |
| | | |
| | | // 过滤出已存在的矩形 |
| | | const existingRects = adjustedRectsa.value.filter(rect => newGlassIds.has(rect.glassId)); |
| | | |
| | | // 计算新的矩形 |
| | | const newRects = data.waitingGlass[0].map(rect => { |
| | | const scaleFactor = 1621.78/5190; |
| | |
| | | widtha: rect.width, |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | |
| | | }); |
| | | // 合并新旧矩形,并保留 isActive 状态 |
| | | adjustedRectsa.value = existingRects.map(oldRect => { |
| | | const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | |
| | | if (data.outGlass && data.outGlass.length > 0) { |
| | | // 提取新的矩形ID |
| | | const newGlassIds = new Set(data.outGlass[0].map(rect => rect.glassId)); |
| | | |
| | | // 过滤出已存在的矩形 |
| | | const existingRects = adjustedRectsb.value.filter(rect => newGlassIds.has(rect.glassId)); |
| | | |
| | | // 计算新的矩形 |
| | | const newRects = data.outGlass[0].map(rect => { |
| | | const scaleFactor = 1621.78/5190; |
| | |
| | | onMounted(() => { |
| | | initializeWebSocket(socketUrl, handleMessage); |
| | | }); |
| | | function updateRectColors() { |
| | | function updateRectColorsa() { |
| | | adjustedRectsa.value.forEach(rect => { |
| | | if (rect.glassId === glassId) { |
| | | rect.state = 5; |
| | | rect.state = 8; |
| | | } |
| | | }); |
| | | } |
| | | function updateRectColorsb() { |
| | | adjustedRectsb.value.forEach(rect => { |
| | | if (rect.glassId === glassId) { |
| | | rect.state = 8; |
| | | } |
| | | }); |
| | | } |
| | | function updateRectColors1() { |
| | | adjustedRects1.value.forEach(rect => { |
| | | if (rect.glassId === glassId) { |
| | | rect.state = 8; |
| | | } |
| | | }); |
| | | } |
| | | function updateRectColors2() { |
| | | adjustedRects2.value.forEach(rect => { |
| | | if (rect.glassId === glassId) { |
| | | rect.state = 8; |
| | | } |
| | | }); |
| | | } |
| | |
| | | return '#95d475'; |
| | | case -1: |
| | | return '#CDAF95'; |
| | | case 5: |
| | | case 8: |
| | | return '#911005'; |
| | | } |
| | | } |
| | |
| | | return '#eebe77'; |
| | | case 4: |
| | | return '#CD6090'; |
| | | case 5: |
| | | case 8: |
| | | return '#911005'; |
| | | } |
| | | } |
| | |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | blind1.value = false; |
| | | updateRectColors(); |
| | | updateRectColors1(); |
| | | } else { |
| | | // 请求失败,显示错误消息 |
| | | ElMessage.error(response.message); |
| | |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | blind2.value = false; |
| | | updateRectColors(); |
| | | updateRectColors2(); |
| | | } else { |
| | | // 请求失败,显示错误消息 |
| | | ElMessage.error(response.message); |
| | |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | blinda.value = false; |
| | | updateRectColors(); |
| | | updateRectColorsa(); |
| | | } else { |
| | | // 请求失败,显示错误消息 |
| | | ElMessage.error(response.message); |
| | |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | blindb.value = false; |
| | | updateRectColors(); |
| | | updateRectColorsb(); |
| | | } else { |
| | | // 请求失败,显示错误消息 |
| | | ElMessage.error(response.message); |
| | |
| | | } |
| | | catch (error) { |
| | | // 处理错误 |
| | | console.error(error); |
| | | // console.error(error); |
| | | } |
| | | } |
| | | onBeforeUnmount(() => { |
| | |
| | | left: `${rect.xcoordinate}px`, |
| | | width: `${rect.width}px`, |
| | | height: `${rect.height}px`, |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : rect.state === 5 ? '#911005' : 'lightblue' }" |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : rect.state === 8 ? '#911005' : 'lightblue' }" |
| | | > |
| | | <div class="centered-text"> |
| | | <div style="font-size: 15px;font-weight: bold;">{{ rect.glassId }}</div> |
| | |
| | | left: `${rect.xcoordinate}px`, |
| | | width: `${rect.width}px`, |
| | | height: `${rect.height}px`, |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : rect.state === 5 ? '#911005' : 'lightblue' }" |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : rect.state === 8 ? '#911005' : 'lightblue' }" |
| | | > |
| | | <div class="centered-text"> |
| | | <div style="font-size: 15px;font-weight: bold;">{{ rect.glassId }}</div> |