@extends('layouts.tributos')
@section('content')
    <style>
        .ui-autocomplete-loading {
            background: white url({{url('imagens/gif/ajax-loader.gif')}}) right center no-repeat;
        }
    </style>
    <h3 class="page-header"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Atividade TLF <small>(Incluir
            Novo Registro)</small></h3>
    <div id="msg-status"></div>
    <form name="FrmCreateAtividadeTLF" action="{{route('atividade-tlf.store')}}" method="post">
        @csrf
        <div class="row">
            <div class="col-md-12">
                <label for=""><i style="color: grey">* Campo de Preenchimento Obrigatório</i></label>
            </div>
        </div>

        <div class="row">
            <div class="col-md-1">
                <label for="">* Código</label>
                <input type="text" name="codigo" class="form-control" maxlength="10">
            </div>
            <div class="col-md-5">
                <label for="">* Atividade</label>
                <input type="text" name="descricao" class="form-control">
            </div>
            <div class="col-md-2">
                <label for="">* Porte</label>
                <select name="porte" class="form-control">
                    <option select="select"></option>
                    <option value="1">Pequeno</option>
                    <option value="2">Médio</option>
                    <option value="3">Grande</option>
                </select>
            </div>
            <div class="col-md-2">
                <label for="">* Valor</label>
                <div class="input-group">
                    <span class="input-group-addon">R$</span>
                    <input type="text" name="n_valor" id="n_valor" value="0,00" class="form-control">
                </div>
            </div>
            <div class="col-md-2">
                <label for="">* Data</label>
                <div class="input-group">
                    <input type="text" name="d_data" id="DtVirgencia" class="form-control">
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"
                                                          aria-hidden="true"></span></span>
                </div>
            </div>
        </div>
        <div class="page-header"></div>
        <div class="row">
            <div class="col-md-12">
                <button type="submit" class="btn btn-primary btn-lg"><span class="glyphicon glyphicon-floppy-disk"
                                                                           aria-hidden="true"></span> Salvar
                </button>
                <button type="reset" class="btn btn-default"><span class="glyphicon glyphicon-erase"
                                                                   aria-hidden="true"></span> Limpar
                </button>
                <a href="{{route('tributo')}}" class="btn btn-default"><span class="glyphicon glyphicon-home"
                                                                             aria-hidden="true"></span> Voltar</a>
            </div>
        </div>
        <br>
    </form>

    <div class="panel panel-default">
        <div class="panel-heading"><b>Pesquisar</b></div>
        <div class="panel-body">
            <div class="row">
                <div class="col-md-2 col-md-offset-6">
                    <form name="FrmPorCodigo" method="post">
                        <input type="text" name="search_codigo" id="search_codigo" class="form-control"
                               placeholder="Por código" disabled>
                    </form>
                </div>
                <div class="col-md-4">
                    <form name="FrmPorDescrição" method="post">
                        <input type="text" name="search_descricao" id="search_descricao" class="form-control"
                               placeholder="Por Descrição">
                    </form>
                </div>
            </div>
        </div>
    </div>

    <h3 class="page-header"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span> Listar de Atividade
    </h3>
    <div class="table-responsive">
        <table class="table table-hover data-table">
            <thead>
            <tr>
                <th width="5%">Código</th>
                <th width="55%">Descrição</th>
                <th width="15%">Porte</th>
                <th width="10%">Valor</th>
                <th width="5%">Ano</th>
                <th width="5%">Gerenciar</th>
            </tr>
            </thead>
        </table>
    </div>
@endsection
@push('script')
    <script type="text/javascript">
        $(document).ready(function () {
            var oTable = $('.data-table').DataTable({
                searching: false,
                lengthChange: false,
                iDisplayLength: 10,
                processing: true,
                serverSide: true,
                ordering: false,
                //order: [[2, "asc"]],
                ajax: {
                    url: '{{ route('atividade-tlf.index') }}',
                    data: function (d) {
                        d.codigo = $('input[name=search_codigo]').val();
                        d.descricao = $('input[name=search_descricao]').val();
                    }
                },
                columns: [
                    {data: 'codigo', name: 'codigo'},
                    {data: 'descricao', name: 'descricao'},
                    {data: 'porte', name: 'porte'},
                    {data: 'n_valor', name: 'n_valor'},
                    {data: 'ano', name: 'ano'},
                    {data: 'gerenciar', name: 'gerenciar', orderable: false, searchable: false},
                ],
                language: {
                    "sEmptyTable": "Nenhum registro encontrado",
                    "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                    "sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
                    "sInfoFiltered": "(Filtrados de _MAX_ registros)",
                    "sInfoPostFix": "",
                    "sInfoThousands": ".",
                    "sLengthMenu": "_MENU_ resultados por página",
                    "sLoadingRecords": "Carregando...",
                    "sProcessing": "Processando...",
                    "sZeroRecords": "Nenhum registro encontrado",
                    "sSearch": "Pesquisar",
                    "oPaginate": {
                        "sNext": "Próximo",
                        "sPrevious": "Anterior",
                        "sFirst": "Primeiro",
                        "sLast": "Último"
                    },
                    "oAria": {
                        "sSortAscending": ": Ordenar colunas de forma ascendente",
                        "sSortDescending": ": Ordenar colunas de forma descendente"
                    }
                }
            });

            $('#search_codigo, #search_descricao').keyup(function () {
                oTable.draw();
            });
        });
    </script>

    <script>
        $(function () {
            $("#DtVirgencia").mask("99/99/9999").datepicker();

            $('#n_valor').priceFormat({
                prefix: '',
                centsSeparator: ',',
                thousandsSeparator: '.',
                limit: 17,
                centsLimit: 2
            });
        })
    </script>

    <script
        src="{{url(mix('modulos/tributos/assets/js/tributos/tlf/atividade/list-incluir-atividade-tlf.js'))}}"></script>
@endpush