From 4f1537b68f809fffb38097135f18b12950ded218 Mon Sep 17 00:00:00 2001
From: Takagi <mail@e.lixingyong.com>
Date: Thu, 27 Jul 2023 12:12:13 +0800
Subject: [PATCH] pref: internationalize the avatar processing toolbar (#4313)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/kind improvement

#### What this PR does / why we need it:

对头像处理组件的 toolbar 进行国际化处理。

#### Which issue(s) this PR fixes:

Fixes #4296

#### Special notes for your reviewer:

#### Does this PR introduce a user-facing change?
```release-note
None
```
---
 console/src/locales/en.yaml                          |  7 +++++++
 console/src/locales/zh-CN.yaml                       |  7 +++++++
 console/src/locales/zh-TW.yaml                       |  7 +++++++
 .../system/users/components/UserAvatarCropper.vue    | 12 +++++++++++-
 4 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/console/src/locales/en.yaml b/console/src/locales/en.yaml
index a09e0320a..696741a47 100644
--- a/console/src/locales/en.yaml
+++ b/console/src/locales/en.yaml
@@ -883,6 +883,13 @@ core:
           title: Crop Avatar
         remove:
           title: Are you sure you want to delete the avatar?
+        tooltips:
+          upload: Upload
+          zoom_in: Zoom In
+          zoom_out: Zoom Out
+          flip_horizontal: Flip Horizontal
+          flip_vertical: Flip Vertical
+          reset: Reset
   role:
     title: Roles
     common:
diff --git a/console/src/locales/zh-CN.yaml b/console/src/locales/zh-CN.yaml
index 88cbfcf9b..f5daa99d8 100644
--- a/console/src/locales/zh-CN.yaml
+++ b/console/src/locales/zh-CN.yaml
@@ -883,6 +883,13 @@ core:
           title: 裁剪头像
         remove:
           title: 确定要删除头像吗？
+        tooltips:
+          upload: 上传
+          zoom_in: 放大
+          zoom_out: 缩小
+          flip_horizontal: 水平翻转
+          flip_vertical: 垂直翻转
+          reset: 重置
   role:
     title: 角色
     common:
diff --git a/console/src/locales/zh-TW.yaml b/console/src/locales/zh-TW.yaml
index 0c4413676..195ac5cb9 100644
--- a/console/src/locales/zh-TW.yaml
+++ b/console/src/locales/zh-TW.yaml
@@ -883,6 +883,13 @@ core:
           title: 裁剪頭像
         remove:
           title: 確定要刪除頭像嗎？
+        tooltips:
+          upload: 上傳
+          zoom_in: 放大
+          zoom_out: 縮小
+          flip_horizontal: 水平翻轉
+          flip_vertical: 垂直翻轉
+          reset: 重置
   role:
     title: 角色
     common:
diff --git a/console/src/modules/system/users/components/UserAvatarCropper.vue b/console/src/modules/system/users/components/UserAvatarCropper.vue
index 3d473a8d6..75f7b938a 100644
--- a/console/src/modules/system/users/components/UserAvatarCropper.vue
+++ b/console/src/modules/system/users/components/UserAvatarCropper.vue
@@ -15,6 +15,9 @@ import { onMounted } from "vue";
 import { computed } from "vue";
 import type { Component } from "vue";
 import { markRaw } from "vue";
+import { useI18n } from "vue-i18n";
+
+const { t } = useI18n();
 
 export type ToolbarName =
   | "upload"
@@ -26,6 +29,7 @@ export type ToolbarName =
 
 export interface ToolbarItem {
   name: ToolbarName;
+  title?: string;
   icon: Component;
   onClick: () => void;
 }
@@ -60,6 +64,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       emit("changeFile");
     },
+    title: t("core.user.detail.avatar.tooltips.upload"),
   },
   {
     name: "zoomIn",
@@ -67,6 +72,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       cropper.value?.zoom(0.1);
     },
+    title: t("core.user.detail.avatar.tooltips.zoom_in"),
   },
   {
     name: "zoomOut",
@@ -74,6 +80,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       cropper.value?.zoom(-0.1);
     },
+    title: t("core.user.detail.avatar.tooltips.zoom_out"),
   },
   {
     name: "flipHorizontal",
@@ -81,6 +88,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       cropper.value?.scaleX(-cropper.value?.getData().scaleX || -1);
     },
+    title: t("core.user.detail.avatar.tooltips.flip_horizontal"),
   },
   {
     name: "flipVertical",
@@ -88,6 +96,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       cropper.value?.scaleY(-cropper.value?.getData().scaleY || -1);
     },
+    title: t("core.user.detail.avatar.tooltips.flip_vertical"),
   },
   {
     name: "reset",
@@ -95,6 +104,7 @@ const defaultToolbars: ToolbarItem[] = [
     onClick: () => {
       cropper.value?.reset();
     },
+    title: t("core.user.detail.avatar.tooltips.reset"),
   },
 ];
 const previewElement = ref<HTMLElement>();
@@ -210,7 +220,7 @@ defineExpose({
           <li
             v-for="toolbar in toolbarItems"
             :key="toolbar.name"
-            :title="toolbar.name"
+            :title="toolbar.title"
           >
             <button
               type="button"