From 8e449436bdecb2a854bb179e7effc94cab2ec7c9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=80=E7=BA=B8=E5=BF=98=E5=BF=A7?= <i@ikxin.com>
Date: Tue, 28 May 2024 16:52:19 +0800
Subject: [PATCH] refactor: international language file structure

---
 src/components/custom-footer.vue      | 12 +++--
 src/components/custom-header.vue      | 35 ++++++++++-----
 src/locales/en.json                   | 48 ++++++++++++++++++++
 src/locales/en/activate.ts            | 42 ------------------
 src/locales/en/main.ts                | 17 -------
 src/locales/en/tools.ts               | 22 ---------
 src/locales/index.ts                  | 14 ------
 src/locales/zh-cn.json                | 48 ++++++++++++++++++++
 src/main.ts                           |  4 +-
 src/views/activate.vue                | 24 +++++++---
 src/views/activate/office.vue         | 64 ++++++++++++++++++---------
 src/views/activate/windows-server.vue | 58 +++++++++++++++++-------
 src/views/activate/windows.vue        | 58 +++++++++++++++++-------
 src/views/tools.vue                   | 42 ++++++++++++------
 vite.config.ts                        | 12 ++++-
 15 files changed, 313 insertions(+), 187 deletions(-)
 create mode 100644 src/locales/en.json
 delete mode 100644 src/locales/en/activate.ts
 delete mode 100644 src/locales/en/main.ts
 delete mode 100644 src/locales/en/tools.ts
 delete mode 100644 src/locales/index.ts
 create mode 100644 src/locales/zh-cn.json

diff --git a/src/components/custom-footer.vue b/src/components/custom-footer.vue
index da9c1e09..288e5a0e 100644
--- a/src/components/custom-footer.vue
+++ b/src/components/custom-footer.vue
@@ -8,15 +8,21 @@ const { t } = useI18n()
 
 <template>
   <ALayoutFooter class="bg-[--color-bg-2] px-2">
-    <div class="mx-auto flex h-14 w-256 max-w-full whitespace-nowrap flex items-center justify-center">
+    <div
+      class="mx-auto flex h-14 w-256 max-w-full whitespace-nowrap flex items-center justify-center"
+    >
       <ASpace>
         <div>
           Copyright &copy; {{ currentYear }}
-          <ALink target="_blank" href="https://github.com/ikxin/kms-tools"> KMS Tools </ALink>
+          <ALink target="_blank" href="https://github.com/ikxin/kms-tools">
+            KMS Tools
+          </ALink>
         </div>
         <div>
           Code with by
-          <ALink target="_blank" href="https://www.ikxin.com">{{ t('main.author') }}</ALink>
+          <ALink target="_blank" href="https://www.ikxin.com">
+            {{ t('name.author') }}
+          </ALink>
         </div>
       </ASpace>
     </div>
diff --git a/src/components/custom-header.vue b/src/components/custom-header.vue
index dd044479..d0c08754 100644
--- a/src/components/custom-header.vue
+++ b/src/components/custom-header.vue
@@ -8,17 +8,17 @@ const appStore = useAppStore()
 const navItems = computed(() => [
   {
     name: 'activate',
-    label: t('main.module.activate'),
+    label: t('label.activate'),
     icon: 'i-icons:activate',
   },
   {
     name: 'tools',
-    label: t('main.module.tools'),
+    label: t('label.check'),
     icon: 'i-icons:tools',
   },
   {
     name: 'monitor',
-    label: t('main.module.monitor'),
+    label: t('label.monitor'),
     icon: 'i-icons:monitor',
   },
 ])
