fix(Activities): 优化活动详情展示和参数传递
- CheckinMap: 添加日期格式化函数,将 YYYY-MM-DD 转换为 YYYY.MM.DD 格式 - ActivitiesDetail: 添加 discount_title 字段支持,并在跳转时传递该参数 - Activities: 接收并处理 discount_title 参数,构建完整的活动 URL Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Showing
3 changed files
with
41 additions
and
18 deletions
| ... | @@ -53,7 +53,7 @@ const baseUrl = ref('') // 动态获取的基础URL | ... | @@ -53,7 +53,7 @@ const baseUrl = ref('') // 动态获取的基础URL |
| 53 | /** | 53 | /** |
| 54 | * 处理WebView加载完成 | 54 | * 处理WebView加载完成 |
| 55 | */ | 55 | */ |
| 56 | -const handleLoad = (e) => { | 56 | +const handleLoad = e => { |
| 57 | console.log('WebView加载完成:', e) | 57 | console.log('WebView加载完成:', e) |
| 58 | loading.value = false | 58 | loading.value = false |
| 59 | error.value = false | 59 | error.value = false |
| ... | @@ -62,21 +62,21 @@ const handleLoad = (e) => { | ... | @@ -62,21 +62,21 @@ const handleLoad = (e) => { |
| 62 | /** | 62 | /** |
| 63 | * 处理WebView加载错误 | 63 | * 处理WebView加载错误 |
| 64 | */ | 64 | */ |
| 65 | -const handleError = (e) => { | 65 | +const handleError = e => { |
| 66 | console.error('WebView加载错误:', e) | 66 | console.error('WebView加载错误:', e) |
| 67 | loading.value = false | 67 | loading.value = false |
| 68 | error.value = true | 68 | error.value = true |
| 69 | 69 | ||
| 70 | Taro.showToast({ | 70 | Taro.showToast({ |
| 71 | title: '页面加载失败', | 71 | title: '页面加载失败', |
| 72 | - icon: 'none' | 72 | + icon: 'none', |
| 73 | }) | 73 | }) |
| 74 | } | 74 | } |
| 75 | 75 | ||
| 76 | /** | 76 | /** |
| 77 | * 处理WebView消息 | 77 | * 处理WebView消息 |
| 78 | */ | 78 | */ |
| 79 | -const handleMessage = (e) => { | 79 | +const handleMessage = e => { |
| 80 | console.log('WebView消息:', e) | 80 | console.log('WebView消息:', e) |
| 81 | // 可以在这里处理来自WebView的消息 | 81 | // 可以在这里处理来自WebView的消息 |
| 82 | } | 82 | } |
| ... | @@ -96,11 +96,11 @@ const handleRetry = () => { | ... | @@ -96,11 +96,11 @@ const handleRetry = () => { |
| 96 | */ | 96 | */ |
| 97 | const handleGoBack = () => { | 97 | const handleGoBack = () => { |
| 98 | Taro.navigateBack({ | 98 | Taro.navigateBack({ |
| 99 | - delta: 1 | 99 | + delta: 1, |
| 100 | }).catch(() => { | 100 | }).catch(() => { |
| 101 | // 如果无法返回,则跳转到首页 | 101 | // 如果无法返回,则跳转到首页 |
| 102 | Taro.redirectTo({ | 102 | Taro.redirectTo({ |
| 103 | - url: '/pages/Dashboard/index' | 103 | + url: '/pages/Dashboard/index', |
| 104 | }) | 104 | }) |
| 105 | }) | 105 | }) |
| 106 | } | 106 | } |
| ... | @@ -108,10 +108,10 @@ const handleGoBack = () => { | ... | @@ -108,10 +108,10 @@ const handleGoBack = () => { |
| 108 | /** | 108 | /** |
| 109 | * 构建包含位置参数的URL | 109 | * 构建包含位置参数的URL |
| 110 | */ | 110 | */ |
| 111 | -const buildUrlWithLocation = (lng, lat, openid) => { | 111 | +const buildUrlWithLocation = (lng, lat, openid, discount_title) => { |
| 112 | if (lng && lat && baseUrl.value) { | 112 | if (lng && lat && baseUrl.value) { |
| 113 | const separator = baseUrl.value.includes('?') ? '&' : '?' | 113 | const separator = baseUrl.value.includes('?') ? '&' : '?' |
| 114 | - return `${baseUrl.value}${separator}current_lng=${lng}¤t_lat=${lat}&openid=${openid}` | 114 | + return `${baseUrl.value}${separator}current_lng=${lng}¤t_lat=${lat}&openid=${openid}&discount_title=${discount_title}` |
| 115 | } | 115 | } |
| 116 | return baseUrl.value || '' | 116 | return baseUrl.value || '' |
| 117 | } | 117 | } |
| ... | @@ -133,7 +133,7 @@ const initPageData = async () => { | ... | @@ -133,7 +133,7 @@ const initPageData = async () => { |
| 133 | loading.value = false | 133 | loading.value = false |
| 134 | Taro.showToast({ | 134 | Taro.showToast({ |
| 135 | title: mapUrlResponse.msg || '获取地图信息失败', | 135 | title: mapUrlResponse.msg || '获取地图信息失败', |
| 136 | - icon: 'none' | 136 | + icon: 'none', |
| 137 | }) | 137 | }) |
| 138 | return | 138 | return |
| 139 | } | 139 | } |
| ... | @@ -143,13 +143,13 @@ const initPageData = async () => { | ... | @@ -143,13 +143,13 @@ const initPageData = async () => { |
| 143 | if (code) { | 143 | if (code) { |
| 144 | // 获取路由参数中的经纬度信息 | 144 | // 获取路由参数中的经纬度信息 |
| 145 | const instance = Taro.getCurrentInstance() | 145 | const instance = Taro.getCurrentInstance() |
| 146 | - const { current_lng, current_lat } = instance.router?.params || {} | 146 | + const { current_lng, current_lat, discount_title } = instance.router?.params || {} |
| 147 | 147 | ||
| 148 | - console.log('接收到的位置参数:', { current_lng, current_lat }) | 148 | + console.log('接收到的位置参数:', { current_lng, current_lat, discount_title }) |
| 149 | // 处理用户信息 | 149 | // 处理用户信息 |
| 150 | const openid = data?.user.openid || '' | 150 | const openid = data?.user.openid || '' |
| 151 | // 构建完整的URL | 151 | // 构建完整的URL |
| 152 | - webUrl.value = buildUrlWithLocation(current_lng, current_lat, openid) | 152 | + webUrl.value = buildUrlWithLocation(current_lng, current_lat, openid, discount_title) |
| 153 | 153 | ||
| 154 | console.log('最终WebView URL:', webUrl.value) | 154 | console.log('最终WebView URL:', webUrl.value) |
| 155 | } | 155 | } |
| ... | @@ -161,7 +161,7 @@ const initPageData = async () => { | ... | @@ -161,7 +161,7 @@ const initPageData = async () => { |
| 161 | 161 | ||
| 162 | Taro.showToast({ | 162 | Taro.showToast({ |
| 163 | title: '获取地图信息失败', | 163 | title: '获取地图信息失败', |
| 164 | - icon: 'none' | 164 | + icon: 'none', |
| 165 | }) | 165 | }) |
| 166 | } | 166 | } |
| 167 | } | 167 | } |
| ... | @@ -214,8 +214,12 @@ onMounted(async () => { | ... | @@ -214,8 +214,12 @@ onMounted(async () => { |
| 214 | } | 214 | } |
| 215 | 215 | ||
| 216 | @keyframes spin { | 216 | @keyframes spin { |
| 217 | - 0% { transform: rotate(0deg); } | 217 | + 0% { |
| 218 | - 100% { transform: rotate(360deg); } | 218 | + transform: rotate(0deg); |
| 219 | + } | ||
| 220 | + 100% { | ||
| 221 | + transform: rotate(360deg); | ||
| 222 | + } | ||
| 219 | } | 223 | } |
| 220 | 224 | ||
| 221 | .error-container { | 225 | .error-container { | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2026-02-09 | 2 | * @Date: 2026-02-09 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2026-02-09 | 4 | + * @LastEditTime: 2026-02-09 18:55:56 |
| 5 | * @FilePath: /lls_program/src/pages/ActivitiesDetail/index.vue | 5 | * @FilePath: /lls_program/src/pages/ActivitiesDetail/index.vue |
| 6 | * @Description: 活动详情页面 - 完全使用 map_activity.js 新接口,支持多活动详情展示 | 6 | * @Description: 活动详情页面 - 完全使用 map_activity.js 新接口,支持多活动详情展示 |
| 7 | --> | 7 | --> |
| ... | @@ -580,7 +580,7 @@ const handleJoinActivity = async () => { | ... | @@ -580,7 +580,7 @@ const handleJoinActivity = async () => { |
| 580 | 580 | ||
| 581 | // 跳转到Activities页面,并传递位置参数 | 581 | // 跳转到Activities页面,并传递位置参数 |
| 582 | await Taro.navigateTo({ | 582 | await Taro.navigateTo({ |
| 583 | - url: `/pages/Activities/index?current_lng=${userLocation.value.lng}¤t_lat=${userLocation.value.lat}`, | 583 | + url: `/pages/Activities/index?current_lng=${userLocation.value.lng}¤t_lat=${userLocation.value.lat}&discount_title=${activityData.value.discount_title}`, |
| 584 | }) | 584 | }) |
| 585 | } catch (error) { | 585 | } catch (error) { |
| 586 | console.error('参加活动失败:', error) | 586 | console.error('参加活动失败:', error) |
| ... | @@ -971,6 +971,7 @@ const transformApiDataToActivityData = apiData => { | ... | @@ -971,6 +971,7 @@ const transformApiDataToActivityData = apiData => { |
| 971 | description: `欢迎参加${apiData.title}活动!`, | 971 | description: `欢迎参加${apiData.title}活动!`, |
| 972 | rules: rules, | 972 | rules: rules, |
| 973 | rewards: rewards, | 973 | rewards: rewards, |
| 974 | + discount_title: apiData.discount_title || '打卡点专属优惠', | ||
| 974 | } | 975 | } |
| 975 | } | 976 | } |
| 976 | 977 | ... | ... |
| ... | @@ -55,6 +55,23 @@ const mapList = ref([]) | ... | @@ -55,6 +55,23 @@ const mapList = ref([]) |
| 55 | const loading = ref(false) | 55 | const loading = ref(false) |
| 56 | 56 | ||
| 57 | /** | 57 | /** |
| 58 | + * 格式化日期显示 | ||
| 59 | + * @description 将后端返回的 YYYY-MM-DD 格式转换为 YYYY.MM.DD 格式 | ||
| 60 | + * @param {string} dateStr - 原始日期字符串(如 "2026-02-28") | ||
| 61 | + * @returns {string} 格式化后的日期(如 "2026.02.28") | ||
| 62 | + * | ||
| 63 | + * @example | ||
| 64 | + * formatDate("2026-02-28") // 返回 "2026.02.28" | ||
| 65 | + */ | ||
| 66 | +const formatDate = dateStr => { | ||
| 67 | + if (!dateStr) { | ||
| 68 | + return '' | ||
| 69 | + } | ||
| 70 | + // 将 "-" 替换为 "." | ||
| 71 | + return dateStr.replace(/-/g, '.') | ||
| 72 | +} | ||
| 73 | + | ||
| 74 | +/** | ||
| 58 | * 格式化 API 数据为页面所需格式 | 75 | * 格式化 API 数据为页面所需格式 |
| 59 | * @param {Array} list - API 返回的活动列表 | 76 | * @param {Array} list - API 返回的活动列表 |
| 60 | * @returns {Array} 格式化后的活动列表 | 77 | * @returns {Array} 格式化后的活动列表 |
| ... | @@ -65,7 +82,8 @@ const formatMapList = list => { | ... | @@ -65,7 +82,8 @@ const formatMapList = list => { |
| 65 | title: item.title, | 82 | title: item.title, |
| 66 | // 如果 cover 为空,使用默认封面图 | 83 | // 如果 cover 为空,使用默认封面图 |
| 67 | cover: item.cover && item.cover.trim() !== '' ? item.cover : DEFAULT_COVER, | 84 | cover: item.cover && item.cover.trim() !== '' ? item.cover : DEFAULT_COVER, |
| 68 | - timeRange: `${item.begin_date}~${item.end_date}`, | 85 | + // 格式化日期:2026-02-28 → 2026.02.28 |
| 86 | + timeRange: `${formatDate(item.begin_date)}~${formatDate(item.end_date)}`, | ||
| 69 | activityId: item.id, | 87 | activityId: item.id, |
| 70 | })) | 88 | })) |
| 71 | } | 89 | } | ... | ... |
-
Please register or login to post a comment