From dcd4dd095a2ec17ccf6c6aabfafcfa0190e077f0 Mon Sep 17 00:00:00 2001
From: unitwk <unitwk@outlook.com>
Date: Mon, 8 Jan 2024 11:29:21 +0800
Subject: [PATCH 1/2] Fix: Lazy bug

---
 frontend/src/widgets/Settings.vue        | 4 ++--
 panel/src/app/service/frontend_layout.ts | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/widgets/Settings.vue b/frontend/src/widgets/Settings.vue
index 85bf7772..26c7df09 100644
--- a/frontend/src/widgets/Settings.vue
+++ b/frontend/src/widgets/Settings.vue
@@ -208,7 +208,7 @@ onMounted(async () => {
             </div>
           </template>
 
-          <template #api>
+          <template #security>
             <div :style="{ maxHeight: card.height, overflowY: 'auto' }">
               <a-typography-title :level="4" class="mb-24">
                 {{ t("TXT_CODE_9c3ca8f") }}
@@ -299,7 +299,7 @@ onMounted(async () => {
             </div>
           </template>
 
-          <template #password>
+          <template #about>
             <div :style="{ maxHeight: card.height, overflowY: 'auto' }">
               <a-typography-title :level="4" class="mb-24">
                 {{ t("TXT_CODE_3b4b656d") }}
diff --git a/panel/src/app/service/frontend_layout.ts b/panel/src/app/service/frontend_layout.ts
index 45d4f561..0ec5141c 100644
--- a/panel/src/app/service/frontend_layout.ts
+++ b/panel/src/app/service/frontend_layout.ts
@@ -354,7 +354,7 @@ function getDefaultFrontendLayoutConfig(): IPageLayoutConfig[] {
           type: "Settings",
           title: t("TXT_CODE_3fe97dcc"),
           width: 8,
-          height: LayoutCardHeight.MEDIUM,
+          height: LayoutCardHeight.LARGE,
           disableDelete: true
         }
       ]

From 169e57968dedcc06a2e755ec4f7fc5e8694a653f Mon Sep 17 00:00:00 2001
From: unitwk <unitwk@outlook.com>
Date: Tue, 9 Jan 2024 10:32:00 +0800
Subject: [PATCH 2/2] Feat: i18n text

---
 frontend/src/components/CopyButton.vue        |  2 +-
 .../src/components/fc/UploadFileDialog.vue    |  4 ++--
 frontend/src/config/index.ts                  |  4 ++--
 frontend/src/tools/nodes.ts                   |  2 +-
 frontend/src/tools/validator.ts               |  2 +-
 frontend/src/widgets/InstanceList.vue         |  2 +-
 frontend/src/widgets/LoginCard.vue            |  4 ++--
 frontend/src/widgets/instance/BaseInfo.vue    |  8 +++----
 .../widgets/instance/dialogs/DockerInfo.vue   | 16 +++++++-------
 frontend/src/widgets/node/NodeItem.vue        |  2 +-
 frontend/src/widgets/others/PluginCard.vue    |  8 +++----
 languages/en_US.json                          | 22 ++++++++++++++++++-
 languages/zh_CN.json                          | 22 ++++++++++++++++++-
 panel/src/app/service/frontend_layout.ts      |  2 +-
 14 files changed, 70 insertions(+), 30 deletions(-)

diff --git a/frontend/src/components/CopyButton.vue b/frontend/src/components/CopyButton.vue
index f9a7b6e7..9703ff27 100644
--- a/frontend/src/components/CopyButton.vue
+++ b/frontend/src/components/CopyButton.vue
@@ -17,7 +17,7 @@ const copy = async () => {
   if (!navigator.clipboard) {
     Modal.warning({
       title: t("TXT_CODE_ca07c84c"),
-      content: [h("span", t("请手动复制以下内容")), h("br"), h("span", props.value)]
+      content: [h("span", t("TXT_CODE_2452016e")), h("br"), h("span", props.value)]
     });
     return;
   }
diff --git a/frontend/src/components/fc/UploadFileDialog.vue b/frontend/src/components/fc/UploadFileDialog.vue
index 45d2013e..e38631ba 100644
--- a/frontend/src/components/fc/UploadFileDialog.vue
+++ b/frontend/src/components/fc/UploadFileDialog.vue
@@ -70,7 +70,7 @@ onMounted(() => {
 <template>
   <a-modal
     v-model:open="open"
-    :title="t('上传文件')"
+    :title="t('TXT_CODE_e00c858c')"
     :closable="false"
     :destroy-on-close="true"
     width="400px"
@@ -85,7 +85,7 @@ onMounted(() => {
       >
         <a-button type="primary" :loading="percentComplete > 0">
           <FolderOpenOutlined v-if="percentComplete === 0" />
-          {{ percentComplete > 0 ? t("TXT_CODE_b625dbf0") + percentComplete + "%" : t("选择文件") }}
+          {{ percentComplete > 0 ? t("TXT_CODE_b625dbf0") + percentComplete + "%" : t("TXT_CODE_335ba209") }}
         </a-button>
       </a-upload>
       <a-button class="ml-16" @click="cancel">{{ t("TXT_CODE_a0451c97") }}</a-button>
diff --git a/frontend/src/config/index.ts b/frontend/src/config/index.ts
index be007d20..d3066986 100644
--- a/frontend/src/config/index.ts
+++ b/frontend/src/config/index.ts
@@ -479,10 +479,10 @@ export function getLayoutCardPool() {
       permission: ROLE.GUEST,
       meta: {},
       type: "PluginCard",
-      title: t("扩展页面卡片"),
+      title: t("TXT_CODE_5ebec0db"),
       width: 4,
       description: t(
-        "此卡片可以上传自定义 HTML 页面并直接执行 Javascript 脚本，可以直接使用网页上所有元素，适用于 Web 前端开发人员。"
+        "TXT_CODE_cb84b22"
       ),
       height: LayoutCardHeight.SMALL,
       category: NEW_CARD_TYPE.COMMON
diff --git a/frontend/src/tools/nodes.ts b/frontend/src/tools/nodes.ts
index 4f0bd25c..67342485 100644
--- a/frontend/src/tools/nodes.ts
+++ b/frontend/src/tools/nodes.ts
@@ -1,7 +1,7 @@
 import { t } from "@/lang/i18n";
 
 export function computeNodeName(ip: string, available: boolean, remark?: string) {
-  if (!ip) return t("请选择节点");
+  if (!ip) return t("TXT_CODE_aa373641");
   const online = available ? "" : t("TXT_CODE_836addb9");
   return remark ? `${remark} - ${ip} ${online}` : `${ip} ${online}`;
 }
diff --git a/frontend/src/tools/validator.ts b/frontend/src/tools/validator.ts
index 3359e799..837f0fd3 100644
--- a/frontend/src/tools/validator.ts
+++ b/frontend/src/tools/validator.ts
@@ -7,7 +7,7 @@ export function emptyValueValidator(value: string | number) {
 }
 
 export function isNumberValidator(value: any) {
-  if (!value || isNaN(Number(value))) throw new Error(t("字段必须是数字"));
+  if (!value || isNaN(Number(value))) throw new Error(t("TXT_CODE_a9bcbde9"));
   return Promise.resolve();
 }
 
diff --git a/frontend/src/widgets/InstanceList.vue b/frontend/src/widgets/InstanceList.vue
index b18a1695..0207987d 100644
--- a/frontend/src/widgets/InstanceList.vue
+++ b/frontend/src/widgets/InstanceList.vue
@@ -462,7 +462,7 @@ onMounted(async () => {
         v-else-if="instancesMoreInfo.length === 0"
         class="flex align-center justify-center h-100 w-100"
       >
-        <Empty :description="t('无内容，请在右上角下拉框选择节点，或点击新建应用')" />
+        <Empty :description="t('TXT_CODE_5415f009')" />
       </div>
     </a-row>
   </div>
diff --git a/frontend/src/widgets/LoginCard.vue b/frontend/src/widgets/LoginCard.vue
index 7fa6dbe2..fe73ad29 100644
--- a/frontend/src/widgets/LoginCard.vue
+++ b/frontend/src/widgets/LoginCard.vue
@@ -38,7 +38,7 @@ const loginStep = ref(0);
 
 const handleLogin = async () => {
   if (!formData.username.trim() || !formData.password.trim()) {
-    return message.error(t("请完善账号信息！"));
+    return message.error(t("TXT_CODE_c846074d"));
   }
 
   loginStep.value++;
@@ -136,7 +136,7 @@ const loginSuccess = () => {
                 </a>
               </div>
               <a-button size="large" type="primary" style="min-width: 95px" @click="handleLogin">
-                {{ t("确定") }}
+                {{ t("TXT_CODE_d507abff") }}
               </a-button>
             </div>
           </div>
diff --git a/frontend/src/widgets/instance/BaseInfo.vue b/frontend/src/widgets/instance/BaseInfo.vue
index 4cee3262..04037801 100644
--- a/frontend/src/widgets/instance/BaseInfo.vue
+++ b/frontend/src/widgets/instance/BaseInfo.vue
@@ -78,11 +78,11 @@ onMounted(async () => {
         {{ t("TXT_CODE_46f575ae") }}{{ parseTimestamp(instanceInfo?.config.lastDatetime) }}
       </a-typography-paragraph>
       <a-typography-paragraph v-if="instanceInfo?.config.docker.image">
-        {{ t("资源限制：") }}
+        {{ t("TXT_CODE_4f917a65") }}
         <a href="javascript:;" @click="DockerInfoDialog?.openDialog()">查看</a>
       </a-typography-paragraph>
       <a-typography-paragraph v-if="instanceInfo?.config.docker.image">
-        {{ t("可用端口：") }}
+        {{ t("TXT_CODE_2e4469f6") }}
         <div style="padding: 10px 0px 0px 16px">
           <div
             v-for="(item, index) in dockerPortsParse(instanceInfo?.config.docker.ports ?? [])"
@@ -90,8 +90,8 @@ onMounted(async () => {
             style="margin-bottom: 2px"
           >
             <template v-if="!item.more">
-              <span>{{ t("主机") }}: {{ item.p1 }}</span>
-              <span style="margin-left: 6px">{{ t("容器") }}: {{ item.p2 }}</span>
+              <span>{{ t("TXT_CODE_8dfc41ef") }}: {{ item.p1 }}</span>
+              <span style="margin-left: 6px">{{ t("TXT_CODE_8f8103b7") }}: {{ item.p2 }}</span>
               <span style="margin-left: 8px">
                 <a-tag color="green">{{ item.protocol }}</a-tag>
               </span>
diff --git a/frontend/src/widgets/instance/dialogs/DockerInfo.vue b/frontend/src/widgets/instance/dialogs/DockerInfo.vue
index 0ea28d54..fe46b969 100644
--- a/frontend/src/widgets/instance/dialogs/DockerInfo.vue
+++ b/frontend/src/widgets/instance/dialogs/DockerInfo.vue
@@ -18,21 +18,21 @@ defineExpose({
 </script>
 
 <template>
-  <a-modal v-model:open="open" centered :title="t('容器资源限制信息')">
+  <a-modal v-model:open="open" centered :title="t('TXT_CODE_a7f6b0e0')">
     <a-descriptions :column="{ md: 2, sm: 2, xs: 1 }">
-      <a-descriptions-item :label="t('最大内存')">
+      <a-descriptions-item :label="t('TXT_CODE_dd238854')">
         {{ props.dockerInfo?.memory }} MB
       </a-descriptions-item>
-      <a-descriptions-item :label="t('网络模式')">
+      <a-descriptions-item :label="t('TXT_CODE_efcef926')">
         {{ props.dockerInfo?.networkMode }}
       </a-descriptions-item>
-      <a-descriptions-item :label="t('镜像名')">
+      <a-descriptions-item :label="t('TXT_CODE_77000411')">
         {{ props.dockerInfo?.image }}
       </a-descriptions-item>
-      <a-descriptions-item :label="t('容器名')">
+      <a-descriptions-item :label="t('TXT_CODE_c3a3b6b1')">
         {{ props.dockerInfo?.containerName }}
       </a-descriptions-item>
-      <a-descriptions-item v-if="props.dockerInfo?.ports" :label="t('可用端口')">
+      <a-descriptions-item v-if="props.dockerInfo?.ports" :label="t('TXT_CODE_d32301c1')">
         <div>
           <div
             v-for="(item, index) in dockerPortsParse(props.dockerInfo.ports)"
@@ -40,8 +40,8 @@ defineExpose({
             style="margin-bottom: 2px"
           >
             <template v-if="!item.more">
-              <span>{{ t("主机") }}: {{ item.p1 }}</span>
-              <span style="margin-left: 6px">{{ t("容器") }}: {{ item.p2 }}</span>
+              <span>{{ t("TXT_CODE_8dfc41ef") }}: {{ item.p1 }}</span>
+              <span style="margin-left: 6px">{{ t("TXT_CODE_8f8103b7") }}: {{ item.p2 }}</span>
               <span style="margin-left: 8px">
                 <a-tag color="green">{{ item.protocol }}</a-tag>
               </span>
diff --git a/frontend/src/widgets/node/NodeItem.vue b/frontend/src/widgets/node/NodeItem.vue
index 44e05cf0..e16b5fe9 100644
--- a/frontend/src/widgets/node/NodeItem.vue
+++ b/frontend/src/widgets/node/NodeItem.vue
@@ -207,7 +207,7 @@ const nodeOperations = computed(() =>
                   <template #title>
                     {{
                       t(
-                        "远程节点版本与面板端所需版本不一致，这可能会导致工作异常，请立即更新远程节点！"
+                        "TXT_CODE_e520908a"
                       )
                     }}
                   </template>
diff --git a/frontend/src/widgets/others/PluginCard.vue b/frontend/src/widgets/others/PluginCard.vue
index decbcaa7..5723fd9f 100644
--- a/frontend/src/widgets/others/PluginCard.vue
+++ b/frontend/src/widgets/others/PluginCard.vue
@@ -75,16 +75,16 @@ onUnmounted(() => {
         <div v-if="containerState.isDesignMode">
           <a-typography-paragraph>
             <p>
-              {{ t("支持上传 HTML 文件，此卡片会加载 HTML 并运行 Javascript 代码。") }}
+              {{ t("TXT_CODE_c565b2e0") }}
               <br />
-              {{ t("使用其他人分享的文件可能会导致面板被入侵。") }}
+              {{ t("TXT_CODE_6750d9d3") }}
             </p>
-            <div v-if="originUrl">{{ t("HTML 文件:") }}</div>
+            <div v-if="originUrl">{{ t("TXT_CODE_6345aa71") }}</div>
             <div v-if="originUrl" class="mt-16 mb-16">
               <a :href="originUrl" target="_blank" rel="noopener noreferrer">{{ originUrl }}</a>
             </div>
             <a-button class="mt-8" type="primary" @click="uploadHtmlFile">
-              {{ t("上传 HTML 文件") }}
+              {{ t("TXT_CODE_40a87804") }}
             </a-button>
           </a-typography-paragraph>
         </div>
diff --git a/languages/en_US.json b/languages/en_US.json
index ed860a49..aaa34e72 100644
--- a/languages/en_US.json
+++ b/languages/en_US.json
@@ -1724,5 +1724,25 @@
   "TXT_CODE_76d20724": "Assigned Instances",
   "TXT_CODE_9393b484": "Assign",
   "TXT_CODE_6c274bdc": "This user does not enable the APIKEY.",
-  "TXT_CODE_e99ab99a": "Are you sure you want to delete this user?"
+  "TXT_CODE_e99ab99a": "Are you sure you want to delete this user?",
+  "TXT_CODE_2452016e": "请手动复制以下内容",
+  "TXT_CODE_5ebec0db": "扩展页面卡片",
+  "TXT_CODE_cb84b22": "此卡片可以上传自定义 HTML 页面并直接执行 Javascript 脚本，可以直接使用网页上所有元素，适用于 Web 前端开发人员。",
+  "TXT_CODE_aa373641": "请选择节点",
+  "TXT_CODE_a9bcbde9": "字段必须是数字",
+  "TXT_CODE_4f917a65": "资源限制：",
+  "TXT_CODE_2e4469f6": "可用端口：",
+  "TXT_CODE_8dfc41ef": "主机",
+  "TXT_CODE_8f8103b7": "容器",
+  "TXT_CODE_a7f6b0e0": "容器资源限制信息",
+  "TXT_CODE_77000411": "镜像名",
+  "TXT_CODE_d32301c1": "可用端口",
+  "TXT_CODE_5415f009": "无内容，请在右上角下拉框选择节点，或点击新建应用",
+  "TXT_CODE_c846074d": "请完善账号信息！",
+  "TXT_CODE_e520908a": "远程节点版本与面板端所需版本不一致，这可能会导致工作异常，请立即更新远程节点！",
+  "TXT_CODE_c565b2e0": "支持上传 HTML 文件，此卡片会加载 HTML 并运行 Javascript 代码。",
+  "TXT_CODE_6750d9d3": "使用其他人分享的文件可能会导致面板被入侵。",
+  "TXT_CODE_6345aa71": "HTML 文件:",
+  "TXT_CODE_40a87804": "上传 HTML 文件",
+  "TXT_CODE_ccb60658": "身份验证"
 }
diff --git a/languages/zh_CN.json b/languages/zh_CN.json
index 4e21fa38..be4984da 100644
--- a/languages/zh_CN.json
+++ b/languages/zh_CN.json
@@ -1714,5 +1714,25 @@
   "TXT_CODE_76d20724": "用户所有实例",
   "TXT_CODE_9393b484": "分配实例",
   "TXT_CODE_6c274bdc": "此用户没有开启 APIKEY 功能。",
-  "TXT_CODE_e99ab99a": "你确定要删除这个用户吗？"
+  "TXT_CODE_e99ab99a": "你确定要删除这个用户吗？",
+  "TXT_CODE_2452016e": "请手动复制以下内容",
+  "TXT_CODE_5ebec0db": "扩展页面卡片",
+  "TXT_CODE_cb84b22": "此卡片可以上传自定义 HTML 页面并直接执行 Javascript 脚本，可以直接使用网页上所有元素，适用于 Web 前端开发人员。",
+  "TXT_CODE_aa373641": "请选择节点",
+  "TXT_CODE_a9bcbde9": "字段必须是数字",
+  "TXT_CODE_4f917a65": "资源限制：",
+  "TXT_CODE_2e4469f6": "可用端口：",
+  "TXT_CODE_8dfc41ef": "主机",
+  "TXT_CODE_8f8103b7": "容器",
+  "TXT_CODE_a7f6b0e0": "容器资源限制信息",
+  "TXT_CODE_77000411": "镜像名",
+  "TXT_CODE_d32301c1": "可用端口",
+  "TXT_CODE_5415f009": "无内容，请在右上角下拉框选择节点，或点击新建应用",
+  "TXT_CODE_c846074d": "请完善账号信息！",
+  "TXT_CODE_e520908a": "远程节点版本与面板端所需版本不一致，这可能会导致工作异常，请立即更新远程节点！",
+  "TXT_CODE_c565b2e0": "支持上传 HTML 文件，此卡片会加载 HTML 并运行 Javascript 代码。",
+  "TXT_CODE_6750d9d3": "使用其他人分享的文件可能会导致面板被入侵。",
+  "TXT_CODE_6345aa71": "HTML 文件:",
+  "TXT_CODE_40a87804": "上传 HTML 文件",
+  "TXT_CODE_ccb60658": "身份验证"
 }
diff --git a/panel/src/app/service/frontend_layout.ts b/panel/src/app/service/frontend_layout.ts
index 0ec5141c..acf605f2 100644
--- a/panel/src/app/service/frontend_layout.ts
+++ b/panel/src/app/service/frontend_layout.ts
@@ -526,7 +526,7 @@ function getDefaultFrontendLayoutConfig(): IPageLayoutConfig[] {
           id: getRandomId(),
           meta: {},
           type: "LoginCard",
-          title: t("身份验证"),
+          title: t("TXT_CODE_ccb60658"),
           width: 4,
           height: LayoutCardHeight.AUTO,
           disableDelete: true