pcwl_yancheng/uni-fans-score
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix：修正优化首页、个人中心页面广告图url跳转

Browse Source
This commit is contained in:
ISFP_T
2025-12-15 17:37:52 +08:00
parent d12986b85e
commit 9d4e229312
8 changed files with 197 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/MapComponent.vue
-10
View File
@@ -247,14 +247,12 @@
// 监听广告图片变化，启动或停止轮播
watch(() => props.bannerImages, (newImages, oldImages) => {
console.log('广告图片变化:', newImages?.length, '张')
// 先停止旧的轮播
stopBannerRotation()
currentBannerIndex.value = 0
// 如果有多张图片，启动新的轮播
if (newImages && newImages.length > 1) {
console.log('启动广告轮播，共', newImages.length, '张图片')
// 使用 nextTick 确保 DOM 已更新
nextTick(() => {
startBannerRotation()
@@ -384,29 +382,23 @@ const handleSearch = () => {
// 处理广告点击
const handleBannerTap = () => {
console.log('点击地图广告:', currentBannerIndex.value, currentBannerImage.value)
// 触发父组件处理点击事件
emit('bannerClick', currentBannerIndex.value)
// 默认跳转到合作加盟页面
handleJoinTap()
}
// 启动广告轮播
const startBannerRotation = () => {
// 如果只有一张或没有图片，不需要轮播
if (!props.bannerImages || props.bannerImages.length <= 1) {
console.log('图片数量不足，不启动轮播')
return
}
// 清除旧的定时器
stopBannerRotation()
console.log('开始广告轮播定时器')
// 每3秒切换一次
bannerTimer = setInterval(() => {
const nextIndex = (currentBannerIndex.value + 1) % props.bannerImages.length
console.log('轮播切换:', currentBannerIndex.value, '->', nextIndex)
currentBannerIndex.value = nextIndex
}, 3000)
}
@@ -414,7 +406,6 @@ const handleSearch = () => {
// 停止广告轮播
const stopBannerRotation = () => {
if (bannerTimer) {
console.log('停止广告轮播')
clearInterval(bannerTimer)
bannerTimer = null
}
@@ -450,7 +441,6 @@ const handleSearch = () => {
// 初始化广告轮播
if (props.bannerImages && props.bannerImages.length > 1) {
console.log('onMounted: 初始化广告轮播')
startBannerRotation()
}
})
config/url.js
+2 -2
View File
@@ -1,6 +1,6 @@
// export const URL = "https://my.gxfs123.com/api" //正式服务器-弃用
// export const URL = "https://manager.fdzpower.com/api" //正式服务器
export const URL = "https://fansdev.gxfs123.com/api" //测试服务器
export const URL = "https://manager.fdzpower.com/api" //正式服务器
// export const URL = "https://fansdev.gxfs123.com/api" //测试服务器
// export const URL = "http://192.168.5.30:8080" //本地调试
// export const URL = "http://127.0.0.1:8080" //本地调试
locale/en-US.js
+1
View File
@@ -11,6 +11,7 @@ export default {
filling: 'Filling...',
save: 'Save',
loadFailed: 'Load failed',
invalidUrl: 'Invalid URL',
statusCode: 'Status Code',
message: 'Message',
none: 'None',
locale/zh-CN.js
+1
View File
@@ -11,6 +11,7 @@ export default {
filling: '补填中',
save: '保存',
loadFailed: '加载失败',
invalidUrl: '无效的链接',
statusCode: '状态码',
message: '消息',
none: '无',
pages.json
+8
View File
@@ -240,6 +240,14 @@
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/webview/index",
"style": {
"navigationBarTitleText": "",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}
],
"globalStyle": {
pages/index/index.vue
+53 -9
View File
@@ -292,6 +292,7 @@
const noticeText = ref('')
const bannerImages = ref([]) // 首页广告图片列表
const bannerImageList = ref([]) // 完整的广告配置列表（包含链接信息）
// 将语言代码转换为后端接受的格式
const convertLanguageCode = (lang) => {
@@ -373,11 +374,12 @@
console.log('首页广告响应:', res)
if (res.statusCode === 200 && res.data.code === 200 && res.data.data) {
// 使用 files 字段（图片列表）
const files = res.data.data.files || []
if (files.length > 0) {
bannerImages.value = files
console.log('首页广告加载成功，图片数量:', files.length)
// 使用 imageList 字段（包含图片和链接信息）
const imageList = res.data.data.imageList || []
if (imageList.length > 0) {
bannerImageList.value = imageList
// 提取图片URL用于展示
bannerImages.value = imageList.map(item => item.imageUrl)
} else {
console.warn('未获取到广告图片')
}
@@ -391,10 +393,52 @@
// 处理首页广告点击
const handleBannerClick = (index) => {
console.log('点击首页广告:', index, bannerImages.value[index])
// 可以根据需要添加跳转逻辑
// 例如跳转到合作加盟页面
uni.navigateTo({ url: '/pages/join/index' })
if (!bannerImageList.value || !bannerImageList.value[index]) {
console.warn('未找到对应的广告配置')
return
}
const config = bannerImageList.value[index]
console.log('点击首页广告:', index, config)
// 根据链接类型进行跳转
if (config.linkType === 'miniapp' && config.appId) {
// 跳转到外部小程序
// #ifdef MP-WEIXIN
uni.navigateToMiniProgram({
appId: config.appId,
path: config.linkUrl || '',
success: () => {
console.log('跳转小程序成功')
},
fail: (err) => {
console.error('跳转小程序失败:', err)
uni.showToast({
title: '跳转失败',
icon: 'none'
})
}
})
// #endif
// #ifndef MP-WEIXIN
uni.showToast({
title: '请在微信小程序中使用',
icon: 'none'
})
// #endif
} else if (config.linkType === 'external' && config.linkUrl) {
// 跳转到外部链接（H5页面）
uni.navigateTo({
url: `/pages/webview/index?url=${encodeURIComponent(config.linkUrl)}`
})
} else if (config.linkType === 'internal' && config.linkUrl) {
// 跳转到内部页面
uni.navigateTo({
url: config.linkUrl
})
} else {
console.log('无有效的跳转配置')
}
}
// 查询最近的活动
pages/my/index.vue
+54 -8
View File
@@ -159,6 +159,7 @@ import {
const showMenuItem = ref(false)
const bannerImages = ref([]) // 广告图片列表
const bannerImageList = ref([]) // 完整的广告配置列表（包含链接信息）
// 将语言代码转换为后端接受的格式
const convertLanguageCode = (lang) => {
@@ -192,11 +193,13 @@ import {
console.log('个人中心广告响应:', res)
if (res.statusCode === 200 && res.data.code === 200 && res.data.data) {
// 使用 files 字段（图片列表）
const files = res.data.data.files || []
if (files.length > 0) {
bannerImages.value = files
console.log('个人中心广告加载成功，图片数量:', files.length)
// 使用 imageList 字段（包含图片和链接信息）
const imageList = res.data.data.imageList || []
if (imageList.length > 0) {
bannerImageList.value = imageList
// 提取图片URL用于展示
bannerImages.value = imageList.map(item => item.imageUrl)
console.log('个人中心广告加载成功，图片数量:', imageList.length)
}
} else {
console.warn('获取个人中心广告失败:', res.data?.msg || '未知错误')
@@ -208,9 +211,52 @@ import {
// 处理广告点击
const handleBannerClick = (index) => {
console.log('点击广告:', index)
// 可以根据需要添加跳转逻辑
// 例如：navigateTo('/pages/join/index')
if (!bannerImageList.value || !bannerImageList.value[index]) {
console.warn('未找到对应的广告配置')
return
}
const config = bannerImageList.value[index]
console.log('点击广告:', index, config)
// 根据链接类型进行跳转
if (config.linkType === 'miniapp' && config.appId) {
// 跳转到外部小程序
// #ifdef MP-WEIXIN
uni.navigateToMiniProgram({
appId: config.appId,
path: config.linkUrl || '',
success: () => {
console.log('跳转小程序成功')
},
fail: (err) => {
console.error('跳转小程序失败:', err)
uni.showToast({
title: '跳转失败',
icon: 'none'
})
}
})
// #endif
// #ifndef MP-WEIXIN
uni.showToast({
title: '请在微信小程序中使用',
icon: 'none'
})
// #endif
} else if (config.linkType === 'external' && config.linkUrl) {
// 跳转到外部链接（H5页面）
uni.navigateTo({
url: `/pages/webview/index?url=${encodeURIComponent(config.linkUrl)}`
})
} else if (config.linkType === 'internal' && config.linkUrl) {
// 跳转到内部页面
uni.navigateTo({
url: config.linkUrl
})
} else {
console.log('无有效的跳转配置')
}
}
// 页面加载时初始化
pages/webview/index.vue
+78
View File
@@ -0,0 +1,78 @@
<template>
<view class="webview-container">
<!-- web-view 组件用于显示外部网页 -->
<web-view :src="webUrl" @message="handleMessage" @load="handleLoad" @error="handleError"></web-view>
</view>
</template>
<script setup>
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue';
import { useI18n } from '@/utils/i18n.js'
const { t: $t } = useI18n()
// 网页链接
const webUrl = ref('')
// 页面加载时获取传入的 URL 参数
onLoad((options) => {
if (options.url) {
// 解码 URL
webUrl.value = decodeURIComponent(options.url)
console.log('加载外部链接:', webUrl.value)
} else {
uni.showToast({
title: $t('common.invalidUrl') || '无效的链接',
icon: 'none',
duration: 2000
})
// 2秒后返回上一页
setTimeout(() => {
uni.navigateBack()
}, 2000)
}
})
// 网页加载完成
const handleLoad = (e) => {
console.log('网页加载完成:', e)
}
// 网页加载错误
const handleError = (e) => {
console.error('网页加载错误:', e)
uni.showToast({
title: $t('common.loadFailed') || '加载失败',
icon: 'none'
})
}
// 接收网页消息（web-view 向小程序发送消息）
const handleMessage = (e) => {
console.log('收到网页消息:', e)
// 可以根据需要处理网页发来的消息
}
</script>
<script>
export default {
// 支持分享
onShareAppMessage() {
const $t = this.$t || ((key) => key)
return {
title: $t('share.title') || '分享',
path: '/pages/index/index'
}
}
}
</script>
<style lang="scss" scoped>
.webview-container {
width: 100vw;
height: 100vh;
overflow: hidden;
}
</style>