diff --git a/ui/src/layout/components/sidebar/SidebarItem.vue b/ui/src/layout/components/sidebar/SidebarItem.vue
index 8601d6327..68565b4dd 100644
--- a/ui/src/layout/components/sidebar/SidebarItem.vue
+++ b/ui/src/layout/components/sidebar/SidebarItem.vue
@@ -9,7 +9,7 @@
         <el-icon>
           <AppIcon v-if="menu.meta && menu.meta.icon" :iconName="menuIcon" class="sidebar-icon" />
         </el-icon>
-        <span>{{ menu.meta?.title as string }}</span>
+        <span>{{ $t(menu.meta?.title as string) }}</span>
       </template>
       <sidebar-item
         v-hasPermission="child.meta?.permission"
@@ -29,7 +29,7 @@
     >
       <template #title>
         <AppIcon v-if="menu.meta && menu.meta.icon" :iconName="menuIcon" class="sidebar-icon" />
-        <span v-if="menu.meta && menu.meta.title">{{ menu.meta.title }}</span>
+        <span v-if="menu.meta && menu.meta.title">{{ $t(menu.meta.title) }}</span>
       </template>
     </el-menu-item>
   </div>
diff --git a/ui/src/layout/components/top-bar/top-menu/MenuItem.vue b/ui/src/layout/components/top-bar/top-menu/MenuItem.vue
index a53ecc23f..0cca4100f 100644
--- a/ui/src/layout/components/top-bar/top-menu/MenuItem.vue
+++ b/ui/src/layout/components/top-bar/top-menu/MenuItem.vue
@@ -8,7 +8,7 @@
       <AppIcon :iconName="menu.meta ? (menu.meta.icon as string) : '404'" />
     </div> -->
     <div class="title">
-      {{ menu.meta?.title }}
+      {{ $t(menu.meta?.title) }}
     </div>
   </div>
 </template>
diff --git a/ui/src/router/modules/application.ts b/ui/src/router/modules/application.ts
index 654bbd6c3..018429b89 100644
--- a/ui/src/router/modules/application.ts
+++ b/ui/src/router/modules/application.ts
@@ -1,11 +1,10 @@
 import Layout from '@/layout/layout-template/DetailLayout.vue'
 import { ComplexPermission } from '@/utils/permission/type'
