前后端分离springboot+vue2查询数据导出为Excel

xml 复制代码

<dependency>
    <groupId>org.apache.poi</groupId>
    <artifactId>poi</artifactId>
    <version>5.2.3</version>
</dependency>
<dependency>
    <groupId>org.apache.poi</groupId>
    <artifactId>poi-ooxml</artifactId>
    <version>5.2.3</version>
</dependency>

复制代码

 // 条件导出流程
    @PostMapping({"/exportActivesByCondition"})
    public void exportActivesByCondition(@RequestBody Map<String, Object> paramMap, HttpServletResponse response) throws IOException {
       processService.exportActivesByCondition(paramMap, response);
    }

复制代码

@Override
    public void exportActivesByCondition(Map<String, Object> paramMap, HttpServletResponse response) throws IOException {
        Process process = new Process();
        String formType = (String)paramMap.get("formType");
        process.setTitle(formType);
        process.setOrderId((String)paramMap.get("orderId"));
        String currentUsername = BaseContext.getCurrentUsername();
     
        // 查询数据
        List<Process> processList = processMapper.exportActivesByCondition(process, currentUsername);

        // 2. 设置响应头
        response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
        response.setCharacterEncoding("UTF-8");

        String fileName = URLEncoder.encode("导出数据_" + System.currentTimeMillis(), "UTF-8")
                .replaceAll("\\+", "%20");
        response.setHeader("Content-Disposition",
                "attachment;filename*=utf-8''" + fileName + ".xlsx");

        // 使用POI创建Excel
        XSSFWorkbook workbook = new XSSFWorkbook();
        XSSFSheet sheet = workbook.createSheet("Sheet1");

        // 创建表头
        String[] headers = {"订单单号", "表单类型", "申请人", "流程状态"};
        XSSFRow headerRow = sheet.createRow(0);
        for (int i = 0; i < headers.length; i++) {
            XSSFCell cell = headerRow.createCell(i);
            cell.setCellValue(headers[i]);
        }

        // 填充数据
        for (int i = 0; i < processList.size(); i++) {
            XSSFRow dataRow = sheet.createRow(i + 1);
            Process p = processList.get(i);
            dataRow.createCell(0).setCellValue(p.getOrderId());
            dataRow.createCell(1).setCellValue(p.getTitle());
            dataRow.createCell(2).setCellValue(p.getApplicant());
            dataRow.createCell(3).setCellValue(p.getStage());
        }

        // 输出
        workbook.write(response.getOutputStream());
        workbook.close();
    }

复制代码

<el-button size="mini" @click="exportActives" :disabled="isSubmit">导出流程</el-button>

复制代码

 // 导出进行中流程
    async exportActives() {
      this.isSubmit = true  // 禁用
      try {
        // console.log(this.Parameters.stage)
        const response = await reqExportActivesByCondition(this.queryParams)
        downloadExcel(response, `流程数据_${new Date().getTime()}.xlsx`)
        this.$message.success('导出成功')
      } catch (error) {
        this.$message.error('导出失败，请重试', error)
        this.isSubmit = false  // 取消禁用
      }
      this.isSubmit = false  // 取消禁用
    },

复制代码

/**
 * 下载Excel文件
 */
export function downloadExcel(blob, fileName = `export_${Date.now()}.xlsx`) {
    // 创建下载链接
    const link = document.createElement('a')
    const url = URL.createObjectURL(blob)
    link.href = url
    link.download = fileName
    document.body.appendChild(link)
    link.click()
    document.body.removeChild(link)
    URL.revokeObjectURL(url)
}

复制代码

// 条件导出流程
export function reqExportActivesByCondition(params) {
    return request({
        url: '/process/exportActivesByCondition',
        method: 'post',
        data:  params ,
        responseType: 'blob'
    })
}