From def1eb8623e1444164ae4bce9179d011a89b8c5e Mon Sep 17 00:00:00 2001 From: 严智鑫 <test> Date: 星期二, 03 十二月 2024 09:15:27 +0800 Subject: [PATCH] 现场对接批量更新 --- UI-Project/src/views/FlipSlice/flipSlice.vue | 245 +++++++++++++++++++++++++++++++++++++----------- 1 files changed, 186 insertions(+), 59 deletions(-) diff --git a/UI-Project/src/views/FlipSlice/flipSlice.vue b/UI-Project/src/views/FlipSlice/flipSlice.vue index b9b67ea..c3d5b17 100644 --- a/UI-Project/src/views/FlipSlice/flipSlice.vue +++ b/UI-Project/src/views/FlipSlice/flipSlice.vue @@ -12,22 +12,52 @@ account: '', password: '', }); +const blind = ref(false) +const errorInfo = ref(true) const loadData = ref([]); const findMachine = ref([]); -const machineId = 25;//褰撳墠椤甸潰鐨勮澶嘔D +const sendRecords = ref([]); +const downLineTask = ref([]); + +const machineId = 26;//褰撳墠椤甸潰鐨勮澶嘔D +var errorScanId; +var errorOpen=false; //浣跨敤WebSocket鏂瑰紡灞曠ず鏁版嵁 let socket = null; +let socketDownLineTask = null; const socketUrl = `ws://${WebSocketHost}:${host}/api/deviceInteraction/api/talk/flipSlice`; +const socketDownLineTaskUrl = `ws://${WebSocketHost}:${host}/api/deviceInteraction/api/talk/downLineTask`; // 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺 const handleMessage = (data) => { // 鏇存柊 tableData 鐨勬暟鎹� loadData.value = data.taskingList[0]; findMachine.value = data.machine[0]; + sendRecords.value = data.sendRecords[0].reverse(); + if(findMachine.value.remark.toString()!=errorScanId&&findMachine.value.remark.toString()!=""&&findMachine.value.remark.toString()!=undefined){ + //鏈夋暟鎹氨寮圭獥 + if(errorOpen){ + ElMessageBox.close(); + } + errorScanId=findMachine.value.remark.toString(); + errorInfoFuntion(findMachine.value.remark.toString()); + errorOpen=true; + }else if(findMachine.value.remark.toString()==""&&errorOpen){ + ElMessageBox.close(); + errorOpen=false; + } + +}; +// 瀹氫箟娑堟伅澶勭悊鍑芥暟锛屾洿鏂� receivedData 鍙橀噺 +const handleMessage2 = (data) => { + downLineTask.value = data.downLineTask[0]; // console.log(data); }; onUnmounted(() => { if (socket) { closeWebSocket(socket); + } + if (socketDownLineTask) { + closeWebSocket(socketDownLineTask); } }); onBeforeUnmount(() => { @@ -38,43 +68,30 @@ onMounted(async () => { //浣跨敤WebSocket鏂瑰紡灞曠ず鏁版嵁 socket = initializeWebSocket(socketUrl, handleMessage);// 鍒濆鍖� WebSocket锛屽苟浼犻�掓秷鎭鐞嗗嚱鏁� - - - //浣跨敤鎺ュ彛鏂瑰紡灞曠ず鏁版嵁 - //load(); + //浣跨敤WebSocket鏂瑰紡灞曠ず鏁版嵁 + socketDownLineTask = initializeWebSocket(socketDownLineTaskUrl, handleMessage2);// 鍒濆鍖� WebSocket锛屽苟浼犻�掓秷鎭鐞嗗嚱鏁� }); - -// //鑾峰彇鏁版嵁 -// const load = async() => { -// //鑾峰彇璁惧浠诲姟鏁版嵁 -// try { -// const response = await request.post('/deviceInteraction/tasking/findMachineTask', -// { -// "id": 11 -// }); // 鏇挎崲涓轰綘鐨凙PI绔偣 -// if (response.code === 200) { -// loadData.value.findTaskingData= response.data; -// } else { -// ElMessage.warning(res.msg) -// } -// } catch (error) { -// // console.error('Error fetching rects :', error); -// } -// //鑾峰彇璁惧鐘舵�� -// try { -// const response = await request.post('/deviceInteraction/machine/findMachine', -// { -// "id": 11 -// }); // 鏇挎崲涓轰綘鐨凙PI绔偣 -// if (response.code === 200) { -// findMachine.value= response.data; -// } else { -// ElMessage.warning(res.msg) -// } -// } catch (error) { -// // console.error('Error fetching rects :', error); -// } -// } +//鎶ヨ鎻愮ず +const errorInfoFuntion = async (info) => { + let infoScancode=info; + ElMessageBox.confirm( + infoScancode, + t('delivery.prompt'), + { + confirmButtonText: t('functionState.sureStart'), + cancelButtonText: t('functionState.cancel'), + type: 'warning', + } + ) + .then(() => { + }) + .catch(() => { + ElMessage({ + type: 'info', + message: t('functionState.cancel'), + }) + }) +} //淇敼宸ヤ綔鐘舵�� 銆愬け璐�/姝e湪宸ヤ綔/瀹屽伐銆� const workStatus = async (row, state) => { let url; @@ -135,6 +152,38 @@ { "id": machineId, "state": state + }).then((res) => { // 鏇挎崲涓轰綘鐨凙PI绔偣 + if (res.code === 200) { + ElMessage.success(res.message); + } else { + ElMessage.warning(res.message) + } + }) + }) + .catch(() => { + ElMessage({ + type: 'info', + message: t('functionState.cancel'), + }) + }) +} +//瀹氬埗/鏍囧噯 +const machineMode = async (mode) => { + ElMessageBox.confirm( + t('functionState.tips'), + t('delivery.prompt'), + { + confirmButtonText: t('functionState.sure'), + cancelButtonText: t('functionState.cancel'), + type: 'warning', + } + ) + .then(() => { + //涓嬬嚎鎺ュ彛 + request.post("/deviceInteraction/machine/toggleModeMachine", + { + "id": machineId, + "mode": mode }).then((res) => { // 鏇挎崲涓轰綘鐨凙PI绔偣 if (res.code === 200) { ElMessage.success(res.message); @@ -212,31 +261,90 @@ }) }) } -//涓婄嚎 -const topLine = async () => { - +const topLineShow = async () => { + blind.value = true; } - +//涓婄嚎 +const topLine = async (row) => { + ElMessageBox.confirm( + t('functionState.tips'), + t('delivery.prompt'), + { + confirmButtonText: t('functionState.sure'), + cancelButtonText: t('functionState.cancel'), + type: 'warning', + } + ) + .then(() => { + //涓婄嚎鎺ュ彛 + request.post("/deviceInteraction/tasking/glassTopLine", + { + "glassId": row.glassId, + "lineConfigurationId": machineId + }).then((res) => { // 鏇挎崲涓轰綘鐨凙PI绔偣 + if (res.code === 200) { + ElMessage.success(res.message); + } else {n + ElMessage.warning(res.message) + } + }) + }) + .catch(() => { + ElMessage({ + type: 'info', + message: t('functionState.cancel'), + }) + }) +} +const handleDialogClose = () => { + +} </script> <template> <div ref="content" style="padding:0 20px;"> <div id="div-title" style="font-size: 20px; font-weight: bold; margin:10px 0 10px 0;padding-left: 20px;"> {{ $t('machine.flipSlice') }} </div> + <el-dialog v-model="blind" top="30vh" style="text-align: center;" @close="handleDialogClose"> + <!-- 绾夸笅鐜荤拑 --> + <el-table :data="downLineTask" stripe :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129', textAlign: 'center' }" :cell-style="{ textAlign: 'center' }"> + <!-- <el-table-column type="selection" min-width="30" /> --> + <el-table-column type="index" :label="$t('glassInfo.number')" min-width="30" /> + <el-table-column prop="batchNumber" :label="$t('glassInfo.batchNumber')" /> + <el-table-column prop="taskType" :label="$t('glassInfo.taskType')" /> + <el-table-column prop="scanId" :label="$t('glassInfo.scanId')" /> + <el-table-column prop="length" :label="$t('glassInfo.length')" /> + <el-table-column prop="width" :label="$t('glassInfo.width')" /> + <el-table-column prop="thickness" :label="$t('glassInfo.thickness')" /> + <el-table-column prop="workState" :label="$t('glassInfo.workState')" /> + <el-table-column fixed="right" :label="$t('productStock.operate')" align="center" width="70"> + <template #default="scope"> + <el-button size="mini" link type="primary" plain @click="topLine(scope.row)">{{ + $t('functionState.topLine') }}</el-button> + </template> + </el-table-column> + </el-table> + </el-dialog> <hr /> <br> <div id="search"> <!-- 鍔熻兘 --> <el-button :type="(findMachine['state'] == '鏆傚仠' ? 'danger' : 'success')" id="ButtonMachineStatus" - @click="machineStatus((findMachine['state'] == '鏆傚仠' ? '寮�宸�' : '鏆傚仠'))">{{ findMachine['state'] == '寮�宸�' ? $t('functionState.start') : $t('functionState.stop') }}</el-button> - <el-button type="primary" id="ButtonTopLine" @click="topLine">{{ $t('functionState.topLine') }}</el-button> + @click="machineStatus((findMachine['state'] == '鏆傚仠' ? '寮�宸�' : '鏆傚仠'))">{{ findMachine['state'] == '寮�宸�' ? + $t('functionState.start') : $t('functionState.stop') }}</el-button> + + <el-button :type="(findMachine['mode'] == '瀹氬埗' ? 'danger' : 'success')" id="ButtonMachineMode" + @click="machineMode((findMachine['mode'] == 0 ? 1 : 0))">{{ findMachine['mode'] == 0 ? + $t('functionState.modeD') : $t('functionState.modeB') }}</el-button> + + <el-button type="primary" id="ButtonTopLine" @click="topLineShow">{{ $t('functionState.topLine') }}</el-button> <!-- <el-button type="primary" id="searchButton" @click="downLine('涓嬬嚎')">涓嬬嚎</el-button> <el-button type="primary" id="searchButton" @click="workStatus('鐮存崯')">鐮存崯</el-button> <el-button type="primary" id="searchButton" @click="workStatus('瀹屽伐')">瀹屽伐</el-button> --> </div> - <div id="main-body" style="min-height:240px;"> + <div id="main-body"> <!-- 琛ㄦ牸鍐呭 --> - <el-table :data="loadData" stripe + <el-table :data="loadData" stripe style="height:260px" :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129', textAlign: 'center' }" :cell-style="{ textAlign: 'center' }"> <!-- <el-table-column type="selection" min-width="30" /> --> @@ -244,29 +352,41 @@ <el-table-column prop="batchNumber" :label="$t('glassInfo.batchNumber')" /> <el-table-column prop="taskType" :label="$t('glassInfo.taskType')" /> <el-table-column prop="glassId" :label="$t('glassInfo.glassId')" /> + <el-table-column prop="scanId" :label="$t('glassInfo.scanId')" /> <el-table-column prop="length" :label="$t('glassInfo.length')" /> <el-table-column prop="width" :label="$t('glassInfo.width')" /> <el-table-column prop="thickness" :label="$t('glassInfo.thickness')" /> <el-table-column prop="workState" :label="$t('glassInfo.workState')" /> <el-table-column fixed="right" :label="$t('productStock.operate')" align="center" width="270"> <template #default="scope"> - <el-button size="mini" link type="primary" plain - @click="workStatus(scope.row, '閲嶅彂')">{{ $t('functionState.anew') }}</el-button> - <el-button size="mini" link type="primary" plain - @click="workStatus(scope.row, '瀹屽伐')">{{ $t('functionState.finish') }}</el-button> - <el-button size="mini" link type="primary" plain - @click="damagedTask(scope.row)">{{ $t('functionState.lose') }}</el-button> - <el-button size="mini" link type="primary" plain - @click="glassDownLine(scope.row)">{{ $t('functionState.downLine') }}</el-button> + <el-button size="mini" link type="primary" plain @click="workStatus(scope.row, '閲嶅彂')">{{ + $t('functionState.anew') }}</el-button> + <el-button size="mini" link type="primary" plain @click="workStatus(scope.row, '瀹屽伐')">{{ + $t('functionState.finish') }}</el-button> + <el-button size="mini" link type="primary" plain @click="damagedTask(scope.row)">{{ $t('functionState.lose') + }}</el-button> + <el-button size="mini" link type="primary" plain @click="glassDownLine(scope.row)">{{ + $t('functionState.downLine') }}</el-button> </template> </el-table-column> </el-table> </div> - <div id="main-body" - style="width: 70%; height: 400px;margin:20px auto;background-image: url(../../src/assets/缈荤墖鍙�.png) ;background-size: 100% 100%;"> + <div id="main-body" style="width: 100%; height: 460px;min-width: 1200px;"> + <el-image style="width: 70%;min-width: 900px; height: 460px;float: left;" src="../../src/assets/缈荤墖鍙�.png"></el-image> + <!-- <div style="width: 70%;min-width: 900px; height: 460px;background-image: url(../../src/assets/缈荤墖鍙�.png) ;background-size: 100% 100%;float: left;"> + + </div> --> + <div style="width: 30%;min-width: 300px; height: 460px;float: left;padding: 20px;;"> + <el-table :data="sendRecords" stripe + :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129', textAlign: 'center', height: '30px' }" + :cell-style="{ textAlign: 'center' }"> + <el-table-column prop="sendContent" :label="$t('glassInfo.sendContent')" /> + </el-table> + </div> + <div style="clear锛歜oth"></div> <!-- 鐢诲浘鍐呭 --> - <div :style="{ + <!-- <div :style="{ width: loadData.length > 0 ? loadData[0]['length'] + 'px' : '200px', height: loadData.length > 0 ? loadData[0]['width'] + 'px' : '100px', backgroundColor: 'red', @@ -279,7 +399,7 @@ <p v-if="loadData.length > 0"> {{ loadData[0]['length'] }} * {{ loadData[0]['width'] }} </p> - <p v-else>鏆傛棤鏁版嵁</p> <!-- 鍙�夛細鏄剧ず榛樿娑堟伅 --> + <p v-else>鏆傛棤鏁版嵁</p> </div> <div :style="{ width: loadData.length > 0 ? loadData[1]['length'] + 'px' : '200px', @@ -294,8 +414,8 @@ <p v-if="loadData.length > 0"> {{ loadData[1]['length'] }} * {{ loadData[1]['width'] }} </p> - <p v-else>鏆傛棤鏁版嵁</p> <!-- 鍙�夛細鏄剧ず榛樿娑堟伅 --> - </div> + <p v-else>鏆傛棤鏁版嵁</p> + </div> --> </div> </div> </template> @@ -330,4 +450,11 @@ border: none; cursor: pointer; } +.dotClass { + width:10px; + height:10px; + border-radius: 50%; + display: block; + margin-left: 10px; +} </style> \ No newline at end of file -- Gitblit v1.8.0