{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}">
<style>

</style>
{/block}
{block name="js"}
<!--<script src="__PUBLIC__/js/jquery-1.9.0.min.js?v={$Think.const.APP_VERSION}" type="text/jscript"></script>-->
<script>
    $(function(){
        $(".nul_bli").eq(4).find(".navb").addClass("active");
//        $(".navb.active").parent().find(".nul_s .nul_sli").eq(16).find(".navs").addClass("active");
    })
</script>
{/block}
{block name="main"}
<div class="if_wrap">
    <div class="cus-con">
        <div class="set_tit"><span>{$title}</span></div>
        <div class=" set-top layui-form layui-form-item">
            <label style="width:50px;" class="layui-form-label mkz_t1">事业部：</label>
            <div class="layui-input-inline">
                <select name="brand_id" id="brand_id" lay-filter="brandclass" lay-search="">
                    <option value="0">全部</option>
                    {volist name="brand" id="vo"}
                    <option value="{$vo.id}">{$vo.brandclass}</option>
                    {/volist}
                </select>
            </div>
            <label style="width:70px;" class="layui-form-label mkz_t1">店面：</label>
            <div class="layui-input-inline">
                <select name="shop_code" id="shop_code" lay-filter="shop" lay-search="">
                    <option value="">全部</option>
                    {volist name="shopList" id="vo"}
                    <option value="{$vo.shop_code}">{$vo.shop_name}</option>
                    {/volist}
                </select>
            </div>

            <label style="width:70px;" class="layui-form-label mkz_t1" style="width:50px;">订单日期：</label>
            <div class="layui-input-inline">
                <input class="layui-input" id="start_time" placeholder="" readonly="readonly" type="text" value="">
            </div>

            <div class="layui-input-inline">
                <input class="layui-input" id="end_time" placeholder="" readonly="readonly" type="text" value="">
            </div>
            <!-- <div class="layui-input-inline">
                <input type="text" class="layui-input" id="timeArea" name="timeArea" readonly="readonly" value="">
            </div>	 -->
            <button class="layui-btn layui-btn-primary cus-model-btn" id="search" data-type="reload" >
                查询
            </button>

            <button class="layui-btn layui-btn-primary cus-model-btn" id="export" >
                <i class="iconfont"></i> 导出
            </button>

        </div>


        <div class="cus-table">

            <table id="demo" lay-filter="test" lay-data="{id: 'idTest'}"></table>

            <div id="pager"></div>
        </div>

        <!--<table class="layui-table" lay-data="{height:680,page:true,limit:20,url:'/kf/statistics/invalid.html', id:'idTest'}" lay-filter="demo">-->
            <!--<thead>-->
            <!--<tr>-->
                <!--<th lay-data="{width:100,field:'order_time',sort: true,align:'center',templet: '#titleTpl'}">日期</th>-->
                <!--<th lay-data="{width:200,field:'orderId',align:'center'}">编号</th>-->
                <!--<th lay-data="{width:200,field:'mname',align:'center'}">男姓名</th>-->
                <!--<th lay-data="{width:200,field:'mphone',align:'center'}">男电话</th>-->
                <!--<th lay-data="{width:200,field:'wname',align:'center'}">女姓名</th>-->
                <!--<th lay-data="{width:200,field:'wphone',align:'center'}">女电话</th>-->
                <!--<th lay-data="{width:200,field:'invalid_reason',align:'center'}">无效原因</th>-->

            <!--</tr>-->
            <!--</thead>-->
        <!--</table>-->
    </div>
