Merge branch 'dev_vite' of https://github.com/1627315083/aida into dev_vite

src/component/Canvas/CanvasEditor/index.vue

@@ -20,11 +20,10 @@ import { SelectionManager } from "./managers/selection/SelectionManager";
 import { RedGreenModeManager } from "./managers/RedGreenModeManager";
 import texturePresetManager from "./managers/brushes/TexturePresetManager";
 import { BrushStore } from "./store/BrushStore";
-import cuowuImg from '@/assets/images/homePage/cuowu.svg'
+import cuowuImg from "@/assets/images/homePage/cuowu.svg";
 import { Https } from "@/tool/https";
-import SelectImages from '@/component/common/SelectImages.vue'
-import { UrlToFile } from '@/tool/util'
-
+import SelectImages from "@/component/common/SelectImages.vue";
+import { UrlToFile } from "@/tool/util";
 
 // import { MinimapManager } from "./managers/minimap/MinimapManager";
 
@@ -105,14 +104,16 @@ const props = defineProps({
     type: Boolean,
     default: false, // 是否显示固定图层
   },
-  isGeneral: { // 从generalMiniCanvas来的
+  isGeneral: {
+    // 从generalMiniCanvas来的
     type: Boolean,
-    default:false
+    default: false,
   },
-  isEdit: { // 从design点击喜欢过的图片,再点击顶部的编辑图标
+  isEdit: {
+    // 从design点击喜欢过的图片,再点击顶部的编辑图标
     type: Boolean,
-    default: false
-  }
+    default: false,
+  },
 });
 
 // 引用和状态
@@ -418,8 +419,7 @@ onMounted(async () => {
 
   // 添加删除按钮
   // if(!fabric.Object.prototype.controls.deleteControl)addRemoveBtn(removeLayer)
-	addRemoveBtn(removeLayer)
-
+  addRemoveBtn(removeLayer);
 
   // 触发组件初始化事件
   nextTick(() => {
@@ -541,18 +541,17 @@ function handleWindowResize() {
 function resetZoom() {
   canvasManager.resetZoom();
 }
-
 function setZoom(zoom) {
   setTimeout(() => {
     if (!canvasManager) return;
-  const newZoom = Math.max(zoom, 0.1); // 减少10%，最小0.1倍
+    const newZoom = Math.max(zoom, 0.1);
     // 使用画布中心作为缩放点
     const centerPoint = {
       x: canvasManager.canvas.width / 2,
       y: canvasManager.canvas.height / 2,
     };
     canvasManager.animateZoom(centerPoint, newZoom);
-	})
+  });
 }
 
 function zoomIn() {
@@ -645,11 +644,12 @@ function moveLayerDown(layerId) {
   layerManager.moveLayer(layerId, "down");
 }
 
-function addRemoveBtn(fun){//添加删除按钮
-	const deleteIcon = cuowuImg
+function addRemoveBtn(fun) {
+  //添加删除按钮
+  const deleteIcon = cuowuImg;
   // 创建删除图片元素
-	let deleteImg = document.createElement('img')
-	deleteImg.src = deleteIcon
+  let deleteImg = document.createElement("img");
+  deleteImg.src = deleteIcon;
   function renderIcon(icon) {
     return function (ctx, left, top, styleOverride, fabricObject) {
       var size = this.cornerSize;
@@ -658,22 +658,22 @@ function addRemoveBtn(fun){//添加删除按钮
       ctx.rotate(fabric.util.degreesToRadians(fabricObject.angle));
       ctx.drawImage(icon, -size / 3, -size / 3, size / 1.5, size / 1.5);
       ctx.restore();
-		}
+    };
   }
   fabric.Object.prototype.controls.deleteControl = new fabric.Control({
     x: 0.5,
     y: -0.5,
     offsetY: -16,
     offsetX: 16,
-		cursorStyle: 'pointer',
+    cursorStyle: "pointer",
     mouseUpHandler: deleteFun,
     render: renderIcon(deleteImg),
-		cornerSize: 24
-	})
+    cornerSize: 24,
+  });
 }
 
 function deleteFun() {
-	removeLayer(layerManager.activeLayerId.value)
+  removeLayer(layerManager.activeLayerId.value);
 }
 
 function removeLayer(layerId) {
@@ -749,13 +749,13 @@ function handleImageUpload(event) {
 const selectImages = ref(null);
 const handleImageSelect = (data) => {
   UrlToFile(data.url, data.name).then((file) => {
-    handleImageUpload({ target: { files: [file] } })
-  })
-}
+    handleImageUpload({ target: { files: [file] } });
+  });
+};
 function triggerLibrary() {
   // console.log('CanvasEditor', '打开收藏')
   if (props.isGeneral || props.isEdit) {
-    selectImages.value.init()
+    selectImages.value.init();
   } else {
     emit("trigger-library");
   }
@@ -865,7 +865,7 @@ const changeCanvas = async (command) => {
         isCropByBg: true,
       });
       emit("trigger-red-green-mouseup", imageData);
-	},100)
+    }, 100);
   }
 };
 
@@ -1108,7 +1108,10 @@ defineExpose({
           </template>
           <!-- 扩展插槽 -->
           <template #customToolsBottom="{ toolButtonProps }">
-            <slot name="customToolsBottom" :tool-button-props="toolButtonProps" />
+            <slot
+              name="customToolsBottom"
+              :tool-button-props="toolButtonProps"
+            />
           </template>
         </ToolsSidebar>
       </div>
@@ -1131,14 +1134,14 @@ defineExpose({
         <!-- 文本编辑面板 -->
         <TextEditorPanel
           v-if="canvasManagerLoaded && !enabledRedGreenMode"
-          :canvas="canvasManager?.canvas"
+          :canvas="canvasManager && canvasManager.canvas"
           :commandManager="commandManager"
         />
 
         <!-- 液化编辑面板 -->
         <LiquifyPanel
           v-if="canvasManagerLoaded && !enabledRedGreenMode"
-          :canvas="canvasManager?.canvas"
+          :canvas="canvasManager && canvasManager.canvas"
           :commandManager="commandManager"
           :liquifyManager="liquifyManager"
           :layerManager="layerManager"
@@ -1148,7 +1151,7 @@ defineExpose({
         <!-- 选区面板 -->
         <SelectionPanel
           v-if="canvasManagerLoaded && !enabledRedGreenMode"
-          :canvas="canvasManager?.canvas"
+          :canvas="canvasManager && canvasManager.canvas"
           :commandManager="commandManager"
           :selectionManager="selectionManager"
           :layerManager="layerManager"
@@ -1246,7 +1249,8 @@ defineExpose({
   flex-direction: column;
   /* height: 100vh; */
   background-color: #ffffff;
-  font-family: pingfang_medium, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  font-family: pingfang_medium, -apple-system, BlinkMacSystemFont, "Segoe UI",
+    sans-serif;
   position: absolute;
   left: 0;
   right: 0;