From 7bc82af120173e3f0693e2001e66dd6d650d9824 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E5=BF=97=E9=B9=8F?= <2916022834@qq.com> Date: Tue, 11 Nov 2025 14:28:41 +0800 Subject: [PATCH] fix --- .../commands/FillGroupLayerBackgroundCommand.js | 4 +++- .../Canvas/CanvasEditor/commands/LayerCommands.js | 2 +- .../CanvasEditor/commands/RasterizeLayerCommand.js | 4 +++- .../Canvas/CanvasEditor/components/LiquifyPanel.vue | 1 + .../Canvas/CanvasEditor/components/SelectMenuPanel.vue | 9 ++------- .../Canvas/CanvasEditor/components/SelectionPanel.vue | 5 ++++- .../Canvas/CanvasEditor/components/TextEditorPanel.vue | 5 ++++- .../Canvas/CanvasEditor/components/ToolsSidebar.vue | 6 ++++++ .../CanvasEditor/managers/BackgroundFillManager.js | 4 +++- .../Canvas/CanvasEditor/managers/LayerManager.js | 1 + src/lang/cn.ts | 1 + src/lang/en.ts | 1 + 12 files changed, 30 insertions(+), 13 deletions(-) diff --git a/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js b/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js index b38a3954..98eb683a 100644 --- a/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js +++ b/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js @@ -18,6 +18,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.canvas = options.canvas; this.layers = options.layers; this.canvasManager = options.canvasManager; + this.layerManager = options.layerManager; this.layerId = options.layerId; this.fillColor = options.fillColor; this.oldFill = null; @@ -211,6 +212,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.group.set({ id: layerObjects[0]?.id || generateId("group-"), layerId: this.layer?.id, + layerName: this.layer?.name, }); // this.group.setCoords(); // this.group.setObjectsCoords(); @@ -225,7 +227,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.group.clipPath = clipPath; } layer.fabricObjects = [ - this.group.toObject(["id", "layerId"]) || this.group, + this.group.toObject(["id", "layerId", "layerName"]) || this.group, ]; // removeCanvasObjectByObject(this.canvas, layerObjects?.[0]); insertObjectAtZIndex(this.canvas, this.group, insertIndex, false, true); diff --git a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js index 0380638e..692b16ea 100644 --- a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js +++ b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js @@ -2595,7 +2595,7 @@ export class CreateImageLayerCommand extends Command { // 生成图层名称 const fileName = - this.layerName || `${new Date().toLocaleString()}`; + this.layerName || `${new Date().toLocaleTimeString()}`; this.fabricImage.set({ id: this.imageId, diff --git a/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js b/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js index 7088029a..917a0b6d 100644 --- a/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js +++ b/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js @@ -15,6 +15,8 @@ import { import { createRasterizedImage } from "../utils/rasterizedImage"; import { message } from "ant-design-vue"; import { restoreFabricObject } from "../utils/objectHelper"; +import i18n from "@/lang/index.ts"; +const { t } = i18n.global; /** * 组合图层命令 @@ -338,7 +340,7 @@ export class RasterizeLayerCommand extends Command { // 创建新的组合图层 this.rasterizedLayer = createLayer({ id: this.rasterizedLayerId, - name: `${this.layer.name} (组合)`, + name: `${this.layer.name} (${t('Canvas.group')})`, type: LayerType.BITMAP, visible: this.layer.visible, locked: this.layer.locked, diff --git a/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue b/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue index 081bf615..9e77c0e2 100644 --- a/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue @@ -1667,6 +1667,7 @@ function stopPressTimer() { display: flex; align-items: center; justify-content: center; + height: 22px; > i{ font-size: 1.4rem; diff --git a/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue b/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue index d02015c8..8aee5d88 100644 --- a/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue @@ -52,7 +52,7 @@ @@ -267,12 +267,7 @@ arrs.forEach((v) => { activeObjects.value.forEach((item) => { if (item.id === v.id) { - keys.forEach((k) => { - item[k] = - typeof v[k] === "number" - ? Number(v[k].toFixed(3)) - : v[k]; - }); + keys.forEach((key) => (item[key] = v[key])); } }); activeObjects.value = [...activeObjects.value]; diff --git a/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue b/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue index 2c2d0232..2f1403b3 100644 --- a/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue @@ -531,10 +531,13 @@ function confirmColorPicker() { width: 100%; text-align: center; cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + height: 22px; > i{ font-size: 1.4rem; - display: block; transform: rotate(270deg); } } diff --git a/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue b/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue index 20f786dd..09637373 100644 --- a/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue @@ -715,7 +715,10 @@ export default { width: 100%; text-align: center; cursor: pointer; - + display: flex; + align-items: center; + justify-content: center; + height: 22px; > i{ font-size: 1.4rem; display: block; diff --git a/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue b/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue index 8b0596b7..8e0361c4 100644 --- a/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue +++ b/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue @@ -395,9 +395,15 @@ const handleToolClick = (tool) => { height: 100%; padding-top: .5rem; padding-bottom: 4rem; + position: relative; /* overflow-y: auto; */ /* overflow-x: hidden; */ } +.fillColor-input{ + position: absolute; + top: 0; + right: 0; +} .tools-list{ display: flex; flex-direction: column; diff --git a/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js b/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js index c5959354..96ee3e97 100644 --- a/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js +++ b/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js @@ -2,11 +2,12 @@ import { FillGroupLayerBackgroundCommand } from "../commands/FillGroupLayerBackg import { FillLayerBackgroundCommand } from "../commands/FillLayerBackgroundCommand"; export class BackgroundFillManager { - constructor({ canvas, layers, commandManager, canvasManager }) { + constructor({ canvas, layers, commandManager, canvasManager, layerManager }) { this.canvas = canvas; this.layers = layers; this.commandManager = commandManager; this.canvasManager = canvasManager; + this.layerManager = layerManager; } /** @@ -28,6 +29,7 @@ export class BackgroundFillManager { layerId, fillColor, canvasManager: this.canvasManager, + layerManager: this.layerManager, // 是否实时更新 isRetimeUpdate: !undoable, }); diff --git a/src/component/Canvas/CanvasEditor/managers/LayerManager.js b/src/component/Canvas/CanvasEditor/managers/LayerManager.js index e70a6b70..9e524e91 100644 --- a/src/component/Canvas/CanvasEditor/managers/LayerManager.js +++ b/src/component/Canvas/CanvasEditor/managers/LayerManager.js @@ -109,6 +109,7 @@ export class LayerManager { layers: this.layers, commandManager: this.commandManager, canvasManager: this.canvasManager, + layerManager: this, }); // 编辑器模式:draw(绘画)、select(选择)、pan(拖拽) diff --git a/src/lang/cn.ts b/src/lang/cn.ts index 71224767..129c5fc5 100644 --- a/src/lang/cn.ts +++ b/src/lang/cn.ts @@ -1219,6 +1219,7 @@ export default { basic: '基础', flipHorizontal: '水平翻转', flipVertical: '垂直翻转', + group: '组合', //长毛笔 FurSettings: '长毛笔设置', FurLength: '毛发长度', diff --git a/src/lang/en.ts b/src/lang/en.ts index 054b3b13..87cb88aa 100644 --- a/src/lang/en.ts +++ b/src/lang/en.ts @@ -1254,6 +1254,7 @@ export default { basic: 'Basic', flipHorizontal: 'Horizontal Flip', flipVertical: 'Vertical Flip', + group: 'Group', //长毛笔 FurSettings: 'FurSettings', FurLength: 'Fur Length',