angular 项目 实现下载excel

1：接API查询下载的内容：

this.mcsApplication.findApplication({ users_id, application_id, form_status, startTime, endTime }).subscribe((res: any) => {

console.log(res);  返回下载的内容

2：formStatusMap 代表了一个对象，它用于将数字状态码映射到对应的字符串状态。

const formStatusMap: { [key: number]: string } = {

        0: '待审核',

        1: '待主管签核',

        2: '待区域主管签核',

        3: '待审核',

        4: '待归还',

        5: '已归还/完成',

        6: '逾期',

        7: '驳回',

      };

3：如果等于200，返回下列，添加表头

if (res.code === 200) {

        const headers = ['表单号', '申请人工号', '申请人部门', '当前位置', '物料名称', '物料来源', '电话号码', '申请日期', '申请原因', '表单状态'];// 表头

        const dataSet = res.data.map(

(item: { applicationId: any;

usersId: any; department: any; currentLocation: any; materialName: any; materialOrigin: any; telephone: any; applicationDate: any; reason: any; formStatus: number; }) =>

{

        const date = new Date(item.applicationDate); // 将日期字符串转换为 Date 对象

          const formattedDate =

`${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}

-${date.getDate().toString().padStart(2, '0')}

${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}

:${date.getSeconds().toString().padStart(2, '0')}`; // 格式化日期为 "YYYY-MM-DD HH:mm:ss" 形式

          return {

            applicationId: item.applicationId, // 使用别名id替代原来的application_id

            usersId: item.usersId,

            department: item.department,

            currentLocation: item.currentLocation,

            materialName: item.materialName,

            materialOrigin: item.materialOrigin,

            telephone: item.telephone,

            applicationDate: formattedDate, // 使用别名startDate替代原来的startTime

            reason: item.reason,

            status: formStatusMap[item.formStatus as number], // 使用formStatusMap映射状态

          };

        });

        const wsData = [headers, ...dataSet.map((item: any) => Object.values(item))]; // 添加表头

        const ws = XLSX.utils.aoa_to_sheet(wsData);

根据工作表中每个单元格的内容长度，计算出每列的最大宽度

        const wsCols = wsData.reduce((acc: any, row: any) => {

          row.forEach((value: any, colIndex: any) => {

            const cellLength = String(value).length;

            if (!acc[colIndex] || cellLength > acc[colIndex]) {

              acc[colIndex] = cellLength;

            }

          });

          return acc;

        }, {});

        ws['!cols'] = Object.keys(wsCols).map((colIndex: any) => ({

          wch: wsCols[colIndex] + 1, // 添加额外的宽度空间

        }));

将工作簿对象转换为 Excel 文件，并提供下载链接的操作

 const wb = XLSX.utils.book_new();创建一个新的工作簿对象 wb

  将 ws 工作表添加到 wb 工作簿中，并指定工作表名称为 'Sheet1'

        XLSX.utils.book_append_sheet(wb, ws, 'Sheet1'); 

将 wb 工作簿转换为 Excel 文件，并传入输出格式 { bookType: 'xlsx', type: 'array' }

        const wbout = XLSX.write(wb, { bookType: 'xlsx', type: 'array' }); 

通过 Blob 构造函数包装成二进制对象，并设置 MIME 类型为 application/octet-stream

        const blob = new Blob([wbout], { type: 'application/octet-stream' });

        const url = window.URL.createObjectURL(blob);

1. 创建一个 a 元素用于下载文件，并将其添加到页面中。

2. 将生成的 URL 赋值给 a.href 属性，将文件名设置为 '物料申请表.xlsx'。

3. 触发 a.click() 方法，模拟点击下载链接，并开始下载 Excel 文件。

4. 使用 setTimeout 方法，在下载完成后等待一段时间移除 a 元素，并使用 URL.revokeObjectURL 方法释放 URL 对象。

        const a = document.createElement('a');

        document.body.appendChild(a);

        a.href = url;

        a.download = '物料申请表.xlsx'; // 修改文件名

        a.click();

        setTimeout(() => {

          document.body.removeChild(a);

          window.URL.revokeObjectURL(url);

        }, 0);

      }

    });