{include file="common/head"/}

<div class="admin-main layui-anim layui-anim-upbit">
    <fieldset class="layui-elem-field layui-field-title">
        <legend>{:$title}</legend>
    </fieldset>
    
    <div class="demoTable">
        <form class="layui-form layui-form-pane">
        <div class="layui-form">
            搜索商家：<div class="layui-inline">
            <input class="layui-input" name="key" id="key"  placeholder="{:lang('pleaseEnter')}店铺名称" autocomplete="off">
            </div>
            模式：
            <div class="layui-input-inline layui-form">
                    <div class="layui-input-4" style="width:80px">
                        <select name="patt" id="patt" lay-filter="patt">
                                <option value="1">商户</option>
                                <option value="2">顾客</option>
                        </select>
                    </div>
            </div>
            <div id = 'role_'>
            角色选择： <div class="layui-inline">
                  <input type="checkbox" name="role[1]" value='管理员' title="管理员">
                  <input type="checkbox" name="role[2]" value="店长" title="店长">
                  <input type="checkbox" name="role[3]" value="收银员" title="收银员">
                  <input type="checkbox" name="role[4]" value="服务员" title="服务员">
                  <input type="checkbox" name="role[5]" value="客户经理" title="客户经理">
            </div>
            </div>
            商家来源：<div class="layui-input-inline layui-form">
                    <div class="layui-input-4" style="width:80px">
                        <select name="class" id="channel" lay-filter="myselect">
                                <option value="1">合作</option>
                                <option value="2">推广</option>
                                <option value="3">测试</option>
                        </select>
                    </div>
            </div>
            用户群体：
            <div class="layui-input-inline layui-form">
                    <div class="layui-input-8">
                        <select name="class" id="user_groups" lay-filter="myselect">
                                <option value="1">全部用户</option>
                                <option value="2" selected = "selected">可发送</option>
                                <option value="3">不可发送</option>
                        </select>
                    </div>
            </div>
            <button type="button" class="layui-btn"  id="search" data-type="reload">搜索</button>
        </div>
        </form>
        
    </div>
    
    <table class="layui-table" id="list" lay-filter="list"></table>
</div>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="getCheckData">推送消息</button>
  </div>
</script>
{include file="common/foot"/}
<script>
    layui.use(['table','form'], function() {
        var table = layui.table,$ = layui.jquery,form = layui.form;
        var tableIn = table.render({
            elem: '#list',
            url: '{:url("messagelist")}',
            toolbar: '#toolbarDemo',
            method: 'post',
            page:true,
            cols: [[
                {checkbox:true,fixed: true},
                {field: 'formid', title: 'FORMID'},
                {field: 'seat_openid', title: 'OPENID'},
                {field: 'expire_in', title: '失效时间'},
                {field: 'count', align: 'center',title: '可发送总数', sort: true},
                {field: 'sellerinfo', align: 'center',title: 'ID-商家名称'},
                {field: 'role_name', align: 'center',title: '角色'},
                {field: 'nick_name', align: 'center', title: '昵称'},
                {field: 'wx/app', align: 'center', width:300, title: '最后预定时间(小程序/电话机)'}
            ]]
            ,id: 'testReload'
            ,page: true
            ,limit:10
        });

        //单选按钮显示隐藏
        form.on('select(patt)', function(data){
            if(data.value == 1)
                $("#role_").show();
            else
                $("#role_").hide();
        });

        //头工具栏事件
        table.on('toolbar(list)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
              case 'getCheckData':
                var arr = [];
                var lists = [];
                var data = checkStatus.data;
                //data = JSON.stringify(data);
                console.log(data);
                console.log(data.length);
                //判断是否选中发送目标
                if(data.length==0){
                    layer.msg('请选择发送目标！');return;
                }
                //数据填充
                for(var i=0;i<data.length;i++){
                    arr.push(data[i].count);
                    lists.push(data[i].seat_openid);
                }
                //判断用户是否可发送
                if(arr.indexOf('0')!=-1){
                    layer.msg('该用户可发送记条数为0');return;
                }
                //请求后台
                layer.confirm('确定要推送消息吗?', {
                  btn: ['确定','取消'] //按钮
                }, function(index){
                    $.post("{:url('sendmessagelist')}",{openid:lists},function(res){
                        if(res.code==1){
                            layer.msg(res.msg,{time:1000,icon:1});
                        }else{
                            layer.msg(res.msg,{time:1000,icon:2});
                        }
                    });
                    layer.close(index);
                }, function(){
                  layer.msg('操作已取消', {});
                });
              break;
            };
        });


        //搜索
        $('#search').on('click', function() {
            var key = $('#key').val();
            /*if($.trim(key)==='') {
                layer.msg('{:lang("pleaseEnter")}店铺名称！',{icon:0});
                return;
            }*/
            var arr = new Array();
            $.each($('input:checkbox:checked'),function(i){
                arr[i] = $(this).val();
            });
            role = arr.join(",");//将数组合并成字符串
            var user_groups = $('#user_groups').val();
            tableIn.reload({ page: {page: 1},where: {patt: $('#patt').val(),key: key,channel: $('#channel').val(),user_groups: user_groups,role: role}});
        });

        var $ = layui.$, active = {
            reload: function(){
                var key = $('#key');
                var channel = $('#channel');
                var patt = $('#patt');
                var user_groups = $('#user_groups');
                var arr = new Array();
                $.each($('input:checkbox:checked'),function(i){
                    arr[i] = $(this).val();
                });
                role = arr.join(",");//将数组合并成字符串
                //执行重载
                table.reload('testReload', {
                page: {
                  curr: 1 //重新从第 1 页开始
                }
                ,where: {
                  key: {
                    id: key.val(),
                    channel: channel.val(),
                    patt: patt.val(),
                    role:role,
                    user_groups: user_groups.val(),
                  }
                }
                });
            }
        };
  
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    })
</script>