fix: 修复保养计划剩余值负数显示样式

- 为保养计划明细表的剩余时长、剩余公里数、剩余天数列增加负值识别
- 当剩余值小于 0 时使用危险色标红显示，便于识别超期/超量保养项

src/views/pms/maintenance/maintenance-plan-manage.vue

@@ -299,8 +299,32 @@ const checkRowFilled = (row: List) => {
   return runningTimeFilled && mileageFilled && naturalDateFilled
 }
 
-const cellClassName = ({ row, column }: { row: List; column: { type?: string } }) =>
-  column.type === 'index' && checkRowFilled(row) ? 'all-filled' : ''
+const remainValueMap = {
+  remainH,
+  remainKmometers: remainKm,
+  remainDay
+}
+type RemainColumnProp = keyof typeof remainValueMap
+
+const isNegativeValue = (value: DisplayValue) => typeof value === 'number' && value < 0
+
+const isRemainColumnProp = (property?: string): property is RemainColumnProp =>
+  !!property && property in remainValueMap
+
+const cellClassName = ({
+  row,
+  column
+}: {
+  row: List
+  column: { type?: string; property?: string }
+}) => {
+  if (column.type === 'index' && checkRowFilled(row)) return 'all-filled'
+
+  const getRemainValue = isRemainColumnProp(column.property)
+    ? remainValueMap[column.property]
+    : undefined
+  return getRemainValue && isNegativeValue(getRemainValue(row)) ? 'negative-remain-value' : ''
+}
 
 const getRowDisplayName = (row: List) => `${row.deviceCode || '-'}-${row.name || '-'}`
 
@@ -550,6 +574,7 @@ const editPlan = (row: List) => {
 </script>
 
 <template>
+  123
   <div
     v-loading="panelLoading"
     class="flex flex-col gap-4 h-[calc(100vh-20px-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height))]">
@@ -865,6 +890,10 @@ const editPlan = (row: List) => {
   color: #fff;
 }
 
+:deep(.zm-table .negative-remain-value .cell) {
+  color: var(--el-color-danger);
+}
+
 @media (width <= 768px) {
   .panel {
     padding: 16px 14px 4px;