{extend name="Public/base" /}
{block name="css"}
<!--<link rel="stylesheet" href="__PUBLIC__/item/css/layui.css?v={$Think.const.APP_VERSION}">-->
<link rel="stylesheet" href="__PUBLIC__/css/customer.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/set.css?v={$Think.const.APP_VERSION}">
{/block}
{block name="js"}

<script src="__PUBLIC__/js/jquery-1.9.0.min.js?v={$Think.const.APP_VERSION}" type="text/jscript"></script>
{/block}
{block name="main"}
<!--添加规则-->
<div class="if_wrap">
    <div class="cus-con">
        <div class="set_tit" style="float:left;"><span>新建类别</span></div>

        <form class="layui-form modal-form" id="menu" action="{:url('papi/Category/add')}" method="post">
            <input type="hidden" name="pid" value="">

            <div class="layui-form-item">
                <label class="layui-form-label">分类名称：</label>

                <div class="layui-input-block">
                    <input type="text" id="menu_name" value="" lay-verify="required|title" required autocomplete="off" class="layui-input" style="width: 300px" name="name" >
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">分类描述：</label>

                <div class="layui-input-block">
                    <input type="text" id="specifications" value="" lay-verify="required|title" required autocomplete="off" class="layui-input" style="width: 300px" name="specifications" >
                </div>
            </div>
            <div class="layui-form-item" id="sel-con">
                <label class="layui-form-label">上级分类：</label>
                <div class="layui-input-inline">
                    <select name="quiz1">
                        <option value="">请选择</option>
                        {foreach $data.data as $key=>$v }
                        <option value="{$v.id}">{$v.cname}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" id="tj" type="button" lay-submit="" lay-filter="formDemo">&nbsp;&nbsp;确定&nbsp;&nbsp;</button>
                </div>
            </div>
        </form>

    </div>
</div>

<div class="layui-input-inline" id="template" style="display: none">
    <select>
        <option value="0">请选择</option>
    </select>
</div>
<script>
    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#starttime',
            type: 'datetime'
        });

        laydate.render({
            elem: '#starttime_2',
            type: 'datetime'
        });
    });
</script>
<script>
    layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'form'], function () {
        var laydate = layui.laydate //日期
                , laypage = layui.laypage //分页
                , layer = layui.layer //弹层
                , table = layui.table //表格
                , carousel = layui.carousel //轮播
                , upload = layui.upload //上传
                , element = layui.element;//元素操作
        var form = layui.form;
        var $ = layui.$,
                form = layui.form;
        //各种基于事件的操作，下面会有进一步介绍
        form.on('select', function(data){
            var index = layer.load(1);
            var id = data.value;
            var data = data;
            $('input[name=pid]').val(id);
            $(data.elem).parents(".layui-input-inline").nextAll().remove();
            $.ajax({
                url: "{:url('papi/Category/queryFind');}",
                data: {id: id},
                type: 'get',
                success: function (e) {
                    if (e.code == 200) {
                        $('#template').find('select').html('');
                        var html = '<option value="0">请选择</option>';
                        $.each(e.data,function(n,v){
                            html += '<option value="'+ v.id+'">'+ v.cname+'</option>';
                        });
                        $('#template').find('select').append(html);

                        var tem=$("#template").clone();
                        tem.attr("id",'');
                        tem.show();
                        $("#sel-con").append(tem);
                        form.render();
                    }
                }

            })
            layer.close(index);
        });
    });
</script>

<script>
    $('#tj').on('click', function (data) {
        $('#tj').attr('disabled',true);
        var menu = $("#menu").serialize();
        var url = "{:url('papi/Category/add')}";
        $.ajax({
            type: "POST",
            url: url,
            data: menu,
            dataType: "json",
            success: function (ret) {
                if (ret.code == 200) {
                    var pid = Number($('input[name=pid]').val());
                    layer.open({
                        content: '添加成功！',
                        btn: ['确认'],
                        yes: function(index, layero) {
                            window.location.href="{:url('/oa/Category/index')}?pid="+pid;
                        },
                    });
                } else {
                    $('#tj').attr('disabled',false);
                    layer.alert(ret.msg);
                }
            }
        });
        return false;
    });
</script>
{/block}