feat():增加导出功能

master
zhang chengzhi 2024-08-11 15:20:13 +08:00
parent 1789f60443
commit 3461e9ad57
1 changed files with 124 additions and 0 deletions

View File

@ -0,0 +1,124 @@
<template>
<div>
<el-button
v-hasPermi="['system:user:import']"
icon="el-icon-upload2"
plain
size="mini"
type="info"
@click="handleImport"
>导入
</el-button>
<!-- 用户导入对话框 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" append-to-body width="400px">
<el-upload
ref="upload"
:action="upload.url + '?updateSupport=' + upload.updateSupport"
:auto-upload="false"
:disabled="upload.isUploading"
:headers="upload.headers"
:limit="1"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
accept=".xlsx, .xls"
drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
<div slot="tip" class="el-upload__tip text-center">
<div slot="tip" class="el-upload__tip">
<el-checkbox v-model="upload.updateSupport"/>
是否更新已经存在的用户数据
</div>
<span>仅允许导入xlsxlsx格式文件</span>
<el-link :underline="false" style="font-size:12px;vertical-align: baseline;" type="primary"
@click="importTemplate">下载模板
</el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
//jsjsjson,
//import from ',
import {getToken} from "@/utils/auth";
export default {
name:'Resource',
data() {
//"
return {
//
title: "",
//
upload: {
//
open: false,
//
title: "",
//
isUploading: false,
//
updateSupport: 0,
//
headers: {Authorization: "Bearer " + getToken()},
//
url: process.env.VUE_APP_BASE_API + "/system/user/importData"
},
};
},
methods: {
//
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
//
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.data.msg + "</div>", "导入结果", {dangerouslyUseHTMLString: true});
// this.getList();
},
//
submitFileForm() {
this.$refs.upload.submit();
},
/** 导入按钮操作 */
handleImport() {
this.upload.title = "用户导入";
this.upload.open = true;
},
/** 下载模板操作 */
importTemplate() {
this.download('system/user/importTemplate', {}, `user_template_${new Date().getTime()}.xlsx`)
},
},
// - 访this",
created() {
},
};
</script>
<style scoped>
</style>