| | |
| | | const adjustedRects2 = ref([]); |
| | | const adjustedRectsa = ref([]); |
| | | const adjustedRectsb = ref([]); |
| | | const currentPage = ref<number>(1); |
| | | const tableData = ref([]) |
| | | const engineerId = ref('') |
| | | const router = useRouter() |
| | |
| | | // 例如,可以添加一个隐藏的打印样式表 |
| | | window.print(); |
| | | }; |
| | | // 方法定义 |
| | | function handlePageChange(page: number) { |
| | | currentPage.value = page; |
| | | console.log(page); |
| | | |
| | | } |
| | | const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingGlass`; |
| | | const handleMessage = (data) => { |
| | | // 进炉中右 |
| | | // if (data.intoGlass2 && data.intoGlass2.length > 0) { |
| | | // 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 = 810.89/5087; |
| | | // const scaleFactorY = 430/2800; |
| | | // 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 * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 6000 - (rect.yCoordinate + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 6000 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // x: newX * scaleFactor, |
| | | // y: rect.xCoordinate * scaleFactorY, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,并保留 isActive 状态 |
| | | // adjustedRects2.value = existingRects.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | | // } |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,但保留在newGlassIds中,则保留原样 |
| | | // }).concat(newRects.filter(r => !existingRects.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | 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; |
| | | const scaleFactorY = 430/2800; |
| | | let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta; |
| | | let newX = rect.yCoordinate; |
| | | const scaleFactor = 1621.78/6000; |
| | | const scaleFactorY = 700/2800; |
| | | let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | let newX = rect.yCoordinate; |
| | | if (rect.width < rect.height) { |
| | | widtha = rect.height; |
| | | heighta = rect.width; |
| | |
| | | widtha = rect.width; |
| | | heighta = rect.height; |
| | | } |
| | | if (rect.angle === 0) { |
| | | adjustedWidth = widtha * scaleFactor; |
| | | if (rect.angle === 0) { |
| | | adjustedWidth = widtha * scaleFactor; |
| | | adjustedHeight = heighta * scaleFactorY; |
| | | // adjustedWidtha = widtha; |
| | | // adjustedHeighta = heighta; |
| | | newX = 5087 - (rect.yCoordinate + widtha); |
| | | // adjustedHeighta = heighta; |
| | | newX = 6000 - (rect.yCoordinate + widtha); |
| | | } else { |
| | | adjustedWidth = heighta * scaleFactor; |
| | | adjustedHeight = widtha * scaleFactorY; |
| | | // adjustedWidtha = widtha; |
| | | // adjustedHeighta = heighta; |
| | | newX = 5087 - (rect.yCoordinate + heighta); |
| | | } |
| | | return { |
| | | ...rect, |
| | | xcoordinate: newX * scaleFactor, |
| | | ycoordinate: rect.xCoordinate * scaleFactorY, |
| | | width: adjustedWidth, |
| | | height: adjustedHeight, |
| | | widtha: rect.width, |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | newX = 6000 - (rect.yCoordinate + heighta); |
| | | } |
| | | return { |
| | | ...rect, |
| | | x: newX * scaleFactor, |
| | | y: rect.xCoordinate * scaleFactorY, |
| | | width: adjustedWidth, |
| | | height: adjustedHeight, |
| | | widtha: rect.width, |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | // 合并新旧矩形,并保留 isActive 状态 |
| | | adjustedRects2.value = existingRects.map(oldRect => { |
| | | const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | |
| | | return oldRect; // 如果旧矩形在新数据中不存在,但保留在newGlassIds中,则保留原样 |
| | | }).concat(newRects.filter(r => !existingRects.some(o => o.glassId === r.glassId))); |
| | | } |
| | | else if (data.intoGlass2 == null) { |
| | | adjustedRects2.value = [] |
| | | } |
| | | // 进炉中左 |
| | | // if (data.intoGlass && data.intoGlass.length > 0) { |
| | | // 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 = 810.89/5087; |
| | | // const scaleFactorY = 430/2800; |
| | | // let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | // let newX = rect.yCoordinate; |
| | | // 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; |
| | | // const scaleFactorY = 430/2800; |
| | | // let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta; |
| | | // let newX = rect.yCoordinate; |
| | | // if (rect.width < rect.height) { |
| | | // widtha = rect.height; |
| | | // heighta = rect.width; |
| | |
| | | // widtha = rect.width; |
| | | // heighta = rect.height; |
| | | // } |
| | | // if (rect.angle === 0) { |
| | | // adjustedWidth = widtha * scaleFactor; |
| | | // if (rect.angle === 0) { |
| | | // adjustedWidth = widtha * scaleFactor; |
| | | // adjustedHeight = heighta * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 6000 - (rect.yCoordinate + widtha); |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 6000 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // x: newX * scaleFactor, |
| | | // y: rect.xCoordinate * scaleFactorY, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // newX = 5087 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // xcoordinate: newX * scaleFactor, |
| | | // ycoordinate: rect.xCoordinate * scaleFactorY, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,并保留 isActive 状态 |
| | | // adjustedRects1.value = existingRects.map(oldRect => { |
| | | // adjustedRects2.value = existingRects.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,但保留在newGlassIds中,则保留原样 |
| | | // }).concat(newRects.filter(r => !existingRects.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | if (data.intoGlass && data.intoGlass.length > 0) { |
| | | console.log(data.intoGlass); |
| | | |
| | | 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 = 810.89/5087; |
| | | const scaleFactorY = 430/2800; |
| | | let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta; |
| | | let newX = rect.yCoordinate; |
| | | else if (data.intoGlass2 == null) { |
| | | adjustedRects2.value = [] |
| | | } |
| | | // 进炉中左 |
| | | if (data.intoGlass && data.intoGlass.length > 0) { |
| | | 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 = 1621.78/6000; |
| | | const scaleFactorY = 700/2800; |
| | | let adjustedWidth, adjustedHeight, adjustedWidtha, adjustedHeighta,widtha,heighta;; |
| | | let newX = rect.yCoordinate; |
| | | if (rect.width < rect.height) { |
| | | widtha = rect.height; |
| | | heighta = rect.width; |
| | |
| | | widtha = rect.width; |
| | | heighta = rect.height; |
| | | } |
| | | if (rect.angle === 0) { |
| | | adjustedWidth = widtha * scaleFactor; |
| | | if (rect.angle === 0) { |
| | | adjustedWidth = widtha * scaleFactor; |
| | | adjustedHeight = heighta * scaleFactorY; |
| | | // adjustedWidtha = widtha; |
| | | // adjustedHeighta = heighta; |
| | | newX = 5087 - (rect.yCoordinate + widtha); |
| | | newX = 6000 - (rect.yCoordinate + widtha); |
| | | } else { |
| | | adjustedWidth = heighta * scaleFactor; |
| | | adjustedHeight = widtha * scaleFactorY; |
| | | // adjustedWidtha = widtha; |
| | | // adjustedHeighta = heighta; |
| | | newX = 5087 - (rect.yCoordinate + heighta); |
| | | } |
| | | return { |
| | | ...rect, |
| | | xcoordinate: newX * scaleFactor, |
| | | ycoordinate: rect.xCoordinate * scaleFactorY, |
| | | width: adjustedWidth, |
| | | height: adjustedHeight, |
| | | widtha: rect.width, |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | newX = 6000 - (rect.yCoordinate + heighta); |
| | | } |
| | | return { |
| | | ...rect, |
| | | x: newX * scaleFactor, |
| | | y: rect.xCoordinate * scaleFactorY, |
| | | width: adjustedWidth, |
| | | height: adjustedHeight, |
| | | widtha: rect.width, |
| | | heighta: rect.height, |
| | | } |
| | | }); |
| | | // 合并新旧矩形,并保留 isActive 状态 |
| | | adjustedRects1.value = existingRects.map(oldRect => { |
| | | const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | |
| | | return oldRect; // 如果旧矩形在新数据中不存在,但保留在newGlassIds中,则保留原样 |
| | | }).concat(newRects.filter(r => !existingRects.some(o => o.glassId === r.glassId))); |
| | | } |
| | | // if (data.intoGlass && data.intoGlass.length > 0) { |
| | | // console.log(data.intoGlass); |
| | | |
| | | // 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 = 810.89/5087; |
| | | // const scaleFactorY = 430/2800; |
| | | // 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 * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + widtha); |
| | | // } else { |
| | | // adjustedWidth = heighta * scaleFactor; |
| | | // adjustedHeight = widtha * scaleFactorY; |
| | | // // adjustedWidtha = widtha; |
| | | // // adjustedHeighta = heighta; |
| | | // newX = 5087 - (rect.yCoordinate + heighta); |
| | | // } |
| | | // return { |
| | | // ...rect, |
| | | // xcoordinate: newX * scaleFactor, |
| | | // ycoordinate: rect.xCoordinate * scaleFactorY, |
| | | // width: adjustedWidth, |
| | | // height: adjustedHeight, |
| | | // widtha: rect.width, |
| | | // heighta: rect.height, |
| | | // } |
| | | // }); |
| | | // // 合并新旧矩形,并保留 isActive 状态 |
| | | // adjustedRects1.value = existingRects.map(oldRect => { |
| | | // const newRect = newRects.find(r => r.glassId === oldRect.glassId); |
| | | // if (newRect) { |
| | | // return { ...oldRect, ...newRect, isActive: oldRect.isActive }; |
| | | // } |
| | | // return oldRect; // 如果旧矩形在新数据中不存在,但保留在newGlassIds中,则保留原样 |
| | | // }).concat(newRects.filter(r => !existingRects.some(o => o.glassId === r.glassId))); |
| | | // } |
| | | else { |
| | | adjustedRects1.value = [] |
| | | } |
| | |
| | | {{ $t('processCard.print') }} |
| | | </el-button> |
| | | <div v-if="dialogFormVisible"> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 600px;" |
| | | v-loading="loading"> |
| | | <div style="width: 49%;float: right;background-color: #f4f4f5;height: 430px;"> |
| | | <div v-if="adjustedRects1.length > 0"> |
| | | <!-- 进炉中右 --> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 800px;" v-loading="loading"> |
| | | <!-- <div style="width:900px;background-color: #f4f4f5;height: 420px;"> --> |
| | | <!-- <div v-if="adjustedRects1.length > 0"> --> |
| | | <div v-if="currentPage === 1 && adjustedRects1.length > 0"> |
| | | <!-- <div style="text-align: center;">炉号:{{ engineerIdDisplay }}-{{ adjustedRects[0].temperingLayoutId }}</div> --> |
| | | <div style="text-align: center;"> {{ $t('processCard.temperinglayout') }}:{{ |
| | | adjustedRects1[0].engineerId |
| | | }}-{{ adjustedRects1[0].temperingLayoutId }} |
| | | </div> |
| | | <el-scrollbar height="430px" style="background-color: #e9e9eb;"> |
| | | <el-scrollbar height="750px" style="background-color: #e9e9eb;"> |
| | | <div style="position: relative;max-width: 1400px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRects1" |
| | |
| | | @click="showDialog1(rect)" |
| | | class="rect" |
| | | :style="{ position: 'absolute', |
| | | top: `${rect.ycoordinate}px`, |
| | | left: `${rect.xcoordinate}px`, |
| | | top: `${rect.y}px`, |
| | | left: `${rect.x}px`, |
| | | width: `${rect.width}px`, |
| | | height: `${rect.height}px`, |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : getRectColor1(rect.state) }"> |
| | |
| | | </div> |
| | | </el-scrollbar> |
| | | </div> |
| | | </div> |
| | | <div style="width: 50%;float: left;background-color: #f4f4f5;height: 430px;"> |
| | | <div v-if="adjustedRects2.length > 0"> |
| | | <!-- </div> --> |
| | | <!-- 进炉中左 --> |
| | | <!-- <div style="width: 750px;float: left;background-color: #f4f4f5;height: 350px;"> --> |
| | | <!-- <div v-if="adjustedRects2.length > 0"> --> |
| | | <div v-else-if="currentPage === 2 && adjustedRects2.length > 0"> |
| | | <div style="text-align: center;"> {{ $t('processCard.temperinglayout') }}:{{ adjustedRects2[0].engineerId }}-{{ adjustedRects2[0].temperingLayoutId }} </div> |
| | | <!-- <div style="text-align: center;">炉号:{{ engineerIdDisplay2 }}-{{ adjustedRects[0].temperingLayoutId }}</div> --> |
| | | <el-scrollbar height="430px" style="background-color: #e9e9eb;"> |
| | | <el-scrollbar height="750px" style="background-color: #e9e9eb;"> |
| | | <div style="position: relative;max-width: 1400px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRects2" |
| | |
| | | @click="showDialog2(rect)" |
| | | class="rect" |
| | | :style="{ position: 'absolute', |
| | | top: `${rect.ycoordinate}px`, |
| | | left: `${rect.xcoordinate}px`, |
| | | top: `${rect.y}px`, |
| | | left: `${rect.x}px`, |
| | | width: `${rect.width}px`, |
| | | height: `${rect.height}px`, |
| | | backgroundColor: rect.isActive ? '#ADFF2F' : getRectColor2(rect.state) }"> |
| | |
| | | </div> |
| | | </el-scrollbar> |
| | | </div> |
| | | </div> |
| | | <!-- </div> --> |
| | | </el-card> |
| | | <div style="display: flex;margin-left: 40%;margin-bottom: 10px;"> |
| | | <el-pagination |
| | | size="small" |
| | | background |
| | | layout="prev, pager, next" |
| | | :total="20" |
| | | @current-change="handlePageChange" |
| | | /> |
| | | </div> |
| | | </div> |
| | | <div v-if="dialogFormVisiblea"> |
| | | <!-- 进炉前 --> |