|
|
@@ -1,30 +1,30 @@
|
|
|
<!-- 页面布局 -->
|
|
|
<template>
|
|
|
<div :class="layoutClass">
|
|
|
- <ele-header/><!-- 顶栏 -->
|
|
|
+ <ele-header /><!-- 顶栏 -->
|
|
|
<el-container class="ele-admin-main">
|
|
|
- <ele-sidebar v-if="showSidebar"/><!-- 侧边栏 -->
|
|
|
+ <ele-sidebar v-if="showSidebar" /><!-- 侧边栏 -->
|
|
|
<div class="ele-admin-body">
|
|
|
- <ele-tabs v-if="theme.showTabs"/><!-- 多页签 -->
|
|
|
+ <ele-tabs v-if="theme.showTabs" /><!-- 多页签 -->
|
|
|
<keep-alive :include="$setting.keepAliveList">
|
|
|
- <router-view v-if="!theme.reload"/><!-- 路由出口 -->
|
|
|
+ <router-view v-if="!theme.reload" /><!-- 路由出口 -->
|
|
|
</keep-alive>
|
|
|
</div>
|
|
|
</el-container>
|
|
|
<div class="ele-admin-shade" @click="collapse"></div><!-- 小屏幕下遮罩层 -->
|
|
|
- <ele-setting v-if="$setting.showSetting"/><!-- 主题设置抽屉 -->
|
|
|
- <ele-password/><!-- 修改密码弹窗 -->
|
|
|
+ <ele-setting v-if="$setting.showSetting" /><!-- 主题设置抽屉 -->
|
|
|
+ <ele-password /><!-- 修改密码弹窗 -->
|
|
|
|
|
|
- <Chat></Chat>
|
|
|
+ <!-- <Chat></Chat>
|
|
|
<div class="chat-icon" @click="showChatPopup()">
|
|
|
<img class="icon" :src="customIcon" alt="">
|
|
|
<span class="count" v-if="user.unreadCount">{{user.unreadCount||0}}</span>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {mapGetters} from 'vuex'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
import EleHeader from './Header'
|
|
|
import EleSidebar from './Sidebar'
|
|
|
import EleTabs from './Tabs'
|
|
|
@@ -33,8 +33,8 @@ import ElePassword from '../fragment/Password'
|
|
|
import Chat from './Chat'
|
|
|
export default {
|
|
|
name: "EleLayout",
|
|
|
- components: {EleHeader, EleSidebar, EleTabs, EleSetting, ElePassword,Chat},
|
|
|
- data(){
|
|
|
+ components: { EleHeader, EleSidebar, EleTabs, EleSetting, ElePassword, Chat },
|
|
|
+ data() {
|
|
|
return {
|
|
|
customIcon: require('@/assets/icon-custom.png'),
|
|
|
}
|
|
|
@@ -44,22 +44,22 @@ export default {
|
|
|
layoutClass() {
|
|
|
return [
|
|
|
'ele-admin-layout',
|
|
|
- {'ele-layout-collapse': this.theme.collapse}, // 折叠状态
|
|
|
- {'ele-layout-fixed': this.theme.fixedLayout}, // 固定顶栏和侧栏
|
|
|
- {'ele-side-dark': this.theme.sideStyle === 1}, // 暗色侧栏
|
|
|
- {'ele-side-color-icon': this.theme.colorfulIcon}, // 侧栏彩色图标
|
|
|
- {'ele-head-dark': this.theme.headStyle !== 0}, // 暗色顶栏
|
|
|
- {'ele-logo-auto-size': this.theme.logoAutoSize || this.theme.layoutStyle === 1}, // logo宽度自适应
|
|
|
- {'ele-tabs-show': this.theme.showTabs}, // 开启多页签
|
|
|
+ { 'ele-layout-collapse': this.theme.collapse }, // 折叠状态
|
|
|
+ { 'ele-layout-fixed': this.theme.fixedLayout }, // 固定顶栏和侧栏
|
|
|
+ { 'ele-side-dark': this.theme.sideStyle === 1 }, // 暗色侧栏
|
|
|
+ { 'ele-side-color-icon': this.theme.colorfulIcon }, // 侧栏彩色图标
|
|
|
+ { 'ele-head-dark': this.theme.headStyle !== 0 }, // 暗色顶栏
|
|
|
+ { 'ele-logo-auto-size': this.theme.logoAutoSize || this.theme.layoutStyle === 1 }, // logo宽度自适应
|
|
|
+ { 'ele-tabs-show': this.theme.showTabs }, // 开启多页签
|
|
|
['', 'ele-tab-dot', 'ele-tab-card'][this.theme.tabStyle], // 页签风格
|
|
|
- {'ele-admin-body-limit': !this.theme.bodyFull} // 主体内容定宽
|
|
|
+ { 'ele-admin-body-limit': !this.theme.bodyFull } // 主体内容定宽
|
|
|
]
|
|
|
},
|
|
|
/* 是否显示侧边栏 */
|
|
|
showSidebar() {
|
|
|
return this.theme.layoutStyle !== 1 || this.theme.screenWidth < 768; // 小屏幕强制左侧菜单模式
|
|
|
},
|
|
|
- ...mapGetters(['theme','user']),
|
|
|
+ ...mapGetters(['theme', 'user']),
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getUserInfo();
|
|
|
@@ -68,7 +68,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- showChatPopup(){
|
|
|
+ showChatPopup() {
|
|
|
this.$store.dispatch('user/setShowChat', true);
|
|
|
console.log(this.user.showChat)
|
|
|
},
|
|
|
@@ -118,7 +118,7 @@ export default {
|
|
|
/* 监听路由变化 */
|
|
|
$route() {
|
|
|
if (this.theme.screenWidth < 768) {
|
|
|
- this.$store.dispatch('theme/set', {key: 'collapse', value: true});
|
|
|
+ this.$store.dispatch('theme/set', { key: 'collapse', value: true });
|
|
|
}
|
|
|
if (!this.$setting.watchResize) {
|
|
|
this.onWindowResize();
|
|
|
@@ -134,6 +134,7 @@ export default {
|
|
|
bottom: 10px;
|
|
|
right: 20px;
|
|
|
z-index: 996;
|
|
|
+
|
|
|
.icon {
|
|
|
width: 48px;
|
|
|
position: relative;
|
