From beef468477c57da94da12a26417925f17818027e Mon Sep 17 00:00:00 2001 From: shixiaohua Date: Thu, 1 Feb 2024 10:36:30 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20electron=20=E4=BF=9D=E5=AD=98=E8=A7=A6?= =?UTF-8?q?=E5=8F=91=E4=B8=80=E6=AC=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- main.js | 40 ++++++++----- package-lock.json | 2 +- package.json | 2 +- src/App.js | 2 +- src/comment/TopMenu.js | 6 ++ src/pages/Note/Hlexical/index.jsx | 98 ++++++++++--------------------- src/redux/pushHotkeys_reducer.js | 8 ++- 7 files changed, 70 insertions(+), 88 deletions(-) diff --git a/main.js b/main.js index fdad1ef..f07c0c0 100644 --- a/main.js +++ b/main.js @@ -1,18 +1,15 @@ -// npm start -const { app,Menu, BrowserWindow } = require('electron') +const {app, Menu, BrowserWindow} = require('electron') const path = require('path') const {menuRebuild} = require('./src/comment/TopMenu.js') -// const {SAVE} = require("./src/utils/HotkeyConst"); -// const {PUSH_HOTKEY} = require("./src/utils/MainContentsChannel"); const createWindow = () => { // Create the browser window. const win = new BrowserWindow({ width: 800, height: 600, webPreferences: { - nodeIntegration:true, + nodeIntegration: true, // 启用后nodeIntegration会无效 - contextIsolation:false, + contextIsolation: false, preload: path.join(__dirname, 'preload.js') } }) @@ -21,20 +18,31 @@ const createWindow = () => { win.loadURL('http://localhost:3000') // 打开开发工具 win.webContents.openDevTools() + // let okPush =false + let devToolPush = false win.webContents.on('before-input-event', (event, input) => { - if (input.control && input.key.toLowerCase() === 's') { - console.log("win.webContents.send(\"pushHotkeys\",\"CTRL+S\")") - win.webContents.send("pushHotkeys","CTRL+S") - // event.preventDefault() + console.log("input.type.toLowerCase()", input) + if (input.control && input.key.toLowerCase() === 's' && input.type.toLowerCase() === "keydown" && input.isAutoRepeat === false) { + // if (input.type.toLowerCase()==="keydown"&& !okPush){ + win.webContents.send("pushHotkeys", "CTRL+S") + console.log("pushHotkeys", "CTRL+S", input.type) + // } + event.preventDefault() } - console.log('Pressed ',input.key) - if (input.key.toUpperCase()==='F5'){ + // console.log('Pressed ',input.key) + if (input.key.toUpperCase() === 'F5') { win.reload() } - if (input.key.toUpperCase()==='F12'){ - if (win.webContents.isDevToolsOpened()){ + if (input.key.toUpperCase() === 'F12') { + if (input.type.toLowerCase() === "keydown") { + devToolPush = true; + } else { + devToolPush = false; + } + if (win.webContents.isDevToolsOpened() && !devToolPush) { win.webContents.closeDevTools() - }else { + } + if (!win.webContents.isDevToolsOpened() && !devToolPush) { win.webContents.openDevTools() } } @@ -51,7 +59,7 @@ app.whenReady().then(() => { // 点击托盘图标时通常会重新创建一个新窗口 app.on('activate', () => { if (BrowserWindow.getAllWindows().length === 0) createWindow() - }) + }) }) // 除了 macOS 外，当所有窗口都被关闭的时候退出程序。 因此, 通常 // 对应用程序和它们的菜单栏来说应该时刻保持激活状态, diff --git a/package-lock.json b/package-lock.json index 07d0214..40e890f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,7 +39,7 @@ "formik": "^2.2.9", "lexical": "^0.12.2", "localStorage": "^1.0.4", - "nanoid": "^4.0.1", + "nanoid": "^4.0.2", "prop-types": "^15.8.1", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/package.json b/package.json index 199a392..12b2077 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ "formik": "^2.2.9", "lexical": "^0.12.2", "localStorage": "^1.0.4", - "nanoid": "^4.0.1", + "nanoid": "^4.0.2", "prop-types": "^15.8.1", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/src/App.js b/src/App.js index 3bf7043..8359ab1 100644 --- a/src/App.js +++ b/src/App.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {useId} from 'react'; import routes from './routes' import {Outlet, useNavigate, useRoutes} from 'react-router-dom' import useIpcRenderer from '../src/utils/useIpcRenderer' diff --git a/src/comment/TopMenu.js b/src/comment/TopMenu.js index 6f7544f..172b88a 100644 --- a/src/comment/TopMenu.js +++ b/src/comment/TopMenu.js @@ -68,6 +68,12 @@ exports.menuRebuild = (mainWindow) => { }) } }, + { + label: '保存文件', + accelerator: 'Ctrl+S', + click: () => { // console.log('Electron rocks!') + } + }, { label: '全部应用', click: () => { diff --git a/src/pages/Note/Hlexical/index.jsx b/src/pages/Note/Hlexical/index.jsx index 7829965..a96a61b 100644 --- a/src/pages/Note/Hlexical/index.jsx +++ b/src/pages/Note/Hlexical/index.jsx @@ -7,28 +7,19 @@ import {AutoFocusPlugin} from "@lexical/react/LexicalAutoFocusPlugin"; import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary"; import TreeViewPlugin from "./plugins/TreeViewPlugin"; import ToolbarPlugin from "./plugins/ToolbarPlugin"; -import {Button} from "antd"; import {HeadingNode, QuoteNode} from "@lexical/rich-text"; import {TableCellNode, TableNode, TableRowNode} from "@lexical/table"; import {ListItemNode, ListNode} from "@lexical/list"; import {CodeHighlightNode, CodeNode} from "@lexical/code"; import {AutoLinkNode, LinkNode} from "@lexical/link"; -import {LinkPlugin} from "@lexical/react/LexicalLinkPlugin"; -import {ListPlugin} from "@lexical/react/LexicalListPlugin"; import {MarkdownShortcutPlugin} from "@lexical/react/LexicalMarkdownShortcutPlugin"; import {TRANSFORMERS} from "@lexical/markdown"; import "./index.less" -import ListMaxIndentLevelPlugin from "./plugins/ListMaxIndentLevelPlugin"; -import CodeHighlightPlugin from "./plugins/CodeHighlightPlugin"; -import AutoLinkPlugin from "./plugins/AutoLinkPlugin"; -import {useEffect, useState} from 'react'; +import {useEffect, useId, useState} from 'react'; import {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext'; import {importFile, overWriteFile} from "../../../utils/File" import {CLEAR_HISTORY_COMMAND} from "lexical"; -import ActionPlugin from "../../../components/ActionPlug" -import {func} from "prop-types"; import store from "../../../redux/store"; - import {SAVE} from "../../../utils/HotkeyConst"; import md5 from "md5" import {isEmpty} from "../../../utils/ObjectUtils"; @@ -85,43 +76,15 @@ function ImportFilePlugin(props) { }, []) } -function SaveFilePlugin(props) { - useEffect(() => { - store.subscribe(() => { - console.log("触发保存") - let data = store.getState().pushHotkeys.data; - console.log("props.editorState",props.editorState) - if (isEmpty(props.editorState)){ - return - } - const editorState = {"editorState":JSON.parse(props.editorState)}; - let resultSave = JSON.stringify(editorState); - console.log("data === SAVE",data,SAVE,data === SAVE) - if (data === SAVE) { - importFile(props.filePath).then(value => { - let save = md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString()))); - console.log("md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())))",resultSave,save) - if (save){ - console.log("保存重写") - overWriteFile(props.filePath, resultSave) - } - }).catch(error => - console.error(error) - ) - - } - }) - }, props) -} // 从字符串化 JSON 设置编辑器状态 // const editorState = editor.parseEditorState(editorStateJSONString); // editor.setEditorState(editorState); export default function Hlexical(props) { - console.log("this.props.filePath:", props.filePath) - const [editorState, setEditorState] = useState(); - + console.log("this.props.filePath=============:", props.filePath) + const [editorState, setEditorState] = useState(""); + const [lastId ,setLastId]= useState(""); function onChange(editorState) { // Call toJSON on the EditorState object, which produces a serialization safe string const editorStateJSON = editorState.toJSON(); @@ -130,31 +93,32 @@ export default function Hlexical(props) { setEditorState(JSON.stringify(editorStateJSON)); } - store.subscribe(() => { - console.log("触发保存") - let data = store.getState().pushHotkeys.data; - console.log("props.editorState",editorState) - if (isEmpty(editorState)){ - return - } - const editorStateSave = {"editorState":JSON.parse(editorState)}; - console.log("editorStateSave",editorStateSave) - let resultSave = JSON.stringify(editorStateSave); - console.log("data === SAVE",resultSave,data === SAVE) - if (data === SAVE) { - importFile(props.filePath).then(value => { - let save = md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString()))); - console.log("md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())))",resultSave,save) - if (save){ - console.log("保存重写") - overWriteFile(props.filePath, resultSave) - } - }).catch(error => - console.error(error) - ) - - } - }) + function SaveFilePlugin(props) { + let unsubscribe = store.subscribe(() => { + console.log("触发保存") + console.log("props.editorState", props) + if (isEmpty(props.editorState)) { + return + } + const editorStateSave = {"editorState": JSON.parse(props.editorState)}; + let resultSave = JSON.stringify(editorStateSave); + console.log("store.getState().pushHotkeys", store.getState().pushHotkeys) + console.log("lastId", lastId) + if ((lastId === "" || lastId !== store.getState().pushHotkeys.id) && store.getState().pushHotkeys.data === SAVE) { + setLastId(store.getState().pushHotkeys.id); + importFile(props.filePath).then(value => { + let save = md5(resultSave) !== md5(JSON.stringify(JSON.parse(value.toString()))); + console.log("md5(resultSave)!==md5(JSON.stringify(JSON.parse(value.toString())))", resultSave, save) + if (save) { + console.log("保存重写") + overWriteFile(props.filePath, resultSave) + } + }).catch(error => + console.error(error) + ) + } + }); + } return ( @@ -179,7 +143,7 @@ export default function Hlexical(props) { - {/**/} + {/**/} diff --git a/src/redux/pushHotkeys_reducer.js b/src/redux/pushHotkeys_reducer.js index 65e40cf..8bbcd5b 100644 --- a/src/redux/pushHotkeys_reducer.js +++ b/src/redux/pushHotkeys_reducer.js @@ -1,15 +1,19 @@ import { createSlice } from '@reduxjs/toolkit' +import {nanoid} from "nanoid"; export const pushHotkeysSlice = createSlice({ name: 'pushHotkeys', initialState: { - data: "" + data: "", + id: nanoid() }, reducers: { pushHotkeys: (state, action) => { - console.log("pushHotkeys:pushHotkeys", state, action) + console.log("pushHotkeys:pushHotkeys---------state", state) + console.log("pushHotkeys:pushHotkeys---------action", action) if(action.payload){ state.data = action.payload; + state.id = nanoid(); } } }