55 lines
1.8 KiB
Vue
55 lines
1.8 KiB
Vue
<template>
|
|
<n-config-provider :theme="theme">
|
|
<n-message-provider>
|
|
<n-layout style="height: 100vh">
|
|
<n-layout-header bordered style="padding: 16px; display: flex; justify-content: space-between; align-items: center;">
|
|
<n-text tag="div" class="logo">
|
|
<n-gradient-text type="info" :size="24">Neural Sync</n-gradient-text>
|
|
</n-text>
|
|
<n-menu mode="horizontal" :options="menuOptions" v-model:value="activeKey" responsive />
|
|
</n-layout-header>
|
|
<n-layout-content content-style="padding: 16px;">
|
|
<component :is="currentComponent" />
|
|
</n-layout-content>
|
|
</n-layout>
|
|
</n-message-provider>
|
|
</n-config-provider>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, computed } from 'vue'
|
|
import { NConfigProvider, NMessageProvider, NLayout, NLayoutHeader, NLayoutContent, NGradientText, NMenu, NText } from 'naive-ui'
|
|
import type { MenuOption } from 'naive-ui'
|
|
import { darkTheme } from 'naive-ui'
|
|
import SignalDashboard from './components/SignalDashboard.vue'
|
|
import ExperimentBoard from './components/ExperimentBoard.vue'
|
|
import ContextManager from './components/ContextManager.vue'
|
|
import LLMSettings from './components/LLMSettings.vue'
|
|
|
|
const theme = ref(darkTheme)
|
|
const activeKey = ref('signals')
|
|
|
|
const menuOptions: MenuOption[] = [
|
|
{ label: '信号总线', key: 'signals' },
|
|
{ label: '实验看板', key: 'experiments' },
|
|
{ label: '认知核心', key: 'context' },
|
|
{ label: '⚙️ 设置', key: 'settings' }
|
|
]
|
|
|
|
const currentComponent = computed(() => {
|
|
switch (activeKey.value) {
|
|
case 'signals': return SignalDashboard
|
|
case 'experiments': return ExperimentBoard
|
|
case 'context': return ContextManager
|
|
case 'settings': return LLMSettings
|
|
default: return SignalDashboard
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.logo {
|
|
font-weight: bold;
|
|
}
|
|
</style>
|