领料记录查询详情-增加审批流

src/views/business/businessHandling/index.vue

@@ -1,5 +1,7 @@
 <template>
   <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="isDetail ? 18 : 24" :offset="0">
         <el-form
           :model="maForm"
           ref="maForm"
@@ -224,7 +226,11 @@
                   <span v-else class="el-upload-list__item-preview" @click="picturePreviewFbs(file)">
                     <i class="el-icon-zoom-in" />
                   </span>
-              <span v-if="!isDetail" class="el-upload-list__item-delete" @click="handleRemoveElectricianImgList(file)">
+                  <span
+                    v-if="!isDetail"
+                    class="el-upload-list__item-delete"
+                    @click="handleRemoveElectricianImgList(file)"
+                  >
                     <i class="el-icon-delete" />
                   </span>
                 </span>
@@ -302,7 +308,8 @@
                 v-model="scope.row.preNum"
                 type="text"
                 style="width: 100%"
-            :disabled="scope.row.alNum && scope.row.alNum != 0"
+                :disabled="!!(scope.row.alNum && scope.row.alNum != 0)"
+                :readonly="isDetail"
                 @input="handlePreNum(scope.row, $event, 'input')"
                 @blur="handlePreNum(scope.row, $event, 'blur')"
               />
@@ -315,7 +322,7 @@
               <el-input
                 v-model="scope.row.remark"
                 controls-position="right"
-            :disabled="isDetail"
+                :readonly="isDetail"
                 style="width: 100%"
               ></el-input>
             </template>
@@ -335,6 +342,45 @@
             </template>
           </el-table-column>
         </el-table>
+      </el-col>
+      <el-col :span="6" :offset="0" v-if="isDetail">
+        <div class="right-title">
+          <div></div>
+          <div></div>
+          <div>流程记录</div>
+        </div>
+
+        <div class="process-record">
+          <el-steps :active="active" :space="120" direction="vertical">
+            <el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
+              <template slot="description">
+                <div class="custom-description">
+                  审核结果:
+                  <el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
+                  <el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
+                  <el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
+                </div>
+
+                <div class="node-info" v-if="step.auditBy">
+                  审核人:
+                  {{ step.auditBy }}
+                </div>
+
+                <div class="node-info" v-if="step.createTime">
+                  审核时间:
+                  {{ step.createTime }}
+                </div>
+
+                <div class="node-info" v-if="step.remark">
+                  审核意见:
+                  {{ step.remark }}
+                </div>
+              </template>
+            </el-step>
+          </el-steps>
+        </div>
+      </el-col>
+    </el-row>
 
     <!-- 弹框 -->
     <el-dialog title="领用申请" :visible.sync="dialogVisible" width="60%">
@@ -390,6 +436,7 @@ import {
   getCode
 } from '@/api/business/index'
 import { getEquipmentThreeTypeThree, getMaTypeOpt } from '@/api/ma/base'
+import { getAuditingDetailsApi } from '@/api/receive-apply/index.js'
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 
@@ -566,7 +613,10 @@ export default {
       defaultImage: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
       tooltipTimeout: null,
 
-      pageTitle: '新增'
+      pageTitle: '新增',
+      auditingList: [],
+      active: 1,
+      taskId: ''
     }
   },
   computed: {
@@ -625,6 +675,8 @@ export default {
       // const obj = Object.assign({}, this.$route, { title: '领用申请编辑' })
       // this.$tab.updatePage(obj)
     } else if (this.$route.query.type == 'detail') {
+      this.taskId = this.$route.query.taskId
+      this.getLeaseTaskDetailFun()
       // this.isEdit = false
       // this.isDetail = true
       // this.id = this.$route.query.id
@@ -651,9 +703,16 @@ export default {
     console.log(this.$route.query, 'this.$route.query')
   },
   methods: {
+    // 获取数据详情 和 审核记录详情
+    async getLeaseTaskDetailFun() {
+      const { rows: result } = await getAuditingDetailsApi({ taskId: this.taskId })
+      this.auditingList = result
+      console.log('审核列表数据:', this.auditingList)
+    },
     handlePreNum(row, val, type) {
       if (type === 'input') {
-        const reg = row.unitValue == 1
+        const reg =
+          row.unitValue == 1
             ? val.replace(/[^\d.]/g, '') // 允许小数
             : val.replace(/[^\d]/g, '') // 只能整数
         row.preNum = reg
@@ -1542,4 +1601,52 @@ export default {
   max-width: 250px;
   color: white;
 }
+.process-record {
+  margin-top: 20px;
+  //   height: 60vh;
+}
+.btn-container {
+  margin-top: 10px;
+  display: flex;
+  justify-content: space-around;
+}
+
+::v-deep .el-step__icon.is-text {
+  background-color: #19a4a0;
+  color: #19a4a0;
+  border: none;
+  width: 16px;
+  height: 16px;
+}
+
+::v-deep .el-step.is-vertical .el-step__line {
+  width: 2px;
+  top: 26px;
+  bottom: 8px;
+  left: 7px;
+}
+
+::v-deep .el-step__title.is-finish {
+  font-weight: bold;
+  color: #303133;
+  font-size: 16px;
+}
+
+::v-deep .el-step__title.is-wait {
+  font-weight: bold;
+  color: #303133;
+  font-size: 16px;
+}
+
+.custom-description {
+  padding: 8px 0 8px 20px;
+  color: #666;
+}
+
+.node-info {
+  // padding: 2px 0;
+  padding-left: 20px;
+  color: #666;
+  letter-spacing: 1px;
+}
 </style>

src/views/business/businessHandlingRecord/index.vue

@@ -376,7 +376,7 @@ export default {
       console.log('编辑', row)
       let params = {}
       if (type === 1) {
-        params = { type: 'detail', id: row.id }
+        params = { type: 'detail', id: row.id, taskId: row.taskId }
       } else {
         params = { type: 'edit', id: row.id }
       }

src/views/material/ma/device/index.vue

@@ -351,7 +351,7 @@
               <div class="uploadImg">
                   <div id="qrcode" class="qrcode" ref="codeItem"></div> 
               </div>
-              <div class="boxCode">二维码编号：{{ rowObj.qrCode }}</div>
+              <div class="boxCode">设备编号：{{ rowObj.maCode }}</div>
           </div>
           <div slot="footer" class="dialog-footer" style="text-align: center">
               <el-button type="primary" @click="downloadCode">下 载</el-button>