个人中心页跳转实现
This commit is contained in:
WindowBird
parent
26ecf5f4c8
commit
897fc160a0
|
|
@ -8,12 +8,15 @@
|
|||
</view>
|
||||
|
||||
<!-- 背景图 -->
|
||||
<image class="bj" :src="templeData.imgUrl" mode="aspectFill"></image>
|
||||
<image :src="templeData.imgUrl" class="bj" mode="aspectFill"></image>
|
||||
<!-- 公告 -->
|
||||
<view class="announcement">
|
||||
<image class="ggimg" :src="pageConfig.announcement.icon" mode="" />
|
||||
<image :src="pageConfig.announcement.icon" class="ggimg" mode="" />
|
||||
<view class="marquee-wrap">
|
||||
<view class="marquee" :style="{ transform: `translateX(${marqueeX}rpx)` }">
|
||||
<view
|
||||
:style="{ transform: `translateX(${marqueeX}rpx)` }"
|
||||
class="marquee"
|
||||
>
|
||||
{{ templeData.bulletinContent }}
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -23,16 +26,16 @@
|
|||
<view class="audio-controls">
|
||||
<image
|
||||
v-if="pageConfig.topIcons.leftIcon.hidden"
|
||||
:class="{ playing: isAudioPlaying }"
|
||||
:src="pageConfig.topIcons.leftIcon.img"
|
||||
mode=""
|
||||
@click="playAudio"
|
||||
:class="{ playing: isAudioPlaying }"
|
||||
></image>
|
||||
<image
|
||||
:class="{ stopped: !isAudioPlaying }"
|
||||
:src="pageConfig.topIcons.rightIcon.img"
|
||||
mode=""
|
||||
@click="stopAudio"
|
||||
:class="{ stopped: !isAudioPlaying }"
|
||||
></image>
|
||||
</view>
|
||||
<view class="tubiao-item">
|
||||
|
|
@ -46,20 +49,22 @@
|
|||
<text>{{ bottomSection.openingTime.title }}</text>
|
||||
<image :src="bottomSection.openingTime.decorationImg" mode=""></image>
|
||||
</view>
|
||||
<view class="time"> {{ templeData.startTime }} - {{ templeData.endTime }} </view>
|
||||
<view class="time">
|
||||
{{ templeData.startTime }} - {{ templeData.endTime }}
|
||||
</view>
|
||||
<view class="hua">
|
||||
<image
|
||||
src="https://api.ccttiot.com/smartmeter/img/static/uyz1LDPTjPqeOzBMjLZ7"
|
||||
mode=""
|
||||
src="https://api.ccttiot.com/smartmeter/img/static/uyz1LDPTjPqeOzBMjLZ7"
|
||||
></image>
|
||||
</view>
|
||||
<view class="list-scroll">
|
||||
<view class="list">
|
||||
<!-- 导航项目列表 -->
|
||||
<view
|
||||
class="li"
|
||||
v-for="(item, index) in navigationItems"
|
||||
:key="index"
|
||||
class="li"
|
||||
@click="navigateToPage(item, index)"
|
||||
>
|
||||
<image :src="item.img" mode=""></image>
|
||||
|
|
@ -72,21 +77,34 @@
|
|||
</view>
|
||||
|
||||
<!-- 空状态提示 -->
|
||||
<view v-if="!loading && navigationItems.length === 0" class="empty-state">
|
||||
<view
|
||||
v-if="!loading && navigationItems.length === 0"
|
||||
class="empty-state"
|
||||
>
|
||||
<text>暂无功能项目</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-if="
|
||||
bottomSection.prayerSection &&
|
||||
bottomSection.prayerSection.backgroundImg
|
||||
"
|
||||
class="bottom"
|
||||
v-if="bottomSection.prayerSection && bottomSection.prayerSection.backgroundImg"
|
||||
>
|
||||
<image :src="bottomSection.prayerSection.backgroundImg" mode=""></image>
|
||||
<image
|
||||
:src="bottomSection.prayerSection.backgroundImg"
|
||||
mode=""
|
||||
@click="goToPersonalCenter"
|
||||
></image>
|
||||
<view class="rixing">
|
||||
{{ bottomSection.prayerSection.title }}
|
||||
</view>
|
||||
<view class="qifu" @click="goToPray">
|
||||
<image :src="bottomSection.prayerSection.prayerButton.icon" mode=""></image>
|
||||
<image
|
||||
:src="bottomSection.prayerSection.prayerButton.icon"
|
||||
mode=""
|
||||
></image>
|
||||
<view class="zaixian">
|
||||
<view class="da">
|
||||
{{ bottomSection.prayerSection.prayerButton.title }}
|
||||
|
|
@ -102,143 +120,145 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { navigateToPage } from '../../utils/router.js'
|
||||
import { getHomeConfig, getTempleIndex } from '../../api/index/index.js'
|
||||
import { getArticleById } from '../../api/article/article.js'
|
||||
import { navigateToPage } from "../../utils/router.js";
|
||||
import { getHomeConfig, getTempleIndex } from "../../api/index/index.js";
|
||||
import { getArticleById } from "../../api/article/article.js";
|
||||
|
||||
export default {
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
marqueeX: '', // 初始位置，和marquee-wrap宽度一致
|
||||
marqueeX: "", // 初始位置，和marquee-wrap宽度一致
|
||||
timer: null,
|
||||
loading: true, // 默认为true，等待API数据加载
|
||||
// 页面配置数据，完全依赖API
|
||||
pageConfig: {
|
||||
background: { img: '' },
|
||||
announcement: { icon: '', text: '' },
|
||||
background: { img: "" },
|
||||
announcement: { icon: "", text: "" },
|
||||
topIcons: {
|
||||
leftIcon: { hidden: false, img: '' },
|
||||
rightIcon: { img: '' },
|
||||
bottomIcon: { img: '' },
|
||||
leftIcon: { hidden: false, img: "" },
|
||||
rightIcon: { img: "" },
|
||||
bottomIcon: { img: "" },
|
||||
},
|
||||
},
|
||||
navigationItems: [],
|
||||
bottomSection: {
|
||||
openingTime: {
|
||||
title: '',
|
||||
time: '',
|
||||
decorationImg: '',
|
||||
title: "",
|
||||
time: "",
|
||||
decorationImg: "",
|
||||
},
|
||||
},
|
||||
templeData: {
|
||||
imgUrl: '',
|
||||
bulletinContent: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
audioUrl: '',
|
||||
imgUrl: "",
|
||||
bulletinContent: "",
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
audioUrl: "",
|
||||
},
|
||||
isAudioPlaying: false,
|
||||
audioContext: null,
|
||||
}
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
// 页面加载时获取配置
|
||||
this.loadHomeConfig()
|
||||
this.loadHomeConfig();
|
||||
// 获取寺庙数据
|
||||
this.loadTempleData()
|
||||
this.loadTempleData();
|
||||
},
|
||||
|
||||
// 添加下拉刷新支持
|
||||
onPullDownRefresh() {
|
||||
console.log('用户触发下拉刷新')
|
||||
console.log("用户触发下拉刷新");
|
||||
Promise.all([this.loadHomeConfig(), this.loadTempleData()]).finally(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
})
|
||||
uni.stopPullDownRefresh();
|
||||
});
|
||||
},
|
||||
onShow() {
|
||||
// 启动跑马灯（方法内部会检查是否有文本）
|
||||
this.startMarquee()
|
||||
this.startMarquee();
|
||||
},
|
||||
onUnload() {
|
||||
this.stopMarquee()
|
||||
this.stopMarquee();
|
||||
// 停止音频播放
|
||||
this.stopAudio()
|
||||
this.stopAudio();
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取首页配置
|
||||
*/
|
||||
async loadHomeConfig() {
|
||||
console.log('开始获取首页配置...')
|
||||
this.loading = true
|
||||
console.log("开始获取首页配置...");
|
||||
this.loading = true;
|
||||
|
||||
// 重试机制
|
||||
const maxRetries = 3
|
||||
let retryCount = 0
|
||||
const maxRetries = 3;
|
||||
let retryCount = 0;
|
||||
|
||||
while (retryCount < maxRetries) {
|
||||
try {
|
||||
console.log(`第 ${retryCount + 1} 次尝试获取配置...`)
|
||||
console.log(`第 ${retryCount + 1} 次尝试获取配置...`);
|
||||
|
||||
const response = await getHomeConfig()
|
||||
console.log('API响应:', response)
|
||||
const response = await getHomeConfig();
|
||||
console.log("API响应:", response);
|
||||
|
||||
// 简化验证：只检查关键字段
|
||||
if (response?.code === 200 && response?.data?.[0]?.body) {
|
||||
const parsedConfig = JSON.parse(response.data[0].body)
|
||||
const parsedConfig = JSON.parse(response.data[0].body);
|
||||
|
||||
// 更新页面配置
|
||||
this.updatePageConfig(parsedConfig)
|
||||
this.updatePageConfig(parsedConfig);
|
||||
|
||||
// 重新启动跑马灯
|
||||
this.stopMarquee()
|
||||
this.startMarquee()
|
||||
this.stopMarquee();
|
||||
this.startMarquee();
|
||||
|
||||
console.log('配置加载成功')
|
||||
break
|
||||
console.log("配置加载成功");
|
||||
break;
|
||||
} else {
|
||||
throw new Error('API响应数据无效')
|
||||
throw new Error("API响应数据无效");
|
||||
}
|
||||
} catch (error) {
|
||||
retryCount++
|
||||
console.error(`第 ${retryCount} 次尝试失败:`, error.message)
|
||||
retryCount++;
|
||||
console.error(`第 ${retryCount} 次尝试失败:`, error.message);
|
||||
|
||||
if (retryCount >= maxRetries) {
|
||||
console.error('所有重试都失败了')
|
||||
this.useDefaultConfig()
|
||||
break
|
||||
console.error("所有重试都失败了");
|
||||
this.useDefaultConfig();
|
||||
break;
|
||||
} else {
|
||||
await new Promise(resolve => setTimeout(resolve, retryCount * 1000))
|
||||
await new Promise((resolve) =>
|
||||
setTimeout(resolve, retryCount * 1000),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.loading = false
|
||||
console.log('配置加载完成')
|
||||
this.loading = false;
|
||||
console.log("配置加载完成");
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理配置加载失败
|
||||
*/
|
||||
useDefaultConfig() {
|
||||
console.log('API获取失败，无法加载配置')
|
||||
console.log("API获取失败，无法加载配置");
|
||||
|
||||
// 不设置任何默认配置，保持初始化的空状态
|
||||
// 数据保持为初始化时的空结构
|
||||
|
||||
// 显示提示信息
|
||||
uni.showModal({
|
||||
title: '加载失败',
|
||||
content: '无法获取页面配置，请检查网络连接后重试',
|
||||
title: "加载失败",
|
||||
content: "无法获取页面配置，请检查网络连接后重试",
|
||||
showCancel: true,
|
||||
cancelText: '取消',
|
||||
confirmText: '重试',
|
||||
success: res => {
|
||||
cancelText: "取消",
|
||||
confirmText: "重试",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.loadHomeConfig()
|
||||
this.loadHomeConfig();
|
||||
}
|
||||
},
|
||||
})
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -246,10 +266,10 @@
|
|||
*/
|
||||
updatePageConfig(parsedConfig) {
|
||||
// 直接更新配置，使用默认值防止undefined
|
||||
this.pageConfig = parsedConfig.pageConfig || this.pageConfig
|
||||
this.navigationItems = parsedConfig.navigationItems || []
|
||||
this.bottomSection = parsedConfig.bottomSection || this.bottomSection
|
||||
console.log('配置更新完成')
|
||||
this.pageConfig = parsedConfig.pageConfig || this.pageConfig;
|
||||
this.navigationItems = parsedConfig.navigationItems || [];
|
||||
this.bottomSection = parsedConfig.bottomSection || this.bottomSection;
|
||||
console.log("配置更新完成");
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -257,136 +277,138 @@
|
|||
*/
|
||||
async loadTempleData() {
|
||||
try {
|
||||
console.log('开始获取寺庙数据...')
|
||||
const response = await getTempleIndex()
|
||||
console.log('寺庙数据API响应:', response)
|
||||
console.log("开始获取寺庙数据...");
|
||||
const response = await getTempleIndex();
|
||||
console.log("寺庙数据API响应:", response);
|
||||
|
||||
if (response?.code === 200 && response?.data) {
|
||||
this.templeData = {
|
||||
imgUrl: response.data.imgUrl || '',
|
||||
bulletinContent: response.data.bulletinContent || '',
|
||||
startTime: response.data.startTime || '',
|
||||
endTime: response.data.endTime || '',
|
||||
audioUrl: response.data.audioUrl || '',
|
||||
}
|
||||
imgUrl: response.data.imgUrl || "",
|
||||
bulletinContent: response.data.bulletinContent || "",
|
||||
startTime: response.data.startTime || "",
|
||||
endTime: response.data.endTime || "",
|
||||
audioUrl: response.data.audioUrl || "",
|
||||
};
|
||||
|
||||
uni.setStorageSync('abbotId', response.data.abbotId)
|
||||
uni.setStorageSync("abbotId", response.data.abbotId);
|
||||
|
||||
// 重新启动跑马灯
|
||||
this.stopMarquee()
|
||||
this.startMarquee()
|
||||
this.stopMarquee();
|
||||
this.startMarquee();
|
||||
|
||||
console.log('寺庙数据加载成功')
|
||||
console.log("寺庙数据加载成功");
|
||||
} else {
|
||||
throw new Error('寺庙数据API响应无效')
|
||||
throw new Error("寺庙数据API响应无效");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取寺庙数据失败:', error)
|
||||
console.error("获取寺庙数据失败:", error);
|
||||
uni.showToast({
|
||||
title: '获取寺庙数据失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "获取寺庙数据失败",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
startMarquee() {
|
||||
// 简单检查公告文本是否存在
|
||||
const announcementText =
|
||||
this.templeData?.bulletinContent || this.pageConfig?.announcement?.text
|
||||
this.templeData?.bulletinContent || this.pageConfig?.announcement?.text;
|
||||
if (!announcementText) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
// 停止之前的定时器
|
||||
this.stopMarquee()
|
||||
this.stopMarquee();
|
||||
|
||||
// 估算文字宽度（每个字24rpx）
|
||||
const textWidth = announcementText.length * 24
|
||||
const textWidth = announcementText.length * 24;
|
||||
this.timer = setInterval(() => {
|
||||
this.marqueeX--
|
||||
this.marqueeX--;
|
||||
if (this.marqueeX < -textWidth) {
|
||||
this.marqueeX = 600
|
||||
this.marqueeX = 600;
|
||||
}
|
||||
}, 16)
|
||||
}, 16);
|
||||
},
|
||||
|
||||
stopMarquee() {
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
},
|
||||
|
||||
// 兼容两种跳转方式：page路由跳转 或 aid文章详情跳转
|
||||
async navigateToPage(item, index) {
|
||||
try {
|
||||
console.log('导航项信息:', item)
|
||||
console.log('导航项索引:', index)
|
||||
console.log("导航项信息:", item);
|
||||
console.log("导航项索引:", index);
|
||||
// 优先使用page字段进行路由跳转
|
||||
if (item.page) {
|
||||
console.log('使用page字段进行路由跳转:', item.page)
|
||||
console.log("使用page字段进行路由跳转:", item.page);
|
||||
// 导入路由工具
|
||||
const { navigateToPage: routerNavigate } = await import('../../utils/router.js')
|
||||
routerNavigate(item.page)
|
||||
return
|
||||
const { navigateToPage: routerNavigate } = await import(
|
||||
"../../utils/router.js"
|
||||
);
|
||||
routerNavigate(item.page);
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果没有page字段，则使用aid进行文章详情跳转
|
||||
if (item.aid) {
|
||||
console.log('使用aid字段获取文章详情:', item.aid)
|
||||
console.log("使用aid字段获取文章详情:", item.aid);
|
||||
|
||||
// 显示加载提示
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
title: "加载中...",
|
||||
mask: true,
|
||||
})
|
||||
});
|
||||
|
||||
// 调用API获取文章详情
|
||||
const response = await getArticleById(item.aid)
|
||||
const response = await getArticleById(item.aid);
|
||||
|
||||
// 隐藏加载提示
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
|
||||
if (response.code === 200 && response.data) {
|
||||
console.log('获取文章详情成功:', response.data)
|
||||
console.log("获取文章详情成功:", response.data);
|
||||
|
||||
// 将文章数据存储到本地，供目标页面使用
|
||||
uni.setStorageSync('currentArticle', response.data)
|
||||
uni.setStorageSync("currentArticle", response.data);
|
||||
|
||||
// 直接跳转到文章详情页面
|
||||
uni.navigateTo({
|
||||
url: '/pages/article/article-detail',
|
||||
fail: err => {
|
||||
console.error('跳转到文章详情页面失败:', err)
|
||||
url: "/pages/article/article-detail",
|
||||
fail: (err) => {
|
||||
console.error("跳转到文章详情页面失败:", err);
|
||||
uni.showToast({
|
||||
title: '页面跳转失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "页面跳转失败",
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
})
|
||||
});
|
||||
} else {
|
||||
console.error('获取文章详情失败:', response)
|
||||
console.error("获取文章详情失败:", response);
|
||||
uni.showToast({
|
||||
title: '获取内容失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "获取内容失败",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
} else {
|
||||
console.error('导航项既没有page字段也没有aid字段:', item)
|
||||
console.error("导航项既没有page字段也没有aid字段:", item);
|
||||
uni.showToast({
|
||||
title: '配置错误',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "配置错误",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
// 隐藏加载提示
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
|
||||
console.error('导航跳转出错:', error)
|
||||
console.error("导航跳转出错:", error);
|
||||
uni.showToast({
|
||||
title: '网络错误',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "网络错误",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -395,15 +417,28 @@
|
|||
*/
|
||||
goToPray() {
|
||||
try {
|
||||
console.log('跳转到祈福页面')
|
||||
console.log("跳转到祈福页面");
|
||||
// 使用navigateToPage方法，传入参数pray
|
||||
navigateToPage('pray')
|
||||
navigateToPage("pray");
|
||||
} catch (error) {
|
||||
console.error('跳转到祈福页面失败:', error)
|
||||
console.error("跳转到祈福页面失败:", error);
|
||||
uni.showToast({
|
||||
title: '页面跳转失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "页面跳转失败",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
goToPersonalCenter() {
|
||||
try {
|
||||
console.log("跳转到个人中心页面");
|
||||
navigateToPage("pc");
|
||||
} catch (error) {
|
||||
console.error("跳转到祈福页面失败:", error);
|
||||
uni.showToast({
|
||||
title: "页面跳转失败",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -413,56 +448,56 @@
|
|||
playAudio() {
|
||||
if (!this.templeData.audioUrl) {
|
||||
uni.showToast({
|
||||
title: '暂无音频资源',
|
||||
icon: 'none',
|
||||
})
|
||||
return
|
||||
title: "暂无音频资源",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
// 如果已经在播放，先停止
|
||||
if (this.audioContext) {
|
||||
this.stopAudio()
|
||||
this.stopAudio();
|
||||
}
|
||||
|
||||
// 创建音频上下文
|
||||
this.audioContext = uni.createInnerAudioContext()
|
||||
this.audioContext.src = this.templeData.audioUrl
|
||||
this.audioContext.loop = true // 循环播放
|
||||
this.audioContext = uni.createInnerAudioContext();
|
||||
this.audioContext.src = this.templeData.audioUrl;
|
||||
this.audioContext.loop = true; // 循环播放
|
||||
|
||||
// 监听播放状态
|
||||
this.audioContext.onPlay(() => {
|
||||
console.log('音频开始播放')
|
||||
this.isAudioPlaying = true
|
||||
console.log("音频开始播放");
|
||||
this.isAudioPlaying = true;
|
||||
uni.showToast({
|
||||
title: '音频已开启',
|
||||
icon: 'none',
|
||||
})
|
||||
})
|
||||
title: "音频已开启",
|
||||
icon: "none",
|
||||
});
|
||||
});
|
||||
|
||||
this.audioContext.onError(err => {
|
||||
console.error('音频播放错误:', err)
|
||||
this.isAudioPlaying = false
|
||||
this.audioContext.onError((err) => {
|
||||
console.error("音频播放错误:", err);
|
||||
this.isAudioPlaying = false;
|
||||
uni.showToast({
|
||||
title: '音频播放失败',
|
||||
icon: 'none',
|
||||
})
|
||||
})
|
||||
title: "音频播放失败",
|
||||
icon: "none",
|
||||
});
|
||||
});
|
||||
|
||||
this.audioContext.onEnded(() => {
|
||||
console.log('音频播放结束')
|
||||
this.isAudioPlaying = false
|
||||
})
|
||||
console.log("音频播放结束");
|
||||
this.isAudioPlaying = false;
|
||||
});
|
||||
|
||||
// 开始播放
|
||||
this.audioContext.play()
|
||||
this.audioContext.play();
|
||||
} catch (error) {
|
||||
console.error('音频播放失败:', error)
|
||||
this.isAudioPlaying = false
|
||||
console.error("音频播放失败:", error);
|
||||
this.isAudioPlaying = false;
|
||||
uni.showToast({
|
||||
title: '音频播放失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "音频播放失败",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -471,25 +506,26 @@
|
|||
*/
|
||||
stopAudio() {
|
||||
if (this.audioContext) {
|
||||
this.audioContext.stop()
|
||||
this.audioContext.destroy()
|
||||
this.audioContext = null
|
||||
this.audioContext.stop();
|
||||
this.audioContext.destroy();
|
||||
this.audioContext = null;
|
||||
}
|
||||
this.isAudioPlaying = false
|
||||
this.isAudioPlaying = false;
|
||||
uni.showToast({
|
||||
title: '音频已关闭',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "音频已关闭",
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
.bot {
|
||||
}
|
||||
|
||||
.bot {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
|
|
@ -498,15 +534,18 @@
|
|||
max-width: 750rpx;
|
||||
/* 确保不会限制子元素的滚动 */
|
||||
overflow: visible;
|
||||
|
||||
.bottom {
|
||||
margin-top: 64rpx;
|
||||
display: flex;
|
||||
padding: 0 118rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
image {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.rixing {
|
||||
width: 206rpx;
|
||||
height: 64rpx;
|
||||
|
|
@ -521,6 +560,7 @@
|
|||
margin-left: 26rpx;
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
|
||||
.qifu {
|
||||
width: 194rpx;
|
||||
height: 64rpx;
|
||||
|
|
@ -529,17 +569,21 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.zaixian {
|
||||
margin-left: 12rpx;
|
||||
|
||||
.da {
|
||||
font-size: 24rpx;
|
||||
color: #522510;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.xiao {
|
||||
font-size: 12rpx;
|
||||
color: #522510;
|
||||
|
|
@ -547,6 +591,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-scroll {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
|
|
@ -560,10 +605,12 @@
|
|||
/* 隐藏滚动条 */
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
width: 1600rpx; /* 更大的宽度确保滚动 */
|
||||
|
|
@ -571,20 +618,24 @@
|
|||
box-sizing: border-box;
|
||||
/* 确保内容不被压缩 */
|
||||
flex-shrink: 0;
|
||||
|
||||
.li {
|
||||
width: 150rpx;
|
||||
flex: 0 0 150rpx;
|
||||
text-align: center;
|
||||
margin-right: 20rpx;
|
||||
|
||||
image {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
}
|
||||
|
||||
.da {
|
||||
font-size: 24rpx;
|
||||
color: #522510;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.xiao {
|
||||
font-size: 12rpx;
|
||||
color: #522510;
|
||||
|
|
@ -599,15 +650,18 @@
|
|||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.hua {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
|
||||
image {
|
||||
width: 656rpx;
|
||||
height: 108rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.time {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
|
|
@ -616,11 +670,13 @@
|
|||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
|
|
@ -628,13 +684,15 @@
|
|||
margin-left: 24rpx;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tubiao {
|
||||
}
|
||||
|
||||
.tubiao {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
padding: 0 40rpx;
|
||||
|
|
@ -667,9 +725,9 @@
|
|||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
|
@ -679,8 +737,9 @@
|
|||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.announcement {
|
||||
}
|
||||
|
||||
.announcement {
|
||||
width: 100%;
|
||||
margin-top: 184rpx;
|
||||
padding: 0 48rpx;
|
||||
|
|
@ -688,11 +747,13 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
|
||||
.ggimg {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
.marquee-wrap {
|
||||
width: 600rpx;
|
||||
overflow: hidden;
|
||||
|
|
@ -701,6 +762,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.marquee {
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
|
|
@ -709,18 +771,19 @@
|
|||
font-size: 24rpx;
|
||||
color: #522510;
|
||||
}
|
||||
}
|
||||
.bj {
|
||||
}
|
||||
|
||||
.bj {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
/* 加载状态指示器样式 */
|
||||
.loading-overlay {
|
||||
/* 加载状态指示器样式 */
|
||||
.loading-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -731,17 +794,17 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-content {
|
||||
.loading-content {
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
padding: 40rpx 60rpx;
|
||||
border-radius: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-content text {
|
||||
.loading-content text {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
125
utils/router.js
125
utils/router.js
|
|
@ -6,27 +6,29 @@
|
|||
// 页面路由配置
|
||||
export const PAGE_ROUTES = {
|
||||
// 主要功能页面
|
||||
MONK: '/pages/monk/monk',
|
||||
MONK_DETAIL: '/pages/monk/monkDetail',
|
||||
WALK_INTO: '/pages/walkInto/walkInto',
|
||||
INSTITUTIONAL_STRUCTURE: '/pages/institutionalStructure/institutionalStructure',
|
||||
ACTIVITY: '/pages/activity/activity',
|
||||
PRAY: '/pages/pray/pray',
|
||||
MONK: "/pages/monk/monk",
|
||||
MONK_DETAIL: "/pages/monk/monkDetail",
|
||||
WALK_INTO: "/pages/walkInto/walkInto",
|
||||
INSTITUTIONAL_STRUCTURE:
|
||||
"/pages/institutionalStructure/institutionalStructure",
|
||||
ACTIVITY: "/pages/activity/activity",
|
||||
PRAY: "/pages/pray/pray",
|
||||
PC: "/pages/personalCenter/personalCenter",
|
||||
|
||||
// 待开发页面
|
||||
|
||||
NEWS: '/pages/news/news',
|
||||
ABBOT: '/pages/abbot/abbot',
|
||||
ANCIENT: '/pages/ancient/ancient',
|
||||
FUTURE: '/pages/future/future',
|
||||
NEWS: "/pages/news/news",
|
||||
ABBOT: "/pages/abbot/abbot",
|
||||
ANCIENT: "/pages/ancient/ancient",
|
||||
FUTURE: "/pages/future/future",
|
||||
|
||||
// 其他页面
|
||||
LOGIN: '/pages/login/login',
|
||||
INDEX: '/pages/nearbystores/index',
|
||||
MY: '/pages/my/my',
|
||||
MY_ORDER: '/pages/myorder/index',
|
||||
MY_ORDER_RETURNED: '/pages/myorder/returned/index',
|
||||
}
|
||||
LOGIN: "/pages/login/login",
|
||||
INDEX: "/pages/nearbystores/index",
|
||||
MY: "/pages/my/my",
|
||||
MY_ORDER: "/pages/myorder/index",
|
||||
MY_ORDER_RETURNED: "/pages/myorder/returned/index",
|
||||
};
|
||||
|
||||
// 页面类型映射
|
||||
export const PAGE_TYPE_MAP = {
|
||||
|
|
@ -41,7 +43,8 @@ export const PAGE_TYPE_MAP = {
|
|||
future: PAGE_ROUTES.FUTURE,
|
||||
index: PAGE_ROUTES.INDEX,
|
||||
pray: PAGE_ROUTES.PRAY,
|
||||
}
|
||||
pc: PAGE_ROUTES.PC,
|
||||
};
|
||||
|
||||
/**
|
||||
* 页面跳转方法
|
||||
|
|
@ -51,37 +54,37 @@ export const PAGE_TYPE_MAP = {
|
|||
export function navigateToPage(pageType, options = {}) {
|
||||
// 清除loading状态
|
||||
try {
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
} catch (error) {
|
||||
console.warn('清除loading失败:', error)
|
||||
console.warn("清除loading失败:", error);
|
||||
}
|
||||
|
||||
const targetPage = PAGE_TYPE_MAP[pageType]
|
||||
const targetPage = PAGE_TYPE_MAP[pageType];
|
||||
|
||||
if (!targetPage) {
|
||||
// 使用uni.showToast替代console，减少文件系统访问
|
||||
uni.showToast({
|
||||
title: '页面配置错误',
|
||||
icon: 'none',
|
||||
})
|
||||
return
|
||||
title: "页面配置错误",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const defaultOptions = {
|
||||
url: targetPage,
|
||||
fail: err => {
|
||||
fail: (err) => {
|
||||
// 避免在真机调试时输出过多日志
|
||||
uni.showToast({
|
||||
title: '页面开发中',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "页面开发中",
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
uni.navigateTo({
|
||||
...defaultOptions,
|
||||
...options,
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -91,35 +94,35 @@ export function navigateToPage(pageType, options = {}) {
|
|||
export function switchToTab(pageType) {
|
||||
// 清除loading状态
|
||||
try {
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
} catch (error) {
|
||||
console.warn('清除loading失败:', error)
|
||||
console.warn("清除loading失败:", error);
|
||||
}
|
||||
|
||||
const tabRoutes = {
|
||||
index: PAGE_ROUTES.INDEX,
|
||||
my: PAGE_ROUTES.MY,
|
||||
}
|
||||
};
|
||||
|
||||
const targetPage = tabRoutes[pageType]
|
||||
const targetPage = tabRoutes[pageType];
|
||||
|
||||
if (!targetPage) {
|
||||
uni.showToast({
|
||||
title: '页面配置错误',
|
||||
icon: 'none',
|
||||
})
|
||||
return
|
||||
title: "页面配置错误",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.switchTab({
|
||||
url: targetPage,
|
||||
fail: err => {
|
||||
fail: (err) => {
|
||||
uni.showToast({
|
||||
title: '跳转失败',
|
||||
icon: 'none',
|
||||
})
|
||||
title: "跳转失败",
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -131,9 +134,9 @@ export function navigateBack(delta = 1) {
|
|||
delta,
|
||||
fail: () => {
|
||||
// 如果没有上一页，跳转到首页
|
||||
switchToTab('index')
|
||||
switchToTab("index");
|
||||
},
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -143,24 +146,24 @@ export function navigateBack(delta = 1) {
|
|||
export function redirectToPage(pageType) {
|
||||
// 清除loading状态
|
||||
try {
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
} catch (error) {
|
||||
console.warn('清除loading失败:', error)
|
||||
console.warn("清除loading失败:", error);
|
||||
}
|
||||
|
||||
const targetPage = PAGE_TYPE_MAP[pageType]
|
||||
const targetPage = PAGE_TYPE_MAP[pageType];
|
||||
|
||||
if (!targetPage) {
|
||||
console.error('未知的页面类型:', pageType)
|
||||
return
|
||||
console.error("未知的页面类型:", pageType);
|
||||
return;
|
||||
}
|
||||
|
||||
uni.redirectTo({
|
||||
url: targetPage,
|
||||
fail: err => {
|
||||
console.error('页面重定向失败:', err)
|
||||
fail: (err) => {
|
||||
console.error("页面重定向失败:", err);
|
||||
},
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -170,22 +173,22 @@ export function redirectToPage(pageType) {
|
|||
export function reLaunchToPage(pageType) {
|
||||
// 清除loading状态
|
||||
try {
|
||||
uni.hideLoading()
|
||||
uni.hideLoading();
|
||||
} catch (error) {
|
||||
console.warn('清除loading失败:', error)
|
||||
console.warn("清除loading失败:", error);
|
||||
}
|
||||
|
||||
const targetPage = PAGE_TYPE_MAP[pageType]
|
||||
const targetPage = PAGE_TYPE_MAP[pageType];
|
||||
|
||||
if (!targetPage) {
|
||||
console.error('未知的页面类型:', pageType)
|
||||
return
|
||||
console.error("未知的页面类型:", pageType);
|
||||
return;
|
||||
}
|
||||
|
||||
uni.reLaunch({
|
||||
url: targetPage,
|
||||
fail: err => {
|
||||
console.error('页面重启失败:', err)
|
||||
fail: (err) => {
|
||||
console.error("页面重启失败:", err);
|
||||
},
|
||||
})
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user