53 lines
2.5 KiB
JavaScript
53 lines
2.5 KiB
JavaScript
import { computed, nextTick, ref } from 'vue'
|
|
import { useGlobalStatusStore } from '@/stores/useGlobalStatusStore'
|
|
import BaseConfig from './BaseConfig/BaseConfig.vue'
|
|
import EmailConfig from './EmailConfig/EmailConfig.vue'
|
|
import SslConfig from './SslConfig/SslConfig.vue'
|
|
import ConfigMaintenance from './ConfigMaintenance/ConfigMaintenance.vue'
|
|
|
|
export function useNavigation() {
|
|
const store = useGlobalStatusStore()
|
|
const selectedSection = ref('base')
|
|
const currentPage = ref(null)
|
|
const pageHost = ref(null)
|
|
const switching = ref(false)
|
|
const pages = [
|
|
{ value: 'base', label: '基础配置', component: BaseConfig },
|
|
{ value: 'mail', label: '邮件服务', component: EmailConfig },
|
|
{ value: 'ssl', label: 'SSL 配置', component: SslConfig }
|
|
]
|
|
const tools = [
|
|
{ value: 'migration', label: '数据库迁移', capability: 'database.migrate' },
|
|
{ value: 'restart', label: '服务重启', capability: 'service.restart' },
|
|
{ value: 'backups', label: '备份与回滚', capability: 'config.rollback' }
|
|
]
|
|
const sectionOptions = computed(() => store.hasCapability('config.read') ? pages : [])
|
|
const maintenanceOptions = computed(() => store.hasCapability('config.read')
|
|
? tools.filter(item => store.hasCapability(item.capability))
|
|
.map(item => ({ ...item, component: ConfigMaintenance }))
|
|
: [])
|
|
const visiblePages = () => [...sectionOptions.value.flatMap(item => item.children || [item]), ...maintenanceOptions.value]
|
|
const activePage = computed(() => visiblePages()
|
|
.find(item => item.value === selectedSection.value))
|
|
|
|
const beforeLeave = () => currentPage.value?.beforeLeave?.() ?? true
|
|
const selectSection = async value => {
|
|
const parent = sectionOptions.value.find(item => item.value === value && item.children)
|
|
if (parent) value = parent.children.find(item => item.value === selectedSection.value)?.value || parent.children[0].value
|
|
const visible = () => visiblePages().some(item => item.value === value)
|
|
if (switching.value || value === selectedSection.value || !visible()) return
|
|
switching.value = true
|
|
try {
|
|
if (!await beforeLeave() || !visible()) return
|
|
selectedSection.value = value
|
|
await nextTick()
|
|
pageHost.value?.closest('.el-tabs__content')?.scrollTo({ top: 0 })
|
|
pageHost.value?.focus({ preventScroll: true })
|
|
} finally {
|
|
switching.value = false
|
|
}
|
|
}
|
|
|
|
return { sectionOptions, maintenanceOptions, selectedSection, activePage, currentPage, pageHost, selectSection, beforeLeave }
|
|
}
|