深度画布

src/components/Canvas/DepthCanvas/manager/LayerManager.ts

@@ -2,7 +2,7 @@ import { ref } from 'vue'
 import { fabric } from 'fabric-with-all'
 import { createId } from '../../tools/tools'
 import { exportObjectsToImage, exportObjectToThumbnail } from '../tools/exportMethod'
-import { OperationType } from '../tools/layerHelper'
+import { OperationType, BlendMode } from '../tools/layerHelper'
 import { getArrowPath, cloneObjects, getStarArr } from '../tools/canvasMethod'
 
 export class LayerManager {
@@ -18,7 +18,12 @@ export class LayerManager {
 	}
 	onMounted() { }
 	setActiveID(id: string, isActive = true) {
-		this.activeID.value = id
+		const layer = this.getLayerById(id)
+		if (layer?.type === "group") {
+			this.activeID.value = ""
+		} else {
+			this.activeID.value = id
+		}
 		if (isActive) {
 			this.canvasManager.setActiveObjectById(id)
 			this.stateManager.toolManager.setTool(OperationType.SELECT)
@@ -399,9 +404,15 @@ export class LayerManager {
 		})
 		const index = this.canvasManager.getObjects().indexOf(targetLayer);
 		this.deleteLayerById(targetLayer.info.id, false)
-		this.setActiveID(mergedImage.info.id, false)
+
+		const nid = mergedImage.info.id
 		await this.canvasManager.add(mergedImage, false);
+		this.setActiveID(nid, false)
 		this.canvasManager.canvas.moveTo(mergedImage, index);
+
+		// this.stateManager.objectManager.setBlendMode(nid, BlendMode.MULTIPLY)
+		// this.stateManager.objectManager.setFillRepeat(nid, false)
+
 		this.canvasManager.renderAll()
 		this.updateLayers()
 		this.stateManager.recordState()