画布组合撤回和重做bug修复

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);
             <span>更</span>
             <div class="tool-tooltip">更换底图</div>
           </div>
+          <div class="custom-tool-btn" @click="saveCanvas">
+            <span>保</span>
+            <div class="tool-tooltip">保存画布</div>
+          </div>
+          <div class="custom-tool-btn" @click="canvasProject">
+            <span>读</span>
+            <div class="tool-tooltip">读取画布</div>
+          </div>
+          <div class="custom-tool-btn" @click="exportJSON">
+            <span>导</span>
+            <div class="tool-tooltip">导出JSON</div>
+          </div>
+          <div class="custom-tool-btn" @click="copyJSON">
+            <span>复</span>
+            <div class="tool-tooltip">复制JSON</div>
+          </div>
+          <div class="custom-tool-btn" @click="getLayers">
+            <span>查</span>
+            <div class="tool-tooltip">查询图层</div>
+          </div>
         </template>
       </CanvasEditor>
     </div>