<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
    <meta name="decorator" content="base" />
    <link rel="stylesheet" href="${ctxPlugin}/static/css/reset.css" media="all">
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/style/formSelects-v4.css" media="all">
    <%--<style>
        body{
            height: 450px !important;
        }
    </style>--%>

</head>
<body style="">

<div class="" id="" style="height: 100%;">
    <div class="layui-card" style="height: 100%;padding: 20px;">
        <div class="layui-card-body">
            <form class="layui-form" action="" lay-filter="component-form-element">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="mark">*</span>姓名：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="name" required lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input" value="">
                    </div>
                    <label class="layui-form-label">入职时间：</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input sf-ly-date" readonly="readonly" id="hiredate" name="hiredate" value="">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="mark">*</span>手机号：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="mobile" required lay-verify="required|phone" placeholder="请输入手机号" autocomplete="off" class="layui-input" value="">
                    </div>
                    <label class="layui-form-label"><span class="mark">*</span>登录名：</label>
                    <div class="layui-input-inline">
                        <input type="text" name="loginName" required lay-verify="required" placeholder="请输入登录名" autocomplete="off" class="layui-input" value="">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="mark">*</span>设置密码：</label>
                    <div class="layui-input-inline">
                        <input type="text" flag="password"  name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" value="">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="mark">*</span>角色权限：</label>
                    <div class="layui-input-block">
                        <input type="radio" name="role" value="2" title="工程师" checked>
                        <input type="radio" name="role" value="1" title="信息员" >
                        <input type="radio" name="role" value="3" title="备件员" >
                    </div>
                </div>

                <div class="layui-form-item text-c" style="margin-top: 75px;">
                    <button class="layui-btn" lay-submit lay-filter="component-form-element">保存</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/lib/formSelects-v4.js"></script>

<script type="text/javascript">
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'jquery', 'layer', 'laydate', 'formSelects'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,form = layui.form
            ,formSelects = layui.formSelects
            ,index = parent.layer.getFrameIndex(window.name); //获取窗口索引;

        var laydate = layui.laydate;

        $(".sf-ly-date").each(function(){
            laydate.render({
                elem: this,
                trigger: 'click'
            });
        });

        formSelects.render('selectId');

        form.on('submit(component-form-element)', function(data){
            var postData = data.field;
            var role = postData.role;
            if(isBlank(role)){
               layer.msg("请选择角色权限！");
               return;
            }
            var valid = true;
            $.ajax({
                url: '${ctx}/siteEmployee/beforeSave',
                data: postData,
                type: 'post',
                async: false,
                success: function(result){
                    if("1" == result){
                        layer.msg("登录名已被占用!", {icon:2});
                        valid = false;
                    }
                }
            });
            if(!valid){
                return false;
            }

            $.post('${ctx}/siteEmployee/saveEmployee', postData, function(result){
                if("ok" == result){
                    layer.msg("保存成功", {icon:1}, function(){
                        parent.location.reload();
                        parent.layer.close(index);
                    });
                }else{
                    if("err" == result){
                        layer.msg("保存失败，请刷新重试!", {icon:2});
                    }else if("existsLoginName" == result){
                        layer.msg("保存失败，登录名已被占用!", {icon:2});
                    }

                }
            });
            return false;
        });

        $("[flag='password']").bind('input propertychange', function(e) {
            //取消事件的默认动作
            e.preventDefault();
            $(this).attr("type","password");
        });
        $(function(){
            //parent.layer.iframeAuto(index);
        })
    });


    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }
</script>
</body>
</html>