pms 保养工单 距离保养 负数 红色字体标识

src/views/pms/iotmainworkorder/IotMainWorkOrderOptimize.vue

@@ -308,7 +308,9 @@
           <el-table-column :label="t('mainPlan.remainKm')"
                            align="center" prop="remainKm" :width="columnWidths.remainKm">
             <template #default="{ row }">
-              {{ row.remainKm != null ? row.remainKm.toFixed(2) : '-' }}
+              <span :class="{ 'negative-value': row.remainKm != null && row.remainKm < 0 }">
+                {{ row.remainKm != null ? row.remainKm.toFixed(2) : '-' }}
+              </span>
             </template>
           </el-table-column>
         </el-table-column>
@@ -330,7 +332,9 @@
           <el-table-column :label="t('mainPlan.remainH')"
                            align="center" prop="remainH" :width="columnWidths.remainH">
             <template #default="{ row }">
-              {{ row.remainH != null ? row.remainH.toFixed(2) : '-' }}
+              <span :class="{ 'negative-value': row.remainH != null && row.remainH < 0 }">
+                {{ row.remainH != null ? row.remainH.toFixed(2) : '-' }}
+              </span>
             </template>
           </el-table-column>
           <el-table-column
@@ -376,7 +380,9 @@
           <el-table-column :label="t('mainPlan.remainDay')"
                            align="center" prop="remainDay" :width="columnWidths.remainDay">
             <template #default="{ row }">
-              {{ row.remainDay ?? '-' }}
+              <span :class="{ 'negative-value': row.remainDay != null && row.remainDay < 0 }">
+                {{ row.remainDay ?? '-' }}
+              </span>
             </template>
           </el-table-column>
         </el-table-column>
@@ -3092,4 +3098,16 @@ const handleRowClick = (row) => {
   width: 100%;
   position: relative;
 }
+
+/* 负数值红色样式 */
+:deep(.negative-value) {
+  color: #f56c6c !important;
+  font-weight: 600;
+}
+
+/* 确保在表格单元格中正确显示 */
+:deep(.el-table .cell .negative-value) {
+  display: inline-block;
+  width: 100%;
+}
 </style>