From f56f57a2364ff5cf1279527c2f130aae88b65ce7 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子li <15040126243@163.com> Date: 星期五, 11 十二月 2020 14:27:54 +0800 Subject: [PATCH] Merge branch 'master' of https://gitee.com/y_project/RuoYi-Vue --- ruoyi-ui/src/layout/components/AppMain.vue | 160 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 160 insertions(+), 0 deletions(-) diff --git a/ruoyi-ui/src/layout/components/AppMain.vue b/ruoyi-ui/src/layout/components/AppMain.vue new file mode 100644 index 0000000..f172fc2 --- /dev/null +++ b/ruoyi-ui/src/layout/components/AppMain.vue @@ -0,0 +1,160 @@ +<!-- @author ruoyi 20201128 鏀寔涓夌骇浠ヤ笂鑿滃崟缂撳瓨 --> +<template> + <section class="app-main"> + <transition name="fade-transform" mode="out-in"> + <keep-alive :max="20" :exclude="notCacheName"> + <router-view :key="key" /> + </keep-alive> + </transition> + </section> +</template> + +<script> +import Global from "@/layout/components/global.js"; + +export default { + name: 'AppMain', + computed: { + notCacheName() { + var visitedViews = this.$store.state.tagsView.visitedViews; + var noCacheViews = []; + Object.keys(visitedViews).some((index) => { + if (visitedViews[index].meta.noCache) { + noCacheViews.push(visitedViews[index].name); + } + }); + return noCacheViews; + }, + key() { + return this.$route.path; + }, + }, + mounted() { + // 鍏抽棴鏍囩瑙﹀彂 + Global.$on("removeCache", (name, view) => { + this.removeCache(name, view); + }); + }, + methods: { + // 鑾峰彇鏈塳eep-alive瀛愯妭鐐圭殑Vnode + getVnode() { + // 鍒ゆ柇瀛愰泦闈炵┖ + if (this.$children.length == 0) return false; + let vnode; + for (let item of this.$children) { + // 濡傛灉data涓湁key鍒欎唬琛ㄦ壘鍒颁簡keep-alive涓嬮潰鐨勫瓙闆嗭紝杩欎釜key灏辨槸router-view涓婄殑key + if (item.$vnode.data.key) { + vnode = item.$vnode; + break; + } + } + return vnode ? vnode : false; + }, + // 绉婚櫎keep-alive缂撳瓨 + removeCache(name, view = {}) { + let vnode = this.getVnode(); + if (!vnode) return false; + let componentInstance = vnode.parent.componentInstance; + // 杩欎釜key鏄敤鏉ヨ幏鍙栧墠缂�鐢ㄦ潵鍚庨潰姝e垯鍖归厤鐢ㄧ殑 + let keyStart = vnode.key.split("/")[0]; + let thisKey = `${keyStart}${view.fullPath}`; + let regKey = `${keyStart}${view.path}`; + + this[name]({ componentInstance, thisKey, regKey }); + }, + // 绉婚櫎鍏朵粬 + closeOthersTags({ componentInstance, thisKey }) { + Object.keys(componentInstance.cache).forEach((key, index) => { + if (key != thisKey) { + // 閿�姣佸疄渚�(杩欓噷瀛樺湪澶氫釜key鎸囧悜涓�涓紦瀛樼殑鎯呭喌鍙兘鍓嶉潰涓�涓凡缁忔竻闄ゆ帀浜嗘墍鏈夎鍔犲垽鏂�) + if (componentInstance.cache[key]) { + componentInstance.cache[key].componentInstance.$destroy(); + } + // 鍒犻櫎缂撳瓨 + delete componentInstance.cache[key]; + // 绉婚櫎key涓搴旂殑key + componentInstance.keys.splice(index, 1); + } + }); + }, + // 绉婚櫎鎵�鏈夌紦瀛� + closeAllTags({ componentInstance }) { + // 閿�姣佸疄渚� + Object.keys(componentInstance.cache).forEach((key) => { + if (componentInstance.cache[key]) { + componentInstance.cache[key].componentInstance.$destroy(); + } + }); + // 鍒犻櫎缂撳瓨 + componentInstance.cache = {}; + // 绉婚櫎key涓搴旂殑key + componentInstance.keys = []; + }, + // 绉婚櫎鍗曚釜缂撳瓨 + closeSelectedTag({ componentInstance, regKey }) { + let reg = new RegExp(`^${regKey}`); + Object.keys(componentInstance.cache).forEach((key, i) => { + if (reg.test(key)) { + // 閿�姣佸疄渚� + if (componentInstance.cache[key]) { + componentInstance.cache[key].componentInstance.$destroy(); + } + // 鍒犻櫎缂撳瓨 + delete componentInstance.cache[key]; + // 绉婚櫎key涓搴旂殑key + componentInstance.keys.splice(i, 1); + } + }); + }, + // 鍒锋柊鍗曚釜缂撳瓨 + refreshSelectedTag({ componentInstance, thisKey }) { + Object.keys(componentInstance.cache).forEach((key, index) => { + if (null != thisKey && key.replace("/redirect", "") == thisKey) { + // 1 閿�姣佸疄渚�(杩欓噷瀛樺湪澶氫釜key鎸囧悜涓�涓紦瀛樼殑鎯呭喌鍙兘鍓嶉潰涓�涓凡缁忔竻闄ゆ帀浜嗘墍鏈夎鍔犲垽鏂�) + if (componentInstance.cache[key]) { + componentInstance.cache[key].componentInstance.$destroy(); + } + // 2 鍒犻櫎缂撳瓨 + delete componentInstance.cache[key]; + // 3 绉婚櫎key涓搴旂殑key + componentInstance.keys.splice(index, 1); + } + }); + }, + }, +}; +</script> + +<style lang="scss" scoped> +.app-main { + /* 50= navbar 50 */ + min-height: calc(100vh - 50px); + width: 100%; + position: relative; + overflow: hidden; +} + +.fixed-header + .app-main { + padding-top: 50px; +} + +.hasTagsView { + .app-main { + /* 84 = navbar + tags-view = 50 + 34 */ + min-height: calc(100vh - 84px); + } + + .fixed-header + .app-main { + padding-top: 84px; + } +} +</style> + +<style lang="scss"> +// fix css style bug in open el-dialog +.el-popup-parent--hidden { + .fixed-header { + padding-right: 15px; + } +} +</style> -- Gitblit v1.9.3