SkyID
/
zheng
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

增加操作选项卡事件

This commit is contained in:
shuzheng 2016-12-04 00:45:11 +08:00
parent 5182078e41
commit df0ae2dd01
2 changed files with 39 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
zheng-cms/zheng-cms-web/src/main/webapp/resources/index.html
View File

@ -133,37 +133,37 @@
<li class="sub-menu">
<a class="waves-effect" href="javascript:;"><i class="zmdi zmdi-widgets"></i> 系统组织管理</a>
<ul>
<li><a class="waves-effect" href="javascript:;">系统注册</a></li>
<li><a class="waves-effect" href="javascript:;">组织管理</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('系统注册', 'home.html');">系统注册</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('组织管理', 'home.html');">组织管理</a></li>
</ul>
</li>
<li class="sub-menu">
<a class="waves-effect" href="javascript:;"><i class="zmdi zmdi-widgets"></i> 用户角色管理</a>
<ul>
<li><a class="waves-effect" href="javascript:;">用户管理</a></li>
<li><a class="waves-effect" href="javascript:;" ng-click="addTab('角色管理', 'typography.html')">角色管理</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('用户管理', 'home.html');">用户管理</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('角色管理', 'home.html');">角色管理</a></li>
</ul>
</li>
<li class="sub-menu">
<a class="waves-effect" href="javascript:;"><i class="zmdi zmdi-widgets"></i> 资源权限管理</a>
<ul>
<li><a class="waves-effect" href="javascript:;">资源管理</a></li>
<li><a class="waves-effect" href="javascript:;">权限管理</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('资源管理', 'home.html');">资源管理</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('权限管理', 'home.html');">权限管理</a></li>
</ul>
</li>
<li class="sub-menu">
<a class="waves-effect" href="javascript:;"><i class="zmdi zmdi-widgets"></i> 权限分配管理</a>
<ul>
<li><a class="waves-effect" href="javascript:;">角色权限</a></li>
<li><a class="waves-effect" href="javascript:;">用户权限</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('角色权限', 'home.html');">角色权限</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('用户权限', 'home.html');">用户权限</a></li>
</ul>
</li>
<li class="sub-menu">
<a class="waves-effect" href="javascript:;"><i class="zmdi zmdi-widgets"></i> DEMO</a>
<ul>
<li><a class="waves-effect" href="javascript:;">获取资源(DEMO)</a></li>
<li><a class="waves-effect" href="javascript:;">获取权限(DEMO)</a></li>
<li><a class="waves-effect" href="javascript:;">单点登录(DEMO)</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('获取资源(DEMO)', 'home.html');">获取资源(DEMO)</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('获取权限(DEMO)', 'home.html');">获取权限(DEMO)</a></li>
<li><a class="waves-effect" href="javascript:tab.addTab('单点登录(DEMO)', 'home.html');">单点登录(DEMO)</a></li>
</ul>
</li>
<li>
@ -179,57 +179,12 @@
<a href="javascript:;"><i class="zmdi zmdi-chevron-left"></i></a>
</div>
<div class="tab_right">
<a class="active" href="javascript:;"><i class="zmdi zmdi-chevron-right"></i></a>
<a href="javascript:;"><i class="zmdi zmdi-chevron-right"></i></a>
</div>
<ul>
<li class="cur">
<a class="waves-effect waves-light" href="javascript:;">首页</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">系统注册</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">新增标签</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">内容编辑</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">个人详情</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">系统注册</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">新增标签</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">内容编辑</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">个人详情</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">系统注册</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">新增标签</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">内容编辑</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">个人详情</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">系统注册</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">新增标签</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">内容编辑</a>
</li>
<li>
<a class="waves-effect waves-light" href="javascript:;">个人详情</a>
</li>

29
zheng-cms/zheng-cms-web/src/main/webapp/resources/js/admin.js
View File

@ -28,8 +28,33 @@ $(function() {
}
});
// 选项卡
$('.content_tab li').click(function() {
$(document).on('click', '.content_tab li', function() {
$('.content_tab li').removeClass('cur');
$(this).addClass('cur');
});
});
// 控制选项卡滚动位置
$('.tab_left>a').click(function() {
$('.content_tab>ul').animate({scrollLeft: $('.content_tab>ul').scrollLeft() - 300}, 200);
if ($('.content_tab>ul').scrollLeft() == 0) {
$('.tab_left>a').removeClass('active');
} else {
$('.tab_left>a').addClass('active');
}
});
$('.tab_right>a').click(function() {
$('.content_tab>ul').animate({scrollLeft: $('.content_tab>ul').scrollLeft() + 300}, 200);
if ($('.content_tab>ul').scrollLeft() == 0) {
$('.tab_left>a').removeClass('active');
} else {
$('.tab_left>a').addClass('active');
}
});
// 初始化
});
var tab = {
addTab: function(title, url) {
$('.content_tab li').removeClass('cur');
var tab = '<li class="cur"><a class="waves-effect waves-light" href="javascript:;">' + title + '</a></li>';
$('.content_tab>ul').append(tab);
}
}