@extends('manager.layout.master')

@section('body')
    <blockquote class="layui-elem-quote">增加学员 <small>由管理员后台创建学员账号（创建后学员可用手机号+密码登录APP）</small></blockquote>
    <form class="layui-form" action="" method="post" id="form">
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="name" lay-verify="required" placeholder="学员姓名" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-block">
                <input type="text" name="mobile" lay-verify="required" placeholder="登录手机号（唯一）" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">初始密码</label>
            <div class="layui-input-block">
                <input type="text" name="password" lay-verify="required" placeholder="至少6位，学员首次登录后可自行修改" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证号</label>
            <div class="layui-input-block">
                <input type="text" name="id_card" placeholder="选填（学员实名时也可补录）" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">所属企业</label>
            <div class="layui-input-block">
                <select name="enterprise_id" id="enterprise_id" lay-filter="enterprise_id" lay-search>
                    <option value="0">请选择企业</option>
                    @foreach($enterprises as $ent)
                        <option value="{{$ent->id}}">{{$ent->name}}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">班级</label>
            <div class="layui-input-block">
                <select name="class_id" id="class_id" lay-search>
                    <option value="0">请选择班级</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">账号状态</label>
            <div class="layui-input-block">
                <input type="radio" name="status" value="1" title="正常" checked>
                <input type="radio" name="status" value="2" title="禁用">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="submit">保存</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
@stop

@section('js')
    <script>
        layui.use(['form'], function () {
            var form = layui.form;
            // 企业切换时级联加载班级
            form.on('select(enterprise_id)', function (data) {
                var entId = data.value;
                var classSelect = $('#class_id');
                classSelect.html('<option value="0">请选择班级</option>');
                if (entId > 0) {
                    $.getJSON('{{route('studentClasses')}}?enterprise_id=' + entId, function (res) {
                        if (res.status == 1) {
                            $.each(res.data, function (i, item) {
                                classSelect.append('<option value="' + item.id + '">' + item.name + '</option>');
                            });
                            form.render('select');
                        }
                    });
                } else {
                    form.render('select');
                }
            });

            form.on('submit(submit)', function (data) {
                $.ajax({
                    type: 'post',
                    url: '{{route('studentAdd')}}',
                    data: data.field,
                    dataType: 'json',
                    success: function (res) {
                        if (res.status == 1) {
                            layer.msg(res.message, {icon: 1, time: 1200}, function () {
                                parent.location.reload();
                            });
                        } else {
                            layer.msg(res.message, {icon: 0});
                        }
                    }
                });
                return false;
            });
        });
    </script>
@stop