优化

src/api/material/BOM.js

@@ -158,6 +158,18 @@ export async function getBomPageList(params) {
   return Promise.reject(new Error(res.data.message));
 }
 
+// 获取产品BOM列表
+export async function getBomPageCategoryId(params) {
+  const res = await request.get(`/main/bomCategory/pageByCategoryId`, { params });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+
+
+
 // 转换
 export async function convert(data) {
   const res = await request.post(`/main/bomCategory/convert`, data);

src/views/material/BOMmanage/components/detailedList.vue

@@ -0,0 +1,194 @@
+<template>
+    <div class="ele-body">
+      <el-card shadow="never">
+        <BOMSearch
+          @search="reload"
+          :statusOpt="statusOpt"
+          :categoryCode="where.categoryCode"
+        />
+        <ele-pro-table
+            ref="table"
+            :columns="columns"
+            :datasource="datasource"
+            :initLoad="false"
+            class="dict-table"
+            tool-class="ele-toolbar-actions"
+          >
+            <!-- 表头工具栏 -->
+            <template v-slot:action="{ row }">
+              <el-switch
+                :active-value="'1'"
+                :inactive-value="'0'"
+                @change="openBom(row, $event)"
+                v-model="row.status"
+              >
+              </el-switch>
+            </template>
+          </ele-pro-table>
+      </el-card>
+    </div>
+  </template>
+  
+  <script>
+    import BOMSearch from './BOM-search.vue';
+    import {  getBomPageCategoryId, startAndStop } from '@/api/material/BOM';
+  
+    export default {
+      name: 'SystemDictionary',
+      components: { BOMSearch },
+      data() {
+        return {
+          // 表格列配置
+          columns: [
+            {
+              label: '序号',
+              columnKey: 'index',
+              type: 'index',
+              width: 55,
+              align: 'center',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'code',
+              label: 'BOM编码',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'name',
+              label: 'BOM名称',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'categoryCode',
+              label: '产品编码',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'categoryName',
+              label: '产品名称',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'versions',
+              label: '版本'
+            },
+            {
+              prop: 'status ',
+              label: '状态',
+              formatter: (row) => {
+                return this.statusOpt[+row.status];
+              }
+            },
+            {
+              prop: 'createName',
+              label: '创建人',
+              showOverflowTooltip: true
+            },
+            {
+              prop: 'createTime',
+              label: '创建日期',
+              showOverflowTooltip: true
+            },
+            {
+              action: 'action',
+              slot: 'action',
+              label: '操作'
+            }
+          ],
+          statusOpt: {
+            '': '全部',
+            0: '已停用',
+            1: '已发布'
+          },
+          loading: false,
+          loadingInstance: null,
+          where: {},
+  
+          attrObj: {}
+
+        };
+      },
+      mounted() {
+     
+      },
+      props: {
+      attributeData: {
+        type: Object,
+        default: {}
+      }
+    },
+
+    watch: {
+      attributeData(val) {
+    this.attrObj = val
+
+    this.$nextTick(() => {
+          this.$refs.table.reload({
+            pageNum: 1,
+          });
+        });
+      }  
+    },
+  
+      methods: {
+
+        /* 启用关闭BOM */
+        openBom(row, boolean) {
+          this.loadingInstance = this.$loading({
+            lock: true,
+            text: boolean ? '启用中...' : '关闭中...',
+            background: 'rgba(0, 0, 0, 0.7)'
+          });
+          startAndStop({ id: row.id, status: row.status }).then(() => {
+            this.$message.success('操作成功');
+            this.loadingInstance.close();
+          });
+          setTimeout(() => {}, 2000);
+        },
+        /* 表格数据源 */
+        datasource({ where, page, limit }) {
+          return getBomPageCategoryId({
+            ...where,
+            pageNum: page,
+            size: limit,
+            categoryId: this.attrObj.categoryId,
+            bomType: this.attrObj.bomType,
+          });
+        },
+   
+        /* 刷新表格 */
+        reload(where) {
+          this.$refs.table.reload({ where });
+        },
+
+  
+  
+  
+      }
+    };
+  </script>
+  
+  <style lang="scss" scoped>
+    .ele-body {
+      height: 100%;
+      ::v-deep .el-card {
+        height: 100%;
+        .el-card__body {
+          height: 100%;
+          display: flex;
+          flex-direction: column;
+          .dict-table {
+            flex: 1;
+            overflow: hidden;
+            display: flex;
+            flex-direction: column;
+            .el-table {
+              flex: 1;
+              overflow-y: auto;
+            }
+          }
+        }
+      }
+    }
+  </style>
+  

src/views/material/BOMmanage/details.vue

@@ -123,8 +123,9 @@
               <el-tab-pane label="属性" name="属性">
                 <attribute :attributeData="currentNodeData"></attribute>
               </el-tab-pane>
-              <el-tab-pane label="文档" name="文档">
-                <document></document>
+              <el-tab-pane label="清单" name="清单">
+                <!-- <document></document> -->
+                 <detailedList  :attributeData="currentNodeData"></detailedList>
               </el-tab-pane>
               <el-tab-pane
                 v-if="currentNodeData.bomType == 2"
@@ -170,20 +171,22 @@
   import attribute from './components/attribute.vue';
   import routing from './components/routing.vue';
   import baseInfo from './components/baseInfo.vue';
-  import document from './components/document.vue';
+  // import document from './components/document.vue';
   import workmanship from './components/workmanship.vue';
   import bomTreeDialog from './components/bomTreeDialog.vue';
   import importDialog from "./qualityTesting/import-dialog.vue";
+  import detailedList from './components/detailedList.vue'
   export default {
     name: 'BOMmanage',
     components: {
       attribute,
       baseInfo,
-      document,
+      // document,
       workmanship,
       bomTreeDialog,
       routing,
-      importDialog
+      importDialog,
+      detailedList
     },
     data() {
       return {