From 3aa15f7894084254455b1ff66c889db8825cec6e Mon Sep 17 00:00:00 2001
From: hanshiyang <yg_yl@163.com>
Date: Tue, 23 Sep 2025 17:37:28 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E8=8F=9C=E5=8D=95):=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E6=89=93=E5=BC=80=E5=92=8C=E4=BF=9D=E5=AD=98=E6=96=87=E6=A1=A3?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

在菜单栏中新增打开和保存文档按钮，支持导入JSON/文本文件以及导出为JSON文件
---
 index.html  |  6 ++++
 src/main.ts | 83 ++++++++++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 88 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index cd4f492..9b26b74 100644
--- a/index.html
+++ b/index.html
@@ -12,6 +12,12 @@
   <div id="app">
     <div class="menu" editor-component="menu">
       <div class="menu-item">
+        <div class="menu-item__open" title="打开文档">
+          <i></i>
+        </div>
+        <div class="menu-item__save" title="保存文档">
+          <i></i>
+        </div>
         <div class="menu-item__undo">
           <i></i>
         </div>
diff --git a/src/main.ts b/src/main.ts
index 76e8841..3097a79 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -79,7 +79,88 @@ window.onload = function () {
     }
   )
 
-  // 2. | 撤销 | 重做 | 格式刷 | 清除格式 |
+  // 2. | 打开 | 保存 | 撤销 | 重做 | 格式刷 | 清除格式 |
+  
+  // 打开文档功能
+  const openDom = document.querySelector<HTMLDivElement>('.menu-item__open')!
+  openDom.onclick = function () {
+    console.log('open document')
+    
+    // 创建文件输入元素
+    const fileInput = document.createElement('input')
+    fileInput.type = 'file'
+    fileInput.accept = '.json,.txt'
+    fileInput.style.display = 'none'
+    
+    fileInput.onchange = function (event) {
+      const file = (event.target as HTMLInputElement).files?.[0]
+      if (!file) return
+      
+      const reader = new FileReader()
+      reader.onload = function (e) {
+        try {
+          const content = e.target?.result as string
+          let editorData
+          
+          // 尝试解析JSON格式
+          try {
+            editorData = JSON.parse(content)
+          } catch {
+            // 如果不是JSON，作为纯文本处理
+            editorData = {
+              main: [{ value: content }]
+            }
+          }
+          
+          // 设置编辑器内容
+          instance.command.executeSetValue(editorData)
+          console.log('文档已打开')
+        } catch (error) {
+          console.error('打开文档失败:', error)
+          alert('打开文档失败，请检查文件格式')
+        }
+      }
+      
+      reader.readAsText(file)
+      document.body.removeChild(fileInput)
+    }
+    
+    document.body.appendChild(fileInput)
+    fileInput.click()
+  }
+
+  // 保存文档功能
+  const saveDom = document.querySelector<HTMLDivElement>('.menu-item__save')!
+  saveDom.onclick = function () {
+    console.log('save document')
+    
+    try {
+      // 获取编辑器内容
+      const editorValue = instance.command.getValue()
+      const content = JSON.stringify(editorValue.data, null, 2)
+      
+      // 创建下载链接
+      const blob = new Blob([content], { type: 'application/json' })
+      const url = URL.createObjectURL(blob)
+      
+      const downloadLink = document.createElement('a')
+      downloadLink.href = url
+      downloadLink.download = `document_${new Date().toISOString().slice(0, 19).replace(/:/g, '-')}.json`
+      downloadLink.style.display = 'none'
+      
+      document.body.appendChild(downloadLink)
+      downloadLink.click()
+      document.body.removeChild(downloadLink)
+      
+      // 清理URL对象
+      URL.revokeObjectURL(url)
+      console.log('文档已保存')
+    } catch (error) {
+      console.error('保存文档失败:', error)
+      alert('保存文档失败')
+    }
+  }
+
   const undoDom = document.querySelector<HTMLDivElement>('.menu-item__undo')!
   undoDom.title = `撤销(${isApple ? '⌘' : 'Ctrl'}+Z)`
   undoDom.onclick = function () {