@@ -36,17 +36,17 @@ const navSelected = ref([!pathName?.[0] ? 'home' : pathName?.[0]])
 
 const themeItems = computed(() => [
   {
-    lable: t('main.theme.light'),
+    lable: t('label.light-theme'),
     value: 'light',
     icon: 'i-icons:light-mode',
   },
   {
-    lable: t('main.theme.dark'),
+    lable: t('label.dark-theme'),
     value: 'dark',
     icon: 'i-icons:dark-mode',
   },
   {
-    lable: t('main.theme.auto'),
+    lable: t('label.auto-theme'),
     value: 'auto',
     icon: 'i-icons:auto-mode',
   },
@@ -60,13 +60,13 @@ const themeChange = val => (appStore.theme = val)
 
 const languagesItems = computed(() => [
   {
-    lable: t('main.languages.zhCn'),
+    lable: t('label.zh-cn'),
     value: 'zh-cn',
     icon: 'i-languages:zh',
   },
   {
-    lable: t('main.languages.en'),
-    value: 'en-us',
+    lable: t('label.en'),
+    value: 'en',
     icon: 'i-languages:en',
   },
 ])
@@ -77,7 +77,10 @@ const languagesChange = val => (appStore.languages = val)
 <template>
   <ALayoutHeader class="select-none bg-[--color-bg-2] px-2 shadow-md">
     <div class="mx-auto flex w-256 max-w-full items-center justify-between">
-      <div class="i-icons:kms-tools w-48 h-12 cursor-pointer" @click="redirectPage('home')"></div>
+      <div
+        class="i-icons:kms-tools w-48 h-12 cursor-pointer"
+        @click="redirectPage('home')"
+      ></div>
       <AMenu
         v-model:selected-keys="navSelected"
         mode="horizontal"
@@ -99,7 +102,11 @@ const languagesChange = val => (appStore.languages = val)
             <template #icon><i :class="themeIcon" /></template>
           </AButton>
           <template #content>
-            <ADoption v-for="item in themeItems" :key="item.value" @click="themeChange(item.value)">
+            <ADoption
+              v-for="item in themeItems"
+              :key="item.value"
+              @click="themeChange(item.value)"
+            >
               <template #icon><i :class="item.icon" /></template>
               <template #default>{{ item.lable }}</template>
             </ADoption>
@@ -110,7 +117,11 @@ const languagesChange = val => (appStore.languages = val)
             <template #icon><i class="i-icons:languages" /></template>
           </AButton>
           <template #content>
-            <ADoption v-for="item in languagesItems" :key="item.value" @click="languagesChange(item.value)">
+            <ADoption
+              v-for="item in languagesItems"
+              :key="item.value"
+              @click="languagesChange(item.value)"
+            >
               <template #icon><i :class="item.icon" /></template>
               <template #default>{{ item.lable }}</template>
             </ADoption>
diff --git a/src/locales/en.json b/src/locales/en.json
new file mode 100644
index 00000000..158f10fe
--- /dev/null
+++ b/src/locales/en.json
@@ -0,0 +1,48 @@
+{
+  "label": {
+    "activate": "Activate",
+    "check": "Check",
+    "monitor": "Monitor",
+    "auto-theme": "System",
+    "light-theme": "Light",
+    "dark-theme": "Dark",
+    "zh-cn": "Simplified Chinese",
+    "zh-tw": "Traditional Chinese",
+    "en": "English",
+    "operating-system": "Operating System",
+    "software": "Software",
+    "edition": "Edition",
+    "cpuarch": "CPU Arch",
+    "license": "License Key",
+    "product": "Product",
+    "service": "KMS Server",
+    "version": "Version",
+    "x64": "x64",
+    "x86": "x86",
+    "domain": "Domain",
+    "port": "Port",
+    "protocol": "Protocol"
+  },
+  "name": {
+    "author": "ikxin"
+  },
+  "placeholder": {
+    "domain": "Please input domain",
+    "port": "Please input port",
+    "protocol": "Please select protocol",
+    "software": "Please select software",
+    "edition": "Please select edition",
+    "product": "Please select product",
+    "service": "Please select kms server",
+    "version": "Please select version"
+  },
+  "button": {
+    "copy-script": "Copy Script",
+    "generate-script": "Generate Script",
+    "download-script": "Download Script",
+    "submit": "Submit"
+  },
+  "title": {
+    "kms-check": "KMS Server Check"
+  }
+}
diff --git a/src/locales/en/activate.ts b/src/locales/en/activate.ts
deleted file mode 100644
index 1c181b86..00000000
--- a/src/locales/en/activate.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-export default {
-  button: {
-    copy: 'Copy Script',
-    create: 'Create Script',
-    download: 'Download Script',
-  },
-  form: {
-    label: {
-      edition: 'Edition',
-      cpuarch: 'CPU Arch',
-      license: 'License Key',
-      product: 'Product',
-      service: 'KMS Server',
-      version: 'Version',
-    },
-    placeholder: {
-      edition: 'Please select edition',
-      product: 'Please select product',
-      service: 'Please select kms server',
-      version: 'Please select version',
-    },
-  },
-  message: {
-    error: 'Copy Failed',
-    success: 'Copy Success',
-  },
-  radio: {
-    x64: 'x64',
-    x86: 'x86',
-  },
-  sider: {
-    system: 'System',
-    software: 'Software',
-  },
-  table: {
-    columns: {
-      edition: 'Edition',
-      license: 'License Key',
-      product: 'Product',
-    },
-  },
-}
diff --git a/src/locales/en/main.ts b/src/locales/en/main.ts
deleted file mode 100644
index c5ff1ff9..00000000
--- a/src/locales/en/main.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-export default {
-  author: 'ikxin',
-  module: {
-    activate: 'Activate',
-    monitor: 'Monitor',
-    tools: 'Tools',
-  },
-  theme: {
-    auto: 'Auto Mode',
-    dark: 'Dark Mode',
-    light: 'Light Mode',
-  },
-  languages: {
-    en: 'English',
-    zhCn: 'Simplified Chinese',
-  },
-}
diff --git a/src/locales/en/tools.ts b/src/locales/en/tools.ts
deleted file mode 100644
index 362fee5d..00000000
--- a/src/locales/en/tools.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-export default {
-  button: {
-    submit: 'Submit',
-  },
-  card: {
-    title: 'KMS Server Check',
-  },
-  form: {
-    label: {
-      domain: 'Domain',
-      port: 'Port',
-      protocol: 'Protocol',
-      software: 'Software',
-    },
-    placeholder: {
-      domain: 'Please input domain',
-      port: 'Please input port',
-      protocol: 'Please select protocol',
-      software: 'Please select software',
-    },
-  },
-}
diff --git a/src/locales/index.ts b/src/locales/index.ts
deleted file mode 100644
index b1351898..00000000
--- a/src/locales/index.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-const locales = import.meta.glob('./en/*.ts', {
-  import: 'default',
-  eager: true,
-})
-
-const languages = {}
-
-for (const locale in locales) {
-  const [language, fileName] = locale.split('/').slice(1)
-  if (!languages[language]) languages[language] = {}
-  languages[language][fileName.split('.')[0]] = locales[locale]
-}
-
-export default languages
diff --git a/src/locales/zh-cn.json b/src/locales/zh-cn.json
new file mode 100644
index 00000000..f62ac7e6
--- /dev/null
+++ b/src/locales/zh-cn.json
@@ -0,0 +1,48 @@
+{
+  "label": {
+    "activate": "激活",
+    "check": "检测",
+    "monitor": "监控",
+    "auto-theme": "跟随系统",
+    "light-theme": "浅色模式",
+    "dark-theme": "深色模式",
+    "zh-cn": "简体中文",
+    "zh-tw": "繁体中文",
+    "en": "英语",
+    "operating-system": "操作系统",
+    "software": "软件",
+    "edition": "发行版本",
+    "cpuarch": "CPU 架构",
+    "license": "许可证",
+    "product": "产品",
+    "service": "KMS 服务器",
+    "version": "系统版本",
+    "x64": "64 位",
+    "x86": "32 位",
+    "domain": "域名",
+    "port": "端口",
+    "protocol": "协议"
+  },
+  "name": {
+    "author": "一纸忘忧"
+  },
+  "placeholder": {
+    "domain": "请输入域名",
+    "port": "请输入端口",
+    "protocol": "请选择协议",
+    "software": "请选择软件",
+    "edition": "请选择版本",
+    "product": "请选择产品",
+    "service": "请选择 kms 服务器",
+    "version": "请选择版本"
+  },
+  "button": {
+    "copy-script": "复制脚本",
+    "generate-script": "生成脚本",
+    "download-script": "下载脚本",
+    "submit": "提交"
+  },
+  "title": {
+    "kms-check": "KMS 服务器检测"
+  }
+}
diff --git a/src/main.ts b/src/main.ts
index f9f43182..e941a258 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,7 @@
 import App from '@/App.vue'
 import { router } from '@/router'
 import { createI18n } from 'vue-i18n'
-import messages from '@/locales'
+import messages from '@intlify/unplugin-vue-i18n/messages'
 import { useMonitorStore } from '@/store/monitor'
 
 import '@/styles/custom.less'
@@ -10,7 +10,7 @@ import '@/styles/style.css'
 
 const app = createApp(App)
 const pinia = createPinia()
-const i18n = createI18n({ locale: 'en', messages })
+const i18n = createI18n({ locale: 'zh-cn', messages })
 
 app.use(pinia)
 app.use(router)
diff --git a/src/views/activate.vue b/src/views/activate.vue
index b7f3df75..08fe0abb 100644
--- a/src/views/activate.vue
+++ b/src/views/activate.vue
@@ -9,7 +9,10 @@ const selectedKeys = ref(pathName)
 </script>
 
 <template>
-  <ALayoutSider :width="240" class="[&>.arco-layout-sider-children]:rounded rounded">
+  <ALayoutSider
+    :width="240"
+    class="[&>.arco-layout-sider-children]:rounded rounded"
+  >
     <AMenu
       v-model:selected-keys="selectedKeys"
       :default-open-keys="['system', 'software']"
@@ -18,20 +21,29 @@ const selectedKeys = ref(pathName)
     >
       <ASubMenu key="system">
         <template #icon><i class="i-icons:system text-base" /></template>
-        <template #title>{{ t('activate.sider.system') }}</template>
-        <AMenuItem key="windows" @click="router.push({ path: '/activate/windows' })">
+        <template #title>{{ t('label.operating-system') }}</template>
+        <AMenuItem
+          key="windows"
+          @click="router.push({ path: '/activate/windows' })"
+        >
           <template #icon><i class="i-icons:windows" /></template>
           <span>Windows</span>
         </AMenuItem>
-        <AMenuItem key="windows-server" @click="router.push({ path: '/activate/windows-server' })">
+        <AMenuItem
+          key="windows-server"
+          @click="router.push({ path: '/activate/windows-server' })"
+        >
           <template #icon><i class="i-icons:windows-server" /></template>
           <span>Windows Server</span>
         </AMenuItem>
       </ASubMenu>
       <ASubMenu key="software">
         <template #icon><i class="i-icons:software text-base" /></template>
-        <template #title>{{ t('activate.sider.software') }}</template>
-        <AMenuItem key="office" @click="router.push({ path: '/activate/office' })">
+        <template #title>{{ t('label.software') }}</template>
+        <AMenuItem
+          key="office"
+          @click="router.push({ path: '/activate/office' })"
+        >
           <template #icon><i class="i-icons:office" /></template>
           <span>Office</span>
         </AMenuItem>
diff --git a/src/views/activate/office.vue b/src/views/activate/office.vue
index 156cb539..38bae460 100644
--- a/src/views/activate/office.vue
+++ b/src/views/activate/office.vue
@@ -19,15 +19,15 @@ const formRules = computed((): Record<string, FieldRule | FieldRule[]> => {
   return {
     version: {
       required: true,
-      message: t('activate.form.placeholder.version'),
+      message: t('placeholder.version'),
     },
     product: {
       required: true,
-      message: t('activate.form.placeholder.product'),
+      message: t('placeholder.product'),
     },
     service: {
       required: true,
-      message: t('activate.form.placeholder.service'),
+      message: t('placeholder.service'),
     },
   }
 })
@@ -58,8 +58,8 @@ const tableData = computed(() => {
 
 const tableColumns = computed(
   (): Array<TableColumnData> => [
-    { title: t('activate.table.columns.product'), dataIndex: 'product' },
-    { title: t('activate.table.columns.license'), dataIndex: 'license' },
+    { title: t('label.product'), dataIndex: 'product' },
+    { title: t('label.license'), dataIndex: 'license' },
   ],
 )
 
@@ -74,16 +74,34 @@ const copyScript = () => useScriptCopy(activateScript.value)
   <div class="flex flex-col gap-4">
     <ACard>
       <template #title>
-        <div class="flex items-center gap-2"><i class="i-icons:office" />Office</div>
+        <div class="flex items-center gap-2">
+          <i class="i-icons:office" />Office
+        </div>
       </template>
-      <AForm :model="formData" :rules="formRules" @submit="handleSubmit" auto-label-width>
-        <AFormItem :label="t('activate.form.label.version')" field="version">
-          <ASelect v-model="formData.version" :placeholder="t('activate.form.placeholder.version')">
-            <AOption v-for="(item, key) in gvlks" :key="key" :label="item.version" :value="key" />
+      <AForm
+        :model="formData"
+        :rules="formRules"
+        @submit="handleSubmit"
+        auto-label-width
+      >
+        <AFormItem :label="t('label.version')" field="version">
+          <ASelect
+            v-model="formData.version"
+            :placeholder="t('placeholder.version')"
+          >
+            <AOption
+              v-for="(item, key) in gvlks"
+              :key="key"
+              :label="item.version"
+              :value="key"
+            />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.product')" field="product">
-          <ASelect v-model="formData.product" :placeholder="t('activate.form.placeholder.product')">
+        <AFormItem :label="t('label.product')" field="product">
+          <ASelect
+            v-model="formData.product"
+            :placeholder="t('placeholder.product')"
+          >
             <AOption
               v-for="(item, index) in gvlks[formData.version]?.product"
               :key="index"
@@ -92,24 +110,30 @@ const copyScript = () => useScriptCopy(activateScript.value)
             />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.cpuarch')" field="cpuarch">
+        <AFormItem :label="t('label.cpuarch')" field="cpuarch">
           <ARadioGroup v-model="formData.cpuarch" type="button">
-            <ARadio :value="false">{{ t('activate.radio.x86') }}</ARadio>
-            <ARadio :value="true">{{ t('activate.radio.x64') }}</ARadio>
+            <ARadio :value="false">{{ t('label.x86') }}</ARadio>
+            <ARadio :value="true">{{ t('label.x64') }}</ARadio>
           </ARadioGroup>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.service')" field="service">
+        <AFormItem :label="t('label.service')" field="service">
           <AInput v-model="formData.service" />
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.license')" field="license">
+        <AFormItem :label="t('label.license')" field="license">
           <AInput v-model="formData.license" disabled />
         </AFormItem>
         <AFormItem>
           <ASpace size="small">
-            <AButton html-type="submit" type="primary">{{ t('activate.button.create') }}</AButton>
+            <AButton html-type="submit" type="primary">
+              {{ t('button.generate-script') }}
+            </AButton>
             <template v-if="activateScriptVisible">
-              <AButton @click="downloadScript">{{ t('activate.button.download') }}</AButton>
-              <AButton @click="copyScript">{{ t('activate.button.copy') }}</AButton>
+              <AButton @click="downloadScript">
+                {{ t('button.download-script') }}
+              </AButton>
+              <AButton @click="copyScript">
+                {{ t('button.copy-script') }}
+              </AButton>
             </template>
           </ASpace>
         </AFormItem>
diff --git a/src/views/activate/windows-server.vue b/src/views/activate/windows-server.vue
index 34693cf6..a4b2543f 100644
--- a/src/views/activate/windows-server.vue
+++ b/src/views/activate/windows-server.vue
@@ -18,15 +18,15 @@ const formRules = computed((): Record<string, FieldRule | FieldRule[]> => {
   return {
     version: {
       required: true,
-      message: t('activate.form.placeholder.version'),
+      message: t('placeholder.version'),
     },
     edition: {
       required: true,
-      message: t('activate.form.placeholder.edition'),
+      message: t('placeholder.edition'),
     },
     service: {
       required: true,
-      message: t('activate.form.placeholder.service'),
+      message: t('placeholder.service'),
     },
   }
 })
@@ -52,8 +52,8 @@ const tableData = computed(() => {
 
 const tableColumns = computed(
   (): Array<TableColumnData> => [
-    { title: t('activate.table.columns.edition'), dataIndex: 'edition' },
-    { title: t('activate.table.columns.license'), dataIndex: 'license' },
+    { title: t('label.edition'), dataIndex: 'edition' },
+    { title: t('label.license'), dataIndex: 'license' },
   ],
 )
 
@@ -68,16 +68,34 @@ const copyScript = () => useScriptCopy(activateScript.value)
   <div class="flex flex-col gap-4">
     <ACard>
       <template #title>
-        <div class="flex items-center gap-2"><i class="i-icons:windows-server" />Windows Server</div>
+        <div class="flex items-center gap-2">
+          <i class="i-icons:windows-server" />Windows Server
+        </div>
       </template>
-      <AForm :model="formData" :rules="formRules" @submit="handleSubmit" auto-label-width>
-        <AFormItem :label="t('activate.form.label.version')" field="version">
-          <ASelect v-model="formData.version" :placeholder="t('activate.form.placeholder.version')">
-            <AOption v-for="(item, key) in gvlks" :key="key" :label="item.version" :value="key" />
+      <AForm
+        :model="formData"
+        :rules="formRules"
+        @submit="handleSubmit"
+        auto-label-width
+      >
+        <AFormItem :label="t('label.version')" field="version">
+          <ASelect
+            v-model="formData.version"
+            :placeholder="t('placeholder.version')"
+          >
+            <AOption
+              v-for="(item, key) in gvlks"
+              :key="key"
+              :label="item.version"
+              :value="key"
+            />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.edition')" field="edition">
-          <ASelect v-model="formData.edition" :placeholder="t('activate.form.placeholder.edition')">
+        <AFormItem :label="t('label.edition')" field="edition">
+          <ASelect
+            v-model="formData.edition"
+            :placeholder="t('placeholder.edition')"
+          >
             <AOption
               v-for="(item, index) in gvlks[formData.version]?.edition"
               :key="index"
@@ -86,18 +104,24 @@ const copyScript = () => useScriptCopy(activateScript.value)
             />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.service')" field="service">
+        <AFormItem :label="t('label.service')" field="service">
           <AInput v-model="formData.service" />
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.license')" field="license">
+        <AFormItem :label="t('label.license')" field="license">
           <AInput v-model="formData.license" disabled />
         </AFormItem>
         <AFormItem>
           <ASpace size="small">
-            <AButton html-type="submit" type="primary">{{ t('activate.button.create') }}</AButton>
+            <AButton html-type="submit" type="primary">
+              {{ t('button.generate-script') }}
+            </AButton>
             <template v-if="activateScriptVisible">
-              <AButton @click="downloadScript">{{ t('activate.button.download') }}</AButton>
-              <AButton @click="copyScript">{{ t('activate.button.copy') }}</AButton>
+              <AButton @click="downloadScript">
+                {{ t('button.download-script') }}
+              </AButton>
+              <AButton @click="copyScript">
+                {{ t('button.copy-script') }}
+              </AButton>
             </template>
           </ASpace>
         </AFormItem>
diff --git a/src/views/activate/windows.vue b/src/views/activate/windows.vue
index 1c46c343..9cb0a5ca 100644
--- a/src/views/activate/windows.vue
+++ b/src/views/activate/windows.vue
@@ -18,15 +18,15 @@ const formRules = computed((): Record<string, FieldRule | FieldRule[]> => {
   return {
     version: {
       required: true,
-      message: t('activate.form.placeholder.version'),
+      message: t('placeholder.version'),
     },
     edition: {
       required: true,
-      message: t('activate.form.placeholder.edition'),
+      message: t('placeholder.edition'),
     },
     service: {
       required: true,
-      message: t('activate.form.placeholder.service'),
+      message: t('placeholder.service'),
     },
   }
 })
@@ -52,8 +52,8 @@ const tableData = computed(() => {
 
 const tableColumns = computed(
   (): Array<TableColumnData> => [
-    { title: t('activate.table.columns.edition'), dataIndex: 'edition' },
-    { title: t('activate.table.columns.license'), dataIndex: 'license' },
+    { title: t('label.edition'), dataIndex: 'edition' },
+    { title: t('label.license'), dataIndex: 'license' },
   ],
 )
 
@@ -68,16 +68,34 @@ const copyScript = () => useScriptCopy(activateScript.value)
   <div class="flex flex-col gap-4">
     <ACard>
       <template #title>
-        <div class="flex items-center gap-2"><i class="i-icons:windows" />Windows</div>
+        <div class="flex items-center gap-2">
+          <i class="i-icons:windows" />Windows
+        </div>
       </template>
-      <AForm :model="formData" :rules="formRules" @submit="handleSubmit" auto-label-width>
-        <AFormItem :label="t('activate.form.label.version')" field="version">
-          <ASelect v-model="formData.version" :placeholder="t('activate.form.placeholder.version')">
-            <AOption v-for="(item, key) in gvlks" :key="key" :label="item.version" :value="key" />
+      <AForm
+        :model="formData"
+        :rules="formRules"
+        @submit="handleSubmit"
+        auto-label-width
+      >
+        <AFormItem :label="t('label.version')" field="version">
+          <ASelect
+            v-model="formData.version"
+            :placeholder="t('placeholder.version')"
+          >
+            <AOption
+              v-for="(item, key) in gvlks"
+              :key="key"
+              :label="item.version"
+              :value="key"
+            />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.edition')" field="edition">
-          <ASelect v-model="formData.edition" :placeholder="t('activate.form.placeholder.edition')">
+        <AFormItem :label="t('label.edition')" field="edition">
+          <ASelect
+            v-model="formData.edition"
+            :placeholder="t('placeholder.edition')"
+          >
             <AOption
               v-for="(item, index) in gvlks[formData.version]?.edition"
               :key="index"
@@ -86,18 +104,24 @@ const copyScript = () => useScriptCopy(activateScript.value)
             />
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.service')" field="service">
+        <AFormItem :label="t('label.service')" field="service">
           <AInput v-model="formData.service" />
         </AFormItem>
-        <AFormItem :label="t('activate.form.label.license')" field="license">
+        <AFormItem :label="t('label.license')" field="license">
           <AInput v-model="formData.license" disabled />
         </AFormItem>
         <AFormItem>
           <ASpace size="small">
-            <AButton html-type="submit" type="primary">{{ t('activate.button.create') }}</AButton>
+            <AButton html-type="submit" type="primary">
+              {{ t('button.generate-script') }}
+            </AButton>
             <template v-if="activateScriptVisible">
-              <AButton @click="downloadScript">{{ t('activate.button.download') }}</AButton>
-              <AButton @click="copyScript">{{ t('activate.button.copy') }}</AButton>
+              <AButton @click="downloadScript">
+                {{ t('button.download-script') }}
+              </AButton>
+              <AButton @click="copyScript">
+                {{ t('button.copy-script') }}
+              </AButton>
             </template>
           </ASpace>
         </AFormItem>
diff --git a/src/views/tools.vue b/src/views/tools.vue
index 7b499f4b..97ba5b97 100644
--- a/src/views/tools.vue
+++ b/src/views/tools.vue
@@ -16,19 +16,19 @@ const formRules = computed((): Record<string, FieldRule | FieldRule[]> => {
   return {
     domain: {
       required: true,
-      message: t('tools.form.placeholder.domain'),
+      message: t('placeholder.domain'),
     },
     port: {
       required: true,
-      message: t('tools.form.placeholder.port'),
+      message: t('placeholder.port'),
     },
     protocol: {
       required: true,
-      message: t('tools.form.placeholder.protocol'),
+      message: t('placeholder.protocol'),
     },
     software: {
       required: true,
-      message: t('tools.form.placeholder.software'),
+      message: t('placeholder.software'),
     },
   }
 })
@@ -68,33 +68,49 @@ const handleSubmit = async data => {
 <template>
   <ACard class="h-full">
     <template #title>
-      <div class="flex items-center gap-2"><i class="i-icons:check" />{{ t('tools.card.title') }}</div>
+      <div class="flex items-center gap-2">
+        <i class="i-icons:check" />{{ t('title.kms-check') }}
+      </div>
     </template>
     <ASpin :loading="resultInfo.loading" dot class="w-full">
-      <AForm :model="formData" :rules="formRules" @submit="handleSubmit" auto-label-width>
-        <AFormItem :label="t('tools.form.label.domain')" field="domain">
+      <AForm
+        :model="formData"
+        :rules="formRules"
+        @submit="handleSubmit"
+        auto-label-width
+      >
+        <AFormItem :label="t('label.domain')" field="domain">
           <AInput v-model="formData.domain"></AInput>
         </AFormItem>
-        <AFormItem :label="t('tools.form.label.port')" field="port">
+        <AFormItem :label="t('label.port')" field="port">
           <AInput v-model="formData.port"></AInput>
         </AFormItem>
-        <AFormItem :label="t('tools.form.label.protocol')" field="protocol">
+        <AFormItem :label="t('label.protocol')" field="protocol">
           <ASelect v-model="formData.protocol">
             <AOption value="6">V6 Protocol</AOption>
             <AOption value="5">V5 Protocol</AOption>
             <AOption value="4">V4 Protocol</AOption>
           </ASelect>
         </AFormItem>
-        <AFormItem :label="t('tools.form.label.software')" field="software">
+        <AFormItem :label="t('label.software')" field="software">
           <ASelect v-model="formData.software">
-            <AOption v-for="(value, key) in appItems" :key="key" :value="key">{{ value }}</AOption>
+            <AOption v-for="(value, key) in appItems" :key="key" :value="key">{{
+              value
+            }}</AOption>
           </ASelect>
         </AFormItem>
         <AFormItem>
-          <AButton html-type="submit" type="primary">{{ t('tools.button.submit') }}</AButton>
+          <AButton html-type="submit" type="primary">{{
+            t('button.submit')
+          }}</AButton>
         </AFormItem>
       </AForm>
-      <AAlert v-show="resultInfo.visible" :type="resultInfo.type" :title="resultInfo.type" class="whitespace-pre">
+      <AAlert
+        v-show="resultInfo.visible"
+        :type="resultInfo.type"
+        :title="resultInfo.type"
+        class="whitespace-pre"
+      >
         {{ resultInfo.message }}
       </AAlert>
     </ASpin>
diff --git a/vite.config.ts b/vite.config.ts
index a79ee78e..5fbd6d62 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -34,7 +34,13 @@ export default defineConfig({
         filepath: './src/typings/.eslintrc.json',
       },
       dts: './src/typings/imports.d.ts',
-      imports: ['@vueuse/core', 'pinia', 'vue-i18n', 'vue', VueRouterAutoImports],
+      imports: [
+        '@vueuse/core',
+        'pinia',
+        'vue-i18n',
+        'vue',
+        VueRouterAutoImports,
+      ],
       resolvers: [ArcoResolver()],
     }),
     Components({
@@ -45,7 +51,9 @@ export default defineConfig({
         }),
       ],
     }),
-    VueI18nPlugin({}),
+    VueI18nPlugin({
+      include: [resolve(__dirname, './src/locales/**')],
+    }),
     VueDevTools(),
   ],
   resolve: {