style: 个人中心多语言

src/i18n/locales/en-US.ts

@@ -225,6 +225,85 @@ export default {
       tipContent: 'Congratulations, {username} account registration succeeded!',
       tipBtn: 'Go to login',
     },
+    account: {
+      settings: {
+        baseInfo: "Basic Info",
+        sex: "Gender",
+        sexPleace: "Please select the user's gender",
+        email: "Email",
+        emailPleace: "Please enter the correct e-mail address",
+        phonenumber: "Phone",
+        phonenumberPleace: "Please enter the correct cell phone number",
+        nick: "NickName",
+        nickPleace: "Please enter a user nickname",
+        nickTip: "Nicknames can only contain letters, numbers, Chinese characters and underscores, and no less than 2 digits",
+        profileTip: "Are you sure you want to submit changes to basic user information?",
+        profileOk: "The user's basic information is modified successfully!",
+        know: "I got it.",
+        uploadPleace: "Please choose an equal-sized image for your avatar, such as {txt}",
+        upload: "Upload/Change Images",
+        uploadFormat: 'Only supports uploading image formats ({format})',
+        uploadSize: 'Image file size must be less than {size}MB',
+        uploadTip: "Confirmed to upload/change user avatar?",
+        uploadOk: "Avatar upload/change successful",
+        resetPasswd: "Reset Password",
+        oldPassword: "Old Password",
+        oldPasswordTip: "The old password must not be empty and must be at least 6 digits long",
+        oldPasswordPleace: "Please enter the old password",
+        newPassword: "New Password",
+        newPasswordTip: "Password contains at least upper and lower case letters, numbers, special symbols, and not less than 6 digits",
+        newPassworddPleace: "Please enter a new password",
+        confirmPassword: "Confirm new password", 
+        confirmPasswordPleace: "Please confirm the new password",
+        submit: "Submit changes",
+        reset: "Reset", 
+        submitTip: "Are you sure you want to submit a password change?",
+        submitOkTip: "Congratulations, {num} account password changed successfully!",
+        submitOk: "Sign in again",
+        equalToPassword: "Please enter a new password to confirm",
+        equalToPasswordOld: "Same as the old password, please re-enter the new password",
+        equalToPasswordErr: "Inconsistent new passwords entered twice",
+        styleLayout: "Personalization",
+        area1: "Layout Properties",
+        layout: "Overall Layout",
+        layoutActions: "Navigation mode module settings",
+        layoutSide: "Left",
+        layoutTop: "Top",
+        layoutMix: "Mixed",
+        color: "Style color scheme",
+        colorActions: "Overall style color scheme setting",
+        colorRandomly: "Randomization",
+        navTheme: "Dark Menu",
+        navThemeActions: "Menus that can only change the navigation mode",
+        fixedHeader: "Fixed top navigation bar",
+        fixedHeaderActions: "Whether the top navigation bar is fixed and does not move with the scroll bar",
+        fixSiderbar: "Fixed left menu",
+        fixSiderbarActions: "Whether the left menu is fixed or not, only valid for left menu layout",
+        splitMenus: "Auto Split Menu",
+        splitMenusActions: "Show left menu when there are multiple levels of menus at the top, valid only for mixed menu layouts",
+        area2: "Content Area",
+        tabRender: "Navigation tabs",
+        tabRenderActions: "Whether to show the top tab navigation items",
+        menuHeaderRender: "Menu Header",
+        menuHeaderRenderActions: "Whether or not to display the logo area at the top of the left menu bar",
+        footerRender: "Footer",
+        footerRenderActions: "Whether to show the bottom navigation bar",
+        headerRender: "Parapet",
+        headerRenderActions: "Whether to display the top navigation bar",
+      },
+      profile: {
+        phonenumber: "Phone",
+        email: "Email",
+        deptName: "Department",
+        postGroup: "Possession of posts",
+        roleGroup: "Ownership",
+        loginIp: "Log in",
+        loginDate: "Login Time",
+        list: "Lists",
+        empty: "Empty State",
+        description: "No data yet, try refreshing",
+      },
+    },
     configManage: {
       neManage: {
         addNe:'Add Network Element',

src/i18n/locales/zh-CN.ts

@@ -225,6 +225,85 @@ export default {
       tipContent: '恭喜您，{username} 账号注册成功！',
       tipBtn: '前往登录',
     },
+    account: {
+      settings: {
+        baseInfo: "基础信息",
+        sex: "用户性别",
+        sexPleace: "请选择用户性别",
+        email: "电子邮箱",
+        emailPleace: "请输入正确的电子邮箱",
+        phonenumber: "手机号码",
+        phonenumberPleace: "请输入正确的电子邮箱",
+        nick: "用户昵称",
+        nickPleace: "请输入用户昵称",
+        nickTip: "昵称只能包含字母、数字、中文和下划线，且不少于2位",
+        profileTip: "确认要提交修改用户基本信息吗?",
+        profileOk: "用户基本信息修改成功！",
+        know: "我知道了",
+        uploadPleace: "请选择等比大小图片作为头像，如{txt}",
+        upload: "上传/变更图片",
+        uploadFormat: '只支持上传图片格式（{format}）',
+        uploadSize: '图片文件大小必须小于 {size}MB',
+        uploadTip: "确认要上传/变更用户头像吗?",
+        uploadOk: "头像上传/变更成功",
+        resetPasswd: "重置密码",
+        oldPassword: "旧密码",
+        oldPasswordTip: "旧密码不能为空，且不少于6位",
+        oldPasswordPleace: "请输入旧密码",
+        newPassword: "新密码",
+        newPasswordTip: "密码至少包含大小写字母、数字、特殊符号，且不少于6位",
+        newPassworddPleace: "请输入新密码",
+        confirmPassword: "确认新密码", 
+        confirmPasswordPleace: "请确认新密码",
+        submit: "提交修改",
+        reset: "重置", 
+        submitTip: "确认要提交修改密码吗?",
+        submitOkTip: "恭喜您，{num} 账号密码修改成功！",
+        submitOk: "重新登录",
+        equalToPassword: "请输入确认新密码",
+        equalToPasswordOld: "与旧密码一致，请重新输入新密码",
+        equalToPasswordErr: "两次输入的新密码不一致",
+        styleLayout: "个性化",
+        area1: "布局属性",
+        layout: "整体布局",
+        layoutActions: "导航模式模块设置",
+        layoutSide: "左侧菜单布局",
+        layoutTop: "顶部菜单布局",
+        layoutMix: "混合菜单布局",
+        color: "风格配色",
+        colorActions: "整体风格配色设置",
+        colorRandomly: "随机",
+        navTheme: "深色菜单",
+        navThemeActions: "只能改变导航模式的菜单",
+        fixedHeader: "固定顶部导航栏",
+        fixedHeaderActions: "顶部导航栏是否固定，不随滚动条移动",
+        fixSiderbar: "固定左侧菜单",
+        fixSiderbarActions: "左侧菜单是否固定，仅左侧菜单布局时有效",
+        splitMenus: "自动分割菜单",
+        splitMenusActions: "顶部有多级菜单时显示左侧菜单，仅混合菜单布局时有效",
+        area2: "内容区域",
+        tabRender: "导航标签项",
+        tabRenderActions: "是否显示顶部Tab导航标签项",
+        menuHeaderRender: "菜单头",
+        menuHeaderRenderActions: "是否显示左侧菜单栏顶部LOGO区域",
+        footerRender: "页脚",
+        footerRenderActions: "是否显示底部导航栏",
+        headerRender: "顶栏",
+        headerRenderActions: "是否显示顶部导航栏",
+      },
+      profile: {
+        phonenumber: "手机号码",
+        email: "用户邮箱",
+        deptName: "所属部门",
+        postGroup: "拥有岗位",
+        roleGroup: "拥有角色",
+        loginIp: "登录地址",
+        loginDate: "登录时间",
+        list: "列表",
+        empty: "空状态",
+        description: "暂无数据，尝试刷新看看",
+      },
+    },
     configManage: {
       neManage: {
         addNe:'添加网元',

src/views/account/components/base-info.vue

@@ -43,7 +43,7 @@ function fnInitstateForm() {
 function fnFinish() {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: `确认要提交修改用户基本信息吗?`,
+    content: t('views.account.settings.profileTip'),
     onOk() {
       stateForm.formClick = true;
       // 发送请求
@@ -55,8 +55,8 @@ function fnFinish() {
         if (res.code === RESULT_CODE_SUCCESS) {
           Modal.success({
             title: t('common.tipTitle'),
-            content: `用户基本信息修改成功！`,
-            okText: '我知道了',
+            content: t('views.account.settings.profileOk'),
+            okText: t('views.account.settings.know'),
             onOk() {
               uerStore.setBaseInfo(form);
             },
@@ -77,11 +77,14 @@ function fnBeforeUpload(file: FileType) {
   if (upState.value) return false;
   const isJpgOrPng = ['image/jpeg', 'image/png'].includes(file.type);
   if (!isJpgOrPng) {
-    message.error('只支持上传图片格式（jpg、png）', 3);
+    message.error(
+      t('views.account.settings.uploadFormat', { format: 'jpg、png' }),
+      3
+    );
   }
   const isLt2M = file.size / 1024 / 1024 < 2;
   if (!isLt2M) {
-    message.error('图片文件大小必须小于 2MB', 3);
+    message.error(t('views.account.settings.uploadSize', { size: '2' }), 3);
   }
   return isJpgOrPng && isLt2M;
 }
@@ -90,7 +93,7 @@ function fnBeforeUpload(file: FileType) {
 function fnUpload(up: UploadRequestOption) {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: `确认要上传/变更用户头像吗?`,
+    content: t('views.account.settings.uploadTip'),
     onOk() {
       // 发送请求
       const hide = message.loading(t('common.loading'), 0);
@@ -101,7 +104,7 @@ function fnUpload(up: UploadRequestOption) {
         upState.value = false;
         hide();
         if (res.code === RESULT_CODE_SUCCESS) {
-          message.success('头像上传/变更成功', 3);
+          message.success(t('views.account.settings.uploadOk'), 3);
           uerStore.setAvatar(res.data);
         } else {
           message.error(res.msg, 3);
@@ -134,13 +137,13 @@ onMounted(() => {
     <a-row :gutter="16">
       <a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
         <a-form-item
-          label="用户昵称"
+          :label="t('views.account.settings.nick')"
           name="nickName"
           :rules="[
             {
               required: true,
               pattern: regExpNick,
-              message: '昵称只能包含字母、数字、中文和下划线，且不少于2位',
+              message: t('views.account.settings.nickTip'),
             },
           ]"
         >
@@ -148,18 +151,18 @@ onMounted(() => {
             v-model:value="stateForm.form.nickName"
             allow-clear
             :maxlength="26"
-            placeholder="请输入用户昵称"
+            :placeholder="t('views.account.settings.nickPleace')"
           ></a-input>
         </a-form-item>
 
         <a-form-item
-          label="手机号码"
+          :label="t('views.account.settings.phonenumber')"
           name="phonenumber"
           :rules="[
             {
               required: false,
               pattern: regExpMobile,
-              message: '请输入正确手机号码',
+              message: t('views.account.settings.phonenumberPleace'),
             },
           ]"
         >
@@ -167,18 +170,18 @@ onMounted(() => {
             v-model:value="stateForm.form.phonenumber"
             allow-clear
             :maxlength="11"
-            placeholder="请输入手机号码"
+            :placeholder="t('views.account.settings.phonenumberPleace')"
           ></a-input>
         </a-form-item>
 
         <a-form-item
-          label="电子邮箱"
+          :label="t('views.account.settings.email')"
           name="email"
           :rules="[
             {
               required: false,
               pattern: regExpEmail,
-              message: '请输入正确电子邮箱',
+              message: t('views.account.settings.emailPleace'),
             },
           ]"
         >
@@ -186,25 +189,21 @@ onMounted(() => {
             v-model:value="stateForm.form.email"
             allow-clear
             :maxlength="40"
-            placeholder="请输入电子邮箱"
+            :placeholder="t('views.account.settings.emailPleace')"
           ></a-input>
         </a-form-item>
 
         <a-form-item
-          label="用户性别"
+          :label="t('views.account.settings.sex')"
           name="sex"
           :rules="[
             {
               required: true,
-              message: '请选择用户性别',
+              message: t('views.account.settings.sexPleace'),
             },
           ]"
         >
-          <a-select
-            v-model:value="stateForm.form.sex"
-            placeholder="用户性别"
-            :options="sysUserSex"
-          >
+          <a-select v-model:value="stateForm.form.sex" :options="sysUserSex">
           </a-select>
         </a-form-item>
 
@@ -215,21 +214,27 @@ onMounted(() => {
             html-type="submit"
             :loading="stateForm.formClick"
           >
-            确认修改
+            {{ t('views.account.settings.submit') }}
           </a-button>
           <a-button
             type="default"
             @click="fnInitstateForm"
             :disabled="stateForm.formClick"
           >
-            重置
+            {{ t('views.account.settings.reset') }}
           </a-button>
         </a-space>
       </a-col>
       <a-col :lg="12" :md="12" :xs="24">
         <a-space direction="vertical" :size="16">
           <a-image :width="128" :height="128" :src="uerStore.getAvatar" />
-          <span>请选择等比大小图片作为头像，如200x200、400x400</span>
+          <span>
+            {{
+              t('views.account.settings.uploadPleace', {
+                txt: '200x200、400x400',
+              })
+            }}
+          </span>
           <a-upload
             name="file"
             list-type="picture"
@@ -239,7 +244,7 @@ onMounted(() => {
             :custom-request="fnUpload"
           >
             <a-button type="default" :loading="upState">
-              上传/变更图片
+              {{ t('views.account.settings.upload') }}
             </a-button>
           </a-upload>
         </a-space>

src/views/account/components/reset-passwd.vue

@@ -29,22 +29,22 @@ function fnEqualToPassword(
   callback: (error?: string) => void
 ) {
   if (!value) {
-    return Promise.reject('请输入确认新密码');
+    return Promise.reject(t('views.account.settings.equalToPassword'));
   }
   if (state.form.oldPassword === value) {
-    return Promise.reject('与旧密码一致，请重新输入新密码');
+    return Promise.reject(t('views.account.settings.equalToPasswordOld'));
   }
   if (state.form.newPassword === value) {
     return Promise.resolve();
   }
-  return Promise.reject('两次输入的新密码不一致');
+  return Promise.reject(t('views.account.settings.equalToPasswordErr'));
 }
 
 /**表单验证通过 */
 function fnFinish() {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: `确认要提交修改密码吗?`,
+    content: t('views.account.settings.submitTip'),
     onOk() {
       state.formClick = true;
       // 发送请求
@@ -54,8 +54,10 @@ function fnFinish() {
           if (res.code === RESULT_CODE_SUCCESS) {
             Modal.success({
               title: t('common.tipTitle'),
-              content: `恭喜您，${userName} 账号密码修改成功！`,
-              okText: '重新登录',
+              content: t('views.account.settings.submitOkTip', {
+                num: userName,
+              }),
+              okText: t('views.account.settings.submitOk'),
               onOk() {
                 fnLogOut().finally(() => router.push({ name: 'Login' }));
               },
@@ -82,20 +84,20 @@ function fnFinish() {
     @finish="fnFinish"
   >
     <a-form-item
-      label="旧密码"
+      :label="t('views.account.settings.oldPassword')"
       name="oldPassword"
       :rules="[
         {
           required: true,
           min: 6,
           max: 26,
-          message: '旧密码不能为空，且不少于6位',
+          message: t('views.account.settings.oldPasswordTip'),
         },
       ]"
     >
       <a-input-password
         v-model:value="state.form.oldPassword"
-        placeholder="请输入旧密码"
+        :placeholder="t('views.account.settings.oldPasswordPleace')"
         :maxlength="26"
       >
         <template #prefix>
@@ -104,19 +106,19 @@ function fnFinish() {
       </a-input-password>
     </a-form-item>
     <a-form-item
-      label="新密码"
+      :label="t('views.account.settings.newPassword')"
       name="newPassword"
       :rules="[
         {
           required: true,
           pattern: regExpPasswd,
-          message: '密码至少包含大小写字母、数字、特殊符号，且不少于6位',
+          message: t('views.account.settings.newPasswordTip'),
         },
       ]"
     >
       <a-input-password
         v-model:value="state.form.newPassword"
-        placeholder="请输入新密码"
+        :placeholder="t('views.account.settings.newPassworddPleace')"
         :maxlength="26"
       >
         <template #prefix>
@@ -125,7 +127,7 @@ function fnFinish() {
       </a-input-password>
     </a-form-item>
     <a-form-item
-      label="确认新密码"
+      :label="t('views.account.settings.confirmPassword')"
       name="confirmPassword"
       :rules="[
         {
@@ -136,7 +138,7 @@ function fnFinish() {
     >
       <a-input-password
         v-model:value="state.form.confirmPassword"
-        placeholder="请确认新密码"
+        :placeholder="t('views.account.settings.confirmPasswordPleace')"
         :maxlength="26"
       >
         <template #prefix>
@@ -152,7 +154,7 @@ function fnFinish() {
         html-type="submit"
         :loading="state.formClick"
       >
-        提交修改
+        {{ t('views.account.settings.submit') }}
       </a-button>
     </a-form-item>
   </a-form>

src/views/account/components/style-layout.vue

@@ -2,6 +2,8 @@
 import { ref } from 'vue';
 import { getLocalColor, changePrimaryColor } from '@/hooks/useTheme';
 import useLayoutStore from '@/store/modules/layout';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
 const { proConfig, changeConf } = useLayoutStore();
 
 let color = ref<string>(getLocalColor());
@@ -19,42 +21,57 @@ function fnColorChange(e: Event) {
 </script>
 
 <template>
-  <a-divider orientation="left">布局属性</a-divider>
+  <a-divider orientation="left">
+    {{ t('views.account.settings.area1') }}
+  </a-divider>
   <a-list item-layout="vertical" size="large" row-key="title">
     <a-list-item>
-      整体布局
-      <template #actions> 导航模式模块设置 </template>
+      {{ t('views.account.settings.layout') }}
+      <template #actions>
+        {{ t('views.account.settings.layoutActions') }}
+      </template>
       <template #extra>
         <a-radio-group
           style="margin-bottom: 12px"
           :value="proConfig.layout"
           @change="(e:any) => changeConf('layout', e.target.value)"
         >
-          <a-radio value="side">左侧菜单布局</a-radio>
-          <a-radio value="top">顶部菜单布局</a-radio>
-          <a-radio value="mix">混合菜单布局</a-radio>
+          <a-radio value="side">
+            {{ t('views.account.settings.layoutSide') }}
+          </a-radio>
+          <a-radio value="top">
+            {{ t('views.account.settings.layoutTop') }}
+          </a-radio>
+          <a-radio value="mix">
+            {{ t('views.account.settings.layoutMix') }}
+          </a-radio>
         </a-radio-group>
       </template>
     </a-list-item>
     <a-list-item>
-      风格配色
-      <template #actions> 整体风格配色设置 </template>
+      {{ t('views.account.settings.color') }}
+      <template #actions>
+        {{ t('views.account.settings.colorActions') }}
+      </template>
       <template #extra>
         <a-space :size="16" align="end" direction="horizontal">
           <a-button type="primary" size="small" @click="fnColorChange">
-            <BgColorsOutlined /> 随机
+            <BgColorsOutlined />
+            {{ t('views.account.settings.colorRandomly') }}
           </a-button>
           <input type="color" :value="color" @input="fnColorChange" />
         </a-space>
       </template>
     </a-list-item>
     <a-list-item>
-      深色菜单
-      <template #actions> 只能改变导航模式的菜单 </template>
+      {{ t('views.account.settings.navTheme') }}
+      <template #actions>
+        {{ t('views.account.settings.navThemeActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="是"
-          un-checked-children="否"
+          :checked-children="t('common.switch.open')"
+          :un-checked-children="t('common.switch.shut')"
           :checked="proConfig.navTheme === 'dark'"
           @change="
             (checked:any) => changeConf('navTheme', checked ? 'dark' : 'light')
@@ -63,53 +80,61 @@ function fnColorChange(e: Event) {
       </template>
     </a-list-item>
     <a-list-item>
-      固定顶部导航栏
-      <template #actions> 顶部导航栏是否固定，不随滚动条移动 </template>
+      {{ t('views.account.settings.fixedHeader') }}
+      <template #actions>
+        {{ t('views.account.settings.fixedHeaderActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="是"
-          un-checked-children="否"
+          :checked-children="t('common.switch.open')"
+          :un-checked-children="t('common.switch.shut')"
           :checked="proConfig.fixedHeader"
           @change="(checked:any) => changeConf('fixedHeader', checked)"
         ></a-switch>
       </template>
     </a-list-item>
     <a-list-item>
-      固定左侧菜单
-      <template #actions> 左侧菜单是否固定，仅左侧菜单布局时有效 </template>
+      {{ t('views.account.settings.fixSiderbar') }}
+      <template #actions>
+        {{ t('views.account.settings.fixSiderbarActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="是"
-          un-checked-children="否"
+          :checked-children="t('common.switch.open')"
+          :un-checked-children="t('common.switch.shut')"
           :checked="proConfig.fixSiderbar"
           @change="(checked:any) => changeConf('fixSiderbar', checked)"
         ></a-switch>
       </template>
     </a-list-item>
     <a-list-item>
-      自动分割菜单
+      {{ t('views.account.settings.splitMenus') }}
       <template #actions>
-        顶部有多级菜单时显示左侧菜单，仅混合菜单布局时有效
+        {{ t('views.account.settings.splitMenusActions') }}
       </template>
       <template #extra>
         <a-switch
-          checked-children="是"
-          un-checked-children="否"
+          :checked-children="t('common.switch.open')"
+          :un-checked-children="t('common.switch.shut')"
           :checked="proConfig.splitMenus"
           @change="(checked:any) => changeConf('splitMenus', checked)"
         ></a-switch>
       </template>
     </a-list-item>
   </a-list>
-  <a-divider orientation="left">内容区域</a-divider>
+  <a-divider orientation="left">
+    {{ t('views.account.settings.area2') }}
+  </a-divider>
   <a-list item-layout="vertical" size="large" row-key="title">
     <a-list-item>
-      顶栏
-      <template #actions> 是否显示顶部导航栏 </template>
+      {{ t('views.account.settings.headerRender') }}
+      <template #actions>
+        {{ t('views.account.settings.headerRenderActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="显示"
-          un-checked-children="隐藏"
+          :checked-children="t('common.switch.show')"
+          :un-checked-children="t('common.switch.hide')"
           :checked="proConfig.headerRender === undefined"
           @change="
             (checked:any) => changeConf('headerRender', checked === true && undefined)
@@ -118,12 +143,14 @@ function fnColorChange(e: Event) {
       </template>
     </a-list-item>
     <a-list-item>
-      页脚
-      <template #actions> 是否显示底部导航栏 </template>
+      {{ t('views.account.settings.footerRender') }}
+      <template #actions>
+        {{ t('views.account.settings.footerRenderActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="显示"
-          un-checked-children="隐藏"
+          :checked-children="t('common.switch.show')"
+          :un-checked-children="t('common.switch.hide')"
           :checked="proConfig.footerRender === undefined"
           @change="
             (checked:any) => changeConf('footerRender', checked === true && undefined)
@@ -132,12 +159,14 @@ function fnColorChange(e: Event) {
       </template>
     </a-list-item>
     <a-list-item>
-      菜单头
-      <template #actions> 是否显示左侧菜单栏顶部LOGO区域 </template>
+      {{ t('views.account.settings.menuHeaderRender') }}
+      <template #actions>
+        {{ t('views.account.settings.menuHeaderRenderActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="显示"
-          un-checked-children="隐藏"
+          :checked-children="t('common.switch.show')"
+          :un-checked-children="t('common.switch.hide')"
           :checked="proConfig.menuHeaderRender === undefined"
           @change="
             (checked:any) => changeConf('menuHeaderRender', checked === true && undefined)
@@ -146,12 +175,14 @@ function fnColorChange(e: Event) {
       </template>
     </a-list-item>
     <a-list-item>
-      导航标签项
-      <template #actions> 是否显示顶部Tab导航标签项 </template>
+      {{ t('views.account.settings.tabRender') }}
+      <template #actions>
+        {{ t('views.account.settings.tabRenderActions') }}
+      </template>
       <template #extra>
         <a-switch
-          checked-children="显示"
-          un-checked-children="隐藏"
+          :checked-children="t('common.switch.show')"
+          :un-checked-children="t('common.switch.hide')"
           :checked="proConfig.tabRender === undefined"
           @change="
             (checked:any) => changeConf('tabRender', checked === true && undefined)

src/views/account/profile.vue

@@ -6,6 +6,8 @@ import { reactive, ref, onMounted } from 'vue';
 import { parseDateToStr } from '@/utils/date-utils';
 import useUserStore from '@/store/modules/user';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
 
 /**加载状态 */
 let loading = ref<boolean>(true);
@@ -100,31 +102,33 @@ onMounted(() => {
             :bordered="true"
             :column="1"
           >
-            <a-descriptions-item label="手机号码">
+            <a-descriptions-item
+              :label="t('views.account.profile.phonenumber')"
+            >
               {{ state.user.phonenumber || '-' }}
             </a-descriptions-item>
-            <a-descriptions-item label="用户邮箱">
+            <a-descriptions-item :label="t('views.account.profile.email')">
               {{ state.user.email || '-' }}
             </a-descriptions-item>
-            <a-descriptions-item label="所属部门">
+            <a-descriptions-item :label="t('views.account.profile.deptName')">
               {{ state.user.dept?.deptName || '-' }}
             </a-descriptions-item>
-            <a-descriptions-item label="拥有岗位">
+            <a-descriptions-item :label="t('views.account.profile.postGroup')">
               <span v-if="state.postGroup.length === 0">-</span>
               <a-tag v-else v-for="v in state.postGroup" :key="v">
                 {{ v }}
               </a-tag>
             </a-descriptions-item>
-            <a-descriptions-item label="拥有角色">
+            <a-descriptions-item :label="t('views.account.profile.roleGroup')">
               <span v-if="state.roleGroup.length === 0">-</span>
               <a-tag v-else v-for="v in state.roleGroup" :key="v">
                 {{ v }}
               </a-tag>
             </a-descriptions-item>
-            <a-descriptions-item label="登录地址">
+            <a-descriptions-item :label="t('views.account.profile.loginIp')">
               {{ state.user.loginIp || '-' }}
             </a-descriptions-item>
-            <a-descriptions-item label="登录时间">
+            <a-descriptions-item :label="t('views.account.profile.loginDate')">
               <span v-if="+state.user.loginDate > 0">
                 {{ parseDateToStr(+state.user.loginDate) }}
               </span>
@@ -140,7 +144,7 @@ onMounted(() => {
             :destroy-inactive-tab-pane="true"
             v-model:activeKey="activeKey"
           >
-            <a-tab-pane key="list" tab="列表">
+            <a-tab-pane key="list" :tab="t('views.account.profile.list')">
               <a-list
                 item-layout="horizontal"
                 :data-source="listData"
@@ -163,10 +167,14 @@ onMounted(() => {
                 </template>
               </a-list>
             </a-tab-pane>
-            <a-tab-pane key="empty" tab="空状态">
+            <a-tab-pane key="empty" :tab="t('views.account.profile.empty')">
               <a-empty>
-                <template #description> 暂无数据，尝试刷新看看 </template>
-                <a-button type="primary">刷新</a-button>
+                <template #description>
+                  {{ t('views.account.profile.description') }}
+                </template>
+                <a-button type="primary">
+                  {{ t('commom.reloadText') }}
+                </a-button>
               </a-empty>
             </a-tab-pane>
           </a-tabs>

src/views/account/settings.vue

@@ -4,6 +4,8 @@ import { PageContainer } from '@ant-design-vue/pro-layout';
 import BaseInfo from './components/base-info.vue';
 import ResetPasswd from './components/reset-passwd.vue';
 import StyleLayout from './components/style-layout.vue';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
 
 /**Tab标签激活 */
 let activeKey = ref<string>('base-info');
@@ -13,13 +15,13 @@ let activeKey = ref<string>('base-info');
   <PageContainer>
     <a-card>
       <a-tabs tab-position="left" v-model:activeKey="activeKey">
-        <a-tab-pane key="base-info" tab="基础信息">
+        <a-tab-pane key="base-info" :tab="t('views.account.settings.baseInfo')">
           <BaseInfo></BaseInfo>
         </a-tab-pane>
-        <a-tab-pane key="reset-passwd" tab="重置密码">
+        <a-tab-pane key="reset-passwd" :tab="t('views.account.settings.resetPasswd')">
           <ResetPasswd></ResetPasswd>
         </a-tab-pane>
-        <a-tab-pane key="style-layout" tab="个性化">
+        <a-tab-pane key="style-layout" :tab="t('views.account.settings.styleLayout')">
           <StyleLayout></StyleLayout>
         </a-tab-pane>
       </a-tabs>