You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@seatunnel.apache.org by so...@apache.org on 2023/05/08 14:01:52 UTC

[incubator-seatunnel-web] branch add_canvas_job_define updated: [Feat][UI] Add chinese locale in the project.

This is an automated email from the ASF dual-hosted git repository.

songjian pushed a commit to branch add_canvas_job_define
in repository https://gitbox.apache.org/repos/asf/incubator-seatunnel-web.git


The following commit(s) were added to refs/heads/add_canvas_job_define by this push:
     new 0ad077fb [Feat][UI] Add chinese locale in the project.
0ad077fb is described below

commit 0ad077fb6dd43d150d7ada69ad0dd435187244d8
Author: songjianet <17...@qq.com>
AuthorDate: Mon May 8 22:01:37 2023 +0800

    [Feat][UI] Add chinese locale in the project.
---
 seatunnel-ui/src/App.tsx                           | 19 ++++++----
 .../src/layouts/dashboard/header/user/index.tsx    | 39 ++++++++++++++++---
 .../dashboard/header/user/use-user-dropdown.ts     | 42 +--------------------
 seatunnel-ui/src/locales/en_US/data-pipes.ts       |  8 +---
 seatunnel-ui/src/locales/en_US/jobs.ts             |  2 +-
 seatunnel-ui/src/locales/en_US/menu.ts             |  1 -
 seatunnel-ui/src/locales/en_US/setting.ts          |  1 +
 seatunnel-ui/src/locales/en_US/user-manage.ts      |  4 +-
 .../{en_US/user-manage.ts => zh_CN/data-pipes.ts}  | 44 ++++++++++++----------
 seatunnel-ui/src/locales/zh_CN/index.ts            | 22 ++++++++++-
 seatunnel-ui/src/locales/{en_US => zh_CN}/jobs.ts  | 22 +++++------
 .../locale/types.ts => locales/zh_CN/log.ts}       |  9 ++---
 .../src/locales/{en_US/menu.ts => zh_CN/login.ts}  | 14 +++----
 seatunnel-ui/src/locales/{en_US => zh_CN}/menu.ts  | 15 ++++----
 .../src/locales/zh_CN/{index.ts => modal.ts}       |  5 ++-
 .../src/locales/{en_US => zh_CN}/setting.ts        | 31 +++++++--------
 .../src/locales/{en_US/jobs.ts => zh_CN/tasks.ts}  | 36 ++++++++++++------
 .../src/locales/{en_US => zh_CN}/user-manage.ts    | 36 +++++++++---------
 seatunnel-ui/src/store/locale/index.ts             | 37 ------------------
 seatunnel-ui/src/store/setting/index.ts            | 11 +++++-
 seatunnel-ui/src/store/setting/types.ts            |  5 ++-
 seatunnel-ui/src/views/jobs/list/use-table.ts      |  2 +-
 seatunnel-ui/src/views/setting/index.tsx           | 44 +++++++++++-----------
 .../user-manage/list/components/form-modal.tsx     |  2 +-
 24 files changed, 225 insertions(+), 226 deletions(-)

diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/App.tsx
index 96635f88..6ec016b3 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/App.tsx
@@ -26,8 +26,8 @@ import {
   enUS
 } from 'naive-ui'
 import { useThemeStore } from '@/store/theme'
-import { useLocalesStore } from '@/store/locale'
 import { useSettingStore } from '@/store/setting'
+import { useI18n } from 'vue-i18n'
 import themeList from '@/themes'
 import type { GlobalThemeOverrides } from 'naive-ui'
 import type { Ref } from 'vue'
