hookehuyr

feat(checkin): 支持从 URL 参数动态设置标签页标题

- 新增 updateDefaultTitleFromURL() 函数,支持从 URL 参数更新标签页默认标题
- 在 watch props.info 和 onMounted 中添加 discount_title 参数处理逻辑
- 优先级:接口返回标题 > URL 参数标题 > 默认标题

使用方式:
URL 示例: /checkin/info?id=xxx&discount_title=春节特别活动
效果: 所有标签页标题变为"春节特别活动"

相关文件:
- src/views/checkin/tab-config.js (新增函数)
- src/views/checkin/info.vue (添加 URL 参数处理)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
......@@ -98,7 +98,7 @@ import { mapAPI, mapAudioAPI } from '@/api/map.js'
import { isCheckedAPI, checkinAPI } from '@/api/checkin.js'
import { getAdaptiveFontSize, getAdaptivePadding, getDeviceInfo } from '@/utils/tools.js'
// 导入标签页配置和工具函数
import { TAB_CONFIGS, setTabTitles, updateTabConfigsFromAPI } from './tab-config.js'
import { TAB_CONFIGS, setTabTitles, updateTabConfigsFromAPI, updateDefaultTitleFromURL } from './tab-config.js'
const store = mainStore();
const { audio_status, audio_entity, audio_list_status, audio_list_entity } = storeToRefs(store);
......@@ -164,6 +164,12 @@ watch(
// 更新page_details数据
page_details.value = { ...newInfo.details[0], position: newInfo.position, path: newInfo.path, current_lng: newInfo.current_lng, current_lat: newInfo.current_lat, openid: newInfo.openid };
// 如果 URL 参数中有 discount_title,更新标签页默认标题
const discountTitle = $route.query.discount_title;
if (discountTitle) {
tab_configs.value = updateDefaultTitleFromURL(discountTitle, tab_configs.value);
}
// 使用工具函数设置标签页标题
page_details.value = setTabTitles(page_details.value, tab_configs.value);
......@@ -257,6 +263,12 @@ onMounted(async () => {
page_details.value.story = page_details.value.story?.replace(/\<hr\>/g, '<div class="van-hairline--bottom" style="margin: 1rem 0;"></div>')
page_details.value.experience = page_details.value.experience?.replace(/\<hr\>/g, '<div class="van-hairline--bottom" style="margin: 1rem 0;"></div>')
// 如果 URL 参数中有 discount_title,更新标签页默认标题
const discountTitle = $route.query.discount_title;
if (discountTitle) {
tab_configs.value = updateDefaultTitleFromURL(discountTitle, tab_configs.value);
}
// 使用工具函数设置标签页标题
page_details.value = setTabTitles(page_details.value, tab_configs.value);
......
......@@ -135,3 +135,26 @@ export function updateTabConfigsFromAPI(apiData, tab_configs = TAB_CONFIGS) {
export function getVisibleTabConfigs(page_details, tab_configs = TAB_CONFIGS) {
return tab_configs.filter(config => page_details[config.content_key])
}
/**
* 从 URL 参数更新标签页默认标题
*
* @description 如果 URL 中有 discount_title 参数,用它更新所有标签页的默认标题
* @param {string} discount_title - 从 URL 参数获取的标题
* @param {Array<Object>} tab_configs - 标签页配置数组
* @returns {Array<Object>} 更新后的标签页配置数组
*
* @example
* const tab_configs = updateDefaultTitleFromURL('敬老月特别优惠')
* // 所有标签页的 default_title 都会被更新为 '敬老月特别优惠'
*/
export function updateDefaultTitleFromURL(discount_title, tab_configs = TAB_CONFIGS) {
if (!discount_title) {
return tab_configs
}
return tab_configs.map(config => ({
...config,
default_title: discount_title
}))
}
......