From 567fe4d69a58652e780a32b9d7f3234d3e3db7be Mon Sep 17 00:00:00 2001 From: ZengTao <2773468879@qq.com> Date: 星期五, 06 十二月 2024 14:07:37 +0800 Subject: [PATCH] 修改报工页面 --- UI-Project/src/views/ReportWork/reportWork.vue | 366 +++++++++++++++++++++++++++------------------------ 1 files changed, 195 insertions(+), 171 deletions(-) diff --git a/UI-Project/src/views/ReportWork/reportWork.vue b/UI-Project/src/views/ReportWork/reportWork.vue index 470e33f..244f489 100644 --- a/UI-Project/src/views/ReportWork/reportWork.vue +++ b/UI-Project/src/views/ReportWork/reportWork.vue @@ -1,136 +1,120 @@ <template> <div style="height: 600px;"> - <div style="display: flex; flex-direction: row; align-items: center; margin-top: 20px;"> - <span style="margin-left: 10px;" class="demonstration">{{ $t('reportmanage.productiontime') }}</span> - <el-date-picker style="margin-left: 10px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD" - :start-placeholder="$t('reportmanage.starttime')" :end-placeholder="$t('reportmanage.endtime')" :default-time="defaultTime" /> - <el-select v-model="report.type" :placeholder="$t('reportmanage.ctype')" style="margin-left: 10px;" > - <el-option :label="$t('reportmanage.all')" value="0"></el-option> - <el-option :label="$t('reportmanage.completed')" value="1"></el-option> - <el-option :label="$t('reportmanage.broke')" value="8"></el-option> - <el-option :label="$t('reportmanage.takeout')" value="9"></el-option> - </el-select> - <el-select v-model="report.status" :placeholder="$t('reportmanage.cstate')" style="margin-left: 10px;" > - <el-option :label="$t('reportmanage.all')" value="0"></el-option> - <el-option :label="$t('reportmanage.dreportwork')" value="1"></el-option> - <el-option :label="$t('reportmanage.pendingwork')" value="2"></el-option> - <el-option :label="$t('reportmanage.reportwork')" value="3"></el-option> - </el-select> - <el-select v-model="report.workingProcedure" :placeholder="$t('reportmanage.cprocess')" style="margin-left: 10px;" > - <el-option :label="$t('reportmanage.all')" value="0"></el-option> - <el-option :label="$t('reportmanage.incise')" value="鍒囧壊"></el-option> - <el-option :label="$t('reportmanage.edging')" value="纾ㄨ竟"></el-option> - <el-option :label="$t('reportmanage.steel')" value="閽㈠寲"></el-option> - </el-select> - <el-button type="primary" style="margin-left: 10px;" @click="selectReportData()">{{ $t('reportmanage.inquire') }}</el-button> - <el-button type="success" style="margin-left: 10px;" @click="handleConfirm">{{ $t('reportmanage.signingwork') }}</el-button> - </div> + <div style="display: flex; flex-direction: row; align-items: center; margin-top: 20px;"> + <span style="margin-left: 10px;" class="demonstration">{{ $t('reportmanage.productiontime') }}</span> + <el-date-picker style="margin-left: 10px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" + value-format="YYYY-MM-DD" :start-placeholder="$t('reportmanage.starttime')" + :end-placeholder="$t('reportmanage.endtime')" :default-time="defaultTime" /> + <el-select v-model="report.type" :placeholder="$t('reportmanage.ctype')" style="margin-left: 10px;"> + <el-option :label="$t('reportmanage.all')" value="0"></el-option> + <el-option :label="$t('reportmanage.completed')" value="1"></el-option> + <el-option :label="$t('reportmanage.broke')" value="8"></el-option> + <el-option :label="$t('reportmanage.takeout')" value="9"></el-option> + </el-select> + <el-select v-model="report.status" :placeholder="$t('reportmanage.cstate')" style="margin-left: 10px;"> + <el-option :label="$t('reportmanage.all')" value="0"></el-option> + <el-option :label="$t('reportmanage.dreportwork')" value="1"></el-option> + <!-- <el-option :label="$t('reportmanage.pendingwork')" value="2"></el-option> --> + <el-option :label="$t('reportmanage.reportwork')" value="3"></el-option> + </el-select> + <el-select v-model="report.workingProcedure" :placeholder="$t('reportmanage.cprocess')" + style="margin-left: 10px;"> + <el-option :label="$t('reportmanage.all')" value="0"></el-option> + <el-option :label="$t('reportmanage.incise')" value="鍒囧壊"></el-option> + <el-option :label="$t('reportmanage.edging')" value="纾ㄨ竟"></el-option> + <el-option :label="$t('reportmanage.steel')" value="閽㈠寲"></el-option> + </el-select> + <el-button type="primary" style="margin-left: 10px;" @click="selectReportData()">{{ $t('reportmanage.inquire') + }}</el-button> + <el-button type="success" style="margin-left: 10px;" :disabled="(!selectedStatus)" @click="handleConfirm">{{ + $t('reportmanage.signingwork') + }}</el-button> + </div> <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading"> <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;"> - <el-table height="540" ref="table" :data="reportData" - :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }"> - <el-table-column prop="teamsGroupsName" align="center" :label="$t('reportmanage.reporteam')" min-width="120" /> - <el-table-column prop="deviceName" align="center" :label="$t('reportmanage.reportingequipment')" min-width="120" /> - <el-table-column prop="line" align="center" :label="$t('reportmanage.line')" min-width="120" /> - <el-table-column prop="workingProcedure" align="center" :label="$t('reportmanage.process')" min-width="120" /> - <el-table-column prop="glassId" align="center" :label="$t('reportmanage.glassID')" min-width="130" /> - <el-table-column prop="engineerId" align="center" :label="$t('reportmanage.projectnumber')" min-width="120" /> - <el-table-column prop="temperingLayoutId" align="center" :label="$t('reportmanage.layoutID')" min-width="120" /> - <el-table-column prop="damageTime" align="center" :label="$t('reportmanage.productiontime')" min-width="230" /> - <el-table-column prop="type" align="center" :label="$t('reportmanage.type')" min-width="120" /> - <el-table-column prop="status" align="center" :label="$t('reportmanage.state')" min-width="120" /> - <el-table-column prop="processId" align="center" :label="$t('reportmanage.processcards')" min-width="140" /> - <el-table-column prop="orderNumber" align="center" :label="$t('reportmanage.number')" min-width="120" /> - <el-table-column prop="technologyNumber" align="center" :label="$t('reportmanage.layer')" min-width="120" /> - <el-table-column prop="breakageType" align="center" :label="$t('reportmanage.typebreakage')" min-width="180"> - <template #default="{ row }"> - <el-select - v-model="selectValuesa[row.id]" - filterable - :placeholder="$t('reportmanage.pcausebreakage')" - clearable - @input="handleInputChangea($event, row.id)" - > - <el-option - v-for="item in selectOptionsa" - :key="item.basicName" - :label="item.basicName" - :value="item.basicName" - /> - </el-select> - </template> - </el-table-column> - <el-table-column prop="breakageReason" align="center" :label="$t('reportmanage.causebreakage')" min-width="180"> - <template #default="{ row }"> - <el-select - v-model="selectValuesb[row.id]" - filterable - :placeholder="$t('reportmanage.ptypebreakage')" - clearable - @input="handleInputChangea($event, row.id)" - > - <el-option - v-for="item in selectOptionsb" - :key="item.basicName" - :label="item.basicName" - :value="item.basicName" - /> - </el-select> - </template> - </el-table-column> - <el-table-column align="center" :label="$t('reportmanage.responsibleprocess')" min-width="120"> - <template #default="{ row }"> - <span>{{ '鍒囧壊纾ㄨ竟閽㈠寲' }}</span> - </template> - </el-table-column> - <el-table-column prop="responsiblePersonnel" align="center" :label="$t('reportmanage.responsiblepersonnel')" min-width="180"> - <template #default="{ row }"> - <el-input :placeholder="$t('reportmanage.presponsiblepersonnel')" v-model="inputValuesa[row.id]" autocomplete="off" /> - </template> - </el-table-column> - <el-table-column prop="responsibleTeam" align="center" :label="$t('reportmanage.responsibleteam')" min-width="180"> - <template #default="{ row }"> - <el-select - v-model="selectValuesc[row.id]" - filterable - :placeholder="$t('reportmanage.presponsibleteam')" - clearable - @input="handleInputChangea($event, row.id)" - > - <el-option - v-for="item in selectOptionsc" - :key="item.basicName" - :label="item.basicName" - :value="item.basicName" - /> - </el-select> - </template> - </el-table-column> - <el-table-column prop="responsibleEquipment" align="center" :label="$t('reportmanage.responsibleequipment')" min-width="180"> - <template #default="{ row }"> - <el-select - v-model="selectValuesd[row.id]" - filterable - :placeholder="$t('reportmanage.presponsibleequipment')" - clearable - @input="handleInputChangea($event, row.id)" - > - <el-option - v-for="item in selectOptionsd" - :key="item.basicName" - :label="item.basicName" - :value="item.basicName" - /> - </el-select> - </template> - </el-table-column> - <el-table-column prop="remark" align="center" :label="$t('reportmanage.remark')" min-width="180"> - <template #default="{ row }"> - <el-input :placeholder="$t('reportmanage.premark')" v-model="inputValuesb[row.id]" autocomplete="off" /> - </template> - </el-table-column> - </el-table> - </div> + <el-table height="740" ref="table" :data="reportData" + :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }"> + <el-table-column prop="teamsGroupsName" align="center" :label="$t('reportmanage.reporteam')" + min-width="120" /> + <el-table-column prop="deviceName" align="center" :label="$t('reportmanage.reportingequipment')" + min-width="120" /> + <el-table-column prop="line" align="center" :label="$t('reportmanage.line')" min-width="120" /> + <el-table-column prop="workingProcedure" align="center" :label="$t('reportmanage.process')" min-width="120" /> + <el-table-column prop="glassId" align="center" :label="$t('reportmanage.glassID')" min-width="130" /> + <el-table-column prop="engineerId" align="center" :label="$t('reportmanage.projectnumber')" min-width="120" /> + <el-table-column prop="temperingLayoutId" align="center" :label="$t('reportmanage.layoutID')" + min-width="120" /> + <el-table-column prop="damageTime" align="center" :label="$t('reportmanage.productiontime')" + min-width="230" /> + <el-table-column prop="type" align="center" :label="$t('reportmanage.type')" min-width="120" /> + <el-table-column prop="status" align="center" :label="$t('reportmanage.state')" min-width="120" /> + <el-table-column prop="processId" align="center" :label="$t('reportmanage.processcards')" min-width="140" /> + <el-table-column prop="orderNumber" align="center" :label="$t('reportmanage.number')" min-width="120" /> + <el-table-column prop="technologyNumber" align="center" :label="$t('reportmanage.layer')" min-width="120" /> + <el-table-column prop="breakageType" align="center" :label="$t('reportmanage.typebreakage')" min-width="180"> + <template #default="{ row }"> + <el-select v-model="row.breakageType" filterable :placeholder="$t('reportmanage.pcausebreakage')" :disabled="selectedType" + clearable @input="handleInputChangea($event, row.id)"> + <el-option v-for="item in selectOptionsa" :key="item.basicName" :label="item.basicName" + :value="item.basicName" /> + </el-select> + </template> + </el-table-column> + <el-table-column prop="breakageReason" align="center" :label="$t('reportmanage.causebreakage')" + min-width="180"> + <template #default="{ row }"> + <el-select v-model="row.breakageReason" filterable :placeholder="$t('reportmanage.ptypebreakage')" :disabled="selectedType" + clearable @input="handleInputChangea($event, row.id)"> + <el-option v-for="item in selectOptionsb" :key="item.basicName" :label="item.basicName" + :value="item.basicName" /> + </el-select> + </template> + </el-table-column> + <el-table-column align="center" :label="$t('reportmanage.responsibleprocess')" min-width="120"> + <template #default="{ row }"> + <el-select v-model="row.responsibleProcess" filterable :placeholder="$t('reportmanage.ptypebreakage')" :disabled="selectedType" + clearable @input="handleInputChangea($event, row.id)"> + <el-option value="鍒囧壊" label="鍒囧壊"></el-option> + <el-option value="纾ㄨ竟" label="纾ㄨ竟"></el-option> + <el-option value="閽㈠寲" label="閽㈠寲"></el-option> + </el-select> + </template> + </el-table-column> + <el-table-column prop="responsiblePersonnel" align="center" :label="$t('reportmanage.responsiblepersonnel')" + min-width="180"> + <template #default="{ row }"> + <el-input :placeholder="$t('reportmanage.presponsiblepersonnel')" v-model="row.responsiblePersonnel" :disabled="selectedType" + autocomplete="off" /> + </template> + </el-table-column> + <el-table-column prop="responsibleTeam" align="center" :label="$t('reportmanage.responsibleteam')" + min-width="180"> + <template #default="{ row }"> + <el-select v-model="row.responsibleTeam" filterable :placeholder="$t('reportmanage.presponsibleteam')" :disabled="selectedType" + clearable @input="handleInputChangea($event, row.id)"> + <el-option v-for="item in selectOptionsc" :key="item.basicName" :label="item.basicName" + :value="item.basicName" /> + </el-select> + </template> + </el-table-column> + <el-table-column prop="responsibleEquipment" align="center" :label="$t('reportmanage.responsibleequipment')" :disabled="selectedType" + min-width="180"> + <template #default="{ row }"> + <el-select v-model="row.responsibleEquipment" filterable + :placeholder="$t('reportmanage.presponsibleequipment')" clearable :disabled="selectedType" + @input="handleInputChangea($event, row.id)"> + <el-option v-for="item in selectOptionsd" :key="item.basicName" :label="item.basicName" + :value="item.basicName" /> + </el-select> + </template> + </el-table-column> + <el-table-column prop="remark" align="center" :label="$t('reportmanage.remark')" min-width="180"> + <template #default="{ row }"> + <el-input :placeholder="$t('reportmanage.premark')" v-model="row.remark" autocomplete="off" :disabled="selectedType" /> + </template> + </el-table-column> + </el-table> + </div> </el-card> </div> </template> @@ -149,7 +133,18 @@ workingProcedure: '0', }); const reportData = ref([]) -const timeRange = ref(["2022-01-01", "2025-01-01"]) +const endDate = new Date(); +const startDate = new Date(); +startDate.setDate(endDate.getDate() - 20); // 鑾峰彇涓�涓槦鏈熷墠鐨勬椂闂� +// 鏍煎紡鍖栦负 "YYYY-MM-DD" 鏍煎紡 +const formatDate = (date) => { + const year = date.getFullYear(); + const month = String(date.getMonth() + 1).padStart(2, '0'); + const day = String(date.getDate()).padStart(2, '0'); + return `${year}-${month}-${day}`; +}; + +const timeRange = ref([formatDate(startDate), formatDate(endDate)]); const selectOptionsa = ref([]); const selectOptionsb = ref([]); const selectOptionsc = ref([]); @@ -158,8 +153,12 @@ const selectValuesb = reactive({}); const selectValuesc = reactive({}); const selectValuesd = reactive({}); +const selectValuese = reactive({}); const inputValuesa = reactive({}); const inputValuesb = reactive({}); + +const selectedType = ref(true); +const selectedStatus = ref(false); // 鏌ヨ鏁版嵁 @@ -171,9 +170,20 @@ status: report.value.status, workingProcedure: report.value.workingProcedure }) + if (report.value.type == 8) { + selectedType.value = false; + }else{ + selectedType.value = true; + } + if (report.value.status == 1&&(report.value.type == 8||report.value.type == 1)) { + selectedStatus.value = true; + }else{ + selectedStatus.value = false; + } if (response.code === 200) { reportData.value = response.data; ElMessage.success(response.message); + } else { ElMessage.error(response.message); } @@ -188,51 +198,65 @@ }; // 鎶ュ伐 const handleConfirm = async () => { - const response = await request.post("/cacheVerticalGlass/damage/submitDamage", reportData.value) - if (response.code === 200) { - ElMessage.success(response.message); + const hasEmptyOrNullBreakType = reportData.value.some( + item => item.breakageType === null || item.breakageType === '' + || item.breakageReason === null || item.breakageReason === '' + || item.responsibleProcess === null || item.responsibleProcess === '' + || item.responsibleTeam === null || item.responsibleTeam === '' + || item.responsibleEquipment === null || item.responsibleEquipment === '' + ); + if (hasEmptyOrNullBreakType&&selectedType.value==false) { + // 濡傛灉鎵惧埌浜嗘湭閫夋嫨椤癸紝鏄剧ず閿欒淇℃伅 + ElMessage.error('璇峰~鍐欐墍鏈夌幓鐠冪殑鐮存崯淇℃伅'); } else { - ElMessage.error(response.message); + const response = await request.post("/cacheVerticalGlass/damage/submitDamage", reportData.value) + if (response.code === 200) { + ElMessage.success(response.message); + } else { + ElMessage.error(response.message); + } + } + +}; +const fetchTableData = async () => { + try { + const response = await request.post('/cacheVerticalGlass/basic_data_produce/selectBasicDataProduceGroup'); + if (response.code == 200) { + selectOptionsa.value = response.data.breakagetype.filter(item => item !== null) + .map(item => ({ basicName: item.basicName })); + selectOptionsb.value = response.data.breakagereason.filter(item => item !== null) + .map(item => ({ basicName: item.basicName })); + selectOptionsc.value = response.data.teamsgroups.filter(item => item !== null) + .map(item => ({ basicName: item.basicName })); + selectOptionsd.value = response.data.device.filter(item => item !== null) + .map(item => ({ basicName: item.basicName })); + } else { + ElMessage.warning(response.data); + } + } catch (error) { + console.error('Error fetching options:', error); } }; -const fetchTableData = async () => { - try { - const response = await request.post('/cacheVerticalGlass/basic_data_produce/selectBasicDataProduceGroup'); - if (response.code == 200) { - selectOptionsa.value = response.data.breakagetype.filter(item => item !== null) -.map(item => ({ basicName: item.basicName })); - selectOptionsb.value = response.data.breakagereason.filter(item => item !== null) -.map(item => ({ basicName: item.basicName })); - selectOptionsc.value = response.data.teamsgroups.filter(item => item !== null) -.map(item => ({ basicName: item.basicName })); - selectOptionsd.value = response.data.device.filter(item => item !== null) -.map(item => ({ basicName: item.basicName })); - } else { - ElMessage.warning(response.data); - } - } catch (error) { - console.error('Error fetching options:', error); - } -}; -const handleInputChangea = (value, rowId) => { +const handleInputChangea = (value, rowId) => { // 鏇存柊瀵瑰簲琛岀殑 select 鍊� - selectValuesa[rowId] = value; - selectValuesb[rowId] = value; - selectValuesc[rowId] = value; - selectValuesd[rowId] = value; - inputValuesa[rowId] = value; - inputValuesb[rowId] = value; + selectValuesa[rowId] = value; + selectValuesb[rowId] = value; + selectValuesc[rowId] = value; + selectValuesd[rowId] = value; + selectValuese[rowId] = value; + inputValuesa[rowId] = value; + inputValuesb[rowId] = value; }; -fetchTableData(); +fetchTableData(); 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, - // })); +// adjustedRects.value = data.device[0].map(rect => ({ +// ...rect, +// completed: rect.completedQuantity, +// breakage: rect.breakageQuantity, +// thisProcess: rect.thisProcess, +// })); // }; // let socket; onMounted(() => { @@ -251,11 +275,11 @@ fetchTableData(); // socket = initializeWebSocket(socketUrl, handleMessage); }); - onUnmounted(() => { - if (socket) { +onUnmounted(() => { + if (socket) { closeWebSocket(socket); - } - }); + } +}); onBeforeUnmount(() => { console.log("鍏抽棴浜�") closeWebSocket(); -- Gitblit v1.8.0