修改样式bug

src/views/productionPlan/components/newFactoryProductionScheduling/TaskConfigPanel.vue

@@ -153,6 +153,7 @@
             border
             size="small"
             :row-key="dispatchObjectRowKey"
+            :row-class-name="getDispatchTableRowClassName"
             height="100%"
             class="config-table dispatch-table"
           >
@@ -235,7 +236,15 @@
               width="120"
             >
               <template slot-scope="{ row }">
-                {{ getDispatchStatusText(row.status) }}
+                <span
+                  v-if="getDispatchStatusText(row.status)"
+                  :class="[
+                    'dispatch-status-badge',
+                    { 'is-assigned': isDispatchRowAssigned(row) }
+                  ]"
+                >
+                  {{ getDispatchStatusText(row.status) }}
+                </span>
               </template>
             </el-table-column>
             <el-table-column
@@ -1300,6 +1309,9 @@
         const statusText = this.getDispatchStatusText(data?.status);
         return statusText === '已派单' || statusText === '派单';
       },
+      getDispatchTableRowClassName({ row }) {
+        return this.isDispatchRowAssigned(row) ? 'dispatch-row-assigned' : '';
+      },
       normalizeDispatchAssignment(item) {
         const assigneeId =
           item.assigneeId || item.workStationId || item.workstationId || '';
@@ -2297,6 +2309,30 @@
     border-right: 0;
   }
 
+  .dispatch-status-badge {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 58px;
+    height: 24px;
+    padding: 0 10px;
+    border: 1px solid #d8e1eb;
+    border-radius: 12px;
+    color: #606b78;
+    background: #f8fafc;
+    font-size: 13px;
+    font-weight: 600;
+    line-height: 22px;
+    box-sizing: border-box;
+  }
+
+  .dispatch-status-badge.is-assigned {
+    border-color: #8fd19e;
+    color: #008000;
+    background: #eefaf0;
+    box-shadow: inset 0 0 0 1px rgba(48, 178, 74, 0.08);
+  }
+
   .dispatch-empty-control {
     display: inline-flex;
     align-items: center;
@@ -2471,6 +2507,27 @@
       background: #eef7ff;
     }
 
+    .el-table__body tr.dispatch-row-assigned > td.el-table__cell {
+      position: relative;
+      color: #52606d;
+      background: #f3fbf4;
+    }
+
+    .el-table__body tr.dispatch-row-assigned:hover > td.el-table__cell {
+      background: #eaf7ec;
+    }
+
+    .el-table__body tr.dispatch-row-assigned > td:first-child::before {
+      position: absolute;
+      top: 8px;
+      bottom: 8px;
+      left: 0;
+      width: 3px;
+      border-radius: 0 3px 3px 0;
+      background: #30b24a;
+      content: '';
+    }
+
     .el-table__body-wrapper::-webkit-scrollbar {
       width: 8px;
       height: 8px;
@@ -2505,6 +2562,22 @@
       background: #fbfdff;
     }
 
+    .dispatch-row-assigned .config-table-control .el-input__inner,
+    .dispatch-row-assigned
+      .config-table-control.el-date-editor
+      .el-input__inner {
+      color: #5f6977;
+      border-color: #b9d7bf;
+      background: #eef6f0;
+      box-shadow: inset 3px 0 0 #30b24a;
+      -webkit-text-fill-color: #5f6977;
+    }
+
+    .dispatch-row-assigned .config-table-control .el-input__prefix,
+    .dispatch-row-assigned .config-table-control .el-input__suffix {
+      color: #6aa875;
+    }
+
     .config-table-control .el-input__inner:focus {
       border-color: #1f8ceb;
       box-shadow: 0 0 0 2px rgba(31, 140, 235, 0.08);