hookehuyr

feat(活动页面): 添加活动状态检查并更新分享配置

- 在ShareButton组件中移除默认的活动banner图片,仅使用shareConfig中的imageUrl
- 在map.js中添加获取活动状态和保存海报背景的API接口
- 在ActivitiesCover页面中添加活动状态检查逻辑,根据活动状态禁用按钮并更新分享配置
- 更新分享标题和路径配置,移除硬编码的分享标题
/*
* @Date: 2025-09-04 17:23:17
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-17 11:35:23
* @LastEditTime: 2025-09-17 14:36:35
* @FilePath: /lls_program/src/api/map.js
* @Description: 文件描述
*/
......@@ -10,6 +10,8 @@ import { fn, fetch } from './fn';
const Api = {
GET_MAP_URL: '/srv/?a=map&t=get_map_url',
GET_POSTER_DETAIL: '/srv/?a=map&t=poster',
GET_ACTIVITY_STATUS: '/srv/?a=map&t=get_map_url',
SAVE_POSTER_BACKGROUND: '/srv/?a=map&t=save_poster_background',
}
/**
......@@ -33,6 +35,7 @@ export const getMapUrlAPI = (params) => fn(fetch.get(Api.GET_MAP_URL, params));
* @returns {Array} response.data.details - 关卡列表
* @returns {Object} response.data.details[].id - 关卡ID
* @returns {string} response.data.details[].name - 关卡名称
* @returns {string} response.data.details[].is_checked - 关卡是否已完成, 1 已完成, 0 未完成
* @returns {string} response.data.details[].background_url - 关卡背景图URL
* @returns {string} response.data.details[].main_slogan - 关卡主 slogan
* @returns {string} response.data.details[].sub_slogan - 关卡子 slogan
......@@ -44,3 +47,24 @@ export const getMapUrlAPI = (params) => fn(fetch.get(Api.GET_MAP_URL, params));
* @returns {string} response.data.qrcode_url - 小程序码
*/
export const getPosterDetailAPI = (params) => fn(fetch.get(Api.GET_POSTER_DETAIL, params));
/**
* @description: 获取活动状态
* @param {Object} params - 请求参数
* @returns {number} response.code - 响应状态码
* @returns {string} response.msg - 响应消息
* @returns {Object} response.data - 响应数据
* @returns {boolean} response.data.is_ended - 活动是否已经结束, 1 已结束, 0 未结束
*/
export const getActivityStatusAPI = (params) => fn(fetch.get(Api.GET_ACTIVITY_STATUS, params));
/**
* @description: 保存海报背景
* @param {Object} params - 请求参数
* @param {string} params.detail_id - 海报详情ID
* @param {string} params.poster_background_url - 海报背景图URL
* @returns {number} response.code - 响应状态码
* @returns {string} response.msg - 响应消息
* @returns {Object} response.data - 响应数据
*/
export const savePosterBackgroundAPI = (params) => fn(fetch.post(Api.SAVE_POSTER_BACKGROUND, params));
......
<!--
* @Date: 2025-09-03 14:34:58
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-15 12:52:03
* @LastEditTime: 2025-09-17 17:35:27
* @FilePath: /lls_program/src/components/ShareButton/index.vue
* @Description: 分享按钮组件 - 点击后弹出分享选项
-->
......@@ -62,7 +62,7 @@ const onShareAppMessage = (res) => {
const shareData = {
title: props.shareConfig.title || '精彩活动等你参与',
path: addShareFlag(props.shareConfig.path || '/pages/ActivitiesCover/index'),
imageUrl: props.shareConfig.imageUrl || props.activityData.banner || ''
imageUrl: props.shareConfig.imageUrl || ''
}
// 触发分享事件
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-16 20:11:36
* @LastEditTime: 2025-09-17 17:34:36
* @FilePath: /lls_program/src/pages/ActivitiesCover/index.vue
* @Description: 活动海报页面 - 展示活动信息并处理定位授权
-->
......@@ -17,6 +17,7 @@
<!-- 分享按钮组件 -->
<ShareButton
:activity-data="activityData"
:share-config="shareConfig"
@share-activity="onShareActivity"
@share-poster="onSharePoster"
class="share-button-wrapper"
......@@ -46,8 +47,9 @@
type="primary"
size="large"
class="join-button"
:color="THEME_COLORS.PRIMARY"
:loading="isJoining"
:color="activityStatus.is_ended ? '#cccccc' : THEME_COLORS.PRIMARY"
:loading="isJoining || activityStatus.loading"
:disabled="activityStatus.is_ended"
@click="checkFamilyStatusAndJoinActivity"
>
{{ getButtonText() }}
......@@ -138,6 +140,7 @@ import PosterBuilder from '../../components/PosterBuilder/index.vue'
import ShareButton from '../../components/ShareButton/index.vue'
// 接口信息
import { getMyFamiliesAPI } from '@/api/family'
import { getActivityStatusAPI } from '@/api/map'
import { handleSharePageAuth, addShareFlag } from '@/utils/authRedirect'
// 导入主题颜色
import { THEME_COLORS } from '@/utils/config';
......@@ -157,6 +160,12 @@ const userLocation = ref({ lng: null, lat: null }) // 用户位置信息
const hasJoinedFamily = ref(false);
const showLocationPrompt = ref(false) // 是否显示定位权限提示
// 活动状态相关
const activityStatus = ref({
is_ended: false, // 活动是否已结束
loading: false // 是否正在加载活动状态
})
// Dialog 相关状态
const showLocationDialog = ref(false) // 是否显示位置权限申请弹窗
const pendingLocationCallback = ref(null) // 待执行的位置获取回调
......@@ -202,6 +211,13 @@ const activityData = ref({
]
})
// 分享配置
const shareConfig = ref({
title: '主题路线打卡活动等你参与',
path: '/pages/ActivitiesCover/index',
imageUrl: '',
})
/**
* 检查定位授权状态
*/
......@@ -306,6 +322,11 @@ const getUserLocation = async (skipAuthCheck = false) => {
* 获取按钮显示文本
*/
const getButtonText = () => {
// 如果活动已结束,显示"活动已结束"
if (activityStatus.value.is_ended) {
return '活动已结束'
}
// 如果没有加入家庭,显示"加入家庭"
if (!hasJoinedFamily.value) {
return '参加活动'
......@@ -508,7 +529,7 @@ const onShareActivity = () => {
*/
const onShareAppMessage = () => {
return {
title: '分享活动海报',
title: '主题路线打卡活动等你参与',
path: addShareFlag('/pages/ActivitiesCover/index'),
success: (res) => {
// 分享成功
......@@ -845,10 +866,38 @@ const initPageData = async () => {
}
}
// 获取活动状态
await fetchActivityStatus()
// 检查定位授权状态(不获取位置,只检查权限)
await checkLocationAuth()
}
/**
* 获取活动状态
*/
const fetchActivityStatus = async () => {
try {
activityStatus.value.loading = true
const { code, data } = await getActivityStatusAPI()
if (code === 1 && data) {
activityStatus.value.is_ended = Boolean(data.is_ended)
console.log('活动状态:', activityStatus.value.is_ended ? '已结束' : '进行中')
} else {
console.warn('获取活动状态失败:', data)
// 默认认为活动未结束,避免影响用户体验
activityStatus.value.is_ended = false
}
} catch (error) {
console.error('获取活动状态异常:', error)
// 默认认为活动未结束,避免影响用户体验
activityStatus.value.is_ended = false
} finally {
activityStatus.value.loading = false
}
}
// 处理页面加载时的授权检查
useLoad((options) => {
// 处理分享页面的授权逻辑
......