131 lines
4.9 KiB
JavaScript
131 lines
4.9 KiB
JavaScript
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
||
import {Fragment, useEffect, useState} from "react";
|
||
import {importFile, overWriteFile, saveFileWithName} from "../../../../utils/File";
|
||
import {isEmpty} from "../../../../utils/ObjectUtils";
|
||
import {CLEAR_HISTORY_COMMAND} from "lexical";
|
||
import {TRANSFORMERS, $convertFromMarkdownString, $convertToMarkdownString,} from "@lexical/markdown";
|
||
import {getFileExtByPath, getFileFullNameByPath, getFileNameByPath} from "../../../../utils/PathOperate";
|
||
import {updatedSavedFile} from "../../../../redux/tableBarItem_reducer";
|
||
import {useDispatch, useSelector} from "react-redux";
|
||
import md5 from "md5"
|
||
import {message} from "antd";
|
||
const {ipcRenderer} = window.require('electron')
|
||
import "./ToobarPlugin.less"
|
||
import {newFileAdd, updateFileMd5} from "../../../../redux/dirMessage_reducer";
|
||
const SaveFilePlugin=(props)=> {
|
||
let activeKey = useSelector(state => state.tableBarItem.activeKey);
|
||
const dispatch = useDispatch();
|
||
// const [messageApi,contextHolder] = message.useMessage();
|
||
const [editor] = useLexicalComposerContext();
|
||
const [editorState,setEditorState]=useState();
|
||
|
||
function onChange(editorState) {
|
||
|
||
if (!isEmpty(props.filePath)&&props.filePath.endsWith(".md")){
|
||
let read = editorState.read(() => $convertToMarkdownString(TRANSFORMERS));
|
||
setEditorState(read)
|
||
}else {
|
||
// Call toJSON on the EditorState object, which produces a serialization safe string
|
||
const editorStateJSON = editorState.toJSON();
|
||
console.log('onChange-editorStateJSON')
|
||
// However, we still have a JavaScript object, so we need to convert it to an actual string with JSON.stringify
|
||
setEditorState(JSON.stringify(editorStateJSON));
|
||
}
|
||
}
|
||
|
||
const saveFile = (event, args) => {
|
||
console.log("event,args:", event, args)
|
||
if (args !== "CTRL+S") {
|
||
return
|
||
}
|
||
let filePath = props.filePath;
|
||
if (!isEmpty(filePath)&&filePath !== activeKey) {
|
||
console.log("文件不同", filePath, activeKey)
|
||
return;
|
||
}
|
||
console.log("触发保存filePath:", filePath)
|
||
if (isEmpty(editorState)) {
|
||
return
|
||
}
|
||
let resultSave;
|
||
|
||
|
||
// 如果文件地址为空需要用户选择目录并设置文件。
|
||
if (!filePath) {
|
||
let saveDialogReturnValuePromise = saveFileWithName();
|
||
console.log("saveDialogReturnValuePromise", saveDialogReturnValuePromise)
|
||
saveDialogReturnValuePromise.then(result => {
|
||
if (!result.canceled) {
|
||
let filePath =result.filePath
|
||
let fileExt = getFileExtByPath(result.filePath)
|
||
if (isEmpty(fileExt)){
|
||
filePath = filePath+".lexical"
|
||
}
|
||
if (filePath.endsWith(".md")){
|
||
resultSave=editorState
|
||
}else {
|
||
const editorStateSave = {"editorState": JSON.parse(editorState)};
|
||
resultSave = JSON.stringify(editorStateSave);
|
||
}
|
||
overWriteFile(filePath, resultSave)
|
||
// 修改当前文件名
|
||
dispatch(updatedSavedFile({filePath: filePath}))
|
||
// 文件目录更新
|
||
dispatch(newFileAdd({fileName:getFileFullNameByPath(filePath),dirFlag:false,children:[],filePath: filePath,
|
||
fileId:filePath,fileMd5:md5(resultSave)}))
|
||
}
|
||
})
|
||
return
|
||
}
|
||
if (props.filePath.endsWith(".md")){
|
||
resultSave=editorState
|
||
}else {
|
||
const editorStateSave = {"editorState": JSON.parse(editorState)};
|
||
resultSave = JSON.stringify(editorStateSave);
|
||
}
|
||
|
||
// 后期不再读取文件，直接读取文件MD5
|
||
importFile(filePath).then(value => {
|
||
let save =true;
|
||
let oldFileMd5
|
||
let newFileMd5 =md5(resultSave)
|
||
if (!isEmpty(value)){
|
||
if (props.filePath.endsWith(".md")){
|
||
// editorState
|
||
oldFileMd5 = md5(value.toString());
|
||
save = (isEmpty(value)) || newFileMd5 !== oldFileMd5;
|
||
}else {
|
||
oldFileMd5 = md5(JSON.stringify(JSON.parse(value.toString())));
|
||
save = (isEmpty(value)) || newFileMd5 !== oldFileMd5;
|
||
}
|
||
}
|
||
if (save) {
|
||
overWriteFile(filePath, resultSave).then(()=>{
|
||
console.log("保存成功"+ filePath)
|
||
// 修改文件Md5
|
||
dispatch(updateFileMd5({filePath,"fileMd5":newFileMd5}))
|
||
// messageApi.open({type:"success",content:"保存成功：" + filePath,duration:1})
|
||
message.success("保存成功：" + filePath)
|
||
})
|
||
}
|
||
}).catch(error =>
|
||
console.error(error)
|
||
)
|
||
}
|
||
|
||
useEffect(() => {
|
||
ipcRenderer.on("pushHotkeys", saveFile);
|
||
let updateListener = editor.registerUpdateListener(({editorState}) => {
|
||
console.log("SaveFilePlugin:editorState",editorState)
|
||
onChange(editorState);
|
||
})
|
||
return () => {
|
||
console.log("销毁取消监听");
|
||
updateListener()
|
||
ipcRenderer.removeListener("pushHotkeys", saveFile)
|
||
};
|
||
},[editor,onChange]
|
||
)
|
||
}
|
||
export default SaveFilePlugin
|