refactor: 统一重构底部导航栏间距逻辑与显示规则

1.  新增全局计算属性统一处理底部导航栏显示判断与间距样式
2.  替换多个页面的手写底部间距逻辑为通用样式
3.  新增路由匹配工具函数,支持灵活配置导航栏显示范围
4.  优化底部导航组件的显示条件判断
This commit is contained in:
2026-06-16 11:25:54 +08:00
parent 6c6822ca16
commit 64d3ac8f8a
18 changed files with 141 additions and 108 deletions

View File

@@ -22,6 +22,57 @@ export default {
tabBarList() {
return this.$store.state.tabBarList;
},
shouldShowTabBar() {
const tabBarList = this.$store.state.tabBarList;
if (!tabBarList || !tabBarList.list) {
return false;
}
const mode = tabBarList.page_visibility_mode;
const routeList = tabBarList.page_routes || [];
if (!mode || mode === 'all') {
return true;
}
if (mode === 'none') {
return false;
}
const pages = getCurrentPages();
if (pages.length === 0) {
return true;
}
const currentPage = pages[pages.length - 1];
let currentRoute = '';
if (currentPage.route) {
currentRoute = currentPage.route;
} else if (currentPage.$page && currentPage.$page.path) {
currentRoute = currentPage.$page.path;
}
if (!currentRoute) {
return true;
}
if (!currentRoute.startsWith('/')) {
currentRoute = '/' + currentRoute;
}
const inList = this.$util && this.$util.isPageInRouteList
? this.$util.isPageInRouteList(currentRoute, routeList)
: false;
if (mode === 'whitelist') {
return inList;
}
if (mode === 'blacklist') {
return !inList;
}
return true;
},
tabBarPagePaddingStyle() {
return this.$util.objToStyle({
paddingBottom: this.shouldShowTabBar ? '112rpx' : '0'
});
},
tabBarPaddingStyleValue() {
return {
paddingBottom: this.shouldShowTabBar ? '112rpx' : '0'
};
},
siteInfo() {
return this.$store.state.siteInfo;
},