产品和原材料配置BOM

klp-ui/src/views/wms/product/index.vue

@@ -135,15 +135,19 @@
             type="text"
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
-            
           >修改</el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
-            
           >删除</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-data-analysis"
+            @click="handleBom(scope.row)"
+          >BOM</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -243,6 +247,10 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog title="BOM" @close="bomDialogVisible = false" :visible.sync="bomDialogVisible" width="900px" append-to-body>
+      <BomPanel :id="bomId" type="product" @addBom="handleAddBom" :itemId="itemId" />
+    </el-dialog>
   </div>
 </template>
 
@@ -251,13 +259,15 @@ import { listProduct, getProduct, delProduct, addProduct, updateProduct } from "
 import CategorySelect from '@/components/KLPService/CategorySelect';
 import CategoryRenderer from '@/components/KLPService/Renderer/CategoryRenderer.vue';
 import UserSelect from '@/components/KLPService/UserSelect';
+import BomPanel from '../bom/components/BomPanel.vue';
 
 export default {
   name: "Product",
   components: {
     CategorySelect,
     CategoryRenderer,
-    UserSelect
+    UserSelect,
+    BomPanel
   },
   dicts: ['common_swicth'],
   data() {
@@ -311,28 +321,10 @@ export default {
         owner: [
           { required: true, message: "负责人不能为空", trigger: "blur" }
         ],
-        // baseMaterialId: [
-        //   { required: true, message: "基础材质分类ID不能为空", trigger: "blur" }
-        // ],
-        // surfaceTreatmentId: [
-        //   { required: true, message: "表面处理分类ID不能为空", trigger: "blur" }
-        // ],
-        // customerReqId: [
-        //   { required: true, message: "客户需求分类ID不能为空", trigger: "blur" }
-        // ],
-        // packagingId: [
-        //   { required: true, message: "包装分类ID不能为空", trigger: "blur" }
-        // ],
-        // thickness: [
-        //   { required: true, message: "厚度不能为空", trigger: "blur" }
-        // ],
-        // width: [
-        //   { required: true, message: "宽度不能为空", trigger: "blur" }
-        // ],
-        // innerDiameter: [
-        //   { required: true, message: "内径不能为空", trigger: "blur" }
-        // ],
-      }
+      },
+      bomDialogVisible: false,
+      bomId: undefined,
+      itemId: undefined,
     };
   },
   created() {
@@ -348,6 +340,11 @@ export default {
         this.loading = false;
       });
     },
+    handleAddBom(bom) {
+      console.log('回调触发', bom)
+      this.bomId = bom.bomId;
+      this.getList();
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -387,6 +384,11 @@ export default {
       this.resetForm("queryForm");
       this.handleQuery();
     },
+    handleBom(row) {
+      this.bomDialogVisible = true;
+      this.bomId = row.bomId;
+      this.itemId = row.productId;
+    },
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.productId)