| | |
| | | <script lang="ts" setup> |
| | | // import zhCn from 'element-plus/lib/locale/lang/zh-cn' |
| | | // import en from 'element-plus/dist/locale/en.mjs' |
| | | // const { locale } = useI18n() |
| | | |
| | | import { useI18n } from 'vue-i18n' |
| | | const { t } = useI18n() |
| | | let language = ref(localStorage.getItem('lang') || 'zh') |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from "vue-router" |
| | | const router = useRouter() |
| | | import request from "@/utils/request" |
| | | import { WebSocketHost ,host} from '@/utils/constants' |
| | | import { ref, onMounted , onBeforeUnmount} from "vue"; |
| | | import { ref, onMounted , onBeforeUnmount, reactive} from "vue"; |
| | | import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService'; |
| | | import { ElMessage, ElMessageBox } from 'element-plus' |
| | | import { tr } from "element-plus/es/locale"; |
| | |
| | | const tableDatab = ref([]) |
| | | const tableDatac = ref([]) |
| | | const tableDatad = ref([]) |
| | | const tableDataf = ref([]) |
| | | const tableDatae = ref([]) |
| | | const adjustedRects = ref([]); |
| | | const project = ref([]); |
| | | const adjustedRectsa = ref([]); |
| | | // const height = ref([]); |
| | | const adjustedRectsb = ref([]); |
| | | const adjustedRectsc = ref([]); |
| | | const adjustedRectsd = ref([]); |
| | | const adjustedRectse = ref([]); |
| | | const adjustedRectsf = ref([]); |
| | | const adjustedRectsg = ref([]); |
| | | const currentRow = reactive({}); // 当前行的数据 |
| | | const add = ref(false) |
| | | const flowCardId = ref(''); |
| | | const gap = ref(''); |
| | |
| | | const cell7=ref(true); |
| | | const cell8=ref(true); |
| | | const selectedRow = ref(null); // 存储选中的行数据 |
| | | |
| | | const currentPage4 = ref(4) |
| | | const pageSize4 = ref(100) |
| | | |
| | | // var timer=setInterval(() => { |
| | | // // console.log(million.value,million1.value); |
| | | // million.value+=1; |
| | | // if(million.value-million1.value!==12){ |
| | | |
| | | // if(million.value-million1.value>=2){ |
| | | // if(carposition1.value==220){ |
| | | // timers1.value=false; |
| | | // }else if(carposition1.value==60){ |
| | | // timers1.value=true; |
| | | // } |
| | | // if(timers1.value==true){ |
| | | // carposition1.value=carposition1.value+16; |
| | | // }else{ |
| | | // carposition1.value=carposition1.value-16; |
| | | // } |
| | | |
| | | |
| | | // if(carposition2.value==220){ |
| | | // timers2.value=false; |
| | | // }else if(carposition2.value==60){ |
| | | // timers2.value=true; |
| | | // } |
| | | // if(timers2.value==true){ |
| | | // carposition2.value+=16; |
| | | // }else{ |
| | | // carposition2.value-=16; |
| | | // } |
| | | // }else{ |
| | | |
| | | // } |
| | | // }else{ |
| | | // million1.value=million.value; |
| | | |
| | | // if(cellshow1.value==true){ |
| | | // cellshow1.value=false; |
| | | // }else{ |
| | | // cellshow1.value=true; |
| | | // } |
| | | // if(cellshow2.value==true){ |
| | | // cellshow2.value=false; |
| | | // }else{ |
| | | // cellshow2.value=true; |
| | | // } |
| | | // } |
| | | |
| | | // }, 1000); |
| | | |
| | | // var timer=setInterval(() => { |
| | | // // console.log(million3.value,million4.value); |
| | | // million3.value+=1; |
| | | // if(million3.value-million4.value!==12){ |
| | | |
| | | // if(million3.value-million4.value>=2){ |
| | | // if(carposition3.value==260){ |
| | | // timers3.value=false; |
| | | // }else if(carposition3.value==60){ |
| | | // timers3.value=true; |
| | | // } |
| | | // if(timers3.value==true){ |
| | | // carposition3.value=carposition3.value+20; |
| | | // }else{ |
| | | // carposition3.value=carposition3.value-20; |
| | | // } |
| | | |
| | | |
| | | // if(carposition4.value==260){ |
| | | // timers4.value=false; |
| | | // }else if(carposition4.value==60){ |
| | | // timers4.value=true; |
| | | // } |
| | | // if(timers4.value==true){ |
| | | // carposition4.value+=20; |
| | | // }else{ |
| | | // carposition4.value-=20; |
| | | // } |
| | | // }else{ |
| | | |
| | | // } |
| | | // }else{ |
| | | // million4.value=million3.value; |
| | | // if(cellshow5.value==true){ |
| | | // cellshow5.value=false; |
| | | |
| | | // }else{ |
| | | // cellshow5.value=true; |
| | | |
| | | // } |
| | | // if(cellshow3.value==true){ |
| | | // cellshow3.value=false; |
| | | // }else{ |
| | | // cellshow3.value=true; |
| | | // } |
| | | // if(cellshow4.value==true){ |
| | | // cellshow4.value=false; |
| | | // }else{ |
| | | // cellshow4.value=true; |
| | | // } |
| | | // } |
| | | |
| | | // }, 1000); |
| | | |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | |
| | | } |
| | | const handleBindRack = (row) => { |
| | | selectedRow.value = row; // 更新选中的行数据 |
| | | currentRow.deviceId = row.deviceId; // 直接设置响应式属性 |
| | | currentRow.slot = row.slot; |
| | | console.log(row.deviceId); |
| | | console.log(row.slot); |
| | | window.localStorage.setItem('deviceId', row.deviceId) |
| | | window.localStorage.setItem('slot', row.slot) |
| | | add.value = true; // 打开绑定架子对话框 |
| | | |
| | | }; |
| | | async function handleConfirm() { |
| | | if (!selectedRow.value) { |
| | | // 处理没有选中行的情况... |
| | | return; |
| | | } |
| | | |
| | | // 构造你的POST请求数据,包含选中的行数据和表单数据 |
| | | const postData = { |
| | | ...selectedRow.value, // 选中行的数据 |
| | | }; |
| | | |
| | | // 搜索 |
| | | const searchout = async () => { |
| | | try { |
| | | const response = await request.post('/cacheVerticalGlass/bigStorageCageDetails/insertBigStorageCageDetails', { |
| | | 'flowCardId': flowCardId.value, |
| | | 'gap': gap.value, |
| | | 'glassId': glassId.value, |
| | | 'glassType': glassType.value, |
| | | 'height': height.value, |
| | | 'sequence': sequence.value, |
| | | 'state': state.value, |
| | | 'temperingFeedSequence': temperingFeedSequence.value, |
| | | 'temperingLayoutId': temperingLayoutId.value, |
| | | 'thickness': thickness.value, |
| | | 'width': width.value, |
| | | body: JSON.stringify(postData), |
| | | const response = await request.post('/cacheVerticalGlass/bigStorageCageDetails/selectBigStorageCageDetails',{ |
| | | glassId:glassId.value |
| | | }); |
| | | if (response.code == 200) { |
| | | // 绑定成功,处理逻辑 |
| | | tableDataf.value = response.data; |
| | | ElMessage.success(response.message); |
| | | add.value = false; |
| | | tableData.value = response.data; |
| | | |
| | | } else { |
| | | // 请求失败,显示错误消息 |
| | | ElMessage.error(response.message); |
| | | } |
| | | } catch (error) { |
| | | // 处理错误... |
| | | console.error(error); |
| | | } |
| | | } |
| | | // 添加 |
| | | // const handleConfirm = async () => { |
| | | // try { |
| | | // const response = await request.post('/cacheVerticalGlass/bigStorageCageDetails/insertBigStorageCageDetails', { |
| | | // 'bigStorageCageOutTask.flowCardId': flowCardId.value, |
| | | // 'bigStorageCageOutTask.gap': gap.value, |
| | | // 'bigStorageCageOutTask.glassId': glassId.value, |
| | | // 'bigStorageCageOutTask.glassType': glassType.value, |
| | | // 'bigStorageCageOutTask.height': height.value, |
| | | // 'bigStorageCageOutTask.sequence': sequence.value, |
| | | // 'bigStorageCageOutTask.state': state.value, |
| | | // 'bigStorageCageOutTask.temperingFeedSequence': temperingFeedSequence.value, |
| | | // 'bigStorageCageOutTask.temperingLayoutId': temperingLayoutId.value, |
| | | // 'bigStorageCageOutTask.thickness': thickness.value, |
| | | // 'bigStorageCageOutTask.width': width.value, |
| | | // }); |
| | | // if (response.code == 200) { |
| | | // // 绑定成功,处理逻辑 |
| | | // ElMessage.success(response.message); |
| | | // add.value = false; |
| | | // tableData.value = response.data; |
| | | // } else { |
| | | // // 请求失败,显示错误消息 |
| | | // ElMessage.error(response.msg); |
| | | // } |
| | | // } catch (error) { |
| | | // // 处理错误 |
| | | // console.error(error); |
| | | // } |
| | | // }; |
| | | } catch (error) { |
| | | // 处理错误 |
| | | console.error(error); |
| | | } |
| | | }; |
| | | // 是否禁用 |
| | | const toggleEnableState = async (row) => { |
| | | const newState = row.enableState === 1 ? 0 : 1; |
| | |
| | | ElMessage.error(response.message); |
| | | } |
| | | row.enableState = newState; |
| | | }; |
| | | // const tableData = ref([ |
| | | // // ...您的表格数据 |
| | | // id: |
| | | // deviceId slot enableState remainWidth |
| | | |
| | | // ]); |
| | | }; |
| | | // 删除 |
| | | const opena = async(row) => { |
| | | try { |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // const dataToSend = { |
| | | // ...row, |
| | | // status: 0 |
| | | // }; |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | const response = await request.post("/cacheVerticalGlass/bigStorageCageDetails/damageBigStorageCageDetails?status="+0, row) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // const dataToSend = { |
| | | // ...row, |
| | | // status: 1 |
| | | // }; |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | const response = await request.post("/cacheVerticalGlass/bigStorageCageDetails/damageBigStorageCageDetails?status="+1, row) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | // const dataToSend = { |
| | | // ...row, |
| | | // status: 0 |
| | | // }; |
| | | const response = await request.post("/cacheVerticalGlass/temperingGlassInfo/damageTemperingGlassInfo?status="+0, row) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | // const dataToSend = { |
| | | // ...row, |
| | | // status: 1 |
| | | // }; |
| | | const response = await request.post("/cacheVerticalGlass/temperingGlassInfo/damageTemperingGlassInfo?status="+1, row) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | const dataToSend = { |
| | | ...row, |
| | | status: 1 |
| | |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | // 用户点击了“是”,现在调用删除接口 |
| | | // const dataToSend = { |
| | | // ...row, |
| | | // status: 1 |
| | | // }; |
| | | const response = await request.post("/cacheVerticalGlass/bigStorageCageDetails/finishBigStorageCageDetails", row) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | // 删除失败,您可以处理错误或显示错误信息给用户 |
| | | ElMessage.error(response.message); |
| | | // alert('删除失败:' + deleteResponse.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | } catch (error) { |
| | | console.error('发生错误:', error); |
| | | } |
| | | }; |
| | | // 确认添加 |
| | | const finisha = async(row) => { |
| | | try { |
| | | const confirmResult = await ElMessageBox.confirm( |
| | | t('searchOrder.sureadda'), |
| | | t('searchOrder.prompt'), |
| | | { |
| | | confirmButtonText: t('searchOrder.yes'), |
| | | cancelButtonText: t('searchOrder.cancel'), |
| | | type: 'warning', |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | let deviceId = window.localStorage.getItem('deviceId') |
| | | let slot = window.localStorage.getItem('slot') |
| | | const dataToSend = { |
| | | ...row, |
| | | deviceId: deviceId, |
| | | slot: slot |
| | | }; |
| | | const response = await request.post("/cacheVerticalGlass/bigStorageCageDetails/insertBigStorageCageDetails", dataToSend) |
| | | if (response.code === 200) { |
| | | add.value = false; |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | // 处理可能出现的错误,比如 ElMessageBox 抛出的异常等 |
| | | console.error('发生错误:', error); |
| | | } |
| | |
| | | tableDatab.value = data.temperingGlassInfoList[0] |
| | | tableDatae.value = data.bigStorageCageUsage[0] |
| | | // adjustedRects.value = data.bigStorageCageInfo1[0] |
| | | window.localStorage.setItem('length', data.bigStorageCageInfo1[0].length) |
| | | let length = window.localStorage.getItem('length') |
| | | adjustedRects.value = data.bigStorageCageInfo1[0].map(rect => ({ |
| | | ...rect, |
| | | // width: rect.remainWidth *0.04, |
| | | top: rect.id *2, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | console.log(data.bigStorageCageInfo1[0]); |
| | | let small = data.bigStorageCageInfo1[0] |
| | | console.log(small[0].bigStorageCageDetails); |
| | | adjustedRectsa.value = data.bigStorageCageInfo2[0].map(rect => ({ |
| | | ...rect, |
| | | // width: rect.remainWidth *0.04, |
| | | top: rect.id *2, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | // window.localStorage.setItem('length', data.bigStorageCageInfo1[0].length) |
| | | // let length = window.localStorage.getItem('length') |
| | | |
| | | adjustedRectsb.value = data.bigStorageCageInfo3[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | adjustedRectsc.value = data.bigStorageCageInfo4[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | adjustedRectsd.value = data.bigStorageCageInfo5[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | adjustedRectse.value = data.bigStorageCageInfo6[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | adjustedRectsf.value = data.bigStorageCageInfo7[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | adjustedRectsg.value = data.bigStorageCageInfo8[0].map(rect => ({ |
| | | ...rect, |
| | | height: 20/length, |
| | | top: 29/length |
| | | })); |
| | | }; |
| | | // function getRectHeight(length: number) { |
| | | // return length > 0 ? 29 / length : 29; |
| | | // } |
| | | // 初始化 WebSocket,并传递消息处理函数 |
| | | onMounted(() => { |
| | | // fetchFlowCardId(); |
| | |
| | | </el-col> |
| | | </div> |
| | | </div> |
| | | <!-- <div id="awatch"> |
| | | <img src="../../assets/cp.png" alt="" style="width: 70%;height: 70%;margin-left: 160px;"> |
| | | </div> --> |
| | | <!-- // 父级框 --> |
| | | <div class="img-dlpl" > |
| | | <div class="img-car1" :style="'z-index:999;left:247px;top:' + carposition1 + 'px;position:absolute;'"> |
| | |
| | | <div class="img-car4" :style="'z-index:999;left:704px;top:' + carposition4 + 'px;position:absolute;'"> |
| | | <div v-show="cellshow4" style="margin-top:10px;width:200px;height:5px;background-color:#409EFF;"></div> |
| | | </div> |
| | | <div v-show="cell1" style="width: 227px;position: relative;height: 29px;top:55px;left: 465px;background-color: #911005;"> |
| | | <div style="position: relative;"> |
| | | <div v-show="cell1" style="width: 227px;height: 29px;position: relative;top:55px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRects" |
| | | :key="rect" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | height: '0.8px', |
| | | backgroundColor: '#409EFF', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: `${rect.top}px`, |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell2" style="width: 227px;height: 29px;position: relative;top:86px;left: 465px;background-color: #911005;"> |
| | | <div v-show="cell2" style="width: 227px;height: 29px;position: relative;top:56px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsa" |
| | | :key="rect" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | height: '0.8px', |
| | | backgroundColor: '#409EFF', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: `${rect.top}px`, |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- <div v-show="cell3" style="width: 227px;height: 29px;position: absolute;top:117px;left: 465px;background-color: #409EFF;"> |
| | | <div v-show="cell3" style="width: 227px;height: 29px;position: absolute;top:117px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsb" |
| | | :key="rect.id" |
| | | :style="{ |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | <div v-show="cell4" style="width: 227px;height: 29px;position: absolute;top:148px;left: 465px;background-color: #409EFF;"> |
| | | </div> |
| | | <div v-show="cell5" style="width: 227px;height: 29px;position: absolute;top:208px;left: 465px;background-color: #409EFF;"> |
| | | <div v-show="cell4" style="width: 227px;height: 29px;position: absolute;top:148px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsc" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | <div v-show="cell6" style="width: 227px;height: 29px;position: absolute;top:238px;left: 465px;background-color: #409EFF;"> |
| | | </div> |
| | | <div v-show="cell7" style="width: 227px;height: 29px;position: absolute;top:269px;left: 465px;background-color: #409EFF;"> |
| | | <div v-show="cell5" style="width: 227px;height: 29px;position: absolute;top:208px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsd" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | <div v-show="cell8" style="width: 227px;height: 29px;position: absolute;top:300px;left: 465px;background-color: #409EFF;"> |
| | | </div> --> |
| | | </div> |
| | | <div v-show="cell6" style="width: 227px;height: 29px;position: absolute;top:238px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectse" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell7" style="width: 227px;height: 29px;position: absolute;top:269px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsf" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div v-show="cell8" style="width: 227px;height: 29px;position: absolute;top:300px;left: 465px;"> |
| | | <div |
| | | v-for="(rect, index) in adjustedRectsg" |
| | | :key="rect.id" |
| | | :style="{ |
| | | |
| | | // display:'flex', |
| | | position: 'absolute', |
| | | width: '227px', |
| | | // backgroundColor: 'red', |
| | | left: '0px', |
| | | top: index*rect.top+`px`, |
| | | height: `${rect.height}px`, |
| | | }" |
| | | > |
| | | <div |
| | | v-for="(rects, index) in rect.bigStorageCageDetails" |
| | | :key="rects" |
| | | :style="{ |
| | | float:'left', |
| | | width: '18px', |
| | | height: `${rect.height}px`, |
| | | backgroundColor: '#911005', |
| | | // border:'1px solid black', |
| | | top: '0px', |
| | | marginRight: rects.gap/5000*227+'px' |
| | | }" |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <el-dialog v-model="add" top="10vh" width="65%" :title="$t('searchOrder.addcage')" > |
| | | <div style="margin-top: -20px;margin-bottom: 40px;margin-left: 30px"> |
| | | <el-input :placeholder="$t('searchOrder.inputid')" clearable style="width: 200px;"> |
| | | </el-input> |
| | | <el-button type="primary" plain style="margin-left: 10px;">{{ $t('searchOrder.search') }}</el-button> |
| | | |
| | | <!-- <span style="margin-right: 10px">禁用词</span> |
| | | <el-input clearable placeholder="请输入禁用词" size="mini" |
| | | style="margin-right: 50px; width: 200px;" /> --> |
| | | </div> |
| | | <div style="margin-left: -50px;margin-top: 10px;margin-bottom: 10px;"> |
| | | <el-form size="mini" label-width="180px"> |
| | | <el-form label-width="180px" label-position="right"> |
| | | <el-dialog v-model="add" top="10vh" width="70%" :title="$t('searchOrder.addcage')" > |
| | | <div style="margin-bottom: 20px"> |
| | | <el-form> |
| | | <el-row style="margin-top: -15px;margin-bottom: -2px;"> |
| | | <el-col :span="6"> |
| | | <el-col :span="4"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.glassIDa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inglassID')" v-model="glassId" autocomplete="off" /> |
| | | <el-form-item :label="$t('searchOrder.tida')" style="width: 14vw"> |
| | | {{ currentRow.deviceId }} |
| | | <!-- <el-input v-model="currentRow.id" autocomplete="off"></el-input> --> |
| | | </el-form-item> |
| | | </div></div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-col :span="5"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.pieceingrida')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inpieceingrid')" v-model="sequence" autocomplete="off" /> |
| | | </el-form-item></div> |
| | | <el-form-item :label="$t('searchOrder.gridnumbera')" style="width: 14vw"> |
| | | {{ currentRow.slot }} |
| | | <!-- <el-input v-model="currentRow.slot" autocomplete="off"></el-input> --> |
| | | </el-form-item> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="margin-top: 10px;"> |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.cardnumbera')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.incardnumber')" v-model="flowCardId" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.typeglassa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.intypeglass')" v-model="glassType" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="margin-top: 10px;"> |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.widtha')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inwidth')" v-model="width" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.heighta')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inheight')" v-model="height" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="margin-top: 10px;"> |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.thicknessa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inthickness')" v-model="thickness" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.layoutIDa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inlayoutID')" v-model="temperingLayoutId" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="margin-top: 10px;"> |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.picturesequencea')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inpicturesequence')" v-model="temperingFeedSequence" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.startstatusa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.instartstatus')" v-model="state" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="margin-top: 10px;"> |
| | | <el-col :span="6"> |
| | | <div id="dt" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.glassgapsa')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.inglassgaps')" v-model="gap" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <div id="dta" style="font-size: 15px;"> |
| | | <div> |
| | | <el-form-item :label="$t('searchOrder.gridnumbera')" :required="true" style="width: 24vw;"> |
| | | <el-input :placeholder="$t('searchOrder.grid')" v-model="state" autocomplete="off" /> |
| | | </el-form-item></div></div> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </el-form> |
| | | </div> |
| | | <template #footer> |
| | | <div id="dialog-footer"> |
| | | <el-button type="primary" @click="handleConfirm"> |
| | | {{ $t('searchOrder.sure') }} |
| | | </el-button> |
| | | <el-button @click="add = false">{{ $t('searchOrder.cancel') }}</el-button> |
| | | </el-form> |
| | | </div> |
| | | <div style="margin-top: -20px;margin-bottom: 40px;margin-left: 30px"> |
| | | <el-input v-model="glassId" :placeholder="$t('searchOrder.inputid')" clearable style="width: 200px;"> |
| | | </el-input> |
| | | <el-button type="primary" plain style="margin-left: 10px;" @click="searchout">{{ $t('searchOrder.search') }}</el-button> |
| | | </div> |
| | | |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 500px;"> |
| | | <el-table height="100%" ref="table" |
| | | :data="tableDataf" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="glassId" align="center" :label="$t('searchOrder.glassID')" min-width="120" /> |
| | | <el-table-column prop="sequence" align="center" :label="$t('searchOrder.pieceingrid')" min-width="180" /> |
| | | <el-table-column prop="flowCardId" align="center" :label="$t('searchOrder.cardnumber')" min-width="150" /> |
| | | <el-table-column prop="glassType" align="center" :label="$t('searchOrder.typeglass')" min-width="150"/> |
| | | <el-table-column prop="width" align="center" :label="$t('searchOrder.width')" min-width="150"/> |
| | | <el-table-column prop="height" align="center" :label="$t('searchOrder.height')" min-width="150"/> |
| | | <el-table-column prop="thickness" align="center" :label="$t('searchOrder.thickness')" min-width="150"/> |
| | | <el-table-column prop="temperingLayoutId" align="center" :label="$t('searchOrder.layoutID')" min-width="150"/> |
| | | <el-table-column prop="temperingFeedSequence" align="center" :label="$t('searchOrder.picturesequence')" min-width="150"/> |
| | | <el-table-column |
| | | align="center" |
| | | :label="$t('searchOrder.startstatus')" |
| | | min-width="80" |
| | | prop="state" |
| | | > |
| | | <template #default="scope"> |
| | | <el-tag |
| | | :type="scope.row.state === 1 ? 'success' : 'danger'" |
| | | > |
| | | {{ scope.row.state === 1 ? $t('searchOrder.enable') : $t('searchOrder.disable') }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="gap" align="center" :label="$t('searchOrder.glassgaps')" min-width="150"/> |
| | | <!-- <el-table-column prop="slot" align="center" :label="$t('searchOrder.gridnumber')" min-width="150"/> --> |
| | | <el-table-column fixed="right" :label="$t('searchOrder.operate')" align="center" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="mini" type="text" plain @click="finisha(scope.row)">{{ $t('searchOrder.sureadd') }}</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <el-dialog v-model="dialogFormVisiblea" top="5vh" width="97%" :title="$t('searchOrder.cageinformation')"> |
| | | <el-table |
| | |
| | | |
| | | </template> |
| | | <style scoped> |
| | | |
| | | #dt { display:block; float:left;line-height: 20px;margin-left: 100px;} |
| | | #dta { display:block; float:left;line-height: 20px;margin-left: 80%;} |
| | | #dialog-footer{ |