<!DOCTYPE html><html><head><meta charset="utf-8"><meta content="webkit" name="renderer"/><meta http-equiv="X-UA-Compatible"
content="IE=edge"><meta name="keywords" content="PoweredByJeeSiteV4.0"/><meta http-equiv="Cache-Control"
content="no-cache, no-store, must-revalidate"/><meta name="description" content="PoweredByJeeSiteV4.0"/><meta
content="no-cache" http-equiv="Pragma"/><meta http-equiv="Expires" content="0"/><meta
content="width=device-width, initial-scale=1, user-scalable=1" name="viewport"/>
<title>角色管理 - JeeSite Demo</title>
<script th:src="${setting.domain + 'global.min.js'}"></script>
<script th:src="${setting.domain + 'jquery/jquery-1.12.4.min.js'}"></script>
<script th:src="${setting.domain + 'jquery/jquery-migrate-1.4.1.min.js'}"></script>
<!--[if lt IE 9]><script src="/js/static/common/h5fix.min.js"></script><![endif]-->
<link rel="stylesheet" th:href="${setting.domain + 'fonts/font-icons.min.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'bootstrap/css/bootstrap.min.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'select2/4.0/select2.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'icheck/1.0/minimal/grey.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'jquery-ztree/3.5/css/metro/zTreeStyle.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'adminlte/css/AdminLTE.min.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'common/jeesite.css'}">
<link rel="stylesheet" th:href="${setting.domain + 'common/common.css'}">
</head><body class="hold-transition ">
<div class="wrapper"><div class="main-content">
	<div class="box box-main">
		<div class="box-header">
			<div class="box-title">
				<i class="fa icon-people"></i> 新增角色
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
<form id="inputForm" th:action="${setting.domain + 'sys/role/save'}" method="post" class="form-horizontal">
<input type="hidden" id="op" name="op" value="add"/>
			<div class="box-body">
				<div class="form-unit">基本信息</div>
				<div class="row">
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required ">*</span> 角色名称：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
<input type="hidden" id="oldRoleName" name="oldRoleName" value=""/>
<input type="text" id="roleName" name="roleName" value="" maxlength="100" class="form-control required "/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required ">*</span> 角色编码：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
<input type="hidden" id="isNewRecord" name="isNewRecord" value="true"/>
<input type="text" id="roleCode" name="roleCode" value="" maxlength="64" class="form-control required abc"/>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required ">*</span> 排序号：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
<input type="text" id="roleSort" name="roleSort" value="40" maxlength="10" class="form-control required digits"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> 用户类型：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">

<select id="userType" name="userType" class="form-control ">
<option value="">&nbsp;</option><option value="employee">员工</option><option value="member">会员</option><option value="btype">单位</option><option value="persion">个人</option><option value="expert">专家</option></select>							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required ">*</span> 系统内置：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">

<span id="isSys" class="icheck">
<label><input type="radio" id="isSys1" name="isSys"
			value="1" class="form-control required "> 是</label><label><input type="radio" id="isSys2" name="isSys"
			value="0" class="form-control required "> 否</label></span>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> 角色分类：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">

<select id="roleType" name="roleType" class="form-control ">
<option value="">&nbsp;</option><option value="1">高管</option><option value="2">中层</option><option value="3">基层</option><option value="4">其它</option></select>							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-12">
						<div class="form-group">
							<label class="control-label col-sm-2" title="">
								<span class="required hide">*</span> 备注信息：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-10">
<textarea id="remarks" name="remarks" rows="4" maxlength="500" class="form-control "></textarea>
							</div>
						</div>
					</div>
				</div>
				<div class="form-unit">授权功能菜单</div>
				<div id="menuTrees"></div>
				<script id="menuTpl" type="text/template">
					<div class="pull-left" style="padding:0 15px;min-width:300px;">
						<div class="box box-solid" style="background:#FAFAFA">
							<div class="box-header">
								<div class="box-title icheck">
									<label><input type="checkbox" id="checkall_{{d.key}}"
										class="checkall"/> {{d.label}}</label>
								</div>
								<div class="box-tools pull-right" style="top:8px;">
									<a class="btn btn-box-tool" id="expand_{{d.key}}"
										value="menuTree_{{d.key}}" >展开</a>/<a
										class="btn btn-box-tool" id="collapse_{{d.key}}"
										value="menuTree_{{d.key}}" >折叠</a>
								</div>
							</div>
							<div class="box-body">
								<div id="menuTree_{{d.key}}" class="ztree"></div>
							</div>
						</div>
					</div>
				</script>
<input type="hidden" id="roleMenuListJson" name="roleMenuListJson" value=""/>
			</div>
			<div class="box-footer">
				<div class="row">
					<div class="col-sm-offset-2 col-sm-10">
							<button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> 保 存</button>&nbsp;
						<button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="js.closeCurrentTabPage()"><i class="fa fa-reply-all"></i> 关 闭</button>
					</div>
				</div>
			</div>
</form>
	</div>
</div>
</div>

