fix: 工单管理优化

src/common/components/base/tableView.vue

@@ -116,6 +116,9 @@ export default {
       type: Boolean,
       type: Boolean,
       default: true,
       default: true,
     },
     },
+    cellClassName: {
+      type: Function,
+    },
   },
   },
   computed: {
   computed: {
     ...mapState({
     ...mapState({
@@ -350,15 +353,6 @@ export default {
         }
         }
       }
       }
     },
     },
-    cellClassName({ row }) {
-      const item = this.highIds.find(
-        (item) => item === row.id,
-      )
-      if (item) {
-        return 'green'
-      }
-      return ''
-    },
     // 单选
     // 单选
     radioChange(options) {
     radioChange(options) {
       this.$emit('currentChange', options)
       this.$emit('currentChange', options)

src/views/taskManage/index.vue

@@ -120,38 +120,8 @@
         <table-view
         <table-view
           :tableColumns="tableColumns"
           :tableColumns="tableColumns"
           :sourceData="sourceData"
           :sourceData="sourceData"
+          :cellClassName="cellClassName"
         >
         >
-          <template #serialNumberRender="{ row, rowIndex }">
-            <div>
-              <el-tooltip
-                v-if="row.sign === 0"
-                content="该工单已回复"
-                placement="bottom"
-                effect="light"
-              >
-                <span
-                  style="
-                    font-size: 16px;
-                    color: rgb(255, 153, 0);
-                    float: right;
-                    margin-top: 4px;
-                    margin-left: 5px;
-                    position: absolute;
-                    top: 40%;
-                    cursor: pointer;
-                    right: 38px;
-                    transform: translateY(-50%);
-                    display: inline-block;
-                    width: 8px;
-                    height: 8px;
-                    background-color: green;
-                    border-radius: 50%;
-                  "
-                ></span>
-              </el-tooltip>
-              <span>{{ rowIndex + 1 }}</span>
-            </div>
-          </template>
         </table-view>
         </table-view>
       </div>
       </div>
       <div class="pagination">
       <div class="pagination">
@@ -173,6 +143,7 @@
       :close-on-click-modal="false"
       :close-on-click-modal="false"
       :visible.sync="detailVisible"
       :visible.sync="detailVisible"
       width="900px"
       width="900px"
+      @close="getlist()"
     >
     >
       <div class="step-bar">
       <div class="step-bar">
         <!-- step-pass 已经完成,step-active当前步骤 -->
         <!-- step-pass 已经完成,step-active当前步骤 -->
@@ -343,17 +314,17 @@
         <div style="margin-top: 10px; text-align: right">
         <div style="margin-top: 10px; text-align: right">
           <el-button
           <el-button
             size="mini"
             size="mini"
+            type="primary"
+            @click="reply"
+            >回复</el-button
+          >
+          <el-button
+            size="mini"
             type="success"
             type="success"
             v-if="statusCode === 'PRE_HANDLING'"
             v-if="statusCode === 'PRE_HANDLING'"
             @click="confirm"
             @click="confirm"
             >受理</el-button
             >受理</el-button
           >
           >
-          <el-button
-            size="mini"
-            type="primary"
-            @click="reply"
-            >回复</el-button
-          >
         </div>
         </div>
       </div>
       </div>
     </el-dialog>
     </el-dialog>
@@ -475,6 +446,25 @@ export default {
     tableColumns() {
     tableColumns() {
       // const employeeId = this.employeeId
       // const employeeId = this.employeeId
       return [
       return [
+        {
+          label: '工单标题',
+          key: 'title',
+          minWidth: 120,
+          align: 'left',
+          render: (item) => (
+            <span>
+              <span
+                class={
+                  item.sign === 0
+                    ? 'set-blue'
+                    : 'order-title'
+                }
+              >
+                {item.title}
+              </span>
+            </span>
+          ),
+        },
         { label: '工单编号', key: 'orderNo', width: 110 },
         { label: '工单编号', key: 'orderNo', width: 110 },
         {
         {
           label: '工单类型',
           label: '工单类型',
@@ -482,10 +472,9 @@ export default {
           width: 80,
           width: 80,
         },
         },
         {
         {
-          label: '工单标题',
-          key: 'title',
-          minWidth: 120,
-          align: 'left',
+          label: '工单状态',
+          key: 'orderStatusTxt',
+          width: 80,
         },
         },
         {
         {
           label: '负责人',
           label: '负责人',
@@ -499,12 +488,6 @@ export default {
         },
         },
 
 
         {
         {
-          label: '工单状态',
-          key: 'orderStatusTxt',
-          width: 80,
-        },
-
-        {
           label: '创建时间',
           label: '创建时间',
           key: 'createTime',
           key: 'createTime',
           width: 130,
           width: 130,
@@ -567,6 +550,40 @@ export default {
     },
     },
   },
   },
   methods: {
   methods: {
+    cellClassName({ row, columnIndex }) {
+      if (
+        (row.orderStatus === 'TO_BE_ASSIGN' ||
+          row.orderStatus === 'TO_BE_CONFIRMED' ||
+          row.orderStatus === 'IN_PROGRESS') &&
+        columnIndex === 4
+      ) {
+        return 'order-blue'
+      }
+      if (
+        row.orderStatus === 'PRE_HANDLING' &&
+        columnIndex === 4 &&
+        row.sign === 1
+      ) {
+        return 'order-red'
+      }
+      if (
+        row.orderStatus === 'PRE_HANDLING' &&
+        columnIndex === 4 &&
+        row.sign === 0
+      ) {
+        return 'order-green'
+      }
+      if (
+        row.orderStatus === 'PRE_HANDLING' &&
+        columnIndex === 4 &&
+        !row.sign
+      ) {
+        return 'order-orange'
+      }
+      if (columnIndex === 4) {
+        return 'order-grey'
+      }
+    },
     async getOrderTypes() {
     async getOrderTypes() {
       try {
       try {
         const res = await getOrderType()
         const res = await getOrderType()
@@ -665,7 +682,7 @@ export default {
       }
       }
       try {
       try {
         const res = await workAssigned(
         const res = await workAssigned(
-          this.selections[0].id,
+          this.currentRowId,
           this.user,
           this.user,
         )
         )
         if (res.code === 200) {
         if (res.code === 200) {
@@ -762,6 +779,54 @@ export default {
   overflow: hidden;
   overflow: hidden;
 
 
   &::v-deep {
   &::v-deep {
+    .order-blue {
+      background-color: #29b6f6 !important;
+      color: #fff;
+    }
+
+    .order-red {
+      background-color: #f44336 !important;
+      color: #fff;
+    }
+
+    .order-green {
+      background-color: #4caf50 !important;
+      color: #fff;
+    }
+
+    .order-orange {
+      background-color: #FB8C00 !important;
+      color: #fff;
+    }
+
+    .order-grey {
+      background-color: #bdbdbd !important;
+      color: #fff;
+    }
+    .set-blue {
+      margin-left: 20px;
+    }
+
+    .el-table tr {
+      position: relative;
+    }
+
+    .set-blue::after {
+      position: absolute;
+      content: '';
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      background-color: green;
+      border-radius: 50%;
+      left: 6px;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+
+    .order-title {
+      margin-left: 20px;
+    }
     .el-tree-node {
     .el-tree-node {
       font-size: 14px;
       font-size: 14px;
     }
     }