完善保存功能

This commit is contained in:
shikong 2024-02-20 01:37:03 +08:00
parent b0fa41e74a
commit 794f03be40
3 changed files with 78 additions and 23 deletions

View File

@ -90,6 +90,7 @@ function initEditor(editorRef:Ref<any>){
return editor; return editor;
} }
let editor: any = {} let editor: any = {}
onMounted(() => { onMounted(() => {
editor = initEditor(editorRef); editor = initEditor(editorRef);
@ -103,7 +104,7 @@ onMounted(() => {
}) })
const ctx = reactive({ const ctx = reactive({
data: "" openFilePath: ""
}) })
function openFile() { function openFile() {
@ -123,14 +124,34 @@ function openFile(){
} }
useApi().readFile({path}).then(resp => { useApi().readFile({path}).then(resp => {
ctx.openFilePath = path
editor.setMarkdown(resp.data) 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({ SaveFileDialog({
title: `${t("general.save")} markdown`, title: `${t("general.new")} markdown ${t("general.file")}`,
filters: [ filters: [
{ {
displayName: "Markdown", displayName: "Markdown",
@ -138,14 +159,16 @@ function saveFile(){
} }
] ]
}).then(path => { }).then(path => {
console.log(path) ctx.openFilePath = path
editor.setMarkdown("")
if(!path){ })
return
} }
function saveFile(saveAs: boolean = false) {
function writeFile() {
useApi().saveFile({ useApi().saveFile({
fileName: path, fileName: ctx.openFilePath,
data: new Blob([editor.getMarkdown()], { data: new Blob([editor.getMarkdown()], {
type: 'text/plain' type: 'text/plain'
}) })
@ -157,13 +180,41 @@ function saveFile(){
ElMessage.error(res.msg) 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> </script>
<template> <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="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"/> <div ref="editorRef" class="overscroll-none"/>
</template> </template>

View File

@ -32,6 +32,8 @@
"general": { "general": {
"open": "open", "open": "open",
"save": "save", "save": "save",
"file": "file" "saveAs": "save as",
"file": "file",
"new": "new"
} }
} }

View File

@ -32,6 +32,8 @@
"general": { "general": {
"open": "打开", "open": "打开",
"save": "保存", "save": "保存",
"file": "文件" "saveAs": "另存为",
"file": "文件",
"new": "新建"
} }
} }