From 0ffa45313b5f0e5ce6b1c447a8fc720bd0affc07 Mon Sep 17 00:00:00 2001 From: zdg Date: Tue, 13 Aug 2024 09:07:28 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96-=E6=95=B0=E6=8D=AE=E7=8A=B6?= =?UTF-8?q?=E6=80=81=E5=85=B1=E4=BA=AB=20im-chat?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/index.js | 14 ++++ src/renderer/src/components/pdf/index.vue | 2 +- src/renderer/src/plugins/shareStore.js | 72 ++++++++++++++----- src/renderer/src/utils/tool.js | 17 +++-- src/renderer/src/views/classBegins/index.vue | 2 +- .../src/views/tool/components/imChat.vue | 14 ++++ .../src/views/tool/components/side.vue | 11 ++- .../src/views/tool/components/upvote.vue | 2 +- src/renderer/src/views/tool/sphere.vue | 11 ++- 9 files changed, 113 insertions(+), 32 deletions(-) create mode 100644 src/renderer/src/views/tool/components/imChat.vue diff --git a/src/main/index.js b/src/main/index.js index 653c83c..d989c55 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -243,4 +243,18 @@ function handleAll() { } } }) + // 用于监听-状态管理变化-初始同步 + ipcMain.handle('pinia-state-init', (e, wid, storeName, jsonStr) => { + // for(const curWin of BrowserWindow.getAllWindows()){ + // const id = curWin.webContents.id + // const bool = id !== e.sender.id && !curWin.isDestroyed() + // if (bool) { // 除了消息发送窗口和销毁的窗口 其他都发送 + // curWin.webContents.send('pinia-state-set', storeName, jsonStr) + // } + // } + console.log('pinia-state-init', jsonStr) + const win = BrowserWindow.fromId(wid) + console.log(win) + win.webContents.send('pinia-state-set', storeName, jsonStr) + }) } \ No newline at end of file diff --git a/src/renderer/src/components/pdf/index.vue b/src/renderer/src/components/pdf/index.vue index c686d14..720830e 100644 --- a/src/renderer/src/components/pdf/index.vue +++ b/src/renderer/src/components/pdf/index.vue @@ -393,7 +393,7 @@ defineExpose({ savaDataStore }) watchEffect(() => { - console.log(toolState.model,'监听') + console.log(toolState, '监听') watchToolState() //监听工具栏 }) diff --git a/src/renderer/src/plugins/shareStore.js b/src/renderer/src/plugins/shareStore.js index 1a43c74..0e9a72b 100644 --- a/src/renderer/src/plugins/shareStore.js +++ b/src/renderer/src/plugins/shareStore.js @@ -3,41 +3,79 @@ */ const isNode = typeof require !== 'undefined' // 是否支持node函数 const { ipcRenderer } = isNode?require('electron'):{} // app使用 +// const Remote = isNode?require('@electron/remote'):{} // 远程模块 export function shareStorePlugin({store}) { - store.$subscribe(() => { // 自动同步 + store.$subscribe((mutation, state) => { // 自动同步 + // mutation 变量包含了变化前后的状态 + // mutation.events: key newValue target oldValue oldTarget + // state 是变化后的状态 + console.log('store.$subscribe', mutation) // 在存储变化的时候执行 - const storeName = store.$id + // const storeName = store.$id + // const storeName = mutation.storeId + const { storeId: storeName, payload, events, type } = mutation // direct + // if (!Object.keys(payload).length) return + if (type != 'direct') return // 用于多窗口共享(需要共享的状态名称) const names = ['tool'] - if (names.includes(storeName)) stateSync(store) // 需要同步 + if (names.includes(storeName)) stateSync(storeName, events.key, events.newValue) // 需要同步 }) // 暴露方法-手动同步 - store.stateSync = () => stateSync(store) + store.stateSync = (storeName, key, value) => { + if (!storeName && !!key && !!value) stateSync(storeName, key, value) + else stateSyncAll(store) + } + // 暴露方法-发送当前状态-新窗口 + store.stateSyncInit = wid => stateSyncInit(wid, store) // 监听主线程消息-同步数据 stateChange(store) } -// 同步数据-发送给主线程 -function stateSync(store) { + +// 同步数据-发送给主线程-单独 +function stateSync(storeName, key, value) { + console.log('state-change', storeName, key, value) + let jsonStr = '' + if (typeof key === 'string') jsonStr = JSON.stringify({[key]:value}) + else if (typeof value === 'object') jsonStr = JSON.stringify(key) + // 通知主线程更新 + ipcRenderer?.invoke('pinia-state-change', storeName, jsonStr) +} + +// 同步数据-发送给主线程-全量更新 +function stateSyncAll(store) { const storeName = store.$id const jsonStr = JSON.stringify(store.$state) // console.log('state-change', jsonStr, storeName) // 通知主线程更新 ipcRenderer?.invoke('pinia-state-change', storeName, jsonStr) } + +// 发送当前数据状态 +function stateSyncInit(wid, store) { + const storeName = store.$id + const curJson = JSON.stringify(store.$state) // 当前数据 + // 发送同步数据给新窗口-更新状态 + ipcRenderer.invoke('pinia-state-init', wid, storeName, curJson) +} + // 同步数据-接收主线程消息 function stateChange(store) { const storeName = store.$id + // 设置更新 store-state 数据状态 + const setStateData = (jsonStr) => { + const curJson = JSON.stringify(store.$state) // 当前数据 + const isUp = curJson != jsonStr // 不同的时候才写入,不然会导致触发数据变化监听,导致死循环 + if (!isUp) return + const stateJson = JSON.parse(jsonStr) // 新数据 + // console.log('setStateData', stateJson) + // 更新状态 + store.$patch(stateJson) + // 您可以通过将其 $state 属性设置为新对象来替换 Store 的整个状态 + // store.$state = stateJson + } + // 消息监听 ipcRenderer?.on('pinia-state-set', (e, sName, jsonStr) => { - if (sName == storeName) { // 更新对应数据 - // console.log('state-set', jsonStr, sName) - const curJson = JSON.stringify(store.$state) // 当前数据 - const isUp = curJson != jsonStr // 不同的时候才写入,不然会导致触发数据变化监听,导致死循环 - if (!isUp) return - const stateJson = JSON.parse(jsonStr) // 新数据 - // 更新状态 - store.$patch(stateJson) - // 您可以通过将其 $state 属性设置为新对象来替换 Store 的整个状态 - // store.$state = stateJson - } + // console.log('pinia-state-set', sName, jsonStr) + sName == storeName && setStateData(jsonStr) // 更新对应数据 }) } \ No newline at end of file diff --git a/src/renderer/src/utils/tool.js b/src/renderer/src/utils/tool.js index 87ee641..30d9710 100644 --- a/src/renderer/src/utils/tool.js +++ b/src/renderer/src/utils/tool.js @@ -10,10 +10,12 @@ const isNode = typeof require !== 'undefined' // 是否支持node函数 const path = isNode?require('path'):{} const Remote = isNode?require('@electron/remote'):{} const { ipcRenderer } = isNode?require('electron'):window.electron || {} +import { useToolState } from '@/store/modules/tool' // 获取store状态 // 常用变量 const BaseUrl = isNode?process.env['ELECTRON_RENDERER_URL']+'/#':'' const isDev = isNode?process.env.NODE_ENV !== 'production':'' +const toolState = useToolState() // 获取store状态 // 暴露Remote中的属性 export const ipcMain = Remote?.ipcMain || {} @@ -163,13 +165,19 @@ export function toolWindow({url, isConsole, option={}}) { } // 创建-新窗口 let win = new Remote.BrowserWindow(config) - if (!isDev) win.loadFile(urlAll,{hash: url}) // 加载文件 - else win.loadURL(urlAll) // 加载url - win.once('ready-to-show', () => {resolve(win)}) + if (!isDev) win.loadFile(urlAll,{hash: url}) // 加载文件 + else win.loadURL(urlAll) // 加载url + win.once('ready-to-show', () => { // 窗口加载完成 + resolve(win) + }) // 主窗口关闭事件 mainWin.once('closed', () => { win.destroy()}) // 内部监听器 - win.webContents.on('did-finish-load', () => {}) + win.webContents.on('did-finish-load', () => { + setTimeout(() => { + toolState.stateSyncInit(win.id) // 同步状态 + }, 200); + }) // 内部监听器-是否打印 if (!!isConsole) { win.webContents.on('console-message', (e,leve,m,lin,s) => { @@ -194,6 +202,7 @@ const eventHandles = (type, win) => { if(onClosed) onClosed() // 自定义关闭事件 win = null }) + // 新窗口-创建事件(如:主进程加载远程服务) ipcRenderer.send('new-window', {id:win.id, type}) } diff --git a/src/renderer/src/views/classBegins/index.vue b/src/renderer/src/views/classBegins/index.vue index 5fc078a..1ec8382 100644 --- a/src/renderer/src/views/classBegins/index.vue +++ b/src/renderer/src/views/classBegins/index.vue @@ -107,7 +107,7 @@ const switchPageMode = () => { } } onMounted(async () => { - toolState.isPdfWin=true + // toolState.isPdfWin=true pdfObj.pdfUrl = getStaticUrl(route.query.path, 'user', 'selfFile', true) textbookId.value = route.query.textbookId pdfObj.bookId=textbookId.value diff --git a/src/renderer/src/views/tool/components/imChat.vue b/src/renderer/src/views/tool/components/imChat.vue new file mode 100644 index 0000000..7306754 --- /dev/null +++ b/src/renderer/src/views/tool/components/imChat.vue @@ -0,0 +1,14 @@ + + + + + \ No newline at end of file diff --git a/src/renderer/src/views/tool/components/side.vue b/src/renderer/src/views/tool/components/side.vue index 0742db6..3eb5223 100644 --- a/src/renderer/src/views/tool/components/side.vue +++ b/src/renderer/src/views/tool/components/side.vue @@ -17,8 +17,11 @@
-
- +
+ + + {{activeObj}} +
@@ -135,8 +138,4 @@ const clickHandel = (o, e) => { transform: rotate(45deg); } } -.content{ - color: red; - -} \ No newline at end of file diff --git a/src/renderer/src/views/tool/components/upvote.vue b/src/renderer/src/views/tool/components/upvote.vue index beaa0b7..7f7cfb4 100644 --- a/src/renderer/src/views/tool/components/upvote.vue +++ b/src/renderer/src/views/tool/components/upvote.vue @@ -1,5 +1,5 @@