52 lines
1.3 KiB
Vue
52 lines
1.3 KiB
Vue
<template>
|
|
<n-config-provider :theme="theme" :locale="naiveLocale" :date-locale="naiveDateLocale">
|
|
<n-message-provider>
|
|
<n-dialog-provider>
|
|
<n-notification-provider>
|
|
<router-view />
|
|
</n-notification-provider>
|
|
</n-dialog-provider>
|
|
</n-message-provider>
|
|
</n-config-provider>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted, computed, watch } from 'vue'
|
|
import { zhCN, enUS, dateZhCN, dateEnUS, NMessageProvider, NDialogProvider, NNotificationProvider } from 'naive-ui'
|
|
import type { GlobalTheme } from 'naive-ui'
|
|
import { initLocale, locale as appLocale, t } from './shared/i18n'
|
|
|
|
const theme = ref<GlobalTheme | null>(null)
|
|
|
|
onMounted(() => {
|
|
initLocale()
|
|
updateTitle()
|
|
updateHtmlLang()
|
|
})
|
|
|
|
// Sync Naive UI locale with our app locale
|
|
const naiveLocale = computed(() => appLocale.value === 'zh-CN' ? zhCN : enUS)
|
|
const naiveDateLocale = computed(() => appLocale.value === 'zh-CN' ? dateZhCN : dateEnUS)
|
|
|
|
function updateTitle() {
|
|
const appName = localStorage.getItem('appName') || 'Jingrow'
|
|
document.title = `${appName} - ${t('AI Agent Full-Stack Framework')}`
|
|
}
|
|
|
|
watch(appLocale, () => {
|
|
updateTitle()
|
|
updateHtmlLang()
|
|
})
|
|
|
|
function updateHtmlLang() {
|
|
document.documentElement.lang = appLocale.value
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
#app {
|
|
height: 100vh;
|
|
width: 100vw;
|
|
}
|
|
</style>
|