From 1c14acf615d372e93ef076df3de3c30d80862a0c Mon Sep 17 00:00:00 2001 From: lhj <403133128@qq.com> Date: Sun, 10 Nov 2024 15:26:26 +0800 Subject: [PATCH 01/26] =?UTF-8?q?add:=E6=B7=BB=E5=8A=A0=E6=92=A4=E9=94=80?= =?UTF-8?q?=E3=80=81=E6=81=A2=E5=A4=8D=E5=92=8C=E4=BF=9D=E5=AD=98=E6=8C=89?= =?UTF-8?q?=E9=92=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- preview/views/MainView.vue | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/preview/views/MainView.vue b/preview/views/MainView.vue index 157bb7d..629d4f9 100644 --- a/preview/views/MainView.vue +++ b/preview/views/MainView.vue @@ -4,7 +4,20 @@
可视化系统
pc
- 确定 + + + + + + + + 保存 + 预览 +
From 9a365dd1a118b18ee405da3331aedcb6091591ee Mon Sep 17 00:00:00 2001 From: lhj <403133128@qq.com> Date: Sun, 10 Nov 2024 20:37:55 +0800 Subject: [PATCH 02/26] =?UTF-8?q?add:=E5=9F=BA=E6=9C=AC=E5=AE=9E=E7=8E=B0?= =?UTF-8?q?=E6=92=A4=E9=94=80=E3=80=81=E6=81=A2=E5=A4=8D=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + preview/views/MainView.vue | 6 ++-- src/stores/useSchemeStore.ts | 64 +++++++++++++++++++++++++++++++----- 3 files changed, 59 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index 3139ecc..03dc273 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "@arco-plugins/vite-vue": "^1.4.5", "@vueuse/core": "^10.11.0", + "js-sha256": "^0.11.0", "js-yaml": "^4.1.0", "lodash": "^4.17.21", "lsp-uuid": "^3.2.0", diff --git a/preview/views/MainView.vue b/preview/views/MainView.vue index 629d4f9..0f5f31d 100644 --- a/preview/views/MainView.vue +++ b/preview/views/MainView.vue @@ -5,12 +5,12 @@
pc
- + - + @@ -112,7 +112,7 @@ store.$onAction( onError, // action 抛出或拒绝的钩子 }) => { after((result) => { - console.log(`store action-${name}回调后：` + result); + // console.log(`store action-${name}回调后：` + result); }) // 如果 action 抛出或返回一个拒绝的 promise，这将触发 onError((error) => { diff --git a/src/stores/useSchemeStore.ts b/src/stores/useSchemeStore.ts index 46df15e..fc69647 100644 --- a/src/stores/useSchemeStore.ts +++ b/src/stores/useSchemeStore.ts @@ -1,5 +1,6 @@ import { defineStore } from 'pinia'; import { IPageComponent } from '@/type/IPageComponent'; +import sha256 from 'js-sha256'; // 缓存对象 const idToObjectCache = new Map(); @@ -24,18 +25,31 @@ function findObjectById(obj, targetId) { return null; // 如果没有找到，则返回null } +const HISTORY_LENGTH = 20; // 默认队列长度 + export const useSchemeStore = defineStore('scheme', { state: () => ({ components: [], previewScheme: [], - nowComponentsData: {} + nowComponentsData: {}, + history: Array(HISTORY_LENGTH).fill(null), // 循环队列 + currentIndex: -1, // 当前索引 + currentLength: 0, // 当前队列中有效元素的数量 + currentHash: '', // 当前状态的哈希值 }), + getters: { + canUndo: (state) => state.currentIndex >= 0, + canRedo: (state) => state.currentIndex < state.currentLength - 1, + }, actions: { initPreviewScheme(value) { this.previewScheme = value; this.nowComponentsData = value[0]; - // 清空缓存 idToObjectCache.clear(); + this.history.fill(null); // 初始化队列 + this.currentIndex = -1; + this.currentLength = 0; + this.currentHash = ''; // 初始化当前哈希值 }, initComponents(value) { this.components = value; @@ -53,14 +67,46 @@ export const useSchemeStore = defineStore('scheme', { return obj; }, updateScheme(id, updates) { - console.log("更新数据",JSON.stringify(updates)); - const obj = this.getSchemeObj(id); - console.log("更新目标",JSON.stringify(obj)); + const currentStateHash = this.currentHash; + const newObj = this.getSchemeObj(id); + if (newObj) { + Object.assign(newObj, updates); + } + const newStateHash = sha256(JSON.stringify(this.previewScheme)); - if (obj) { - // 更新对象属性 - Object.assign(obj, updates); - console.log("更新后目标",JSON.stringify(obj)); + // 如果新状态与当前状态不同，才保存到历史记录中 + if (currentStateHash !== newStateHash) { + this.currentHash = newStateHash; + // 如果不是最新的状态，则清除之后的所有状态 + if (this.currentIndex < this.currentLength - 1) { + this.history.fill(null, this.currentIndex + 1); + this.currentLength = this.currentIndex + 1; + } + this.currentIndex++; + this.currentLength = this.currentIndex + 1; + this.history[this.currentIndex % HISTORY_LENGTH] = JSON.parse(JSON.stringify(this.previewScheme)); + } + }, + undo() { + if (this.canUndo) { + this.currentIndex--; + const prevState = this.history[this.currentIndex % HISTORY_LENGTH]; + if (prevState) { + this.previewScheme = prevState; + this.nowComponentsData = this.previewScheme[0]; + this.currentHash = sha256(JSON.stringify(this.previewScheme)); + } + } + }, + redo() { + if (this.canRedo) { + this.currentIndex++; + const nextState = this.history[this.currentIndex % HISTORY_LENGTH]; + if (nextState) { + this.previewScheme = nextState; + this.nowComponentsData = this.previewScheme[0]; + this.currentHash = sha256(JSON.stringify(this.previewScheme)); + } } } } From c9c336ec456963f0acb3aa307b264d413fc397dd Mon Sep 17 00:00:00 2001 From: lhj <403133128@qq.com> Date: Sun, 10 Nov 2024 23:55:49 +0800 Subject: [PATCH 03/26] fix --- auto-imports.d.ts | 7 ++++++- src/stores/useSchemeStore.ts | 2 +- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/auto-imports.d.ts b/auto-imports.d.ts index 5fc130e..5e4632f 100644 --- a/auto-imports.d.ts +++ b/auto-imports.d.ts @@ -3,6 +3,7 @@ // @ts-nocheck // noinspection JSUnusedGlobalSymbols // Generated by unplugin-auto-import +// biome-ignore lint: disable export {} declare global { const EffectScope: typeof import('vue')['EffectScope'] @@ -69,6 +70,7 @@ declare global { const onStartTyping: typeof import('@vueuse/core')['onStartTyping'] const onUnmounted: typeof import('vue')['onUnmounted'] const onUpdated: typeof import('vue')['onUpdated'] + const onWatcherCleanup: typeof import('vue')['onWatcherCleanup'] const pausableWatch: typeof import('@vueuse/core')['pausableWatch'] const provide: typeof import('vue')['provide'] const provideLocal: typeof import('@vueuse/core')['provideLocal'] @@ -181,6 +183,7 @@ declare global { const useFullscreen: typeof import('@vueuse/core')['useFullscreen'] const useGamepad: typeof import('@vueuse/core')['useGamepad'] const useGeolocation: typeof import('@vueuse/core')['useGeolocation'] + const useId: typeof import('vue')['useId'] const useIdle: typeof import('@vueuse/core')['useIdle'] const useImage: typeof import('@vueuse/core')['useImage'] const useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll'] @@ -199,6 +202,7 @@ declare global { const useMemoize: typeof import('@vueuse/core')['useMemoize'] const useMemory: typeof import('@vueuse/core')['useMemory'] const useMessage: typeof import('naive-ui')['useMessage'] + const useModel: typeof import('vue')['useModel'] const useMounted: typeof import('@vueuse/core')['useMounted'] const useMouse: typeof import('@vueuse/core')['useMouse'] const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement'] @@ -248,6 +252,7 @@ declare global { const useStyleTag: typeof import('@vueuse/core')['useStyleTag'] const useSupported: typeof import('@vueuse/core')['useSupported'] const useSwipe: typeof import('@vueuse/core')['useSwipe'] + const useTemplateRef: typeof import('vue')['useTemplateRef'] const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList'] const useTextDirection: typeof import('@vueuse/core')['useTextDirection'] const useTextSelection: typeof import('@vueuse/core')['useTextSelection'] @@ -299,6 +304,6 @@ declare global { // for type re-export declare global { // @ts-ignore - export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue' + export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' import('vue') } diff --git a/src/stores/useSchemeStore.ts b/src/stores/useSchemeStore.ts index fc69647..c221e34 100644 --- a/src/stores/useSchemeStore.ts +++ b/src/stores/useSchemeStore.ts @@ -1,6 +1,6 @@ import { defineStore } from 'pinia'; import { IPageComponent } from '@/type/IPageComponent'; -import sha256 from 'js-sha256'; +import { sha256 } from 'js-sha256'; // 缓存对象 const idToObjectCache = new Map(); From 9823540dc446269d5f687620bc7723b61479d0ca Mon Sep 17 00:00:00 2001 From: lhj <403133128@qq.com> Date: Tue, 12 Nov 2024 00:09:11 +0800 Subject: [PATCH 04/26] =?UTF-8?q?add:=E6=B7=BB=E5=8A=A0=E4=BF=9D=E5=AD=98s?= =?UTF-8?q?cheme=E4=B8=BA=E5=AF=B9=E8=B1=A1=E7=9A=84=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- backend/index.js | 40 ++++++++ backend/package.json | 20 ++++ package.json | 1 + preview/views/MainView.vue | 163 +++++++++++++++++---------------- src/modules/previewScheme.json | 21 +++++ 5 files changed, 166 insertions(+), 79 deletions(-) create mode 100644 backend/index.js create mode 100644 backend/package.json create mode 100644 src/modules/previewScheme.json diff --git a/backend/index.js b/backend/index.js new file mode 100644 index 0000000..e9ba123 --- /dev/null +++ b/backend/index.js @@ -0,0 +1,40 @@ +import express from 'express'; +import bodyParser from 'body-parser'; +import cors from 'cors'; +import fs from 'fs'; +import path from 'path'; +import { fileURLToPath } from 'url'; + +const app = express(); +const PORT = 3000; + +// 获取当前文件的目录路径 +const __dirname = path.dirname(fileURLToPath(import.meta.url)); + +const FILE_PATH = path.join(__dirname, '../src/modules/previewScheme.json'); + +app.use(cors()); +app.use(bodyParser.json()); + +app.post('/save', (req, res) => { + const data = req.body; + try { + fs.writeFileSync(FILE_PATH, JSON.stringify(data, null, 2)); + res.status(200).send('Data saved successfully'); + } catch (error) { + res.status(500).send('Error saving data'); + } +}); + +app.get('/load', (req, res) => { + try { + const data = fs.readFileSync(FILE_PATH, 'utf-8'); + res.status(200).json(JSON.parse(data)); + } catch (error) { + res.status(500).send('Error loading data'); + } +}); + +app.listen(PORT, () => { + console.log(`Server is running on port ${PORT}`); +}); \ No newline at end of file diff --git a/backend/package.json b/backend/package.json new file mode 100644 index 0000000..454fa5e --- /dev/null +++ b/backend/package.json @@ -0,0 +1,20 @@ +{ + "name": "backend", + "version": "1.0.0", + "type": "module", + "main": "dist/index.js", + "scripts": { + "start": "node index.js" + }, + "dependencies": { + "body-parser": "^1.20.3", + "cors": "^2.8.5", + "express": "^4.21.1" + }, + "volta": { + "node": "22.11.0" + }, + "devDependencies": { + "@types/cors": "^2.8.17" + } +} diff --git a/package.json b/package.json index 03dc273..006426e 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "@arco-plugins/vite-vue": "^1.4.5", "@vueuse/core": "^10.11.0", + "axios": "^1.7.7", "js-sha256": "^0.11.0", "js-yaml": "^4.1.0", "lodash": "^4.17.21", diff --git a/preview/views/MainView.vue b/preview/views/MainView.vue index 0f5f31d..220416a 100644 --- a/preview/views/MainView.vue +++ b/preview/views/MainView.vue @@ -15,7 +15,7 @@ - 保存 + 保存 预览
@@ -49,12 +49,10 @@ @update="onPreviewUpdate" @stop="onPreviewStop" > - {{ component.id }} -
@@ -64,20 +62,19 @@ \ No newline at end of file diff --git a/src/stores/useSchemeStore.ts b/src/stores/useSchemeStore.ts index c221e34..ec8b2d2 100644 --- a/src/stores/useSchemeStore.ts +++ b/src/stores/useSchemeStore.ts @@ -29,6 +29,7 @@ const HISTORY_LENGTH = 20; // 默认队列长度 export const useSchemeStore = defineStore('scheme', { state: () => ({ + designerMode: true, components: [], previewScheme: [], nowComponentsData: {}, From 5550d5d450f068193ae2f6e9d7b6c7106f39041a Mon Sep 17 00:00:00 2001 From: liuhuajie Date: Wed, 13 Nov 2024 15:33:47 +0800 Subject: [PATCH 08/26] =?UTF-8?q?add:=E6=B7=BB=E5=8A=A0=E5=91=BD=E4=BB=A4?= =?UTF-8?q?=E5=90=8C=E6=97=B6=E8=BF=90=E8=A1=8C=E5=89=8D=E5=90=8E=E7=AB=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- auto-imports.d.ts | 3 +-- package.json | 2 ++ 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/auto-imports.d.ts b/auto-imports.d.ts index 5e4632f..b5f3cd1 100644 --- a/auto-imports.d.ts +++ b/auto-imports.d.ts @@ -3,7 +3,6 @@ // @ts-nocheck // noinspection JSUnusedGlobalSymbols // Generated by unplugin-auto-import -// biome-ignore lint: disable export {} declare global { const EffectScope: typeof import('vue')['EffectScope'] @@ -304,6 +303,6 @@ declare global { // for type re-export declare global { // @ts-ignore - export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' + export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue' import('vue') } diff --git a/package.json b/package.json index 006426e..28ebbce 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "version": "0.0.0", "type": "module", "scripts": { + "start:dev": "concurrently \"npm run dev\" \"cd backend && npm run start\"", "dev": "vite", "build": "vue-tsc -b && vite build", "preview": "vite preview", @@ -27,6 +28,7 @@ "@arco-design/web-vue": "^2.56.0", "@types/node": "^22.9.0", "@vitejs/plugin-vue": "^5.0.5", + "concurrently": "^9.1.0", "less": "^4.2.0", "rollup-plugin-visualizer": "^5.12.0", "sass": "^1.77.8", From e9e6822964ef2598022b215eb264a884e0bbcf41 Mon Sep 17 00:00:00 2001 From: liuhuajie Date: Wed, 13 Nov 2024 16:02:51 +0800 Subject: [PATCH 09/26] =?UTF-8?q?add:=E6=B7=BB=E5=8A=A0=E6=82=AC=E5=81=9C?= =?UTF-8?q?=E5=92=8C=E9=80=89=E5=AE=9A=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DynamicComponent.vue | 89 ++++++++++++++++++++++++++--- 1 file changed, 81 insertions(+), 8 deletions(-) diff --git a/src/components/DynamicComponent.vue b/src/components/DynamicComponent.vue index 2490af1..1ad55fd 100644 --- a/src/components/DynamicComponent.vue +++ b/src/components/DynamicComponent.vue @@ -1,7 +1,27 @@