@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">Não existe Transações registradas</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>Data</th>
                        <th>Descrição</th>
                        <th>Secretaria</th>
                        <th>Tipo</th>
                        <th>Valor</th>
                        <th>Operação</th>
                    </tr>
                    </thead>
                    <tbody>

                    <form id="formDeletar" method="POST">
                        {{ csrf_field() }}

                        @php($key = 0)
                        @foreach($transactions->data as $key => $transaction)

                            <tr>
                                <td>
                                    <input onclick="linhaEscolhida({{json_encode($transaction)}})"
                                           name="deletar[]" value="{{$transaction->id}}"
                                           type="checkbox" class="filled-in item"
                                           id="check-tabela-{{ $key }}"/>
                                    <label for="check-tabela-{{ $key }}"></label>
                                </td>

                                <td>{{ \Carbon\Carbon::parse($transaction->created_at)->format('d/m/Y H:i:s') }}</td>
                                <td>{{ $transaction->description }}</td>
                                <td>{{ $transaction->categorias_balance->categoria->nome }}</td>
                                <td>{{ $transaction->categorias_balance->balance->types_balance->name }}</td>
                                <td>{{ $transaction->values }}</td>

                                <th class="center">
                                    <i class="material-icons">{{ transaction_operation_icon($transaction->type_transaction_id) }}</i>
                                </th>

                            </tr>

                        @endforeach

                    </form>

                    </tbody>
                </table>

            </div>
        </div>

        @if($transactions->last_page > 1)

            <div class="row">
                <div class="col s12 offset-m8 m4 offset-sl8 sl4">

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

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

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

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

                        </li>
                    </ul>

                </div>
            </div>

        @endif

    </div>

    <div id="modalCrud" class="modal">
        <div class="modal-content">
            <div class="row">
                <div class="col s12">
                    <h5 class="font-weight-800 grey-text">@lang('Cadastrar / Editar')</h5>
                </div>
            </div>

            <form id="formCrud" method="post">
                {{ csrf_field() }}

                <input hidden name="id" id="id">

            </form>


        </div>
        <div id="modalBtn" class="modal-footer">
            <a href="#!" class="modal-action modal-close waves-effect waves-yellow btn-flat">@lang('Cancelar')</a>
            <a href="#!" onclick="enviarFormComValidacao()"
               class="modal-action waves-effect waves-yellow btn-flat">@lang('Salvar')</a>
        </div>

        <div hidden id="modalLoad" class="row">
            <div class="col offset-s10 s1" style="margin-bottom: 15px;">
                <div class="preloader-wrapper small active">
                    <div class="spinner-layer spinner-yellow-only">
                        <div class="circle-clipper left">
                            <div class="circle"></div>
                        </div>
                        <div class="gap-patch">
                            <div class="circle"></div>
                        </div>
                        <div class="circle-clipper right">
                            <div class="circle"></div>
                        </div>
                    </div>
                </div>

            </div>
        </div>


    </div>

    <div id="modalDeletar" class="modal">
        <div class="modal-content">
            <div class="row">
                <div class="col s12">
                    <h5 class="font-weight-800 grey-text">@lang('Deletar')</h5>
                </div>
            </div>

            <div class="row">
                <div class="col s12">
                    <p class="font-weight-800 grey-text">@lang('Tem certeza que deseja deletar ')
                        <span id="quantidadeRegistroDeletado" class="red-text"></span>
                        @lang(' registros ?')
                    </p>
                </div>
            </div>

        </div>
        <div class="modal-footer">
            <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">@lang('Cancelar')</a>
            <a href="#!" onclick="deletar()"
               class="modal-action waves-effect waves-yellow btn-flat">@lang('Deletar')</a>
        </div>

        <div hidden id="modalLoadDeletar" class="row">
            <div class="col offset-s10 s1" style="margin-bottom: 15px;">
                <div class="preloader-wrapper small active">
                    <div class="spinner-layer spinner-yellow-only">
                        <div class="circle-clipper left">
                            <div class="circle"></div>
                        </div>
                        <div class="gap-patch">
                            <div class="circle"></div>
                        </div>
                        <div class="circle-clipper right">
                            <div class="circle"></div>
                        </div>
                    </div>
                </div>

            </div>
        </div>

    </div>

@endsection
@section('specific-scripts')

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

        var linkCrud = [
            '/transaction/cadastrar',
            '/transaction/editar',
            '/transaction/deletar'
        ];

        inicio({{ count($transactions->data) }})
        $('#formDeletar').attr('action', linkCrud[2]);
        $('.titulo_pagina').text('Balanço');

        $("#formCrud").validate({
            rules: {
                type_balance_id: {
                    required: true,
                },
                value: {
                    required: true,
                }
            },
            //For custom messages
            messages: {
                type_balance_id: {
                    required: "Campo é obrigatorio",
                },
                value: {
                    required: "Campo é obrigatorio",
                }
            },
            errorElement: 'div',
            errorPlacement: function (error, element) {
                var placement = $(element).data('error');
                if (placement) {
                    $(placement).append(error)
                } else {
                    error.insertAfter(element);
                }
            }
        });

        @if (session('status'))

        msgToast('{{ session('status') }}');

        @endif

    </script>

@stop