{extend name="Public/base"/}
{block name="css"}
<style>
    .layui-table-page {
        height: 26px;
        margin: -15px;
    }
    .layui-form-item .layui-input-inline {
        width: 170px !important;
    }
    .black .layui-btn-disabled{
        background:#FBFBFB;
    }
</style>
<link rel="stylesheet" href="__PUBLIC__/item/css/layui.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/set.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/statistics.css?v={$Think.const.APP_VERSION}">
{/block}
{block name="js"}
<script>
    $(function(){
        // $(".nul_bli").eq(5).find(".navb").addClass("active");
    })
</script>
{/block}
{block name="main"}
<div class="if_wrap">
    <div class="cus-con">
        <div class="set_tit">
            <span>{$title}</span>
            {auth code="menu1537322380"}
             <a class="layui-btn layui-btn-primary cus-model-btn" href="/crm/Logs/fplogs" target="_blank" style="width:auto;line-height: 30px">
                <i class="fa fa-child" style="font-size: 14px;margin-right: 5px"></i>分配日志
            </a>
            {/auth}
        </div>
        <div class="set-top layui-form layui-form-item">
            <!-- <label style="width:70px;" class="layui-form-label mkz_t1">查询店面</label> -->
            {auth code="menu1538119118"}
            <div class="layui-input-inline">
                <select lay-filter="search_shop_code" lay-search="">
                    <option value="">请选择店面</option>
                    {volist name="shopList" id="vo"}
                    <option value="{$vo.shop_code}"{if $my_dept.shop_code eq $vo.shop_code}selected{/if}>{$vo.shop_name}</option>
                    {/volist}
                </select>
            </div>
            {/auth}
            {auth code="menu1538119119"}
            <div class="layui-input-inline">
                <select lay-filter="search_department_id" lay-search="">
                    <option value="">请选择部门</option>
                    {volist name="departmentList" id="vo"}
                    <option value="{$vo.id}" {if $my_dept.department_id eq $vo.id}selected{/if}>{$vo.department_name}</option>
                    {/volist}
                </select>
            </div>
            {/auth}
            {auth code="menu1538119120"}
            <div class="layui-input-inline">
                <select lay-filter="search_group_id" lay-search="">
                    <option value="">请选择小组</option>
                    {volist name="groupList" id="vo"}
                    <option value="{$vo.id}" {if $my_dept.groupId eq $vo.id}selected{/if}>{$vo.group_name}</option>
                    {/volist}
                </select>
            </div>
            {/auth}
            <button class="layui-btn layui-btn-primary cus-model-btn" id="sub" >
                查询
            </button>
        </div>
        <div style="width:100%">
            <div style="width: 48%;float: left;">
                <table class="layui-table" lay-data="{height:0, url:'/crm/Logs/onlineStaffList',id:'idTest', skin: 'row', even: true}" lay-filter="demo">
                    <thead>
                    <tr>
                    	<th lay-data="{width:74,align:'center',field:'id',align:'center',templet: '#titleTpl'}">序号</th>
                        <th lay-data="{width:110,align:'center',field:'staff'}">邀约客服</th>
                        <th lay-data="{width:110,align:'center',field:'login_time'}">登录时间</th>
                        <th lay-data="{width:70,align:'center',field:'sysData'}">自动</th>
                        <th lay-data="{width:70,align:'center',field:'otherData'}">手动</th>
                        <th lay-data="{width:70,align:'center',field:'allNum'}">总量</th>
                        <th lay-data="{width:100,field:'operation',align:'center',toolbar: '#operation'}">功能</th>
                        <th lay-data="{width:110,align:'center',field:'status'}">状态</th>
                    </tr>
                    </thead>
                </table>
            </div>
            <div style="width: 48%;float: right;">
                <fieldset class="layui-elem-field layui-field-title">
                    <legend> {$today}  签到详情</legend>
                </fieldset>
                {if $fpStatus eq 1}
                <div class="layui-tab layui-tab-card" lay-filter="test1">
                    <ul class="layui-tab-title">
                        {volist name="rule" id="r"}
                            <li lay-id="{$r.id}" {if $r.order_sort eq '9999'} class="layui-this" {/if}>{$r.customer_condition}</li>
                        {/volist}
                    </ul>
                    <div class="layui-tab-content">
                        {volist name="rule" id="r"}
                            {if $r.order_sort eq '9999'}
                                <div class="layui-tab-item layui-show">
                                    <table class="layui-table">
                                        <thead>
                                            <tr>
                                                <th>排序</th><th>员工</th><th>接收状态</th><th>在线状态</th><th>登录时间</th>
                                            </tr> 
                                        </thead>
                                        <tbody id="{$r.id}">
                                            {volist name="r.staffs" id="s"}
                                                <tr>
                                                    <td>{$i}</td><td>{$s.staff_name}</td><td>{$s.jr_status}</td><td>{$s.status}</td><td>{$s.login_time}</td>
                                                </tr>
                                            {/volist}
                                        </tbody>
                                    </table>
                                </div>
                            {else}
                                <div class="layui-tab-item">
                                    <div>{$r.customer_value}</div>
                                    <table class="layui-table">
                                        <thead>
                                            <tr>
                                                <th>排序</th><th>员工</th><th>接收状态</th><th>在线状态</th><th>登录时间</th>
                                            </tr> 
                                        </thead>
                                        <tbody id="{$r.id}">
                                            {volist name="r.staffs" id="s"}
                                            <tr>
                                                <td>{$i}</td><td>{$s.staff_name}</td><td>{$s.jr_status}</td><td>{$s.status}</td><td>{$s.login_time}</td>
                                            </tr>
                                            {/volist}
                                        </tbody>
                                    </table>
                                </div>
                            {/if}
                        {/volist}
                    </div>
                </div>
                {else}
                <div class="layui-tab layui-tab-card" lay-filter="test1">
                    <ul class="layui-tab-title">
                        <li>自动分配没有开启</li>
                    </ul>
                </div>
                {/if}
            </div>
        </div>
	</div>
