@extends('template.default')
@section('text-field')
@stop
@section('content')

    <div hidden id="msgVazio" style="padding-top: 20%;">
        <h5 class="font-weight-600 grey-text center-align">@lang('Não existem ')@lang(' Logs')@lang(' Registrados')</h5>
    </div>

    <div hidden id="conteudoPricincipal">

        <br>

        <div class="row">
            <div class="card-panel col s12 offset-m1 m10 offset-l1 l10 z-depth-2">

                <table class="highlight">
                    <thead>
                    <tr>
                        <th></th>
                        <th>Local</th>
                        <th>Ação</th>
                        <th>User</th>
                        <th>Data</th>
                    </tr>
                    </thead>
                    <tbody>

                    @php($key = 0)
                    @foreach($logs->data as $key => $log)

                        <tr>
                            <td>
                                <i style="cursor: pointer" class="material-icons"
                                   onclick="getComponenteLog({{ \GuzzleHttp\json_encode($log) }})">visibility</i>
                            </td>
                            <td>{{ $log->log_name }}</td>
                            <td>{{ $log->description }}</td>
                            <td>{{ (isset($log->causer->name) ? $log->causer->name : '' ) }}</td>
                            <td>{{ \Carbon\Carbon::parse($log->created_at)->format('d/m/Y H:i:s') }}</td>

                        </tr>

                    @endforeach

                    </tbody>
                </table>

            </div>
        </div>

        @if($logs->last_page > 1)

            <div class="row">
                <div class="col offset-s1 s8">

                    <ul class="pagination">
                        <li class="disabled"><a href="/log?page=1"><i
                                        class="mdi-navigation-chevron-left material-icons">chevron_left</i></a>
                        </li>

                        @for($i = 1; $i <= $logs->last_page; $i++)

                            @if($i < ($logs->current_page - 5) )
                                @continue
                            @endif

                            @if($i > ($logs->current_page + 5) )
                                @continue
                            @endif

                            <li class="waves-effect
                     @if($logs->current_page == $i)
                                    active
@endif
                                    "><a href="/log?page={{ $i }}">{{ $i }}</a></li>
                        @endfor

                        <li class="waves-effect"><a href="/log?page={{ $logs->last_page }}"><i
                                        class="mdi-navigation-chevron-right material-icons">chevron_right</i></a>

                        </li>
                    </ul>

                </div>
            </div>

        @endif

    </div>

    <div id="modalLog" class="modal bottom-sheet" style="max-height: 90%;">
        <div class="modal-content">
            <h5 class="font-weight-800 grey-text">Log</h5>
            <i class="material-icons grey-text modal-close modal-full-move-bottom-custom1">close</i>

            <div class="row">
                <div class="col s12" id="conteudoLog">


                </div>
            </div>
        </div>
    </div>

    <div id="modalFiltro" class="modal bottom-sheet" style="max-height: 90%; min-height: 60%;">
        <div class="modal-content">
            <h5 class="font-weight-800 grey-text">Filtros</h5>
            <i class="material-icons grey-text modal-close modal-full-move-bottom-custom1">close</i>

            <form id="formFiltro" method="GET">

                <div class="row">
                    <div class="input-field col s12">
                        <input id="busca_texto" name="busca_texto" type="text" class="validate"
                               value="{{ (isset($_GET['busca_texto']) ? $_GET['busca_texto'] : '') }}">
                        <label for="busca_texto">Palavra chave</label>
                    </div>
                </div>

                <br>

                <label class="font-weight-600">Data</label>

                <div class="row">
                    <div class="input-field col s2">
                        <input id="filtro-data-inicio"
                               name="filtro-data-inicio" type="text" class="datepicker"
                               value="{{ (isset($_GET['filtro-data-inicio']) ? $_GET['filtro-data-inicio'] : '') }}">
                        <label for="filtro-data-inicio">@lang('Início')</label>
                    </div>
                    <div class="input-field col s2">
                        <input id="filtro-data-fim"
                               name="filtro-data-fim" type="text" class="datepicker"
                               value="{{ (isset($_GET['filtro-data-fim']) ? $_GET['filtro-data-fim'] : '') }}"
                        >
                        <label for="filtro-data-fim">@lang('Fim')</label>
                    </div>
                </div>

            </form>

        </div>
        <div class="modal-footer">
            <a class="modal-action modal-close waves-effect waves-green btn-flat">@lang('Cancelar')</a>
            <a onclick="enviarFiltro()"
               class="modal-action waves-effect waves-yellow btn-flat">Filtrar</a>
        </div>

    </div>

    <div class="fixed-action-btn" style="bottom: 40px; right: 20px;">
        <a onclick="abrirModalFiltro()" id="abrir-reclamacao"
           class="btn-floating z-depth-3 btn-large waves-effect waves-light scale-transition">
            <i class="material-icons">filter_list</i>
        </a>
    </div>

@endsection
@section('specific-scripts')

    <script type="text/javascript"            src="{{ \Tooleks\LaravelAssetVersion\Facades\Asset::get('/js/script-custom/crud-basic.js') }}"></script>
    <script>

        inicio({{ count($logs->data) }})
        $('.titulo_pagina').text('@lang('Log')');


        function linhaEscolhida(data) {

            countCheckMarcados = $('input:checkbox:checked').length;

            if (countCheckMarcados === 0) {
                $('#divEditar').attr('hidden', 'hidden');
                $('#divExcluir').attr('hidden', 'hidden');
            }
            if (countCheckMarcados === 1) {
                $('#divEditar').removeAttr('hidden', 'hidden');
                $('#divExcluir').attr('hidden', 'hidden');

                $('#btnEditar').attr('onclick', 'getComponenteLog(' + JSON.stringify(data) + ')');

            }
            if (countCheckMarcados > 1) {
                $('#divExcluir').removeAttr('hidden', 'hidden');
                $('#divEditar').attr('hidden', 'hidden');
            }

        }

        function getComponenteLog(data) {

            $.ajax({
                type: 'GET',
                dataType: 'html',
                url: '/log/componente/log',
                data: {data: data},
                beforeSend: function () {

                    $('#modalLog').modal('open');
                    $('#conteudoLog').empty();

                },
                success: function (data) {

                    $('#conteudoLog').append(data);

                },
                error: function (xhr) {


                }
            });

        }

        function abrirModalFiltro() {

            $('#modalFiltro').modal('open');

        }

        function enviarFiltro() {

            $('#formFiltro').submit();

        }

        var diaSemana = ['Domingo', 'Segunda-Feira', 'Terca-Feira', 'Quarta-Feira', 'Quinta-Feira', 'Sexta-Feira', 'Sabado'];
        var mesAno = ['Janeiro', 'Fevereiro', 'Marco', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'];
        var data = new Date();
        var hoje = diaSemana[data.getDay()] + ', ' + mesAno[data.getMonth()] + ' de ' + data.getFullYear();
        $("#dataPesquisa").attr("value", hoje);
        $(".datepicker").pickadate({
            monthsFull: mesAno,
            monthsShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
            weekdaysFull: diaSemana,
            weekdaysShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
            weekdaysLetter: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S'],
            selectMonths: true,
            selectYears: true,
            clear: false,
            format: 'dd/mm/yyyy',
            today: "Hoje",
            close: "Fechar",
            min: new Date(data.getFullYear() - 1, 0, 1),
            max: new Date(data.getFullYear() + 1, 11, 31),
            closeOnSelect: true
        });
        $('.picker__frame').css('top', '42%');

    </script>

@stop