fix: 修复入驻误校验与商品品牌显示 0,并优化分类、运费模板交互

- 入驻第三步改为先回填再渲染,避免空字段进页即提示
- 入驻协议无内容时按空字符串处理,避免读取 null
- 商品品牌空值展示占位符,提交时再转为 0
- 店内分类为空时横向展示「暂无分类」
- 运费模板选择地址默认折叠,操作文案改为「选择地址」
This commit is contained in:
田香琪
2026-08-20 16:55:05 +08:00
parent 9540a1b98b
commit 085674dfa7
6 changed files with 99 additions and 45 deletions

View File

@@ -130,9 +130,9 @@ export default {
Object.assign(this.thirdData, Object.fromEntries(third.map((key) => [key, data[key]]))); Object.assign(this.thirdData, Object.fromEntries(third.map((key) => [key, data[key]])));
}, },
getArticle() { getArticle() {
// 入驻协议 // 入驻协议:库中无 STORE_REGISTER 文章时 result 为 null不能直接读 content
agreement().then((res) => { agreement().then((res) => {
this.agreementCon = res.result.content; this.agreementCon = res.result?.content || "";
}); });
}, },
getData(status) { getData(status) {
@@ -164,21 +164,19 @@ export default {
}); });
}, },
refreshApplyData() { refreshApplyData() {
applyStatus().then((res) => { return applyStatus().then((res) => {
if (res.success && res.result) { if (res.success && res.result) {
this.assignApplyData(res.result); this.assignApplyData(res.result);
} }
}); }).catch(() => {});
}, },
// 下一步 // 下一步:先拉最新申请数据,再切步骤,避免第三步挂载后再改 content 触发校验
nextPage(step) { async nextPage(step) {
if (typeof step !== "number") return; if (typeof step !== "number") return;
this.currentIndex = step; if (step > 0 && step <= 3) {
if (step > 0 && step < 3) { await this.refreshApplyData();
this.refreshApplyData();
} else if (step === 3) {
this.refreshApplyData();
} }
this.currentIndex = step;
}, },
}, },
created() { created() {

View File

@@ -126,6 +126,12 @@ export default {
form: { // 表单数据 form: { // 表单数据
storeLogo: [], storeLogo: [],
goodsManagementCategory: [], goodsManagementCategory: [],
storeName: "",
storeAddressDetail: "",
storeDesc: "",
storeAddressIdPath: "",
storeAddressPath: "",
storeCenter: "",
}, },
rules: { // 验证规则 rules: { // 验证规则
goodsManagementCategory: [ goodsManagementCategory: [
@@ -244,18 +250,42 @@ export default {
(id) => this.normalizeCategoryId(id) (id) => this.normalizeCategoryId(id)
); );
}, },
createEmptyForm () {
return {
storeLogo: [],
goodsManagementCategory: [],
storeName: "",
storeAddressDetail: "",
storeDesc: "",
storeAddressIdPath: "",
storeAddressPath: "",
storeCenter: "",
};
},
initFormFromContent (content) {
const src = content && Object.keys(content).length
? JSON.parse(JSON.stringify(content))
: {};
this.form = {
...this.createEmptyForm(),
...src,
};
this.form.storeLogo = src.storeLogo
? String(src.storeLogo).split(",").filter(Boolean)
: [];
this.form.goodsManagementCategory = src.goodsManagementCategory
? String(src.goodsManagementCategory).split(",").filter(Boolean)
: [];
["storeName", "storeAddressDetail", "storeDesc", "storeAddressIdPath", "storeAddressPath", "storeCenter"].forEach((key) => {
if (this.form[key] == null) this.form[key] = "";
});
},
},
created () {
this.initFormFromContent(this.content);
}, },
mounted () { mounted () {
this.accessToken.accessToken = storage.getItem('accessToken'); this.accessToken.accessToken = storage.getItem('accessToken');
if (this.content && Object.keys(this.content).length) {
this.form = JSON.parse(JSON.stringify(this.content));
this.form.storeLogo = this.content.storeLogo
? String(this.content.storeLogo).split(',').filter(Boolean)
: [];
this.form.goodsManagementCategory = this.content.goodsManagementCategory
? String(this.content.goodsManagementCategory).split(',').filter(Boolean)
: [];
}
this.getCategoryList(); this.getCategoryList();
} }
}; };

View File

