48 lines
1005 B
Vue
48 lines
1005 B
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
import { downloadExcel } from '@/utils/download';
|
|
|
|
defineOptions({ name: 'ExportButton' });
|
|
|
|
interface Props {
|
|
/** 导出接口地址 */
|
|
exportApi: string;
|
|
/** 导出参数 */
|
|
exportParams?: Record<string, any>;
|
|
/** 按钮文本 */
|
|
text?: string;
|
|
/** 默认文件名 */
|
|
filename?: string;
|
|
}
|
|
|
|
const props = withDefaults(defineProps<Props>(), {
|
|
exportParams: () => ({}),
|
|
text: '导出',
|
|
filename: '导出数据.xlsx'
|
|
});
|
|
|
|
const loading = ref(false);
|
|
|
|
async function handleExport() {
|
|
if (loading.value) return;
|
|
|
|
loading.value = true;
|
|
try {
|
|
await downloadExcel(props.exportApi, props.exportParams, props.filename);
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<NButton size="small" ghost type="success" :loading="loading" @click="handleExport">
|
|
<template #icon>
|
|
<SvgIcon icon="si:file-download-fill" />
|
|
</template>
|
|
{{ props.text }}
|
|
</NButton>
|
|
</template>
|
|
|
|
<style scoped></style>
|