费用清单详情增加流程信息

src/views/salesServiceManagement/accessory/components/workOrderList.vue

@@ -173,7 +173,8 @@ export default {
           }
         }
       ],
-      radio: null
+      radio: null,
+      current:{},
     };
   },
 

src/views/salesServiceManagement/cost/component/costDialog.vue

@@ -10,7 +10,26 @@
     append-to-body
     @close="handleClose"
   >
-    <el-form ref="recyleFormRef" :model="form" label-width="100px">
+    <div class="switch" v-if="type == 'view'">
+      <div class="switch_left">
+        <ul>
+          <li
+            v-for="item in tabOptions"
+            :key="item.key"
+            :class="{ active: activeComp == item.key }"
+            @click="handleTag(item.key)"
+          >
+            {{ item.name }}
+          </li>
+        </ul>
+      </div>
+    </div>
+    <el-form
+      v-show="activeComp === 'main'"
+      ref="recyleFormRef"
+      :model="form"
+      label-width="100px"
+    >
       <headerTitle title="基本信息" style="margin-top: 15px"></headerTitle>
       <el-row>
         <el-col :span="8">
@@ -54,6 +73,10 @@
         :type="title == '详情' ? 'view' : 'edit'"
       ></spareParts>
     </el-form>
+    <bpmDetail
+      v-if="activeComp === 'bpm' && processInstanceId"
+      :id="processInstanceId"
+    ></bpmDetail>
     <template v-slot:footer>
       <el-button @click="handleClose" :loading="loading">取消</el-button>
       <el-button
@@ -69,6 +92,7 @@
 </template>
 
 <script>
+  import bpmDetail from '@/views/bpm/processInstance/detail.vue';
   import workOrderList from '@/views/salesServiceManagement/accessory/components/workOrderList.vue';
   import spareParts from '@/views/salesServiceManagement/components/sparePartsList.vue';
   import {
@@ -81,7 +105,8 @@
     props: {},
     components: {
       workOrderList,
-      spareParts
+      spareParts,
+      bpmDetail
     },
     computed: {
       workOrderDis() {
@@ -102,7 +127,13 @@
           remarks: '',
           workOrderName: ''
         },
-        source: 0
+        source: 0,
+        activeComp: 'main',
+        processInstanceId:'0',
+        tabOptions: [
+          { key: 'main', name: '发货单详情' },
+          { key: 'bpm', name: '流程详情' }
+        ]
       };
     },
     methods: {
@@ -116,6 +147,8 @@
       },
       async getDetail(data) {
         const res = await salesrealcostinfo(data.id);
+        this.processInstanceId = res.processInstanceId;
+        console.log(res, 'res 3333');
         this.$refs.sparePartsRef.setTableValue(res?.detailLst || []);
         this.$set(this.form, 'workOrderName', res.workOrderName);
         this.form.workOrderCode = res.workOrderCode;
@@ -178,6 +211,9 @@
           this.$refs.workOrderListRef.open(data);
         }
       },
+      handleTag(val) {
+        this.activeComp = val;
+      },
       async changeSelect(row) {
         if (row.id == this.form.workOrderId) {
           return;