@include('plugins.moment')
@include('plugins.bootstrap-select')
@include('plugins.daterangepicker')

@push('page-js')
    <script>
        let currentDate;

        const filters = data => {
            data._token = `{{ csrf_token() }}`;
            if (currentDate) {
                data.dtInicio = currentDate.start.format('YYYY-MM-DD');
                data.dtFim = currentDate.end.format('YYYY-MM-DD');
            }

            data.callcenters = [];
            $.each($("input[name='callcenter[]']:checked"), function () {
                data.callcenters.push($(this).val());
            });

            return data;
        };

        function reloadPage() {
            let $updateAll = $('#update-all');

            $.ajax({
                type: 'POST',
                url: '{{ route('executive.variation.index') }}',
                data: filters({}),
                beforeSend: () => {
                    loading();
                    $updateAll.attr('data-original-title', 'Atualizando...')
                        .find('i').addClass('fa-spin');
                },
                complete() {
                    hideLoading();
                },
                success(response) {
                    $('table tbody').empty();
                    for(const [key, value] of Object.entries(response.data)) {
                        $(`#table-${key} tbody`).html(value);
                    }

                    $updateAll.attr('data-original-title', moment().format('[Atualizado às] HH:mm'))
                        .find('i').removeClass('fa-spin text-danger');

                    refreshLabelLastUpdate(`<span class="float-left">Último Intervalo:</span> ${response.lastInterval}`);
                },
                error(response) {
                    if (response.statusText != 'abort') {
                        $.Notification.notify('error', 'top center', 'Atenção', "Falha ao atualizar os itens!");
                    }
                    $updateAll.attr('data-original-title', 'Atualização falhou!')
                        .find('i').addClass('text-danger').removeClass('fa-spin');
                }
            });
        }

        $(document).ready(function () {
            $('#update-all, #apply_callcenter_filter').on('click', function () {
                reloadPage();
                $(".shared-filter").slideUp('fast');
            });
            reloadPage();
            $('#reportrange span').html(' ' + moment().format('DD/MM/YYYY') + ' - ' + moment().format('DD/MM/YYYY'));

            $('#reportrange').daterangepicker({
                alwaysShowCalendars: true,
                maxDate: moment(),
                minDate: '01/01/2017',
                showDropdowns: true,
                showWeekNumbers: false,
                ranges: {
                    'Hoje': [moment(), moment()],
                    'Ontem': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Últimos 7 dias': [moment().subtract(6, 'days'), moment()],
                    'Últimos 30 dias': [moment().subtract(29, 'days'), moment()],
                    'Este mês': [moment().startOf('month'), moment().endOf('month')],
                    'Último mês': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                },
                opens: 'left',
                drops: 'down',
                buttonClasses: ['btn', 'btn-sm'],
                applyClass: 'btn-bmg-primary',
                cancelClass: 'btn-secondary',
                locale: daterangepicker.locales['pt-br'],
            }, function (start, end, label) {
                currentDate = {start, end};
                $('#reportrange span').html(' ' + start.format('DD/MM/YYYY') + ' - ' + end.format('DD/MM/YYYY'));
                reloadPage();
                $(".shared-filter").slideUp('fast');
            });
        });
    </script>
@endpush