refactor(wms): 替换钢卷卡片为表格展示并优化布局

将多个视图中的钢卷卡片组件替换为KLPTable表格组件，统一展示钢卷信息
添加浮动层配置显示详细字段，优化操作按钮布局
调整页面列宽比例，简化操作记录卡片样式

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

@@ -45,12 +45,49 @@
           </el-form>
 
           <!-- 物料卡片列表 -->
-          <div v-loading="materialLoading" class="card-grid-container">
-            <div v-if="materialCoilList.length === 0" class="empty-state">
+          <div v-loading="materialLoading">
+            <!-- <div v-if="materialCoilList.length === 0" class="empty-state">
               <i class="el-icon-box"></i>
               <p>暂无待领物料</p>
-            </div>
-            <coil-card v-for="(item, index) in materialCoilList" :key="item.coilId || index" :coil="item"
+            </div> -->
+            <KLPTable :data="materialCoilList" height="calc(100vh - 340px)" :floatLayer="true" :floatLayerConfig="floatLayerConfig">
+              <el-table-column prop="currentCoilNo" label="当前钢卷号">
+                <template slot-scope="scope">
+                  <current-coil-no :current-coil-no="scope.row.currentCoilNo" />
+                </template>
+              </el-table-column>
+              <el-table-column prop="enterCoilNo" label="入场钢卷号" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="supplierCoilNo" label="厂家卷号" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="warehouseName" label="逻辑库区" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="specification" label="规格" width="100" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="netWeight" label="净重" width="100" show-overflow-tooltip></el-table-column>
+              <el-table-column prop="action" label="操作" width="400">
+                <template slot-scope="scope">
+                  <el-button v-loading="buttonLoading" style="margin-left: 0px; padding: 4px !important;" type="default"
+                    size="mini" icon="el-icon-view" @click="handlePreviewLabel(scope.row)" title="预览标签">预览</el-button>
+                  <el-button v-loading="buttonLoading" style="margin-left: 0px; padding: 4px !important;" type="default"
+                    size="mini" icon="el-icon-printer" @click="handlePrintLabel(scope.row)" title="打印标签">打印</el-button>
+                  <el-button type="warning" icon="el-icon-time" size="mini" @click="handleTrace(scope.row)"
+                    :loading="scope.row.picking" class="action-btn">追溯</el-button>
+
+                  <el-button type="primary" icon="el-icon-check" size="mini" @click="handleCorrectMaterial(scope.row)"
+                    :loading="scope.row.picking" class="action-btn">修正</el-button>
+                  <el-button type="danger" icon="el-icon-delete" size="mini" @click="hanleDeleteMaterial(scope.row)"
+                    :loading="scope.row.picking" class="action-btn">删除</el-button>
+
+                  <el-button v-if="scope.row.dataType == 1 && scope.row.status == 0"
+                    type="success" icon="el-icon-refresh"
+                    size="mini" @click="handleRestoreMaterial(scope.row)" :loading="scope.row.cancelling"
+                    class="action-btn">回滚</el-button>
+                  <el-button v-if="scope.row.dataType == 10 && scope.row.status == 0"
+                    type="success" icon="el-icon-refresh"
+                    size="mini" @click="handleForceInMaterial(scope.row)" :loading="scope.row.cancelling"
+                    class="action-btn">强制入库</el-button>
+                </template>
+              </el-table-column>
+
+            </KLPTable>
+            <!-- <coil-card v-for="(item, index) in materialCoilList" :key="item.coilId || index" :coil="item"
               :card-style="getBorderStyle(item)">
               <template slot="header">
                 <el-tag type="info" size="small" class="coil-no-tag" :style="getBorderStyle(item)">{{
@@ -98,7 +135,7 @@
                 <el-button type="danger" icon="el-icon-delete" size="mini" @click="hanleDeleteMaterial(item)"
                   :loading="item.picking" class="action-btn">删除</el-button>
               </template>
-            </coil-card>
+            </coil-card> -->
           </div>
 
           <!-- 分页 -->
@@ -294,7 +331,7 @@ export default {
   name: 'DoPage',
   dicts: ['action_type', 'coil_abnormal_code', 'coil_abnormal_position', 'coil_abnormal_degree', 'coil_quality_status', 'coil_business_purpose'],
   props: {
-    label: { 
+    label: {
       type: String,
       default: () => '酸连轧工序'
     },
@@ -448,6 +485,40 @@ export default {
       correctVisible: false,
       buttonLoading: false,
       userList: [],
+       floatLayerConfig: {
+        columns: [
+          { label: '入场钢卷号', prop: 'enterCoilNo' },
+          { label: '当前钢卷号', prop: 'currentCoilNo' },
+          { label: '厂家卷号', prop: 'supplierCoilNo' },
+          { label: '逻辑库位', prop: 'warehouseName' },
+          { label: '实际库位', prop: 'actualWarehouseName' },
+          { label: '物料类型', prop: 'materialType' },
+          { label: '班组', prop: 'team' },
+          { label: '净重', prop: 'netWeight' },
+          { label: '毛重', prop: 'grossWeight' },
+          { label: '备注', prop: 'remark' },
+          { label: '创建人', prop: 'createBy' },
+          { label: '创建时间', prop: 'createTime' },
+          { label: '更新人', prop: 'updateBy' },
+          { label: '更新时间', prop: 'updateTime' },
+          { label: '质量状态', prop: 'qualityStatus' },
+          { label: '原料材质', prop: 'packingStatus' },
+          { label: '切边要求', prop: 'edgeRequirement' },
+          { label: '包装要求', prop: 'packagingRequirement' },
+          { label: '物料名称', prop: 'itemName' },
+          { label: '材质', prop: 'material' },
+          { label: '规格', prop: 'specification' },
+          { label: '镀层质量', prop: 'zincLayer' },
+          { label: '厂家', prop: 'manufacturer' },
+          { label: '调制度', prop: 'temperGrade' },
+          { label: '镀层种类', prop: 'coatingType' },
+          { label: '实测长度(m)', prop: 'actualLength' },
+          { label: '实测宽度(m)', prop: 'actualWidth' },
+          { label: '实测厚度(m)', prop: 'actualThickness' },
+          { label: '钢卷表面处理', prop: 'coilSurfaceTreatment' },
+        ],
+        title: '详细信息'
+      },
     }
   },
   computed: {

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

@@ -36,8 +36,46 @@
         </div>
 
         <!-- 钢卷信息卡片 -->
-        <div v-loading="materialLoading" class="coil-info-container">
-          <div v-if="materialCoilList.length === 0" class="empty-state">
+        <div v-loading="materialLoading">
+          <KLPTable :data="materialCoilList" height="calc(100vh - 340px)" :floatLayer="true"
+            :floatLayerConfig="floatLayerConfig">
+            <el-table-column prop="currentCoilNo" label="当前钢卷号">
+              <template slot-scope="scope">
+                <current-coil-no :current-coil-no="scope.row.currentCoilNo" />
+              </template>
+            </el-table-column>
+            <el-table-column prop="enterCoilNo" label="入场钢卷号" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="supplierCoilNo" label="厂家卷号" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="warehouseName" label="逻辑库区" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="specification" label="规格" width="100" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="netWeight" label="净重" width="100" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="action" label="操作" width="400">
+              <template slot-scope="scope">
+                <el-button v-loading="buttonLoading" style="margin-left: 0px; padding: 4px !important;" type="default"
+                  size="mini" icon="el-icon-view" @click="handlePreviewLabel(scope.row)" title="预览标签">预览</el-button>
+                <el-button v-loading="buttonLoading" style="margin-left: 0px; padding: 4px !important;" type="default"
+                  size="mini" icon="el-icon-printer" @click="handlePrintLabel(scope.row)" title="打印标签">打印</el-button>
+                <el-button type="warning" icon="el-icon-time" size="mini" @click="handleTrace(scope.row)"
+                  :loading="scope.row.picking" class="action-btn">追溯</el-button>
+
+                <el-button type="primary" icon="el-icon-check" size="mini" @click="handleCorrectMaterial(scope.row)"
+                  :loading="scope.row.picking" class="action-btn">修正</el-button>
+                <el-button type="danger" icon="el-icon-delete" size="mini" @click="hanleDeleteMaterial(scope.row)"
+                  :loading="scope.row.picking" class="action-btn">删除</el-button>
+
+                <el-button v-if="scope.row.dataType == 1 && scope.row.status == 0"
+                  type="success" icon="el-icon-refresh"
+                  size="mini" @click="handleRestoreMaterial(scope.row)" :loading="scope.row.cancelling"
+                  class="action-btn">回滚</el-button>
+                <el-button v-if="scope.row.dataType == 10 && scope.row.status == 0"
+                  type="success" icon="el-icon-refresh"
+                  size="mini" @click="handleForceInMaterial(scope.row)" :loading="scope.row.cancelling"
+                  class="action-btn">强制入库</el-button>
+              </template>
+            </el-table-column>
+
+          </KLPTable>
+          <!-- <div v-if="materialCoilList.length === 0" class="empty-state">
             <i class="el-icon-box"></i>
             <p>未找到钢卷数据</p>
           </div>
@@ -85,7 +123,7 @@
               <el-button type="primary" icon="el-icon-check" size="mini" @click="handleCorrectMaterial(item)"
                 :loading="item.picking" class="action-btn">修正</el-button>
             </template>
-          </coil-card>
+          </coil-card> -->
         </div>
       </div>
 
@@ -131,7 +169,8 @@
             <el-table-column type="selection" width="55" align="center" />
             <el-table-column label="操作类型" align="center" prop="actionType" width="160">
               <template slot-scope="scope">
-                <el-select @change="handleStatusChange(scope.row)" v-model="scope.row.actionType" placeholder="请选择操作类型" clearable filterable>
+                <el-select @change="handleStatusChange(scope.row)" v-model="scope.row.actionType" placeholder="请选择操作类型"
+                  clearable filterable>
                   <el-option label="入库/收货操作" :value="401" />
                   <el-option label="发货操作" :value="402" />
                   <el-option label="移库操作" :value="403" />
@@ -421,6 +460,41 @@ export default {
       buttonLoading: false,
       userList: [],
 
+      floatLayerConfig: {
+        columns: [
+          { label: '入场钢卷号', prop: 'enterCoilNo' },
+          { label: '当前钢卷号', prop: 'currentCoilNo' },
+          { label: '厂家卷号', prop: 'supplierCoilNo' },
+          { label: '逻辑库位', prop: 'warehouseName' },
+          { label: '实际库位', prop: 'actualWarehouseName' },
+          { label: '物料类型', prop: 'materialType' },
+          { label: '班组', prop: 'team' },
+          { label: '净重', prop: 'netWeight' },
+          { label: '毛重', prop: 'grossWeight' },
+          { label: '备注', prop: 'remark' },
+          { label: '创建人', prop: 'createBy' },
+          { label: '创建时间', prop: 'createTime' },
+          { label: '更新人', prop: 'updateBy' },
+          { label: '更新时间', prop: 'updateTime' },
+          { label: '质量状态', prop: 'qualityStatus' },
+          { label: '原料材质', prop: 'packingStatus' },
+          { label: '切边要求', prop: 'edgeRequirement' },
+          { label: '包装要求', prop: 'packagingRequirement' },
+          { label: '物料名称', prop: 'itemName' },
+          { label: '材质', prop: 'material' },
+          { label: '规格', prop: 'specification' },
+          { label: '镀层质量', prop: 'zincLayer' },
+          { label: '厂家', prop: 'manufacturer' },
+          { label: '调制度', prop: 'temperGrade' },
+          { label: '镀层种类', prop: 'coatingType' },
+          { label: '实测长度(m)', prop: 'actualLength' },
+          { label: '实测宽度(m)', prop: 'actualWidth' },
+          { label: '实测厚度(m)', prop: 'actualThickness' },
+          { label: '钢卷表面处理', prop: 'coilSurfaceTreatment' },
+        ],
+        title: '详细信息'
+      },
+
       // 操作记录相关
       actionDialogVisible: false,
       actionLoading: false,