From cffba84e8f2d448283259f2b36c3b36df1916859 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E6=AD=A3=E6=98=93?= <zhaozhengyi1b@126.com>
Date: Wed, 3 Sep 2025 09:49:03 +0800
Subject: [PATCH] =?UTF-8?q?feat(mrp=E7=AE=A1=E7=90=86):=20=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0MRP=E6=B8=85=E5=8D=95=E5=AF=BC=E5=87=BA=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E5=B9=B6=E4=BC=98=E5=8C=96=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在MRP清单页面添加导出全部数据功能，支持分页获取数据并生成Excel文件
- 添加导出进度条显示导出进度
- 为表格添加总成编号、总成名称和参考时间段列
- 统一容器样式为app-container
- 优化按钮大小和样式
---
 .../mmMrpManagement/MrpList.vue               | 153 +++++++++++++++++-
 .../mmMrpManagement/WorkOrder.vue             |   2 +-
 2 files changed, 149 insertions(+), 6 deletions(-)

diff --git a/src/views/materialManagement/mmMrpManagement/MrpList.vue b/src/views/materialManagement/mmMrpManagement/MrpList.vue
index 7ff7cca..6afd36a 100644
--- a/src/views/materialManagement/mmMrpManagement/MrpList.vue
+++ b/src/views/materialManagement/mmMrpManagement/MrpList.vue
@@ -4,7 +4,7 @@
  * @Date: (2025-08-13)
 -->
 <template>
-  <div>
+  <div class="app-container">
     <el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch" @submit.prevent>
       <el-form-item label="线别" prop="lineCode">
         <el-select v-model="queryParams.lineCode" placeholder="请选择线别">
@@ -24,18 +24,31 @@
     <!-- 工具区域 -->
     <el-row :gutter="15" class="mb10">
       <el-col :span="1.5">
-        <el-button type="primary" plain @click="openGenerateMrpDialog">手动更新MRP清单
+        <el-button type="primary" size="mini" plain @click="openGenerateMrpDialog">手动更新MRP清单
         </el-button>
       </el-col>
+      <el-col :span="1.5">
+        <el-button type="success" icon="el-icon-download" size="mini" :disabled="loading"
+          @click="handleExportAll">导出全部数据</el-button>
+      </el-col>
       <right-toolbar :show-search.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
     </el-row>
+    
+    <!-- 添加进度条组件 -->
+    <el-row v-if="exportProgress > 0 && exportProgress < 100">
+      <el-col :span="4"><span>Excel导出进度:</span></el-col>
+      <el-col :span="20"><el-progress :percentage="exportProgress" show-text></el-progress></el-col>
+    </el-row>
 
     <el-table :data="dataList" v-loading="loading" ref="table" border header-cell-class-name="el-table-header-cell"
       highlight-current-row @sort-change="sortChange">
       <el-table-column type="index" width="50" align="center" />
       <el-table-column prop="lineCode" label="线别" align="center" />
+      <el-table-column prop="productionCode" label="总成编号" align="center" />
+      <el-table-column prop="productionName" label="总成名称" align="center" />
       <el-table-column prop="materialCode" label="物料编号" align="center" />
       <el-table-column prop="materialName" label="物料名称" align="center" />
+      <el-table-column prop="issuanceTime" label="参考时间段" align="center" />
       <el-table-column prop="quantity" label="数量" align="center" />
       <el-table-column prop="createdBy" label="创建人" align="center" />
       <el-table-column prop="createdTime" label="创建时间" />
@@ -71,6 +84,8 @@
 </template>
 
 <script>
+import { saveAs } from 'file-saver'
+import ExcelJS from 'exceljs'
 import {
   listMmMrp, GenerateLineMmMrp
 }
@@ -78,6 +93,8 @@ import {
 
 export default {
   name: 'mmMrpManagement',
+  components: {
+  },
   data() {
     // 线别选项 (1-28)
     const lineOptions = []
@@ -115,7 +132,8 @@ export default {
       mrpRules: {
         lineCode: [{ required: true, message: '请选择线别', trigger: 'change' }],
         workOrderDate: [{ required: true, message: '请选择日期', trigger: 'change' }]
-      }
+      },
+      exportProgress: 0, // 导出进度
     }
   },
   created() {
@@ -197,7 +215,132 @@ export default {
           })
         }
       })
