91 lines
2.9 KiB
Vue
91 lines
2.9 KiB
Vue
<template>
|
||
<el-dialog :title="title" :close-on-click-modal="false" append-to-body :visible.sync="visible" width="400px">
|
||
<el-upload ref="upload" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?ydtData=' + ydtData+ '&dYData=' + dYData" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
|
||
<i class="el-icon-upload" />
|
||
<div class="el-upload__text">
|
||
将文件拖到此处，或
|
||
<em>点击上传</em>
|
||
</div>
|
||
<div slot="tip" class="el-upload__tip">
|
||
<el-link type="info" style="font-size: 12px" @click="importTemplate">下载模板</el-link>
|
||
</div>
|
||
<div slot="tip" class="el-upload__tip" style="color: red">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
|
||
</el-upload>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||
<el-button @click="visible = false">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</template>
|
||
<script>
|
||
import { getToken } from '@/utils/auth';
|
||
|
||
export default {
|
||
name: 'UploadDialog',
|
||
data() {
|
||
return {
|
||
visible: false,
|
||
canSubmit: true,
|
||
isUploading: true,
|
||
ydtData: false,
|
||
dYData: false,
|
||
title: '学员信息导入',
|
||
upload: {
|
||
// 是否禁用上传
|
||
isUploading: false,
|
||
// 设置上传的请求头部
|
||
headers: { Authorization: 'Bearer ' + getToken() },
|
||
// 上传的地址
|
||
url: process.env.VUE_APP_BASE_API + '/zs/clue/importData'
|
||
}
|
||
};
|
||
},
|
||
methods: {
|
||
init(info = {}) {
|
||
this.visible = true;
|
||
this.ydtData = false;
|
||
this.ydtData = false;
|
||
this.canSubmit = true;
|
||
this.$nextTick(() => {
|
||
if (info) {
|
||
this.ydtData = info.ydtData;
|
||
this.dYData = info.dYData;
|
||
if(this.ydtData){
|
||
this.title = "一点通" + this.title;
|
||
|
||
}
|
||
if(this.dYData){
|
||
this.title = "抖音" + this.title;
|
||
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 下载模板操作 */
|
||
importTemplate() {
|
||
debugger
|
||
this.download('zs/clue/importTemplate?ydtData=' + this.ydtData + '&dYData=' + this.dYData, {}, `clue_template_${new Date().getTime()}.xlsx`);
|
||
},
|
||
// 文件上传中处理
|
||
handleFileUploadProgress(event, file, fileList) {
|
||
this.upload.isUploading = true;
|
||
},
|
||
// 文件上传成功处理
|
||
handleFileSuccess(response, file, fileList) {
|
||
this.visible = 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.msg + '</div>', '导入结果', {
|
||
dangerouslyUseHTMLString: true
|
||
});
|
||
this.$emit('refreshDataList');
|
||
},
|
||
// 提交上传文件
|
||
submitFileForm() {
|
||
this.$refs.upload.submit();
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|