feat(wms): 添加表面处理字段显示和查询功能

在发货单明细表和钢卷选择器中添加表面处理字段的显示和查询功能
同时优化钢卷选择时的品质状态校验逻辑

klp-ui/src/components/CoilSelector/index.vue

@@ -47,6 +47,9 @@
           <muti-select v-model="queryParams.itemManufacturer" :options="dict.type.coil_manufacturer" placeholder="请选择厂家"
             clearable />
         </el-form-item>
+        <el-form-item label="表面处理">
+          <el-input v-model="queryParams.itemSurfaceTreatmentDesc" placeholder="请输入表面处理" clearable size="small" />
+        </el-form-item>
         <el-form-item label="切边" prop="trimmingRequirement" v-if="orderBy">
           <el-select v-model="queryParams.trimmingRequirement" placeholder="请选择切边" clearable style="width: 100%">
             <el-option label="净边" value="净边" />
@@ -78,6 +81,7 @@
         <!-- 自定义列 -->
         <el-table-column v-for="column in renderColumns" :label="column.label" :align="column.align" :prop="column.prop"
           :width="column.width" :show-overflow-tooltip="column.showOverflowTooltip" />
+        <el-table-column v-if="orderBy" label="表面处理" prop="surfaceTreatmentDesc"></el-table-column>
         <el-table-column v-if="orderBy" label="品质" prop="qualityStatus"></el-table-column>
         <el-table-column v-if="orderBy" label="切边" prop="trimmingRequirement"></el-table-column>
         <el-table-column v-if="orderBy" label="包装" prop="packagingRequirement"></el-table-column>
@@ -95,6 +99,7 @@
           <!-- 自定义列 -->
           <el-table-column v-for="column in renderColumns" :label="column.label" :align="column.align"
             :prop="column.prop" :width="column.width" :show-overflow-tooltip="column.showOverflowTooltip" />
+          <el-table-column v-if="orderBy" label="表面处理" prop="surfaceTreatmentDesc"></el-table-column>
           <el-table-column v-if="orderBy" label="品质" prop="qualityStatus"></el-table-column>
           <el-table-column v-if="orderBy" label="切边" prop="trimmingRequirement"></el-table-column>
           <el-table-column v-if="orderBy" label="包装" prop="packagingRequirement"></el-table-column>
@@ -121,7 +126,10 @@
       <el-table v-if="multiple && selectedCoils.length > 0" :data="selectedCoils">
         <el-table-column v-for="column in renderColumns" :label="column.label" :align="column.align" :prop="column.prop"
           :width="column.width" :show-overflow-tooltip="column.showOverflowTooltip" />
+        <el-table-column v-if="orderBy" label="表面处理" prop="surfaceTreatmentDesc"></el-table-column>
         <el-table-column v-if="orderBy" label="品质" prop="qualityStatus"></el-table-column>
+        <el-table-column v-if="orderBy" label="切边" prop="trimmingRequirement"></el-table-column>
+        <el-table-column v-if="orderBy" label="包装" prop="packagingRequirement"></el-table-column>
 
         <el-table-column label="操作" width="50">
           <template slot-scope="scope">
@@ -518,8 +526,9 @@ export default {
         this.$message.warning('您没有权限选择此钢卷');
         return; // 终止后续逻辑
       }
-      if (this.disableO && row.qualityStatus == 'O') {
+      const disabledOList = ['O', 'C+', 'C', 'C-', 'D+', 'D', 'D-']
-        this.$message.warning('O卷不能选择');
+      if (this.disableO && disabledOList.includes(row.qualityStatus)) {
+        this.$message.warning(`${row.qualityStatus}卷不能选择`);
         return;
       }
       this.handleSelect(row);

klp-ui/src/views/wms/delivery/components/detailTable.vue

@@ -1,7 +1,8 @@
 <template>
-  <div v-loading="loading">
+  <div v-loading="loading" style="position: relative; top: 0; background-color: #f5f7fa;">
     <div v-if="waybillId">
-      <el-row :gutter="10" class="mb8">
+      <!-- 这一部分始终定在最上方 -->
+      <el-row :gutter="10" class="mb8" style="position: sticky; top: 0; z-index: 10; padding: 10px; background-color: #fff;">
         <el-col :span="2" style="font-weight: 900;">发货单明细</el-col>
         <el-col :span="1.5">
           <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
@@ -46,6 +47,7 @@
         </el-table-column>
         <el-table-column label="规格" align="center" prop="specification" />
         <el-table-column label="材质" align="center" prop="material" />
+        <el-table-column label="表面处理" align="center" prop="surfaceTreatmentDesc" />
         <!-- <el-table-column label="数量" align="center" prop="quantity" /> -->
         <el-table-column label="重量" align="center" prop="weight" />
         <!-- <el-table-column label="单价" align="center" prop="unitPrice" /> -->
@@ -238,6 +240,7 @@ export default {
           const coil = coilResponse.rows.find(c => c.coilId === item.coilId);
           if (coil) {
             item.actualWarehouseName = coil.actualWarehouseName;
+            item.surfaceTreatmentDesc = coil.surfaceTreatmentDesc;
           }
         });
       }

