2024.12.06 产品文档收集-项目物料-量产BOM

src/views/modules/eam/eamProjectPartInfo.vue

@@ -477,36 +477,48 @@
         </el-row>
       </el-tab-pane>
       <el-tab-pane label="量产BOM" name="massProductionBOM">
-        <el-table
-          :data="projectPartBomList"
-          border
-          style="width: 100%;margin-top: 5px;"
-          :height="this.height + 50"
-          ref="projectBomTable"
-          v-loading="dataListLoading">
-          <el-table-column label="序号" type="index" align="center" :index="indexMethod"></el-table-column>
-          <el-table-column
-            v-for="(item,index) in columnProjectBomList" :key="index"
-            :sortable="item.columnSortable"
-            :prop="item.columnProp"
-            :header-align="item.headerAlign"
-            :show-overflow-tooltip="item.showOverflowTooltip"
-            :align="item.align"
-            :fixed="item.fixed==''?false:item.fixed"
-            :min-width="item.columnWidth"
-            :label="item.columnLabel">
-            <template slot-scope="scope">
-              <div v-if="item.columnProp === 'levels'">
-                <span v-if="scope.row.levels === 1">{{ '主BOM' }}</span>
-                <span v-else>{{ '第'+ scope.row.levels-1 + '层BOM' }}</span>
-              </div>
-              <div v-else>
-                <span v-if="!item.columnHidden">{{scope.row[item.columnProp]}}</span>
-                <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
-                                                   style="width: 100px; height: 80px"/></span>
-              </div>
-            </template>
-          </el-table-column>
+          <el-table
+            :data="flattenedData"
+            border
+            style="width: 100%; margin-top: 5px;"
+            :height="this.height + 50"
+            ref="projectBomTable"
+            v-loading="dataListLoading">
+            <!-- 数据列 -->
+            <el-table-column
+              v-for="(item, index) in columnProjectBomList"
+              :key="index"
+              :sortable="item.columnSortable"
+              :prop="item.columnProp"
+              :header-align="item.headerAlign"
+              :show-overflow-tooltip="item.showOverflowTooltip"
+              :align="item.align"
+              :fixed="item.fixed === '' ? false : item.fixed"
+              :min-width="item.columnWidth"
+              :label="item.columnLabel">
+              <template slot-scope="scope">
+                <div v-if="item.columnProp === 'levelCode'">
+                  <span v-if="scope.row.levelCode === '1'">{{ '主BOM' }}</span>
+                  <span v-else>{{ scope.row.levelCode }}</span>
+                </div>
+                <div v-else>
+                  <span v-if="!item.columnHidden">{{scope.row[item.columnProp]}}</span>
+                  <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
+                </div>
+              </template>
+            </el-table-column>
+
+            <!-- 展开/折叠按钮 -->
+            <el-table-column label="操作" align="center" width="80" fixed="right">
+              <template #default="scope">
+                <a
+                  type="text"
+                  @click="toggleRow(scope.row)"
+                  v-if="hasChildren(scope.row)">
+                  {{ scope.row.expanded ? '查看子物料' : '查看子物料' }}
+                </a>
+              </template>
+            </el-table-column>
         </el-table>
       </el-tab-pane>
     </el-tabs>
@@ -1319,7 +1331,8 @@ import {EventBus} from "../../../main";
         confirmatorySelection2: [],
         proofDocumentListDefinition: [],
         confirmProgressPusherList: [],
-        confirmProgressDocumentList: [],
+        confirmProgressDocumentList: [],  // 量产BOM原始平面数据数组
+        flattenedData: [],  // 量产BOM渲染的平面数据
         projectConfirmatorFileList: [],
         viewDocumentFileVisible: false,
         viewMassDocumentFileVisible: false,
@@ -2490,7 +2503,7 @@ import {EventBus} from "../../../main";
             sortLv: 0,
             status: true,
             fixed: '',
