|
|
|
@ -1,8 +1,17 @@ |
|
|
|
<template> |
|
|
|
<div class="navbar"> |
|
|
|
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> |
|
|
|
|
|
|
|
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/> |
|
|
|
<hamburger |
|
|
|
id="hamburger-container" |
|
|
|
:is-active="sidebar.opened" |
|
|
|
class="hamburger-container" |
|
|
|
@toggleClick="toggleSideBar" |
|
|
|
/> |
|
|
|
|
|
|
|
<breadcrumb |
|
|
|
id="breadcrumb-container" |
|
|
|
class="breadcrumb-container" |
|
|
|
v-if="!topNav" |
|
|
|
/> |
|
|
|
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" /> |
|
|
|
|
|
|
|
<div class="right-menu"> |
|
|
|
@ -22,12 +31,14 @@ |
|
|
|
<el-tooltip content="布局大小" effect="dark" placement="bottom"> |
|
|
|
<size-select id="size-select" class="right-menu-item hover-effect" /> |
|
|
|
</el-tooltip> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click"> |
|
|
|
<el-dropdown |
|
|
|
class="avatar-container right-menu-item hover-effect" |
|
|
|
trigger="click" |
|
|
|
> |
|
|
|
<div class="avatar-wrapper"> |
|
|
|
<img :src="avatar" class="user-avatar"> |
|
|
|
<img :src="avatar" class="user-avatar" /> |
|
|
|
<i class="el-icon-caret-bottom" /> |
|
|
|
</div> |
|
|
|
<el-dropdown-menu slot="dropdown"> |
|
|
|
@ -47,15 +58,15 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { mapGetters } from 'vuex' |
|
|
|
import Breadcrumb from '@/components/Breadcrumb' |
|
|
|
import TopNav from '@/components/TopNav' |
|
|
|
import Hamburger from '@/components/Hamburger' |
|
|
|
import Screenfull from '@/components/Screenfull' |
|
|
|
import SizeSelect from '@/components/SizeSelect' |
|
|
|
import Search from '@/components/HeaderSearch' |
|
|
|
import RuoYiGit from '@/components/RuoYi/Git' |
|
|
|
import RuoYiDoc from '@/components/RuoYi/Doc' |
|
|
|
import { mapGetters } from "vuex"; |
|
|
|
import Breadcrumb from "@/components/Breadcrumb"; |
|
|
|
import TopNav from "@/components/TopNav"; |
|
|
|
import Hamburger from "@/components/Hamburger"; |
|
|
|
import Screenfull from "@/components/Screenfull"; |
|
|
|
import SizeSelect from "@/components/SizeSelect"; |
|
|
|
import Search from "@/components/HeaderSearch"; |
|
|
|
import RuoYiGit from "@/components/RuoYi/Git"; |
|
|
|
import RuoYiDoc from "@/components/RuoYi/Doc"; |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { |
|
|
|
@ -66,48 +77,46 @@ export default { |
|
|
|
SizeSelect, |
|
|
|
Search, |
|
|
|
RuoYiGit, |
|
|
|
RuoYiDoc |
|
|
|
RuoYiDoc, |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
...mapGetters([ |
|
|
|
'sidebar', |
|
|
|
'avatar', |
|
|
|
'device' |
|
|
|
]), |
|
|
|
...mapGetters(["sidebar", "avatar", "device"]), |
|
|
|
setting: { |
|
|
|
get() { |
|
|
|
return this.$store.state.settings.showSettings |
|
|
|
return this.$store.state.settings.showSettings; |
|
|
|
}, |
|
|
|
set(val) { |
|
|
|
this.$store.dispatch('settings/changeSetting', { |
|
|
|
key: 'showSettings', |
|
|
|
value: val |
|
|
|
}) |
|
|
|
} |
|
|
|
this.$store.dispatch("settings/changeSetting", { |
|
|
|
key: "showSettings", |
|
|
|
value: val, |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
topNav: { |
|
|
|
get() { |
|
|
|
return this.$store.state.settings.topNav |
|
|
|
} |
|
|
|
} |
|
|
|
return this.$store.state.settings.topNav; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
toggleSideBar() { |
|
|
|
this.$store.dispatch('app/toggleSideBar') |
|
|
|
this.$store.dispatch("app/toggleSideBar"); |
|
|
|
}, |
|
|
|
async logout() { |
|
|
|
this.$confirm('确定注销并退出系统吗？', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning' |
|
|
|
}).then(() => { |
|
|
|
this.$store.dispatch('LogOut').then(() => { |
|
|
|
location.href = '/index'; |
|
|
|
this.$confirm("确定注销并退出系统吗？", "提示", { |
|
|
|
confirmButtonText: "确定", |
|
|
|
cancelButtonText: "取消", |
|
|
|
type: "warning", |
|
|
|
}) |
|
|
|
}).catch(() => {}); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.then(() => { |
|
|
|
this.$store.dispatch("LogOut").then(() => { |
|
|
|
location.href = process.env.VUE_APP_PUBLIC_PATH; |
|
|
|
}); |
|
|
|
}) |
|
|
|
.catch(() => {}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
@ -116,18 +125,18 @@ export default { |
|
|
|
overflow: hidden; |
|
|
|
position: relative; |
|
|
|
background: #fff; |
|
|
|
box-shadow: 0 1px 4px rgba(0,21,41,.08); |
|
|
|
box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); |
|
|
|
|
|
|
|
.hamburger-container { |
|
|
|
line-height: 46px; |
|
|
|
height: 100%; |
|
|
|
float: left; |
|
|
|
cursor: pointer; |
|
|
|
transition: background .3s; |
|
|
|
transition: background 0.3s; |
|
|
|
-webkit-tap-highlight-color: transparent; |
|
|
|
|
|
|
|
&:hover { |
|
|
|
background: rgba(0, 0, 0, .025) |
|
|
|
background: rgba(0, 0, 0, 0.025); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
@ -164,10 +173,10 @@ export default { |
|
|
|
|
|
|
|
&.hover-effect { |
|
|
|
cursor: pointer; |
|
|
|
transition: background .3s; |
|
|
|
transition: background 0.3s; |
|
|
|
|
|
|
|
&:hover { |
|
|
|
background: rgba(0, 0, 0, .025) |
|
|
|
background: rgba(0, 0, 0, 0.025); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
liuzhipeng
5 months ago