@extends('layouts.app')

@section('content')

<div class="row d-flex justify-content-center">
    <div class="col-sm-12 col-md-6 col-lg-6 d-flex align-items-center float-left justify-content-center justify-content-sm-center justify-content-md-start justify-content-lg-start"><h1 class="float-left">Riport készítés</h1></div>
    <div class="col-sm-12 col-md-6 col-lg-6 d-flex align-items-center float-right justify-content-center justify-content-md-end justify-content-lg-end"></div>
</div>

<hr class="my-4" />

<div style="min-height: 500px;">

    @include('riport.components.filter')

    <div id="contracts">
        <div id="loadingSpinnerAjax" class="d-flex justify-content-center align-items-center w-100">
            <div class="spinner-border text-primary d-flex justify-content-center" role="status">
                <span class="sr-only">Loading...</span>
            </div>
        </div>
    </div>

    <div id="summary">
        <div id="loadingSpinnerAjax" class="d-flex justify-content-center align-items-center w-100">
            <div class="spinner-border text-primary d-flex justify-content-center" role="status">
                <span class="sr-only">Loading...</span>
            </div>
        </div>
    </div>

</div>

<button id="download_riport" class="btn btn-primary float-right">riport letöltése</button>
{{--
<button class="btn btn-primary float-right" onclick="window.location='{{route('riport.download', app()->getLocale())}}'">riport letöltése</button>
--}}

@endsection

@push('scripts')
    <script>
    $( document ).ready(function() {

        //Contract search
        window.riportSearchContract = function(search = '', page = 1, filter = 'all', filter_sales = '', date_from = '', date_to = '') {
            $( '#contracts' ).html( loading_site_spinner() );

            $.ajax({
                type: 'POST',
                url: '{{ route('riport.get_contracts', app()->getLocale()) }}',
                data: {
                    'search' : search,
                    'page'   : page,
                    'filter' : filter,
                    'filter_sales' : filter_sales,
                    'date_from' : date_from,
                    'date_to' : date_to,
                }
            }).done( function(data) {
                $( '#contracts' ).html( data );
            }).fail( function(error){
                console.log( 'error', error );
            });
        };

        window.get_riport_contract = function(item = null) { 
            var page         = item ? item.data('page') : 1;
            var filter       = $('[name="filterRadio"]:checked').val();
            var filter_sales = $('#filter_sales').val();
            var date_from    = $('#date_from').val();
            var date_to      = $('#date_to').val();

            return riportSearchContract('', page, filter, filter_sales, date_from, date_to);
        }

        window.riport_summary = function() {
            var filter       = $('[name="filterRadio"]:checked').val();
            var filter_sales = $('#filter_sales').val();
            var date_from    = $('#date_from').val();
            var date_to      = $('#date_to').val();
            
            $( '#summary' ).html( loading_site_spinner() );

            $.ajax({
                type: 'POST',
                url: '{{ route('riport.summary', app()->getLocale()) }}',
                data: {
                    'filter' : filter,
                    'filter_sales' : filter_sales,
                    'date_from' : date_from,
                    'date_to' : date_to,
                }
            }).done( function(data) {
                $( '#summary' ).html( data );
            }).fail( function(error){
                console.log( 'error', error );
            });
        }

        $('#download_riport').on('click', function(){
            var filter       = $('[name="filterRadio"]:checked').val();
            var filter_sales = $('#filter_sales').val();
            var date_from    = $('#date_from').val();
            var date_to      = $('#date_to').val();

            $('.filter-sales-send').trigger('click');

            if(!date_from || !date_to)
            {
                alertErrorModal( 'Dátum intervallum megadása kötelező!' );
                return;
            }

            start_loader();
            
            $.post('{{ route('riport.download', app()->getLocale()) }}',
            {
                filter: filter,
                filter_sales: filter_sales,
                date_from: date_from,
                date_to: date_to,
            },
            function(data, status){
                stop_loader();
                if(data == 'success') {
                    var url = "{{ route('riport.xlsx', [app()->getLocale(), ':slug1', ':slug2', ':slug3']) }}";
                    url = url.replace(':slug1', date_from).replace(':slug2', date_to).replace(':slug3', filter_sales);
                    window.location = url;
                } else {
                    alertErrorModal( data );
                }
            });
        });

        function alertErrorModal( message ) {
            $('#alertErrorMsg').text( message );
            $('#alertError').modal('show');
        }
        
        window.get_riport_contract();

        window.riport_summary();

        $('.filter-sales-send').on('click', function(){
            get_riport_contract();

            window.riport_summary();
        });
        
        $('#contracts').on('click', '#next_page', function(){
            get_riport_contract($(this));
            $("html, body").animate({ scrollTop: 0 }, "slow");
        });

        $('#contracts').on('click', '#prev_page', function(){
            get_riport_contract($(this));
            $("html, body").animate({ scrollTop: 0 }, "slow");
        });

        $('[name="filterRadio"]').on('click', function(){
            get_riport_contract();

            window.riport_summary();
        });

    });
    </script>
@endpush

@section('title')
{{ __('meta.title.contracts') }}
@endsection

@section('description')
{{ __('meta.description.contracts') }}
@endsection