|
@@ -5,6 +5,7 @@
|
|
:visible.sync="dialogVisible"
|
|
:visible.sync="dialogVisible"
|
|
width="500px"
|
|
width="500px"
|
|
height="60%"
|
|
height="60%"
|
|
|
|
+ :before-close="handleClose"
|
|
center
|
|
center
|
|
>
|
|
>
|
|
<div class="dialog-container">
|
|
<div class="dialog-container">
|
|
@@ -61,12 +62,14 @@
|
|
action="https://jsonplaceholder.typicode.com/posts/"
|
|
action="https://jsonplaceholder.typicode.com/posts/"
|
|
:on-success="handleSuccess"
|
|
:on-success="handleSuccess"
|
|
:before-upload="beforeUpload"
|
|
:before-upload="beforeUpload"
|
|
|
|
+ :on-remove="handleRemove"
|
|
:accept="'.doc,.docx,.xls,.xlsx,.pdf'"
|
|
:accept="'.doc,.docx,.xls,.xlsx,.pdf'"
|
|
|
|
+ :file-list="fileList"
|
|
>
|
|
>
|
|
<el-button slot="trigger"
|
|
<el-button slot="trigger"
|
|
><i class="el-icon-upload"></i> 请将文件拖拽或点击上传</el-button
|
|
><i class="el-icon-upload"></i> 请将文件拖拽或点击上传</el-button
|
|
>
|
|
>
|
|
- <div slot="tip" class="el-upload__tip" style="width: 220px">
|
|
|
|
|
|
+ <div slot="tip" class="el-upload__tip" style="width: 265px;line-height:20px;">
|
|
仅支持 .doc / .docx / .xls / .xlsx / .pdf 格式的文件
|
|
仅支持 .doc / .docx / .xls / .xlsx / .pdf 格式的文件
|
|
</div>
|
|
</div>
|
|
</el-upload>
|
|
</el-upload>
|
|
@@ -97,6 +100,7 @@ export default {
|
|
},
|
|
},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ fileList:[],
|
|
dialogVisible: false,
|
|
dialogVisible: false,
|
|
formData: {
|
|
formData: {
|
|
name: "",
|
|
name: "",
|
|
@@ -105,6 +109,7 @@ export default {
|
|
id: "",
|
|
id: "",
|
|
reportType: "",
|
|
reportType: "",
|
|
templateType: 0,
|
|
templateType: 0,
|
|
|
|
+ file: "",
|
|
},
|
|
},
|
|
temFormatOptions: [
|
|
temFormatOptions: [
|
|
{
|
|
{
|
|
@@ -146,10 +151,16 @@ export default {
|
|
this.formData.format = "Excel";
|
|
this.formData.format = "Excel";
|
|
this.formData.introduction = "";
|
|
this.formData.introduction = "";
|
|
this.formData.reportType = "";
|
|
this.formData.reportType = "";
|
|
|
|
+ this.formData.file = "";
|
|
|
|
+ this.fileList=[]
|
|
},
|
|
},
|
|
searchEvent() {
|
|
searchEvent() {
|
|
this.$emit("confirmEvent", this.formData);
|
|
this.$emit("confirmEvent", this.formData);
|
|
},
|
|
},
|
|
|
|
+ handleClose(){
|
|
|
|
+ this.fileList=[]
|
|
|
|
+ this.dialogVisible = false
|
|
|
|
+ },
|
|
beforeUpload(file) {
|
|
beforeUpload(file) {
|
|
const isAllowedSize = file.size / 1024 / 1024 < 10; // 限制文件大小小于10MB
|
|
const isAllowedSize = file.size / 1024 / 1024 < 10; // 限制文件大小小于10MB
|
|
const isAllowedType = [".doc", ".docx", ".xls", ".xlsx", ".pdf"].includes(
|
|
const isAllowedType = [".doc", ".docx", ".xls", ".xlsx", ".pdf"].includes(
|
|
@@ -167,10 +178,12 @@ export default {
|
|
}
|
|
}
|
|
return true;
|
|
return true;
|
|
},
|
|
},
|
|
|
|
+ handleRemove(file,fileList){
|
|
|
|
+ this.fileList=[]
|
|
|
|
+ },
|
|
handleSuccess(response, file, fileList) {
|
|
handleSuccess(response, file, fileList) {
|
|
- console.log(response); // 上传成功后返回的数据
|
|
|
|
- console.log(file); // 上传的文件信息
|
|
|
|
- console.log(fileList); // 上传的所有文件信息
|
|
|
|
|
|
+ this.formData.file = file.raw;
|
|
|
|
+ this.fileList.push(file)
|
|
},
|
|
},
|
|
},
|
|
},
|
|
};
|
|
};
|
|
@@ -212,7 +225,7 @@ export default {
|
|
height: 60px;
|
|
height: 60px;
|
|
}
|
|
}
|
|
&-upload {
|
|
&-upload {
|
|
- height: 100px;
|
|
|
|
|
|
+ height: 95px;
|
|
}
|
|
}
|
|
&-bottom {
|
|
&-bottom {
|
|
margin: 0 auto;
|
|
margin: 0 auto;
|