@extends('admin.layouts.app')

@section('content')
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>通话列表</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link"> <i class="fa fa-chevron-up"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="form-group">
                        <div class="row">
                            <div class="col-sm-4">
                                <form method="GET" action="" accept-charset="UTF-8" id="filter_list">
                                    <div class="input-group">
                                        <input type="text" class="form-control" value="{{Request::get('keyword')}}"
                                               placeholder="请输入关键词"
                                               name="keyword">
                                        <span class="input-group-append">
                                                <button type="submit" class="btn btn-primary"
                                                        style="height: 100%">搜索</button>
                                            </span>
                                    </div>
                                </form>
                            </div>


                            <div class="col-sm-8 pull-right">
                                @if(role('Call/List/create'))
                                    <a href="{{ U('Call/List/create')}}" class="btn btn-primary pull-right">添加</a>
                                @endif

                                @if(role('Call/List/alldelete'))
                                    <button class="btn btn-danger pull-right" id="alldelete" style="display: none">批量删除</button>
                                @endif
                            </div>


                        </div>
                    </div>
                    <div id="call-list">
                        @include('admin.call.list.data')
                    </div>

                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script type="text/javascript">
        var checkedIds = []

        /*电话全选功能*/
        $('body').on('click', '#checkAll', function () {
            items = $('.calllist');

            isChecked = $(this).prop('checked')
            items.prop('checked', isChecked)
            items.each(function () {
                saveChecked($(this))
            });
            if (checkedIds.length) {
                $('#alldelete').show()
            } else {
                $('#alldelete').hide()
            }

        })

        $('body').on('click', '#checkTotal', function () {
            items = $('.calllist');

            isChecked = $(this).prop('checked')
            items.prop('checked', isChecked)

            if (isChecked == true) {
                $('#alldelete').show()
                checkedIds = [{{ $allIds }}][0]
                $('#checkAll').prop('checked', true)
            } else {
                $('#alldelete').hide()
                $('#checkAll').prop('checked', false)
                checkedIds = []
            }
        })

        $('body').on('click', '.calllist', function () {
            items = $('.calllist');

            checkedLength = $('.calllist:checked').length
            if (checkedLength) {
                $('#alldelete').show()
            } else {
                $('#alldelete').hide()
            }
            if (items.length == checkedLength) {
                $('#checkAll').prop('checked', true)
                $('#alldelete').show()
            } else {
                $('#checkAll').prop('checked', false)
            }

            saveChecked($(this))
        });


        /*批量删除*/
        $('#alldelete').click(function () {
            layer.confirm('你确定要删除选择的待导入电话吗？', {
                btn: ['确定', '取消']//按钮
            }, function (index) {

                layer.close(index);
                list_ids = checkedIds;
                csrf_token = "{{ csrf_token() }}";

                $.ajax({
                    type: 'post',
                    url: '{{ U('Call/List/alldelete') }}',
                    data: {list_ids: list_ids, _token: csrf_token},
                    success: function (data) {
                        if (data == 200) {
                            layer.msg('删除成功', {
                                icon: 1,
                                time: 2000 //2秒关闭（如果不配置，默认是3秒）
                            }, function () {
                                window.location.href = window.location.href
                            });

                        }
                    }

                })
            });


        });

        /*保存选中的项*/
        function saveChecked(e) {
            if (e.is(":checked") && checkedIds.indexOf(e.data("id"), 0) == -1) {
                checkedIds.push(e.data("id"));
            } else {
                for (var i = 0; i < checkedIds.length; i++) {
                    if (e.data("id") == checkedIds[i]) {
                        checkedIds.splice(i, 1);
                        break;
                    }
                }
            }

        }

        /*翻页后设置选中项*/
        function setChecked() {
            var $boxes = $('.calllist');
            $boxes.each(function () {
                id = $(this).data('id')
                if (checkedIds.indexOf(id, 0) != -1) {
                    $(this).prop('checked', true)
                } else {
                    $(this).prop('checked', false)
                }
            })

            checkedLength = $('.calllist:checked').length
            if (checkedLength == $boxes.length) {
                $('#checkAll').prop('checked', true)
            }

        }


        /*通话纪录筛选*/
        function filter_records() {
            data = $('#filter_list').serialize();
            $.ajax({
                type: 'get',
                data: data,
            }).done(function (data) {
                $('#call-list').html(data.html)
            })
        }

        /*Ajax分页*/
        $('body').on('click', '.pagination a', function (e) {
            e.preventDefault();
            if ($(this).attr('href') != '#') {
                data = $('#filter_list').serialize()
                $.ajax({
                    url: $(this).attr('href'),
                    type: 'get',
                    data: data,
                }).done(function (data) {
                    $('#call-list').html(data.html)
                    setChecked()
                })
            }

        });


    </script>
@endsection