@@ -524,8 +524,9 @@ div.base-info-item {
} }
.tree-bar { .tree-bar {
width: 100%;
height: auto !important; height: auto !important;
max-height: auto !important; max-height: none !important;
min-height: 240px !important; min-height: 240px !important;
} }

View File

@@ -28,7 +28,6 @@
</div> </div>
</el-option> </el-option>
</el-select> </el-select>
<div v-if="currentGoodsTypeDesc" class="form-tip">{{ currentGoodsTypeDesc }}</div>
</el-form-item> </el-form-item>
<el-form-item label="商品分类" prop="categoryPath"> <el-form-item label="商品分类" prop="categoryPath">
<el-cascader <el-cascader
@@ -51,7 +50,13 @@
<el-input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea" /> <el-input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea" />
</el-form-item> </el-form-item>
<el-form-item label="商品品牌" prop="brandId"> <el-form-item label="商品品牌" prop="brandId">
<el-select v-model="baseInfoForm.brandId" filterable style="width: 200px"> <el-select
v-model="baseInfoForm.brandId"
filterable
clearable
placeholder="请选择品牌"
style="width: 200px"
>
<el-option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id" /> <el-option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id" />
</el-select> </el-select>
<el-button class="refresh-icon" circle link @click="refresh('brand')"> <el-button class="refresh-icon" circle link @click="refresh('brand')">
@@ -466,7 +471,7 @@
</div> </div>
<h4>商品详情描述</h4> <h4>商品详情描述</h4>
<div class="form-item-view"> <div class="form-item-view">
<div class="tree-bar"> <div class="tree-bar" :class="{ 'is-empty': !shopCategory.length }">
<el-form-item class="form-item-view-el" label="店内分类" prop="shopCategory"> <el-form-item class="form-item-view-el" label="店内分类" prop="shopCategory">
<el-tree <el-tree
ref="tree" ref="tree"
@@ -477,7 +482,11 @@
style="text-align: left" style="text-align: left"
@node-click="(data) => selectTree([data])" @node-click="(data) => selectTree([data])"
@check="(_, ctx) => changeSelect(ctx.checkedNodes)" @check="(_, ctx) => changeSelect(ctx.checkedNodes)"
/> >
<template #empty>
<span class="shop-category-empty">暂无分类</span>
</template>
</el-tree>
</el-form-item> </el-form-item>
</div> </div>
<el-form-item class="form-item-view-el" label="PC商品描述" prop="intro" style="width: 100%"> <el-form-item class="form-item-view-el" label="PC商品描述" prop="intro" style="width: 100%">
@@ -499,7 +508,7 @@
<div v-if="needsLogistics"> <div v-if="needsLogistics">
<h4>商品物流信息</h4> <h4>商品物流信息</h4>
<div class="form-item-view"> <div class="form-item-view">
<el-form-item class="form-item-view-el" label="物流模板" prop="templateId"> <el-form-item class="form-item-view-el" label="运费模板" prop="templateId">
<el-select v-model="baseInfoForm.templateId" style="width: 200px"> <el-select v-model="baseInfoForm.templateId" style="width: 200px">
<el-option v-for="item in logisticsTemplate" :key="item.id" :label="item.name" :value="item.id" /> <el-option v-for="item in logisticsTemplate" :key="item.id" :label="item.name" :value="item.id" />
</el-select> </el-select>
@@ -618,12 +627,6 @@ export default {
needsLogistics() { needsLogistics() {
return this.baseInfoForm.goodsType === "PHYSICAL_GOODS"; return this.baseInfoForm.goodsType === "PHYSICAL_GOODS";
}, },
currentGoodsTypeDesc() {
const matched = this.goodsTypeOptions.find(
(item) => item.value === this.baseInfoForm.goodsType
);
return matched ? matched.desc : "";
},
}, },
data() { data() {
// 表单验证项,商品价格 // 表单验证项,商品价格
@@ -732,7 +735,7 @@ export default {
recommend: 1, recommend: 1,
/** 店铺分类 */ /** 店铺分类 */
storeCategoryPath: "", storeCategoryPath: "",
brandId: 0, brandId: "",
/** 计量单位 **/ /** 计量单位 **/
goodsUnit: "", goodsUnit: "",
/** 商品类型 **/ /** 商品类型 **/
@@ -1108,7 +1111,7 @@ export default {
this.categoryId = ""; this.categoryId = "";
this.baseInfoForm.categoryPath = ""; this.baseInfoForm.categoryPath = "";
this.baseInfoForm.categoryName = []; this.baseInfoForm.categoryName = [];
this.baseInfoForm.brandId = 0; this.baseInfoForm.brandId = "";
this.brandList = []; this.brandList = [];
this.goodsParams = []; this.goodsParams = [];
this.params_panel = []; this.params_panel = [];
@@ -1117,7 +1120,7 @@ export default {
this.categoryId = val[2]; this.categoryId = val[2];
this.baseInfoForm.categoryPath = val.join(","); this.baseInfoForm.categoryPath = val.join(",");
this.baseInfoForm.categoryName = this.getCategoryNames(val); this.baseInfoForm.categoryName = this.getCategoryNames(val);
this.baseInfoForm.brandId = 0; this.baseInfoForm.brandId = "";
this.getGoodsBrandList(); this.getGoodsBrandList();
this.GET_GoodsParams(); this.GET_GoodsParams();
}, },
@@ -1331,6 +1334,12 @@ export default {
} }
}, },
/** 无品牌时后端用 0选择器空值用空字符串避免 el-select 直接显示 0 */
normalizeBrandId(id) {
if (id === 0 || id === "0" || id == null || id === "") return "";
return id;
},
/** 查询商品品牌列表 */ /** 查询商品品牌列表 */
getGoodsBrandList(type) { getGoodsBrandList(type) {
API_GOODS.getCategoryBrandListDataSeller(this.categoryId).then( API_GOODS.getCategoryBrandListDataSeller(this.categoryId).then(
@@ -1402,6 +1411,7 @@ export default {
this.invalidGoodsGalleryFiles = []; this.invalidGoodsGalleryFiles = [];
this.baseInfoForm = { ...this.baseInfoForm, ...response.result }; this.baseInfoForm = { ...this.baseInfoForm, ...response.result };
this.baseInfoForm.release = 1; //即使是被放入仓库,修改的时候也会显示会立即发布 this.baseInfoForm.release = 1; //即使是被放入仓库,修改的时候也会显示会立即发布
this.baseInfoForm.brandId = this.normalizeBrandId(this.baseInfoForm.brandId);
this.categoryId = response.result.categoryPath.split(",")[2]; this.categoryId = response.result.categoryPath.split(",")[2];
this.syncSelectedCategoryFromPath(); this.syncSelectedCategoryFromPath();
@@ -2368,6 +2378,7 @@ export default {
return; return;
} }
if (submit.templateId === "") submit.templateId = 0; if (submit.templateId === "") submit.templateId = 0;
if (submit.brandId === "" || submit.brandId == null) submit.brandId = 0;
if (this.isECouponGoods) { if (this.isECouponGoods) {
submit.templateId = 0; submit.templateId = 0;
submit.salesModel = "RETAIL"; submit.salesModel = "RETAIL";
@@ -2521,6 +2532,29 @@ export default {
white-space: nowrap; white-space: nowrap;
} }
@import "./addGoods.scss"; @import "./addGoods.scss";
.tree-bar.is-empty {
min-height: auto !important;
}
.tree-bar :deep(.el-tree__empty-block) {
display: flex;
align-items: center;
justify-content: flex-start;
min-height: 32px;
height: auto;
width: auto;
}
.tree-bar :deep(.el-tree__empty-text),
.shop-category-empty {
position: static;
left: auto;
top: auto;
transform: none;
white-space: nowrap;
writing-mode: horizontal-tb;
}
</style> </style>
<style scoped> <style scoped>
@@ -2664,14 +2698,6 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
} }
.form-tip {
color: #666;
font-size: 12px;
line-height: 1.5;
margin-top: 4px;
max-width: 260px;
}
.goods-type-option { .goods-type-option {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View File

@@ -15,7 +15,6 @@
:props="treeProps" :props="treeProps"
node-key="id" node-key="id"
show-checkbox show-checkbox
default-expand-all
/> />
</div> </div>
<template #footer> <template #footer>

View File

@@ -138,7 +138,7 @@
/> />
</td> </td>
<td class="col-action"> <td class="col-action">
<a class="action-link" @click="editRegion(item,index)">修改</a> <a class="action-link" @click="editRegion(item,index)">选择地址</a>
<span class="action-split">|</span> <span class="action-split">|</span>
<a class="action-link" @click="removeTemplateChildren(index)">删除</a> <a class="action-link" @click="removeTemplateChildren(index)">删除</a>
</td> </td>