style: 布局多语言

src/i18n/locales/en-US.ts

@@ -58,7 +58,7 @@ export default {
     }
   },
 
-  // 导入
+  // 组件
   components: {
     UploadModal:{
       uploadTitle:'Data Import',
@@ -88,6 +88,23 @@ export default {
     codeSmsSend: 'Successfully sent, please pay attention to checking the SMS',
   },
 
+  // 布局
+  loayouts: {
+    rightContent: {
+      fullscreen: "Full Screen",
+      logout: "Logout",
+      profile: "Profile",
+      settings: "Settings",
+    },
+    tabs: {
+      reload: "Refresh current",
+      more: "More Options",
+      closeCurrent: "Close Current",
+      closeOther: "Close Other",
+      closeAll: "Close All",
+    }
+  },
+
   // 页面
   views: {
     index: {

src/i18n/locales/zh-CN.ts

@@ -58,7 +58,7 @@ export default {
     }
   },
 
-  // 导入
+  // 组件
   components: {
     UploadModal:{
       uploadTitle:'数据导入',
@@ -88,6 +88,23 @@ export default {
     codeSmsSend: '发送成功，请注意查看短信',
   },
 
+  // 布局
+  loayouts: {
+    rightContent: {
+      fullscreen: "全屏显示",
+      logout: "退出登录",
+      profile: "个人中心",
+      settings: "个人设置",
+    },
+    tabs: {
+      reload: "刷新当前",
+      more: "更多选项",
+      closeCurrent: "关闭当前",
+      closeOther: "关闭其他",
+      closeAll: "关闭全部",
+    }
+  },
+
   // 页面
   views: {
     index: {

src/layouts/components/RightContent.vue

@@ -50,7 +50,7 @@ function fnChangeLocale(e: any) {
     </a-button>
 
     <a-tooltip>
-      <template #title>全屏显示</template>
+      <template #title>{{ t('loayouts.rightContent.fullscreen') }}</template>
       <a-button type="text" @click="toggle">
         <template #icon>
           <FullscreenExitOutlined v-if="isFullscreen()" />
@@ -90,20 +90,20 @@ function fnChangeLocale(e: any) {
             <template #icon>
               <UserOutlined />
             </template>
-            <span>个人中心</span>
+            <span>{{ t('loayouts.rightContent.profile') }}</span>
           </a-menu-item> -->
           <a-menu-item key="settings">
             <template #icon>
               <SettingOutlined />
             </template>
-            <span>个人设置</span>
+            <span>{{ t('loayouts.rightContent.settings') }}</span>
           </a-menu-item>
           <a-menu-divider />
           <a-menu-item key="logout">
             <template #icon>
               <LogoutOutlined />
             </template>
-            <span>退出登录</span>
+            <span>{{ t('loayouts.rightContent.logout') }}</span>
           </a-menu-item>
         </a-menu>
       </template>

src/layouts/components/Tabs.vue

@@ -3,6 +3,8 @@ import IconFont from '@/components/IconFont/index.vue';
 import { computed, watch } from 'vue';
 import { useRouter } from 'vue-router';
 import useTabsStore from '@/store/modules/tabs';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
 const tabsStore = useTabsStore();
 const router = useRouter();
 
@@ -126,7 +128,7 @@ watch(router.currentRoute, v => tabsStore.tabOpen(v), { immediate: true });
       <template #rightExtra>
         <a-space :size="8" align="end">
           <a-tooltip placement="topRight">
-            <template #title>刷新当前</template>
+            <template #title>{{ t('loayouts.tabs.reload') }}</template>
             <a-button
               type="ghost"
               shape="circle"
@@ -137,16 +139,22 @@ watch(router.currentRoute, v => tabsStore.tabOpen(v), { immediate: true });
             </a-button>
           </a-tooltip>
           <a-tooltip placement="topRight">
-            <template #title>更多选项</template>
+            <template #title>{{ t('loayouts.tabs.more') }}</template>
             <a-dropdown :trigger="['click', 'hover']" placement="bottomRight">
               <a-button type="ghost" shape="circle" size="small">
                 <template #icon><DownOutlined /></template>
               </a-button>
               <template #overlay>
                 <a-menu @click="({ key }:any) => fnTabMenu(key)">
-                  <a-menu-item key="current">关闭当前</a-menu-item>
-                  <a-menu-item key="other">关闭其他 </a-menu-item>
-                  <a-menu-item key="all">关闭全部</a-menu-item>
+                  <a-menu-item key="current">
+                    {{ t('loayouts.tabs.closeCurrent') }}
+                  </a-menu-item>
+                  <a-menu-item key="other">
+                    {{ t('loayouts.tabs.closeOther') }}
+                  </a-menu-item>
+                  <a-menu-item key="all">
+                    {{ t('loayouts.tabs.closeAll') }}
+                  </a-menu-item>
                 </a-menu>
               </template>
             </a-dropdown>