|
@@ -28,6 +28,7 @@
|
|
|
<el-form-item prop="categoryId">
|
|
|
<span slot="label">商品分类</span>
|
|
|
<el-cascader
|
|
|
+ :filterable="true"
|
|
|
class="fl"
|
|
|
v-model="form.categoryId"
|
|
|
ref="formCascader"
|
|
@@ -88,7 +89,11 @@
|
|
|
@start="start"
|
|
|
@end="end"
|
|
|
>
|
|
|
- <div class="item" v-for="(item, index) in this.bannerList" :key="index">
|
|
|
+ <div
|
|
|
+ class="item"
|
|
|
+ v-for="(item, index) in this.bannerList"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
<div class="fmt" v-if="index == 0">封面图</div>
|
|
|
<div class="gb" @click="removeImg(index)">X</div>
|
|
|
<img
|
|
@@ -150,7 +155,10 @@ export default {
|
|
|
presaleEndTime: "",
|
|
|
},
|
|
|
bannerList: [],
|
|
|
- headers: { Auth: "Bearer " + getToken(), "Content-type": "multipart/form-data" },
|
|
|
+ headers: {
|
|
|
+ Auth: "Bearer " + getToken(),
|
|
|
+ "Content-type": "multipart/form-data",
|
|
|
+ },
|
|
|
categoryprops: {
|
|
|
checkStrictly: true,
|
|
|
lazy: true,
|
|
@@ -159,18 +167,34 @@ export default {
|
|
|
value: "value",
|
|
|
},
|
|
|
rules: {
|
|
|
- saleType: [{ required: true, message: "销售方式不能为空", trigger: "blur" }],
|
|
|
- saleModel: [{ required: true, message: "销售方式不能为空", trigger: "blur" }],
|
|
|
- categoryId: [{ required: true, message: "分类不能为空", trigger: "blur" }],
|
|
|
- title: [{ required: true, message: "商品名称不能为空", trigger: "blur" }],
|
|
|
- giftDesc: [{ required: true, message: "礼包描述不能为空", trigger: "blur" }],
|
|
|
+ saleType: [
|
|
|
+ { required: true, message: "销售方式不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ saleModel: [
|
|
|
+ { required: true, message: "销售方式不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ categoryId: [
|
|
|
+ { required: true, message: "分类不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ title: [
|
|
|
+ { required: true, message: "商品名称不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ giftDesc: [
|
|
|
+ { required: true, message: "礼包描述不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
bannerList: [
|
|
|
- { required: true, message: "商品图最低上传两张图片", trigger: "blur" },
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "商品图最低上传两张图片",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
],
|
|
|
carpoolSuccessTime: [
|
|
|
{ required: true, message: "拼车成功时间不能为空", trigger: "blur" },
|
|
|
],
|
|
|
- datePicker: [{ required: true, message: "预售时间不能为空", trigger: "blur" }],
|
|
|
+ datePicker: [
|
|
|
+ { required: true, message: "预售时间不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
},
|
|
|
index: 0,
|
|
|
shopInfo: {},
|
|
@@ -184,40 +208,55 @@ export default {
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
- getFormInfo(record, type) {
|
|
|
- if (type != "cg") {
|
|
|
- this.actionType = "edit";
|
|
|
- } else {
|
|
|
- this.actionType = "";
|
|
|
- }
|
|
|
+ getFormInfo(record = {}, type) {
|
|
|
+ // 设置操作类型
|
|
|
+ this.actionType = type === "cg" ? "" : "edit";
|
|
|
|
|
|
- this.form.datePicker = [];
|
|
|
- this.form.categoryId = record.categoryId;
|
|
|
- this.form.categoryIds = record.categoryIds;
|
|
|
- this.form.carpoolSuccessTime = record.carpoolSuccessTime;
|
|
|
- this.form.scope = record.scope;
|
|
|
- this.form.saleType = record.saleType;
|
|
|
- this.form.saleModel = record.saleModel;
|
|
|
- this.form.title = record.title;
|
|
|
- this.form.giftDesc = record.giftDesc;
|
|
|
- this.form.vid = record.vid;
|
|
|
- this.form.bannerList = record.bannerList;
|
|
|
- this.form.pic = record.pic;
|
|
|
- this.form.categoryName = record.categoryName;
|
|
|
- this.categoryName = record.categoryName;
|
|
|
- this.bannerList = [];
|
|
|
- if (this.form.bannerList?.length > 0) {
|
|
|
- this.bannerList = this.form.bannerList;
|
|
|
- }
|
|
|
- if (this.form.pic) {
|
|
|
- this.bannerList.unshift({
|
|
|
- fileUrl: record.pic,
|
|
|
- sort: 1,
|
|
|
- });
|
|
|
- }
|
|
|
- this.$forceUpdate();
|
|
|
- },
|
|
|
+ // 解构赋值并设置默认值
|
|
|
+ const {
|
|
|
+ categoryId,
|
|
|
+ categoryIds,
|
|
|
+ carpoolSuccessTime,
|
|
|
+ scope,
|
|
|
+ saleType,
|
|
|
+ saleModel,
|
|
|
+ title,
|
|
|
+ giftDesc,
|
|
|
+ vid,
|
|
|
+ bannerList = [],
|
|
|
+ pic,
|
|
|
+ categoryName,
|
|
|
+ } = record;
|
|
|
|
|
|
+ // 更新表单数据
|
|
|
+ this.form = {
|
|
|
+ ...this.form,
|
|
|
+ datePicker: [],
|
|
|
+ categoryId,
|
|
|
+ categoryIds,
|
|
|
+ carpoolSuccessTime,
|
|
|
+ scope,
|
|
|
+ saleType,
|
|
|
+ saleModel,
|
|
|
+ title,
|
|
|
+ giftDesc,
|
|
|
+ vid,
|
|
|
+ bannerList,
|
|
|
+ pic,
|
|
|
+ categoryName,
|
|
|
+ };
|
|
|
+
|
|
|
+ // 更新分类名称
|
|
|
+ this.categoryName = categoryName;
|
|
|
+
|
|
|
+ // 处理轮播图列表(pic优先显示在第一位)
|
|
|
+ this.bannerList = pic
|
|
|
+ ? [{ fileUrl: pic, sort: 1 }, ...bannerList]
|
|
|
+ : [...bannerList];
|
|
|
+
|
|
|
+ // 避免使用$forceUpdate,确保数据响应式更新
|
|
|
+ // this.$forceUpdate();
|
|
|
+ },
|
|
|
beforeAvatarUpload(file) {
|
|
|
const isJPG = file.type === "image/jpeg" || "image/png" || "image/jpg";
|
|
|
const isLt2M = file.size / 1024 / 1024 < 2;
|
|
@@ -275,7 +314,8 @@ export default {
|
|
|
console.log("bannerList", this.bannerList);
|
|
|
for (let index = 0; index < this.bannerList.length; index++) {
|
|
|
this.form.bannerList.push({
|
|
|
- fileUrl: this.bannerList[index].url || this.bannerList[index].fileUrl,
|
|
|
+ fileUrl:
|
|
|
+ this.bannerList[index].url || this.bannerList[index].fileUrl,
|
|
|
sort: this.bannerList[index].name,
|
|
|
});
|
|
|
}
|