履职任务状态列优化

src/views/resumption/taskManager/index.vue

@@ -358,9 +358,14 @@
             v-if="columns[9].visible"
           >
             <template slot-scope="r">
-              <ul :style="statusStyle(r.row.status)"><li>{{ getLabel(dict.type.resumption_status, r.row.status) }}</li>
-                </ul
-              >
+              <span>
+                <i class="circle" :style="statusColor(r.row.status,true)" />
+                <label :style="statusColor(r.row.status,false)">
+                  {{
+                    getLabel(dict.type.resumption_status, r.row.status)
+                  }}</label
+                >
+              </span>
             </template>
           </el-table-column>
           <el-table-column label="操作" min-width="13%">
@@ -700,7 +705,7 @@ export default {
       api
         .getRoles({
           orgId: this.queryParams.orgId,
-          planCycle: this.queryParams.executeCycle
+          planCycle: this.queryParams.executeCycle,
         })
         .then((r) => (this.roleList = r.data));
     },
@@ -709,7 +714,7 @@ export default {
       api
         .getPlans({
           orgId: this.queryParams.orgId,
-          planCycle: this.queryParams.executeCycle
+          planCycle: this.queryParams.executeCycle,
         })
         .then((r) => {
           this.planList = r.data;
@@ -964,20 +969,29 @@ export default {
         this.queryParams.range = this.$dateRange.before(0);
       }
     },
-    statusStyle(status) {
+    statusColor(status,isBackground) {
       let color = "";
       switch (status) {
         case "1":
           color = "#BFBFBF";
+          break;
         case "2":
-          color = "1890FF";
+          color = "#1890FF";
+          break;
         case "3":
-          color = "52C41A";
+          color = "#52C41A";
+          break;
         case "4":
-          color = "F5222D";
+          color = "#F5222D";
+          break;
       }
 
-      return "list-style-type:disc;padding-left:10px;color:" + color;
+      if(isBackground){
+        return "background-color:" + color;
+      }else{
+        return "color:" + color;
+      }
+      
     },
   },
   async mounted() {