feat: 迁移记录 - 迁移完成&失败信息样式

project/src/components/customManage/removeRecord.vue

@@ -37,7 +37,7 @@
       <el-table-column prop="status" label="转接状态" align="center" min-width="140">
         <template slot-scope="{ row }">
           <div class="status-wrap" >
-            <p :style="{ color: handleGetStatusDesc(row.status).labelColor }">{{ handleGetStatusDesc(row.status).label }}</p>
+            <p :style="{ color: handleGetStatusDesc(row).labelColor }">{{ handleGetStatusDesc(row).label }}</p>
             <template v-if="row.err_msg && row.err_msg.length">
               <template v-for="err in row.err_msg">
                 <el-tooltip v-if="err.length > 9" class="item" effect="dark" placement="left" :content="err">
@@ -75,7 +75,7 @@ const typesMap = new Map([
 const statusMap = new Map([
   [ 1, { label: '待迁移', labelColor: '#FFB055' } ],
   [ 2, { label: '迁移中', labelColor: '#448AFF' } ],
-  [ 3, { label: '迁移完成', labelColor: '#58BCA6' } ],
+  [ 3, { label: '迁移完成', labelColor: '#58BCA6', errorLabelColor: '#F03F5C' } ],
   [ -1, { label: '迁移失败', labelColor: '#F03F5C' } ],
 ])
 
@@ -147,8 +147,12 @@ export default {
         query: { record_id },
       })
     },
-    handleGetStatusDesc(status) {
-      return statusMap.get(Number(status)) || {}
+    handleGetStatusDesc({ status, err_msg }) {
+      let { label, labelColor, errorLabelColor } = statusMap.get(Number(status)) || {}
+      if (err_msg && err_msg.length && status == 3) { // 迁移完成 && 有错误信息 => 展示错误高亮颜色
+        labelColor = errorLabelColor
+      }
+      return { label, labelColor }
     },
     handleGetTypeName(type) {
       return typesMap.get(Number(type)) || '-'