-    }
+    },
+    // 生成Excel文件
+    async generateExcel(allData) {
+      const workbook = new ExcelJS.Workbook()
+      const worksheet = workbook.addWorksheet('MRP清单')
+
+      // 构建表头
+      const header = [
+        '线别',
+        '总成编号',
+        '总成名称',
+        '物料编号',
+        '物料名称',
+        '参考时间段',
+        '数量',
+        '创建人',
+        '创建时间'
+      ]
+      const headerRow = worksheet.addRow(header)
+      headerRow.eachCell((cell) => {
+        cell.fill = {
+          type: 'pattern',
+          pattern: 'solid',
+          fgColor: { argb: 'FF2D3D51' },
+        }
+        cell.font = { color: { argb: 'FFFFFFFF' }, size: 16 }
+        cell.border = {
+          top: { style: 'thin', color: { argb: 'FF161823' } },
+          left: { style: 'thin', color: { argb: 'FF161823' } },
+          bottom: { style: 'thin', color: { argb: 'FF161823' } },
+          right: { style: 'thin', color: { argb: 'FF161823' } },
+        }
+      })
+
+      // 添加数据
+      allData.forEach((rowData) => {
+        const rowValues = [
+          rowData.lineCode,
+          rowData.productionCode,
+          rowData.productionName,
+          rowData.materialCode,
+          rowData.materialName,
+          rowData.issuanceTime,
+          rowData.quantity,
+          rowData.createdBy,
+          rowData.createdTime
+        ]
+        worksheet.addRow(rowValues)
+      })
+
+      // 设置单元格样式
+      worksheet.eachRow((row, rowIndex) => {
+        if (rowIndex > 1) { // 跳过表头
+          row.eachCell((cell) => {
+            cell.border = {
+              top: { style: 'thin', color: { argb: 'FF161823' } },
+              left: { style: 'thin', color: { argb: 'FF161823' } },
+              bottom: { style: 'thin', color: { argb: 'FF161823' } },
+              right: { style: 'thin', color: { argb: 'FF161823' } },
+            }
+            cell.font = { size: 14, bold: true }
+          })
+        }
+      })
+
+      // 调整列宽
+      header.forEach((_, index) => {
+        worksheet.columns[index].width = 20
+      })
+
+      return workbook
+    },
+    // 导出全部数据
+    async handleExportAll() {
+      this.loading = true
+      this.exportProgress = 0
+      try {
+        // 计算总页数
+        const totalPages = Math.ceil(this.total / this.queryParams.pageSize)
+        const allData = []
+
+        // 分页获取数据
+        for (let page = 1; page <= totalPages; page++) {
+          const params = { ...this.queryParams, pageNum: page }
+          params.workOrderDate = this.$dayjs(params.workOrderDate).format('YYYY-MM-DD')
+          const res = await listMmMrp(params)
+          if (res.code === 200) {
+            allData.push(...res.data.result)
+          }
+          // 更新进度
+          this.exportProgress = Math.round((page / totalPages) * 100)
+        }
+        
+        // 生成Excel文件
+        const workbook = await this.generateExcel(allData.sort((a, b) => {
+          // 先按线别升序排序
+          if (a.lineCode !== b.lineCode) {
+            return a.lineCode.localeCompare(b.lineCode, 'zh-CN');
+          }
+          // 同线别内按参考时间段升序排序
+          return new Date(a.issuanceTime) - new Date(b.issuanceTime);
+        }))
+        const buffer = await workbook.xlsx.writeBuffer()
+        const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
+        saveAs(blob, `MRP清单_线别${this.queryParams.lineCode || '全部'}_日期${this.queryParams.workOrderDate}_${this.$dayjs().format('YYYY-MM-DD_HH-mm-ss')}.xlsx`)
+        
+        this.exportProgress = 100
+        this.$modal.msgSuccess('导出成功')
+      } catch (error) {
+        console.error('导出全部数据失败:', error)
+        this.$modal.msgError('导出失败')
+      } finally {
+        this.loading = false
+        // 导出完成或出错，隐藏进度条
+        setTimeout(() => {
+          this.exportProgress = 0
+        }, 1000)
+      }
+    },
   }
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+/* 添加进度条样式 */
+.el-progress {
+  margin-top: 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/materialManagement/mmMrpManagement/WorkOrder.vue b/src/views/materialManagement/mmMrpManagement/WorkOrder.vue
index 93295d7..8b8fa51 100644
--- a/src/views/materialManagement/mmMrpManagement/WorkOrder.vue
+++ b/src/views/materialManagement/mmMrpManagement/WorkOrder.vue
@@ -4,7 +4,7 @@
  * @Date: (2025-08-13)
 -->
 <template>
-    <div>
+    <div class="app-container">
         <el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch" @submit.prevent>
             <div>
                 <el-form-item label="工单日期" prop="workorderDate">