mirror of
https://gitee.com/xiongmao1988/rax-medical.git
synced 2025-08-24 13:04:57 +08:00
84 lines
2.2 KiB
Vue
84 lines
2.2 KiB
Vue
<template>
|
|
<el-dialog v-model="dialogVisible" :title="title" width="50%">
|
|
<el-upload action="#" v-model:file-list="fileList" drag accept=".xls, .xlsx"
|
|
:auto-upload="false" :limit="1" :http-request="handleUpload" ref="uploadRef">
|
|
<div class="el-upload__text" style="padding: 40px 10px;font-size: 20px;">
|
|
将文件拖到此处，或 <em>点击上传</em>
|
|
</div>
|
|
<template #tip>
|
|
<div class="el-upload__tip" style="font-size: 16px;">
|
|
仅允许导入xls、xlsx格式文件。<span class="main-color" style="cursor: pointer;"
|
|
@click="downloadTemplate">下载模板</span>
|
|
</div>
|
|
</template>
|
|
</el-upload>
|
|
|
|
<div style="text-align: right;margin-top: 20px;">
|
|
<el-button class="f18" @click="dialogVisible = false">取消</el-button>
|
|
<el-button class="f18" type="primary" @click="importData">确认</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script lang='ts' setup>
|
|
import {ref} from 'vue'
|
|
import type {UploadUserFile} from 'element-plus'
|
|
import {ElMessage} from 'element-plus'
|
|
import {downBlobFile} from "@/utils/file-util";
|
|
import {handleHttpUploadUrl} from "@/api/file-upload";
|
|
|
|
const emit = defineEmits(['success', 'error'])
|
|
|
|
const props = defineProps({
|
|
title: String,
|
|
templateUrl: String, // 模板下载地址
|
|
importUrl: String, // 上传接口地址
|
|
})
|
|
|
|
const dialogVisible = ref(false)
|
|
const fileList = ref<UploadUserFile[]>([])
|
|
const uploadRef = ref()
|
|
|
|
defineExpose({
|
|
open,
|
|
close
|
|
})
|
|
|
|
function open() {
|
|
dialogVisible.value = true
|
|
}
|
|
|
|
function close() {
|
|
dialogVisible.value = false
|
|
}
|
|
|
|
const downloadTemplate = () => {
|
|
downBlobFile(props.templateUrl, {}, "temp.xlsx")
|
|
}
|
|
const importData = () => {
|
|
// console.log(fileList.value)
|
|
if (fileList.value.length === 0) {
|
|
ElMessage.warning('请上传符合格式的xls或xlsx文件')
|
|
return
|
|
}
|
|
uploadRef.value.submit()
|
|
// emit('error')
|
|
}
|
|
|
|
function handleUpload(options: any) {
|
|
handleHttpUploadUrl(options, props.importUrl).then((res: any) => {
|
|
if (res.code == 0) {
|
|
ElMessage.success('上传成功')
|
|
close()
|
|
emit('success')
|
|
} else {
|
|
ElMessage.error(res.msg ? res.msg : "上传失败")
|
|
emit("error");
|
|
}
|
|
})
|
|
}
|
|
|
|
</script>
|
|
|
|
<style lang='scss' scoped></style>
|