<a id="scroll-up" href="#" class="btn btn-sm"><i class="fa fa-angle-double-up"></i></a>
<script th:src="${setting.domain + 'bootstrap/js/bootstrap.min.js'}"></script>
<script th:src="${setting.domain + 'select2/4.0/select2.js'}"></script>
<script th:src="${setting.domain + 'select2/4.0/i18n/zh_CN.js'}"></script>
<script th:src="${setting.domain + 'layer/3.1/layer.js'}"></script>
<script th:src="${setting.domain + 'my97/WdatePicker.js'}"></script>
<script th:src="${setting.domain + 'jquery-ztree/3.5/js/jquery.ztree.all-3.5.js'}"></script>
<script th:src="${setting.domain + 'jquery-validation/1.16/jquery.validate.js'}"></script>
<script th:src="${setting.domain + 'jquery-validation/1.16/localization/messages_zh_CN.js'}"></script>
<script th:src="${setting.domain + 'jquery-validation/1.16/jquery.validate.extend.js'}"></script>
<script th:src="${setting.domain + 'common/jeesite.js'}"></script>
<script th:src="${setting.domain + 'common/i18n/jeesite_zh_CN.js'}"></script>
<script th:src="${setting.domain + 'common/common.js'}"></script>
<script>
$("#inputForm").validate({
	submitHandler: function(form){
		// 获取数据权限数据
		var menuData = [];
		$.each(menuTrees, function(key, menuTree){
			var treeNodes = menuTree.getCheckedNodes(true);
			for(var i=0; i<treeNodes.length; i++) {
				menuData.push(treeNodes[i].id);
			}
		});
		$("#roleMenuListJson").val(JSON.stringify(menuData));
		// 提交表单数据
		js.ajaxSubmitForm($(form), function(data){
			js.showMessage(data.message);
			if(data.code == 0){
				js.closeCurrentTabPage(function(contentWindow){
					contentWindow.page();
				});
			}
		}, "json");
    }
});
//加载数据权限树结构
var setting = {
	check:{enable:true,nocheckInherit:true,chkboxType:{"Y":"ps","N":"ps"}},
	view:{selectedMulti:false,nameIsHTML: true},
	data:{simpleData:{enable:true},key:{title:"title"}},
	callback:{
		beforeClick: function (treeId, treeNode, clickFlag) {
			var tree = $.fn.zTree.getZTreeObj(treeId);
			tree.checkNode(treeNode, !treeNode.checked, true, true);
			return false;
		},
		onCheck: function (event, treeId, treeNode){
			var tid = treeNode.tId;
			if(!treeNode.checked){
				$(".checkall[value="+treeId+"]").each(function(){
					if(this.checked){
					    $(this).removeAttr("checked").iCheck('update');
					}
					return false;
				}); 
			}
		}
	}
},
sysCodeDict = [{"id":"1019065441754435584","updateDate":"2018-07-17 11:45","updateBy":"system","createBy":"system","status":"0","createDate":"2018-07-17 11:45","treeSort":30,"treeNames":"主导航菜单","parentCodes":"0,","treeLeaf":"1","treeLevel":0,"treeSorts":"0000000030,","dictCode":"1019065441754435584","description":"","cssStyle":"","cssClass":"","dictLabelOrig":"主导航菜单","dictValue":"default","dictType":"sys_menu_sys_code","isSys":"1","dictLabel":"主导航菜单","parentCode":"0","isRoot":true,"isTreeLeaf":true}],
menuTrees = {}; // 用sysCode分类存储所有菜单树
$.ajax({
	type: 'POST',
	url: ctx + "sys/role/menuTreeData?___t=" + new Date().getTime(),
	data: {roleCode: ''},
	dataType: 'json',
	async: false,
	error: function(data){
		js.showErrorMessage(data.responseText);
	},
	success: function(data, status, xhr){
		for (var sysCode in data.menuMap){
		 	var menuMap = data.menuMap[sysCode];
		 	$('#menuTrees').append(js.template('menuTpl', {key: sysCode, label: js.getDictLabel(sysCodeDict, sysCode, '未知', true)}));
			// 初始化树结构
			var tree = $.fn.zTree.init($("#menuTree_"+sysCode), setting, menuMap);
			// 展开第一级节点
			var nodes = tree.getNodesByParam("level", 0);
			for(var i=0; i<nodes.length; i++) {
				tree.expandNode(nodes[i], true, false, false);
			}
			// 展开第二级节点
			nodes = tree.getNodesByParam("level", 1);
			for(var i=0; i<nodes.length; i++) {
				tree.expandNode(nodes[i], true, false, false);
			}
			// 默认展开全部节点
			//tree.expandAll(true);
			// 树结构：全选、取消全选
			$('#checkall_'+sysCode).iCheck({
	        	checkboxClass:'icheckbox_minimal-grey'
   			}).on('ifChecked ifUnchecked', function(){
				var sysCode = $(this).attr('sysCode');
				if(this.checked){
					menuTrees[sysCode].checkAllNodes(true);
				}else{
					menuTrees[sysCode].checkAllNodes(false);
				}
			}).attr("sysCode", sysCode);
			// 展开和折叠按钮绑定
			$('#expand_'+sysCode).click(function(){
				var sysCode = $(this).attr('sysCode');
				menuTrees[sysCode].expandAll(true);
			}).attr("sysCode", sysCode);
			$('#collapse_'+sysCode).click(function(){
				var sysCode = $(this).attr('sysCode');
				menuTrees[sysCode].expandAll(false);
			}).attr("sysCode", sysCode);
			// 将树对象存储到全局数组里
			menuTrees[sysCode] = tree;
		}
		// 默认选择节点 
		for (var idx in data.roleMenuList){
			var roleMenu = data.roleMenuList[idx], sysCode = roleMenu.sysCode;
			var node = menuTrees[sysCode].getNodeByParam("id",roleMenu.menuCode);
			try{menuTrees[sysCode].checkNode(node, true, false);}catch(e){}
		}
	}
});
</script>