任务流程节点修改

src/assets/styles/public.scss

@@ -188,7 +188,48 @@
     }
 
     .timeline {
-      padding: 20px 10px;
+      padding: 20px;
+      height: calc(100% - 60px);
+      overflow-y: scroll;
+
+      .timeline-items {
+        display: flex;
+        align-items: center;
+        margin-bottom: 40px;
+        .left-box {
+          position: relative;
+          .main-img {
+            width: 45px;
+            margin-right: 20px;
+          }
+          .icon-jt {
+            position: absolute;
+            width: 15px;
+            height: 7px;
+            bottom: -20px;
+            left: 15px;
+          }
+        }
+
+        .right-box {
+          display: flex;
+          flex-direction: column;
+          justify-content: space-between;
+          .span-title {
+            font-family: Alibaba PuHuiTi;
+            font-weight: 500;
+            font-size: 14px;
+            color: #192734;
+            margin-bottom: 8px;
+          }
+          .span-time {
+            font-family: Alibaba PuHuiTiR;
+            font-weight: 400;
+            font-size: 14px;
+            color: #5C6166;
+          }
+        }
+      }
     }
   }
 }

src/views/auditPages/taskManagement/info.vue

@@ -160,11 +160,20 @@
     <div class="info-right" v-if="$route.query.pageType == 'look'">
       <div class="info-title">任务流程节点</div>
       <div class="timeline">
-        <div class="timeline-items">
+        <div class="timeline-items" v-for="(item,index) in timeLineData">
-          <img src="" alt="">
+          <div class="left-box">
+            <img class="main-img" v-if="item.status == 1" src="@/assets/images/rwxf.png" alt="">
+            <img class="main-img" v-if="item.status == 2" src="@/assets/images/wctj.png" alt="">
+            <img class="main-img" v-if="item.status == 3" src="@/assets/images/shbh.png" alt="">
+            <img class="main-img" v-if="item.status == 4" src="@/assets/images/shtg.png" alt="">
+            <img class="icon-jt" v-if="(index + 1) != timeLineData.length" src="@/assets/images/icon-jt@2x.png" alt="">
+          </div>
           <div class="right-box">
-            <span class="span-title">管理员任务下发</span>
+            <span class="span-title" v-if="item.status == 1">管理员任务下发:</span>
-            <span class="span-time">2024-11-11 17:00:30</span>
+            <span class="span-title" v-if="item.status == 2">单位核查完成提交:</span>
+            <span class="span-title" v-if="item.status == 3">管理员审核驳回:</span>
+            <span class="span-title" v-if="item.status == 4">管理员审核通过:</span>
+            <span class="span-time">{{ item.timestamp }}</span>
           </div>
         </div>
       </div>
@@ -200,20 +209,38 @@ export default {
       ],
       loading: false,
       tabHeader: undefined,
-      activities: [{
+      timeLineData: [{
-        content: '管理员任务下发',
+        status: 1,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 2,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 3,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 2,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 4,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 2,
+        timestamp: '2024-11-11 17:00:00'
+      }, {
+        status: 4,
         timestamp: '2024-11-11 17:00:00'
       }, {
-        content: '单位核查完成提交',
+        status: 2,
         timestamp: '2024-11-11 17:00:00'
       }, {
-        content: '管理员审核驳回',
+        status: 4,
         timestamp: '2024-11-11 17:00:00'
       }, {
-        content: '单位重新审核提交',
+        status: 2,
         timestamp: '2024-11-11 17:00:00'
       }, {
-        content: '管理员审核通过',
+        status: 4,
         timestamp: '2024-11-11 17:00:00'
       }],
       titleInfoObj: {}