From 8e1ae068f435702b8c670b05ade5fdfbc5f6f6ab Mon Sep 17 00:00:00 2001 From: SonyLeo <746591437@qq.com> Date: Tue, 4 Mar 2025 23:13:32 -0800 Subject: [PATCH 1/5] fix: undo or reply to save button tag display logic optimization --- .../render/src/material-function/page-getter.ts | 2 ++ .../toolbars/redoundo/src/composable/useHistory.js | 14 +++++++++++--- packages/toolbars/save/src/js/index.js | 1 + packages/utils/src/constants/index.js | 1 + 4 files changed, 15 insertions(+), 3 deletions(-) diff --git a/packages/canvas/render/src/material-function/page-getter.ts b/packages/canvas/render/src/material-function/page-getter.ts index 520b577a25..1a0d1da083 100644 --- a/packages/canvas/render/src/material-function/page-getter.ts +++ b/packages/canvas/render/src/material-function/page-getter.ts @@ -1,4 +1,5 @@ import { defineComponent, h, onUnmounted, ref, watch } from 'vue' +import { constants } from '@opentiny/tiny-engine-utils' import { getController } from '../canvas-function' import RenderMain from '../RenderMain' import { handleScopedCss } from './handle-scoped-css' @@ -32,6 +33,7 @@ export const wrapPageComponent = (pageId: string) => { const asyncData = ref(null) const updateSchema = () => { fetchPageSchema(pageId).then((data) => { + localStorage.setItem(constants.PAGE_ORIGIN_SCHEMA, JSON.stringify(data)) asyncData.value = data }) } diff --git a/packages/toolbars/redoundo/src/composable/useHistory.js b/packages/toolbars/redoundo/src/composable/useHistory.js index 52860d20d4..f68b9e3126 100644 --- a/packages/toolbars/redoundo/src/composable/useHistory.js +++ b/packages/toolbars/redoundo/src/composable/useHistory.js @@ -11,6 +11,7 @@ */ import { reactive, isProxy, toRaw, watch } from 'vue' +import { constants } from '@opentiny/tiny-engine-utils' import { useCanvas } from '@opentiny/tiny-engine-meta-register' const schema2String = (schema) => { @@ -73,14 +74,12 @@ const go = (addend, valid) => { const back = () => { if (historyState.back) { go(-1) - useCanvas().setSaved(false) } } const forward = () => { if (historyState.forward) { go(1) - useCanvas().setSaved(historyState.index === list.length - 1) } } @@ -93,9 +92,17 @@ const clear = () => { }) } +const toggleSaveBadgeStatus = () => { + const { setSaved, getSchemaDiff } = useCanvas() + const initSchema = JSON.parse(localStorage.getItem(constants.PAGE_ORIGIN_SCHEMA)) + const diffContent = initSchema && getSchemaDiff(initSchema) + + setSaved(!diffContent) +} + const addHistory = (schema) => { + toggleSaveBadgeStatus() if (!schema) { - useCanvas().setSaved(false) push(useCanvas().getSchema()) } else { clear() @@ -108,6 +115,7 @@ const addHistory = (schema) => { watch( () => historyState.index, (value) => { + toggleSaveBadgeStatus() historyState.back = value > 0 historyState.forward = value < list.length - 1 } diff --git a/packages/toolbars/save/src/js/index.js b/packages/toolbars/save/src/js/index.js index c9fb5412bf..ca0bb41e9b 100644 --- a/packages/toolbars/save/src/js/index.js +++ b/packages/toolbars/save/src/js/index.js @@ -71,6 +71,7 @@ export const saveCommon = (value) => { if (isBlock()) { resetBlockCanvasState({ ...pageState, pageSchema }) } else { + localStorage.setItem(constants.PAGE_ORIGIN_SCHEMA, JSON.stringify(pageSchema)) resetPageCanvasState({ ...pageState, pageSchema }) } diff --git a/packages/utils/src/constants/index.js b/packages/utils/src/constants/index.js index e75dcb1f92..6e98d6fdb2 100644 --- a/packages/utils/src/constants/index.js +++ b/packages/utils/src/constants/index.js @@ -101,6 +101,7 @@ export const STORAGE_KEY_FIXED_PANELS = `tiny-engine-fixed-panels-${CHANNEL_UID} export const CANVAS_ROUTER_VIEW_SETTING_VIEW_MODE_KEY = `tiny-engine-canvas-router-view-setting-view-mode` export const AUTO_SAVED = 'tiny-engine-auto-saved' +export const PAGE_ORIGIN_SCHEMA = 'tiny-engine-page-origin-schema' export const TYPES = { ErrorType: 'error', From 34af5a32c6ecbfdc0fa1b0a3139989ccf24c112b Mon Sep 17 00:00:00 2001 From: SonyLeo <746591437@qq.com> Date: Tue, 4 Mar 2025 23:45:50 -0800 Subject: [PATCH 2/5] fix: add dependency --- packages/toolbars/redoundo/package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/toolbars/redoundo/package.json b/packages/toolbars/redoundo/package.json index c1887a5e95..5047a4a685 100644 --- a/packages/toolbars/redoundo/package.json +++ b/packages/toolbars/redoundo/package.json @@ -26,7 +26,8 @@ "homepage": "https://opentiny.design/tiny-engine", "dependencies": { "@opentiny/tiny-engine-common": "workspace:*", - "@opentiny/tiny-engine-meta-register": "workspace:*" + "@opentiny/tiny-engine-meta-register": "workspace:*", + "@opentiny/tiny-engine-utils": "workspace:*" }, "devDependencies": { "@opentiny/tiny-engine-vite-plugin-meta-comments": "workspace:*", From f77856ab946782a109bbdd0a4b684472ac118f7b Mon Sep 17 00:00:00 2001 From: SonyLeo <746591437@qq.com> Date: Thu, 6 Mar 2025 02:32:22 -0800 Subject: [PATCH 3/5] fix: review --- .../canvas/DesignCanvas/src/api/useCanvas.js | 5 ++ .../src/material-function/page-getter.ts | 1 - .../plugins/block/src/composable/useBlock.js | 6 ++ packages/toolbars/redoundo/package.json | 3 +- .../redoundo/src/composable/useHistory.js | 11 ---- packages/toolbars/save/src/Main.vue | 56 +++++++++++++++++-- packages/toolbars/save/src/js/index.js | 1 - packages/utils/src/constants/index.js | 1 - 8 files changed, 63 insertions(+), 21 deletions(-) diff --git a/packages/canvas/DesignCanvas/src/api/useCanvas.js b/packages/canvas/DesignCanvas/src/api/useCanvas.js index 67fe01fa9b..63009839d4 100644 --- a/packages/canvas/DesignCanvas/src/api/useCanvas.js +++ b/packages/canvas/DesignCanvas/src/api/useCanvas.js @@ -239,6 +239,11 @@ const initData = (schema = { ...defaultSchema }, currentPage) => { }) } + publish({ + topic: 'pageOrBlockInit', + data: schema + }) + useHistory().addHistory(schema) } diff --git a/packages/canvas/render/src/material-function/page-getter.ts b/packages/canvas/render/src/material-function/page-getter.ts index 1a0d1da083..17254bc8a9 100644 --- a/packages/canvas/render/src/material-function/page-getter.ts +++ b/packages/canvas/render/src/material-function/page-getter.ts @@ -33,7 +33,6 @@ export const wrapPageComponent = (pageId: string) => { const asyncData = ref(null) const updateSchema = () => { fetchPageSchema(pageId).then((data) => { - localStorage.setItem(constants.PAGE_ORIGIN_SCHEMA, JSON.stringify(data)) asyncData.value = data }) } diff --git a/packages/plugins/block/src/composable/useBlock.js b/packages/plugins/block/src/composable/useBlock.js index b30da4dda0..7b8ca981a7 100644 --- a/packages/plugins/block/src/composable/useBlock.js +++ b/packages/plugins/block/src/composable/useBlock.js @@ -24,6 +24,7 @@ import { useTranslate, useBreadcrumb, useLayout, + useMessage, getMetaApi, META_APP, getMergeMeta, @@ -297,6 +298,11 @@ const initBlock = async (block = {}, _langs = {}, isEdit) => { addBlock(block) setSaved(false) } + + useMessage().publish({ + topic: 'pageOrBlockInit', + data: block.content + }) } const createBlock = ({ name_cn, label, path, categories }) => { diff --git a/packages/toolbars/redoundo/package.json b/packages/toolbars/redoundo/package.json index 5047a4a685..c1887a5e95 100644 --- a/packages/toolbars/redoundo/package.json +++ b/packages/toolbars/redoundo/package.json @@ -26,8 +26,7 @@ "homepage": "https://opentiny.design/tiny-engine", "dependencies": { "@opentiny/tiny-engine-common": "workspace:*", - "@opentiny/tiny-engine-meta-register": "workspace:*", - "@opentiny/tiny-engine-utils": "workspace:*" + "@opentiny/tiny-engine-meta-register": "workspace:*" }, "devDependencies": { "@opentiny/tiny-engine-vite-plugin-meta-comments": "workspace:*", diff --git a/packages/toolbars/redoundo/src/composable/useHistory.js b/packages/toolbars/redoundo/src/composable/useHistory.js index f68b9e3126..ae707deb11 100644 --- a/packages/toolbars/redoundo/src/composable/useHistory.js +++ b/packages/toolbars/redoundo/src/composable/useHistory.js @@ -11,7 +11,6 @@ */ import { reactive, isProxy, toRaw, watch } from 'vue' -import { constants } from '@opentiny/tiny-engine-utils' import { useCanvas } from '@opentiny/tiny-engine-meta-register' const schema2String = (schema) => { @@ -92,16 +91,7 @@ const clear = () => { }) } -const toggleSaveBadgeStatus = () => { - const { setSaved, getSchemaDiff } = useCanvas() - const initSchema = JSON.parse(localStorage.getItem(constants.PAGE_ORIGIN_SCHEMA)) - const diffContent = initSchema && getSchemaDiff(initSchema) - - setSaved(!diffContent) -} - const addHistory = (schema) => { - toggleSaveBadgeStatus() if (!schema) { push(useCanvas().getSchema()) } else { @@ -115,7 +105,6 @@ const addHistory = (schema) => { watch( () => historyState.index, (value) => { - toggleSaveBadgeStatus() historyState.back = value > 0 historyState.forward = value < list.length - 1 } diff --git a/packages/toolbars/save/src/Main.vue b/packages/toolbars/save/src/Main.vue index d15a558974..af6bf2edd3 100644 --- a/packages/toolbars/save/src/Main.vue +++ b/packages/toolbars/save/src/Main.vue @@ -58,7 +58,7 @@ import { reactive, ref, onUnmounted, onMounted } from 'vue' import { VueMonaco } from '@opentiny/tiny-engine-common' import { Button, Popover, DialogBox, Checkbox, Select } from '@opentiny/vue' -import { useCanvas } from '@opentiny/tiny-engine-meta-register' +import { useCanvas, useMessage } from '@opentiny/tiny-engine-meta-register' import { ToolbarBase } from '@opentiny/tiny-engine-common' import { openCommon, saveCommon } from './js/index' import { isLoading, setAutoSaveStatus, getAutoSaveStatus } from './js/index' @@ -90,8 +90,6 @@ export default { } }, setup() { - const { isSaved } = useCanvas() - const delayOptions = [ { value: 5, label: '5分钟' }, { value: 10, label: '10分钟' }, @@ -101,14 +99,62 @@ export default { visible: false, code: '', originalCode: '', - disabled: false, - timeValue: 5, checked: false, + timeValue: 5, preservationTime: null }) const editor = ref(null) + const { isSaved, setSaved, getSchemaDiff } = useCanvas() + + const { subscribe, unsubscribe } = useMessage() + const subscriber = 'toolbar-save' + + let initSchema = ref(null) + + onMounted(() => { + // 订阅页面/区块初始化事件 + subscribe({ + topic: 'pageOrBlockInit', + subscriber, + callback: (schema) => { + initSchema.value = JSON.parse(JSON.stringify(schema)) + setSaved(true) // 初始化时标记为已保存 + } + }) + + // 订阅 schema 变更事件 + subscribe({ + topic: 'schemaChange', + subscriber, + callback: () => { + if (initSchema.value) { + const diff = getSchemaDiff(initSchema.value) + setSaved(!diff) + } + } + }) + + // 订阅 schema 导入事件 + subscribe({ + topic: 'schemaImport', + subscriber, + callback: () => { + if (initSchema.value) { + const diff = getSchemaDiff(initSchema.value) + setSaved(!diff) + } + } + }) + }) + + onUnmounted(() => { + unsubscribe({ topic: 'pageOrBlockInit', subscriber }) + unsubscribe({ topic: 'schemaChange', subscriber }) + unsubscribe({ topic: 'schemaImport', subscriber }) + }) + const close = () => { state.visible = false state.originalCode = '' diff --git a/packages/toolbars/save/src/js/index.js b/packages/toolbars/save/src/js/index.js index ca0bb41e9b..c9fb5412bf 100644 --- a/packages/toolbars/save/src/js/index.js +++ b/packages/toolbars/save/src/js/index.js @@ -71,7 +71,6 @@ export const saveCommon = (value) => { if (isBlock()) { resetBlockCanvasState({ ...pageState, pageSchema }) } else { - localStorage.setItem(constants.PAGE_ORIGIN_SCHEMA, JSON.stringify(pageSchema)) resetPageCanvasState({ ...pageState, pageSchema }) } diff --git a/packages/utils/src/constants/index.js b/packages/utils/src/constants/index.js index 6e98d6fdb2..e75dcb1f92 100644 --- a/packages/utils/src/constants/index.js +++ b/packages/utils/src/constants/index.js @@ -101,7 +101,6 @@ export const STORAGE_KEY_FIXED_PANELS = `tiny-engine-fixed-panels-${CHANNEL_UID} export const CANVAS_ROUTER_VIEW_SETTING_VIEW_MODE_KEY = `tiny-engine-canvas-router-view-setting-view-mode` export const AUTO_SAVED = 'tiny-engine-auto-saved' -export const PAGE_ORIGIN_SCHEMA = 'tiny-engine-page-origin-schema' export const TYPES = { ErrorType: 'error', From 692cf0f53e466a48da588af9645bdbb04c0066e4 Mon Sep 17 00:00:00 2001 From: SonyLeo <746591437@qq.com> Date: Thu, 6 Mar 2025 02:43:38 -0800 Subject: [PATCH 4/5] fix: remove extra import --- packages/canvas/render/src/material-function/page-getter.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/canvas/render/src/material-function/page-getter.ts b/packages/canvas/render/src/material-function/page-getter.ts index 17254bc8a9..520b577a25 100644 --- a/packages/canvas/render/src/material-function/page-getter.ts +++ b/packages/canvas/render/src/material-function/page-getter.ts @@ -1,5 +1,4 @@ import { defineComponent, h, onUnmounted, ref, watch } from 'vue' -import { constants } from '@opentiny/tiny-engine-utils' import { getController } from '../canvas-function' import RenderMain from '../RenderMain' import { handleScopedCss } from './handle-scoped-css' From 5fecc8b633087942d16a4e1103f69df50e6203d8 Mon Sep 17 00:00:00 2001 From: SonyLeo <746591437@qq.com> Date: Thu, 6 Mar 2025 03:51:18 -0800 Subject: [PATCH 5/5] fix: review --- packages/toolbars/save/src/Main.vue | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/toolbars/save/src/Main.vue b/packages/toolbars/save/src/Main.vue index af6bf2edd3..fa184973b6 100644 --- a/packages/toolbars/save/src/Main.vue +++ b/packages/toolbars/save/src/Main.vue @@ -106,12 +106,12 @@ export default { const editor = ref(null) - const { isSaved, setSaved, getSchemaDiff } = useCanvas() + const { isSaved, setSaved, getSchema } = useCanvas() const { subscribe, unsubscribe } = useMessage() const subscriber = 'toolbar-save' - let initSchema = ref(null) + const originSchema = ref(null) onMounted(() => { // 订阅页面/区块初始化事件 @@ -119,7 +119,7 @@ export default { topic: 'pageOrBlockInit', subscriber, callback: (schema) => { - initSchema.value = JSON.parse(JSON.stringify(schema)) + originSchema.value = JSON.stringify(schema) setSaved(true) // 初始化时标记为已保存 } }) @@ -129,9 +129,9 @@ export default { topic: 'schemaChange', subscriber, callback: () => { - if (initSchema.value) { - const diff = getSchemaDiff(initSchema.value) - setSaved(!diff) + if (originSchema.value) { + const hasChange = JSON.stringify(getSchema()) === originSchema.value + setSaved(hasChange) } } }) @@ -141,9 +141,9 @@ export default { topic: 'schemaImport', subscriber, callback: () => { - if (initSchema.value) { - const diff = getSchemaDiff(initSchema.value) - setSaved(!diff) + if (originSchema.value) { + const hasChange = JSON.stringify(getSchema()) === originSchema.value + setSaved(hasChange) } } })