add.html 7.12 KB
<div class="page-head">
	<div class="page-title">
		<h1>添加用户</h1>
	</div>
</div>

<ul class="page-breadcrumb breadcrumb">
	<li><a href="/pages/home.html" data-pjax>首页</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">权限管理</span> <i class="fa fa-circle"></i></li>
	<li><a href="list.html" data-pjax>用户管理</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">添加用户</span></li>
</ul>

<div class="portlet light bordered">
	<div class="portlet-title">
		<div class="caption">
			<i class="icon-equalizer font-red-sunglo"></i> <span
				class="caption-subject font-red-sunglo bold uppercase">表单</span>
		</div>
	</div>
	<div class="portlet-body form">
		<form action="/addUser" class="form-horizontal" id="user_add_form" >
		<div class="alert alert-danger display-hide">
			<button class="close" data-close="alert"></button>
			您的输入有误,请检查下面的输入项
		</div>
			<div class="form-body">
				<div class="form-group">
					<label class="col-md-3 control-label">登录名</label>
					<div class="col-md-4">
							<input type="text" class="form-control" name="userName" >
							<span class="help-block"> 登录时的帐号</span>
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label">姓名</label>
					<div class="col-md-4">
							<input type="text" class="form-control" name="name" >
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label">密码</label>
					<div class="col-md-4">
							<input type="password" class="form-control" id="password" name="password" >
							<!--<span class="help-block"> 请输入6位以上密码</span>-->
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label">确认密码</label>
					<div class="col-md-4">
							<input type="password" class="form-control" name="cfmPassword" >
							<span class="help-block"> 请重新输入密码</span>
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label">所属机构</label>
					<div class="col-md-4">
							<input type="text" class="form-control" name="agencies" >
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-md-3 control-label">角色</label>
					<div class="col-md-4">
							<select class="form-control" id="role" name="roles[]" style="width: 160px;" multiple="multiple">
								
							</select>
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-md-3 control-label">是否启用</label>
					<div class="col-md-4">
						<div class="input-group">
							<select class="form-control" name="enabled" style="width: 160px;">
								<option value="1">可用</option>
								<option value="0">禁用</option>
							</select>
						</div>
					</div>
				</div>
			</div>
			<div class="form-actions">
				<div class="row">
					<div class="col-md-offset-3 col-md-4">
						<button type="submit" class="btn green" ><i class="fa fa-check"></i> 提交</button>
						<a type="button" class="btn default" href="list.html" data-pjax><i class="fa fa-times"></i> 取消</a>
					</div>
				</div>
			</div>
		</form>
		<!-- END FORM-->
	</div>
</div>
<script>
	$(function(){
		/*$get('/role/all',null,function(result){
			$.each(result,function(i,obj){
				$("#role").append("<option value='"+obj.id+"'>"+obj.roleName+"</option>");
			});
		});*/

        // 查询下级角色
        $.get('/role/findSubordinate', function (rs) {
            if(rs.status == "SUCCESS"){
                if(rs.list.length < 1){
                    loadPage('/pages/permission/role/add.html');
                    layer.open({
                        // type: 2,
                        content: '用户需要有下级角色才能添加用户!',
                        title: '请添加下级角色',
                        shift: 5,
                        scrollbar: false
                    });
                    return;
                }

                $.each(rs.list,function(i,obj){
                    $("#role").append("<option value='"+obj.id+"'>"+obj.roleName+"</option>");
                });
            }else {
                loadPage('/pages/permission/role/list.html');
                layer.open({
                    // type: 2,
                    content: rs.msg,
                    title: "用户的下级角色有问题",
                    shift: 5,
                    scrollbar: false
                });
			}
        });

		
		var form = $('#user_add_form');
		var error = $('.alert-danger', form);

        $.validator.addMethod("passwordrule", function(value, element) {
            //var userblank = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*?[#?!@$%^&*-]).{8,16}$/;
            var userblank = /^(?=.*[a-zA-Z])(?=.*\d).{8,16}$/;
            return this.optional(element) ||(userblank.test(value));
        }, "需包含字母、数字的8-16位字符");

		//表单 validate
		form.validate({
			errorElement : 'span', 
			errorClass : 'help-block help-block-error', 
			focusInvalid : false, 
			rules : {
				'userName' : {
					required : true,
					maxlength: 25
				},
				'name' : {
					required : true,
					maxlength: 25
				},
				'password' : {
					required : true,
                    minlength: 8,
                    maxlength: 16,
                    passwordrule: true
				},
				'cfmPassword' : {
					equalTo: '#password',
				},
				'roles[]' : {
					required : true,
					minlength: 1
				}
			},
			invalidHandler : function(event, validator) {         
				error.show();
				App.scrollTo(error, -200);
			},

			highlight : function(element) { 
				$(element).closest('.form-group').addClass('has-error'); 
			},

			unhighlight : function(element) { 
				$(element).closest('.form-group').removeClass('has-error'); 
			},

			success : function(label) {
				label.closest('.form-group').removeClass('has-error'); 
			},

			submitHandler : function(f) {
				var params = form.serializeJSON();
				error.hide();

                var keys;
                $.ajax({
                    url: "/user/login/jCryptionKey?t="+Math.random(),
                    type: "Get",
                    async:false,
                    data: null,
                    success: function(data) {
						keys = data.publickey;
					}
                });
                //RSA加密
                var encrypt = new JSEncrypt();
                encrypt.setPublicKey(keys);
                params.userName = encrypt.encrypt(params.userName);
                params.password = encrypt.encrypt(params.password);
				$.ajax({
					url: '/user/register',
					type: 'POST',
					traditional: true,
					data: params,
					success: function(rs){
						if(!rs){
							layer.msg('未知异常!');
						}
						if(rs.status=='SUCCESS'){
							layer.msg('添加用户成功.');
							loadPage('list.html');
						}
						else if(rs.status=='ERROR'){
							layer.msg('添加失败[ ' + rs.msg + ']');
						}
					}
				});
			}
		});
	});
</script>