From 7cc5169ab74bb2684c96efa9fd9840ee89431b80 Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Mon, 29 Nov 2021 14:54:24 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=89=8D=E7=AB=AF=E5=A2=9E?= =?UTF-8?q?=E5=8A=A0=E8=8F=9C=E5=8D=95=E7=BC=93=E5=AD=98=EF=BC=8C=E5=8A=A0?= =?UTF-8?q?=E5=BF=AB=E7=9B=B8=E5=BA=94=E9=80=9F=E5=BA=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/authModel/authModel.js | 6 +-- frontend/src/api/chart/chart.js | 2 +- frontend/src/api/panel/panel.js | 10 ++-- frontend/src/views/chart/group/Group.vue | 28 +++++++--- .../common/DatasetGroupSelectorTree.vue | 18 +++++-- frontend/src/views/dataset/group/Group.vue | 24 ++++++--- frontend/src/views/login/index.vue | 14 ++++- frontend/src/views/panel/edit/index.vue | 1 + frontend/src/views/panel/list/PanelList.vue | 53 +++++++++++++++---- 9 files changed, 116 insertions(+), 40 deletions(-) diff --git a/frontend/src/api/authModel/authModel.js b/frontend/src/api/authModel/authModel.js index 33ba79f0a2..9f72a1b128 100644 --- a/frontend/src/api/authModel/authModel.js +++ b/frontend/src/api/authModel/authModel.js @@ -1,11 +1,11 @@ import request from '@/utils/request' -export function queryAuthModel(data) { +export function queryAuthModel(data, loading = true, timeout = 30000) { return request({ url: 'authModel/queryAuthModel', method: 'post', - loading: true, - timeout: 30000, + loading: loading, + timeout: timeout, data }) } diff --git a/frontend/src/api/chart/chart.js b/frontend/src/api/chart/chart.js index f966b426d1..8bb9a0c4df 100644 --- a/frontend/src/api/chart/chart.js +++ b/frontend/src/api/chart/chart.js @@ -40,7 +40,7 @@ export function chartGroupTree(data) { return request({ url: '/chart/group/tree', method: 'post', - loading: true, + loading: false, data }) } diff --git a/frontend/src/api/panel/panel.js b/frontend/src/api/panel/panel.js index c745ced6e9..702302a4c5 100644 --- a/frontend/src/api/panel/panel.js +++ b/frontend/src/api/panel/panel.js @@ -36,20 +36,22 @@ export function querySubjectWithGroup(data) { }) } -export function defaultTree(data) { +export function defaultTree(data, loading = true, timeout = 30000) { return request({ url: '/panel/group/defaultTree', method: 'post', - loading: true, + loading: loading, + timeout: timeout, data }) } -export function groupTree(data) { +export function groupTree(data, loading = true, timeout = 30000) { return request({ url: '/panel/group/tree', method: 'post', - loading: true, + loading: loading, + timeout: timeout, data }) } diff --git a/frontend/src/views/chart/group/Group.vue b/frontend/src/views/chart/group/Group.vue index 9b77490991..68a651f93f 100644 --- a/frontend/src/views/chart/group/Group.vue +++ b/frontend/src/views/chart/group/Group.vue @@ -337,6 +337,11 @@ export default { type: String, required: false, default: null + }, + mountedInit: { + type: Boolean, + required: false, + default: true } }, data() { @@ -440,10 +445,11 @@ export default { }, mounted() { - this.treeNode(this.groupForm) - this.refresh() - // this.chartTree() - this.getChartGroupTree() + if (this.mountedInit) { + this.treeNode(true) + this.refresh() + this.getChartGroupTree() + } }, methods: { clickAdd(param) { @@ -620,9 +626,17 @@ export default { }) }, - treeNode(group) { - queryAuthModel({ modelType: 'chart' }).then(res => { - this.tData = res.data + treeNode(cache = false) { + const modelInfo = localStorage.getItem('chart-tree') + const userCache = (modelInfo && cache) + if (userCache) { + this.tData = JSON.parse(modelInfo) + } + queryAuthModel({ modelType: 'chart' }, !userCache).then(res => { + localStorage.setItem('chart-tree', JSON.stringify(res.data)) + if (!userCache) { + this.tData = res.data + } }) }, diff --git a/frontend/src/views/dataset/common/DatasetGroupSelectorTree.vue b/frontend/src/views/dataset/common/DatasetGroupSelectorTree.vue index 5f8810f40b..c2cca18990 100644 --- a/frontend/src/views/dataset/common/DatasetGroupSelectorTree.vue +++ b/frontend/src/views/dataset/common/DatasetGroupSelectorTree.vue @@ -181,7 +181,7 @@ export default { this.unionDataChange() }, 'table': function() { - this.treeNode(this.groupForm) + this.treeNode() }, filterText(val) { this.searchPids = [] @@ -193,7 +193,7 @@ export default { } }, mounted() { - this.treeNode(this.groupForm) + this.treeNode(true) }, created() { this.kettleState() @@ -223,9 +223,17 @@ export default { } }, - treeNode(group) { - queryAuthModel({ modelType: 'dataset' }).then(res => { - this.data = res.data + treeNode(cache) { + const modelInfo = localStorage.getItem('dataset-tree') + const userCache = (modelInfo && cache) + if (userCache) { + this.data = JSON.parse(modelInfo) + } + queryAuthModel({ modelType: 'dataset' }, !userCache).then(res => { + localStorage.setItem('dataset-tree', JSON.stringify(res.data)) + if (!userCache) { + this.data = res.data + } }) }, nodeClick(data, node) { diff --git a/frontend/src/views/dataset/group/Group.vue b/frontend/src/views/dataset/group/Group.vue index 0efded82d6..80846b329b 100644 --- a/frontend/src/views/dataset/group/Group.vue +++ b/frontend/src/views/dataset/group/Group.vue @@ -325,7 +325,7 @@ export default { this.kettleState() }, mounted() { - this.treeNode(this.groupForm) + this.treeNode(true) this.refresh() }, methods: { @@ -407,7 +407,7 @@ export default { showClose: true }) this.expandedArray.push(group.pid) - this.treeNode(group.pid) + this.treeNode() }) } else { return false @@ -451,7 +451,7 @@ export default { message: this.$t('dataset.delete_success'), showClose: true }) - this.treeNode(data.pid) + this.treeNode() }) }).catch(() => { }) @@ -469,7 +469,7 @@ export default { message: this.$t('dataset.delete_success'), showClose: true }) - this.treeNode(data.sceneId) + this.treeNode() this.$store.dispatch('dataset/setTable', new Date().getTime()) }) }).catch(() => { @@ -496,9 +496,17 @@ export default { } }, - treeNode(group) { - queryAuthModel({ modelType: 'dataset' }).then(res => { - this.tData = res.data + treeNode(cache) { + const modelInfo = localStorage.getItem('dataset-tree') + const userCache = (modelInfo && cache) + if (userCache) { + this.tData = JSON.parse(modelInfo) + } + queryAuthModel({ modelType: 'dataset' }, !userCache).then(res => { + localStorage.setItem('dataset-tree', JSON.stringify(res.data)) + if (!userCache) { + this.tData = res.data + } }) }, @@ -682,7 +690,7 @@ export default { this.searchTree(val) } else { this.isTreeSearch = false - this.treeNode(this.groupForm) + this.treeNode() } }, filterNode(value, data) { diff --git a/frontend/src/views/login/index.vue b/frontend/src/views/login/index.vue index 0cc388a246..f4fe8aa162 100644 --- a/frontend/src/views/login/index.vue +++ b/frontend/src/views/login/index.vue @@ -92,7 +92,13 @@ export default { axiosFinished: false, loginTypes: [0], isPluginLoaded: false, - contentShow: false + contentShow: false, + clearLocalStorage: [ + 'panel-main-tree', + 'panel-default-tree', + 'chart-tree', + 'dataset-tree' + ] } }, computed: { @@ -178,8 +184,14 @@ export default { } } */ }, + initCache() { + this.clearLocalStorage.forEach(item => { + localStorage.removeItem(item) + }) + }, handleLogin() { + this.initCache() this.clearOidcMsg() this.$refs.loginForm.validate(valid => { if (valid) { diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue index 992125f75c..d47f9db39d 100644 --- a/frontend/src/views/panel/edit/index.vue +++ b/frontend/src/views/panel/edit/index.vue @@ -191,6 +191,7 @@ :opt-from="'panel'" :advice-group-id="adviceGroupId" style="height: 0px;width:0px;padding:0px;overflow: hidden" + :mounted-init="false" @newViewInfo="newViewInfo" /> diff --git a/frontend/src/views/panel/list/PanelList.vue b/frontend/src/views/panel/list/PanelList.vue index 2fa0a01e5b..9e229ba15e 100644 --- a/frontend/src/views/panel/list/PanelList.vue +++ b/frontend/src/views/panel/list/PanelList.vue @@ -233,6 +233,7 @@ import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel' import TreeSelector from '@/components/TreeSelector' +import { queryAuthModel } from '@/api/authModel/authModel' export default { name: 'PanelList', @@ -334,7 +335,11 @@ export default { searchMap: { all: this.$t('commons.all'), folder: this.$t('commons.folder') - } + }, + initLocalStorage: [ + 'chart', + 'dataset' + ] } }, computed: { @@ -367,9 +372,20 @@ export default { this.$store.commit('setComponentData', []) this.$store.commit('setCanvasStyle', DEFAULT_COMMON_CANVAS_STYLE_STRING) this.defaultTree() - this.tree(this.groupForm) + this.tree(true) + this.initCache() }, methods: { + initCache() { + // 初始化时提前加载视图和数据集的缓存 + this.initLocalStorage.forEach(item => { + if (!localStorage.getItem(item + '-tree')) { + queryAuthModel({ modelType: item }, false).then(res => { + localStorage.setItem(item + '-tree', JSON.stringify(res.data)) + }) + } + }) + }, closeEditPanelDialog(panelInfo) { this.editPanel.visible = false if (panelInfo) { @@ -392,7 +408,7 @@ export default { } this.activeNodeAndClick(panelInfo) } else { - this.tree(this.groupForm) + this.tree() } } }, @@ -535,7 +551,7 @@ export default { type: 'success', showClose: true }) - this.tree(this.groupForm) + this.tree() this.defaultTree() }) } else { @@ -562,7 +578,7 @@ export default { showClose: true }) this.clearCanvas() - this.tree(this.groupForm) + this.tree() this.defaultTree() }) }).catch(() => { @@ -591,17 +607,32 @@ export default { sort: 'node_type desc,name asc' } }, - tree(group) { - groupTree(group).then(res => { - this.tData = res.data + tree(cache = false) { + const modelInfo = localStorage.getItem('panel-main-tree') + const userCache = (modelInfo && cache) + if (userCache) { + this.tData = JSON.parse(modelInfo) + } + groupTree(this.groupForm, !userCache).then(res => { + localStorage.setItem('panel-main-tree', JSON.stringify(res.data)) + if (!userCache) { + this.tData = res.data + } }) }, defaultTree() { const requestInfo = { panelType: 'system' } - defaultTree(requestInfo).then(res => { - this.defaultData = res.data + const modelInfo = localStorage.getItem('panel-default-tree') + if (modelInfo) { + this.defaultData = JSON.parse(modelInfo) + } + defaultTree(requestInfo, false).then(res => { + localStorage.setItem('panel-default-tree', JSON.stringify(res.data)) + if (!modelInfo) { + this.defaultData = res.data + } }) }, @@ -768,7 +799,7 @@ export default { this.moveInfo.pid = this.tGroup.id this.moveInfo['optType'] = 'move' panelSave(this.moveInfo).then(response => { - this.tree(this.groupForm) + this.tree() this.closeMoveGroup() }) },