Excel导入导出下拉选项实现

<el-dropdown :disabled="enableMultipleSelection" @command="handleButtonExport">
	<joc-button :disabled="enableMultipleSelection" type="default" iconfont="icon-excel-down"
		sync>导出Excel</joc-button>
	<template #dropdown>
		<el-dropdown-menu>
			<el-dropdown-item command="systemMaterCode">使用[系统]物料代码</el-dropdown-item>
			<el-dropdown-item command="supplierMaterCode">使用[供应商]物料代码</el-dropdown-item>
		</el-dropdown-menu>
	</template>
</el-dropdown>

// 导出Excel
const handleButtonExport = (command: string | number | object) => {
	let row = tableRef.value?.getCurrentRecord()
	if (row) {
		let actions = ''
		switch (command) {
			case 'supplierMaterCode': {
				actions = '/PurchaseOrder/ExportOrderSupplierMapping'
			} break;
			default: {
				actions = '/PurchaseOrder/ExportOrder'
			} break;
		}

		ajax.postDownLoad(actions, { id: row.rowId }, {}, { timeout: 0 }).then(res => {
			ElMessage({
				message: '导出成功',
				type: 'success',
				plain: true
			})
		}).finally(() => {
		})
	} else {
		ElMessage({
			message: '没有选择数据',
			type: 'error',
			plain: true
		})
	}

}

<el-dropdown @command="handleButtonImport">
	<joc-button type="default" iconfont="icon-PC-Excel" sync>导入Excel数据</joc-button>
	<template #dropdown>
		<el-dropdown-menu>
			<el-dropdown-item command="systemMaterCode">使用[系统]物料代码</el-dropdown-item>
			<el-dropdown-item command="supplierMaterCode">使用[供应商]物料代码</el-dropdown-item>
		</el-dropdown-menu>
	</template>
</el-dropdown>

<excel-choose ref="excelChooseRef" style="display: none;" :showFilePath="false"
	:handleWorkBook="handleWorkBook">Excel单据导入</excel-choose>

import ExcelChoose from '@/components/ExcelChoose/Index.vue'
const excelChooseRef = ref<InstanceType<typeof ExcelChoose>>()

const uploadUrl = ref('')
const handleButtonImport = (command: string | number | object) => {
	switch (command) {
		case 'supplierMaterCode': {
			uploadUrl.value = '/purchaseOrder/importExcelConvertSupplierMapping'
		} break;
		default: {
			uploadUrl.value = '/purchaseOrder/importExcelConvert'
		} break;
	}

	excelChooseRef.value?.doSelectFile()
}



/**
 * Excel单据导入
 */
const handleWorkBook = (workbook: XLSX.WorkBook) => {

	const worksheetName = workbook.SheetNames[0];
	const worksheet = workbook.Sheets[worksheetName];

	var jsonData: any[] = XLSX.utils.sheet_to_json(worksheet, { header: 'A' });

	const data: XLSDataMain = {
		docNo: jsonData[0]['B'],
		docType: jsonData[0]['D'],
		// docDate: jsonData[0]['F'],
		deliveryDate: jsonData[0]['H'],
		organization03Code: jsonData[1]['B'],
		organization03Name: jsonData[1]['D'],
		organization04Code: jsonData[1]['F'],
		organization04Name: jsonData[1]['H'],
		supplierCode: jsonData[2]['B'],
		supplierName: jsonData[2]['D'],
		purchaseGroup: jsonData[2]['F'],
		amount: jsonData[2]['H'],
		remark: jsonData[3]['B'],
		items: jsonData.slice(5).map(item => {
			return {
				organization04Code: item['B'],
				organization04Name: item['C'],
				materialCode: item['D'],
				materialName: item['E'],
				unit: item['F'],
				quantity: item['G'],
				price: item['H'],
				amount: item['I'],
				remark: item['J']
			}
		})

	}

	ajax.postEx<FormData>(uploadUrl.value, data).then(res => {
		formEditRef.value?.showCreateFromExcel(res.data)
	})
}