github
/
RuoYi
mirror of https://gitee.com/y_project/RuoYi.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

优化Tab页签跟随主题样式效果

springboot3
RuoYi 2025-05-08 12:47:09 +08:00
parent ab43cb2daa
commit 96381d48d6
3 changed files with 79 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
ruoyi-admin/src/main/resources/static/css/skins.css
View File

@ -1026,3 +1026,65 @@
.fixed-sidebar.theme-blue.mini-navbar .nav li:hover>.nav-second-level {
background-color: rgba(15,41,80,1);
}
/* tab页签样式 */
.page-tabs a {
color: rgba(0,0,0,0.65)!important;
padding: 0 8px 0 8px;
min-width: 50px;
text-align: center;
line-height: 26px;
border-radius: 2px;
margin:5px 0 0 4px;
border: 1px solid #d9d9d9;
}
.page-tabs a.active:hover, .page-tabs a.active i:hover {
color: #000000!important;
background: #f5f5f5!important;
}
.page-tabs a.active:hover i {
color: #ffffff!important;
}
.page-tabs a.active i:hover {
color: #ffffff!important;
background: transparent!important;
}
.page-tabs a.active i {
color: #ffffff;
}
/* tab页签主题样式 */
.skin-blue .page-tabs a.active {
color: #ffffff!important;
background: #1890ff!important;
border: 1px solid #1890ff;
}
.skin-purple .page-tabs a.active {
color: #ffffff!important;
background: #722ed1!important;
border: 1px solid #722ed1;
}
.skin-green .page-tabs a.active {
color: #ffffff!important;
background: #52c41a!important;
border: 1px solid #52c41a;
}
.skin-red .page-tabs a.active {
color: #ffffff!important;
background: #dd4b39!important;
border: 1px solid #dd4b39;
}
.skin-yellow .page-tabs a.active {
color: #ffffff!important;
background: #f39c12!important;
border: 1px solid #f39c12;
}

9
ruoyi-admin/src/main/resources/templates/index-topnav.html
View File

@ -291,7 +291,7 @@
</button>
<nav class="page-tabs menuTabs">
<div class="page-tabs-content">
<a href="javascript:;" class="active menuTab" th:data-id="@{/system/main}">首页</a>
<a href="javascript:;" class="menuTab" th:data-id="@{/system/main}">首页</a>
</div>
</nav>
<button class="roll-nav roll-right tabRight">
@ -392,6 +392,11 @@ function applyPath(url) {
}
}
//默认激活页签
function tabActive() {
$('.menuTab[data-id="' + ctx + 'system/main"]').addClass('active');
}
$(function() {
var lockPath = storage.get('lockPath');
if($.common.equals("history", mode) && window.performance.navigation.type == 1) {
@ -399,6 +404,7 @@ $(function() {
if ($.common.isNotEmpty(url)) {
applyPath(url);
} else {
tabActive();
$(".navbar-toolbar li a").eq(0).click();
}
} else if($.common.isNotEmpty(lockPath)) {
@ -413,6 +419,7 @@ $(function() {
if($.common.equals("history", mode)) {
storage.set('publicPath', "");
}
tabActive();
$(".navbar-toolbar li a").eq(0).click();
}
}

10
ruoyi-admin/src/main/resources/templates/index.html
View File

@ -237,7 +237,7 @@
</button>
<nav class="page-tabs menuTabs">
<div class="page-tabs-content">
<a href="javascript:;" class="active menuTab" th:data-id="@{/system/main}">首页</a>
<a href="javascript:;" class="menuTab" th:data-id="@{/system/main}">首页</a>
</div>
</nav>
<button class="roll-nav roll-right tabRight">
@ -330,12 +330,19 @@ function applyPath(url) {
}
}
// 默认激活页签
function tabActive() {
$('.menuTab[data-id="' + ctx + 'system/main"]').addClass('active');
}
$(function() {
var lockPath = storage.get('lockPath');
if($.common.equals("history", mode) && window.performance.navigation.type == 1) {
var url = storage.get('publicPath');
if ($.common.isNotEmpty(url)) {
applyPath(url);
} else {
tabActive();
}
} else if($.common.isNotEmpty(lockPath)) {
applyPath(lockPath);
@ -349,6 +356,7 @@ $(function() {
if($.common.equals("history", mode)) {
storage.set('publicPath', "");
}
tabActive();
}
}