162 lines
4.0 KiB
Vue
162 lines
4.0 KiB
Vue
<template>
|
|
<div>
|
|
<el-form ref="editPram" :model="editPram" label-width="140px">
|
|
<el-form-item
|
|
label="小食名称"
|
|
:rules="[{ required: true, message: '请输入分类名称' }]"
|
|
>
|
|
<el-input v-model="editPram.categoryName" placeholder="小食名称" />
|
|
</el-form-item>
|
|
<el-form-item label="排序">
|
|
<el-input-number v-model="editPram.sort" :min="0" />
|
|
</el-form-item>
|
|
<el-form-item
|
|
label="分类图标(180*180)"
|
|
:rules="[
|
|
{ required: true, message: '请上传图标', trigger: ['blur', 'change'] }
|
|
]"
|
|
>
|
|
<div class="upLoadPicBox" @click="modalPicTap('1')">
|
|
<div v-if="editPram.icon" class="pictrue">
|
|
<img :src="editPram.icon" />
|
|
</div>
|
|
<div v-else class="upLoad">
|
|
<i class="el-icon-camera cameraIconfont" />
|
|
</div>
|
|
</div>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="状态">
|
|
<el-switch
|
|
v-model="editPram.isShow"
|
|
active-text="显示"
|
|
inactive-text="隐藏"
|
|
:active-value="true"
|
|
:inactive-value="false"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button
|
|
type="primary"
|
|
:loading="loadingBtn"
|
|
@click="handlerSubmit('editPram')"
|
|
>确定</el-button
|
|
>
|
|
<el-button @click="close">取消</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { storeSnackCategoryPut, storeSnackCategoryPost } from "@/api/snack.js";
|
|
export default {
|
|
// name: "edit"
|
|
props: {
|
|
prent: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
isCreate: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
editData: {
|
|
type: Object
|
|
},
|
|
|
|
allTreeList: {
|
|
type: Array
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
loadingBtn: false,
|
|
constants: this.$constants,
|
|
editPram: {
|
|
categoryName: null,
|
|
sort: null,
|
|
isShow: 0,
|
|
icon: true,
|
|
id: undefined
|
|
},
|
|
};
|
|
},
|
|
mounted() {
|
|
this.initEditData();
|
|
},
|
|
methods: {
|
|
// 点击图标
|
|
addIcon() {
|
|
const _this = this;
|
|
_this.$modalIcon(function(icon) {
|
|
_this.editPram.icon = icon;
|
|
});
|
|
},
|
|
// 点击商品图
|
|
modalPicTap(tit, num, i) {
|
|
const _this = this;
|
|
const attr = [];
|
|
this.$modalUpload(
|
|
function(img) {
|
|
if (tit === "1" && !num) {
|
|
_this.editPram.icon = img[0].sattDir;
|
|
}
|
|
if (tit === "2" && !num) {
|
|
img.map(item => {
|
|
attr.push(item.attachment_src);
|
|
_this.formValidate.slider_image.push(item);
|
|
});
|
|
}
|
|
},
|
|
tit,
|
|
"store"
|
|
);
|
|
},
|
|
close() {
|
|
this.$emit("hideEditDialog");
|
|
},
|
|
initEditData() {
|
|
const { categoryName, isShow, sort, icon, id } = this.editData;
|
|
console.log(this.editData);
|
|
if (this.isCreate === 1) {
|
|
this.editPram.categoryName = categoryName;
|
|
this.editPram.sort = sort;
|
|
this.editPram.isShow = isShow;
|
|
this.editPram.icon = icon;
|
|
this.editPram.id = id;
|
|
} else {
|
|
// this.editPram.pid = this.prent.id
|
|
}
|
|
},
|
|
|
|
handlerSubmit(formName) {
|
|
console.log(this.isCreate);
|
|
this.$refs[formName].validate(valid => {
|
|
if (!valid) return;
|
|
this.loadingBtn = true
|
|
if (this.isCreate) {
|
|
storeSnackCategoryPut(this.editPram).then(res => {
|
|
this.$message.success("编辑成功");
|
|
this.$emit("hideEditDialog");
|
|
this.$emit("getList");
|
|
}).finally(() =>{
|
|
this.loadingBtn = false
|
|
});
|
|
} else {
|
|
storeSnackCategoryPost(this.editPram).then(res => {
|
|
this.$message.success("添加成功");
|
|
this.$emit("hideEditDialog");
|
|
}).finally(() =>{
|
|
this.loadingBtn = false
|
|
});
|
|
}
|
|
|
|
console.log(this.editPram);
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped></style>
|