fix

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);

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,

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,

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;

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

@@ -52,7 +52,7 @@
 								<span class="label iconfont icon-angle"></span>
 								<input
 									type="number"
-									:value="v.angle"
+									:value="Number(Number(v.angle).toFixed(3))"
 									@change="(e) => changeAngle(e, v)"
 								/>
 							</div>
@@ -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];

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);
 	}
   }

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;

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;

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,
     });

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(拖拽)