管理界面可以切换风格

This commit is contained in:
刘祥超
2021-07-12 10:21:17 +08:00
parent 9e36847397
commit 32683a2b59
12 changed files with 159 additions and 12 deletions

View File

@@ -273,7 +273,6 @@ body.expanded .main {
z-index: 1000;
overflow-x: auto;
border: 0 !important;
background: #14539A !important;
}
.top-nav img.avatar {
width: 1.6em !important;
@@ -297,6 +296,15 @@ body.expanded .main {
.top-nav .item.red {
color: red !important;
}
.top-nav.theme1 {
background: #14539A !important;
}
.top-nav.theme2 {
background: #276AC6 !important;
}
.top-nav.theme3 {
background: #007D9C !important;
}
.top-nav::-webkit-scrollbar {
height: 2px;
}
@@ -410,14 +418,30 @@ body.expanded .main {
top: 2em;
bottom: 0;
overflow-y: auto;
background: #14539A !important;
z-index: 10;
}
.main-menu .menu {
background: #14539A !important;
border: 0 !important;
box-shadow: none !important;
}
.main-menu.theme1 {
background: #14539A !important;
}
.main-menu.theme1 .menu {
background: #14539A !important;
}
.main-menu.theme2 {
background: #276AC6 !important;
}
.main-menu.theme2 .menu {
background: #276AC6 !important;
}
.main-menu.theme3 {
background: #007D9C !important;
}
.main-menu.theme3 .menu {
background: #007D9C !important;
}
.main-menu::-webkit-scrollbar {
width: 2px;
}

File diff suppressed because one or more lines are too long

View File

@@ -25,7 +25,7 @@
<div>
<!-- 顶部导航 -->
<div class="ui menu top-nav blue inverted small borderless" v-cloak="">
<div class="ui menu top-nav blue inverted small borderless" :class="(teaTheme == null || teaTheme.length == 0) ? 'theme1': teaTheme" v-cloak="">
<a href="/" class="item">
<i class="ui icon leaf" v-if="teaLogoFileId == 0"></i><img v-if="teaLogoFileId > 0" :src="'/ui/image/' + teaLogoFileId" style="width: auto;height: 1.6em"/> &nbsp; {{teaTitle}}&nbsp;<sup v-if="teaShowVersion">v{{teaVersion}}</sup> &nbsp;
</a>
@@ -58,6 +58,9 @@
<span class="hover-span"><span class="disabled">{{teaUsername}}</span></span>
</a>
<!-- 背景颜色 -->
<a href="" class="item" title="点击切换背景颜色" @click.prevent="changeTheme()"><i class="icon adjust"></i></a>
<!-- 退出登录 -->
<a :href="Tea.url('logout')" class="item" title="安全退出登录"><i class="icon sign out"></i>
<span class="hover-span"><span class="disabled">退出登录</span></span>
@@ -66,7 +69,7 @@
</div>
<!-- 左侧主菜单 -->
<div class="main-menu" v-cloak="">
<div class="main-menu" :class="(teaTheme == null || teaTheme.length == 0) ? 'theme1': teaTheme" v-cloak="">
<div class="ui labeled menu vertical blue inverted tiny borderless">
<div class="item"></div>
<!--<a :href="Tea.url('dashboard')" class="item" :class="{active:teaMenu == 'dashboard'}">

View File

@@ -21,6 +21,17 @@ Tea.context(function () {
this.loadDNSTasks()
})
/**
* 切换模板
*/
this.changeTheme = function () {
this.$post("/ui/theme")
.success(function (resp) {
teaweb.successToast("界面风格已切换")
this.teaTheme = resp.data.theme
})
}
/**
* 左侧子菜单
*/

View File

@@ -241,7 +241,6 @@ body.expanded .main {
z-index: 1000;
overflow-x: auto;
border: 0 !important;
background: #14539A !important;
img.avatar {
width: 1.6em !important;
@@ -279,6 +278,18 @@ body.expanded .main {
}
}
.top-nav.theme1 {
background: #14539A !important;
}
.top-nav.theme2 {
background: #276AC6 !important;
}
.top-nav.theme3 {
background: #007D9C !important;
}
.top-nav::-webkit-scrollbar {
height: 2px;
}
@@ -419,16 +430,35 @@ body.expanded .main {
top: 2em;
bottom: 0;
overflow-y: auto;
background: #14539A !important;
z-index: 10;
.menu {
background: #14539A !important;
border: 0 !important;
box-shadow: none !important;
}
}
.main-menu.theme1 {
background: #14539A !important;
.menu {
background: #14539A !important;
}
}
.main-menu.theme2 {
background: #276AC6 !important;
.menu {
background: #276AC6 !important;
}
}
.main-menu.theme3 {
background: #007D9C !important;
.menu {
background: #007D9C !important;
}
}
.main-menu::-webkit-scrollbar {
width: 2px;
}