|
|
@@ -0,0 +1,388 @@
|
|
|
+<!-- 工单信息 -->
|
|
|
+<template>
|
|
|
+ <div class="repairinfoLogs repair_infoLogs">
|
|
|
+ <div>
|
|
|
+ <el-row class="repair_row">
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>工单编号:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.code : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>执行部门:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.executeGroupName : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>执行人:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.executeUserName : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="repair_row">
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>计划单号:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.planCode : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>计划名称:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.planName : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>计划完成时间:</span>
|
|
|
+ <span>{{ workOrderInfo ? workOrderInfo.planFinishTime : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="repair_row">
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>设备名称:</span>
|
|
|
+ <span>{{ equipmentInfo ? equipmentInfo.name : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>编号:</span>
|
|
|
+ <span>{{ equipmentInfo ? equipmentInfo.codeNumber : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="repair_column">
|
|
|
+ <span>固定资产编码:</span>
|
|
|
+ <span>{{ equipmentInfo ? equipmentInfo.fixCode : '' }}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row
|
|
|
+ class="repair_row"
|
|
|
+ v-if="workOrderInfo.finishTime && workOrderInfo.acceptTime"
|
|
|
+ >
|
|
|
+ <el-col :span="12" class="repair_column">
|
|
|
+ <span>实际工时(分钟):</span>
|
|
|
+ <span>{{
|
|
|
+ parseInt(
|
|
|
+ (new Date(workOrderInfo.finishTime).getTime() -
|
|
|
+ new Date(workOrderInfo.acceptTime).getTime()) /
|
|
|
+ 60000
|
|
|
+ )
|
|
|
+ }}</span>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-steps
|
|
|
+ direction="vertical"
|
|
|
+ :active="0"
|
|
|
+ :space="100"
|
|
|
+ v-for="(item, index) in repairInfoLogList"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <el-step v-if="item.type == 'CREATE'">
|
|
|
+ <span
|
|
|
+ slot="icon"
|
|
|
+ :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
|
|
|
+ ></span>
|
|
|
+ <div slot="title" class="step_title">
|
|
|
+ <span>生成工单</span>
|
|
|
+ <span>{{ logs[item.id].createTime }}</span>
|
|
|
+ </div>
|
|
|
+ <div slot="description" class="create_workerOrder_desc">
|
|
|
+ <div> 报修人:{{ logs[item.id].requestUserName }} </div>
|
|
|
+ <div> 故障描述:{{ logs[item.id].remark }} </div>
|
|
|
+ <div class="work_report_imgs">
|
|
|
+ <el-image
|
|
|
+ v-for="(item, index) in logs[item.id]?.content?.images"
|
|
|
+ :key="index"
|
|
|
+ style="width: 100px; height: 100px; margin-right: 5px"
|
|
|
+ :src="item"
|
|
|
+ :preview-src-list="[item]"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-step>
|
|
|
+ <el-step v-if="item.type == 'SPARE_PARTS_APPLY'">
|
|
|
+ <span
|
|
|
+ slot="icon"
|
|
|
+ :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
|
|
|
+ ></span>
|
|
|
+ <div slot="title" class="step_title">
|
|
|
+ <span>备品备件申请</span>
|
|
|
+ <span>{{ logs[item.id].createTime }}</span>
|
|
|
+ </div>
|
|
|
+ <div slot="description" class="work_report_desc">
|
|
|
+ <div>
|
|
|
+ <div>申领清单:</div>
|
|
|
+ <el-table :data="item.content.infoList" border>
|
|
|
+ <el-table-column
|
|
|
+ label="备件物品编码"
|
|
|
+ align="center"
|
|
|
+ prop="code"
|
|
|
+ />
|
|
|
+ <el-table-column label="备件名称" align="center" prop="name" />
|
|
|
+ <el-table-column label="所属分类" prop="typeName" align="center">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>备品备件</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="型号" align="center" prop="modelType" />
|
|
|
+ <el-table-column
|
|
|
+ label="使用数量"
|
|
|
+ prop="packingCountBase"
|
|
|
+ align="center"
|
|
|
+ />
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-step>
|
|
|
+ <el-step v-if="item.type == 'ACCEPTANCE_CHEK'">
|
|
|
+ <span
|
|
|
+ slot="icon"
|
|
|
+ :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
|
|
|
+ ></span>
|
|
|
+ <div slot="title" class="step_title">
|
|
|
+ <span>验收</span>
|
|
|
+ <span>{{ logs[item.id].createTime }}</span>
|
|
|
+ </div>
|
|
|
+ <div slot="description" class="step_description">
|
|
|
+ <span>验收人:{{ logs[item.id].content.userName }}</span>
|
|
|
+ <span
|
|
|
+ >验收结果:{{
|
|
|
+ logs[item.id].content.orderStatus == 4 ? '通过' : '驳回'
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ <span>验收说明:{{ logs[item.id].content.remark }}</span>
|
|
|
+ </div>
|
|
|
+ </el-step>
|
|
|
+ <el-step v-if="item.type == 'WORK_REPORT'">
|
|
|
+ <span
|
|
|
+ slot="icon"
|
|
|
+ :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
|
|
|
+ ></span>
|
|
|
+ <div slot="title" class="step_title">
|
|
|
+ <span>报工</span>
|
|
|
+ <span>{{ logs[item.id].createTime }}</span>
|
|
|
+ </div>
|
|
|
+ <div slot="description" class="work_report_desc">
|
|
|
+ <div> 报工人:{{ logs[item.id].content?.rawUserName }} </div>
|
|
|
+ <div>
|
|
|
+ 辅助人:{{
|
|
|
+ logs[item.id].content.assists?.length > 0
|
|
|
+ ? logs[item.id].content.assists
|
|
|
+ .map((item) => item.name)
|
|
|
+ .toString()
|
|
|
+ : ''
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ <div> 处理说明:{{ logs[item.id].content.reason }} </div>
|
|
|
+ <div style="display: flex">
|
|
|
+ 附件:
|
|
|
+ <fileMain
|
|
|
+ v-model="logs[item.id].content.attachments"
|
|
|
+ type="view"
|
|
|
+ ></fileMain>
|
|
|
+ </div>
|
|
|
+ <div class="work_report_imgs">
|
|
|
+ <el-image
|
|
|
+ v-for="(item, index) in logs[item.id].content?.images"
|
|
|
+ :key="index"
|
|
|
+ style="width: 100px; height: 100px; margin-right: 5px"
|
|
|
+ :src="item"
|
|
|
+ :preview-src-list="logs[item.id].content?.images"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-step>
|
|
|
+ </el-steps>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ props: {
|
|
|
+ equipmentInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {};
|
|
|
+ }
|
|
|
+ },
|
|
|
+ repairInfoLogList: {
|
|
|
+ type: Array,
|
|
|
+ default: () => {
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ workOrderInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {};
|
|
|
+ }
|
|
|
+ },
|
|
|
+ planInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {};
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ watch: {
|
|
|
+ repairInfoLogList(val) {
|
|
|
+ console.log('接收的值', val);
|
|
|
+ // val.forEach((item) => {
|
|
|
+ // if (item.type !== 'SPARE_PARTS_APPLY') {
|
|
|
+ // this.logs[item.type] = {
|
|
|
+ // id: item.id,
|
|
|
+ // content: item.content,
|
|
|
+ // createTime: item.createTime,
|
|
|
+ // remark: item.remark,
|
|
|
+ // requestUserName: item.requestUserName
|
|
|
+ // };
|
|
|
+ // } else {
|
|
|
+ // if (item.content.infoList && item.content.infoList.length > 0) {
|
|
|
+ // item.content.infoList = item.content.infoList.map((item) => {
|
|
|
+ // return {
|
|
|
+ // ...JSON.parse(item.sparePartsList),
|
|
|
+ // sparePartsId: item.sparePartsId
|
|
|
+ // };
|
|
|
+ // });
|
|
|
+ // this.useData.push(item.content.infoList);
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ val.forEach((item) => {
|
|
|
+ this.logs[item.id] = {
|
|
|
+ id: item.id,
|
|
|
+ content: item.content,
|
|
|
+ createTime: item.createTime,
|
|
|
+ type: item.type,
|
|
|
+ remark: item.remark,
|
|
|
+ requestUserName: item.requestUserName
|
|
|
+ };
|
|
|
+ if (item.type === 'SPARE_PARTS_APPLY') {
|
|
|
+ this.logs[item.id].content.infoList =
|
|
|
+ this.logs[item.id].content.infoList &&
|
|
|
+ this.logs[item.id].content.infoList.length > 0
|
|
|
+ ? this.logs[item.id].content.infoList.map((item) => {
|
|
|
+ return {
|
|
|
+ ...JSON.parse(item.sparePartsList),
|
|
|
+ sparePartsId: item.sparePartsId
|
|
|
+ };
|
|
|
+ })
|
|
|
+ : [];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ console.log(this.logs);
|
|
|
+ this.logsKeys = Object.keys(this.logs);
|
|
|
+ this.lastStepName = this.logsKeys[0];
|
|
|
+ // val.forEach((item) => {
|
|
|
+ // this.logs[item.type.code] = {
|
|
|
+ // id: item.id,
|
|
|
+ // name: item.type.desc,
|
|
|
+ // content: JSON.parse(item.content),
|
|
|
+ // createTime: item.createTime
|
|
|
+ // };
|
|
|
+ // });
|
|
|
+ // // console.log('this.logs',this.logs)
|
|
|
+ // this.logsKeys = Object.keys(this.logs);
|
|
|
+ // // this.lastStepName = this.logsKeys[this.logsKeys.length - 1]
|
|
|
+ // this.lastStepName = this.logsKeys[0];
|
|
|
+ // this.getUseList();
|
|
|
+ // val.map((item) => {
|
|
|
+ // if (item.type.code === 'SPARE_PARTS_APPLY') {
|
|
|
+ // let code = JSON.parse(item.content).sparePartsCode;
|
|
|
+ // getSparePartDetail(code).then((res) => {
|
|
|
+ // if (res?.success) {
|
|
|
+ // item.applyList = res.data.sparePartsApplyDetailList;
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // console.log('val', val);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ logs: {},
|
|
|
+ logsKeys: [],
|
|
|
+ lastStepName: '',
|
|
|
+ useData: [],
|
|
|
+ workOrderCode: ''
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 获取申请明细列表
|
|
|
+ getApplyList() {
|
|
|
+ getSparePartDetail().then((res) => {});
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取使用明细列表
|
|
|
+ getUseList() {
|
|
|
+ let params = {
|
|
|
+ sourceCode: this.workOrderInfo.workOrderCode,
|
|
|
+ status: true
|
|
|
+ };
|
|
|
+ getUseDetail(params).then((res) => {
|
|
|
+ if (res?.success) {
|
|
|
+ this.useData = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .repair_row {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ .repair_column {
|
|
|
+ display: flex;
|
|
|
+ > span {
|
|
|
+ &:first-child {
|
|
|
+ font-weight: 700;
|
|
|
+ text-align: right;
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .repairinfoLogs {
|
|
|
+ .step_icon {
|
|
|
+ width: 22px;
|
|
|
+ height: 22px;
|
|
|
+ border: 1px solid #333;
|
|
|
+ border-radius: 50%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ .step_active {
|
|
|
+ border: 0;
|
|
|
+ background-color: #4b7902;
|
|
|
+ }
|
|
|
+ .step_title {
|
|
|
+ width: 400px;
|
|
|
+ color: #000;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .step_description {
|
|
|
+ display: flex;
|
|
|
+ padding: 5px 0px;
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #7f7f7f;
|
|
|
+ }
|
|
|
+ ::v-deep .create_workerOrder_desc {
|
|
|
+ display: flex;
|
|
|
+ > div {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ::v-deep .work_report_desc {
|
|
|
+ padding: 5px 10px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ color: #7f7f7f;
|
|
|
+ .el-table th.el-table__cell {
|
|
|
+ background-color: #d7d7d7;
|
|
|
+ padding: 0;
|
|
|
+ color: #000;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+ .el-table td.el-table__cell {
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|