mirror of
https://github.com/ialley-workshop-open/uni-halo.git
synced 2026-07-27 04:20:43 +08:00
小莫唐尼
a012a57cf0
1. 新增友链页面组件，实现分组展示、滚动导航功能 2. 多语言中添加友链相关翻译 3. 修改默认首页跳转至友链页 4. 调整API请求配置，添加halo请求标记 5. 优化剪贴板提示、布局样式和工具函数 6. 更新开发环境请求地址
141 lines
4.3 KiB
TypeScript
141 lines
4.3 KiB
TypeScript
import type { TabBar } from '@uni-helper/vite-plugin-uni-pages'
|
||
import type { CustomTabBarItem, NativeTabBarItem } from './types'
|
||
|
||
/**
|
||
* tabbar 选择的策略，更详细的介绍见 tabbar.md 文件
|
||
* 0: 'NO_TABBAR' `无 tabbar`
|
||
* 1: 'NATIVE_TABBAR' `原生 tabbar`
|
||
* 2: 'CUSTOM_TABBAR' `自定义 tabbar`
|
||
*
|
||
* 温馨提示：本文件的任何代码更改了之后，都需要重新运行，否则 pages.json 不会更新导致配置不生效
|
||
*/
|
||
export const TABBAR_STRATEGY_MAP = {
|
||
NO_TABBAR: 0,
|
||
NATIVE_TABBAR: 1,
|
||
CUSTOM_TABBAR: 2,
|
||
}
|
||
|
||
// TODO: 1/3. 通过这里切换使用tabbar的策略
|
||
// 如果是使用 NO_TABBAR(0)，nativeTabbarList 和 customTabbarList 都不生效
|
||
// 如果是使用 NATIVE_TABBAR(1)，只需要配置 nativeTabbarList，customTabbarList 不生效
|
||
// 如果是使用 CUSTOM_TABBAR(2)，只需要配置 customTabbarList，nativeTabbarList 不生效
|
||
export const selectedTabbarStrategy = TABBAR_STRATEGY_MAP.CUSTOM_TABBAR
|
||
|
||
// TODO: 2/3. 使用 NATIVE_TABBAR 时，更新下面的 tabbar 配置
|
||
export const nativeTabbarList: NativeTabBarItem[] = [
|
||
{
|
||
iconPath: 'static/tabbar/home.png',
|
||
selectedIconPath: 'static/tabbar/homeHL.png',
|
||
pagePath: 'pages/index/index',
|
||
text: '%tabbar.home%',
|
||
},
|
||
{
|
||
iconPath: 'static/tabbar/personal.png',
|
||
selectedIconPath: 'static/tabbar/personalHL.png',
|
||
pagePath: 'pages/me/me',
|
||
text: '%tabbar.me%',
|
||
},
|
||
]
|
||
|
||
// TODO: 3/3. 使用 CUSTOM_TABBAR 时，更新下面的 tabbar 配置
|
||
// 如果需要配置鼓包，需要在 'tabbar/store.ts' 里面设置，最后在 `tabbar/index.vue` 里面更改鼓包的图片
|
||
export const customTabbarList: CustomTabBarItem[] = [
|
||
{
|
||
text: '%tabbar.home%',
|
||
pagePath: 'pages/home/home',
|
||
iconType: 'uiLib',
|
||
icon: 'home',
|
||
},
|
||
{
|
||
pagePath: 'pages/gallery/gallery',
|
||
text: '%tabbar.gallery%',
|
||
iconType: 'uiLib',
|
||
icon: 'image',
|
||
},
|
||
{
|
||
pagePath: 'pages/moments/moments',
|
||
text: '%tabbar.moments%',
|
||
iconType: 'uiLib',
|
||
icon: 'send',
|
||
},
|
||
{
|
||
pagePath: 'pages/links/links',
|
||
text: '%tabbar.links%',
|
||
iconType: 'uiLib',
|
||
icon: 'link',
|
||
},
|
||
{
|
||
pagePath: 'pages/me/me',
|
||
text: '%tabbar.me%',
|
||
iconType: 'uiLib',
|
||
icon: 'user',
|
||
},
|
||
|
||
// 其他类型演示
|
||
// 1、uiLib
|
||
// {
|
||
// pagePath: 'pages/index/index',
|
||
// text: '首页',
|
||
// iconType: 'uiLib',
|
||
// icon: 'home',
|
||
// },
|
||
// 2、iconfont
|
||
// {
|
||
// pagePath: 'pages/index/index',
|
||
// text: '首页',
|
||
// // 注意 iconfont 图标需要额外加上 'iconfont'，如下
|
||
// iconType: 'iconfont',
|
||
// icon: 'iconfont icon-my',
|
||
// },
|
||
// 3、image
|
||
// {
|
||
// pagePath: 'pages/index/index',
|
||
// text: '首页',
|
||
// // 使用 ‘image’时，需要配置 icon + iconActive 2张图片
|
||
// iconType: 'image',
|
||
// icon: '/static/tabbar/home.png',
|
||
// iconActive: '/static/tabbar/homeHL.png',
|
||
// },
|
||
]
|
||
|
||
/**
|
||
* 是否启用 tabbar 缓存
|
||
* NATIVE_TABBAR(1) 和 CUSTOM_TABBAR(2) 时，需要tabbar缓存
|
||
*/
|
||
export const tabbarCacheEnable
|
||
= [TABBAR_STRATEGY_MAP.NATIVE_TABBAR, TABBAR_STRATEGY_MAP.CUSTOM_TABBAR].includes(selectedTabbarStrategy)
|
||
|
||
/**
|
||
* 是否启用自定义 tabbar
|
||
* CUSTOM_TABBAR(2) 时，启用自定义tabbar
|
||
*/
|
||
export const customTabbarEnable = [TABBAR_STRATEGY_MAP.CUSTOM_TABBAR].includes(selectedTabbarStrategy)
|
||
|
||
/**
|
||
* 是否需要隐藏原生 tabbar
|
||
* CUSTOM_TABBAR(2) 时，需要隐藏原生tabbar
|
||
*/
|
||
export const needHideNativeTabbar = selectedTabbarStrategy === TABBAR_STRATEGY_MAP.CUSTOM_TABBAR
|
||
|
||
const _tabbarList = customTabbarEnable ? customTabbarList.map(item => ({ text: item.text, pagePath: item.pagePath })) : nativeTabbarList
|
||
export const tabbarList = customTabbarEnable ? customTabbarList : nativeTabbarList
|
||
|
||
// NATIVE_TABBAR(1) 时，显示原生Tabbar，在i18n的情况下需要 setTabbarItem (框架已经处理)
|
||
export const isNativeTabbar = selectedTabbarStrategy === TABBAR_STRATEGY_MAP.NATIVE_TABBAR
|
||
|
||
const _tabbar: TabBar = {
|
||
// 只有微信小程序支持 custom。App 和 H5 不生效
|
||
custom: selectedTabbarStrategy === TABBAR_STRATEGY_MAP.CUSTOM_TABBAR,
|
||
color: '#999999',
|
||
selectedColor: '#018d71',
|
||
backgroundColor: '#F8F8F8',
|
||
borderStyle: 'black',
|
||
height: '50px',
|
||
fontSize: '10px',
|
||
iconWidth: '24px',
|
||
spacing: '3px',
|
||
list: _tabbarList as unknown as TabBar['list'],
|
||
}
|
||
|
||
export const tabBar = tabbarCacheEnable ? _tabbar : undefined
|