Files
dax-pay-ui/src/views/demo/excel/ImportExcel.vue
xingyu 35751068c5 refactor(demo): 重构demo页面组件为 script setup 语法 (#3293)
* refactor: charts demo use setup refactor

* refactor: demo use script setup refactor

* refactor: demo feat use script setup refactor

* fix: tab-params

* revert: settings.json

* style(demo->Modal1): loading text line height

* Update index.vue

---------

Co-authored-by: invalid w <wangjuesix@gmail.com>
2023-11-18 11:43:18 +08:00

47 lines
1.2 KiB
Vue

<template>
<PageWrapper title="excel数据导入示例">
<ImpExcel @success="loadDataSuccess" dateFormat="YYYY-MM-DD">
<a-button class="m-3"> 导入Excel </a-button>
</ImpExcel>
<BasicTable
v-for="(table, index) in tableListRef"
:key="index"
:title="table.title"
:columns="table.columns"
:dataSource="table.dataSource"
/>
</PageWrapper>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { ImpExcel, ExcelData } from '@/components/Excel';
import { BasicTable, BasicColumn } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
const tableListRef = ref<
{
title: string;
columns?: any[];
dataSource?: any[];
}[]
>([]);
function loadDataSuccess(excelDataList: ExcelData[]) {
tableListRef.value = [];
console.log(excelDataList);
for (const excelData of excelDataList) {
const {
header,
results,
meta: { sheetName },
} = excelData;
const columns: BasicColumn[] = [];
for (const title of header) {
columns.push({ title, dataIndex: title });
}
tableListRef.value.push({ title: sheetName, dataSource: results, columns });
}
}
</script>