From 794f03be4014df98856295c6ac48af662446092e Mon Sep 17 00:00:00 2001
From: shikong <919411476@qq.com>
Date: Tue, 20 Feb 2024 01:37:03 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E4=BF=9D=E5=AD=98=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/markdown/tui-editor.vue    | 93 ++++++++++++++-----
 frontend/src/i18n/locales/en.json             |  4 +-
 frontend/src/i18n/locales/zh-CN.json          |  4 +-
 3 files changed, 78 insertions(+), 23 deletions(-)

diff --git a/frontend/src/components/markdown/tui-editor.vue b/frontend/src/components/markdown/tui-editor.vue
index 1fe472a..deaad47 100644
--- a/frontend/src/components/markdown/tui-editor.vue
+++ b/frontend/src/components/markdown/tui-editor.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type {Ref} from  "vue";
+import type {Ref} from "vue";
 import {onMounted, reactive, ref, watch} from "vue";
 
 // 编辑器本体
@@ -48,7 +48,7 @@ const {t, locale} = useI18n()
 
 const editorRef = ref()
 
-function initEditor(editorRef:Ref<any>){
+function initEditor(editorRef: Ref<any>) {
     let editor = new Editor({
         theme: "dark",
         el: editorRef.value,
@@ -90,7 +90,8 @@ function initEditor(editorRef:Ref<any>){
 
     return editor;
 }
-let editor:any = {}
+
+let editor: any = {}
 onMounted(() => {
     editor = initEditor(editorRef);
     watch(locale, value => {
@@ -103,10 +104,10 @@ onMounted(() => {
 })
 
 const ctx = reactive({
-    data: ""
+    openFilePath: ""
 })
 
-function openFile(){
+function openFile() {
     OpenFileDialog({
         title: `${t("general.open")} markdown ${t("general.file")}`,
         filters: [
@@ -115,55 +116,105 @@ function openFile(){
                 pattern: "*.md;*.markdown"
             }
         ]
-    }).then(path=>{
+    }).then(path => {
         console.log(path)
 
-        if(!path){
+        if (!path) {
             return
         }
 
-        useApi().readFile({path}).then(resp=>{
+        useApi().readFile({path}).then(resp => {
+            ctx.openFilePath = path
             editor.setMarkdown(resp.data)
         })
     })
 }
 
-function saveFile(){
+function getDir(path: string) {
+    let position = path.lastIndexOf("/")
+    if (position === -1) {
+        position = path.lastIndexOf("\\")
+    }
+
+    return path.substring(0, position)
+}
+
+function getFileName(path: string) {
+    let position = path.lastIndexOf("/")
+    if (position === -1) {
+        position = path.lastIndexOf("\\")
+    }
+
+    return path.substring(position + 1)
+}
+
+
+function createFile() {
     SaveFileDialog({
-        title: `${t("general.save")} markdown`,
+        title: `${t("general.new")} markdown ${t("general.file")}`,
         filters: [
             {
                 displayName: "Markdown",
                 pattern: "*.md;*.markdown"
             }
         ]
-    }).then(path=>{
-        console.log(path)
+    }).then(path => {
+        ctx.openFilePath = path
+        editor.setMarkdown("")
+    })
+}
 
-        if(!path){
-            return
-        }
+function saveFile(saveAs: boolean = false) {
 
+    function writeFile() {
         useApi().saveFile({
-            fileName: path,
+            fileName: ctx.openFilePath,
             data: new Blob([editor.getMarkdown()], {
                 type: 'text/plain'
             })
-        }).then(resp=>{
-           let res = resp.data
-            if(res.code === 200){
+        }).then(resp => {
+            let res = resp.data
+            if (res.code === 200) {
                 ElMessage.success(res.data)
             } else {
                 ElMessage.error(res.msg)
             }
         })
-    })
+    }
+
+
+    if (ctx.openFilePath && !saveAs) {
+        writeFile()
+    } else {
+        SaveFileDialog({
+            title: `${t("general.save")} markdown ${t("general.file")}`,
+            defaultDirectory: getDir(ctx.openFilePath),
+            defaultFileName: getFileName(ctx.openFilePath),
+            filters: [
+                {
+                    displayName: "Markdown",
+                    pattern: "*.md;*.markdown"
+                }
+            ]
+        }).then(path => {
+            console.log(path)
+            ctx.openFilePath = path
+
+            if (!path) {
+                return
+            }
+
+            writeFile()
+        })
+    }
 }
 </script>
 
 <template>
+    <el-button type="primary" @click="createFile">{{ t("general.new") }}</el-button>
     <el-button type="primary" @click="openFile">{{ t("general.open") }}</el-button>
-    <el-button type="success" @click="saveFile">{{ t("general.save")}}</el-button>
+    <el-button type="success" :disabled="!ctx.openFilePath" @click="saveFile()">{{ t("general.save") }}</el-button>
+    <el-button type="success" @click="saveFile(true)">{{ t("general.saveAs") }}</el-button>
     <div ref="editorRef" class="overscroll-none"/>
 </template>
 
diff --git a/frontend/src/i18n/locales/en.json b/frontend/src/i18n/locales/en.json
index 8c07f87..06598b7 100644
--- a/frontend/src/i18n/locales/en.json
+++ b/frontend/src/i18n/locales/en.json
@@ -32,6 +32,8 @@
   "general": {
     "open": "open",
     "save": "save",
-    "file": "file"
+    "saveAs": "save as",
+    "file": "file",
+    "new": "new"
   }
 }
diff --git a/frontend/src/i18n/locales/zh-CN.json b/frontend/src/i18n/locales/zh-CN.json
index 4694070..421d9dd 100644
--- a/frontend/src/i18n/locales/zh-CN.json
+++ b/frontend/src/i18n/locales/zh-CN.json
@@ -32,6 +32,8 @@
   "general": {
     "open": "打开",
     "save": "保存",
-    "file": "文件"
+    "saveAs": "另存为",
+    "file": "文件",
+    "new": "新建"
   }
 }