klp-ui/src/views/wms/delivery/waybill/index.vue

@@ -39,7 +39,8 @@
               </el-descriptions>
             </el-form-item>
           </el-form>
-          <div style="height: calc(100vh - 184px); overflow-y: scroll; overflow-x: hidden;">
+          <div style="height: calc(100vh - 204px); overflow: hidden; display: flex; flex-direction: column;">
+            <div :style="{ height: topHeight + 'px', overflow: 'auto' }">
               <el-table v-loading="loading" border :data="deliveryWaybillList" highlight-current-row
                 @row-click="handleRowClick">
                 <el-table-column label="发货单唯一ID" align="center" prop="waybillId" v-if="false" />
@@ -90,13 +91,16 @@
 
               <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
                 :limit.sync="queryParams.pageSize" @pagination="getList" />
+            </div>
 
-            <el-divider style="margin: 20px 0;" />
+            <!-- 可拖拽的分割线 -->
+            <div class="resizer" ref="resizer" @mousedown="startResize"></div>
 
+            <div :style="{ flex: 1, overflowY: 'auto', overflowX: 'hidden' }">
               <DeliveryWaybillDetail v-if="canEdit" ref="detailTable" :waybillId="waybillId" :coilList="coilList" />
               <el-empty v-else description="已发货，不可修改，点击打印查看详情" />
             </div>
-
+          </div>
         </el-card>
       </el-col>
     </el-row>
@@ -196,6 +200,8 @@ export default {
       // 发货单表格数据
       deliveryWaybillList: [],
       waybillId: null,
+      // 上部分高度
+      topHeight: 300,
       // 打印相关数据
       printDialogVisible: false,
       currentWaybill: {},
@@ -262,6 +268,33 @@ export default {
         this.planListOption = response.rows || [];
       });
     },
+    /** 开始拖拽 */
+    startResize(e) {
+      e.preventDefault();
+      // 记录初始位置
+      const container = this.$el.querySelector('.el-card__body');
+      const containerRect = container.getBoundingClientRect();
+      this.startY = e.clientY;
+      this.startTopHeight = this.topHeight;
+      document.addEventListener('mousemove', this.resize);
+      document.addEventListener('mouseup', this.stopResize);
+    },
+    /** 拖拽中 */
+    resize(e) {
+      const container = this.$el.querySelector('.el-card__body');
+      const containerRect = container.getBoundingClientRect();
+      // 基于初始位置计算相对变化
+      const deltaY = e.clientY - this.startY;
+      const newHeight = this.startTopHeight + deltaY;
+      if (newHeight > 100 && newHeight < containerRect.height - 100) {
+        this.topHeight = newHeight;
+      }
+    },
+    /** 结束拖拽 */
+    stopResize() {
+      document.removeEventListener('mousemove', this.resize);
+      document.removeEventListener('mouseup', this.stopResize);
+    },
     getList() {
       this.loading = true;
       // 确保查询参数包含planId
@@ -524,4 +557,42 @@ export default {
   font-size: 16px;
   font-weight: 500;
 }
+
+.resizer {
+  width: 100%;
+  height: 4px;
+  background-color: #818181;
+  cursor: row-resize;
+  position: relative;
+  transition: background-color 0.3s;
+}
+
+.resizer:hover {
+  background-color: #409eff;
+}
+
+.resizer::before {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 40px;
+  height: 2px;
+  background-color: #c0c4cc;
+  border-radius: 1px;
+  transition: background-color 0.3s;
+}
+
+.resizer:hover::before {
+  background-color: #409eff;
+}
+
+.resizer:active {
+  background-color: #409eff;
+}
+
+.resizer:active::before {
+  background-color: #fff;
+}
 </style>