feat(线圈统计): 增强线圈统计页面功能并优化展示

添加按实际物料类型分布统计接口支持
新增汇总数据展示区域，显示总卷数及重量统计
优化物料信息展示格式，增加规格和材质信息
重构产品及原材料信息组件，确保字段完整性
移除无用代码并简化统计逻辑

klp-ui/src/components/KLPService/Renderer/ProductInfo.vue

@@ -1,21 +1,18 @@
 <template>
   <div>
     <span class="product-name" @click.stop="clickHandle">
-      <slot name="default" :product="product">
-        {{ product && product.productName ? product.productName : '--' }}
+      <slot name="default" :product="productFull">
+        {{ productFull.productName || '--' }}
       </slot>
     </span>
     <el-dialog 
       :visible="showDetail" 
       @close="showDetail = false" 
-      :title="product && product.productName ? product.productName : '--' " 
+      :title="productFull.productName || '--' " 
       width="500px"
       append-to-body
     >
       <el-descriptions :column="1" border>
-        <!-- <el-descriptions-item label="产品ID">
-          {{ product.productId || '--' }}
-        </el-descriptions-item> -->
         <el-descriptions-item label="产品名称">
           {{ product.productName || '--' }}
         </el-descriptions-item>
@@ -71,6 +68,24 @@ export default {
       // product: {},
     };
   },
+  computed: {
+    productFull() {
+      // 完整的product, 确保每个字段都有值
+      if (!this.product) {
+        return {};
+      }
+      return {
+        productId: this.product.productId || '',
+        productName: this.product.productName || '',
+        productCode: this.product.productCode || '',
+        specification: this.product.specification || '',
+        material: this.product.material || '',
+        surfaceTreatment: this.product.surfaceTreatment || '',
+        zincLayer: this.product.zincLayer || '',
+        manufacturer: this.product.manufacturer || '',
+      }
+    }
+  },
   // computed: {
   //   ...mapState({
   //     productMap: state => state.category.productMap

klp-ui/src/components/KLPService/Renderer/RawMaterialInfo.vue

@@ -2,30 +2,30 @@
   <div>
     <!-- 作用域插槽 -->
     <span class="material-name" @click.stop="showDetail = true">
-      <slot name="default" :material="material">
-        {{ material.rawMaterialName ? material.rawMaterialName : '-' }}
+      <slot name="default" :material="materialFull">
+        {{ materialFull.rawMaterialName || '-' }}
       </slot>
     </span>
-    <el-dialog :visible="showDetail" @close="showDetail = false" :title="material.rawMaterialName" width="600px"
+    <el-dialog :visible="showDetail" @close="showDetail = false" :title="materialFull.rawMaterialName || '--'" width="600px"
       append-to-body>
       <el-descriptions :column="1" border>
-        <!-- <el-descriptions-item label="原材料ID">{{ material.rawMaterialId }}</el-descriptions-item> -->
-        <el-descriptions-item label="原材料名称">{{ material.rawMaterialName }}</el-descriptions-item>
-        <el-descriptions-item label="原材料编码">{{ material.rawMaterialCode }}</el-descriptions-item>
-        <el-descriptions-item label="规格">{{ material.specification }}</el-descriptions-item>
+        <!-- <el-descriptions-item label="原材料ID">{{ materialFull.rawMaterialId }}</el-descriptions-item> -->
+        <el-descriptions-item label="原材料名称">{{ materialFull.rawMaterialName || '--' }}</el-descriptions-item>
+        <el-descriptions-item label="原材料编码">{{ materialFull.rawMaterialCode || '--' }}</el-descriptions-item>
+        <el-descriptions-item label="规格">{{ materialFull.specification || '--' }}</el-descriptions-item>
         <el-descriptions-item label="材质">
-          {{ material.material || '--' }}
+          {{ materialFull.material || '--' }}
         </el-descriptions-item>
         <el-descriptions-item label="表面处理">
-          {{ material.surfaceTreatment || '--' }}
+          {{ materialFull.surfaceTreatment || '--' }}
         </el-descriptions-item>
         <!-- 锌层 -->
         <el-descriptions-item label="锌层">
-          {{ material.zincLayer || '--' }}
+          {{ materialFull.zincLayer || '--' }}
         </el-descriptions-item>
         <!-- 厂家 -->
         <el-descriptions-item label="厂家">
-          {{ material.manufacturer || '--' }}
+          {{ materialFull.manufacturer || '--' }}
         </el-descriptions-item>
       </el-descriptions>
       <!-- <BomInfo :bomId="material.bomId" /> -->
@@ -54,6 +54,24 @@ export default {
       // material: {},
     };
   },
+  computed: {
+    materialFull() {
+      // 完整的material, 确保每个字段都有值
+      if (!this.material) {
+        return {};
+      }
+      return {
+        rawMaterialId: this.material.rawMaterialId || '',
+        rawMaterialName: this.material.rawMaterialName || '',
+        rawMaterialCode: this.material.rawMaterialCode || '',
+        specification: this.material.specification || '',
+        material: this.material.material || '',
+        surfaceTreatment: this.material.surfaceTreatment || '',
+        zincLayer: this.material.zincLayer || '',
+        manufacturer: this.material.manufacturer || '',
+      }
+    }
+  },
   // computed: {
   //   ...mapState({
   //     materialMap: state => state.category.rawMaterialMap // 假设vuex中为material模块