-            columnWidth: 100,
+            columnWidth: 145,
           },
           {
             userId: this.$store.state.user.name,
@@ -2500,7 +2513,7 @@ import {EventBus} from "../../../main";
             tableName: "项目物料BOM表",
             columnProp: 'partDesc2',
             headerAlign: "center",
-            align: "center",
+            align: "left",
             columnLabel: '物料描述',
             columnHidden: false,
             columnImage: false,
@@ -2508,7 +2521,7 @@ import {EventBus} from "../../../main";
             sortLv: 0,
             status: true,
             fixed: '',
-            columnWidth: 100,
+            columnWidth: 500,
           },
           {
             userId: this.$store.state.user.name,
@@ -2518,7 +2531,7 @@ import {EventBus} from "../../../main";
             tableName: "项目物料BOM表",
             columnProp: 'qtyAssembly',
             headerAlign: "center",
-            align: "center",
+            align: "right",
             columnLabel: '用量',
             columnHidden: false,
             columnImage: false,
@@ -2526,7 +2539,7 @@ import {EventBus} from "../../../main";
             sortLv: 0,
             status: true,
             fixed: '',
-            columnWidth: 100,
+            columnWidth: 150,
           },
           {
             userId: this.$store.state.user.name,
@@ -2536,7 +2549,7 @@ import {EventBus} from "../../../main";
             tableName: "项目物料表",
             columnProp: 'scrapFactor',
             headerAlign: "center",
-            align: "center",
+            align: "right",
             columnLabel: '损耗',
             columnHidden: false,
             columnImage: false,
@@ -2544,15 +2557,15 @@ import {EventBus} from "../../../main";
             sortLv: 0,
             status: true,
             fixed: '',
-            columnWidth: 100,
+            columnWidth: 150,
           },
           {
             userId: this.$store.state.user.name,
             functionId: 401005,
-            serialNumber: '401005Table1Levels',
+            serialNumber: '401005Table1LevelCode',
             tableId: "401005Table1",
             tableName: "项目物料表",
-            columnProp: 'levels',
+            columnProp: 'levelCode',
             headerAlign: "center",
             align: "center",
             columnLabel: 'BOM层级',
@@ -5178,9 +5191,34 @@ import {EventBus} from "../../../main";
         searchMassProductionBomList(inData).then(({data}) => {
           if (data && data.code === 0){
             this.projectPartBomList = data.list;
+            // 初始化平面数据
+            this.flattenedData = this.projectPartBomList.filter(item => item.levelCode.split('.').length === 1);
           }
         })
       },
+      // 检查是否有子级
+      hasChildren(row) {
+        return this.projectPartBomList.some(item => item.levelCode.startsWith(`${row.levelCode}.`));
+      },
+      // 展开或收起行
+      toggleRow(row) {
+        if (row.expanded) {
+          // 收起：移除子级数据
+          this.flattenedData = this.flattenedData.filter(item => !item.levelCode.startsWith(`${row.levelCode}.`));
+          row.expanded = false;
+        } else {
+          // 展开：加载子级数据
+          const children = this.projectPartBomList.filter(item =>
+            item.levelCode.startsWith(`${row.levelCode}.`) &&
+            item.levelCode.split('.').length === row.levelCode.split('.').length + 1
+          );
+
+          // 插入子级数据
+          const rowIndex = this.flattenedData.indexOf(row);
+          this.flattenedData.splice(rowIndex + 1, 0, ...children);
+          row.expanded = true;
+        }
+      },
       // 列表表格选择替换
       tabClick (tab, event) {
         // 刷新列表数据
@@ -5203,6 +5241,8 @@ import {EventBus} from "../../../main";
         }
         if (this.activeName == 'massProductionBOM' && this.proofingCurrentRow.finalPartNo !== '' && this.proofingCurrentRow.finalPartNo !== null){
           this.searchMassProductionBomList()
+        } else {
+          this.flattenedData = []
         }
       },
       //获取按钮的权限数据