提交 6e0c70f4 作者: 无木

fix(import-excel): support datetime raw data import

importExcel支持导入原始日期时间数据

fixed: #1215
上级 01b667fa
...@@ -15,12 +15,25 @@ ...@@ -15,12 +15,25 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, unref } from 'vue'; import { defineComponent, ref, unref } from 'vue';
import XLSX from 'xlsx'; import XLSX from 'xlsx';
import { dateUtil } from '/@/utils/dateUtil';
import type { ExcelData } from './typing'; import type { ExcelData } from './typing';
export default defineComponent({ export default defineComponent({
name: 'ImportExcel', name: 'ImportExcel',
props: {
// 日期时间格式。如果不提供或者提供空值,将返回原始Date对象
dateFormat: {
type: String,
},
// 时区调整。实验性功能,仅为了解决读取日期时间值有偏差的问题。目前仅提供了+08:00时区的偏差修正值
// https://github.com/SheetJS/sheetjs/issues/1470#issuecomment-501108554
timeZone: {
type: Number,
default: 8,
},
},
emits: ['success', 'error'], emits: ['success', 'error'],
setup(_, { emit }) { setup(props, { emit }) {
const inputRef = ref<HTMLInputElement | null>(null); const inputRef = ref<HTMLInputElement | null>(null);
const loadingRef = ref<Boolean>(false); const loadingRef = ref<Boolean>(false);
...@@ -51,10 +64,28 @@ ...@@ -51,10 +64,28 @@
*/ */
function getExcelData(workbook: XLSX.WorkBook) { function getExcelData(workbook: XLSX.WorkBook) {
const excelData: ExcelData[] = []; const excelData: ExcelData[] = [];
const { dateFormat, timeZone } = props;
for (const sheetName of workbook.SheetNames) { for (const sheetName of workbook.SheetNames) {
const worksheet = workbook.Sheets[sheetName]; const worksheet = workbook.Sheets[sheetName];
const header: string[] = getHeaderRow(worksheet); const header: string[] = getHeaderRow(worksheet);
const results = XLSX.utils.sheet_to_json(worksheet); let results = XLSX.utils.sheet_to_json(worksheet, {
raw: true,
dateNF: dateFormat, //Not worked
}) as object[];
results = results.map((row: object) => {
for (let field in row) {
if (row[field] instanceof Date) {
if (timeZone === 8) {
row[field].setSeconds(row[field].getSeconds() + 43);
}
if (dateFormat) {
row[field] = dateUtil(row[field]).format(dateFormat);
}
}
}
return row;
});
excelData.push({ excelData.push({
header, header,
results, results,
...@@ -76,7 +107,7 @@ ...@@ -76,7 +107,7 @@
reader.onload = async (e) => { reader.onload = async (e) => {
try { try {
const data = e.target && e.target.result; const data = e.target && e.target.result;
const workbook = XLSX.read(data, { type: 'array' }); const workbook = XLSX.read(data, { type: 'array', cellDates: true });
// console.log(workbook); // console.log(workbook);
/* DO SOMETHING WITH workbook HERE */ /* DO SOMETHING WITH workbook HERE */
const excelData = getExcelData(workbook); const excelData = getExcelData(workbook);
......
<template> <template>
<PageWrapper title="excel数据导入示例"> <PageWrapper title="excel数据导入示例">
<ImpExcel @success="loadDataSuccess"> <ImpExcel @success="loadDataSuccess" dateFormat="YYYY-MM-DD">
<a-button class="m-3"> 导入Excel </a-button> <a-button class="m-3"> 导入Excel </a-button>
</ImpExcel> </ImpExcel>
<BasicTable <BasicTable
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论