feat: 优化产品信息展示组件，使用悬停弹窗替代对话框

refactor: 重构原材料信息组件，采用与产品信息一致的交互方式
fix: 移除酸连轧工序页面，该功能已迁移至其他模块
style: 调整元素阴影样式，移除不必要的样式属性
chore: 添加调试日志，便于追踪参数传递

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

@@ -1,40 +1,37 @@
 <template>
   <div>
-    <!-- 作用域插槽 -->
-    <span class="material-name" @click.stop="showDetail = true">
-      <slot name="default" :material="materialFull">
-        {{ materialFull.rawMaterialName || '未知' }}[{{ materialFull.specification || '无规格' }}] - (材质：{{ materialFull.material || '无材质' }})
-      </slot>
-    </span>
-    <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">{{ materialFull.rawMaterialId }}</el-descriptions-item> -->
+    <!-- 原材料名称（仅hover触发popover） -->
+    <el-popover
+      trigger="hover" 
+      placement="top" 
+      width="400" 
+      :visible-arrow="true"
+      append-to-body 
+      popper-class="raw-material-info-popover"
+    >
+      <!-- popover 内容：两列布局的描述列表 -->
+      <el-descriptions :column="2" class="popover-content">
         <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="材质">
-          {{ materialFull.material || '--' }}
-        </el-descriptions-item>
-        <el-descriptions-item label="表面处理">
-          {{ materialFull.surfaceTreatment || '--' }}
-        </el-descriptions-item>
-        <!-- 锌层 -->
-        <el-descriptions-item label="锌层">
-          {{ materialFull.zincLayer || '--' }}
-        </el-descriptions-item>
-        <!-- 厂家 -->
-        <el-descriptions-item label="厂家">
-          {{ materialFull.manufacturer || '--' }}
-        </el-descriptions-item>
+        <el-descriptions-item label="材质">{{ materialFull.material || '--' }}</el-descriptions-item>
+        <el-descriptions-item label="表面处理">{{ materialFull.surfaceTreatment || '--' }}</el-descriptions-item>
+        <el-descriptions-item label="锌层">{{ materialFull.zincLayer || '--' }}</el-descriptions-item>
+        <el-descriptions-item label="厂家">{{ materialFull.manufacturer || '--' }}</el-descriptions-item>
       </el-descriptions>
-      <!-- <BomInfo :bomId="material.bomId" /> -->
-    </el-dialog>
+
+      <!-- 触发元素（原材料名称文本） -->
+      <span slot="reference" class="material-name">
+        <slot name="default" :material="materialFull">
+          {{ materialFull.rawMaterialName || '未知' }}[{{ materialFull.specification || '无规格' }}] - (材质：{{ materialFull.material || '无材质' }})
+        </slot>
+      </span>
+    </el-popover>
   </div>
 </template>
 
 <script>
-import BomInfo from './BomInfo.vue';
+import BomInfo from './BomInfo.vue'; // 保留导入（如需使用可解除注释）
 
 export default {
   name: 'RawMaterialInfo',
@@ -44,19 +41,17 @@ export default {
   props: {
     material: {
       type: Object,
-      // required: true,
       default: () => ({})
     }
   },
   data() {
     return {
-      showDetail: false,
-      // material: {},
+      // 移除showDetail：hover触发无需弹窗控制变量
     };
   },
   computed: {
     materialFull() {
-      // 完整的material, 确保每个字段都有值
+      // 完整的material，确保每个字段有默认值
       if (!this.material) {
         return {};
       }
@@ -69,37 +64,13 @@ export default {
         surfaceTreatment: this.material.surfaceTreatment || '',
         zincLayer: this.material.zincLayer || '',
         manufacturer: this.material.manufacturer || '',
-      }
+      };
     }
   },
-  // computed: {
-  //   ...mapState({
-  //     materialMap: state => state.category.rawMaterialMap // 假设vuex中为material模块
-  //   }),
-  //   material() {
-  //     // 检查 materialMap 是否已加载
-  //     if (!this.materialMap || Object.keys(this.materialMap).length === 0) {
-  //       return {};
-  //     }
-  //     if (!this.materialId) {
-  //       return {};
-  //     }
-  //     return this.materialMap[this.materialId.toString()] || {};
-  //   },
-  //   loading() {
-  //     return !this.materialMap || Object.keys(this.materialMap).length === 0
-  //   }
-  // },
-  // watch: {
-  //   materialId: {
-  //     handler: function (newVal) {
-  //       const res = this.materialMap[newVal.toString()] ? this.materialMap[newVal.toString()] : {};
-  //       this.material = res;
-  //     },
-  //     immediate: true
-  //   }
-  // }
-}
+  methods: {
+    // 移除click事件相关方法：无需点击触发
+  },
+};
 </script>
 
 <style scoped>
@@ -107,5 +78,7 @@ export default {
   color: #1890ff;
   cursor: pointer;
   text-decoration: underline;
+  /* 优化hover触发区域 */
+  padding: 2px 4px;
 }
-</style>
+</style>