@@ -35,25 +35,30 @@ import type { Ref } from 'vue'
 const App = defineComponent({
   setup() {
     const themeStore = useThemeStore()
+    const settingStore = useSettingStore()
     const currentTheme = computed(() =>
       themeStore.darkTheme ? darkTheme : undefined
     )
-    const localesStore = useLocalesStore()
     const themeOverrides: Ref<GlobalThemeOverrides> = ref(
       themeList[currentTheme.value ? 'dark' : 'light']
     )
 
+    if (settingStore.getLocales) {
+      const { locale } = useI18n()
+      locale.value = settingStore.getLocales
+    }
+
     watch(
-      () => useSettingStore().getFilletValue,
+      () => settingStore.getFilletValue,
       () => {
         ;(themeOverrides.value.common as any).borderRadius =
-          useSettingStore().getFilletValue + 'px'
+          settingStore.getFilletValue + 'px'
       }
     )
 
     return {
+      settingStore,
       currentTheme,
-      localesStore,
       themeOverrides
     }
   },
@@ -63,9 +68,9 @@ const App = defineComponent({
         theme={this.currentTheme}
         theme-overrides={this.themeOverrides}
         date-locale={
-          String(this.localesStore.getLocales) === 'zh_CN' ? dateZhCN : dateEnUS
+          this.settingStore.getLocales === 'zh_CN' ? dateZhCN : dateEnUS
         }
-        locale={String(this.localesStore.getLocales) === 'zh_CN' ? zhCN : enUS}
+        locale={this.settingStore.getLocales === 'zh_CN' ? zhCN : enUS}
       >
         <NMessageProvider>
           <router-view />
diff --git a/seatunnel-ui/src/layouts/dashboard/header/user/index.tsx b/seatunnel-ui/src/layouts/dashboard/header/user/index.tsx
index b5d1da25..26f9e104 100644
--- a/seatunnel-ui/src/layouts/dashboard/header/user/index.tsx
+++ b/seatunnel-ui/src/layouts/dashboard/header/user/index.tsx
@@ -15,22 +15,33 @@
  * limitations under the License.
  */
 
-import { defineComponent, toRefs } from 'vue'
+import { Component, defineComponent, h } from 'vue'
 import { NSpace, NDropdown, NIcon, NButton } from 'naive-ui'
 import { useUserDropdown } from './use-user-dropdown'
 import { useUserStore } from '@/store/user'
-import { DownOutlined, UserOutlined } from '@vicons/antd'
+import { DownOutlined, LogoutOutlined, QuestionCircleOutlined, SettingOutlined, UserOutlined } from '@vicons/antd'
+import { useI18n } from 'vue-i18n'
 import type { UserDetail } from '@/service/user/types'
 
 const User = defineComponent({
   setup() {
-    const { state, handleSelect } = useUserDropdown()
+    const { handleSelect } = useUserDropdown()
+    const { t } = useI18n()
     const userDetail = useUserStore()
 
+    const renderIcon = (icon: Component) => {
+      return () => {
+        return h(NIcon, null, {
+          default: () => h(icon)
+        })
+      }
+    }
+
     return {
-      ...toRefs(state),
+      t,
       handleSelect,
-      userDetail
+      userDetail,
+      renderIcon
     }
   },
   render() {
@@ -43,7 +54,23 @@ const User = defineComponent({
       >
         <NDropdown
           trigger='click'
-          options={this.dropdownOptions}
+          options={[
+            {
+              key: 'help',
+              label: this.t('menu.help'),
+              icon: this.renderIcon(QuestionCircleOutlined)
+            },
+            {
+              key: 'setting',
+              label: this.t('menu.setting'),
+              icon: this.renderIcon(SettingOutlined)
+            },
+            {
+              key: 'logout',
+              label: this.t('menu.logout'),
+              icon: this.renderIcon(LogoutOutlined)
+            }
+          ]}
           onSelect={this.handleSelect}
         >
           <NButton text>
diff --git a/seatunnel-ui/src/layouts/dashboard/header/user/use-user-dropdown.ts b/seatunnel-ui/src/layouts/dashboard/header/user/use-user-dropdown.ts
index f1bafe79..7611ba35 100644
--- a/seatunnel-ui/src/layouts/dashboard/header/user/use-user-dropdown.ts
+++ b/seatunnel-ui/src/layouts/dashboard/header/user/use-user-dropdown.ts
@@ -15,55 +15,15 @@
  * limitations under the License.
  */
 
-import { reactive, h } from 'vue'
-import { useI18n } from 'vue-i18n'
 import { useRouter } from 'vue-router'
-import { NIcon } from 'naive-ui'
 import { userLogout } from '@/service/user'
 import { useUserStore } from '@/store/user'
-import {
-  LogoutOutlined,
-  QuestionCircleOutlined,
-  SettingOutlined
-} from '@vicons/antd'
 import type { Router } from 'vue-router'
-import type { Component } from 'vue'
 
 export function useUserDropdown() {
   const router: Router = useRouter()
-  const { t } = useI18n()
   const userStore = useUserStore()
 
-  const renderIcon = (icon: Component) => {
-    return () => {
-      return h(NIcon, null, {
-        default: () => h(icon)
-      })
-    }
-  }
-
-  const dropdownOptions = [
-    {
-      key: 'help',
-      label: t('menu.help'),
-      icon: renderIcon(QuestionCircleOutlined)
-    },
-    {
-      key: 'setting',
-      label: t('menu.setting'),
-      icon: renderIcon(SettingOutlined)
-    },
-    {
-      key: 'logout',
-      label: t('menu.logout'),
-      icon: renderIcon(LogoutOutlined)
-    }
-  ]
-
-  const state = reactive({
-    dropdownOptions
-  })
-
   const handleSelect = (key: string) => {
     if (key === 'help') {
       window.open('http://seatunnel.incubator.apache.org/versions/')
@@ -77,5 +37,5 @@ export function useUserDropdown() {
     }
   }
 
-  return { state, handleSelect }
+  return { handleSelect }
 }
diff --git a/seatunnel-ui/src/locales/en_US/data-pipes.ts b/seatunnel-ui/src/locales/en_US/data-pipes.ts
index af381770..c8d549f6 100644
--- a/seatunnel-ui/src/locales/en_US/data-pipes.ts
+++ b/seatunnel-ui/src/locales/en_US/data-pipes.ts
@@ -24,10 +24,6 @@ export default {
   create_time: 'Create Time',
   update_time: 'Update Time',
   operation: 'Operation',
-  succeed: 'Succeed',
-  running: 'Running',
-  failed: 'Failed',
-  killed: 'Killed',
   un_start: 'Un Start',
   execute: 'Execute',
   edit: 'Edit',
@@ -43,7 +39,7 @@ export default {
   value: 'Value',
   name_tips: 'Required fields,number, letter case, 100 characters',
   data_pipes_delete_tips:
-    'Whether to delete the data Pipe,It cannot be restored after being deleted.',
-  data_pipes_publish_tips: 'Whether to Publish the data pipe.',
+    'Whether to delete the data Pipe,It cannot be restored after being deleted',
+  data_pipes_publish_tips: 'Whether to Publish the data pipe',
   model_validate_tips: 'Required Fields'
 }
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/locales/en_US/jobs.ts
index 99de8afb..f7f53f4a 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/locales/en_US/jobs.ts
@@ -22,7 +22,7 @@ export default {
   search: 'Search',
   data_pipe_name: 'Data Pipe Name',
   plan: 'Plan',
-  create_date: 'Create Date',
+  create_time: 'Create Time',
   publish: 'Publish',
   operation: 'Operation',
   execute: 'Execute',
diff --git a/seatunnel-ui/src/locales/en_US/menu.ts b/seatunnel-ui/src/locales/en_US/menu.ts
index 37fd071b..c5566870 100644
--- a/seatunnel-ui/src/locales/en_US/menu.ts
+++ b/seatunnel-ui/src/locales/en_US/menu.ts
@@ -18,7 +18,6 @@
 export default {
   data_pipes: 'Data Pipes',
   jobs: 'Jobs',
-  manage: 'Manage',
   user_manage: 'User Manage',
   help: 'Help',
   setting: 'Setting',
diff --git a/seatunnel-ui/src/locales/en_US/setting.ts b/seatunnel-ui/src/locales/en_US/setting.ts
index 9ce36be7..fd270146 100644
--- a/seatunnel-ui/src/locales/en_US/setting.ts
+++ b/seatunnel-ui/src/locales/en_US/setting.ts
@@ -26,6 +26,7 @@ export default {
   theme_setting: 'Theme Setting',
   theme: 'Theme',
   english: 'English',
+  chinese: 'Chinese',
   light: 'Light',
   model: 'Model',
   hue: 'Hue',
diff --git a/seatunnel-ui/src/locales/en_US/user-manage.ts b/seatunnel-ui/src/locales/en_US/user-manage.ts
index eaba9da0..f689e8ed 100644
--- a/seatunnel-ui/src/locales/en_US/user-manage.ts
+++ b/seatunnel-ui/src/locales/en_US/user-manage.ts
@@ -20,7 +20,7 @@ export default {
   user_manage: 'User Manage',
   create: 'Create',
   username: 'Username',
-  status: 'Status',
+  state: 'State',
   create_time: 'Create Time',
   update_time: 'Update Time',
   operation: 'Operation',
@@ -35,5 +35,5 @@ export default {
   username_tips: 'Required fields, number, letter case, 50 characters',
   password_tips: 'Required fields, number, letter case, 6 characters',
   user_delete_tips:
-    'Whether to delete the user? It cannot be restored after being deleted.'
+    'Whether to delete the user? It cannot be restored after being deleted'
 }
diff --git a/seatunnel-ui/src/locales/en_US/user-manage.ts b/seatunnel-ui/src/locales/zh_CN/data-pipes.ts
similarity index 55%
copy from seatunnel-ui/src/locales/en_US/user-manage.ts
copy to seatunnel-ui/src/locales/zh_CN/data-pipes.ts
index eaba9da0..70b0de79 100644
--- a/seatunnel-ui/src/locales/en_US/user-manage.ts
+++ b/seatunnel-ui/src/locales/zh_CN/data-pipes.ts
@@ -17,23 +17,29 @@
 
 export default {
   id: 'Id',
-  user_manage: 'User Manage',
-  create: 'Create',
-  username: 'Username',
-  status: 'Status',
-  create_time: 'Create Time',
-  update_time: 'Update Time',
-  operation: 'Operation',
-  enable: 'Enable',
-  disable: 'Disable',
-  edit: 'Edit',
-  delete: 'Delete',
-  active: 'Active',
-  inactive: 'Inactive',
-  password: 'Password',
-  model_validate_tips: 'Required Fields',
-  username_tips: 'Required fields, number, letter case, 50 characters',
-  password_tips: 'Required fields, number, letter case, 6 characters',
-  user_delete_tips:
-    'Whether to delete the user? It cannot be restored after being deleted.'
+  data_pipes: '数据管道',
+  create: '创建',
+  name: '名称',
+  state: '状态',
+  create_time: '创建时间',
+  update_time: '更新时间e',
+  operation: '操作',
+  un_start: '取消开始',
+  execute: '执行',
+  edit: '编辑',
+  publish: '发布',
+  delete: '删除',
+  save: '保存',
+  cancel: '取消',
+  script: '脚本',
+  kill: '终止',
+  stop: '停止',
+  add: '添加',
+  key: '键',
+  value: '值',
+  name_tips: '必填字段,数字,字母大小写,100个字符',
+  data_pipes_delete_tips:
+    '是否删除数据管道,删除后无法恢复',
+  data_pipes_publish_tips: '是否发布数据管道',
+  model_validate_tips: '必填字段'
 }
diff --git a/seatunnel-ui/src/locales/zh_CN/index.ts b/seatunnel-ui/src/locales/zh_CN/index.ts
index 39626a39..04351711 100644
--- a/seatunnel-ui/src/locales/zh_CN/index.ts
+++ b/seatunnel-ui/src/locales/zh_CN/index.ts
@@ -15,4 +15,24 @@
  * limitations under the License.
  */
 
-export default {}
+import login from '@/locales/zh_CN/login'
+import menu from '@/locales/zh_CN/menu'
+import modal from '@/locales/zh_CN/modal'
+import user_manage from '@/locales/zh_CN/user-manage'
+import data_pipes from '@/locales/zh_CN/data-pipes'
+import log from '@/locales/zh_CN/log'
+import jobs from '@/locales/zh_CN/jobs'
+import tasks from '@/locales/zh_CN/tasks'
+import setting from '@/locales/zh_CN/setting'
+
+export default {
+  login,
+  menu,
+  modal,
+  user_manage,
+  data_pipes,
+  log,
+  jobs,
+  tasks,
+  setting
+}
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/locales/zh_CN/jobs.ts
similarity index 75%
copy from seatunnel-ui/src/locales/en_US/jobs.ts
copy to seatunnel-ui/src/locales/zh_CN/jobs.ts
index 99de8afb..94cd79f0 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/locales/zh_CN/jobs.ts
@@ -16,15 +16,15 @@
  */
 
 export default {
-  script_id: 'Script Id',
-  job_id: 'Job Id',
-  jobs: 'Jobs',
-  search: 'Search',
-  data_pipe_name: 'Data Pipe Name',
-  plan: 'Plan',
-  create_date: 'Create Date',
-  publish: 'Publish',
-  operation: 'Operation',
-  execute: 'Execute',
-  recycle: 'Recycle'
+  script_id: '脚本 Id',
+  job_id: '工作 Id',
+  jobs: '工作',
+  search: '搜索',
+  data_pipe_name: '数据管道名称',
+  plan: '计划',
+  create_time: '创建时间',
+  publish: '发布',
+  operation: '操作',
+  execute: '执行',
+  recycle: '回收'
 }
diff --git a/seatunnel-ui/src/store/locale/types.ts b/seatunnel-ui/src/locales/zh_CN/log.ts
similarity index 87%
rename from seatunnel-ui/src/store/locale/types.ts
rename to seatunnel-ui/src/locales/zh_CN/log.ts
index 03625ade..f80cc833 100644
--- a/seatunnel-ui/src/store/locale/types.ts
+++ b/seatunnel-ui/src/locales/zh_CN/log.ts
@@ -15,10 +15,7 @@
  * limitations under the License.
  */
 
-type Locales = 'zh_CN' | 'en_US'
-
-interface LocalesStore {
-  locales: Locales
+export default {
+  please_select_log: '请选择日志',
+  search: '搜索'
 }
-
-export { LocalesStore, Locales }
diff --git a/seatunnel-ui/src/locales/en_US/menu.ts b/seatunnel-ui/src/locales/zh_CN/login.ts
similarity index 81%
copy from seatunnel-ui/src/locales/en_US/menu.ts
copy to seatunnel-ui/src/locales/zh_CN/login.ts
index 37fd071b..db12f171 100644
--- a/seatunnel-ui/src/locales/en_US/menu.ts
+++ b/seatunnel-ui/src/locales/zh_CN/login.ts
@@ -16,12 +16,10 @@
  */
 
 export default {
-  data_pipes: 'Data Pipes',
-  jobs: 'Jobs',
-  manage: 'Manage',
-  user_manage: 'User Manage',
-  help: 'Help',
-  setting: 'Setting',
-  logout: 'Logout',
-  tasks: 'Tasks'
+  login_to_sea_tunnel: '登录 SeaTunnel',
+  login: '登录',
+  username: '用户名',
+  password: '密码',
+  username_tips: '请输入用户名',
+  password_tips: '请输入密码'
 }
diff --git a/seatunnel-ui/src/locales/en_US/menu.ts b/seatunnel-ui/src/locales/zh_CN/menu.ts
similarity index 82%
copy from seatunnel-ui/src/locales/en_US/menu.ts
copy to seatunnel-ui/src/locales/zh_CN/menu.ts
index 37fd071b..e689b51e 100644
--- a/seatunnel-ui/src/locales/en_US/menu.ts
+++ b/seatunnel-ui/src/locales/zh_CN/menu.ts
@@ -16,12 +16,11 @@
  */
 
 export default {
-  data_pipes: 'Data Pipes',
-  jobs: 'Jobs',
-  manage: 'Manage',
-  user_manage: 'User Manage',
-  help: 'Help',
-  setting: 'Setting',
-  logout: 'Logout',
-  tasks: 'Tasks'
+  data_pipes: '数据管道',
+  jobs: '工作',
+  user_manage: '用户管理',
+  help: '帮助',
+  setting: '设置',
+  logout: '登出',
+  tasks: '任务'
 }
diff --git a/seatunnel-ui/src/locales/zh_CN/index.ts b/seatunnel-ui/src/locales/zh_CN/modal.ts
similarity index 93%
copy from seatunnel-ui/src/locales/zh_CN/index.ts
copy to seatunnel-ui/src/locales/zh_CN/modal.ts
index 39626a39..155a855b 100644
--- a/seatunnel-ui/src/locales/zh_CN/index.ts
+++ b/seatunnel-ui/src/locales/zh_CN/modal.ts
@@ -15,4 +15,7 @@
  * limitations under the License.
  */
 
-export default {}
+export default {
+  cancel: '取消',
+  confirm: '确认'
+}
diff --git a/seatunnel-ui/src/locales/en_US/setting.ts b/seatunnel-ui/src/locales/zh_CN/setting.ts
similarity index 66%
copy from seatunnel-ui/src/locales/en_US/setting.ts
copy to seatunnel-ui/src/locales/zh_CN/setting.ts
index 9ce36be7..6c94c4b9 100644
--- a/seatunnel-ui/src/locales/en_US/setting.ts
+++ b/seatunnel-ui/src/locales/zh_CN/setting.ts
@@ -16,19 +16,20 @@
  */
 
 export default {
-  table_setting: 'Table Setting',
-  sequence_column: 'Sequence Column',
-  data_unique_value: 'Data Unique Value',
-  language_setting: 'Language Setting',
-  request_setting: 'Request Setting',
-  request_time: 'Request Time',
-  language: 'Language',
-  theme_setting: 'Theme Setting',
-  theme: 'Theme',
-  english: 'English',
-  light: 'Light',
-  model: 'Model',
-  hue: 'Hue',
-  purple: 'Purple',
-  fillet: 'Fillet'
+  table_setting: '表格设置',
+  sequence_column: '序号列',
+  data_unique_value: '数据唯一值',
+  language_setting: '语言设置',
+  request_setting: '请求设置',
+  request_time: '请求时间',
+  language: '语言',
+  theme_setting: '主题设置',
+  theme: '主题',
+  english: '英文',
+  chinese: '中文',
+  light: '浅色',
+  model: '模式',
+  hue: '色调',
+  purple: '紫色',
+  fillet: '圆角'
 }
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/locales/zh_CN/tasks.ts
similarity index 57%
copy from seatunnel-ui/src/locales/en_US/jobs.ts
copy to seatunnel-ui/src/locales/zh_CN/tasks.ts
index 99de8afb..031eb94d 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/locales/zh_CN/tasks.ts
@@ -16,15 +16,29 @@
  */
 
 export default {
-  script_id: 'Script Id',
-  job_id: 'Job Id',
-  jobs: 'Jobs',
-  search: 'Search',
-  data_pipe_name: 'Data Pipe Name',
-  plan: 'Plan',
-  create_date: 'Create Date',
-  publish: 'Publish',
-  operation: 'Operation',
-  execute: 'Execute',
-  recycle: 'Recycle'
+  instance_id: '实例 Id',
+  job_id: '工作 Id',
+  tasks: '任务',
+  search: '搜索',
+  success: '成功',
+  fail: '失败',
+  stop: '停止',
+  running: '运行中',
+  unknown: '未知',
+  unpublished: '未发布',
+  published: '发布',
+  task_name: '任务名称',
+  state: '状态',
+  run_frequency: '运行频率',
+  once: '一次',
+  crontab: '定时',
+  start_time: '开始时间',
+  end_time: '结束时间',
+  last_total_bytes: '最后总字节数',
+  last_total_records: '最后总记录',
+  rerun: '重新运行',
+  kill: '终止',
+  operation: '操作',
+  view_log: '查看日志',
+  log: '日志'
 }
diff --git a/seatunnel-ui/src/locales/en_US/user-manage.ts b/seatunnel-ui/src/locales/zh_CN/user-manage.ts
similarity index 59%
copy from seatunnel-ui/src/locales/en_US/user-manage.ts
copy to seatunnel-ui/src/locales/zh_CN/user-manage.ts
index eaba9da0..46a60c6f 100644
--- a/seatunnel-ui/src/locales/en_US/user-manage.ts
+++ b/seatunnel-ui/src/locales/zh_CN/user-manage.ts
@@ -17,23 +17,23 @@
 
 export default {
   id: 'Id',
-  user_manage: 'User Manage',
-  create: 'Create',
-  username: 'Username',
-  status: 'Status',
-  create_time: 'Create Time',
-  update_time: 'Update Time',
-  operation: 'Operation',
-  enable: 'Enable',
-  disable: 'Disable',
-  edit: 'Edit',
-  delete: 'Delete',
-  active: 'Active',
-  inactive: 'Inactive',
-  password: 'Password',
-  model_validate_tips: 'Required Fields',
-  username_tips: 'Required fields, number, letter case, 50 characters',
-  password_tips: 'Required fields, number, letter case, 6 characters',
+  user_manage: '用户管理',
+  create: '创建',
+  username: '用户名',
+  state: '状态',
+  create_time: '创建时间',
+  update_time: '更新时间',
+  operation: '操作',
+  enable: '启用',
+  disable: '禁用',
+  edit: '编辑',
+  delete: '删除',
+  active: '激活',
+  inactive: '未激活',
+  password: '密码',
+  model_validate_tips: '必填字段',
+  username_tips: '必填字段,数字,字母大小写,50 个字符',
+  password_tips: '必填字段,数字,字母大小写,6 个字符',
   user_delete_tips:
-    'Whether to delete the user? It cannot be restored after being deleted.'
+    '是否删除用户? 删除后无法恢复'
 }
diff --git a/seatunnel-ui/src/store/locale/index.ts b/seatunnel-ui/src/store/locale/index.ts
deleted file mode 100644
index 1b31f7a9..00000000
--- a/seatunnel-ui/src/store/locale/index.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { defineStore } from 'pinia'
-import { LocalesStore, Locales } from './types'
-
-export const useLocalesStore = defineStore({
-  id: 'locales',
-  state: (): LocalesStore => ({
-    locales: 'en_US'
-  }),
-  persist: true,
-  getters: {
-    getLocales(): Locales {
-      return this.locales
-    }
-  },
-  actions: {
-    setLocales(lang: Locales): void {
-      this.locales = lang
-    }
-  }
-})
diff --git a/seatunnel-ui/src/store/setting/index.ts b/seatunnel-ui/src/store/setting/index.ts
index 561e0b91..b22e9f8d 100644
--- a/seatunnel-ui/src/store/setting/index.ts
+++ b/seatunnel-ui/src/store/setting/index.ts
@@ -16,7 +16,7 @@
  */
 
 import { defineStore } from 'pinia'
-import { SettingStore } from './types'
+import type { SettingStore, Locales } from './types'
 
 export const useSettingStore = defineStore({
   id: 'setting',
@@ -24,7 +24,8 @@ export const useSettingStore = defineStore({
     sequenceColumn: false,
     dataUniqueValue: false,
     fillet: 15,
-    requestTime: 6000
+    requestTime: 6000,
+    locales: 'en_US'
   }),
   persist: true,
   getters: {
@@ -39,6 +40,9 @@ export const useSettingStore = defineStore({
     },
     getRequestTimeValue(): number {
       return this.requestTime
+    },
+    getLocales(): Locales {
+      return this.locales
     }
   },
   actions: {
@@ -53,6 +57,9 @@ export const useSettingStore = defineStore({
     },
     setRequestTimeValue(status: number): void {
       this.requestTime = status
+    },
+    setLocales(lang: Locales): void {
+      this.locales = lang
     }
   }
 })
diff --git a/seatunnel-ui/src/store/setting/types.ts b/seatunnel-ui/src/store/setting/types.ts
index ba5327f5..3652c715 100644
--- a/seatunnel-ui/src/store/setting/types.ts
+++ b/seatunnel-ui/src/store/setting/types.ts
@@ -15,11 +15,14 @@
  * limitations under the License.
  */
 
+type Locales = 'zh_CN' | 'en_US'
+
 interface SettingStore {
   sequenceColumn: boolean
   dataUniqueValue: boolean
   fillet: number
   requestTime: number
+  locales: Locales
 }
 
-export { SettingStore }
+export { SettingStore, Locales }
diff --git a/seatunnel-ui/src/views/jobs/list/use-table.ts b/seatunnel-ui/src/views/jobs/list/use-table.ts
index 1b910d5b..e7ac2070 100644
--- a/seatunnel-ui/src/views/jobs/list/use-table.ts
+++ b/seatunnel-ui/src/views/jobs/list/use-table.ts
@@ -51,7 +51,7 @@ export function useTable() {
         key: 'jobPlan'
       },
       {
-        title: t('jobs.create_date'),
+        title: t('jobs.create_time'),
         key: 'createTime'
       },
       {
diff --git a/seatunnel-ui/src/views/setting/index.tsx b/seatunnel-ui/src/views/setting/index.tsx
index fc7e94b1..04f86c8f 100644
--- a/seatunnel-ui/src/views/setting/index.tsx
+++ b/seatunnel-ui/src/views/setting/index.tsx
@@ -22,21 +22,16 @@ import { useSettingStore } from '@/store/setting'
 
 const Setting = defineComponent({
   name: 'Setting',
-  setup() {
-    const { t } = useI18n()
-
-    return {
-      t
-    }
-  },
   render() {
+    const { t, locale } = useI18n()
+
     return (
       <NSpace vertical>
-        <NCard title={this.t('setting.table_setting')}>
+        <NCard title={t('setting.table_setting')}>
           <NList>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.sequence_column')}</span>
+                <span>{t('setting.sequence_column')}</span>
                 <NSwitch
                   value={useSettingStore().getSequenceColumn}
                   onUpdateValue={(v) => {
@@ -47,7 +42,7 @@ const Setting = defineComponent({
             </NListItem>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.data_unique_value')}</span>
+                <span>{t('setting.data_unique_value')}</span>
                 <NSwitch
                   value={useSettingStore().getDataUniqueValue}
                   onUpdateValue={(v) => {
@@ -58,28 +53,33 @@ const Setting = defineComponent({
             </NListItem>
           </NList>
         </NCard>
-        <NCard title={this.t('setting.language_setting')}>
+        <NCard title={t('setting.language_setting')}>
           <NList>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.language')}</span>
+                <span>{t('setting.language')}</span>
                 <div class='w-56'>
                   <NSelect
-                    value={'english'}
+                    value={useSettingStore().getLocales}
                     options={[
-                      { value: 'english', label: this.t('setting.english') }
+                      { value: 'en_US', label: t('setting.english') },
+                      { value: 'zh_CN', label: t('setting.chinese') }
                     ]}
+                    onUpdateValue={(l) => {
+                      locale.value = l
+                      useSettingStore().setLocales(l)
+                    }}
                   />
                 </div>
               </NSpace>
             </NListItem>
           </NList>
         </NCard>
-        <NCard title={this.t('setting.request_setting')}>
+        <NCard title={t('setting.request_setting')}>
           <NList>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.request_time')}</span>
+                <span>{t('setting.request_time')}</span>
                 <div class='w-56'>
                   <NSelect
                     value={useSettingStore().getRequestTimeValue}
@@ -99,16 +99,16 @@ const Setting = defineComponent({
             </NListItem>
           </NList>
         </NCard>
-        <NCard title={this.t('setting.theme_setting')}>
+        <NCard title={t('setting.theme_setting')}>
           <NList>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.model')}</span>
+                <span>{t('setting.model')}</span>
                 <div class='w-56'>
                   <NSelect
                     value={'light'}
                     options={[
-                      { value: 'light', label: this.t('setting.light') }
+                      { value: 'light', label: t('setting.light') }
                     ]}
                   />
                 </div>
@@ -116,12 +116,12 @@ const Setting = defineComponent({
             </NListItem>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.hue')}</span>
+                <span>{t('setting.hue')}</span>
                 <div class='w-56'>
                   <NSelect
                     value={'purple'}
                     options={[
-                      { value: 'purple', label: this.t('setting.purple') }
+                      { value: 'purple', label: t('setting.purple') }
                     ]}
                   />
                 </div>
@@ -129,7 +129,7 @@ const Setting = defineComponent({
             </NListItem>
             <NListItem>
               <NSpace justify='space-between' align='center'>
-                <span>{this.t('setting.fillet')}</span>
+                <span>{t('setting.fillet')}</span>
                 <div class='w-56'>
                   <NSelect
                     value={useSettingStore().getFilletValue}
diff --git a/seatunnel-ui/src/views/user-manage/list/components/form-modal.tsx b/seatunnel-ui/src/views/user-manage/list/components/form-modal.tsx
index d95fc0f1..365c078c 100644
--- a/seatunnel-ui/src/views/user-manage/list/components/form-modal.tsx
+++ b/seatunnel-ui/src/views/user-manage/list/components/form-modal.tsx
@@ -145,7 +145,7 @@ const FormModal = defineComponent({
                   </NTooltip>
                 </NSpace>
               </NFormItem>
-              <NFormItem label={this.t('user_manage.status')} path='status'>
+              <NFormItem label={this.t('user_manage.state')} path='status'>
                 <NRadioGroup v-model={[this.model.status, 'value']}>
                   <NRadio value={0}>{this.t('user_manage.enable')}</NRadio>
                   <NRadio value={1}>{this.t('user_manage.disable')}</NRadio>