#override("css")
<link rel="stylesheet" href="${ctx}/static/js/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css" />
#end
#override("js")
<script src="${ctx}/static/js/zTree_v3/js/jquery.ztree.all-3.5.min.js" type="text/javascript"></script>
<script type="text/javascript">
var reNodes = ${perString};
</script>
<script>
var setting_resource = {
    check: {
        enable: true,
        chkboxType: {
            'Y': 's',
            'N': 's'
        }
    },
    view: {
        dblClickExpand: false
    },
    data: {
        simpleData: {
            enable: true,
            idKey: "uri",
            pIdKey: 'puri'
        }
    },
    callback: {
        beforeClick: beforeClick_resource,
        onCheck: onCheck_resource
    }
};
function beforeClick_resource(treeId, treeNode) {
    var zTree = $.fn.zTree.getZTreeObj('tree_resource');
    zTree.expandNode(treeNode);
    zTree.checkNode(treeNode, !treeNode.checked, null, true);
    return false;
}
function selectTreeNode_resource(id) {
    var zTree = $.fn.zTree.getZTreeObj('tree_resource');
    var node = zTree.getNodeByParam('id', id);
    var pNode = node.getParentNode();
    while (pNode != null) {
        pNode = analParentNode(pNode, zTree);
    }
    zTree.cancelSelectedNode();
    zTree.checkNode(node, true);
    zTree.selectNode(node, true);
}
function analParentNode(node, zTree) {
    zTree.expandNode(node, true);
    var pNode = node.getParentNode();
    if (pNode) {
        return pNode;
    }
    return null;
}
function onClick_resource(e, treeId, treeNode) {
    var zTree = $.fn.zTree.getZTreeObj('tree_resource');
    zTree.expandNode(treeNode);
    zTree.checkNode(treeNode, !treeNode.checked, null, true);
    return false;
}
function onCheck_resource(e, treeId, treeNode) {
    var zTree = $.fn.zTree.getZTreeObj('tree_resource'),
    nodes = zTree.getCheckedNodes(true),
    v_txt = '';
    v_value = '';
    v_type = '';
    for (var i = 0,
    l = nodes.length; i < l; i++) {
        v_txt += nodes[i].name + ',';
        v_value += nodes[i].id + ',';
        if (nodes[i].type) {
            v_type += nodes[i].type + ',';
        }
    }
    if (v_txt.length > 0) {
        v_txt = v_txt.substring(0, v_txt.length - 1);
        v_value = v_value.substring(0, v_value.length - 1);
        v_type = v_type.substring(0, v_type.length - 1);
    }
    $('#resource').attr('value', v_value);
    $('#resource_txt').attr('value', v_txt);
    $('#resource_type').attr('value', v_type);
}
var zNodes_resource = null;
var zTree_selectMode_resource = 'all';
$(function() {
    zNodes_resource = reNodes;
    var zTree = $.fn.zTree.init($('#tree_resource'), setting_resource, zNodes_resource);
    
    //初始化勾选
    var rpValues = $('#resource').val();
    if(rpValues.length > 0){
		var rpArray = rpValues.split(",");
		for(var i = 0 ; i < rpArray.length ;i++){
			var node = zTree.getNodeByParam('id',rpArray[i]);
			if(node != null){
				zTree.checkNode(node,true,false);
			}
		}
    }
	zTree.expandAll(true);
});

</script>
#end
#override("body")
<div class="ibox float-e-margins">
	<div class="row">
	    <div class="col-sm-4">
	        <form id="validForm" class="form-horizontal m-t" novalidate="novalidate">
	        	<input id="resource" name="resource" type="hidden" value="$!rolePermissions"/>
	        	<input type="hidden" id="role.id" name="id" value="$!role.id"/>
	            <div class="form-group">
	                <label class="col-sm-3 control-label">角色名：</label>
	                <div class="col-sm-8">
	                    <input type="text" placeholder="用户名" value="$!role.name" aria-required="true" required="true" class="form-control" minlength="2" name="name" id="name">
	                </div>
	            </div>
	            <div class="form-group">
	            	<label class="col-sm-3 control-label">角色类型：</label>
	                <div class="col-sm-8">
	                    <select class="form-control m-b" name="type">
                            <option value="1" #if ($role.type == 1) selected="selected" #end >用户角色</option>
                            <option value="0" #if ($role.type == 0) selected="selected" #end >管理员角色</option>
                        </select>
	                </div>
	            </div>
	            <div class="form-group">
	                <label class="col-sm-3 control-label">角色备注：</label>
	                <div class="col-sm-8">
	                    <input type="text" placeholder="角色备注" value="$!role.remarks" aria-required="true" required="true" class="form-control" minlength="2" name="remarks" id="remarks">
	                </div>
	            </div>
	            <div class="form-group">
	                <label class="col-sm-3 control-label">角色简码：</label>
	                <div class="col-sm-8">
	                    <input type="text" placeholder="角色简码" value="$!role.shortCode" aria-required="true" required="true" class="form-control" minlength="2" name="shortCode" id="shortCode">
	                </div>
	            </div>
	            <div class="form-group">
	                <label class="col-sm-3 control-label">医院id：</label>
	                <div class="col-sm-8">
	                	#selector("orgId" "orgId" $orgs $!role.orgId)
	                </div>
	            </div>
	            <div class="form-group">
	                <label class="col-sm-3 control-label">医院组：</label>
	                <div class="col-sm-8">
	                	#selector("grouporgId" "grouporgId" $groups $!role.grouporgId)
	                </div>
	            </div>
	            <div class="form-group">
	            	<label class="col-sm-3 control-label"></label>
	                <div class="col-sm-8">
	                    <label class="checkbox-inline i-checks">
							<div class="icheckbox_square-green" style="position: relative;">
								<input type="checkbox" value="0" name="enable" #if ($role.enable == 0) checked="checked" #end 
									style="position: absolute; opacity: 0;" >
								<ins class="iCheck-helper"
									style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins>
							</div>是否禁用（选中禁用，不选中可用）
						</label>
	                </div>
	            </div>
	            <div class="hr-line-dashed"></div>
	            <div class="form-group">
	                <div class="col-sm-4 col-sm-offset-3 pull-right">
	                    <button type="button" class="btn btn-primary" onclick="save();"><i class="fa fa-check"></i>&nbsp;提交</button>
	                    <button type="button" class="btn btn-white" onclick="parent.closeAll();"><i class="fa fa-close"></i>&nbsp;取消</button>
	                </div>
	            </div>
	        </form>
	    </div>
	    <div class="col-sm-6">
		  <div id="treeContent_resource" class="menuContent"> 
		   	<ul id="tree_resource" class="ztree" style="margin-top:0; width:180px; height: 250px;"></ul>
		  </div>
        </div>
    </div>
</div>
<script type="text/javascript">
	var controllerRequestMappint = "/sysRoles/";
	function save(){
		if($('#validForm').valid()){
			var data = $('#validForm').serialize();
			data = data + "&" + $('#roleForm').serialize();
			if("$!role.id" == ""){
				ajaxPost(APP.PATH + controllerRequestMappint + "create",data);
			}else{
				ajaxPost(APP.PATH + controllerRequestMappint + "update",data);
			}
			parent.reloadGrid('dataTable');
		}
	}
</script>
#end 
#extends("/common/base_list.html")