</div>
<script type="text/html" id="titleTpl">
    {{d.LAY_TABLE_INDEX+1}}
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-mini" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del">删除</a>
</script>
<script src="__PUBLIC__/js/jquery-1.9.0.min.js?v={$Think.const.APP_VERSION}" type="text/jscript"></script>
<script>
    $(function () {
        var date = new Date(); //当前日期
        var nowY = date.getFullYear();
        var nowM = date.getMonth() + 1;
        var nowD = date.getDate();
        if (nowM < 10) {
            nowM = "0" + nowM;
        }
        if (nowD < 10) {
            nowD = "0" + nowD;
        }
        var startDay =  (nowY + "-" + nowM + "-01");
        var today =  (nowY + "-" + nowM + "-" + nowD);


        var call=1;
        var brand_id='';
        var shop_code='';
        var start_time=startDay;
        var end_time=today;


        //日历
        layui.use('laydate', function () {

            var laydate = layui.laydate;
            //单控件
            lay('.test-item').each(function () {
                laydate.render({
                    elem: this
                    , format: 'yyyy-MM-dd'
                    , value: ''
                    , trigger: 'click'
                });
            });

            // 开始时间
            laydate.render({
                elem: '#start_time'
                , format: 'yyyy-MM-dd'
                , value: startDay
                , trigger: 'click'
            });
            // 结束时间
            laydate.render({
                elem: '#end_time'
                , format: 'yyyy-MM-dd'
                , value: today
                , trigger: 'click'
            });

            lay('.hour-item').each(function () {
                laydate.render({
                    elem: this
                    , type: 'time'
                    , done: function (value, date, endDate) {
                        console.log(value, date, endDate);
                    }
                    , change: function (value, date, endDate) {
                        //this.elem.val(value)
                    }
                });
            });

        });

        layui.use(['layer', 'table','form'], function () {
            var table = layui.table, layer = layui.layer, form = layui.form;
            var tableIns=table.render({
                elem: '#demo'
                , url: '/kf/statistics/invalid' //数据接口
                ,id: 'testReload'
                ,where: {brand_id:brand_id,shop_code:shop_code,start_time:start_time, end_time: end_time}
                , page: true //开启分页
                , cols: [[ //表头

                    {field:'id', title: 'ID', sort: true,templet: '#sexTpl'}
                    ,{field:'order_time', title: '日期', align: 'center',width:'150'}
                    ,{field:'orderId', title: '编号', align: 'center',width:'130'}
                    ,{field:'mname', title: '男姓名', align: 'center',width:'80'} //width 支持：数字、百分比和不填写。你还可以通过 minWidth 参数局部定义当前单元格的最小宽度，layui 2.2.1 新增
                    ,{field:'mphone', title: '男电话', align: 'center',width:'110'}
                    ,{field:'wname', title: '女姓名', align: 'center',width:'80'}
                    ,{field:'wphone', title: '女电话', align: 'center',width:'110'}
                    ,{field:'invalid_reason', title: '无效原因', align: 'center',width:'1000'}

                ]],
                done: function(res, curr, count){
                    $(".mark-red").parents("tr").css({
                        "color":"#fff",
                        "background":"red"
                    });
                }
            });


            // 事业部  联动  部门
            form.on('select(brandclass)', function(data){
                var brandclass = data.value;
                //console.log(brandclass);
                $.ajax({
                    type:"GET",
                    url:'/kf/Visit/get_shop',
                    data:{brand_id:brandclass},
                    success: function (msg) {
                        console.log(msg);
                        var data=msg.data;
                        var replace = '<select name="shop_code" id="shop_code" lay-filter="shop_code" class="cus-input" ><option value="0">全部</option>';
                        for(var i=0;i<data.length;i++){
                            replace += '<option value="'+data[i]['shop_code']+'">'+data[i]['shop_name']+'</option>';
                        }
                        replace +='</select>';
                        $("#shop_code").html(replace);
                        form.render();
                    }
                });
            });



            $('.cus-model-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
                $(this).addClass("active").siblings(".cus-model-btn").removeClass("active");
                if (type == "allot") {
                    $("#allot-box").parent().css("overflow", "inherit");
                }
            });

            //搜索
            $('#search').on('click', function(){
                brand_id=$('#brand_id').val();
                if($('#shop_code').val()!=null&&$('#shop_code').val()!='null'){
                    shop_code=$('#shop_code').val();
                }
                start_time=$('#start_time').val();
                end_time=$('#end_time').val();
                active['reload'] ? active['reload'].call(this) : '';
            });

            //回车键触发搜索
            $(document).keyup(function(event){
                if(event.keyCode ==13){
                    $("#search").trigger("click");
                }
            });

            var id=0;
            //触发事件
            var active = {

                //刷新列表
                reload: function(data){
                    call=call+1;
                    //执行重载
                    table.reload('testReload', {
                        page: {
                            curr: 1 //重新从第 1 页开始
                        }
                        ,where: {
                            brand_id: brand_id,
                            shop_code:shop_code,
                            start_time:start_time,
                            end_time:end_time
                        }
                    });

                }

            };

            // 导出按钮
            $("#export").click(function(){
                location.href = "exportInvalid?brand_id="+brand_id+"&shop_code="+shop_code+"&start_time="+start_time+"&end_time="+end_time;
            })

        });
    });

</script>
{/block}