语言切换

src/components/UserInfo/index.vue

@@ -20,14 +20,17 @@
 </template>
 
 <script lang="ts" setup>
-import { h, ref } from 'vue'
+import { h, ref, reactive } from 'vue';
 import { NAvatar, NText } from 'naive-ui'
 import { renderIcon } from '@/utils'
 import { openDoc, logout } from '@/utils'
+import { useI18n } from 'vue-i18n'
 
 import { icon } from '@/plugins'
 const { DocumentTextIcon, ChatboxEllipsesIcon, PersonIcon, LogOutOutlineIcon } = icon.ionicons5
 
+const { t } = useI18n()
+
 const imageUrl = 'https://www.naiveui.com/assets/naivelogo.93278402.svg'
 
 // 是否失败
@@ -55,7 +58,7 @@ const renderUserInfo = () => {
   )
 }
 
-const options = [
+const options = reactive([
   {
     label: '我的信息',
     key: 'info',
@@ -67,12 +70,12 @@ const options = [
     key: 'd1'
   },
   {
-    label: '说明文档',
+    label: t('global.doc'),
     key: 'doc',
     icon: renderIcon(DocumentTextIcon)
   },
   {
-    label: '联系我们',
+    label: t('global.contact'),
     key: 'contact',
     icon: renderIcon(ChatboxEllipsesIcon)
   },
@@ -81,11 +84,11 @@ const options = [
     key: 'd2'
   },
   {
-    label: '退出登录',
+    label: t('global.logout'),
     key: 'logout',
     icon: renderIcon(LogOutOutlineIcon)
   }
-]
+])
 
 // 图片渲染错误
 const errorHandle = (e: Event) => {

src/i18n/en/index.ts

@@ -1,9 +1,15 @@
 import login from './login'
 
 const global = {
-  doc_addr: "Doc Address",
+  doc_addr: "Document",
+  code_addr: "Code address",
   form_account: "Please enter your account or email",
-  form_password: "Please enter your password"
+  form_password: "Please enter your password",
+  // header
+  doc: 'Document',
+  help: 'Help',
+  contact: 'Contact us',
+  logout: 'Logout'
 }
 
 export default {

src/i18n/zh/index.ts

@@ -1,9 +1,15 @@
 import login from './login'
 
 const global = {
-  doc_addr: "文档地址",
+  doc_addr: '文档地址',
-  form_account: "请输入账号或邮箱",
+  code_addr: '仓库地址',
-  form_password: "请输入密码",
+  form_account: '请输入账号或邮箱',
+  form_password: '请输入密码',
+  // 头部
+  doc: '说明文档',
+  help: '帮助中心',
+  contact: '联系我们',
+  logout: '退出登录'
 }
 
 export default {

src/views/project/layout/components/AsideFooter/index.vue

@@ -2,7 +2,6 @@
   <div class="go-aside-footer">
     <n-divider class="go-mt-0" />
     <n-space justify="space-around">
-      
       <n-tooltip v-if="collapsed" placement="right" trigger="hover">
         <template #trigger>
           <n-button secondary @click="handleDoc">
@@ -14,7 +13,7 @@
           </n-button>
         </template>
         <n-text>
-          帮助中心
+          {{ $t('global.help') }}
         </n-text>
       </n-tooltip>
 
@@ -24,7 +23,7 @@
             <HelpOutlineIcon />
           </n-icon>
         </template>
-        <n-text>帮助中心</n-text>
+        <n-text>{{ $t('global.help') }}</n-text>
       </n-button>
 
       <n-tooltip v-if="collapsed" placement="right" trigger="hover">
@@ -38,7 +37,7 @@
           </n-button>
         </template>
         <n-text>
-          仓库地址
+          {{ $t('global.doc_addr') }}
         </n-text>
       </n-tooltip>
 
@@ -48,7 +47,7 @@
             <CodeSlashIcon />
           </n-icon>
         </template>
-        <n-text v-show="!collapsed">仓库地址</n-text>
+        <n-text v-show="!collapsed">{{ $t('global.doc_addr') }}</n-text>
       </n-button>
     </n-space>
   </div>
@@ -57,7 +56,7 @@
 import { openDoc, openGiteeSourceCode } from '@/utils'
 
 import { icon } from '@/plugins'
-const { HelpOutlineIcon, CodeSlashIcon} = icon.ionicons5
+const { HelpOutlineIcon, CodeSlashIcon } = icon.ionicons5
 
 const props = defineProps({
   collapsed: Boolean

src/views/project/layout/components/Create/components/CreateModal/index.vue

@@ -3,7 +3,7 @@
     <n-space size="large">
       <n-card class="card-box" hoverable>
         <template #header>
-          <n-text class="card-box-tite">选择类型</n-text>
+          <n-text class="card-box-tite">从哪里出发好呢？</n-text>
         </template>
         <template #header-extra>
           <n-text @click="closeHandle">