| | |
| | | $t('hellow.stoptask') |
| | | }} |
| | | </el-button> |
| | | </div> |
| | | <el-switch style="margin-top: 7px;margin-left: 10px;" v-model="ganghua" class="mb-2" :inactive-text="$t('hellow.schedulingswitch')" @change="handleChange" /> |
| | | </div> |
| | | <div style="margin-bottom: -5px;margin-left: 5px;"> |
| | | <el-form> |
| | | <el-row> |
| | |
| | | </el-form> |
| | | </div> |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;"> |
| | | <el-table height="480" ref="table" :data="tableDataa" |
| | | :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }"> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.order')" align="center"/> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.thickness')" align="center"/> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.coatingtypes')" align="center"/> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.height')" align="center"/> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.width')" align="center"/> |
| | | <el-table-column prop="layoutSequence" :label="$t('hellow.state')" align="center"/> |
| | | <el-table height="650" ref="table" :data="tableDataa" |
| | | :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"> |
| | | <el-table-column prop="flowCardId" :label="$t('hellow.flowCardId')" align="center"/> |
| | | <el-table-column prop="hollowSequence" :label="$t('hellow.order')" align="center"/> |
| | | <el-table-column prop="thickness" :label="$t('hellow.thickness')" align="center"/> |
| | | <el-table-column prop="layer" :label="$t('hellow.layer')" align="center"/> |
| | | <el-table-column prop="filmsId" :label="$t('hellow.coatingtypes')" align="center"/> |
| | | <el-table-column prop="height" :label="$t('hellow.height')" align="center"/> |
| | | <el-table-column prop="width" :label="$t('hellow.width')" align="center"/> |
| | | <el-table-column prop="state" :label="$t('hellow.state')" align="center"> |
| | | <template #default="scope"> |
| | | {{ scope.row.state == -1 ? "等待出片" : "出片完成" }} |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div style="float: right;"> |
| | | <el-pagination layout="prev, pager, next" :total="50"/> |
| | | </div> |
| | | <div style="display: flex;margin-left: 40%;margin-top: 10px;"> |
| | | <div style="margin-top: 5px;margin-right: 5px;">{{ $t('hellow.line') }}</div> |
| | | <el-pagination |
| | | background |
| | | size="large" |
| | | layout="prev, pager, next" |
| | | :total="30" |
| | | :current-page.sync="currentPage" |
| | | @current-change="handlePageChange1" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <!-- 创建任务 --> |
| | | <el-dialog v-model="dialogFormVisiblea" top="5vh" width="85%"> |
| | | <el-table ref="table" style="margin-top: 20px;height: 500px;" |
| | | :data="tableDatab" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="flowCardId" fixed align="center" :label="$t('hellow.cardnumber')" min-width="80"/> |
| | | <el-table |
| | | ref="table" |
| | | style="margin-top: 20px; height: 700px;" |
| | | :data="tableDatab" |
| | | :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }" |
| | | row-key="projectNumber" |
| | | > |
| | | <!-- <el-table-column type="expand"> --> |
| | | <el-table-column> |
| | | <template #default="props"> |
| | | <el-table :data="props.row.records" style="width: 100%"> |
| | | <el-table-column prop="layer" fixed align="center" :label="$t('hellow.layernumber')" min-width="80"/> |
| | | <el-table-column prop="thickness" align="center" :label="$t('hellow.thickness')" min-width="80"/> |
| | | <el-table-column prop="filmsId" align="center" :label="$t('hellow.coatingtypes')" min-width="80"/> |
| | | <el-table-column prop="sumCount" align="center" :label="$t('hellow.totalnumber')" min-width="80"/> |
| | | <el-table-column prop="realCount" align="center" :label="$t('hellow.realpieces')" min-width="80"/> |
| | | <el-table-column prop="patternHeight" align="center" :label="$t('hellow.pairsnumber')" min-width="80"/> |
| | | <!-- <el-table-column prop="damageCount" align="center" :label="$t('hellow.brokenpieces')" min-width="80"/> --> |
| | | <!-- <el-table-column prop="lackCount" align="center" :label="$t('hellow.missingnumber')" min-width="80"/> --> |
| | | <el-table-column fixed="right" :label="$t('hellow.operate')" align="center" width="270"> |
| | | <el-table-column prop="pairCount" align="center" :label="$t('hellow.pairsnumber')" min-width="80"/> |
| | | <el-table-column prop="damageCount" align="center" :label="$t('hellow.damagenumber')" min-width="80"/> |
| | | </el-table> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="projectNumber" fixed align="center" :label="$t('hellow.cardnumber')" min-width="20"/> |
| | | <el-table-column fixed="right" :label="$t('hellow.operate')" align="center" width="270"> |
| | | <template #default="scope"> |
| | | <el-button size="mini" type="text" plain @click="handletake(scope.row)">{{ $t('hellow.claimquest') }}</el-button> |
| | | <el-button size="mini" type="text" plain @click="handleBindRack(scope.row)">{{ |
| | |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-dialog> |
| | | </el-table> |
| | | </el-dialog> |
| | | <!-- 领取任务 --> |
| | | <el-dialog v-model="dialogFormVisiblec" top="21vh" width="40%" :title="$t('hellow.claimquest')"> |
| | | <div style="margin-left: 20px;margin-top: 10px;margin-bottom: 10px;"> |
| | |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | |
| | | <!-- 强制出片 --> |
| | | <el-dialog v-model="dialogFormVisibled" top="21vh" width="40%" :title="$t('hellow.forcedfilming')"> |
| | | <div style="margin-left: 20px;margin-top: 10px;margin-bottom: 10px;"> |
| | | <el-form size="mini" label-width="100px"> |
| | | <el-form label-width="210px" label-position="right"> |
| | | <el-form-item :label="$t('hellow.pairQuantity')" :required="true" style="width: 25vw"> |
| | | <el-input :placeholder="$t('hellow.cpairQuantity')" v-model="totalPairQuantity" autocomplete="off" /> |
| | | <el-input :placeholder="$t('hellow.cpairQuantity')" v-model="totalPairQuantitya" autocomplete="off" /> |
| | | </el-form-item> |
| | | <el-form-item :label="$t('hellow.route')" :required="true" style="width: 25vw;"> |
| | | <el-select |
| | | :placeholder="$t('hellow.croute')" |
| | | style="width: 270px" |
| | | v-model="cell"> |
| | | v-model="cella"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <!-- 缺片详情 --> |
| | | <el-dialog v-model="dialogFormVisibleb" top="7vh" width="70%" height="500"> |
| | | <div style="margin-top: -20px;text-align: center;margin-left: 400px;"> |
| | | <el-form-item :label="$t('hellow.cardnumbera')" style="width: 14vw"> |
| | | {{ currentRow.flowCardId }} |
| | | {{ currentRow.projectNumber }} |
| | | </el-form-item> |
| | | </div> |
| | | <el-table ref="table" style="margin-top: 20px;height: 400px;" |
| | |
| | | <el-table-column prop="filmsId" align="center" :label="$t('hellow.coatingtypes')" min-width="80"/> |
| | | <el-table-column prop="height" align="center" :label="$t('hellow.height')" min-width="80"/> |
| | | <el-table-column prop="width" align="center" :label="$t('hellow.width')" min-width="80"/> |
| | | <el-table-column prop="totalCount" align="center" :label="$t('hellow.totalnumber')" min-width="80"/> |
| | | <!-- <el-table-column prop="totalCount" align="center" :label="$t('hellow.totalnumber')" min-width="80"/> --> |
| | | <el-table-column prop="lackCount" align="center" :label="$t('hellow.missingnumber')" min-width="80"/> |
| | | <el-table-column prop="damageCount" align="center" :label="$t('hellow.brokenpieces')" min-width="80"/> |
| | | <!-- <el-table-column prop="damageCount" align="center" :label="$t('hellow.brokenpieces')" min-width="80"/> --> |
| | | <div style="float: right;margin-bottom: 5px;"> |
| | | <el-pagination layout="prev, pager, next" :total="50"/> |
| | | </div> |
| | | </el-table> |
| | | <div style="display: flex;margin-left: 40%;margin-top: 10px;"> |
| | | <el-pagination |
| | | background |
| | | size="large" |
| | | layout="prev, pager, next" |
| | | :total="30" |
| | | :current-page.sync="currentPage2" |
| | | @current-change="handlePageChange2" |
| | | /> |
| | | </div> |
| | | </el-dialog> |
| | | <!-- 开始任务 --> |
| | | <el-dialog v-model="blinda" top="30vh" width="25%" :title="$t('hellow.pstarttask')"> |
| | |
| | | </el-dialog> |
| | | </template> |
| | | <script setup> |
| | | import {ElMessage, ElMessageBox} from 'element-plus' |
| | | import {onBeforeUnmount, onMounted, onUnmounted, ref, reactive} from "vue"; |
| | | import {ElMessage} from 'element-plus' |
| | | import {onBeforeUnmount, onMounted, onUnmounted, ref, reactive, watch, computed} from "vue"; |
| | | import request from "@/utils/request" |
| | | import {closeWebSocket} from '@/utils/WebSocketService'; |
| | | import {host, WebSocketHost} from '@/utils/constants' |
| | | import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService'; |
| | | import {useI18n} from 'vue-i18n' |
| | | const {t} = useI18n() |
| | | const blinda = ref(false) |
| | |
| | | const tableDataa = ref([]) |
| | | const tableDatab = ref([]) |
| | | const tableDatac = ref([]) |
| | | const allData = ref({}) |
| | | const flowCard = ref('') |
| | | const cell = ref('') |
| | | const cella = ref('') |
| | | const ganghua = ref(true) |
| | | const totalPairQuantity = ref('') |
| | | const totalPairQuantitya = ref('') |
| | | const dialogFormVisiblea = ref(false) |
| | | const dialogFormVisibleb = ref(false) |
| | | const dialogFormVisiblec = ref(false) |
| | | const dialogFormVisibled = ref(false) |
| | | const currentRow = reactive({}); // 当前行的数据 |
| | | const currentPage2 = ref(1) |
| | | const currentRow = reactive({}); |
| | | const options = [ |
| | | { |
| | | value: 930, |
| | | label: 930, |
| | | label: t('hellow.line1'), |
| | | }, |
| | | { |
| | | value: 931, |
| | | label: 931, |
| | | label: t('hellow.line2'), |
| | | }, |
| | | { |
| | | value: 932, |
| | | label: 932, |
| | | label: t('hellow.line3'), |
| | | } |
| | | ] |
| | | let socket = null; |
| | | // const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/screen`; |
| | | // const handleMessage = (data) => { |
| | | // adjustedRects.value = data.device[0].map(rect => ({ |
| | | // ...rect, |
| | | // completed: rect.completedQuantity, |
| | | // breakage: rect.breakageQuantity, |
| | | // thisProcess: rect.thisProcess, |
| | | // })); |
| | | // }; |
| | | // let socket; |
| | | const socketUrl = `ws://${WebSocketHost}:${host}/api/hollowGlass/api/talk/HollowGlass`; |
| | | const currentPage = ref(parseInt(window.localStorage.getItem('currentPage')) || 1); |
| | | watch(() => currentPage.value, (newVal) => { |
| | | window.localStorage.setItem('currentPage', newVal); |
| | | }); |
| | | const currentPageKey = computed(() => `93${currentPage.value - 1}`); |
| | | const handlePageChange1 = (newPage) => { |
| | | currentPage.value = newPage; |
| | | console.log(currentPage.value); |
| | | }; |
| | | const handlePageChange2 = (newPage) => { |
| | | currentPage2.value = newPage; |
| | | console.log(currentPage2.value); |
| | | fetchFlowBind(currentRow.projectNumber, currentRow.layer, currentPage2.value); |
| | | }; |
| | | const handleMessage = (data) => { |
| | | try { |
| | | const allPageData = data; |
| | | const currentPageKeyValue = currentPageKey.value; |
| | | const currentPageData = allPageData[currentPageKeyValue]; |
| | | if (currentPageData && Array.isArray(currentPageData) && currentPageData.length > 0) { |
| | | tableDataa.value = currentPageData[0]; |
| | | } else { |
| | | console.warn('No data for the current page key:', currentPageKeyValue); |
| | | } |
| | | } catch (error) { |
| | | console.error('Error parsing WebSocket message:', error); |
| | | } |
| | | }; |
| | | onMounted(() => { |
| | | // socket = new WebSocket(socketUrl); |
| | | // socket.onmessage = (event) => { |
| | | // const data = JSON.parse(event.data); |
| | | |
| | | // // updateCharts(); |
| | | // }; |
| | | // }; |
| | | socket = initializeWebSocket(socketUrl, handleMessage); |
| | | }); |
| | | onUnmounted(() => { |
| | | if (socket) { |
| | | closeWebSocket(socket); |
| | | } |
| | | }); |
| | | // 开始任务 |
| | | const handleBinda = (row) => { |
| | |
| | | dialogFormVisiblea.value = true; |
| | | fetchFlowCardId(); |
| | | }; |
| | | // 缺片详情 |
| | | const handleBindRack = (row) => { |
| | | const { flowCardId, layer } = row; |
| | | currentRow.flowCardId = row.flowCardId; |
| | | currentPage2.value = 1; |
| | | const { projectNumber, layer } = row; |
| | | currentRow.projectNumber = row.projectNumber; |
| | | dialogFormVisibleb.value = true; |
| | | fetchFlowBind(flowCardId, layer); |
| | | fetchFlowBind(projectNumber, layer,currentPage2.value); |
| | | }; |
| | | // 领取任务 |
| | | const handletake = (row) => { |
| | | window.localStorage.setItem('flowCardId', row.flowCardId) |
| | | window.localStorage.setItem('flowCardId', row.projectNumber) |
| | | dialogFormVisiblec.value = true; |
| | | }; |
| | | // 强制出片 |
| | | const handleout = (row) => { |
| | | window.localStorage.setItem('flowCardId', row.flowCardId) |
| | | window.localStorage.setItem('flowCardId', row.projectNumber) |
| | | dialogFormVisibled.value = true; |
| | | }; |
| | | // 创建任务 |
| | | const fetchFlowCardId = async () => { |
| | | try { |
| | | const response = await request.post('/hollowGlass/hollowGlassRelationInfo/queryHollowAllFlowCard') |
| | | const response = await request.post('/hollowGlass/hollowGlassRelationInfo/queryHollowAllFlowCard'); |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | console.log(response.data.NG24111426A001); |
| | | |
| | | tableDatab.value = response.data.NG24111426A001; |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | const newData = parseData(response.data); |
| | | tableDatab.value = newData; |
| | | } else { |
| | | ElMessage.error('Failed to fetch data'); |
| | | } |
| | | } catch (error) { |
| | | console.error(error); |
| | | ElMessage.error('Error fetching data'); |
| | | } |
| | | } |
| | | // 缺片详情 |
| | | const fetchFlowBind = async (flowCardId, layer) => { |
| | | }; |
| | | const parseData = (rawData) => { |
| | | return Object.keys(rawData).map(projectNumber => ({ |
| | | projectNumber, |
| | | records: rawData[projectNumber] |
| | | })); |
| | | }; |
| | | const fetchFlowBind = async (flowCardId, layer, page) => { |
| | | try { |
| | | var url="/hollowGlass/hollowGlassRelationInfo/queryLackByFlowCard?flowCardId="+flowCardId + "&layer=" + layer; |
| | | const response = await request.post(url) |
| | | if (response.code == 200) { |
| | | tableDatac.value = response.data[page]; |
| | | ElMessage.success(response.message); |
| | | tableDatac.value = response.data; |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | } |
| | |
| | | const finishb = async () => { |
| | | let flowCardId = window.localStorage.getItem('flowCardId') |
| | | try { |
| | | var url="/hollowGlass/hollowGlassOutRelationInfo/forceOutGlass?cell="+cell.value + "&flowCardId=" + flowCardId + "&totalPairQuantity=" + totalPairQuantity.value; |
| | | var url="/hollowGlass/hollowGlassOutRelationInfo/forceOutGlass?cell="+cella.value + "&flowCardId=" + flowCardId + "&totalPairQuantity=" + totalPairQuantitya.value; |
| | | const response = await request.post(url) |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | dialogFormVisibled.value = false; |
| | | cell.value = ''; |
| | | totalPairQuantity.value = ''; |
| | | cella.value = ''; |
| | | totalPairQuantitya.value = ''; |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | } |
| | |
| | | console.error(error); |
| | | } |
| | | } |
| | | onUnmounted(() => { |
| | | socket.close(); |
| | | }); |
| | | onMounted(() => { |
| | | // fetchTableData(); |
| | | // socket = initializeWebSocket(socketUrl, handleMessage); |
| | | }); |
| | | onUnmounted(() => { |
| | | if (socket) { |
| | | closeWebSocket(socket); |
| | | // 调度 |
| | | const handleChange = async () => { |
| | | try { |
| | | const body = { |
| | | flag: ganghua.value, |
| | | }; |
| | | |
| | | var url="/hollowGlass/hollowGlassOutRelationInfo/dispatchHollowSwitch?flag="+ganghua.value; |
| | | const response = await request.post(url) |
| | | if (response.code == 200) { |
| | | ElMessage.success(response.message); |
| | | ganghua.value = response.data |
| | | }else { |
| | | ElMessage.error(response.message); |
| | | } |
| | | } |
| | | catch (error) { |
| | | console.error(error); |
| | | } |
| | | }); |
| | | } |
| | | onBeforeUnmount(() => { |
| | | console.log("关闭了") |
| | | closeWebSocket(); |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped> |
| | | #dialog-footer { |
| | | text-align: center; |