-import { t } from '@/locales'
 
 const applicationRouter = {
   path: '/application',
   name: 'application',
-  meta: { title: t('views.application.title'), permission: 'APPLICATION:READ' },
+  meta: { title: 'views.application.title', permission: 'APPLICATION:READ' },
   redirect: '/application',
   component: () => import('@/layout/layout-template/AppLayout.vue'),
   children: [
@@ -28,7 +27,7 @@ const applicationRouter = {
           meta: {
             icon: 'app-all-menu',
             iconActive: 'app-all-menu-active',
-            title: t('views.applicationOverview.title'),
+            title: 'views.applicationOverview.title',
             active: 'overview',
             parentPath: '/application/:id/:type',
             parentName: 'ApplicationDetail'
@@ -41,7 +40,7 @@ const applicationRouter = {
           meta: {
             icon: 'app-setting',
             iconActive: 'app-setting-active',
-            title: t('common.setting'),
+            title: 'common.setting',
             active: 'setting',
             parentPath: '/application/:id/:type',
             parentName: 'ApplicationDetail'
@@ -54,7 +53,7 @@ const applicationRouter = {
           meta: {
             icon: 'app-access',
             iconActive: 'app-access-active',
-            title: t('views.application.applicationAccess.title'),
+            title: 'views.application.applicationAccess.title',
             active: 'access',
             parentPath: '/application/:id/:type',
             parentName: 'ApplicationDetail',
@@ -67,7 +66,7 @@ const applicationRouter = {
           name: 'AppHitTest',
           meta: {
             icon: 'app-hit-test',
-            title: t('views.application.hitTest.title'),
+            title: 'views.application.hitTest.title',
             active: 'hit-test',
             parentPath: '/application/:id/:type',
             parentName: 'ApplicationDetail'
@@ -80,7 +79,7 @@ const applicationRouter = {
           meta: {
             icon: 'app-document',
             iconActive: 'app-document-active',
-            title: t('views.log.title'),
+            title: 'views.log.title',
             active: 'log',
             parentPath: '/application/:id/:type',
             parentName: 'ApplicationDetail'
diff --git a/ui/src/router/modules/dataset.ts b/ui/src/router/modules/dataset.ts
index 56e6d6ee0..e29542865 100644
--- a/ui/src/router/modules/dataset.ts
+++ b/ui/src/router/modules/dataset.ts
@@ -1,9 +1,8 @@
 import Layout from '@/layout/layout-template/DetailLayout.vue'
-import { t } from '@/locales'
 const datasetRouter = {
   path: '/dataset',
   name: 'dataset',
-  meta: { title:  t('views.dataset.title'), permission: 'DATASET:READ' },
+  meta: { title:  'views.dataset.title', permission: 'DATASET:READ' },
   component: () => import('@/layout/layout-template/AppLayout.vue'),
   redirect: '/dataset',
   children: [
@@ -23,7 +22,7 @@ const datasetRouter = {
     {
       path: '/dataset/:id',
       name: 'DatasetDetail',
-      meta: { title: t('common.fileUpload.document'), activeMenu: '/dataset' },
+      meta: { title: 'common.fileUpload.document', activeMenu: '/dataset' },
       component: Layout,
       hidden: true,
       children: [
@@ -33,7 +32,7 @@ const datasetRouter = {
           meta: {
             icon: 'app-document',
             iconActive: 'app-document-active',
-            title: t('common.fileUpload.document'),
+            title: 'common.fileUpload.document',
             active: 'document',
             parentPath: '/dataset/:id',
             parentName: 'DatasetDetail'
@@ -46,7 +45,7 @@ const datasetRouter = {
           meta: {
             icon: 'app-problems',
             iconActive: 'QuestionFilled',
-            title: t('views.problem.title'),
+            title: 'views.problem.title',
             active: 'problem',
             parentPath: '/dataset/:id',
             parentName: 'DatasetDetail'
@@ -58,7 +57,7 @@ const datasetRouter = {
           name: 'DatasetHitTest',
           meta: {
             icon: 'app-hit-test',
-            title: t('views.application.hitTest.title'),
+            title: 'views.application.hitTest.title',
             active: 'hit-test',
             parentPath: '/dataset/:id',
             parentName: 'DatasetDetail'
@@ -71,7 +70,7 @@ const datasetRouter = {
           meta: {
             icon: 'app-setting',
             iconActive: 'app-setting-active',
-            title: t('common.setting'),
+            title: 'common.setting',
             active: 'setting',
             parentPath: '/dataset/:id',
             parentName: 'DatasetDetail'
diff --git a/ui/src/router/modules/function-lib.ts b/ui/src/router/modules/function-lib.ts
index 5773f57eb..2b4dd9543 100644
--- a/ui/src/router/modules/function-lib.ts
+++ b/ui/src/router/modules/function-lib.ts
@@ -1,8 +1,7 @@
-import { t } from '@/locales'
 const functionLibRouter = {
   path: '/function-lib',
   name: 'function_lib',
-  meta: { title: t('views.functionLib.title'), permission: 'APPLICATION:READ' },
+  meta: { title: 'views.functionLib.title', permission: 'APPLICATION:READ' },
   redirect: '/function-lib',
   component: () => import('@/layout/layout-template/AppLayout.vue'),
   children: [
diff --git a/ui/src/router/modules/setting.ts b/ui/src/router/modules/setting.ts
index 5e74cf695..5022017ce 100644
--- a/ui/src/router/modules/setting.ts
+++ b/ui/src/router/modules/setting.ts
@@ -1,11 +1,10 @@
 import { hasPermission } from '@/utils/permission/index'
 import Layout from '@/layout/layout-template/SystemLayout.vue'
 import { Role, ComplexPermission } from '@/utils/permission/type'
-import { t } from '@/locales'
 const settingRouter = {
   path: '/setting',
   name: 'setting',
-  meta: { icon: 'Setting', title: t('views.system.title'), permission: 'SETTING:READ' },
+  meta: { icon: 'Setting', title: 'views.system.title', permission: 'SETTING:READ' },
   redirect: () => {
     if (hasPermission(new Role('ADMIN'), 'AND')) {
       return '/user'
@@ -20,7 +19,7 @@ const settingRouter = {
       meta: {
         icon: 'User',
         iconActive: 'UserFilled',
-        title: t('views.user.title'),
+        title: 'views.user.title',
         activeMenu: '/setting',
         parentPath: '/setting',
         parentName: 'setting',
@@ -34,7 +33,7 @@ const settingRouter = {
       meta: {
         icon: 'app-team',
         iconActive: 'app-team-active',
-        title: t('views.team.title'),
+        title: 'views.team.title',
         activeMenu: '/setting',
         parentPath: '/setting',
         parentName: 'setting'
@@ -47,7 +46,7 @@ const settingRouter = {
       meta: {
         icon: 'app-template',
         iconActive: 'app-template-active',
-        title: t('views.template.title'),
+        title: 'views.template.title',
         activeMenu: '/setting',
         parentPath: '/setting',
         parentName: 'setting'
@@ -60,7 +59,7 @@ const settingRouter = {
       meta: {
         icon: 'app-setting',
         iconActive: 'app-setting-active',
-        title: t('common.setting'),
+        title: 'common.setting',
         activeMenu: '/setting',
         parentPath: '/setting',
         parentName: 'setting',
@@ -71,7 +70,7 @@ const settingRouter = {
           path: '/system/theme',
           name: 'theme',
           meta: {
-            title: t('views.system.theme.title'),
+            title: 'views.system.theme.title',
             activeMenu: '/setting',
             parentPath: '/setting',
             parentName: 'setting',
@@ -83,7 +82,7 @@ const settingRouter = {
           path: '/system/authentication',
           name: 'authentication',
           meta: {
-            title: t('views.system.authentication.title'),
+            title: 'views.system.authentication.title',
             activeMenu: '/setting',
             parentPath: '/setting',
             parentName: 'setting',
@@ -95,7 +94,7 @@ const settingRouter = {
           path: '/system/email',
           name: 'email',
           meta: {
-            title: t('views.system.email.title'),
+            title: 'views.system.email.title',
             activeMenu: '/setting',
             parentPath: '/setting',
             parentName: 'setting',