From ff02cb9a1ff0038899538fcbb740987974ab82ea Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Thu, 8 Apr 2021 17:46:02 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E7=A6=81=E7=94=A8localstorage=E5=AD=98?= =?UTF-8?q?=E5=82=A8=E4=BB=AA=E8=A1=A8=E7=9B=98=E6=95=B0=E6=8D=AE=20?= =?UTF-8?q?=E5=AE=B9=E6=98=93=E5=AF=BC=E8=87=B4=E6=B5=8F=E8=A7=88=E5=99=A8?= =?UTF-8?q?=E6=9C=AC=E5=9C=B0=E5=AD=98=E5=82=A8=E8=B6=8A=E7=95=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../canvas/components/Editor/ContextMenu.vue | 4 +-- .../components/canvas/components/Toolbar.vue | 4 --- frontend/src/store/modules/panel.js | 16 ++++++++- frontend/src/views/panel/edit/index.vue | 33 ++++--------------- frontend/src/views/panel/list/PanelList.vue | 4 --- .../src/views/panel/list/PanelViewShow.vue | 3 -- 6 files changed, 24 insertions(+), 40 deletions(-) diff --git a/frontend/src/components/canvas/components/Editor/ContextMenu.vue b/frontend/src/components/canvas/components/Editor/ContextMenu.vue index c2b67f7323..e22d9b8742 100644 --- a/frontend/src/components/canvas/components/Editor/ContextMenu.vue +++ b/frontend/src/components/canvas/components/Editor/ContextMenu.vue @@ -42,8 +42,8 @@ export default { methods: { edit() { // 编辑时临时保存 当前修改的画布 - localStorage.setItem('canvasDataEditTmp', JSON.stringify(this.componentData)) - localStorage.setItem('canvasStyleEditTmp', JSON.stringify(this.canvasStyleData)) + this.$store.dispatch('panel/setComponentDataTemp', JSON.stringify(this.componentData)) + this.$store.dispatch('panel/setCanvasStyleDataTemp', JSON.stringify(this.canvasStyleData)) if (this.curComponent.component === 'user-view') { this.$store.dispatch('chart/setViewId', null) this.$store.dispatch('chart/setViewId', this.curComponent.propValue.viewId) diff --git a/frontend/src/components/canvas/components/Toolbar.vue b/frontend/src/components/canvas/components/Toolbar.vue index 826a69cdda..b04c63fa97 100644 --- a/frontend/src/components/canvas/components/Toolbar.vue +++ b/frontend/src/components/canvas/components/Toolbar.vue @@ -197,8 +197,6 @@ export default { }, save() { - localStorage.setItem('canvasData', JSON.stringify(this.componentData)) - localStorage.setItem('canvasStyle', JSON.stringify(this.canvasStyleData)) // 保存到数据库 const requestInfo = { id: this.$store.state.panel.panelInfo.id, @@ -218,8 +216,6 @@ export default { }, clickPreview() { - localStorage.setItem('canvasData', JSON.stringify(this.componentData)) - localStorage.setItem('canvasStyle', JSON.stringify(this.canvasStyleData)) const url = '#/preview' window.open(url, '_blank') } diff --git a/frontend/src/store/modules/panel.js b/frontend/src/store/modules/panel.js index 210e18be2a..2ceede7424 100644 --- a/frontend/src/store/modules/panel.js +++ b/frontend/src/store/modules/panel.js @@ -6,7 +6,9 @@ const getDefaultState = () => { id: null, name: '', preStyle: null - } + }, + canvasStyleDataTemp: null, // 页面全局临时存储数据 + componentDataTemp: null // 画布组件临时存储数据 } } @@ -18,6 +20,12 @@ const mutations = { }, setPanelInfo: (state, panelInfo) => { state.panelInfo = panelInfo + }, + setCanvasStyleDataTemp: (state, canvasStyleDataTemp) => { + state.canvasStyleDataTemp = canvasStyleDataTemp + }, + setComponentDataTemp: (state, componentDataTemp) => { + state.componentDataTemp = componentDataTemp } } @@ -27,6 +35,12 @@ const actions = { }, setPanelInfo({ commit }, panelInfo) { commit('setPanelInfo', panelInfo) + }, + setCanvasStyleDataTemp({ commit }, canvasStyleDataTemp) { + commit('setCanvasStyleDataTemp', canvasStyleDataTemp) + }, + setComponentDataTemp({ commit }, componentDataTemp) { + commit('setComponentDataTemp', componentDataTemp) } } diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue index 09ea451d50..8e1b402612 100644 --- a/frontend/src/views/panel/edit/index.vue +++ b/frontend/src/views/panel/edit/index.vue @@ -195,24 +195,18 @@ export default { }, methods: { init(panelId) { - // 清理原有画布本地数据 - localStorage.setItem('canvasData', null) - localStorage.setItem('canvasStyle', null) - // 如果临时画布有数据 则使用临时画布数据（视图编辑的时候 会保存临时画布数据） - if (localStorage.getItem('canvasDataEditTmp') && localStorage.getItem('canvasStyleEditTmp')) { - localStorage.setItem('canvasData', localStorage.getItem('canvasDataEditTmp')) - localStorage.setItem('canvasStyle', localStorage.getItem('canvasStyleEditTmp')) + const componentDataTemp = this.$store.state.panel.componentDataTemp + const canvasStyleDataTemp = this.$store.state.panel.canvasStyleDataTemp + if (componentDataTemp && canvasStyleDataTemp) { + this.$store.commit('setComponentData', this.resetID(JSON.parse(componentDataTemp))) + this.$store.commit('setCanvasStyle', JSON.parse(canvasStyleDataTemp)) } else if (panelId) { get('panel/group/findOne/' + panelId).then(response => { - localStorage.setItem('canvasData', response.data.panelData) - localStorage.setItem('canvasStyle', response.data.panelStyle) + this.$store.commit('setComponentData', this.resetID(response.data.panelData)) + this.$store.commit('setCanvasStyle', response.data.panelStyle) }) } - // 清理临时画布本地数据 - localStorage.setItem('canvasDataEditTmp', null) - localStorage.setItem('canvasStyleEditTmp', null) - this.restore() }, save() { @@ -244,19 +238,6 @@ export default { }) }, - // 画布 - restore() { - // 用保存的数据恢复画布 - let canvasData = null - if ((canvasData = localStorage.getItem('canvasData')) !== null && canvasData !== 'null') { - this.$store.commit('setComponentData', this.resetID(JSON.parse(canvasData))) - } - - if (canvasData && canvasData !== 'null') { - this.$store.commit('setCanvasStyle', JSON.parse(localStorage.getItem('canvasStyle'))) - } - }, - resetID(data) { data.forEach(item => { item.id = uuid.v1() diff --git a/frontend/src/views/panel/list/PanelList.vue b/frontend/src/views/panel/list/PanelList.vue index 34b25eb1f3..4589d347f2 100644 --- a/frontend/src/views/panel/list/PanelList.vue +++ b/frontend/src/views/panel/list/PanelList.vue @@ -420,8 +420,6 @@ export default { if (data.nodeType === 'panel') { // 加载视图数据 this.$nextTick(() => { - localStorage.setItem('canvasData', null) - localStorage.setItem('canvasStyle', null) get('panel/group/findOne/' + data.id).then(response => { this.$store.commit('setComponentData', this.resetID(JSON.parse(response.data.panelData))) this.$store.commit('setCanvasStyle', JSON.parse(response.data.panelStyle)) @@ -522,8 +520,6 @@ export default { }, edit(data) { // 清空临时画布 - localStorage.setItem('canvasDataEditTmp', null) - localStorage.setItem('canvasStyleEditTmp', null) this.$store.dispatch('panel/setPanelInfo', data) bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' }) }, diff --git a/frontend/src/views/panel/list/PanelViewShow.vue b/frontend/src/views/panel/list/PanelViewShow.vue index 98bc5b945e..166aeda4ef 100644 --- a/frontend/src/views/panel/list/PanelViewShow.vue +++ b/frontend/src/views/panel/list/PanelViewShow.vue @@ -48,9 +48,6 @@ export default { }, methods: { clickPreview() { - debugger - localStorage.setItem('canvasData', JSON.stringify(this.componentData)) - localStorage.setItem('canvasStyle', JSON.stringify(this.canvasStyleData)) const url = '#/preview/' + this.$store.state.panel.panelInfo.id window.open(url, '_blank') }