Skip to content

G
guns-vip
Commit 8d136810 by fengshuonan
Options

用户管理增加ztree

parent c40d1b53
Showing with 293 additions and 11 deletions
src/main/webapp/WEB-INF/common/_container.html
...@@ -53,6 +53,9 @@ ...@@ -53,6 +53,9 @@
@if(array.contain(plugins,"table")){ @if(array.contain(plugins,"table")){
<link href="${ctxPath}/assets/common/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" type="text/css" /> <link href="${ctxPath}/assets/common/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" type="text/css" />
@} @}
@if(array.contain(plugins,"ztree")){
<link href="${ctxPath}/assets/common/plugins/ztree/zTreeStyle.css" rel="stylesheet" type="text/css" />
@}
@} @}
<!--其他业务用的css--> <!--其他业务用的css-->
...@@ -114,6 +117,7 @@ ...@@ -114,6 +117,7 @@
<!--Guns JavaScript --> <!--Guns JavaScript -->
<script src="${ctxPath}/assets/common/static/stylefeng/Feng.js"></script> <script src="${ctxPath}/assets/common/static/stylefeng/Feng.js"></script>
<script src="${ctxPath}/assets/common/static/stylefeng/ajax-object.js"></script>
<!--Custom JavaScript --> <!--Custom JavaScript -->
<script src="${ctxPath}/assets/common/static/js/custom.min.js"></script> <script src="${ctxPath}/assets/common/static/js/custom.min.js"></script>
...@@ -134,6 +138,10 @@ ...@@ -134,6 +138,10 @@
<script src="${ctxPath}/assets/common/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script> <script src="${ctxPath}/assets/common/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${ctxPath}/assets/common/plugins/bootstrap-table/bootstrap-table-object.js"></script> <script src="${ctxPath}/assets/common/plugins/bootstrap-table/bootstrap-table-object.js"></script>
@} @}
@if(array.contain(plugins,"ztree")){
<script src="${ctxPath}/assets/common/plugins/ztree/jquery.ztree.all.min.js"></script>
<script src="${ctxPath}/assets/common/plugins/ztree/ztree-object.js"></script>
@}
@} @}
<!--其他业务用的js--> <!--其他业务用的js-->
......
src/main/webapp/WEB-INF/common/_content.html
<div class="page-wrapper"> <div class="page-wrapper">
<div class="container-fluid p-b-0 p-t-20"> <div class="p-20 p-b-0">
<!--开始主页的内容--> <!--开始主页的内容-->
${layoutContent} ${layoutContent}
</div> </div>
......
src/main/webapp/WEB-INF/system/user/user.html
@layout("/common/_container.html",{plugins:["table"],js:["/assets/modular/system/user/user.js"]}){ @layout("/common/_container.html",{plugins:["table","ztree"],js:["/assets/modular/system/user/user.js"]}){
<div class="row"> <div class="row">
<div class="col-lg-2 col-sm-3 p-r-0">
<div class="card card-outline-info m-b-10">
<div class="card-header">
<h4 class="m-b-0 text-white">部门选择</h4>
</div>
<div class="card-block">
<ul id="deptTree" class="ztree"></ul>
</div>
</div>
</div>
<div class="col-lg-10 col-sm-9">
<div class="row">
<div class="col-lg-12"> <div class="col-lg-12">
<div class="card card-outline-info m-b-10"> <div class="card card-outline-info m-b-10">
<div class="card-header"> <div class="card-header">
...@@ -34,8 +46,8 @@ ...@@ -34,8 +46,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-lg-12"> <div class="col-lg-12">
<div class="card card-outline-info m-b-0"> <div class="card card-outline-info m-b-0">
<div class="card-block p-t-0 p-b-0"> <div class="card-block p-t-0 p-b-0">
...@@ -46,37 +58,37 @@ ...@@ -46,37 +58,37 @@
<div class="card m-b-0 p-b-0"> <div class="card m-b-0 p-b-0">
<div class="hidden-xs" id="managerTableToolbar" role="group"> <div class="hidden-xs" id="managerTableToolbar" role="group">
@if(shiro.hasPermission("/mgr/add")){ @if(shiro.hasPermission("/mgr/add")){
<button type="button" class="btn btn-primary" onclick="MgrUser.openAddMgr()"> <button type="button" class="btn btn-primary waves-effect" onclick="MgrUser.openAddMgr()">
<i class="fa fa-plus"></i>&nbsp;添加 <i class="fa fa-plus"></i>&nbsp;添加
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/edit")){ @if(shiro.hasPermission("/mgr/edit")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.openChangeUser()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.openChangeUser()">
<i class="fa fa-edit"></i>&nbsp;修改 <i class="fa fa-edit"></i>&nbsp;修改
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/delete")){ @if(shiro.hasPermission("/mgr/delete")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.delMgrUser()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.delMgrUser()">
<i class="fa fa-remove"></i>&nbsp;删除 <i class="fa fa-remove"></i>&nbsp;删除
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/reset")){ @if(shiro.hasPermission("/mgr/reset")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.resetPwd()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.resetPwd()">
<i class="fa fa-refresh"></i>&nbsp;重置密码 <i class="fa fa-refresh"></i>&nbsp;重置密码
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/freeze")){ @if(shiro.hasPermission("/mgr/freeze")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.freezeAccount()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.freezeAccount()">
<i class="fa fa-warning"></i>&nbsp;冻结 <i class="fa fa-warning"></i>&nbsp;冻结
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/unfreeze")){ @if(shiro.hasPermission("/mgr/unfreeze")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.unfreeze()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.unfreeze()">
<i class="fa fa-check-circle"></i>&nbsp;解除冻结 <i class="fa fa-check-circle"></i>&nbsp;解除冻结
</button> </button>
@} @}
@if(shiro.hasPermission("/mgr/setRole")){ @if(shiro.hasPermission("/mgr/setRole")){
<button type="button" class="btn btn-primary m-l-5" onclick="MgrUser.roleAssign()"> <button type="button" class="btn btn-primary waves-effect m-l-5" onclick="MgrUser.roleAssign()">
<i class="fa fa-user-secret"></i>&nbsp;角色分配 <i class="fa fa-user-secret"></i>&nbsp;角色分配
</button> </button>
@} @}
...@@ -90,5 +102,7 @@ ...@@ -90,5 +102,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div> </div>
@} @}
src/main/webapp/assets/common/plugins/ztree/zTreeStyle.css 0 → 100644
/*-------------------------------------
zTree Style
version: 3.5.19
author: Hunter.z
email: hunter.z@263.net
website: http://code.google.com/p/jquerytree/
-------------------------------------*/
.ztree * {padding:0; margin:0; font-size:12px; font-family: Verdana, Arial, Helvetica, AppleGothic, sans-serif}
.ztree {margin:0; padding:5px; color:#333}
.ztree li{padding:0; margin:0; list-style:none; line-height:14px; text-align:left; white-space:nowrap; outline:0}
.ztree li ul{ margin:0; padding:0 0 0 18px}
.ztree li ul.line{ background:url(./img/line_conn.gif) 0 0 repeat-y;}
.ztree li a {padding:1px 3px 0 0; margin:0; cursor:pointer; height:17px; color:#333; background-color: transparent;
text-decoration:none; vertical-align:top; display: inline-block}
.ztree li a:hover {text-decoration:underline}
.ztree li a.curSelectedNode {padding-top:0px; background-color:#FFE6B0; color:black; height:16px; border:1px #FFB951 solid; opacity:0.8;}
.ztree li a.curSelectedNode_Edit {padding-top:0px; background-color:#FFE6B0; color:black; height:16px; border:1px #FFB951 solid; opacity:0.8;}
.ztree li a.tmpTargetNode_inner {padding-top:0px; background-color:#316AC5; color:white; height:16px; border:1px #316AC5 solid;
opacity:0.8; filter:alpha(opacity=80)}
.ztree li a.tmpTargetNode_prev {}
.ztree li a.tmpTargetNode_next {}
.ztree li a input.rename {height:14px; width:80px; padding:0; margin:0;
font-size:12px; border:1px #7EC4CC solid; *border:0px}
.ztree li span {line-height:16px; margin-right:2px}
.ztree li span.button {line-height:0; margin:0; width:16px; height:16px; display: inline-block; vertical-align:middle;
border:0 none; cursor: pointer;outline:none;
background-color:transparent; background-repeat:no-repeat; background-attachment: scroll;
background-image:url("./img/zTreeStandard.png"); *background-image:url("./img/zTreeStandard.gif")}
.ztree li span.button.chk {width:13px; height:13px; margin:0 3px 0 0; cursor: auto}
.ztree li span.button.chk.checkbox_false_full {background-position:0 0}
.ztree li span.button.chk.checkbox_false_full_focus {background-position:0 -14px}
.ztree li span.button.chk.checkbox_false_part {background-position:0 -28px}
.ztree li span.button.chk.checkbox_false_part_focus {background-position:0 -42px}
.ztree li span.button.chk.checkbox_false_disable {background-position:0 -56px}
.ztree li span.button.chk.checkbox_true_full {background-position:-14px 0}
.ztree li span.button.chk.checkbox_true_full_focus {background-position:-14px -14px}
.ztree li span.button.chk.checkbox_true_part {background-position:-14px -28px}
.ztree li span.button.chk.checkbox_true_part_focus {background-position:-14px -42px}
.ztree li span.button.chk.checkbox_true_disable {background-position:-14px -56px}
.ztree li span.button.chk.radio_false_full {background-position:-28px 0}
.ztree li span.button.chk.radio_false_full_focus {background-position:-28px -14px}
.ztree li span.button.chk.radio_false_part {background-position:-28px -28px}
.ztree li span.button.chk.radio_false_part_focus {background-position:-28px -42px}
.ztree li span.button.chk.radio_false_disable {background-position:-28px -56px}
.ztree li span.button.chk.radio_true_full {background-position:-42px 0}
.ztree li span.button.chk.radio_true_full_focus {background-position:-42px -14px}
.ztree li span.button.chk.radio_true_part {background-position:-42px -28px}
.ztree li span.button.chk.radio_true_part_focus {background-position:-42px -42px}
.ztree li span.button.chk.radio_true_disable {background-position:-42px -56px}
.ztree li span.button.switch {width:18px; height:18px}
.ztree li span.button.root_open{background-position:-92px -54px}
.ztree li span.button.root_close{background-position:-74px -54px}
.ztree li span.button.roots_open{background-position:-92px 0}
.ztree li span.button.roots_close{background-position:-74px 0}
.ztree li span.button.center_open{background-position:-92px -18px}
.ztree li span.button.center_close{background-position:-74px -18px}
.ztree li span.button.bottom_open{background-position:-92px -36px}
.ztree li span.button.bottom_close{background-position:-74px -36px}
.ztree li span.button.noline_open{background-position:-92px -72px}
.ztree li span.button.noline_close{background-position:-74px -72px}
.ztree li span.button.root_docu{ background:none;}
.ztree li span.button.roots_docu{background-position:-56px 0}
.ztree li span.button.center_docu{background-position:-56px -18px}
.ztree li span.button.bottom_docu{background-position:-56px -36px}
.ztree li span.button.noline_docu{ background:none;}
.ztree li span.button.ico_open{margin-right:2px; background-position:-110px -16px; vertical-align:top; *vertical-align:middle}
.ztree li span.button.ico_close{margin-right:2px; background-position:-110px 0; vertical-align:top; *vertical-align:middle}
.ztree li span.button.ico_docu{margin-right:2px; background-position:-110px -32px; vertical-align:top; *vertical-align:middle}
.ztree li span.button.edit {margin-right:2px; background-position:-110px -48px; vertical-align:top; *vertical-align:middle}
.ztree li span.button.remove {margin-right:2px; background-position:-110px -64px; vertical-align:top; *vertical-align:middle}
.ztree li span.button.ico_loading{margin-right:2px; background:url(./img/loading.gif) no-repeat scroll 0 0 transparent; vertical-align:top; *vertical-align:middle}
ul.tmpTargetzTree {background-color:#FFE6B0; opacity:0.8; filter:alpha(opacity=80)}
span.tmpzTreeMove_arrow {width:16px; height:16px; display: inline-block; padding:0; margin:2px 0 0 1px; border:0 none; position:absolute;
background-color:transparent; background-repeat:no-repeat; background-attachment: scroll;
background-position:-110px -80px; background-image:url("./img/zTreeStandard.png"); *background-image:url("./img/zTreeStandard.gif")}
ul.ztree.zTreeDragUL {margin:0; padding:0; position:absolute; width:auto; height:auto;overflow:hidden; background-color:#cfcfcf; border:1px #00B83F dotted; opacity:0.8; filter:alpha(opacity=80)}
.zTreeMask {z-index:10000; background-color:#cfcfcf; opacity:0.0; filter:alpha(opacity=0); position:absolute}
/* level style*/
/*.ztree li span.button.level0 {
display:none;
}
.ztree li ul.level0 {
padding:0;
background:none;
}*/
\ No newline at end of file
src/main/webapp/assets/common/plugins/ztree/ztree-object.js 0 → 100644
/**
* ztree插件的封装
*/
(function() {
var $ZTree = function(id, url) {
this.id = id;
this.url = url;
this.onClick = null;
this.settings = null;
this.ondblclick=null;
};
$ZTree.prototype = {
/**
* 初始化ztree的设置
*/
initSetting : function() {
var settings = {
view : {
dblClickExpand : true,
selectedMulti : false
},
data : {simpleData : {enable : true}},
callback : {
onClick : this.onClick,
onDblClick:this.ondblclick
}
};
return settings;
},
/**
* 手动设置ztree的设置
*/
setSettings : function(val) {
this.settings = val;
},
/**
* 初始化ztree
*/
init : function() {
var zNodeSeting = null;
if(this.settings != null){
zNodeSeting = this.settings;
}else{
zNodeSeting = this.initSetting();
}
var zNodes = this.loadNodes();
$.fn.zTree.init($("#" + this.id), zNodeSeting, zNodes);
},
/**
* 绑定onclick事件
*/
bindOnClick : function(func) {
this.onClick = func;
},
/**
* 绑定双击事件
*/
bindOnDblClick : function(func) {
this.ondblclick=func;
},
/**
* 加载节点
*/
loadNodes : function() {
var zNodes = null;
var ajax = new $ax(Feng.ctxPath + this.url, function(data) {
zNodes = data;
}, function(data) {
Feng.error("加载ztree信息失败!");
});
ajax.start();
return zNodes;
},
/**
* 获取选中的值
*/
getSelectedVal : function(){
var zTree = $.fn.zTree.getZTreeObj(this.id);
var nodes = zTree.getSelectedNodes();
return nodes[0].name;
}
};
window.$ZTree = $ZTree;
}());
\ No newline at end of file
src/main/webapp/assets/common/static/stylefeng/ajax-object.js 0 → 100644
(function () {
var $ax = function (url, success, error) {
this.url = url;
this.type = "post";
this.data = {};
this.dataType = "json";
this.async = false;
this.success = success;
this.error = error;
};
$ax.prototype = {
start : function () {
var me = this;
if (this.url.indexOf("?") == -1) {
this.url = this.url + "?jstime=" + new Date().getTime();
} else {
this.url = this.url + "&jstime=" + new Date().getTime();
}
$.ajax({
type: this.type,
url: this.url,
dataType: this.dataType,
async: this.async,
data: this.data,
beforeSend: function(data) {
},
success: function(data) {
me.success(data);
},
error: function(data) {
me.error(data);
}
});
},
set : function (key, value) {
if (typeof key == "object") {
for (var i in key) {
if (typeof i == "function")
continue;
this.data[i] = key[i];
}
} else {
this.data[key] = (typeof value == "undefined") ? $("#" + key).val() : value;
}
return this;
},
setData : function(data){
this.data = data;
return this;
},
clear : function () {
this.data = {};
return this;
}
};
window.$ax = $ax;
} ());
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment