<el-form-item label="商品图片" v-if="form.foodtype==0">
<div v-if="dialogImageUrlList.length>0"> //遍历回调
<div v-for="(item,index) in dialogImageUrlList" :key="index"
class="avatarimage">
<img width="30%" height="30%" :src="item">
<div @click="removeImageList(item)" class="avatarremove">X</div>
</div>
</div>
<el-upload
ref="uploadImg"
action="/hotmenu/hoteats/image/uploadFood" //后端接口
list-type="picture-card"
:on-remove="handleRemove"
accept=".png,.jpg,.jpeg"
:on-success="beforeProductUpload"
:headers="headers"
>
<i class="el-icon-plus"></i>
</el-upload>
<!-- <el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl2" alt="">
</el-dialog> -->
</el-form-item>
//上传成功
beforeProductUpload(response, file, fileList){
this.foodsImgList.push(response.data)
console.log(this.foodsImgList)
},
//删除回调
removeImageList(item){
for(var i=0;i<this.dialogImageUrlList.length;i++){
if(this.dialogImageUrlList[i]==item){
this.dialogImageUrlList.splice(i,1)
}
}
console.log(this.dialogImageUrlList)
},
//移除图片功能
handleRemove(file, fileList) {
console.log(file, fileList)
},
// 提交按钮
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
for(var i=0;i<this.dialogImageUrlList.length;i++){
this.foodsImgList.push(this.dialogImageUrlList[i])
}
this.form.imgs=this.foodsImgList;
if(this.foodsImgList.length==0){
this.$modal.msgError('至少上传一张商品图片!')
}else{
updateFood(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
this.reset();
this.$forceUpdate()
this.$refs.uploadImg.clearFiles();
});
}
} else {
this.isSubmitForm=false;
this.form.imgs=this.foodsImgList;
console.log(this.form)
if(this.foodsImgList.length==0){
this.$modal.msgError('至少上传一张商品图片!')
}else{
addFood(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
this.reset();
this.$forceUpdate()
this.$refs.uploadImg.clearFiles();
});
}
}
}
});
},