新增维修工单逻辑

src/api/tickets/index.js

@@ -84,3 +84,38 @@ export async function getWorkOrderList(data) {
   }
   return Promise.reject(new Error(res.data.message));
 }
+
+// 维修工单详情
+export async function getRepairById(id) {
+  const res = await request.get(`/eam/repairrequest/getById/${id}`);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+export async function getWorkOrderDetail(code) {
+  const res = await request.get('/eam/workorder/getWorkOrderDetail/' + code);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 查询实例详情
+export async function getAssetInfo(id) {
+  const res = await request.get(`main/asset/getById/${id}`);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// 报工
+export async function acceptance(data) {
+  const res = await request.post('/eam/workorder/acceptance', data);
+  if (res.data.code == 0) {
+    return res.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/utils/dict/tickets.js

@@ -3,5 +3,6 @@ export const ticketStatus = [
   { id: 0, label: '待接收' },
   // { id: 1, label: '已接收' },
   { id: 2, label: '执行中' },
-  { id: 3, label: '已完成' }
+  { id: 3, label: '已完成' },
+  { id: 4, label: '已验收' }
 ];

src/views/bpm/tickets/components/RepairDetailsDialog.vue

@@ -0,0 +1,596 @@
+<template>
+  <!-- 维修工单弹框 -->
+  <el-dialog
+    :title="dialogTitle"
+    :visible.sync="equipmentdialog"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    width="60%"
+  >
+    <el-tabs
+      v-model="detailsTabsActiveName"
+      type="border-card"
+      v-if="row.title == '工单详情'"
+    >
+      <el-tab-pane :label="tabLabel" name="keepInRepair">
+        <WorkOrderTab
+          :repairInfoLogList="repairInfoLogs"
+          :workOrderInfo="workOrderInfo"
+          :planInfo="planInfo"
+          v-if="tabLabel === '工单信息'"
+        />
+        <RepairNotesTab
+          :repairInfoLogList="repairInfoLogs"
+          v-if="tabLabel === '维修信息'"
+        />
+      </el-tab-pane>
+      <el-tab-pane label="设备信息" name="equipment">
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备编码：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.code : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属部门：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipGroupName : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备名称：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.name : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属人：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipUserName : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备分类：</span>
+            <span>{{
+              equipmentInfo.category
+                ? equipmentInfo.category.category.categoryLevelPath
+                : ''
+            }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属人电话：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipUserMobile : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>固定资产编码：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.fixCode : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>设备位置：</span>
+            <span>{{
+              equipmentInfo.deviceLocationName +
+              '-' +
+              equipmentInfo.deviceDetailAddress
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>规格型号：</span>
+            <span>
+              {{
+                equipmentInfo.category &&
+                equipmentInfo.category.category.specification
+              }}|{{
+                equipmentInfo.category &&
+                equipmentInfo.category.category.modelType
+              }}
+            </span>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+      <el-tab-pane label="报修信息" name="repairApplication">
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修记录编号：</span>
+            <span>{{ infoData ? infoData.code : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>报修时间：</span>
+            <span>{{ infoData ? infoData.createTime : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>来源：</span>
+            <span>{{
+              infoData && infoData.sourceType ? infoData.sourceType : ''
+            }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>来源编码：</span>
+            <span>{{ infoData ? infoData.sourceCode : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修部门：</span>
+            <span>{{ infoData ? infoData.requestDeptName : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>报修人：</span>
+            <span>{{ infoData ? infoData.repairUserName : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修人电话：</span>
+            <span>{{ infoData ? infoData.requestUserPhone : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>期望完成时间：</span>
+            <span>{{ infoData ? infoData.expectedTime : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="24" class="repair_column">
+            <span>故障描述：</span>
+            <span>{{ infoData ? infoData.remark : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="24" class="repair_column">
+            <span>图片：</span>
+
+            <el-image
+              v-for="(item, index) in infoData.repairsImg"
+              :key="index"
+              style="width: 100px; height: 100px; margin-right: 5px"
+              :src="item.url"
+              :preview-src-list="[item.url]"
+            />
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+    </el-tabs>
+
+    <el-tabs v-model="detailsTabsActiveName" type="border-card" v-else>
+      <el-tab-pane label="报修信息" name="repairApplication">
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修记录编号：</span>
+            <span>{{ infoData ? infoData.code : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>报修时间：</span>
+            <span>{{ infoData ? infoData.createTime : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>来源：</span>
+            <span>{{
+              infoData ? getDictValue('报修来源', infoData.sourceType) : ''
+            }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>来源编码：</span>
+            <span>{{ infoData ? infoData.sourceCode : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修部门：</span>
+            <span>{{ infoData ? infoData.requestDeptName : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>报修人：</span>
+            <span>{{ infoData ? infoData.requestUserName : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>报修人电话：</span>
+            <span>{{ infoData ? infoData.repairsDeptPhone : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>期望完成时间：</span>
+            <span>{{ infoData ? infoData.expectedTime : '' }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="24" class="repair_column">
+            <span>故障描述：</span>
+            <span>{{ infoData ? infoData.remark : '' }}</span>
+          </el-col>
+        </el-row>
+        <!--        <el-row class="repair_row">
+          <el-col :span="24" class="repair_column">
+            <span>图片：</span>
+            <el-image
+              v-for="(item, index) in infoData.repairsImg"
+              :key="index"
+              style="width: 100px; height: 100px; margin-right: 5px"
+              :src="item.url"
+              :preview-src-list="[item.url]"
+            />
+          </el-col>
+        </el-row> -->
+        <!-- <el-row class="repair_row">
+          <el-col :span="24" class="repair_column">
+            <span class="label">视频：</span>
+            <span>{{ infoData ? infoData.repairsVideo : '' }}</span>
+          </el-col>
+        </el-row> -->
+      </el-tab-pane>
+      <el-tab-pane label="设备信息" name="equipment">
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备编码：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.code : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属部门：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipGroupName : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备名称：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.name : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属人：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipUserName : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>设备分类：</span>
+            <span>{{
+              equipmentInfo.category
+                ? equipmentInfo.category.categoryLevelPath
+                : ''
+            }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>权属人电话：</span>
+            <span>{{
+              equipmentInfo ? equipmentInfo.ownershipUserMobile : ''
+            }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>固定资产编码：</span>
+            <span>{{ equipmentInfo ? equipmentInfo.fixCode : '' }}</span>
+          </el-col>
+          <el-col :span="12" class="repair_column">
+            <span>设备位置：</span>
+            <span>{{ equipmentInfo.position }}</span>
+          </el-col>
+        </el-row>
+        <el-row class="repair_row">
+          <el-col :span="12" class="repair_column">
+            <span>规格型号：</span>
+            <span>
+              {{
+                equipmentInfo.category && equipmentInfo.category.specification
+              }}|{{
+                equipmentInfo.category && equipmentInfo.category.modelType
+              }}
+            </span>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+      <el-tab-pane :label="tabLabel" name="keepInRepair">
+        <WorkOrderTab
+          :repairInfoLogList="repairInfoLogs"
+          :workOrderInfo="workOrderInfo"
+          :planInfo="planInfo"
+          v-if="tabLabel === '工单信息'"
+        />
+        <RepairNotesTab
+          :repairInfoLogList="repairInfoLogs"
+          v-if="tabLabel === '维修信息'"
+        />
+      </el-tab-pane>
+    </el-tabs>
+    <!-- <div class="btnbox">
+      <el-button class="confirm-btn" type="danger" plain @click="reject"
+        >驳回</el-button
+      >
+      <el-button class="confirm-btn" type="success" plain @click="pass"
+        >验收</el-button
+      >
+      <el-button class="cancel-btn" @click="handleClose">关闭</el-button>
+    </div> -->
+    <div class="textbox" v-if="!showBtn">
+      <el-input
+        type="textarea"
+        placeholder="请输入理由"
+        v-model="cause"
+        maxlength="30"
+        rows="5"
+        show-word-limit
+      >
+      </el-input>
+      <div class="textbtnbox">
+        <el-button
+          class="confirm-btn"
+          type="danger"
+          plain
+          @click="surereject(5)"
+          >驳回</el-button
+        >
+        <el-button
+          class="confirm-btn"
+          type="success"
+          plain
+          @click="surereject(4)"
+          >验收</el-button
+        >
+        <el-button size="small" plain @click="cancelreject">取消</el-button>
+        <!-- <el-button size="small" round @click="surereject">提交</el-button> -->
+      </div>
+    </div>
+    <!-- <div slot="footer" v-if="!row.isshow">
+      <el-button size="small" @click="handleClose">关闭</el-button>
+    </div> -->
+  </el-dialog>
+</template>
+
+<script>
+  import RepairNotesTab from './RepairNotesTab.vue';
+  import WorkOrderTab from './WorkOrderTab.vue';
+  import {
+    getWorkOrderDetail,
+    getRepairById,
+    getAssetInfo,
+    acceptance
+  } from '@/api/tickets';
+  import dictMixins from '@/mixins/dictMixins';
+  export default {
+    mixins: [dictMixins],
+    props: {},
+    components: { RepairNotesTab, WorkOrderTab },
+    data() {
+      return {
+        showBtn: false,
+        equipmentdialog: false,
+        detailsTabsActiveName: 'repairApplication',
+        workOrderInfo: {},
+        planInfo: {},
+        infoData: {},
+        equipmentInfo: {},
+        repairInfoLogs: [],
+        tabLabel: '',
+        dialogTitle: '',
+        row: {},
+        cause: '',
+        showtext: false
+      };
+    },
+    created() {
+      this.requestDict('报修来源');
+      this.requestDict('报修状态');
+    },
+    methods: {
+      handleClose() {
+        this.equipmentdialog = false;
+        if (this.row.title === '工单详情') {
+          this.detailsTabsActiveName = 'keepInRepair';
+        } else {
+          this.detailsTabsActiveName = 'repairApplication';
+        }
+      },
+      async init(row, boolen) {
+        this.showBtn = !!boolen;
+        this.row = row;
+        console.log('row----------------------------------');
+        console.log(row);
+        this.equipmentdialog = true;
+        this.dialogTitle = row.title;
+        this.tabLabel = row.tabLabel;
+        if (row.title === '工单详情') {
+          this.detailsTabsActiveName = 'keepInRepair';
+        }
+        if (row.title === '报修记录详情') {
+          this.getSbinfo(this.row.deviceId);
+          const res = await getRepairById(row.id);
+          console.log('报修记录详情', res);
+          this.infoData = res ? res : {};
+          this.repairInfoLogs = res.repairLogVOList.reverse();
+          // 处理图片
+          // if (this.infoData && this.infoData.repairsImg) {
+          //   const repairsImg = this.infoData.repairsImg
+          //   this.infoData.repairsImg = []
+          //   repairsImg.split(',').map(item => {
+          //     imageView(item).then(res => {
+          //       this.infoData.repairsImg.push({
+          //         name: item.substring('/download/'.length),
+          //         url: res
+          //       })
+          //     })
+
+          //     console.log(this.infoData.repairsImg)
+          //     return
+          //   })
+          // }
+        } else if (row.title === '消息信息详情') {
+          this.getSbinfo(this.row.deviceId);
+          const res = await getRepairById(row.id);
+          this.infoData = res ? res : {};
+          this.repairInfoLogs = res.repairLogVOList.reverse();
+          // 处理图片
+          // if (this.infoData && this.infoData.repairsImg) {
+          //   const repairsImg = this.infoData.repairsImg
+          //   this.infoData.repairsImg = []
+          //   repairsImg.split(',').map(item => {
+          //     imageView(item).then(res => {
+          //       this.infoData.repairsImg.push({
+          //         name: item.substring('/download/'.length),
+          //         url: res
+          //       })
+          //     })
+          //     return
+          //   })
+          // }
+        } else {
+          console.log('----------');
+          console.log(row);
+
+          const res = await getWorkOrderDetail(row.code);
+          console.log(res);
+          this.workOrderInfo = res.ticketsInfoResponse;
+          this.infoData = res.repairRequestResponse;
+          this.getSbinfo(res.ticketsInfoResponse.deviceId);
+          // this.planInfo = res.data.planInfo;
+          // this.planInfo.executeUserName = res.data.executeUserName;
+          // this.planInfo.executorDeptName = res.data.executorDeptName;
+          // this.infoData = res.data.repairInfo ? res.data.repairInfo : {};
+          // // 处理图片
+          // if (this.infoData && this.infoData.repairsImg) {
+          //   const repairsImg = this.infoData.repairsImg;
+          //   this.infoData.repairsImg = [];
+          //   repairsImg.split(',').map((item) => {
+          //     imageView(item).then((res) => {
+          //       this.infoData.repairsImg.push({
+          //         name: item.substring('/download/'.length),
+          //         url: res
+          //       });
+          //     });
+          //     return;
+          //   });
+          // }
+          let repairInfoLogs =
+            res.ticketsInfoResponse.repairLogVOS?.length > 0
+              ? res.ticketsInfoResponse.repairLogVOS.map((item) => {
+                  return {
+                    ...item,
+                    requestUserName: res.repairRequestResponse.requestUserName,
+                    remark: res.repairRequestResponse.remark
+                  };
+                })
+              : [];
+          this.repairInfoLogs = repairInfoLogs.reverse();
+        }
+      },
+
+      getSbinfo(params) {
+        getAssetInfo(params).then((res) => {
+          if (res) {
+            this.equipmentInfo = res;
+            this.$set(
+              this.equipmentInfo,
+              'position',
+              res.positionList?.length > 0 && res.positionList[0].pathName
+                ? res.positionList[0].pathName
+                : ''
+            );
+          }
+        });
+      },
+
+      //通过按钮事件
+      pass() {
+        let params = {
+          orderStatus: 4,
+          remark: this.cause,
+          workOrderId: this.row.id
+        };
+        acceptance(params).then((res) => {
+          if (res.success) {
+            this.$message.success('验收成功!');
+            this.$emit('refesh');
+            this.equipmentdialog = false;
+          }
+        });
+      },
+      //驳回按钮事件
+      reject() {
+        this.showtext = true;
+        let ele = document.getElementsByClassName('el-dialog__wrapper');
+        let bodyscrollHeight = document.body.scrollHeight;
+        this.$nextTick(() => {
+          ele.forEach((element) => {
+            if (element.style.display !== 'none') {
+              element.scrollTop = bodyscrollHeight;
+            }
+          });
+        });
+      },
+      cancelreject() {
+        this.showtext = false;
+        this.cause = '';
+      },
+      surereject(orderStatus) {
+        let params = {
+          orderStatus,
+          remark: this.cause,
+          workOrderId: this.row.id
+        };
+        acceptance(params).then((res) => {
+          if (res.code == 0) {
+            this.$message.success(
+              orderStatus == 4 ? '审核通过！' : '驳回成功!'
+            );
+            this.$emit('refesh');
+            this.equipmentdialog = false;
+          }
+        });
+      }
+    },
+    watch: {
+      equipmentdialog(nVal, oVal) {
+        if (!nVal) {
+          this.cause = '';
+          this.showtext = false;
+        }
+      }
+    }
+  };
+</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;
+        }
+      }
+    }
+  }
+  .btnbox {
+    display: flex;
+    justify-content: center;
+    margin-top: 10px;
+  }
+  ::v-deep .el-button {
+    padding: 10px 20px;
+    margin-right: 10px;
+  }
+  .textbox {
+    margin-top: 10px;
+  }
+  .textbtnbox {
+    margin-top: 10px;
+    display: flex;
+    justify-content: center;
+  }
+</style>

src/views/bpm/tickets/components/RepairNotesTab.vue

@@ -0,0 +1,303 @@
+<!-- 维修信息 -->
+<template>
+  <div class="repair_infoLogs">
+    <el-steps
+      direction="vertical"
+      :active="0"
+      :space="100"
+      v-for="(item, index) in repairInfoLogList"
+      :key="index"
+    >
+      <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>{{ item.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>验收人：{{ item.content.userName }}</span>
+          <span
+            >验收结果：{{
+              item.content.acceptanceResult ? '通过' : '驳回'
+            }}</span
+          >
+          <span>验收说明：{{ item.content.acceptanceInstructions }}</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>{{ item.content.createTime }}</span>
+        </div>
+        <div slot="description" class="work_report_desc">
+          <div> 处理说明：{{ item.content.repairReportExplain }} </div>
+          <div class="work_report_imgs" style="width: 50px; height: 50px">
+            <img
+              v-for="(ite, index) in item.content.workOrderImgList"
+              :key="index"
+              :src="ite"
+              alt=""
+              style="width: 40%"
+            />
+          </div>
+          <div>
+            <div>备品备件使用情况：</div>
+            <el-table :data="workReportData" border>
+              <el-table-column label="备件编码" prop="code" align="center" />
+              <el-table-column label="备件名称" align="center" prop="name" />
+              <el-table-column
+                label="所属分类"
+                prop="typeName"
+                align="center"
+              />
+              <el-table-column label="型号" align="center" prop="model" />
+              <el-table-column label="使用数量" prop="num" align="center" />
+            </el-table>
+          </div>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'START'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'START' ? 'step_icon step_active' : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>开始执行</span>
+          <span>{{ item.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>执行人：{{ item.content.executorName }}</span>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'CREATE_WORK_ORDER'">
+        <span
+          slot="icon"
+          :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
+        ></span>
+        <div slot="title" class="step_title">
+          <span>生成工单</span>
+          <span>{{ item.createTime }}</span>
+        </div>
+        <div
+          slot="description"
+          class="step_description"
+          style="margin-bottom: 30px"
+        >
+          <el-row>
+            <el-col :span="8">
+              <span>工单编号：{{ item.content.workOrderCode }}</span>
+            </el-col>
+            <el-col :span="8">
+              <span>执行人：{{ item.content.workOrderExecutorName }}</span>
+            </el-col>
+            <el-col :span="8">
+              <span>执行人电话：{{ item.content.workOrderExecutorPhone }}</span>
+            </el-col>
+            <el-col :span="24">
+              <span>计划完成时间：{{ item.content.plannedTime }}</span>
+            </el-col>
+            <el-col :span="24">
+              <span>维修方案：{{ item.content.maintenanceContent }}</span>
+            </el-col>
+          </el-row>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'EXAMINE_PLAN'">
+        <span
+          slot="icon"
+          :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
+        ></span>
+        <div slot="title" class="step_title">
+          <span>审核维修计划</span>
+          <span>{{ item.content.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>审核人：{{ item.content.examinePlanUserName }}</span>
+          <span
+            >审核结果：{{
+              item.content.examinePlanUserName ? '通过' : ''
+            }}</span
+          >
+          <span>审核说明：{{ item.content.examineExplain }}</span>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'CREATE_PLAN'">
+        <span
+          slot="icon"
+          :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
+        ></span>
+        <div slot="title" class="step_title">
+          <span
+            >创建维修计划<span v-if="item.createNum"
+              >（第{{ item.createNum }}次）</span
+            ></span
+          >
+          <span>{{ item.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>创建人：{{ item.content.createUserName }}</span>
+          <span>计划单号：{{ item.content.planCode }}</span>
+          <span>计划名称：{{ item.content.planName }}</span>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'ACCEPTANCE_CHEK_OUTSOURCE_WORK_ORDER'">
+        <span
+          slot="icon"
+          :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
+        ></span>
+        <div slot="title" class="step_title">
+          <span>验收委外工单</span>
+          <span>{{ item.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>验收人：{{ item.content.executorName }}</span>
+          <span
+            >验收结果：{{ item.content.checkResult ? '通过' : '驳回' }}</span
+          >
+          <span>验收说明：{{ item.content.checkDesc }}</span>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type == 'CREATE_OUTSOURCE_WORK_ORDER'">
+        <span
+          slot="icon"
+          :class="index == 0 ? 'step_icon step_active' : 'step_icon'"
+        ></span>
+        <div slot="title" class="step_title">
+          <span
+            >生成委外工单<span v-if="item.createNum"
+              >（第{{ item.createNum }}次）</span
+            ></span
+          >
+          <span>{{ item.createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>创建人：{{ item.content.executorName }}</span>
+          <span>工单编号：{{ item.content.outsourcCode }}</span>
+          <span>委外单位：{{ item.content.outsourcUnit }}</span>
+        </div>
+      </el-step>
+
+      <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>{{ item.createTime }}</span>
+          <!-- <span>{{ logs['CREATE'].createTime }}</span> -->
+        </div>
+      </el-step>
+    </el-steps>
+  </div>
+</template>
+
+<script>
+  // import repair from '@/api/maintenance/repair/repair'
+
+  export default {
+    props: {
+      repairInfoLogList: {
+        type: Array,
+        default: () => {
+          return [];
+        }
+      }
+    },
+    watch: {
+      repairInfoLogList(val) {
+        console.log('repairInfoLogList', val);
+        // val.forEach(item => {
+        //   this.logs[item.type.code] = {
+        //     id: item.id,
+        //     name: item.type.desc,
+        //     content: JSON.parse(item.content),
+        //     createTime: item.createTime
+        //   }
+        // })
+        // this.length = val.length
+        // this.logsKeys = Object.keys(this.logs)
+        // this.lastStepName = this.logsKeys[this.logsKeys.length - 1]
+        // if (this.logs['WORK_REPORT']) {
+        //   const workOrderId = this.logs['WORK_REPORT'].content.workOrderId
+        //   repair
+        //     .getSpareData({ workOrderId })
+        //     .then(res => {
+        //       // console.log(res)
+        //       this.workReportData = res.data
+        //     })
+        //     .catch(() => {})
+        // }
+      }
+    },
+    data() {
+      return {
+        logs: {},
+        logsKeys: [],
+        lastStepName: '',
+        workReportData: [],
+        length: null
+      };
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  .repair_infoLogs {
+    .step_icon {
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+      box-sizing: border-box;
+      background: #ccc;
+    }
+    .step_active {
+      border: 0;
+      background-color: #1890ff;
+    }
+    .step_title {
+      width: 400px;
+      color: #000;
+      display: flex;
+      justify-content: space-between;
+    }
+    .step_description {
+      display: flex;
+      padding: 5px 10px;
+      background-color: #f2f2f2;
+      justify-content: space-between;
+      color: #7f7f7f;
+    }
+    ::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>

src/views/bpm/tickets/components/WorkOrderTab.vue

@@ -0,0 +1,654 @@
+<!-- 工单信息 -->
+<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="24" class="repair_column">
+          <span>维修方案：</span>
+          <span>{{ workOrderInfo ? workOrderInfo.repairPrograms : '' }}</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="
+            lastStepName == 'CREATE' ? 'step_icon step_active' : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>生成工单</span>
+          <span>{{ logs['CREATE'].createTime }}</span>
+        </div>
+        <div slot="description" class="create_workerOrder_desc">
+          <div> 报修人：{{ logs['CREATE'].requestUserName }} </div>
+          <div> 故障描述：{{ logs['CREATE'].remark }} </div>
+        </div>
+      </el-step>
+      <el-step v-if="item.type == 'SPARE_PARTS_APPLY'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'SPARE_PARTS_APPLY'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>备品备件申请</span>
+          <span>{{ logs['SPARE_PARTS_APPLY'].createTime }}</span>
+        </div>
+        <div slot="description" class="work_report_desc">
+          <!-- <div slot="description" class="step_description">
+            <span
+              >申领单号：{{
+                logs['SPARE_PARTS_APPLY'].content.sparePartsCode
+              }}</span
+            >
+          </div> -->
+          <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="
+            lastStepName == 'ACCEPTANCE_CHEK'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>验收</span>
+          <span>{{ logs['ACCEPTANCE_CHEK'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>验收人：{{ logs['ACCEPTANCE_CHEK'].content.userName }}</span>
+          <span
+            >验收结果：{{
+              logs['ACCEPTANCE_CHEK'].content.orderStatus == 4 ? '通过' : '驳回'
+            }}</span
+          >
+          <span>验收说明：{{ logs['ACCEPTANCE_CHEK'].content.remark }}</span>
+        </div>
+      </el-step>
+      <el-step v-if="item.type == 'WORK_REPORT'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'WORK_REPORT'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>报工</span>
+          <span>{{ logs['WORK_REPORT'].createTime }}</span>
+        </div>
+        <div slot="description" class="work_report_desc">
+          <div> 处理说明：{{ logs['WORK_REPORT'].content.reason }} </div>
+          <div class="work_report_imgs" style="width: 50px; height: 50px">
+            <img
+              v-for="(item, index) in logs['WORK_REPORT'].content
+                .workOrderImgList"
+              :key="index"
+              :src="item"
+              alt=""
+              style="width: 40%"
+            />
+          </div>
+          <!-- <div>
+            <div>备品备件使用情况：</div>
+            <el-table :data="useData" border>
+              <el-table-column
+                label="备件编码"
+                prop="assetCode"
+                align="center"
+              />
+              <el-table-column
+                label="备件名称"
+                align="center"
+                prop="informationName"
+              />
+              <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="typeName" align="center">
+                <template slot-scope="{ row }">
+                  <div>1</div>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div> -->
+        </div>
+      </el-step>
+    </el-steps>
+    <!-- <el-steps
+      direction="vertical"
+      :active="0"
+      :space="100"
+      v-for="(item, index) in repairInfoLogList"
+      :key="index"
+    >
+      <el-step v-if="item.type.code == 'ACCEPTANCE_CHEK'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'ACCEPTANCE_CHEK'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>验收</span>
+          <span>{{ logs['ACCEPTANCE_CHEK'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>验收人：{{ logs['ACCEPTANCE_CHEK'].content.userName }}</span>
+          <span
+            >验收结果：{{
+              logs['ACCEPTANCE_CHEK'].content.acceptanceResult ? '通过' : '驳回'
+            }}</span
+          >
+          <span
+            >验收说明：{{
+              logs['ACCEPTANCE_CHEK'].content.acceptanceInstructions
+            }}</span
+          >
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'WORK_REPORT'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'WORK_REPORT'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>报工</span>
+          <span>{{ logs['WORK_REPORT'].createTime }}</span>
+        </div>
+        <div slot="description" class="work_report_desc">
+          <div>
+            处理说明：{{ logs['WORK_REPORT'].content.repairReportExplain }}
+          </div>
+          <div class="work_report_imgs" style="width: 50px; height: 50px">
+            <img
+              v-for="(item, index) in logs['WORK_REPORT'].content
+                .workOrderImgList"
+              :key="index"
+              :src="item"
+              alt=""
+              style="width: 40%"
+            />
+          </div>
+          <div>
+            <div>备品备件使用情况：</div>
+            <el-table :data="useData" border>
+              <el-table-column
+                label="备件编码"
+                prop="assetCode"
+                align="center"
+              />
+              <el-table-column
+                label="备件名称"
+                align="center"
+                prop="informationName"
+              />
+              <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="typeName" align="center">
+                <template slot-scope="{ row }">
+                  <div>1</div>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'STOCK_OUT_APPROVAL'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'STOCK_OUT_APPROVAL'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>备品备件出库审核</span>
+          <span>{{ logs['STOCK_OUT_APPROVAL'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span
+            >出库单号：{{
+              logs['STOCK_OUT_APPROVAL'].content.stockOutCode
+            }}</span
+          >
+          <span
+            >审核人：{{
+              logs['STOCK_OUT_APPROVAL'].content.approvalUserName
+            }}</span
+          >
+          <span
+            >审核结果：{{
+              logs['SPARE_PARTS_APPROVAL'].content.approvalResult
+                ? '通过'
+                : '驳回'
+            }}</span
+          >
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'STOCK_OUT_APPLY'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'STOCK_OUT_APPLY'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>备品备件出库申请</span>
+          <span>{{ logs['STOCK_OUT_APPLY'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span
+            >出库单号：{{ logs['STOCK_OUT_APPLY'].content.stockOutCode }}</span
+          >
+          <span
+            >申请人：{{ logs['STOCK_OUT_APPLY'].content.applyUserName }}</span
+          >
+          <span
+            >审核人：{{
+              logs['STOCK_OUT_APPLY'].content.approvalUserName
+            }}</span
+          >
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'SPARE_PARTS_APPROVAL'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'SPARE_PARTS_APPROVAL'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>备品备件申领审核</span>
+          <span>{{ logs['SPARE_PARTS_APPROVAL'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span
+            >申领单号：{{
+              logs['SPARE_PARTS_APPROVAL'].content.sparePartsCode
+            }}</span
+          >
+          <span
+            >审核人：{{
+              logs['SPARE_PARTS_APPROVAL'].content.approvalUserName
+            }}</span
+          >
+          <span
+            >审核结果：{{
+              logs['SPARE_PARTS_APPROVAL'].content.approvalResult
+                ? '通过'
+                : '驳回'
+            }}</span
+          >
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'SPARE_PARTS_APPLY'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'SPARE_PARTS_APPLY'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>备品备件申请</span>
+          <span>{{ logs['SPARE_PARTS_APPLY'].createTime }}</span>
+        </div>
+        <div slot="description" class="work_report_desc">
+          <div slot="description" class="step_description">
+            <span
+              >申领单号：{{
+                logs['SPARE_PARTS_APPLY'].content.sparePartsCode
+              }}</span
+            >
+            <span
+              >申请人：{{
+                logs['SPARE_PARTS_APPLY'].content.applyUserName
+              }}</span
+            >
+            <span
+              >审核人：{{
+                logs['SPARE_PARTS_APPLY'].content.approvalUserName
+              }}</span
+            >
+          </div>
+          <div>
+            <div>申领清单：</div>
+            <el-table :data="item.applyList" border>
+              <el-table-column
+                label="备件物品编码"
+                align="center"
+                prop="informationCode"
+              />
+              <el-table-column
+                label="备件名称"
+                align="center"
+                prop="informationName"
+              />
+              <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="num" align="center" />
+            </el-table>
+          </div>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'START'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'START' ? 'step_icon step_active' : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>开始执行</span>
+          <span>{{ logs['START'].createTime }}</span>
+        </div>
+        <div slot="description" class="step_description">
+          <span>执行人：{{ logs['START'].content.executorName }}</span>
+        </div>
+      </el-step>
+
+      <el-step v-if="item.type.code == 'CREATE_WORK_ORDER'">
+        <span
+          slot="icon"
+          :class="
+            lastStepName == 'CREATE_WORK_ORDER'
+              ? 'step_icon step_active'
+              : 'step_icon'
+          "
+        ></span>
+        <div slot="title" class="step_title">
+          <span>生成工单</span>
+          <span>{{ logs['CREATE_WORK_ORDER'].createTime }}</span>
+        </div>
+      </el-step>
+    </el-steps> -->
+  </div>
+</template>
+
+<script>
+  // import repair from '@/api/maintenance/repair/repair'
+  // import {  getSparePartDetail , getUseDetail } from '@/api/stockManagement/stocking'
+  export default {
+    props: {
+      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.type] = {
+            id: item.id,
+            content: item.content,
+            createTime: item.createTime,
+            remark: item.remark,
+            requestUserName: item.requestUserName
+          };
+          if (item.type === 'SPARE_PARTS_APPLY') {
+            this.logs[item.type].content.infoList =
+              this.logs[item.type].content.infoList &&
+              this.logs[item.type].content.infoList.length > 0
+                ? this.logs[item.type].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;
+    }
+    .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>

src/views/bpm/tickets/index.vue

@@ -43,9 +43,9 @@
       return {
         activeComp: 'patrolInspection',
         tabOptions: [
-          { key: 'patrolInspection', name: '巡点检工单' },
+          { key: 'patrolInspection', name: '点巡检工单' },
           { key: 'maintenance', name: '保养工单' },
-          { key: 'delivery', name: '量具送检工单' },
+          // { key: 'delivery', name: '量具送检工单' },
           { key: 'repair', name: '维修工单' }
           // { key: 'repair', name: '计划性维修工单' },
           // { key: 'malfunction', name: '盘点工单' }

src/views/bpm/tickets/patrolInspection/index.vue

@@ -91,7 +91,7 @@
         </el-table-column>
         <el-table-column prop="code" label="工单编号" />
         <el-table-column prop="planCode" label="计划单号" />
-        <el-table-column prop="planName" label="巡点检名称" />
+        <el-table-column prop="planName" label="点巡检名称" />
         <!-- <el-table-column prop="createTime" label="设备分类" /> -->
         <el-table-column prop="ruleName" label="规则名称" />
         <el-table-column prop="createUserName" label="创建人" />

src/views/bpm/tickets/repair/detail.vue

@@ -138,7 +138,7 @@
 
         <!-- 巡点检、保养设备 -->
         <div class="maintain_equipment_info">
-          <HeaderTitle title="巡点检设备" size="16px"></HeaderTitle>
+          <HeaderTitle title="设备" size="16px"></HeaderTitle>
           <div class="maintain_equipment_info_content">
             <div
               class="equipment_item"

src/views/bpm/tickets/repair/index.vue

@@ -80,7 +80,6 @@
         height="99%"
         tooltip-effect="dark"
         :header-cell-style="{ background: '#F0F3F3', border: 'none' }"
-        @row-dblclick="openDetail"
       >
         <el-table-column
           width="80px"
@@ -116,8 +115,17 @@
             {{ time_interval(row.acceptTime, row.finishTime) }}
           </template>
         </el-table-column>
-        <el-table-column label="操作" width="150">
+        <el-table-column label="操作" width="200">
           <template slot-scope="{ row }">
+            <el-link
+              v-if="row.orderStatus == 3 && row.createUserId == userId"
+              type="primary"
+              :underline="false"
+              icon="el-icon-edit"
+              @click="goDetail(row)"
+            >
+              验收
+            </el-link>
             <el-link
               v-if="row.orderStatus !== 3 && row.orderStatus !== 4"
               type="primary"
@@ -136,6 +144,14 @@
             >
               转派
             </el-link>
+            <el-link
+              type="primary"
+              :underline="false"
+              icon="el-icon-edit"
+              @click="openDetail(row)"
+            >
+              详情
+            </el-link>
           </template>
         </el-table-column>
       </el-table>
@@ -153,6 +169,8 @@
       >
       </el-pagination>
     </div>
+    <!-- 验收 -->
+    <RepairDetailsDialog ref="detailsDialogRef" @refesh="getData" />
     <!-- 转派弹窗 -->
     <redeployOther ref="redeployOtherRef" @refresh="getData" />
     <!-- 报工弹框 -->
@@ -164,17 +182,23 @@
   import redeployOther from '../components/redeployOther.vue';
   import signingUpWork from '../components/signingUpWork.vue';
   import { ticketStatus } from '@/utils/dict/tickets';
+  import RepairDetailsDialog from '../components/RepairDetailsDialog.vue';
   import { getWorkOrderList, getRule } from '@/api/tickets';
   import pagenation from '@/components/Pagination';
-  import { deepClone } from 'ele-admin/lib/utils/core';
   export default {
-    components: { pagenation, redeployOther, signingUpWork },
+    components: {
+      pagenation,
+      redeployOther,
+      signingUpWork,
+      RepairDetailsDialog
+    },
     data() {
       return {
         ruleNameList: [],
         tableData: [],
         statusOptions: [],
-        ticketStatus: [],
+        userId: '',
+        ticketStatus,
         searchForm: {
           code: '',
           orderStatus: 0,
@@ -194,11 +218,15 @@
     created() {
       this.getRuleNameList();
       this.getData();
-      let filtersTicketStatus = deepClone(ticketStatus);
-      filtersTicketStatus.pop();
-      this.ticketStatus = filtersTicketStatus;
+      this.userId = localStorage.getItem('userId');
     },
     methods: {
+      // 验收
+      goDetail(row) {
+        row.title = '工单详情';
+        row.tabLabel = '工单信息';
+        this.$refs.detailsDialogRef.init(row);
+      },
       // 转派
       toRedeploy(row) {
         this.$refs.redeployOtherRef.open(row);
@@ -210,13 +238,10 @@
       reload(where) {
         this.$refs.table.reload({ page: 1, ...where });
       },
-      openDetail({ id }) {
-        this.$router.push({
-          path: '/tickets/maintenance/detail',
-          query: {
-            id
-          }
-        });
+      openDetail(row) {
+        row.title = '工单详情';
+        row.tabLabel = '工单信息';
+        this.$refs.detailsDialogRef.init(row, true);
       },
       // 获取规则名列表(设备维修)
       async getRuleNameList() {
@@ -236,12 +261,10 @@
         return index;
       },
       getData() {
-        let userId = localStorage.getItem('userId');
-        console.log(userId);
         let par = {
           ...this.pages,
           ...this.searchForm,
-          executeUserId: userId
+          executeUserId: this.userId
         };
         if (this.searchForm.date) {
           par.startTime = this.searchForm.date[0];
@@ -307,6 +330,18 @@
 </script>
 
 <style lang="scss" scoped>
+  // 步骤条边线显示
+  ::v-deep .el-step__head.is-process .el-step__icon.is-text {
+    border: none !important;
+    background: none !important;
+  }
+  ::v-deep .el-step:last-of-type .el-step__line {
+    display: block !important;
+    width: 3px !important;
+  }
+  ::v-deep .el-steps:last-child .el-step__line {
+    display: none !important;
+  }
   .patrolInspection {
     height: 100%;
     width: 100%;