feat(钢卷修正): 增加已发货钢卷的显示样式和标签

添加蓝色边框样式和"已发货"标签用于区分已发货钢卷，同时重构边框样式和类型标签为独立方法

klp-ui/src/views/wms/coil/do/correct.vue

@@ -7,7 +7,7 @@
           <div class="section-header">
             <h3 class="section-title">
               查找钢卷并修正
-              <span class="section-desc">绿色边框表示当前钢卷，灰色边框表示历史钢卷</span>
+              <span class="section-desc">绿色边框表示当前钢卷，灰色边框表示历史钢卷, 蓝色边框表示已发货钢卷</span>
             </h3>
 
             <el-button size="mini" icon="el-icon-refresh" @click="getMaterialCoil">刷新</el-button>
@@ -35,12 +35,12 @@
               <i class="el-icon-box"></i>
               <p>暂无待领物料</p>
             </div>
-            <!-- 根据item.dataType决定边框颜色，为0使用当前的颜色，为1使用绿色，为2使用黄色   -->
             <div v-for="(item, index) in materialCoilList" :key="item.coilId || index" class="material-card"
-              :style="item.dataType === 0 ? 'border: 1.5px solid #e4e7ed' : item.dataType === 1 ? 'border: 1.5px solid green' : 'border: 1.5px solid yellow'">
+              :style="getBorderStyle(item)">
               <div class="card-header">
                 <div class="header-left">
                   <el-tag type="info" size="small" class="coil-no-tag">{{ item.currentCoilNo }}</el-tag>
+                  <el-tag type="info" size="small" class="coil-no-tag" :style="getBorderStyle(item)">{{ getTypeLabel(item) }}</el-tag>
                   <span class="material-type">{{ item.materialType || '原料' }}</span>
                   <el-popover v-if="item.rawMaterial || item.product" placement="top" width="280" trigger="hover"
                     popper-class="material-params-popover">
@@ -383,7 +383,7 @@ export default {
         pageNum: 1,
         pageSize: 20,
         // dataType: 1,
-        status: 0,
+        // status: 0,
         enterCoilNo: null,
         currentCoilNo: null
       },
@@ -568,6 +568,41 @@ export default {
   },
   methods: {
     parseTime,
+    getBorderStyle(row) {
+      console.log(row);
+      // 已发货
+      if (row.status == 1) {
+        return {border: '1.5px solid #007bff'}
+      }
+      // 历史钢卷
+      if (row.dataType == 0) {
+        return {border: '1.5px solid #6c757d'}
+      }
+      // 当前钢卷
+      if (row.dataType == 1) {
+        return {border: '1.5px solid #28a745'}
+      }
+      // 还未入库的钢卷
+      if (row.dataType == 10) {
+        return {border: '1.5px solid #ffc107'}
+      }
+      return {border: '1.5px solid #e4e7ed'}
+    },
+    getTypeLabel(row) {
+      if (row.status == 1) {
+        return '已发货'
+      }
+      if (row.dataType == 0) {
+        return '历史钢卷'
+      }
+      if (row.dataType == 1) {
+        return '当前钢卷'
+      }
+      if (row.dataType == 10) {
+        return '还未入库的钢卷'
+      }
+      return '未知'
+    },
     /** 查询用户列表 */
     getUsers() {
       listUser({ pageNum: 1, pageSize: 1000 }).then(response => {