import { computed } from 'vue'
|
import { storeToRefs } from 'pinia'
|
import { useSettingStore } from '@/store/modules/setting'
|
import { headerBarConfig } from '@/config/modules/headerBar'
|
function useHeaderBar() {
|
const settingStore = useSettingStore()
|
const headerBarConfigRef = computed(() => headerBarConfig)
|
const { showMenuButton, showFastEnter, showRefreshButton, showCrumbs, showLanguage } =
|
storeToRefs(settingStore)
|
const isFeatureEnabled = (feature) => {
|
return headerBarConfigRef.value[feature]?.enabled ?? false
|
}
|
const getFeatureConfig = (feature) => {
|
return headerBarConfigRef.value[feature]
|
}
|
const shouldShowMenuButton = computed(() => {
|
return isFeatureEnabled('menuButton') && showMenuButton.value
|
})
|
const shouldShowRefreshButton = computed(() => {
|
return isFeatureEnabled('refreshButton') && showRefreshButton.value
|
})
|
const shouldShowFastEnter = computed(() => {
|
return isFeatureEnabled('fastEnter') && showFastEnter.value
|
})
|
const shouldShowBreadcrumb = computed(() => {
|
return isFeatureEnabled('breadcrumb') && showCrumbs.value
|
})
|
const shouldShowGlobalSearch = computed(() => {
|
return isFeatureEnabled('globalSearch')
|
})
|
const shouldShowFullscreen = computed(() => {
|
return isFeatureEnabled('fullscreen')
|
})
|
const shouldShowNotification = computed(() => {
|
return isFeatureEnabled('notification')
|
})
|
const shouldShowChat = computed(() => {
|
return isFeatureEnabled('chat')
|
})
|
const shouldShowLanguage = computed(() => {
|
return isFeatureEnabled('language') && showLanguage.value
|
})
|
const shouldShowSettings = computed(() => {
|
return isFeatureEnabled('settings')
|
})
|
const shouldShowThemeToggle = computed(() => {
|
return isFeatureEnabled('themeToggle')
|
})
|
const fastEnterMinWidth = computed(() => {
|
const config = getFeatureConfig('fastEnter')
|
return config?.minWidth || 1200
|
})
|
const isFeatureActive = (feature) => {
|
return isFeatureEnabled(feature)
|
}
|
const getFeatureInfo = (feature) => {
|
return getFeatureConfig(feature)
|
}
|
const getEnabledFeatures = () => {
|
return Object.keys(headerBarConfigRef.value).filter(
|
(key) => headerBarConfigRef.value[key]?.enabled
|
)
|
}
|
const getDisabledFeatures = () => {
|
return Object.keys(headerBarConfigRef.value).filter(
|
(key) => !headerBarConfigRef.value[key]?.enabled
|
)
|
}
|
const getActiveFeatures = () => {
|
return getEnabledFeatures()
|
}
|
const getInactiveFeatures = () => {
|
return getDisabledFeatures()
|
}
|
return {
|
// 配置
|
headerBarConfig: headerBarConfigRef,
|
// 显示状态计算属性
|
shouldShowMenuButton,
|
// 是否显示菜单按钮
|
shouldShowRefreshButton,
|
// 是否显示刷新按钮
|
shouldShowFastEnter,
|
// 是否显示快速入口
|
shouldShowBreadcrumb,
|
// 是否显示面包屑
|
shouldShowGlobalSearch,
|
// 是否显示全局搜索
|
shouldShowFullscreen,
|
// 是否显示全屏按钮
|
shouldShowNotification,
|
// 是否显示通知中心
|
shouldShowChat,
|
// 是否显示聊天功能
|
shouldShowLanguage,
|
// 是否显示语言切换
|
shouldShowSettings,
|
// 是否显示设置面板
|
shouldShowThemeToggle,
|
// 是否显示主题切换
|
// 配置相关
|
fastEnterMinWidth,
|
// 快速入口最小宽度
|
// 方法
|
isFeatureEnabled,
|
// 检查功能是否启用
|
isFeatureActive,
|
// 检查功能是否启用（别名）
|
getFeatureConfig,
|
// 获取功能配置
|
getFeatureInfo,
|
// 获取功能配置（别名）
|
getEnabledFeatures,
|
// 获取所有启用的功能
|
getDisabledFeatures,
|
// 获取所有禁用的功能
|
getActiveFeatures,
|
// 获取所有启用的功能（别名）
|
getInactiveFeatures
|
// 获取所有禁用的功能（别名）
|
}
|
}
|
export { useHeaderBar }
|
