refactor(组件): 重构产品与原材料信息组件,使用直接传递对象替代ID映射

将ProductInfo和RawMaterialInfo组件从基于ID映射数据改为直接接收product/material对象
移除对vuex state的依赖和相关的计算属性
创建缓存版本组件ProductInfoCache和RawMaterialInfoCache
更新所有使用这些组件的视图文件以传递完整对象
This commit is contained in:
砂糖
2025-11-15 16:04:41 +08:00
parent 9e02caecf2
commit ef3a764b19
15 changed files with 291 additions and 85 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div v-loading="loading" loading-text="加载中...">
<div>
<!-- 作用域插槽 -->
<span class="material-name" @click.stop="showDetail = true">
<slot name="default" :material="material">
@@ -34,7 +34,6 @@
</template>
<script>
import { mapState } from 'vuex';
import BomInfo from './BomInfo.vue';
export default {
@@ -43,8 +42,8 @@ export default {
BomInfo
},
props: {
materialId: {
type: [String, Number],
material: {
type: Object,
required: true
}
},
@@ -54,24 +53,24 @@ export default {
// material: {},
};
},
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
}
},
// 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) {