canvas语言适配

src/component/Canvas/CanvasEditor/components/LayersPanel/LayerItem.vue

@@ -3,7 +3,8 @@ import { ref, nextTick, computed, inject } from "vue";
 import { Checkbox } from "ant-design-vue";
 import { VueDraggable } from "vue-draggable-plus";
 import { isGroupLayer } from "../../utils/layerHelper";
-
+import { useI18n } from 'vue-i18n'
+const {t} = useI18n()
 // 设置组件名称，用于递归渲染
 defineOptions({
   name: "LayerItem",
@@ -393,7 +394,7 @@ function findParentLayerId() {
             v-if="layer.thumbnailUrl"
             :src="layer.thumbnailUrl"
             class="layer-thumbnail"
-            :alt="$t('图层预览')"
+            :alt="$t('Canvas.preview')"
           />
         </div>
 
@@ -423,7 +424,7 @@ function findParentLayerId() {
           <div
             class="visibility-btn"
             @click.stop="handleToggleVisibility"
-            :title="$t('显示/隐藏图层')"
+            :title="$t('Canvas.showHiddenLayer')"
           >
             <SvgIcon v-if="layer.visible" name="CEye" :size="16"></SvgIcon>
             <SvgIcon v-else name="CUnEye" :size="16"></SvgIcon>
@@ -447,7 +448,7 @@ function findParentLayerId() {
           <div
             class="delete-btn"
             :class="{ disabled: !canDelete }"
-            :title="$t('删除图层')"
+            :title="$t('Canvas.deleteLayer')"
             @click.stop="handleDelete"
           >
             <SvgIcon name="CDelete" size="14"></SvgIcon>
@@ -460,7 +461,7 @@ function findParentLayerId() {
           class="group-expand-icon"
           @click.stop="toggleGroupExpanded"
           @dblclick.stop=""
-          :title="isGroupExpanded ? $t('收起组') : $t('展开组')"
+          :title="isGroupExpanded ? $t('Canvas.CollapseUp') : $t('Canvas.CollapseDown')"
         >
           <SvgIcon
             name="CRight"

src/component/Canvas/CanvasEditor/components/LayersPanel/LayersPanel.vue

@@ -5,6 +5,8 @@ import ContextMenu from "./ContextMenu.vue";
 import LayerItem from "./LayerItem.vue";
 import LayersList from "./LayersList.vue"; // 引入 LayersList 组件
 import { createCrossLevelMoveCommand } from "../../commands/CrossLevelMoveCommands";
+import { useI18n } from 'vue-i18n'
+const {t} = useI18n()
 // // 导入命令类
 // import {
 //   ReorderLayersCommand,
@@ -1523,7 +1525,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
         style="width: 0; height: 0; opacity: 0"
       /> -->
       <h3>
-        {{ $t("图层") }}
+        {{ $t("Canvas.layer") }}
         {{ selectedLayerIds.length > 0 ? `(${selectedLayerIds.length})` : "" }}
       </h3>
       <div class="layer-actions-group">
@@ -1533,7 +1535,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
             class="group-btn action-btn"
             :class="{ disabled: !canGroupLayers }"
             @click="groupSelectedLayers"
-            :title="$t('创建组')"
+            :title="$t('Canvas.createGroup')"
           >
             <SvgIcon name="CCreateGroup" size="20"></SvgIcon>
           </div>
@@ -1542,7 +1544,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
             class="ungroup-btn action-btn"
             :class="{ disabled: !canUngroupLayers }"
             @click="ungroupSelectedLayer"
-            :title="$t('解组')"
+            :title="$t('Canvas.slutionGroup')"
           >
             <SvgIcon name="CCancelGroup" size="20"></SvgIcon>
           </div>
@@ -1550,7 +1552,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
           <div
             class="delete-selected-btn action-btn"
             @click="deleteSelectedLayers"
-            :title="$t('删除选中图层')"
+            :title="$t('Canvas.deleteLayer')"
           >
             <SvgIcon name="CDelete" size="16"></SvgIcon>
           </div>
@@ -1558,7 +1560,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
           <div
             class="clear-selection-btn action-btn"
             @click="clearSelection"
-            :title="$t('清除选择')"
+            :title="$t('Canvas.clearSelection')"
           >
             <SvgIcon name="CCloseNo" size="14"></SvgIcon>
           </div>
@@ -1570,7 +1572,7 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
             v-if="isChildLayerActive"
             class="add-layer-btn action-btn"
             @click="addTopLayer"
-            :title="$t('添加顶级图层')"
+            :title="$t('Canvas.AddPinnedLayer')"
           >
             <SvgIcon name="CPlusTop" size="16"></SvgIcon>
           </div>
@@ -1587,8 +1589,8 @@ async function moveGroupToGroup(draggedLayer, fromParentId, toParentId, newIndex
 
     <!-- 多选提示条 -->
     <div v-if="isMultiSelectMode" class="multi-select-info">
-      <span>已选择 {{ selectedLayerIds.length }} 个图层</span>
-      <small>提示：按住 Ctrl/Cmd 多选，Shift 范围选择，长按进入多选模式</small>
+      <span>{{ $t('Canvas.Hint') }}{{ selectedLayerIds.length }}</span>
+      <small>{{ $t('Canvas.Hint') }}</small>
     </div>
 
     <!-- 图层列表组件 -->