feat: 各模块支持导出

apps/web-antd/src/views/report/progress/modules/project.vue

@@ -1,12 +1,26 @@
 <script lang="ts" setup>
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import dayjs from 'dayjs';
+
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { getProgressByProjectPage } from '#/api/report/progress';
+import { exportProject, getProgressByProjectPage } from '#/api/report/progress';
 
 import { useProjectGridColumns, useProjectGridFormSchema } from '../data';
 
-const [Grid] = useVbenVxeGrid({
+/** 导出表格 */
+async function onExport(body: any) {
+  const formValues = await gridApi.formApi.getValues();
+  const data = await exportProject({ ...body, ...formValues });
+  downloadFileFromBlobPart({
+    fileName: `${body.filename}.xlsx`,
+    source: data,
+  });
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
   formOptions: {
     schema: useProjectGridFormSchema(),
     submitOnEnter: true,
@@ -29,11 +43,10 @@ const [Grid] = useVbenVxeGrid({
     pagerConfig: {
       enabled: true,
     },
-    exportConfig: {},
     toolbarConfig: {
       refresh: { code: 'query' },
       search: true,
-      // export: true,
+      export: true,
     },
     height: 'auto',
     rowConfig: {
@@ -51,6 +64,46 @@ const [Grid] = useVbenVxeGrid({
     virtualYConfig: {
       enabled: false,
     },
+    exportConfig: {
+      remote: true,
+      type: 'xlsx',
+      types: ['xlsx'],
+      mode: 'all',
+      modes: [
+        { label: '导出全部数据', value: 'all' },
+        { label: '导出当前页数据', value: 'current' },
+      ],
+      filename() {
+        return `项目进展数据${dayjs().format('YYYYMMDDHHmmss')}`;
+      },
+      sheetName() {
+        return `项目进展列表`;
+      },
+      slots: {
+        parameter: 'exportParameter',
+      },
+      async exportMethod({ options, $grid }) {
+        const proxyInfo = $grid?.getProxyInfo();
+        // 处理条件参数
+        const body = {
+          filename: options.filename,
+          sheetName: options.sheetName,
+          isHeader: options.isHeader,
+          original: options.original,
+          mode: options.mode,
+          pageNo: proxyInfo ? proxyInfo.pager.currentPage : null,
+          pageSize: proxyInfo ? proxyInfo.pager.pageSize : null,
+          ids:
+            options.mode === 'selected'
+              ? options.data.map((item) => item.id)
+              : [],
+          includeFields: options.columns.map((column) => {
+            return column.field;
+          }),
+        };
+        await onExport(body);
+      },
+    },
     headerCellStyle: { backgroundColor: '#fafafa' },
     spanMethod({ row, rowIndex, column, visibleData }) {
       const spanFields = ['projectName', 'customerName'];