|
@@ -34,16 +34,13 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
computed:{
|
|
|
- tips:{
|
|
|
- get(){
|
|
|
- // this.accept.
|
|
|
- },
|
|
|
- set(){},
|
|
|
- },
|
|
|
// 是否显示提示
|
|
|
showTip() {
|
|
|
return this.isShowTip && (this.fileType || this.fileSize);
|
|
|
},
|
|
|
+ accept(){
|
|
|
+ return this.fileType.map(item =>(`.${item}`)).join(',');
|
|
|
+ }
|
|
|
},
|
|
|
data(){
|
|
|
return {
|
|
@@ -51,21 +48,33 @@ export default {
|
|
|
visible:false,
|
|
|
loading:false,
|
|
|
fileList:[],
|
|
|
+ number: 0,
|
|
|
|
|
|
}
|
|
|
},
|
|
|
methods:{
|
|
|
// 确认上传
|
|
|
async submitUpload(){
|
|
|
+ if(this.fileList.length){
|
|
|
+ this.$emit('import',this.fileList);
|
|
|
+ }else{
|
|
|
+ this.$notify.warning({
|
|
|
+ title:'警告',
|
|
|
+ message: '请上传文件之后在确认!',
|
|
|
+ });
|
|
|
|
|
|
+ }
|
|
|
+
|
|
|
},
|
|
|
// 模板下载
|
|
|
async templateDownload(){
|
|
|
+ this.$emit('temDownload')
|
|
|
// 放父组件
|
|
|
// this.download('/system/material/download', {}, `物料基本信息模板.xlsx`);
|
|
|
},
|
|
|
//
|
|
|
beforeClose(done){
|
|
|
+ this.fileList = [];
|
|
|
// 关闭前清空
|
|
|
done();
|
|
|
},
|
|
@@ -79,9 +88,44 @@ export default {
|
|
|
onChange(file, fileList){
|
|
|
this.fileList = fileList;
|
|
|
},
|
|
|
+ setVisible(prop){
|
|
|
+ this.visible = prop;
|
|
|
+ if(!prop){
|
|
|
+ this.fileList = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ open(){
|
|
|
+ this.setVisible(true);
|
|
|
+ },
|
|
|
// 取消
|
|
|
cancal(){
|
|
|
- this.visible = false;
|
|
|
+ this.setVisible(false);
|
|
|
+ },
|
|
|
+ // 上传前校检格式和大小
|
|
|
+ handleBeforeUpload(file) {
|
|
|
+ // 校检文件类型
|
|
|
+ if (this.fileType) {
|
|
|
+ const fileName = file.name.split(".");
|
|
|
+ const fileExt = fileName[fileName.length - 1];
|
|
|
+ const isTypeOk = this.fileType.indexOf(fileExt) >= 0;
|
|
|
+ if (!isTypeOk) {
|
|
|
+ this.$modal.msgError(
|
|
|
+ `文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 校检文件大小
|
|
|
+ if (this.fileSize) {
|
|
|
+ const isLt = file.size / 1024 / 1024 < this.fileSize;
|
|
|
+ if (!isLt) {
|
|
|
+ this.$modal.msgError(`上传文件大小不能超过 ${this.fileSize} MB!`);
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$modal.loading("正在上传文件,请稍候...");
|
|
|
+ this.number++;
|
|
|
+ return true;
|
|
|
},
|
|
|
|
|
|
},
|
|
@@ -90,7 +134,12 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <el-button :disabled="disabled">
|
|
|
+ <el-button
|
|
|
+ :disabled="disabled"
|
|
|
+ :size="size"
|
|
|
+ @click="open"
|
|
|
+ type="primary"
|
|
|
+ >
|
|
|
{{ title }}
|
|
|
<el-dialog
|
|
|
:title="title"
|
|
@@ -99,25 +148,28 @@ export default {
|
|
|
width="35%"
|
|
|
center
|
|
|
:before-close="beforeClose"
|
|
|
+ append-to-body
|
|
|
>
|
|
|
<el-upload
|
|
|
ref="upload"
|
|
|
- :accept="accept"
|
|
|
action="#"
|
|
|
:on-preview="handlePreview"
|
|
|
+ :accept="accept"
|
|
|
+ :before-upload="handleBeforeUpload"
|
|
|
:on-remove="handleRemove"
|
|
|
:file-list="fileList"
|
|
|
:auto-upload="false"
|
|
|
:on-change="onChange"
|
|
|
:limit="limit"
|
|
|
- append-to-body
|
|
|
+ :disabled="disabled"
|
|
|
+ style="text-align: center;"
|
|
|
>
|
|
|
<el-button
|
|
|
slot="trigger"
|
|
|
:size="size"
|
|
|
type="primary"
|
|
|
>选取文件</el-button>
|
|
|
- <el-button
|
|
|
+ <el-button
|
|
|
v-if="isTemplate"
|
|
|
style="margin-left: 10px;"
|
|
|
:size="size"
|
|
@@ -136,8 +188,8 @@ export default {
|
|
|
</el-upload>
|
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
- <el-button @click="cancal">取 消</el-button>
|
|
|
- <el-button type="primary" @click="submitUpload">确 定</el-button>
|
|
|
+ <el-button type="primary" @click="submitUpload" :size="size">确 定</el-button>
|
|
|
+ <el-button @click="cancal" :size="size">取 消</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</el-button>
|