hookehuyr

feat(Activities): 动态获取地图URL并添加用户openid参数

重构活动页面WebView组件,新增动态获取地图URL功能
添加用户openid参数到URL中
增加错误处理和备用URL机制
1 +/*
2 + * @Date: 2025-09-04 17:23:17
3 + * @LastEditors: hookehuyr hookehuyr@gmail.com
4 + * @LastEditTime: 2025-09-04 17:23:43
5 + * @FilePath: /lls_program/src/api/map.js
6 + * @Description: 文件描述
7 + */
8 +import { fn, fetch } from './fn';
9 +
10 +const Api = {
11 + GET_MAP_URL: '/srv/?a=map&t=get_map_url',
12 +}
13 +
14 +/**
15 + * @description: 获取地图URL
16 + * @param {Object} params - 请求参数
17 + * @returns {number} response.code - 响应状态码
18 + * @returns {string} response.msg - 响应消息
19 + * @returns {Object} response.data - 响应数据
20 + * @returns {string} response.data.url - 地图URL
21 + */
22 +export const getMapUrlAPI = (params) => fn(fetch.get(Api.GET_MAP_URL, params));
...@@ -32,6 +32,9 @@ ...@@ -32,6 +32,9 @@
32 import { ref, onMounted } from 'vue' 32 import { ref, onMounted } from 'vue'
33 import Taro from '@tarojs/taro' 33 import Taro from '@tarojs/taro'
34 import BottomNav from '../../components/BottomNav.vue' 34 import BottomNav from '../../components/BottomNav.vue'
35 +// 获取接口信息
36 +import { getUserProfileAPI } from '@/api/user'
37 +import { getMapUrlAPI } from '@/api/map'
35 38
36 /** 39 /**
37 * 活动页面WebView组件 40 * 活动页面WebView组件
...@@ -42,7 +45,7 @@ import BottomNav from '../../components/BottomNav.vue' ...@@ -42,7 +45,7 @@ import BottomNav from '../../components/BottomNav.vue'
42 const webUrl = ref('') // 动态设置URL 45 const webUrl = ref('') // 动态设置URL
43 const loading = ref(true) 46 const loading = ref(true)
44 const error = ref(false) 47 const error = ref(false)
45 -const baseUrl = 'https://oa.onwall.cn/f/map/#/checkin/?id=2400107' // 基础URL 48 +const baseUrl = ref('') // 动态获取的基础URL
46 49
47 /** 50 /**
48 * 处理WebView加载完成 51 * 处理WebView加载完成
...@@ -92,28 +95,61 @@ const handleRetry = () => { ...@@ -92,28 +95,61 @@ const handleRetry = () => {
92 /** 95 /**
93 * 构建包含位置参数的URL 96 * 构建包含位置参数的URL
94 */ 97 */
95 -const buildUrlWithLocation = (lng, lat) => { 98 +const buildUrlWithLocation = (lng, lat, openid) => {
96 - if (lng && lat) { 99 + if (lng && lat && baseUrl.value) {
97 - const separator = baseUrl.includes('?') ? '&' : '?' 100 + const separator = baseUrl.value.includes('?') ? '&' : '?'
98 - return `${baseUrl}${separator}current_lng=${lng}&current_lat=${lat}` 101 + return `${baseUrl.value}${separator}current_lng=${lng}&current_lat=${lat}&openid=${openid}`
102 + }
103 + return baseUrl.value || ''
104 +}
105 +
106 +/**
107 + * 初始化页面数据
108 + */
109 +const initPageData = async () => {
110 + try {
111 + // 获取地图URL
112 + const mapUrlResponse = await getMapUrlAPI()
113 + if (mapUrlResponse.code && mapUrlResponse.data?.url) {
114 + baseUrl.value = mapUrlResponse.data.url
115 + console.log('获取到的地图URL:', baseUrl.value)
116 + } else {
117 + console.error('获取地图URL失败:', mapUrlResponse.msg)
118 + // 使用默认URL作为备用
119 + baseUrl.value = 'https://oa.onwall.cn/f/map/#/checkin/?id=2400107'
120 + }
121 +
122 + // 获取用户信息
123 + const { code, data } = await getUserProfileAPI()
124 + if (code) {
125 + // 获取路由参数中的经纬度信息
126 + const instance = Taro.getCurrentInstance()
127 + const { current_lng, current_lat } = instance.router?.params || {}
128 +
129 + console.log('接收到的位置参数:', { current_lng, current_lat })
130 + // 处理用户信息
131 + const openid = data?.user.openid || ''
132 + // 构建完整的URL
133 + webUrl.value = buildUrlWithLocation(current_lng, current_lat, openid)
134 +
135 + console.log('最终WebView URL:', webUrl.value)
136 + }
137 + } catch (error) {
138 + console.error('初始化页面数据失败:', error)
139 + // 使用默认URL作为备用
140 + baseUrl.value = 'https://oa.onwall.cn/f/map/#/checkin/?id=2400107'
141 +
142 + Taro.showToast({
143 + title: '获取地图信息失败',
144 + icon: 'none'
145 + })
99 } 146 }
100 - return baseUrl
101 } 147 }
102 148
103 // 页面挂载时初始化 149 // 页面挂载时初始化
104 -onMounted(() => { 150 +onMounted(async () => {
105 console.log('活动页面WebView初始化') 151 console.log('活动页面WebView初始化')
106 - 152 + await initPageData()
107 - // 获取路由参数中的经纬度信息
108 - const instance = Taro.getCurrentInstance()
109 - const { current_lng, current_lat } = instance.router?.params || {}
110 -
111 - console.log('接收到的位置参数:', { current_lng, current_lat })
112 -
113 - // 构建完整的URL
114 - webUrl.value = buildUrlWithLocation(current_lng, current_lat)
115 -
116 - console.log('最终WebView URL:', webUrl.value)
117 }) 153 })
118 </script> 154 </script>
119 155
......