feat(crm): 新增配卷相关API并重构合同、销售员页面的配卷管理

1.  新增crm/coil.js封装配卷相关接口，包括列表查询和统计汇总
2.  重构合同页面：移除冗余的coilList状态，改用分页API加载生产成果和发货配卷数据，新增分页和统计展示
3.  重构销售员页面：改用独立分页API获取生产成果和计划发货数据，新增分页、加载状态和全局统计
4.  升级CoilTable组件：支持分页功能和双维度统计（本页/全部）

klp-ui/src/views/crm/contract/components/ContractTabs.vue

@@ -2,12 +2,6 @@
   <div class="contract-tabs">
     <div v-if="orderId" class="tabs-content">
       <el-tabs v-model="activeTab" type="border-card">
-        <!-- <el-tab-pane label="订单编辑" name="edit" v-hasPermi="['crm:order:edit']">
-          <div class="order-detail" v-if="activeTab === 'edit'">
-            <el-descriptions title="订单明细" />
-            <OrderDetail :orderId="currentOrder.orderId" />
-          </div>
-        </el-tab-pane> -->
         <el-tab-pane label="财务状态" name="finance" v-hasPermi="['crm:order:finance']">
           <div class="order-finance" v-if="activeTab === 'finance'">
             <!-- 财务状态内容 -->
@@ -22,10 +16,12 @@
           </div>
         </el-tab-pane>
          <el-tab-pane label="生产成果" name="product">
-          <div class="order-record" v-if="activeTab === 'product'">
+          <div class="order-record" v-if="activeTab === 'product'" v-loading="productCoilLoading">
             <!-- 生产成果内容 -->
-            <CoilTable ref="productCoilTable" :data="productList || []" :showSelection="true"
-              @selection-change="handleProductSelectionChange">
+            <CoilTable ref="productCoilTable" :data="productCoilList || []" :showSelection="true"
+              :pagination="productPagination" :total-statistics="productTotalStatistics"
+              @selection-change="handleProductSelectionChange"
+              @page-change="handleProductPageChange">
               <template slot="filter-actions" slot-scope="{ selectedRows }">
                 <el-button type="primary" size="mini" icon="el-icon-refresh"
                   :disabled="!selectedRows.length" @click="handleBatchTransferContract(selectedRows)">
@@ -36,15 +32,17 @@
           </div>
         </el-tab-pane>
         <el-tab-pane label="发货配卷" name="coil">
-          <div class="order-record" v-if="activeTab === 'coil'">
+          <div class="order-record" v-if="activeTab === 'coil'" v-loading="deliveryCoilLoading">
             <!-- 发货配卷内容 -->
-            <CoilTable :data="coilList" />
+            <CoilTable :data="deliveryCoilList || []"
+              :pagination="deliveryPagination" :total-statistics="deliveryTotalStatistics"
+              @page-change="handleDeliveryPageChange" />
           </div>
         </el-tab-pane>
         <el-tab-pane label="发货单据" name="delivery">
           <div class="order-record" v-if="activeTab === 'delivery'">
             <!-- 发货单内容 -->
-            <DeliveryTable :data="deliveryWaybillList" />
+            <DeliveryTable :data="deliveryWaybillList || []" />
           </div>
         </el-tab-pane>
         <el-tab-pane label="合同附件" name="attachment" v-hasPermi="['crm:order:record']">
@@ -65,11 +63,6 @@
             <FileList :oss-ids="form.annexFiles" />
           </div>
         </el-tab-pane>
-        <!-- <el-tab-pane label="操作记录" name="record" v-hasPermi="['crm:order:record']">
-          <div class="order-record" v-if="activeTab === 'record'">
-            <OrderRecord :orderId="currentOrder.orderId" />
-          </div>
-        </el-tab-pane> -->
       </el-tabs>
 
       <!-- 批量转单 - 选择目标合同弹窗 -->
@@ -93,7 +86,6 @@
 </template>
 
 <script>
-// import OrderPage from "@/views/crm/order/index.vue";
 import CoilTable from "../../components/CoilTable.vue";
 import ContractSelect from "@/components/KLPService/ContractSelect";
 import { batchUpdateContractCoil } from "@/api/wms/coil";
@@ -107,6 +99,8 @@ import ReceiveTable from "../../components/ReceiveTable.vue";
 import OrderObjection from "../../components/OrderObjection.vue";
 import OrderRecord from "../../components/OrderRecord.vue";
 
