diff --git a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js index 3275365a..bf3f3220 100644 --- a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js +++ b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js @@ -2019,7 +2019,7 @@ export class LayerObjectsToGroupCommand extends Command { console.error("图层或Canvas未初始化"); return null; } - + this.activeLayer = this.layerManager.getActiveLayer(); // 查找图层中是否已有组对象 const existingGroup = this._findExistingGroup(); this.existingGroupId = existingGroup?.id || null; @@ -2073,10 +2073,10 @@ export class LayerObjectsToGroupCommand extends Command { } // 更新交互性 - this.layerManager?.updateLayersObjectsInteractivity?.(false); - - // 更新缩略图 - this._updateThumbnail(); + this.layerManager?.updateLayersObjectsInteractivity?.(false).then(()=>{ + // 更新缩略图 + this._updateThumbnail(); + }); }); // 标记为非首次执行 @@ -2344,7 +2344,7 @@ export class LayerObjectsToGroupCommand extends Command { // 将对象添加回画布 this.canvas.add(obj); - restoredObjects.push(obj); + restoredObjects.push(obj.toObject("id", "layerId", "layerName")); console.log( `✅ 恢复原始对象 ${obj.id || obj.type} 到位置 (${position.left}, ${ @@ -2543,9 +2543,9 @@ export class LayerObjectsToGroupCommand extends Command { * @private */ _updateThumbnail() { - // this.canvas?.thumbnailManager?.generateLayerThumbnail?.( - // this.activeLayer.id - // ); + this.canvas?.thumbnailManager?.generateLayerThumbnail?.( + this.activeLayer.id + ); } getInfo() { diff --git a/src/component/Canvas/canvasExample.vue b/src/component/Canvas/canvasExample.vue index d67bdd41..e0b82da9 100644 --- a/src/component/Canvas/canvasExample.vue +++ b/src/component/Canvas/canvasExample.vue @@ -157,7 +157,30 @@ function canvasProject() { console.warn("没有找到保存的画布项目"); } } - +const exportJSON = () => { + console.log("导出JSON"); + // 实现导出JSON逻辑 + const json = canvasEditor.value.getJSON(); + // 导出JSON文件 + const blob = new Blob([json], { type: "application/json" }); + const url = URL.createObjectURL(blob); + const a = document.createElement("a"); + a.href = url; + a.download = "canvas_project.json"; + a.click(); + URL.revokeObjectURL(url); +}; +// 复制JSON +const copyJSON = () => { + console.log("复制JSON"); + // 实现复制JSON逻辑 + const json = canvasEditor.value.getJSON(); + // 复制JSON到剪贴板 + navigator.clipboard.writeText(json); +}; +const getLayers = ()=>{ + console.log("==========layers",canvasEditor.value?.layers) +} // 处理自定义工具点击 const handleCustomToolClick = (tool) => { tool.action(); @@ -255,6 +278,26 @@ const isShowLeft = ref(true); 更