57 lines
2.2 KiB
Vue
57 lines
2.2 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted } from 'vue'
|
|
import TitleBar from '@/components/layout/TitleBar.vue'
|
|
import Sidebar from '@/components/layout/Sidebar.vue'
|
|
import ModuleContainer from '@/components/layout/ModuleContainer.vue'
|
|
import ProxyModule from '@/modules/proxy/ProxyModule.vue'
|
|
import ClipboardModule from '@/modules/clipboard/ClipboardModule.vue'
|
|
import ScreenshotModule from '@/modules/screenshot/ScreenshotModule.vue'
|
|
import MonitorModule from '@/modules/monitor/MonitorModule.vue'
|
|
import DownloaderModule from '@/modules/downloader/DownloaderModule.vue'
|
|
import FinderModule from '@/modules/finder/FinderModule.vue'
|
|
import GeneralSettings from '@/modules/general/GeneralSettings.vue'
|
|
import { useAppStore } from '@/stores/appStore'
|
|
import { TooltipProvider } from '@/components/ui/tooltip'
|
|
|
|
const appStore = useAppStore()
|
|
|
|
const modules = [
|
|
{ id: 'proxy', name: '代理管理', icon: 'proxy', component: ProxyModule },
|
|
{ id: 'clipboard', name: '剪贴板', icon: 'clipboard', component: ClipboardModule },
|
|
{ id: 'screenshot', name: '截图', icon: 'screenshot', component: ScreenshotModule },
|
|
{ id: 'monitor', name: '硬件监控', icon: 'monitor', component: MonitorModule },
|
|
{ id: 'downloader', name: '下载器', icon: 'downloader', component: DownloaderModule },
|
|
{ id: 'finder', name: '文件搜索', icon: 'finder', component: FinderModule },
|
|
{ id: 'settings', name: '常规设置', icon: 'settings', component: GeneralSettings }
|
|
]
|
|
|
|
const activeModule = ref('proxy')
|
|
|
|
const handleModuleChange = (moduleId: string) => {
|
|
activeModule.value = moduleId
|
|
}
|
|
|
|
const handleSearch = (moduleId: string) => {
|
|
activeModule.value = moduleId
|
|
}
|
|
|
|
onMounted(() => {
|
|
appStore.init().catch(e => console.error('App init error:', e))
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<TooltipProvider>
|
|
<div class="flex flex-col h-screen w-screen overflow-hidden">
|
|
<TitleBar :modules="modules" @search="handleSearch" />
|
|
<div class="flex-1 flex overflow-hidden">
|
|
<Sidebar
|
|
:modules="modules"
|
|
:active-module="activeModule"
|
|
@change="handleModuleChange"
|
|
/>
|
|
<ModuleContainer :modules="modules" :active-module="activeModule" />
|
|
</div>
|
|
</div>
|
|
</TooltipProvider>
|
|
</template> |