47 lines
1.5 KiB
Vue
47 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
const { open: sidebarOpen, openSidebar } = useSidebar();
|
|
const { providers } = await useModels();
|
|
const route = useRoute();
|
|
|
|
const TITLES: Record<string, string> = {
|
|
profile: 'Profile',
|
|
security: 'Security',
|
|
general: 'General',
|
|
appearance: 'Appearance',
|
|
providers: 'AI Providers',
|
|
assistants: 'System Assistants',
|
|
instance: 'Instance',
|
|
};
|
|
|
|
const title = computed(() => {
|
|
const [section, id] = route.path.split('/').slice(2);
|
|
|
|
if (section === 'providers' && id) {
|
|
const provider = providers.value.find(p => p.id === id);
|
|
return provider ? provider.name : 'Unknown Provider';
|
|
}
|
|
|
|
if (section === 'instance' && id === 'users') return 'Users';
|
|
|
|
return TITLES[section ?? ''] ?? 'Settings';
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="h-full w-full flex flex-col">
|
|
<div class="h-14 flex items-center justify-between px-4 shrink-0">
|
|
<div class="flex items-center gap-2">
|
|
<button v-if="!sidebarOpen" @click="openSidebar"
|
|
class="flex p-2 rounded-lg text-[var(--text-primary)] bg-transparent @hover:bg-[var(--color-hover)] transition-colors">
|
|
<span class="i-mynaui-panel-left-open text-5"></span>
|
|
</button>
|
|
<h1 class="text-lg font-semibold text-[var(--text-primary)] case-capital">{{ title }}</h1>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex-1 min-h-0 flex flex-col px-4">
|
|
<NuxtPage />
|
|
</div>
|
|
</div>
|
|
</template>
|