<!-- -->
|
<template>
|
<div class="app-wrapper" :class="{ hidcontainer: isCollapse }">
|
<sidebar class="sidebar-container" />
|
<div class="main-container">
|
<nav-tab />
|
<!-- <right-panel v-if="showSettings">
|
<settings />
|
</right-panel> -->
|
<div class="main">
|
<transition name="fade-transform" mode="out-in">
|
<router-view />
|
</transition>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
|
//例如:import 《组件名称》 from '《组件路径》';
|
import { NavTab, sidebar } from './components';
|
import { mapGetters } from 'vuex';
|
import { getStorage, setStorage } from '@/utils/sessionStorage';
|
// import sidebar from './components/Sidebar/index'
|
// import ResizeMixin from './mixin/ResizeHandler';
|
export default {
|
//name放入模板名,方便在其他地方引用
|
name: '',
|
//import引入的组件需要注入到对象中才能使用
|
components: { sidebar, NavTab },
|
data() {
|
//这里存放数据
|
return {};
|
},
|
//监听属性 类似于data概念
|
computed: {
|
...mapGetters(['sidebar']),
|
isCollapse() {
|
return this.sidebar;
|
},
|
visitedViews() {
|
return this.$store.state.tagsView.visitedViews;
|
}
|
},
|
//生命周期 - 创建完成(可以访问当前this实例)
|
created() {},
|
//生命周期 - 挂载完成(可以访问DOM元素)
|
mounted() {},
|
//方法集合
|
methods: {},
|
//监控data中的数据变化
|
watch: {},
|
//如果页面有keep-alive缓存功能,这个函数会触发
|
activated() {},
|
beforeRouteLeave: function (to, from, next) {
|
console.log(this.$vnode);
|
if (to.name == 'Login' || to.name == 'login') {
|
if (this.$vnode && this.$vnode.data.keepAlive) {
|
if (this.$vnode.parent && this.$vnode.parent.componentInstance && this.$vnode.parent.componentInstance.cache) {
|
if (this.$vnode.componentOptions) {
|
var key =
|
this.$vnode.key == null
|
? this.$vnode.componentOptions.Ctor.cid +
|
(this.$vnode.componentOptions.tag ? `::${this.$vnode.componentOptions.tag}` : '')
|
: this.$vnode.key;
|
var cache = this.$vnode.parent.componentInstance.cache;
|
var keys = this.$vnode.parent.componentInstance.keys;
|
if (cache[key]) {
|
if (keys.length) {
|
var index = keys.indexOf(key);
|
if (index > -1) {
|
keys.splice(index, 1);
|
}
|
}
|
delete cache[key];
|
}
|
}
|
}
|
}
|
this.$store.dispatch('tagsView/delAllViews').then(({ visitedViews }) => {});
|
}
|
|
next();
|
}
|
};
|
</script>
|
<style lang="scss" scoped>
|
.app-wrapper {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
.is-open {
|
width: calc(100% - 45px);
|
}
|
.main {
|
width: 98%;
|
height: calc(100% - 100px);
|
padding: 1%;
|
overflow: hidden;
|
}
|
}
|
</style>
|