</div>
<script src="__PUBLIC__/js/jquery-1.9.0.min.js?v={$Think.const.APP_VERSION}" type="text/jscript"></script>
<script type="text/html" id="operation">
    {{#  if(d.operation == 200){ }}
    <span class="layui-btn layui-btn-mini layui-btn-danger" lay-event="edit">签出</span>
    {{#  } else { }}
    <span class="layui-btn layui-btn-mini"  lay-event="signin">签入</span>
    {{#  } }}
</script>
<script type="text/javascript">
// 数据表格
layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element','form'], function(){
	var laydate  = layui.laydate, //日期
	    layer    = layui.layer, //弹层
	    table    = layui.table, //表格
	    element  = layui.element; //元素操作
    var form = layui.form;
    table.on('tool(demo)', function (obj) {
        var data = obj.data, //获得当前行数据
        layEvent = obj.event; //获得 lay-event 对应的值
        if(obj.event === 'edit'){
            var id = obj.data.id;
            layer.confirm('确定签出该网销吗？', function (index) {
                var id = obj.data.id;
                $.ajax({
                    type: "POST",
                    url: "{:Url('crm/Logs/staffQc')}",
                    data: {id:id,status:3},
                    dataType:'json',
                    success: function(ret){
                        layer.alert(ret.msg);
                        table.reload('idTest', {});
                    },
                    error:function(XMLHttpRequest, textStatus, errorThrown){
                        var ret = XMLHttpRequest.responseJSON
                        layer.alert('操作失败');
                    }
                })
            });
        }else if(obj.event === 'signin'){
            var id = obj.data.id;
            layer.confirm('确定签入该网销吗？', function (index) {
                var id = obj.data.id;
                $.ajax({
                    type: "POST",
                    url: "{:Url('crm/Logs/staffQc')}",
                    data: {id:id,status:1},
                    dataType:'json',
                    success: function(ret){
                        layer.alert(ret.msg);
                        table.reload('idTest', {});
                    },
                    error:function(XMLHttpRequest, textStatus, errorThrown){
                        var ret = XMLHttpRequest.responseJSON
                        layer.alert('操作失败');
                    }
                })
            });
        }
    })

    form.on('select(search_shop_code)',function(d){
        let shop_code = d.value;
        if(!shop_code) return;
        let _this = this;
        $.ajax({
            type: "POST",
            url: '/crm/customer/getDepartment',
            data: {shop_code:shop_code},
            success: function (res) {
                var replace = '<option value="">请选择部门</option>';
                for (var i = 0; i < res.length; i++) {
                    replace += '<option value="'+res[i].id+'">'+res[i].department_name+'</option>';
                }
                // $("#department_id").html(replace);
                // console.log($(_this).parents().find('.set-top').find('select[lay-filter="search_department_id"]'));
                $(_this).parents().find('.set-top').find('select[lay-filter="search_department_id"]').eq(0).html(replace);
                form.render();
            }
        })
    })
    form.on('select(search_department_id)',function(d){
        let id = d.value;
        if(!id) return;
        let _this = this;
        $.ajax({
            type: "POST",
            url: '/crm/customer/getGroup',
            data: {department_id:id},
            success: function (res) {
                var replace = '<option value="">请选择小组</option>';
                for (var i = 0; i < res.length; i++) {
                    replace += '<option value="'+res[i].id+'">'+res[i].group_name+'</option>';
                }
                // $("#department_id").html(replace);
                // console.log($(_this).parents().find('.set-top').find('select[lay-filter="search_department_id"]'));
                $(_this).parents().find('.set-top').find('select[lay-filter="search_group_id"]').eq(0).html(replace);
                form.render();
            }
        })
    })

    // 查询按钮
    $("#sub").click(function(){
        // 生成表格
        var shop_code   = $('select[lay-filter="search_shop_code"]').val();
        var department_id   = $('select[lay-filter="search_department_id"]').val();
        var group_id   = $('select[lay-filter="search_group_id"]').val();
        var index = layer.load(1, {shade: false}); //0代表加载的风格，支持0-2
        // 重新载入表格
        table.reload('idTest', {
            url: 'onlineStaffList',
            where: {shop_code:shop_code,department_id:department_id,group_id:group_id},
            done: function(res, curr, count){
                layer.close(index);
            }
        });
    });
})
/*
$(".layui-tab-title").on("click","li",function(){
    var layid=$(this).attr("lay-id");
    $.ajax({
        type: "POST",
        url: '/crm/Logs/ruleData',
        data: {rid:layid},
        success: function (msg) {
            var replace = '';
            for (var i = 0; i < msg.length; i++) {
                replace += '<tr>';
                replace += '<td>'+(i+1)+'</td><td>'+msg[i]['staff_name']+'</td><td>'+msg[i]['jr_status']+'</td><td>'+msg[i]['status']+'</td><td>'+msg[i]['login_time']+'</td>';
                replace += '</tr>';
            }
            console.log(replace);
            $("#"+layid).html(replace);
        }
    })
})
*/

</script>
{/block}