|
@@ -8,7 +8,7 @@
|
|
|
width="1024px"
|
|
width="1024px"
|
|
|
@closed="closed"
|
|
@closed="closed"
|
|
|
>
|
|
>
|
|
|
- <div class="main">
|
|
|
|
|
|
|
+ <div class="main" v-loading="loading">
|
|
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
<el-form-item label="上传方式:" prop="type">
|
|
<el-form-item label="上传方式:" prop="type">
|
|
|
<el-radio-group v-model="ruleForm.type" @change="radioChange(ruleForm.type)">
|
|
<el-radio-group v-model="ruleForm.type" @change="radioChange(ruleForm.type)">
|
|
@@ -43,6 +43,8 @@
|
|
|
:data="uploadData"
|
|
:data="uploadData"
|
|
|
:headers="header"
|
|
:headers="header"
|
|
|
:before-upload="beforeUpload"
|
|
:before-upload="beforeUpload"
|
|
|
|
|
+ :multiple="true"
|
|
|
|
|
+ :limit="limit"
|
|
|
>
|
|
>
|
|
|
<i slot="default" class="el-icon-plus"></i>
|
|
<i slot="default" class="el-icon-plus"></i>
|
|
|
<div
|
|
<div
|
|
@@ -158,6 +160,8 @@ export default {
|
|
|
treeId: '',
|
|
treeId: '',
|
|
|
qrcode: '',
|
|
qrcode: '',
|
|
|
scanToken: '',
|
|
scanToken: '',
|
|
|
|
|
+ limit: 20,
|
|
|
|
|
+ loading: false,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
created() {},
|
|
created() {},
|
|
@@ -203,24 +207,39 @@ export default {
|
|
|
this.uploadData = {
|
|
this.uploadData = {
|
|
|
pid: this.treeId,
|
|
pid: this.treeId,
|
|
|
};
|
|
};
|
|
|
- for (let i = 0; i < this.ruleForm.imgList.length; i++) {
|
|
|
|
|
- const file = this.ruleForm.imgList[i].raw;
|
|
|
|
|
- await this.uploadItem(file);
|
|
|
|
|
- if (i == this.ruleForm.imgList.length - 1) {
|
|
|
|
|
- this.$Message.success('上传成功');
|
|
|
|
|
- this.$emit('uploadSuccess');
|
|
|
|
|
- this.uploadModal = false;
|
|
|
|
|
|
|
+ if (this.ruleForm.imgList.length) {
|
|
|
|
|
+ if (this.loading) return;
|
|
|
|
|
+ this.loading = true;
|
|
|
|
|
+ for (let i = 0; i < this.ruleForm.imgList.length; i++) {
|
|
|
|
|
+ const file = this.ruleForm.imgList[i].raw;
|
|
|
|
|
+ await this.uploadItem(file);
|
|
|
|
|
+ if (i == this.ruleForm.imgList.length - 1) {
|
|
|
|
|
+ this.$Message.success('上传成功');
|
|
|
|
|
+ this.$emit('uploadSuccess');
|
|
|
|
|
+ this.uploadModal = false;
|
|
|
|
|
+ this.loading = false;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
} else if (this.ruleForm.type == 1) {
|
|
} else if (this.ruleForm.type == 1) {
|
|
|
let urls = this.ruleForm.imgList.map((e) => {
|
|
let urls = this.ruleForm.imgList.map((e) => {
|
|
|
return e.url;
|
|
return e.url;
|
|
|
});
|
|
});
|
|
|
- onlineUpload({ pid: this.treeId, images: urls }).then((res) => {
|
|
|
|
|
- this.$Message.success('上传成功');
|
|
|
|
|
- this.$emit('uploadSuccess');
|
|
|
|
|
- this.uploadModal = false;
|
|
|
|
|
- });
|
|
|
|
|
|
|
+ if (urls.length) {
|
|
|
|
|
+ if (this.loading) return;
|
|
|
|
|
+ this.loading = true;
|
|
|
|
|
+ onlineUpload({ pid: this.treeId, images: urls })
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ this.$Message.success('上传成功');
|
|
|
|
|
+ this.$emit('uploadSuccess');
|
|
|
|
|
+ this.uploadModal = false;
|
|
|
|
|
+ this.loading = false;
|
|
|
|
|
+ })
|
|
|
|
|
+ .catch((err) => {
|
|
|
|
|
+ this.loading = false;
|
|
|
|
|
+ this.$Message.error(err.msg);
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
} else if (this.ruleForm.type == 2) {
|
|
} else if (this.ruleForm.type == 2) {
|
|
|
let attId = this.ruleForm.imgList.map((e) => {
|
|
let attId = this.ruleForm.imgList.map((e) => {
|
|
|
return e.att_id;
|
|
return e.att_id;
|
|
@@ -243,6 +262,7 @@ export default {
|
|
|
resolve();
|
|
resolve();
|
|
|
// this.$emit('uploadImgSuccess', res.data);
|
|
// this.$emit('uploadImgSuccess', res.data);
|
|
|
} else {
|
|
} else {
|
|
|
|
|
+ this.loading = false;
|
|
|
this.$message({
|
|
this.$message({
|
|
|
message: '上传失败',
|
|
message: '上传失败',
|
|
|
type: 'error',
|
|
type: 'error',
|
|
@@ -251,6 +271,7 @@ export default {
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
.catch((err) => {
|
|
.catch((err) => {
|
|
|
|
|
+ this.loading = false;
|
|
|
this.$Message.error(err.msg);
|
|
this.$Message.error(err.msg);
|
|
|
});
|
|
});
|
|
|
});
|
|
});
|
|
@@ -281,12 +302,25 @@ export default {
|
|
|
handleDownload(file) {
|
|
handleDownload(file) {
|
|
|
console.log(file);
|
|
console.log(file);
|
|
|
},
|
|
},
|
|
|
- fileChange(file, fileList) {
|
|
|
|
|
- console.log(file, fileList);
|
|
|
|
|
- this.ruleForm.imgList = fileList;
|
|
|
|
|
- compressImg(file.raw).then((res) => {
|
|
|
|
|
- if (fileList.length) fileList[fileList.length - 1].raw = res;
|
|
|
|
|
|
|
+ async fileChange(file, fileList) {
|
|
|
|
|
+ if (file.size >= 2097152) {
|
|
|
|
|
+ await this.comImg(file.raw).then((res) => {
|
|
|
|
|
+ fileList.map((e) => {
|
|
|
|
|
+ if (e.uid === file.uid) {
|
|
|
|
|
+ e.raw = res;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ this.ruleForm.imgList = fileList;
|
|
|
|
|
+ });
|
|
|
|
|
+ } else {
|
|
|
this.ruleForm.imgList = fileList;
|
|
this.ruleForm.imgList = fileList;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ comImg(file) {
|
|
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
|
|
+ compressImg(file).then((res) => {
|
|
|
|
|
+ resolve(res);
|
|
|
|
|
+ });
|
|
|
});
|
|
});
|
|
|
},
|
|
},
|
|
|
loadData(item, callback) {
|
|
loadData(item, callback) {
|