From 77a919c60dd957efca8c50fa4e71b618b43250b3 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Wed, 26 May 2021 18:12:22 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=94=BB=E5=B8=83=E6=A0=B7=E5=BC=8F?=
=?UTF-8?q?=E4=BF=AE=E6=94=B9=20=E4=B9=9F=E8=AE=B0=E5=BD=95=E9=95=9C?=
=?UTF-8?q?=E5=83=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../src/components/canvas/store/snapshot.js | 65 +++++++++++--------
.../PanelStyle/BackgroundSelector.vue | 9 +--
.../PreSubject/SubjectTemplateItem.vue | 1 +
.../src/views/panel/SubjectSetting/index.vue | 3 +-
frontend/src/views/panel/edit/index.vue | 3 +-
frontend/src/views/panel/list/PanelList.vue | 3 +-
6 files changed, 51 insertions(+), 33 deletions(-)
diff --git a/frontend/src/components/canvas/store/snapshot.js b/frontend/src/components/canvas/store/snapshot.js
index ce05e6cc80..a90f16025a 100644
--- a/frontend/src/components/canvas/store/snapshot.js
+++ b/frontend/src/components/canvas/store/snapshot.js
@@ -2,32 +2,45 @@ import store from '@/store/index'
import { deepCopy } from '@/components/canvas/utils/utils'
export default {
- state: {
- snapshotData: [], // 编辑器快照数据
- snapshotIndex: -1, // 快照索引
- },
- mutations: {
- undo(state) {
- if (state.snapshotIndex >= 0) {
- state.snapshotIndex--
- store.commit('setComponentData', deepCopy(state.snapshotData[state.snapshotIndex]))
- }
- },
+ state: {
+ snapshotData: [], // 编辑器快照数据
+ snapshotStyleData: [], // 样式改变也记录快照
+ snapshotIndex: -1 // 快照索引
- redo(state) {
- if (state.snapshotIndex < state.snapshotData.length - 1) {
- state.snapshotIndex++
- store.commit('setComponentData', deepCopy(state.snapshotData[state.snapshotIndex]))
- }
- },
-
- recordSnapshot(state) {
- // 添加新的快照
- state.snapshotData[++state.snapshotIndex] = deepCopy(state.componentData)
- // 在 undo 过程中，添加新的快照时，要将它后面的快照清理掉
- if (state.snapshotIndex < state.snapshotData.length - 1) {
- state.snapshotData = state.snapshotData.slice(0, state.snapshotIndex + 1)
- }
- },
+ },
+ mutations: {
+ undo(state) {
+ state.snapshotIndex--
+ if (state.snapshotIndex >= 0) {
+ store.commit('setComponentData', deepCopy(state.snapshotData[state.snapshotIndex]))
+ store.commit('setCanvasStyle', deepCopy(state.snapshotStyleData[state.snapshotIndex]))
+ }
},
+
+ redo(state) {
+ if (state.snapshotIndex < state.snapshotData.length - 1) {
+ state.snapshotIndex++
+ store.commit('setComponentData', deepCopy(state.snapshotData[state.snapshotIndex]))
+ store.commit('setCanvasStyle', deepCopy(state.snapshotStyleData[state.snapshotIndex]))
+ }
+ },
+
+ recordSnapshot(state) {
+ // 添加新的快照
+ state.snapshotData[++state.snapshotIndex] = deepCopy(state.componentData)
+ state.snapshotStyleData[state.snapshotIndex] = deepCopy(state.canvasStyleData)
+ // 在 undo 过程中，添加新的快照时，要将它后面的快照清理掉
+ if (state.snapshotIndex < state.snapshotData.length - 1) {
+ state.snapshotData = state.snapshotData.slice(0, state.snapshotIndex + 1)
+ state.snapshotStyleData = state.snapshotStyleData.slice(0, state.snapshotIndex + 1)
+ }
+ },
+
+ refreshSnapshot(state) {
+ // 刷新快照
+ state.snapshotData = []
+ state.snapshotStyleData = []
+ state.snapshotIndex = -1
+ }
+ }
}
diff --git a/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue b/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue
index ed47c0f199..e48ecd3e0b 100644
--- a/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue
+++ b/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue
@@ -9,7 +9,7 @@
- {{$t('chart.color')}}
+ {{ $t('chart.color') }}
@@ -17,7 +17,7 @@
- {{$t('panel.photo')}}
+ {{ $t('panel.photo') }}
- {{$t('chart.background')}}
+ {{ $t('chart.background') }}
@@ -71,7 +71,7 @@ export default {
created() {
// 初始化赋值
this.panel = this.canvasStyleData.panel
- if (this.panel.imageUrl) {
+ if (this.panel.imageUrl && typeof (this.panel.imageUrl) === 'string') {
this.fileList.push({ url: this.panel.imageUrl })
}
},
@@ -80,6 +80,7 @@ export default {
const canvasStyleData = deepCopy(this.canvasStyleData)
canvasStyleData.panel = this.panel
this.$store.commit('setCanvasStyle', canvasStyleData)
+ this.$store.commit('recordSnapshot')
},
onChangeType() {
this.commitStyle()
diff --git a/frontend/src/views/panel/SubjectSetting/PreSubject/SubjectTemplateItem.vue b/frontend/src/views/panel/SubjectSetting/PreSubject/SubjectTemplateItem.vue
index 3d07f9605a..970b1031c0 100644
--- a/frontend/src/views/panel/SubjectSetting/PreSubject/SubjectTemplateItem.vue
+++ b/frontend/src/views/panel/SubjectSetting/PreSubject/SubjectTemplateItem.vue
@@ -188,6 +188,7 @@ export default {
},
subjectChange() {
this.$store.commit('setCanvasStyle', JSON.parse(this.subjectItem.details))
+ this.$store.commit('recordSnapshot')
},
templateEdit() {
this.$emit('templateEdit', this.template)
diff --git a/frontend/src/views/panel/SubjectSetting/index.vue b/frontend/src/views/panel/SubjectSetting/index.vue
index 4af453b3ea..5cc6c00077 100644
--- a/frontend/src/views/panel/SubjectSetting/index.vue
+++ b/frontend/src/views/panel/SubjectSetting/index.vue
@@ -11,7 +11,7 @@
-
+
@@ -112,6 +112,7 @@ export default {
chart.customFilter = JSON.stringify(this.chart.customFilter)
canvasStyleData.chart = chart
this.$store.commit('setCanvasStyle', canvasStyleData)
+ this.$store.commit('recordSnapshot')
}
}
}
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index e9fbbb5b36..bad0f95ca6 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -72,7 +72,7 @@
>
-
+