55

src/views/produceOrder/components/details/index.vue

@@ -28,6 +28,21 @@
 
       <div class="drawer_content">
         <Info :workOrderInfo="workOrderInfo"></Info>
+
+        <el-steps
+          :active="activeIndex"
+          space="20px"
+          align-center
+          style="margin-top: 18px"
+        >
+          <el-step
+            v-for="(item, index) in routeList"
+            :key="index"
+            :title="item.taskTypeName"
+            @click.native="handIdx(index, item)"
+            :description="desIndex == index ? '此处' : ''"
+          ></el-step>
+        </el-steps>
       </div>
     </el-drawer>
   </div>
@@ -35,6 +50,9 @@
 
 <script>
   import Info from './info.vue';
+
+  import { getTaskInstanceList } from '@/api/produce/job';
+
   export default {
     components: { Info },
     data() {
@@ -42,12 +60,18 @@
         drawer: false,
         isFullscreen: true,
 
-        workOrderInfo: {}
+        workOrderInfo: {},
+
+        routeList: [],
+        activeIndex: 0,
+        desIndex: 0,
+        curTaskObj: null
       };
     },
 
     methods: {
       handleClose() {
+        this.activeIndex = 0;
         this.drawer = false;
       },
 
@@ -58,7 +82,38 @@
 
       open(row) {
         this.workOrderInfo = row;
+        this.getTaskFn();
         this.drawer = true;
+      },
+
+      getTaskFn() {
+        getTaskInstanceList(this.workOrderInfo.id).then((res) => {
+          this.routeList = res;
+
+          // 使用findIndex方法查找
+          const index = this.routeList.findIndex(
+            (item) => Number(item.taskId) == Number(this.workOrderInfo.taskId)
+          );
+
+          this.desIndex = index;
+
+          if (this.workOrderInfo.taskId != -2) {
+            this.curTaskObj = JSON.parse(JSON.stringify(this.routeObj));
+          } else {
+            this.curTaskObj = JSON.parse(JSON.stringify(this.routeList[0]));
+            this.desIndex = 0;
+          }
+          this.activeIndex = index;
+        });
+      },
+
+      handIdx(index, item) {
+        this.curTaskObj = JSON.parse(JSON.stringify(item));
+        if (item.taskId == -2) {
+          this.$message.info('完结状态不能点击');
+        } else {
+          this.desIndex = index;
+        }
       }
     }
   };

src/views/produceOrder/components/details/info.vue

@@ -42,18 +42,26 @@
           </div>
         </div>
 
-          <div class="rx ww25">
-            <div class="lable rx-cc">计划开始时间</div>
-            <div class="content">{{ workOrderInfo.planStartTime }}</div>
-          </div>
+        <div class="rx ww25">
+          <div class="lable rx-cc">计划开始时间</div>
+          <div class="content">{{ workOrderInfo.planStartTime }}</div>
+        </div>
 
-          <div class="rx ww25">
-            <div class="lable rx-cc">计划结束时间</div>
-            <div class="content">{{ workOrderInfo.planCompleteTime }}</div>
+        <div class="rx ww25">
+          <div class="lable rx-cc">计划结束时间</div>
+          <div class="content">{{ workOrderInfo.planCompleteTime }}</div>
+        </div>
+      </div>
+
+      <div class="item rx-sc">
+        <div class="rx ww25">
+          <div class="lable rx-cc">工艺路线：</div>
+          <div class="content">
+            {{ workOrderInfo.produceRoutingName }}
           </div>
         </div>
-    
 
+        </div>
 
 
     </div>
@@ -87,7 +95,7 @@
       border-bottom: 1px solid #e3e5e5;
 
       .lable {
-        width: 88px;
+        width: 98px;
         text-align: center;
         background-color: #f7f9fa;
         font-size: 12px;