From b32150d1fd576fa3b89e85e2f99be2edc67b9293 Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期二, 17 九月 2024 16:26:15 +0800 Subject: [PATCH] 工单详情页优化 --- src/views/system/work-order/index.vue | 212 +++++++++++++++++++++++++++++++++------------------- 1 files changed, 135 insertions(+), 77 deletions(-) diff --git a/src/views/system/work-order/index.vue b/src/views/system/work-order/index.vue index c731f2a..593c822 100644 --- a/src/views/system/work-order/index.vue +++ b/src/views/system/work-order/index.vue @@ -1,22 +1,23 @@ <template> <div class="app-container"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"> - <el-form-item label="宸ュ崟鍙�" prop="workOrderNo"> + <el-form-item label="鍏抽敭璇�" prop="keyword"> <el-input - v-model="queryParams.workOrderNo" - placeholder="璇疯緭鍏ュ伐鍗曞彿" + v-model="queryParams.keyword" + placeholder="宸ュ崟鍙�/鐐逛綅鍚嶇О鎼滅储" clearable @clear="handleQuery" @keyup.enter.native="handleQuery" /> </el-form-item> <el-form-item label="鏁呴殰绫诲瀷" prop="errorTypeList"> - <el-select v-model="queryParams.errorTypeList" multiple placeholder="鏁呴殰绫诲瀷" clearable @clear="handleQuery"> + <el-select v-model="queryParams.errorTypeList" multiple @change="handleQuery" placeholder="鏁呴殰绫诲瀷" clearable @clear="handleQuery"> <el-option v-for="dict in dict.type.error_type" :value="dict.value" :key="dict.value" :label="dict.label" /> </el-select> </el-form-item> <el-form-item label="宸ュ崟鐘舵��" prop="status"> <el-select v-model="queryParams.status" placeholder="宸ュ崟鐘舵��" @change="handleQuery"> + <el-option label="鍏ㄩ儴" value=""></el-option> <el-option label="寰呭鐞�" value="DISTRIBUTED"></el-option> <el-option label="寰呭鏍�" value="YW_HANDLE"></el-option> <el-option label="宸插畬鎴�" value="AUDITING_SUCCESS"></el-option> @@ -63,10 +64,21 @@ <div class="card"> <div class="card-left"> <el-image - :preview-src-list="['https://img2.baidu.com/it/u=68398439,1553004927&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=357']" - fit="cover" src="https://img2.baidu.com/it/u=68398439,1553004927&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=357" + v-if="item.imgList && item.imgList.length > 0" + :preview-src-list="item.imgList" + fit="cover" :src="item.imgList[0]" class="image" - /> + style="display: flex;justify-content: center;align-items: center;" + > + <div slot="error" class="image-slot"> + <i class="el-icon-picture-outline">鍔犺浇澶辫触</i> + </div> + </el-image> + <el-image class="image" style="display: flex;justify-content: center;align-items: center;" v-else> + <div slot="error" class="image-slot"> + <i class="el-icon-picture-outline" style="color: gray;font-size: 14px">鏈彇鍒板浘鐗�</i> + </div> + </el-image> </div> <div class="work-order"> <el-row class="work-order-item"> @@ -76,7 +88,7 @@ <el-col :span="24" class="time">鏁呴殰鏃堕棿锛歿{ item.createTime }}</el-col> </el-row> <el-row class="work-order-item"> - <el-col class="time" :span="24" style="display: flex;flex-direction: row"><div style="min-width: 66px">鏁呴殰鐐逛綅锛�</div><div style="word-break: break-word">{{ item.source }}</div></el-col> + <el-col class="time" :span="24"><div>鏁呴殰鐐逛綅锛�</div><div>{{ item.source }}</div></el-col> </el-row> <el-row style="position: absolute;bottom: 10px"> <el-button @@ -95,7 +107,7 @@ v-hasPermi="['work:order:condition:add']" v-show="item.status !== 'AUDITING_SUCCESS'" @click="handleYwCondition(item)" - >杩愮淮鎯呭喌 + >澶勭悊涓婃姤 </el-button> <el-button class="my-button" @@ -112,6 +124,14 @@ v-hasPermi="['system:report:add']" v-show="item.status !== 'AUDITING_SUCCESS'" >浜嬪悗鎶ュ + </el-button> + <el-button + class="my-button" + size="mini" + type="text" + @click="handleDetail(item)" + v-hasPermi="['system:workorder:detail']" + >璇︽儏 </el-button> </el-row> </div> @@ -150,69 +170,73 @@ <el-form-item label="鎶ュ绫诲瀷"> <el-input v-model="reportForm.reportType" disabled/> </el-form-item> - <el-form-item label="鏁呴殰绫诲瀷" prop="errorType"> - <el-select v-model="reportForm.errorType"> - <el-option label="甯傛斂鏂藉伐" value="甯傛斂鏂藉伐"/> - <el-option label="璁惧鏁呴殰" value="璁惧鏁呴殰"/> - <el-option label="璁惧閬楀け" value="璁惧閬楀け"/> + <el-form-item label="鏁呴殰绫诲瀷" prop="errorTypeList"> + <el-select v-model="reportForm.errorTypeList" multiple> + <el-option v-for="dict in dict.type.report_error_type" :value="dict.value" :key="dict.value" :label="dict.label" /> </el-select> + </el-form-item> + <el-form-item label="鎶ュ鏃堕棿" prop="daterangeCreateTime"> + <el-date-picker v-model="reportForm.daterangeCreateTime" type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss" + range-separator="-" start-placeholder="寮�濮嬫棩鏈�" end-placeholder="缁撴潫鏃ユ湡" + ></el-date-picker> </el-form-item> <el-form-item label="鎶ュ鍐呭" prop="reportContent"> <editor v-model="reportForm.reportContent" :min-height="192"/> </el-form-item> - <el-form-item label="涓婃姤鏉愭枡" prop="reportMaterials"> + <el-form-item label="鎶ュ鏉愭枡" prop="reportMaterials"> <file-upload v-model="reportForm.reportMaterials"/> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> <el-button @click="reportOpen = false">鍙� 娑�</el-button> - <el-button type="primary" @click="submitReportForm">鎻� 浜�</el-button> + <el-button type="primary" @click="submitReportForm">鎻愪氦瀹℃牳</el-button> </div> </el-dialog> - <el-dialog title="宸ュ崟瀹℃牳" :visible.sync="auditingOpen" width="1000px" append-to-body> - <el-row :gutter="20"> - <el-col :span="10"> - <el-form ref="auditingForm" :model="auditingForm" :rules="auditingRules" label-width="80px"> - <el-form-item label="宸ュ崟鍙�" prop="workOrderNo"> - <el-input v-model="auditingForm.workOrderNo" disabled/> - </el-form-item> - <el-form-item label="杩愮淮鍗曚綅" prop="unitName"> - <el-input v-model="auditingForm.unitName" disabled/> - </el-form-item> - <el-form-item label="瀹℃牳缁撴灉" prop="auditingResult"> - <el-radio v-model="auditingForm.auditingResult" label="AUDITING_SUCCESS">閫氳繃</el-radio> - <el-radio v-model="auditingForm.auditingResult" label="AUDITING_FAIL">椹冲洖</el-radio> - </el-form-item> - <el-form-item label="瀹℃牳澶囨敞" prop="auditingRemark"> - <el-input v-model="auditingForm.auditingRemark" type="textarea" maxlength="30" show-word-limit/> - </el-form-item> - </el-form> - </el-col> - <el-col :span="14" style="max-height: 500px; overflow-y: auto"> - <el-timeline v-if="ywConditions && ywConditions.length > 0"> - <el-timeline-item v-for="(condition, index) in ywConditions" :key="index" - :timestamp="condition.commitUserName + '___' + condition.createTime" placement="top" - > - <el-card> - <div v-html="condition.ywCondition"></div> - <el-link type="primary" - v-for="item in condition.ywProofMaterials != null ? condition.ywProofMaterials.split(',') : condition.ywProofMaterials" - :underline="false" :key="item.id" @click="handleDownload(item)" - >{{ item.substring(item.lastIndexOf('/') + 1) }} - </el-link> - </el-card> - </el-timeline-item> - </el-timeline> - <el-empty v-else description="娌℃湁澶勭悊璁板綍"></el-empty> - </el-col> - </el-row> + <WorkOrderAuditing :auditingOpen="auditingOpen" :dataForm="auditingForm" :ywConditions="ywConditions" @close="closeAuditing"/> +<!-- <el-dialog title="宸ュ崟瀹℃牳" :visible.sync="auditingOpen" width="1000px" append-to-body>--> +<!-- <el-row :gutter="20">--> +<!-- <el-col :span="10">--> +<!-- <el-form ref="auditingForm" :model="auditingForm" :rules="auditingRules" label-width="80px">--> +<!-- <el-form-item label="宸ュ崟鍙�" prop="workOrderNo">--> +<!-- <el-input v-model="auditingForm.workOrderNo" disabled/>--> +<!-- </el-form-item>--> +<!-- <el-form-item label="杩愮淮鍗曚綅" prop="unitName">--> +<!-- <el-input v-model="auditingForm.unitName" disabled/>--> +<!-- </el-form-item>--> +<!-- <el-form-item label="瀹℃牳缁撴灉" prop="auditingResult">--> +<!-- <el-radio v-model="auditingForm.auditingResult" label="AUDITING_SUCCESS">閫氳繃</el-radio>--> +<!-- <el-radio v-model="auditingForm.auditingResult" label="AUDITING_FAIL">椹冲洖</el-radio>--> +<!-- </el-form-item>--> +<!-- <el-form-item label="瀹℃牳澶囨敞" prop="auditingRemark">--> +<!-- <el-input v-model="auditingForm.auditingRemark" type="textarea" maxlength="30" show-word-limit/>--> +<!-- </el-form-item>--> +<!-- </el-form>--> +<!-- </el-col>--> +<!-- <el-col :span="14" style="max-height: 500px; overflow-y: auto">--> +<!-- <el-timeline v-if="ywConditions && ywConditions.length > 0">--> +<!-- <el-timeline-item v-for="(condition, index) in ywConditions" :key="index"--> +<!-- :timestamp="condition.commitUserName + '___' + condition.createTime" placement="top"--> +<!-- >--> +<!-- <el-card>--> +<!-- <div v-html="condition.ywCondition"></div>--> +<!-- <el-link type="primary"--> +<!-- v-for="item in condition.ywProofMaterials != null ? condition.ywProofMaterials.split(',') : condition.ywProofMaterials"--> +<!-- :underline="false" :key="item.id" @click="handleDownload(item)"--> +<!-- >{{ item.substring(item.lastIndexOf('/') + 1) }}--> +<!-- </el-link>--> +<!-- </el-card>--> +<!-- </el-timeline-item>--> +<!-- </el-timeline>--> +<!-- <el-empty v-else description="娌℃湁澶勭悊璁板綍"></el-empty>--> +<!-- </el-col>--> +<!-- </el-row>--> - <div slot="footer" class="dialog-footer"> - <el-button @click="cancelAuditing">鍙� 娑�</el-button> - <el-button type="primary" @click="submitAuditing">瀹� 鏍�</el-button> - </div> - </el-dialog> +<!-- <div slot="footer" class="dialog-footer">--> +<!-- <el-button @click="cancelAuditing">鍙� 娑�</el-button>--> +<!-- <el-button type="primary" @click="submitAuditing">瀹� 鏍�</el-button>--> +<!-- </div>--> +<!-- </el-dialog>--> <el-dialog title="杩愮淮鎯呭喌璁板綍" :visible.sync="ywConditionOpen" width="500px" append-to-body> <el-form ref="form" :model="form" :rules="ywConditionRules" label-width="80px"> @@ -235,7 +259,7 @@ </div> </el-dialog> - <el-dialog title="杩愮淮鎵归噺瀹℃牳" :visible.sync="batchAuditingVisible" width="500px" append-to-body> + <el-dialog title="宸ュ崟鎵归噺瀹℃牳" :visible.sync="batchAuditingVisible" width="500px" append-to-body> <el-form ref="batchAuditingWorkOrder" :model="batchAuditingWorkOrder" label-width="80px" :rules="batchAuditingRules" > @@ -259,7 +283,7 @@ <el-dialog title="杩囩▼鍥�" :visible.sync="flowOpen" width="1200px" append-to-body> <div> <el-steps :active="ywAuditingList.length != 0 ? 3 : ywHandleList.length != 0 ? 2 : 1" :space="500"> - <el-step title="浜х敓宸ュ崟"> + <el-step :title="getTitle1()"> <template slot="description"> <div> <div class="row flow-item-x"> @@ -285,7 +309,7 @@ </div> </template> </el-step> - <el-step title="杩愮淮澶勭悊"> + <el-step :title="getTitle2()"> <template slot="description"> <div style="max-height: 450px;overflow-y: scroll"> <div v-for="(item, index) in ywHandleList" :key="index"> @@ -429,11 +453,12 @@ process } from '@/api/platform/work-order' import { addReport } from '@/api/platform/report' +import WorkOrderAuditing from "@/components/WorkOrder/WorkOrderAuditing"; export default { name: 'Work-order', - dicts: ['error_type'], - components: {}, + dicts: ['error_type', 'report_error_type'], + components: {WorkOrderAuditing}, data() { return { drawer: false, @@ -448,21 +473,32 @@ }, ywHandleList: [], ywAuditingList: [], + beforeReportMsg: '', + afterReportMsg: '', reportFormRules: { reportContent: [ { required: true, message: '鎶ュ鍐呭涓嶈兘涓虹┖', trigger: 'blur' } ], reportMaterials: [ - { required: true, message: '涓婃姤鏉愭枡涓嶈兘涓虹┖', trigger: 'blur' } - ] + { required: true, message: '鎶ュ鏉愭枡涓嶈兘涓虹┖', trigger: 'blur' } + ], + errorTypeList: [ + { required: true, message: '璇烽�夋嫨鏁呴殰绫诲瀷', trigger: 'change' } + ], + daterangeCreateTime: [ + { required: true, message: '璇烽�夋嫨鎶ュ鏃堕棿', trigger: 'change' } + ], }, reportOpen: false, reportForm: { reportType: '浜嬪悗鎶ュ', pointId: '', - errorType: '', + errorTypeList: [], reportContent: '', - reportMaterials: '' + reportMaterials: '', + daterangeCreateTime: [], + beginCreateTime: null, + endCreateTime: null }, // 杩囩▼鍥� flowOpen: false, @@ -545,7 +581,7 @@ // 杩愮淮鎯呭喌 ywData: { content: '', - fileList: '' + fileList: 'process.env.VUE_APP_BASE_API' } } }, @@ -553,6 +589,15 @@ this.getList() }, methods: { + closeAuditing() { + this.auditingOpen = false + }, + getTitle1() { + return '浜х敓宸ュ崟' + (this.beforeReportMsg ? '(' + this.beforeReportMsg + ')' : '') + }, + getTitle2() { + return '杩愮淮澶勭悊' + (this.afterReportMsg ? '(' + this.afterReportMsg + ')' : '') + }, openDrawer(item) { this.ywData = { content: '', @@ -584,6 +629,10 @@ submitReportForm() { this.$refs['reportForm'].validate(valid => { if (valid) { + if (this.reportForm.daterangeCreateTime && this.reportForm.daterangeCreateTime.length > 0) { + this.reportForm.beginCreateTime = this.reportForm.daterangeCreateTime[0] + this.reportForm.endCreateTime = this.reportForm.daterangeCreateTime[1] + } addReport(this.reportForm).then(response => { this.$modal.msgSuccess('鎴愬姛鎻愪氦鎶ュ') this.reportOpen = false @@ -592,9 +641,13 @@ } }) }, + // 璇︽儏 + handleDetail(item) { + this.$router.push({name: '/work-order-center/maintenance/detail', query: {workOrderNo: item.workOrderNo}}) + }, // 浜嬪悗鎶ュ鎸夐挳 handleReport(row) { - this.reportForm.pointId = row.pointId + this.reportForm.pointId = row.serialNumber this.reportForm.source = row.source this.reportOpen = true }, @@ -630,6 +683,8 @@ if (response.data) { this.ywAuditingList = response.data.auditingList this.ywHandleList = response.data.ywList + this.afterReportMsg = response.data.afterReportMsg + this.beforeReportMsg = response.data.beforeReportMsg this.flowOpen = true } }) @@ -716,15 +771,15 @@ this.queryParams.params = {} this.queryParams['start'] = this.daterangeYwHandleTime ? this.daterangeYwHandleTime[0] : null this.queryParams['end'] = this.daterangeYwHandleTime ? this.daterangeYwHandleTime[1] : null - if (this.queryParams['status'] == '') { - this.queryParams['status'] = 'DISTRIBUTED' - } + listWorkOrder(this.queryParams).then(response => { - // response.data.forEach(item => { - // if (item.errorType) { - // item.errorTypeList = item.errorTypeList.split(",") - // } - // }) + response.data.forEach(item => { + if (item.imgList) { + item.imgList = item.imgList.map(img => { + return this.$img + img + }) + } + }) this.workOrderList = response.data this.total = response.total this.loading = false @@ -877,6 +932,9 @@ } .work-order-item { margin-bottom: 5px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .time { -- Gitblit v1.8.0