<template>
	<div>
		<el-dialog v-model="dialogVisible" :close-on-click-modal="false" draggable title="导入" width="800px"
			height="500px">
			<el-upload ref="uploadRef" class="upload-demo" drag v-model:file-list="fileListTemp" :data="formData"
				:action="uploadAction" :on-success="uploadSuccess" :on-error="uploadError">
				<el-icon class="el-icon--upload"><upload-filled /></el-icon>
				<div class="el-upload__text">
					拖 拽 文 件 至 此 或<em> 点 击 上 传</em>
				</div>

				<!-- <template #trigger>
					<el-button type="primary" style="margin-right:5px">选择文件</el-button>
				</template>
				 <template #tip>
				      <div class="el-upload__tip text-red">
				       请上传xls、xlsx格式的文件
				      </div>
				    </template>
				<el-button type="success" @click="handleImport" style="margin-right:5px">导入</el-button> -->
			</el-upload>
		</el-dialog>
	</div>
</template>


<script setup>
	import {
		ref,
		reactive,
		onMounted,
		getCurrentInstance,
		computed
	} from 'vue'

	const {
		proxy
	} = getCurrentInstance()

	import tools from '@/tools'
	const cardBodyStyle = ref(tools.style.card)
	const inputStyle = ref(tools.style.input)

	const props = defineProps({
		url: {
			type: String,
			default: () => ''
		},
		formData: {
			type: Object,
			default: () => {}
		}
	})


	// const formData = ref({})
	const fileListTemp = ref([])
	const uploadRef = ref()
	const uploadAction = ref(import.meta.env.VITE_BASE_API + '/' + props.url + '?json=' + encodeURIComponent(JSON
		.stringify(props.formData)))

	const handleImport = () => {
		uploadAction.value = import.meta.env.VITE_BASE_API + '/' + props.url
		console.log(uploadAction.value)
		// formData.value = {
		// 	fId: props.fId
		// }
		uploadRef.value.submit()
	}

	const emit = defineEmits(['importSuccess'])
	const uploadSuccess = (response, file, fileList) => {
		uploadRef.value.clearFiles() 
		if (response.code == 0) {
			ElMessage({
				type: 'success',
				message: '导入成功'
			})
			emit('importSuccess')
			close()
		} else {
			ElMessage({
				type: 'error',
				message: '导入失败:' + response.msg
			})
			close()
		}
	}

	const uploadError = (error) => { 
		ElMessage({
			type: 'error',
			message: '导入失败:' + error
		})
		close()
	}





	const dialogVisible = ref(false)
	const open = () => {
		dialogVisible.value = true
	}
	const close = () => {
		dialogVisible.value = false
	}
	defineExpose({
		open,
		close
	})
</script>

<style>
</style>