1
0
mirror of https://github.com/chatopera/cosin.git synced 2025-08-01 16:38:02 +08:00

add: i18n

Signed-off-by: Kaifuny <superbiger.github@gmail.com>
This commit is contained in:
Kaifuny 2023-07-20 02:37:07 +08:00
parent 3a803fbe9f
commit 535b632d85
5 changed files with 52 additions and 19 deletions

View File

@ -3,11 +3,11 @@ import { ref } from 'vue'
import { RouterLink, RouterView, useRouter } from 'vue-router' import { RouterLink, RouterView, useRouter } from 'vue-router'
import { Nav } from '@cskefu/shared-ui' import { Nav } from '@cskefu/shared-ui'
import { NSwitch, NIcon, NAlert } from 'naive-ui'
import { SunnyOutline, Moon, Earth } from '@vicons/ionicons5'
import { ROUTE_NAME } from '@cskefu/models' import { ROUTE_NAME } from '@cskefu/models'
import { NSwitch, NIcon, NAlert, NPopselect } from 'naive-ui'
import { SunnyOutline, Moon, Earth } from '@vicons/ionicons5'
const navigations = [ const navigations = [
{ label: '首页', value: ROUTE_NAME.DASHBOARD_INDEX }, { label: '首页', value: ROUTE_NAME.DASHBOARD_INDEX },
{ label: '对话', value: ROUTE_NAME.CHAT_INDEX }, { label: '对话', value: ROUTE_NAME.CHAT_INDEX },
@ -48,13 +48,24 @@ const router = useRouter()
" "
> >
<RouterLink class="text-sm text-green-600" to="/index"> <RouterLink class="text-sm text-green-600" to="/index">
使用指南 {{ $t('message.hello') }}
</RouterLink> </RouterLink>
<template #dropMenuAppend> <template #dropMenuAppend>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<div class="flex justify-between items-center space-x-2"> <div class="flex justify-between items-center space-x-2">
<n-icon :component="Earth" /> <n-icon :component="Earth" />
<span>中文</span> <n-popselect
v-model:value="$i18n.locale"
:options="[
{ label: 'English', value: 'en-US' },
{ label: 'Chinese', value: 'zh-CN' },
]"
trigger="hover"
>
<div class="hover: text-green-600 hover:underline cursor-pointer">
{{ $i18n.locale }}
</div>
</n-popselect>
</div> </div>
<n-switch size="medium"> <n-switch size="medium">
<template #checked-icon> <template #checked-icon>

View File

@ -1,4 +1,4 @@
import { RouteRecordRaw, createRouter, createWebHashHistory } from 'vue-router' import { RouteRecordRaw, createRouter, createWebHistory } from 'vue-router'
import { ROUTE_NAME } from '@cskefu/models' import { ROUTE_NAME } from '@cskefu/models'
@ -41,7 +41,7 @@ const routes: RouteRecordRaw[] = [
] ]
const router = createRouter({ const router = createRouter({
history: createWebHashHistory(), history: createWebHistory(),
routes, routes,
}) })

View File

@ -1,7 +1,9 @@
import { locales } from '@cskefu/i18n';
import { ComponentCustomProperties } from './shims-vue-global.d'; import { ComponentCustomProperties } from './shims-vue-global.d';
declare module "vue" { declare module "vue" {
export interface ComponentCustomProperties { export interface ComponentCustomProperties {
$t: (key: string) => string; $t: (key: string) => string;
$i18n: { locale: typeof locales };
} }
} }

View File

@ -1,23 +1,42 @@
import { App } from 'vue' import { App } from 'vue'
import { createI18n } from 'vue-i18n' import { createI18n } from 'vue-i18n'
import _ from 'lodash-es'
const messages = { /**
'en-US': { *
message: { */
hello: 'hello world', export const locales: string[] = ['zh-CN', 'en-US']
},
const localPathPrefix = './locales/'
const mergedLocalMessage = Object.entries(
import.meta.glob('./locales/**/*.json', { eager: true })
).reduce(
(map, [key, value]: [string, any]) => {
const name = key.slice(localPathPrefix.length, -5)
const sections = name.split('/')
if (sections.length === 1) {
map[name] = _.merge(value.default, map[name] || {})
} else {
const file = sections.slice(-1)[0]
const sectionsName = sections[0]
const existed = map[file] || {}
map[file] = {
...existed,
[sectionsName]: _.merge(value.default, existed[sectionsName] || {}),
}
}
return map
}, },
'zh-CN': { {} as { [k: string]: any }
message: { )
hello: '你好',
},
},
}
const i18n = createI18n({ const i18n = createI18n({
legacy: false, legacy: false,
locale: 'zh-CN', locale: 'zh-CN',
messages, messages: mergedLocalMessage,
globalInjection: true, globalInjection: true,
fallbackLocale: 'zh-CN', fallbackLocale: 'zh-CN',
}) })

View File

@ -2,6 +2,7 @@
"extends": "../../../tsconfig.json", "extends": "../../../tsconfig.json",
"include": ["src/**/*.ts"], "include": ["src/**/*.ts"],
"compilerOptions": { "compilerOptions": {
"types": ["vite/client"],
"composite": true, "composite": true,
"skipLibCheck": true, "skipLibCheck": true,
"module": "ESNext", "module": "ESNext",