优化添加点餐页轮播图

This commit is contained in:
gyq
2026-01-28 17:47:25 +08:00
parent 71bec03475
commit 62c6b755af
2 changed files with 37 additions and 9 deletions

View File

@@ -111,6 +111,10 @@ const includesNames = ref([
{ {
id: '10', id: '10',
name: '点餐商品详情弹窗页' name: '点餐商品详情弹窗页'
},
{
id: '12',
name: '积分商品详情页面'
} }
]); ]);

View File

@@ -14,6 +14,7 @@
<script setup> <script setup>
import _ from 'lodash'; import _ from 'lodash';
import { ref, onMounted, watch } from 'vue'; import { ref, onMounted, watch } from 'vue';
import { pointsGoodsPage } from '@/api/points/index.js'
import API from '@/views/application/list/advertisement/indexconfig/api'; import API from '@/views/application/list/advertisement/indexconfig/api';
import { packageGet, getGbWarePage } from '@/api/market/ware' import { packageGet, getGbWarePage } from '@/api/market/ware'
import productApi from '@/api/product'; import productApi from '@/api/product';
@@ -105,7 +106,7 @@ const extendParam = defineModel('extendParam', {
}); });
// 监听extendParam的变化解析并赋值给goodsId // 监听extendParam的变化解析并赋值给goodsId
watch(extendParam, (newExtendParam, oldExtendParam) => { watch(extendParam, async (newExtendParam, oldExtendParam) => {
// console.log('extendParam变化', newExtendParam); // console.log('extendParam变化', newExtendParam);
// 1. 空值判断如果extendParam为空重置goodsId // 1. 空值判断如果extendParam为空重置goodsId
@@ -121,12 +122,23 @@ watch(extendParam, (newExtendParam, oldExtendParam) => {
// 3. 提取值并赋值:匹配成功则赋值,否则重置 // 3. 提取值并赋值:匹配成功则赋值,否则重置
if (matchResult && matchResult[1]) { if (matchResult && matchResult[1]) {
const extractedGoodsId = matchResult[1]; let extractedGoodsId = matchResult[1];
goodsId.value = extractedGoodsId; // 赋值给goodsId模型属性
// console.log('解析出的goodsId', extractedGoodsId); // 尝试将 id 转为数字(如果看起来像数字)以保持与后端 id 类型一致
const numeric = Number(extractedGoodsId);
const parsedId = !Number.isNaN(numeric) ? numeric : extractedGoodsId;
// 确保 options 已加载,这样 el-select 能根据 value 匹配到对应的 label
try {
await getGoodsList();
} catch (e) {
// ignore
}
// 统一使用字符串类型的 id 以保证与 options 中的 value 匹配
goodsId.value = String(parsedId);
} else { } else {
goodsId.value = ''; // 匹配失败时清空 goodsId.value = ''; // 匹配失败时清空
// console.log('未解析到goodsId');
} }
}, { }, {
immediate: true, // 初始加载时立即执行一次解析 immediate: true, // 初始加载时立即执行一次解析
@@ -135,7 +147,13 @@ watch(extendParam, (newExtendParam, oldExtendParam) => {
// 具体菜品选择变化 // 具体菜品选择变化
function goodsIdChange(value) { function goodsIdChange(value) {
// 设置扩展参数 // 设置扩展参数,处理清空情况以避免出现 'undefined'
if (value === null || typeof value === 'undefined' || value === '') {
extendParam.value = '';
goodsId.value = '';
return;
}
extendParam.value = `goodsId=${value}`; extendParam.value = `goodsId=${value}`;
} }
@@ -152,21 +170,27 @@ async function getGoodsList(value = '') {
if (jumpPageName.value == '套餐推广商品详情页') { if (jumpPageName.value == '套餐推广商品详情页') {
const res = await packageGet({ page: 1, size: 999, packageName: value }); const res = await packageGet({ page: 1, size: 999, packageName: value });
list = res.records.map(item => ({ list = res.records.map(item => ({
id: item.id, id: String(item.id),
name: item.packageName name: item.packageName
})); }));
} else if (jumpPageName.value == '商品拼团详情页') { } else if (jumpPageName.value == '商品拼团详情页') {
const res = await getGbWarePage({ page: 1, size: 999, wareName: value }); const res = await getGbWarePage({ page: 1, size: 999, wareName: value });
list = res.records.map(item => ({ list = res.records.map(item => ({
id: item.id, id: String(item.id),
name: item.wareName name: item.wareName
})); }));
} else if (jumpPageName.value == '点餐商品详情弹窗页') { } else if (jumpPageName.value == '点餐商品详情弹窗页') {
const res = await productApi.getPage({ name: value }); const res = await productApi.getPage({ name: value });
list = res.records.map(item => ({ list = res.records.map(item => ({
id: item.id, id: String(item.id),
name: item.name name: item.name
})); }));
} else if (jumpPageName.value == '积分商品详情页面') {
const res = await pointsGoodsPage({ page: 1, size: 999 });
list = res.records.map(item => ({
id: String(item.id),
name: item.goodsName
}));
} }
goodsList.value = list; goodsList.value = list;
loading.value = false; loading.value = false;