From 62d55e2b92272cdfc582e7bb37ddd1408f478fac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=94=B0=E9=A6=99=E7=90=AA?= <624506849@qq.com> Date: Sun, 13 Sep 2026 10:06:33 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat(distribution):=20=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E4=B8=BB=E6=8E=A8=E5=95=86=E5=93=81=E6=95=B0=E9=87=8F=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE=E4=B8=8E=E8=B6=85=E9=99=90=E6=8F=90=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增主推商品数量选择功能，用户可选择显示5个或10个商品 - 增加超限提示，确保用户在自定义商品选择时不超过限制 - 更新相关描述信息，提升用户体验与交互反馈 --- .../distribution/distributionSetting.vue | 67 ++++++++++++++----- 1 file changed, 52 insertions(+), 15 deletions(-) diff --git a/manager/src/views/distribution/distributionSetting.vue b/manager/src/views/distribution/distributionSetting.vue index 33f738d4..82656165 100644 --- a/manager/src/views/distribution/distributionSetting.vue +++ b/manager/src/views/distribution/distributionSetting.vue @@ -294,6 +294,15 @@ 自定义主推商品 + +
+ + 5个 + 10个 + +
{{ featuredDisplayCountDesc }}
+
+ 展示佣金最高的推广商品 @@ -302,8 +311,11 @@
+
+ 当前已选超过主推数量，请删除多余商品后再保存（本页其他设置也会一并无法保存）。 +
- 请从已审核通过的分销商品中选择，最多可配置 10 个，按列表顺序展示。 + 请从已审核通过的分销商品中选择，最多可配置 {{ featuredGoodsLimit }} 个，按列表顺序展示。
选择分销商品 @@ -346,12 +358,6 @@
- - - 5个 - 10个 - -
@@ -526,6 +532,20 @@ export default { }, }; }, + computed: { + featuredGoodsLimit() { + return this.featuredForm.displayCount === 10 ? 10 : 5; + }, + featuredGoodsOverLimit() { + return this.featuredForm.sourceMode === "CUSTOM" && this.featuredCustomGoods.length > this.featuredGoodsLimit; + }, + featuredDisplayCountDesc() { + if (this.featuredForm.sourceMode === "CUSTOM") { + return `最多选择 ${this.featuredGoodsLimit} 个，分销员端按顺序展示。`; + } + return `分销员端展示前 ${this.featuredGoodsLimit} 个。`; + }, + }, mounted() { this.init(); }, @@ -709,6 +729,10 @@ export default { onFeaturedPickerSelectionChange(selection) { this.featuredPickerSelection = selection || []; }, + featuredGoodsLimitMessage() { + const limit = this.featuredGoodsLimit; + return `主推商品数量为${limit}时，最多选择${limit}个自定义商品`; + }, confirmFeaturedPicker() { if (!this.featuredPickerSelection.length) { this.$Message.warning("请至少选择一个分销商品"); @@ -720,9 +744,6 @@ export default { if (!item.skuId || existingSkuIds.has(item.skuId)) { return; } - if (merged.length >= 10) { - return; - } existingSkuIds.add(item.skuId); merged.push({ id: item.id, @@ -735,12 +756,13 @@ export default { commission: item.commission, }); }); - if (merged.length > 10) { - this.$Message.warning("自定义主推商品最多配置 10 个"); - this.featuredCustomGoods = merged.slice(0, 10); - } else { - this.featuredCustomGoods = merged; + const limit = this.featuredGoodsLimit; + if (merged.length > limit) { + const remain = Math.max(limit - this.featuredCustomGoods.length, 0); + this.$Message.warning(`${this.featuredGoodsLimitMessage()}，还可选择 ${remain} 个`); + return; } + this.featuredCustomGoods = merged; this.featuredPickerVisible = false; this.featuredPickerSelection = []; }, @@ -767,6 +789,10 @@ export default { this.$Message.warning("请至少选择一个自定义主推商品"); return; } + if (this.featuredGoodsOverLimit) { + this.$Message.warning(this.featuredGoodsLimitMessage()); + return; + } this.saving.featured = true; putDistributionFeaturedGoodsSetting(this.buildFeaturedPayload()) .then((res) => { @@ -934,6 +960,17 @@ export default { width: 100%; } + .featured-over-limit-tip { + margin-bottom: 8px; + padding: 8px 12px; + color: #e6a23c; + background: #fdf6ec; + border: 1px solid #f5dab1; + border-radius: 4px; + font-size: 12px; + line-height: 1.6; + } + .goods-toolbar { margin: 8px 0 12px; } From fb979ea514cb44f564869ac7369adb288258fc1a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=94=B0=E9=A6=99=E7=90=AA?= <624506849@qq.com> Date: Tue, 15 Sep 2026 10:24:12 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(distribution):=20=E5=A2=9E=E5=BC=BA?= =?UTF-8?q?=E4=B8=BB=E6=8E=A8=E5=95=86=E5=93=81=E9=80=89=E6=8B=A9=E5=8A=9F?= =?UTF-8?q?=E8=83=BD=E4=B8=8E=E5=90=8C=E6=AD=A5=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 添加 row-key 属性以优化表格行选择 - 引入 featuredPickerDraft 用于临时存储选择的商品 - 实现同步选择逻辑，确保用户在选择商品时状态一致 - 更新确认逻辑，确保用户选择的商品数量不超过限制 - 优化用户交互体验，提升选择反馈 --- .../distribution/distributionSetting.vue | 88 ++++++++++++++----- 1 file changed, 65 insertions(+), 23 deletions(-) diff --git a/manager/src/views/distribution/distributionSetting.vue b/manager/src/views/distribution/distributionSetting.vue index 82656165..2e8754a1 100644 --- a/manager/src/views/distribution/distributionSetting.vue +++ b/manager/src/views/distribution/distributionSetting.vue @@ -393,6 +393,7 @@ ref="featuredPickerTable" v-loading="featuredPickerLoading" border + row-key="skuId" :data="featuredPickerList" max-height="420" @selection-change="onFeaturedPickerSelectionChange" @@ -523,7 +524,9 @@ export default { featuredPickerLoading: false, featuredPickerList: [], featuredPickerTotal: 0, + featuredPickerDraft: [], featuredPickerSelection: [], + syncingFeaturedPickerSelection: false, featuredPickerSearch: { goodsName: "", authStatus: "PASS", @@ -703,10 +706,12 @@ export default { }); }, openFeaturedGoodsPicker() { + this.featuredPickerDraft = this.featuredCustomGoods.map((item) => ({ ...item })); this.featuredPickerVisible = true; }, loadFeaturedPickerGoods() { this.featuredPickerLoading = true; + this.syncingFeaturedPickerSelection = true; getDistributionGoods({ ...this.featuredPickerSearch }) .then((res) => { if (res.success) { @@ -716,8 +721,29 @@ export default { }) .finally(() => { this.featuredPickerLoading = false; + this.$nextTick(() => { + this.syncFeaturedPickerSelection(); + this.$nextTick(() => { + this.syncingFeaturedPickerSelection = false; + }); + }); }); }, + syncFeaturedPickerSelection() { + const table = this.$refs.featuredPickerTable; + if (!table) { + return; + } + const selectedSkuIds = new Set( + this.featuredPickerDraft.map((item) => item.skuId).filter(Boolean) + ); + table.clearSelection(); + this.featuredPickerList.forEach((row) => { + if (row.skuId && selectedSkuIds.has(row.skuId)) { + table.toggleRowSelection(row, true); + } + }); + }, searchFeaturedPickerGoods() { this.featuredPickerSearch.pageNumber = 1; this.loadFeaturedPickerGoods(); @@ -727,42 +753,58 @@ export default { this.loadFeaturedPickerGoods(); }, onFeaturedPickerSelectionChange(selection) { + if (this.syncingFeaturedPickerSelection) { + return; + } + const selectedSkuIds = new Set((selection || []).map((item) => item.skuId).filter(Boolean)); + const currentPageSkuIds = new Set(this.featuredPickerList.map((item) => item.skuId).filter(Boolean)); + const remaining = this.featuredPickerDraft.filter((item) => { + if (!currentPageSkuIds.has(item.skuId)) { + return true; + } + return selectedSkuIds.has(item.skuId); + }); + const remainingSkuIds = new Set(remaining.map((item) => item.skuId)); + const added = []; + (selection || []).forEach((item) => { + if (!item.skuId || remainingSkuIds.has(item.skuId)) { + return; + } + remainingSkuIds.add(item.skuId); + added.push(this.toFeaturedGoodsItem(item)); + }); + this.featuredPickerDraft = [...remaining, ...added]; this.featuredPickerSelection = selection || []; }, + toFeaturedGoodsItem(item) { + return { + id: item.id, + goodsId: item.goodsId, + skuId: item.skuId, + goodsName: item.goodsName, + specs: item.specs, + thumbnail: item.thumbnail, + price: item.price, + commission: item.commission, + storeName: item.storeName, + }; + }, featuredGoodsLimitMessage() { const limit = this.featuredGoodsLimit; return `主推商品数量为${limit}时，最多选择${limit}个自定义商品`; }, confirmFeaturedPicker() { - if (!this.featuredPickerSelection.length) { + const next = this.featuredPickerDraft.filter((item) => item.skuId); + if (!next.length) { this.$Message.warning("请至少选择一个分销商品"); return; } - const existingSkuIds = new Set(this.featuredCustomGoods.map((item) => item.skuId)); - const merged = [...this.featuredCustomGoods]; - this.featuredPickerSelection.forEach((item) => { - if (!item.skuId || existingSkuIds.has(item.skuId)) { - return; - } - existingSkuIds.add(item.skuId); - merged.push({ - id: item.id, - goodsId: item.goodsId, - skuId: item.skuId, - goodsName: item.goodsName, - specs: item.specs, - thumbnail: item.thumbnail, - price: item.price, - commission: item.commission, - }); - }); const limit = this.featuredGoodsLimit; - if (merged.length > limit) { - const remain = Math.max(limit - this.featuredCustomGoods.length, 0); - this.$Message.warning(`${this.featuredGoodsLimitMessage()}，还可选择 ${remain} 个`); + if (next.length > limit) { + this.$Message.warning(this.featuredGoodsLimitMessage()); return; } - this.featuredCustomGoods = merged; + this.featuredCustomGoods = next; this.featuredPickerVisible = false; this.featuredPickerSelection = []; },