diff --git a/backend/src/main/java/io/dataease/commons/constants/JdbcConstants.java b/backend/src/main/java/io/dataease/commons/constants/JdbcConstants.java index d617122096..bcef6b3333 100644 --- a/backend/src/main/java/io/dataease/commons/constants/JdbcConstants.java +++ b/backend/src/main/java/io/dataease/commons/constants/JdbcConstants.java @@ -3,4 +3,6 @@ package io.dataease.commons.constants; public class JdbcConstants { public final static String VIEW_CACHE_KEY = "view_cache"; + + public final static String PANEL_CACHE_KEY="panel_cache-"; } diff --git a/backend/src/main/java/io/dataease/controller/panel/PanelGroupController.java b/backend/src/main/java/io/dataease/controller/panel/PanelGroupController.java index 7af5c0c243..4b315e3fd9 100644 --- a/backend/src/main/java/io/dataease/controller/panel/PanelGroupController.java +++ b/backend/src/main/java/io/dataease/controller/panel/PanelGroupController.java @@ -145,5 +145,31 @@ public class PanelGroupController { public void updatePanelStatus(@PathVariable String panelId, @RequestBody PanelGroupBaseInfoRequest request) { panelGroupService.updatePanelStatus(panelId, request); } + @ApiOperation("自动缓存") + @PostMapping("/autoCache") + @DePermissions(value = { + @DePermission(type = DePermissionType.PANEL, value = "id"), + @DePermission(type = DePermissionType.PANEL, value = "pid", level = ResourceAuthLevel.PANNEL_LEVEL_MANAGE) + }, logical = Logical.AND) + public void autoCache(@RequestBody PanelGroupRequest request){ + panelGroupService.autoCache(request); + } + + @ApiOperation("查找缓存") + @GetMapping("/findUserCache/{panelId}") + public PanelGroupDTO findUserCache(@PathVariable String panelId){ + return panelGroupService.findUserPanelCache(panelId); + } + @ApiOperation("检查缓存") + @GetMapping("/checkUserCache/{panelId}") + public Boolean checkUserCache(@PathVariable String panelId){ + return panelGroupService.checkUserCache(panelId); + } + + @ApiOperation("删除缓存") + @DeleteMapping("/removePanelCache/{panelId}") + public void removePanelCache(@PathVariable String panelId){ + panelGroupService.removePanelCache(panelId); + } } diff --git a/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java b/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java index d22f24dad6..91ceb1f0fa 100644 --- a/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java +++ b/backend/src/main/java/io/dataease/service/panel/PanelGroupService.java @@ -130,6 +130,7 @@ public class PanelGroupService { clearPermissionCache(); sysAuthService.copyAuth(panelId, SysAuthConstants.AUTH_SOURCE_TYPE_PANEL); DeLogUtils.save(SysLogConstants.OPERATE_TYPE.CREATE, sourceType, panelId, request.getPid(), null, null); + this.removePanelAllCache(panelId); return panelId; } @@ -201,6 +202,7 @@ public class PanelGroupService { } DeLogUtils.save(SysLogConstants.OPERATE_TYPE.MODIFY, sourceType, request.getId(), request.getPid(), null, sourceType); } + this.removePanelAllCache(panelId); return panelId; } @@ -627,4 +629,44 @@ public class PanelGroupService { return null; } } + + /** + * @Description: Automatically save panel data to cache when editing + * */ + public void autoCache(PanelGroupRequest request){ + String cacheName = JdbcConstants.PANEL_CACHE_KEY+request.getId(); + String cacheId = AuthUtils.getUser().getUserId()+"&"+request.getId(); + CacheUtils.put(cacheName, cacheId, request, null, null); + } + + /** + * @Description: Remove panel cache for specific user + * */ + public void removePanelCache(String panelId){ + String cacheName = JdbcConstants.PANEL_CACHE_KEY+panelId; + String cacheId = AuthUtils.getUser().getUserId()+"&"+panelId; + CacheUtils.remove(cacheName,cacheId); + } + + public void removePanelAllCache(String panelId){ + String cacheName = JdbcConstants.PANEL_CACHE_KEY+panelId; + CacheUtils.removeAll(cacheName); + } + + public PanelGroupDTO findUserPanelCache(String panelId){ + String cacheName = JdbcConstants.PANEL_CACHE_KEY+panelId; + String cacheId = AuthUtils.getUser().getUserId()+"&"+panelId; + Object cache = CacheUtils.get(cacheName,cacheId); + if(cache==null){ + return null; + }else{ + return (PanelGroupRequest)cache; + } + } + public Boolean checkUserCache(String panelId){ + String cacheName = JdbcConstants.PANEL_CACHE_KEY+panelId; + String cacheId = AuthUtils.getUser().getUserId()+"&"+panelId; + Object cache = CacheUtils.get(cacheName,cacheId); + return cache!=null; + } } diff --git a/frontend/src/api/panel/panel.js b/frontend/src/api/panel/panel.js index 9d0540c325..e5e92583e7 100644 --- a/frontend/src/api/panel/panel.js +++ b/frontend/src/api/panel/panel.js @@ -144,9 +144,10 @@ export function delGroup(groupId) { }) } -export function initPanelData(panelId, callback) { +export function initPanelData(panelId, useCache = false, callback) { + const queryMethod = useCache ? findUserCacheRequest : findOne // 加载视图数据 - findOne(panelId).then(response => { + queryMethod(panelId).then(response => { // 初始化视图data和style 数据 panelInit(JSON.parse(response.data.panelData), JSON.parse(response.data.panelStyle)) // 设置当前仪表板全局信息 @@ -232,3 +233,42 @@ export function updatePanelStatus(panelId, param) { }) } +export function saveCache(data) { + return request({ + url: 'panel/group/autoCache', + method: 'post', + loading: false, + data + }) +} +export function findUserCacheRequest(panelId) { + return request({ + url: 'panel/group/findUserCache/' + panelId, + method: 'get', + loading: false + }) +} + +export function checkUserCacheRequest(panelId) { + return request({ + url: 'panel/group/checkUserCache/' + panelId, + method: 'get', + loading: false + }) +} + +export function checkUserCache(panelId, callback) { + // 加载视图数据 + checkUserCacheRequest(panelId).then(response => { + callback(response) + }) +} + +export function removePanelCache(panelId) { + return request({ + url: 'panel/group/removePanelCache/' + panelId, + method: 'delete', + loading: false + }) +} + diff --git a/frontend/src/components/canvas/components/Editor/DateFormat.vue b/frontend/src/components/canvas/components/Editor/DateFormat.vue index d141b2eb27..1902858748 100644 --- a/frontend/src/components/canvas/components/Editor/DateFormat.vue +++ b/frontend/src/components/canvas/components/Editor/DateFormat.vue @@ -122,7 +122,7 @@ export default { watch: { formatInfo: { handler(newVal, oldVla) { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') }, deep: true } diff --git a/frontend/src/components/canvas/components/Editor/EditBar.vue b/frontend/src/components/canvas/components/Editor/EditBar.vue index 4d01e81d91..6f1085da25 100644 --- a/frontend/src/components/canvas/components/Editor/EditBar.vue +++ b/frontend/src/components/canvas/components/Editor/EditBar.vue @@ -277,7 +277,7 @@ export default { setTimeout(() => { this.recordMatrixCurShadowStyle() }, 50) - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') bus.$emit('auxiliaryMatrixChange') }, // 记录当前样式 跟随阴影位置 矩阵处理 diff --git a/frontend/src/components/canvas/components/Editor/FrameLinks.vue b/frontend/src/components/canvas/components/Editor/FrameLinks.vue index 7893a1ba3e..a7aa661a5e 100644 --- a/frontend/src/components/canvas/components/Editor/FrameLinks.vue +++ b/frontend/src/components/canvas/components/Editor/FrameLinks.vue @@ -84,7 +84,7 @@ export default { } else { this.curActiveTabInner.frameLinks = this.linkInfoTemp } - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') bus.$emit('frameLinksChange-' + this.curComponent.id) this.popoverClose() }, diff --git a/frontend/src/components/canvas/components/Editor/Hyperlinks.vue b/frontend/src/components/canvas/components/Editor/Hyperlinks.vue index 20f73f61da..649cd85ab3 100644 --- a/frontend/src/components/canvas/components/Editor/Hyperlinks.vue +++ b/frontend/src/components/canvas/components/Editor/Hyperlinks.vue @@ -63,7 +63,7 @@ export default { onSubmit() { this.linkInfo.content = checkAddHttp(this.linkInfo.content) this.curComponent.hyperlinks = deepCopy(this.linkInfo) - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') this.popoverClose() }, onClose() { diff --git a/frontend/src/components/canvas/components/Editor/HyperlinksDialog.vue b/frontend/src/components/canvas/components/Editor/HyperlinksDialog.vue index 13e97f8cf2..226ad2ed93 100644 --- a/frontend/src/components/canvas/components/Editor/HyperlinksDialog.vue +++ b/frontend/src/components/canvas/components/Editor/HyperlinksDialog.vue @@ -54,7 +54,7 @@ export default { onSubmit() { this.linkInfo.content = checkAddHttp(this.linkInfo.content) this.curComponent.hyperlinks = deepCopy(this.linkInfo) - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') this.onClose() }, onClose() { diff --git a/frontend/src/components/canvas/components/Editor/PreviewEject.vue b/frontend/src/components/canvas/components/Editor/PreviewEject.vue index 8b8e0ba301..3c68e95923 100644 --- a/frontend/src/components/canvas/components/Editor/PreviewEject.vue +++ b/frontend/src/components/canvas/components/Editor/PreviewEject.vue @@ -84,7 +84,7 @@ export default { this.initCallBack() }) } else { - initPanelData(this.panelId, () => { + initPanelData(this.panelId, false, () => { this.initCallBack() }) } diff --git a/frontend/src/components/canvas/components/Editor/StreamMediaLinks.vue b/frontend/src/components/canvas/components/Editor/StreamMediaLinks.vue index f2b9061162..86e93091df 100644 --- a/frontend/src/components/canvas/components/Editor/StreamMediaLinks.vue +++ b/frontend/src/components/canvas/components/Editor/StreamMediaLinks.vue @@ -111,7 +111,7 @@ export default { } else { this.curActiveTabInner.streamMediaLinks = this.streamMediaInfoTemp } - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') bus.$emit('streamMediaLinksChange-' + this.curComponent.id) this.popoverClose() }, diff --git a/frontend/src/components/canvas/components/Editor/VideoLinks.vue b/frontend/src/components/canvas/components/Editor/VideoLinks.vue index c23b40eb5c..024550c696 100644 --- a/frontend/src/components/canvas/components/Editor/VideoLinks.vue +++ b/frontend/src/components/canvas/components/Editor/VideoLinks.vue @@ -101,7 +101,7 @@ export default { this.curActiveTabInner.videoLinks = this.linkInfoTemp } this.curComponent.videoLinks = this.linkInfoTemp - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') bus.$emit('videoLinksChange-' + this.curComponent.id) this.popoverClose() }, diff --git a/frontend/src/components/canvas/components/FilterTextAttr.vue b/frontend/src/components/canvas/components/FilterTextAttr.vue index 4bcbc78d21..58d03633aa 100644 --- a/frontend/src/components/canvas/components/FilterTextAttr.vue +++ b/frontend/src/components/canvas/components/FilterTextAttr.vue @@ -153,7 +153,7 @@ export default { } }, styleChange() { - this.$store.commit('recordStyleChange') + this.$store.commit('canvasChange') } } } diff --git a/frontend/src/components/canvas/components/RectangleAttr.vue b/frontend/src/components/canvas/components/RectangleAttr.vue index 75d42fe81c..c32e14d660 100644 --- a/frontend/src/components/canvas/components/RectangleAttr.vue +++ b/frontend/src/components/canvas/components/RectangleAttr.vue @@ -205,7 +205,7 @@ export default { } }, styleChange() { - this.$store.commit('recordStyleChange') + this.$store.commit('canvasChange') } } } diff --git a/frontend/src/components/canvas/components/TextAttr.vue b/frontend/src/components/canvas/components/TextAttr.vue index 8714099d1e..6ebdf399ca 100644 --- a/frontend/src/components/canvas/components/TextAttr.vue +++ b/frontend/src/components/canvas/components/TextAttr.vue @@ -475,7 +475,7 @@ export default { return y * this.curCanvasScale.scalePointHeight }, styleChange() { - this.$store.commit('recordStyleChange') + this.$store.commit('canvasChange') }, goHeadFontColor() { this.$refs.headFontColorPicker.handleTrigger() diff --git a/frontend/src/components/canvas/components/Toolbar.vue b/frontend/src/components/canvas/components/Toolbar.vue index 355af8037e..565d3c78e0 100644 --- a/frontend/src/components/canvas/components/Toolbar.vue +++ b/frontend/src/components/canvas/components/Toolbar.vue @@ -135,7 +135,7 @@ import { mapState } from 'vuex' import { commonStyle, commonAttr } from '@/components/canvas/custom-component/component-list' import eventBus from '@/components/canvas/utils/eventBus' import { deepCopy, mobile2MainCanvas } from '@/components/canvas/utils/utils' -import { panelUpdate } from '@/api/panel/panel' +import { panelUpdate, saveCache, removePanelCache } from '@/api/panel/panel' import { saveLinkage, getPanelAllLinkageInfo } from '@/api/panel/linkage' import bus from '@/utils/bus' import { queryPanelJumpInfo } from '@/api/panel/linkJump' @@ -199,6 +199,7 @@ export default { this.scale = this.canvasStyleData.scale this.mobileLayoutInitStatus = this.mobileLayoutStatus this.showGridSwitch = this.canvasStyleData.aidedDesign.showGrid + this.autoCache() }, beforeDestroy() { eventBus.$off('preview', this.preview) @@ -211,6 +212,7 @@ export default { this.$store.commit('initCanvasBase') this.$store.commit('setInEditorStatus', false) this.$emit('close-left-panel') + removePanelCache(this.panelInfo.id) this.$nextTick(() => { bus.$emit('PanelSwitchComponent', { name: 'PanelMain' }) }) @@ -235,7 +237,6 @@ export default { return result }, handleScaleChange() { - clearTimeout(this.timer) setTimeout(() => { const componentData = deepCopy(this.componentData) componentData.forEach(component => { @@ -329,8 +330,18 @@ export default { this.isShowPreview = true this.$store.commit('setEditMode', 'preview') }, - - save(withClose) { + autoCache() { + // auto save panel cache per 5s + const _this = this + _this.timer = setInterval(() => { + if (_this.$store.state.cacheStyleChangeTimes > 0) { + const cacheRequest = _this.savePrepare() + saveCache(cacheRequest) + _this.$store.state.cacheStyleChangeTimes = 0 + } + }, 5000) + }, + savePrepare() { // 保存到数据库 const requestInfo = { id: this.panelInfo.id, @@ -359,6 +370,11 @@ export default { }) // 无需保存条件 requestInfo.panelData = JSON.stringify(components) + return requestInfo + }, + + save(withClose) { + const requestInfo = this.savePrepare() panelUpdate(requestInfo).then(response => { this.$store.commit('refreshSaveStatus') this.$message({ @@ -447,7 +463,7 @@ export default { this.canvasStyleData.auxiliaryMatrix = value }, showGridChange() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') this.canvasStyleData.aidedDesign.showGrid = !this.canvasStyleData.aidedDesign.showGrid }, // batch option @@ -484,7 +500,7 @@ export default { }, // 移动端布局保存 mobileLayoutSave() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') const mobileDataObj = {} this.componentData.forEach(item => { mobileDataObj[item.id] = item diff --git a/frontend/src/components/canvas/custom-component/DeRichText.vue b/frontend/src/components/canvas/custom-component/DeRichText.vue index 8903b836ea..97798dc30d 100644 --- a/frontend/src/components/canvas/custom-component/DeRichText.vue +++ b/frontend/src/components/canvas/custom-component/DeRichText.vue @@ -114,7 +114,7 @@ export default { }, myValue(newValue) { this.element.propValue = newValue - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') } }, mounted() { diff --git a/frontend/src/components/canvas/custom-component/DeRichTextView.vue b/frontend/src/components/canvas/custom-component/DeRichTextView.vue index af43553889..27a62cad77 100644 --- a/frontend/src/components/canvas/custom-component/DeRichTextView.vue +++ b/frontend/src/components/canvas/custom-component/DeRichTextView.vue @@ -115,7 +115,7 @@ export default { if (this.canEdit) { this.element.propValue.textValue = newValue } - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') } }, mounted() { diff --git a/frontend/src/components/canvas/custom-component/UserView.vue b/frontend/src/components/canvas/custom-component/UserView.vue index e337bf25d2..10a4e25df5 100644 --- a/frontend/src/components/canvas/custom-component/UserView.vue +++ b/frontend/src/components/canvas/custom-component/UserView.vue @@ -460,7 +460,7 @@ export default { } }, optFromBatchSingleProp(param) { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') const updateParams = { 'id': this.chart.id } if (param.custom === 'customAttr') { const sourceCustomAttr = JSON.parse(this.sourceCustomAttrStr) @@ -929,7 +929,7 @@ export default { return this.chart.render }, getDataEdit(param) { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') if (param.type === 'propChange') { this.getData(param.viewId, false, true) } else if (param.type === 'styleChange') { diff --git a/frontend/src/components/canvas/custom-component/VText.vue b/frontend/src/components/canvas/custom-component/VText.vue index fb640f8a1b..3addb151eb 100644 --- a/frontend/src/components/canvas/custom-component/VText.vue +++ b/frontend/src/components/canvas/custom-component/VText.vue @@ -89,9 +89,9 @@ export default { }, methods: { handleInput(e) { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') this.$emit('input', this.element, e.target.innerHTML) - this.$store.commit('recordStyleChange') + this.$store.commit('canvasChange') }, handleKeydown(e) { diff --git a/frontend/src/components/canvas/store/snapshot.js b/frontend/src/components/canvas/store/snapshot.js index 6a464f14a4..02e9d34ca6 100644 --- a/frontend/src/components/canvas/store/snapshot.js +++ b/frontend/src/components/canvas/store/snapshot.js @@ -9,9 +9,14 @@ export default { changeTimes: -1, // 修改次数 lastSaveSnapshotIndex: 0, // 最后保存是snapshotIndex的索引 styleChangeTimes: 0, // 组件样式修改次数 + cacheStyleChangeTimes: 0, // 仪表板未缓存的组件样式修改次数 doSnapshotIndex: -1 // snapshot undo redo 时的索引记录 }, mutations: { + canvasChange(state) { + state.styleChangeTimes++ + state.cacheStyleChangeTimes++ + }, undo(state) { store.commit('setCurComponent', { component: null, index: null }) if (state.snapshotIndex > 0) { @@ -34,7 +39,7 @@ export default { recordSnapshot(state) { state.changeTimes++ - state.styleChangeTimes++ + store.commit('canvasChange') // 添加新的快照 state.snapshotData[++state.snapshotIndex] = deepCopy(state.componentData) state.snapshotStyleData[state.snapshotIndex] = deepCopy(state.canvasStyleData) diff --git a/frontend/src/components/widget/DeWidget/DeTabs.vue b/frontend/src/components/widget/DeWidget/DeTabs.vue index ec85d71934..f0915f2b19 100644 --- a/frontend/src/components/widget/DeWidget/DeTabs.vue +++ b/frontend/src/components/widget/DeWidget/DeTabs.vue @@ -444,7 +444,7 @@ export default { this.styleChange() }, styleChange() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') }, chartResize() { // this.$refs[this.activeTabName] diff --git a/frontend/src/components/widget/DeWidget/TabStyle.vue b/frontend/src/components/widget/DeWidget/TabStyle.vue index 878d1acde6..5a6687886c 100644 --- a/frontend/src/components/widget/DeWidget/TabStyle.vue +++ b/frontend/src/components/widget/DeWidget/TabStyle.vue @@ -85,7 +85,7 @@ export default { current && (current.showPicker = true) }, styleChange() { - this.$store.commit('recordStyleChange') + this.$store.commit('canvasChange') } } diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js index e8127d6449..56403d13ce 100644 --- a/frontend/src/lang/en.js +++ b/frontend/src/lang/en.js @@ -1574,6 +1574,8 @@ export default { sure_bt: 'Confirm' }, panel: { + panel_no_save_tips: 'There are unsaved panel', + panel_cache_use_tips: 'It was checked that the last dashboard could not be saved normally. Do you want to use the panel that was not saved last time?', template_name_tips: "Panel\'s name should not be null", panel_background_item: 'Customize panel background', panel_background_image_tips: 'Currently.Jpeg,.Jpg,.Png,.Gif files are supported, and the size should not exceed 15m', diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js index 6d1748bf38..41735c472e 100644 --- a/frontend/src/lang/tw.js +++ b/frontend/src/lang/tw.js @@ -1574,6 +1574,8 @@ export default { sure_bt: '確定' }, panel: { + panel_no_save_tips: '存在未保存的仪表板', + panel_cache_use_tips: '检查到上次有仪表板未能正常保存，是否使用上次未保存的仪表板？', template_name_tips: '仪表板名称必填', panel_background_item: '自定义仪表板背景', panel_background_image_tips: '当前支持.jpeg,.jpg,.png,.gif文件,大小不要超过15M', diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js index 455c40f361..9cad52a97c 100644 --- a/frontend/src/lang/zh.js +++ b/frontend/src/lang/zh.js @@ -1582,6 +1582,8 @@ export default { sure_bt: '确定' }, panel: { + panel_no_save_tips: '存在未保存的仪表板', + panel_cache_use_tips: '检查到上次有仪表板未能正常保存，是否使用上次未保存的仪表板？', template_name_tips: '仪表板名称必填', panel_background_item: '自定义仪表板背景', panel_background_image_tips: '当前支持.jpeg,.jpg,.png,.gif文件,大小不要超过15M', diff --git a/frontend/src/views/panel/GrantAuth/shareTree.vue b/frontend/src/views/panel/GrantAuth/shareTree.vue index f1fe250e54..052819a17a 100644 --- a/frontend/src/views/panel/GrantAuth/shareTree.vue +++ b/frontend/src/views/panel/GrantAuth/shareTree.vue @@ -140,7 +140,7 @@ export default { this.$refs['botTree'].setCurrentKey(null) }, viewMyShare(data) { - initPanelData(data.id, function() { + initPanelData(data.id, false, function() { bus.$emit('set-panel-show-type', 2) }) this.$refs['topTree'].setCurrentKey(null) diff --git a/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue b/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue index e4d73faa64..9d091f55e4 100644 --- a/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue +++ b/frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue @@ -109,7 +109,7 @@ export default { this.sizeMessage() } uploadFileResult(file.file, (fileUrl) => { - _this.$store.state.styleChangeTimes++ + _this.$store.commit('canvasChange') _this.panel.imageUrl = fileUrl _this.fileList = [{ url: this.panel.imageUrl }] _this.commitStyle() @@ -122,7 +122,7 @@ export default { this.sizeMessage() } uploadFileResult(file, (fileUrl) => { - _this.$store.state.styleChangeTimes++ + _this.$store.commit('canvasChange') _this.panel.imageUrl = fileUrl _this.fileList = [{ url: this.panel.imageUrl }] _this.commitStyle() diff --git a/frontend/src/views/panel/SubjectSetting/PanelStyle/PanelAidedDesign.vue b/frontend/src/views/panel/SubjectSetting/PanelStyle/PanelAidedDesign.vue index 439aa35967..ef4fe8ea53 100644 --- a/frontend/src/views/panel/SubjectSetting/PanelStyle/PanelAidedDesign.vue +++ b/frontend/src/views/panel/SubjectSetting/PanelStyle/PanelAidedDesign.vue @@ -35,7 +35,7 @@ export default { }, methods: { onChangePanelStyle() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') } } } diff --git a/frontend/src/views/panel/SubjectSetting/PanelStyle/ViewResult.vue b/frontend/src/views/panel/SubjectSetting/PanelStyle/ViewResult.vue index 1125f4b26d..be2283f76a 100644 --- a/frontend/src/views/panel/SubjectSetting/PanelStyle/ViewResult.vue +++ b/frontend/src/views/panel/SubjectSetting/PanelStyle/ViewResult.vue @@ -55,7 +55,7 @@ export default { }, methods: { onChangePanelStyle() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') } } } diff --git a/frontend/src/views/panel/SubjectSetting/index.vue b/frontend/src/views/panel/SubjectSetting/index.vue index 628b7908a6..8e77395680 100644 --- a/frontend/src/views/panel/SubjectSetting/index.vue +++ b/frontend/src/views/panel/SubjectSetting/index.vue @@ -117,7 +117,7 @@ export default { this.themeAttrChange('customStyle', 'text', val) }, styleChange() { - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') }, themeAttrChange(custom, property, value) { bus.$emit('onThemeAttrChange', { diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue index f682e43857..2535f605f7 100644 --- a/frontend/src/views/panel/edit/index.vue +++ b/frontend/src/views/panel/edit/index.vue @@ -354,6 +354,27 @@ + + + + + + + + {{$t('panel.panel_cache_use_tips')}} + + +
+ {{$t('panel.no')}} + {{$t('panel.yes')}} +
+ + @@ -375,7 +396,13 @@ import componentList, { import { mapState } from 'vuex' import { uuid } from 'vue-uuid' import Toolbar from '@/components/canvas/components/Toolbar' -import { initPanelData, initViewCache, queryPanelMultiplexingViewTree } from '@/api/panel/panel' +import { + checkUserCache, + findUserCache, + initPanelData, + initViewCache, + queryPanelMultiplexingViewTree +} from '@/api/panel/panel' import Preview from '@/components/canvas/components/Editor/Preview' import elementResizeDetectorMaker from 'element-resize-detector' import AssistComponent from '@/views/panel/AssistComponent' @@ -428,6 +455,7 @@ export default { }, data() { return { + panelCacheExist: false, viewData: [], multiplexingShow: false, asideToolType: 'none', @@ -727,20 +755,40 @@ export default { _this.initHasStar() this.$store.commit('initCanvas') if (panelId) { - initPanelData(panelId, function() { - // 清空当前缓存,快照 - _this.$store.commit('refreshSnapshot') - // 初始化视图缓存 - initViewCache(panelId) - // 初始化记录的视图信息 - _this.$store.commit('setComponentViewsData') - // 初始化保存状态 - setTimeout(() => { - _this.$store.commit('refreshSaveStatus') - }, 500) + checkUserCache(panelId, function(rsp) { + // the panel have cache + if (rsp.data) { + _this.panelCacheExist = true + } else { + _this.editPanelDataInit(panelId, false) + } }) } }, + useCache(useCache) { + this.editPanelDataInit(this.$store.state.panel.panelInfo.id, useCache) + this.panelCacheExist = false + }, + editPanelDataInit(panelId, useCache) { + const _this = this + initPanelData(panelId, useCache, function() { + // 清空当前缓存,快照 + _this.$store.commit('refreshSnapshot') + // 初始化视图缓存 + initViewCache(panelId) + // 初始化记录的视图信息 + _this.$store.commit('setComponentViewsData') + // if panel data load from cache the save button should be active + // 初始化保存状态 + setTimeout(() => { + if (useCache) { + _this.$store.commit('recordSnapshot', 'cache') + } else { + _this.$store.commit('refreshSaveStatus') + } + }, 500) + }) + }, star() { this.panelInfo && saveEnshrine(this.panelInfo.id, false).then(res => { this.hasStar = true @@ -1141,19 +1189,6 @@ export default { // 打开属性栏 bus.$emit('change_panel_right_draw', true) - - // - // // 编辑时临时保存 当前修改的画布 - // this.$store.dispatch('panel/setComponentDataTemp', JSON.stringify(this.componentData)) - // this.$store.dispatch('panel/setCanvasStyleDataTemp', JSON.stringify(this.canvasStyleData)) - // if (this.curComponent.type === 'view') { - // this.$store.dispatch('chart/setViewId', null) - // this.$store.dispatch('chart/setViewId', this.curComponent.propValue.viewId) - // bus.$emit('PanelSwitchComponent', { - // name: 'ChartEdit', - // param: { 'id': this.curComponent.propValue.viewId, 'optType': 'edit' } - // }) - // } }, canvasScroll(event) { this.scrollLeft = event.target.scrollLeft @@ -1231,7 +1266,7 @@ export default { this.showMultiplexing(false) this.$store.commit('copyMultiplexingComponents') this.$store.commit('recordSnapshot') - this.$store.state.styleChangeTimes++ + this.$store.commit('canvasChange') } } } diff --git a/frontend/src/views/panel/enshrine/index.vue b/frontend/src/views/panel/enshrine/index.vue index f7b5abda23..a706016928 100644 --- a/frontend/src/views/panel/enshrine/index.vue +++ b/frontend/src/views/panel/enshrine/index.vue @@ -55,7 +55,7 @@ export default { }, methods: { showPanel(row) { - initPanelData(row.panelGroupId, function() { + initPanelData(row.panelGroupId, false, function() { bus.$emit('set-panel-show-type', 0) }) }, diff --git a/frontend/src/views/panel/list/PanelList.vue b/frontend/src/views/panel/list/PanelList.vue index 3d5235ac01..267b219054 100644 --- a/frontend/src/views/panel/list/PanelList.vue +++ b/frontend/src/views/panel/list/PanelList.vue @@ -674,7 +674,7 @@ export default { if (data.nodeType === 'panel') { // 清理pc布局缓存 this.$store.commit('setComponentDataCache', null) - initPanelData(data.id, function(response) { + initPanelData(data.id, false, function(response) { bus.$emit('set-panel-show-type', 0) data.mobileLayout = response.data.mobileLayout }) diff --git a/frontend/src/views/panel/list/PanelViewShow.vue b/frontend/src/views/panel/list/PanelViewShow.vue index 623d570dfc..72cc6ecce0 100644 --- a/frontend/src/views/panel/list/PanelViewShow.vue +++ b/frontend/src/views/panel/list/PanelViewShow.vue @@ -454,7 +454,7 @@ export default { if (this.showType === 1 && this.shareUserId !== null) { const param = { userId: this.shareUserId } proxyInitPanelData(this.panelInfo.id, param, null) - } else { initPanelData(this.panelInfo.id) } + } else { initPanelData(this.panelInfo.id,false) } }, changePublishState() { if (this.panelInfo.status === 'publish') {