+import { listDeliveryCoilsByOrder, getDeliveryCoilsStatisticsByOrder, listProductCoilsByContract, getProductCoilsStatisticsByContract } from "@/api/crm/coil";
+
 export default {
   name: "ContractTabs",
   components: {
@@ -125,14 +119,6 @@ export default {
       type: [Number, String],
       default: null
     },
-    coilList: {
-      type: Array,
-      default: () => []
-    },
-    productList: {
-      type: Array,
-      default: () => []
-    },
     loading: {
       type: Boolean,
       default: false
@@ -172,9 +158,50 @@ export default {
       batchTransferDialogVisible: false,
       batchTargetContractId: '',
       batchTransferCoilIds: [],
-      batchTransferLoading: false
+      batchTransferLoading: false,
+      productCoilList: [],
+      productCoilStatistics: {},
+      productPagination: { total: 0, currentPage: 1, pageSize: 20 },
+      productCoilLoading: false,
+      deliveryCoilList: [],
+      deliveryCoilStatistics: {},
+      deliveryPagination: { total: 0, currentPage: 1, pageSize: 20 },
+      deliveryCoilLoading: false,
     };
   },
+  computed: {
+    productTotalStatistics() {
+      const stats = this.productCoilStatistics;
+      if (!stats || Object.keys(stats).length === 0) return null;
+      return {
+        totalCoils: stats.total_count || 0,
+        totalNetWeight: stats.total_net_weight || 0
+      };
+    },
+    deliveryTotalStatistics() {
+      const stats = this.deliveryCoilStatistics;
+      if (!stats || Object.keys(stats).length === 0) return null;
+      return {
+        totalCoils: stats.total_count || 0,
+        totalNetWeight: stats.total_net_weight || 0
+      };
+    }
+  },
+  watch: {
+    orderId: {
+      handler(newVal, oldVal) {
+        if (newVal && newVal !== oldVal) {
+          this.productPagination.currentPage = 1;
+          this.deliveryPagination.currentPage = 1;
+          this.fetchDeliveryCoils();
+          this.fetchProductCoils();
+          this.fetchDeliveryCoilStatistics();
+          this.fetchProductCoilStatistics();
+        }
+      },
+      immediate: true
+    }
+  },
   methods: {
     handleProductSelectionChange(selection) {
       this.selectedProductRows = selection;
@@ -200,7 +227,8 @@ export default {
         this.$message.success(`成功将 ${coilIds.length} 卷钢卷转入目标合同`);
         this.batchTransferDialogVisible = false;
         // 刷新生产成果列表
-        this.$emit('refresh-product');
+        this.fetchProductCoilStatistics();
+        this.fetchProductCoils();
         // 清除选中
         if (this.$refs.productCoilTable) {
           this.$refs.productCoilTable.clearSelection();
@@ -230,6 +258,50 @@ export default {
         .replace('{i}', minutes)
         .replace('{s}', seconds);
     },
+    fetchDeliveryCoils() {
+      this.deliveryCoilLoading = true;
+      listDeliveryCoilsByOrder(this.orderId, {
+        pageNum: this.deliveryPagination.currentPage,
+        pageSize: this.deliveryPagination.pageSize
+      }).then(res => {
+        this.deliveryCoilList = res.rows || [];
+        this.deliveryPagination.total = res.total || 0;
+      }).finally(() => {
+        this.deliveryCoilLoading = false;
+      });
+    },
+    fetchProductCoils() {
+      this.productCoilLoading = true;
+      listProductCoilsByContract(this.orderId, {
+        pageNum: this.productPagination.currentPage,
+        pageSize: this.productPagination.pageSize
+      }).then(res => {
+        this.productCoilList = res.rows || [];
+        this.productPagination.total = res.total || 0;
+      }).finally(() => {
+        this.productCoilLoading = false;
+      });
+    },
+    fetchDeliveryCoilStatistics() {
+      getDeliveryCoilsStatisticsByOrder(this.orderId).then(res => {
+        this.deliveryCoilStatistics = res.data || {};
+      });
+    },
+    fetchProductCoilStatistics() {
+      getProductCoilsStatisticsByContract(this.orderId).then(res => {
+        this.productCoilStatistics = res.data || {};
+      });
+    },
+    handleProductPageChange({ currentPage, pageSize }) {
+      this.productPagination.currentPage = currentPage;
+      this.productPagination.pageSize = pageSize;
+      this.fetchProductCoils();
+    },
+    handleDeliveryPageChange({ currentPage, pageSize }) {
+      this.deliveryPagination.currentPage = currentPage;
+      this.deliveryPagination.pageSize = pageSize;
+      this.fetchDeliveryCoils();
+    },
   }
 };
 </script>