@extends('layouts.tributos')
@section('content')
    <style>
        .ui-autocomplete-loading {
            background: white url({{url('img/gif/ajax-loader.gif')}}) right center no-repeat;
        }
    </style>
<h3 class="page-header"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Logradouro <small>(Formulário para Incluir Novo Registro)</small></h3>
<div id="msg-status"></div>
<form name="FrmIncluirLogradouro" action="{{route('logradouro.store')}}" method="post" autocomplete="off">
    @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-6">
            <label for="">* Nome logradouro</label>
            <input type="text" name="LOGRADOURO" class="form-control">
        </div>
        <div class="col-md-4">
            <label for="">* Bairro</label>
            <div class="input-group">
                <select name="CODBAIRRO" id="comboBairros" class="form-control">
                    <!-- Populado tambem via ajax la em logradouro-->
                    <option value="" selected></option>
                    @foreach($bairro as $b)
                        <option value="{{$b->BAICODIGO}}">{{$b->BAINOME}}</option>
                    @endforeach
                </select>
                <span class="input-group-btn">
                    <button class="btn btn-default" type="button" title="Incluir Bairro" id="btnIncluirBairro"><span class="glyphicon glyphicon-file" aria-hidden="true"></span></button>
{{--                    <button class="btn btn-default" type="button" title="Listar Bairro(s)" id="btnListarBairro"><span class="glyphicon glyphicon-list" aria-hidden="true"></span></button>--}}
                </span>
            </div>
        </div>
        <div class="col-md-2">
            <label for="">CEP</label>
            <input type="text" name="CEP" class="form-control" id="cep">
        </div>
    </div>
    <div class="row">
        <div class="col-md-2">
            <label for="">Valor Terreno</label>
            <div class="input-group">
                <span class="input-group-addon">R$</span>
                <input type="text" name="VRL_TERRENO" id="VRL_TERRENO" value="0,00" class="form-control" maxlength="6">
                <span class="input-group-addon">m²</span>
            </div>
        </div>
        <div class="col-md-2">
            <label for="">Valor Construído</label>
            <div class="input-group">
                <span class="input-group-addon">R$</span>
                <input type="text" name="VRL_CONSTRUCAO" id="VRL_CONSTRUCAO" value="0,00" class="form-control" maxlength="6">
                <span class="input-group-addon">m²</span>
            </div>
        </div>
        <div class="col-md-2">
            <label for="">Pavimentada</label>
            <select name="PAVIMENTADO" class="form-control">
                <option value="" selected></option>
                <option value="S">Sim</option>
                <option value="N">Não</option>
            </select>
        </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>
    <hr>
</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-4">--}}
{{--                <form name="FrmPorLogradouro" action="" method="post">--}}
{{--                    <div class="input-group">--}}
{{--                        <input type="text" name="logradouro" class="form-control" placeholder="Logradouro" required>--}}
{{--                        <span class="input-group-btn">--}}
{{--                        <button class="btn btn-primary" type="submit"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button>--}}
{{--                    </span>--}}
{{--                    </div>--}}
{{--                </form>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </div>--}}
{{--</div>--}}

{{--<div id="listarTableDados">--}}
    <table id="table" class="table table-hover">
        <thead>
        <tr>
            <th width="8%">Código</th>
            <th width="32%">Nome</th>
            <th width="20%" colspan="2">Bairro</th>
            <th width="10%">CEP</th>
            <th width="10%">Vlr. Terreno</th>
            <th width="10%">Vlr. Construído</th>
            <td colspan="2">Gerenciar</td>
        </tr>
        </thead>
        <tbody>
        <!--    carregamento via ajax-->
        </tbody>
    </table>
{{--</div>--}}


    <table class="table table-hover data-table" width="100%">
        <thead>
        <tr>
            <th width="5%">Código</th>
            <th width="25%">Nome</th>
            <th width="25%">Bairro</th>
            <th width="5%"></th>
            <th width="10%">CEP</th>
            <th width="10%">Vlr. Terreno</th>
            <th width="10%">Vlr. Construído</th>
            <td width="10%">Ação</td>
        </tr>
        </thead>
    </table>
<hr>

<!--Modal Incluir Bairro-->
<div class="modal fade" tabindex="-1" role="dialog" id="modalBairro">
    <div class="retorno"></div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="modalLista">
    <div class="retorno"></div>
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="modalUpdate">
    <div class="retorno"></div>
</div>

<div id="delete-dialog" title="Exclusão">
    <p><span class="ui-icon ui-icon-alert"></span> Deseja excluir este logradouro</p>
</div>
@endsection
@push('script')
    <script type="text/javascript">
        $(document).ready(function () {
            $('.data-table').DataTable({
                iDisplayLength: 10,
                processing: true,
                serverSide: true,
                order: [[1, "asc"]],
                ajax: "{{ route('logradouro.table') }}",
                columns: [
                    {data: 'I_IDLOGRADOURO', name: 'I_IDLOGRADOURO'},
                    {data: 'LOGRADOURO', name: 'LOGRADOURO'},
                    {data: 'BAINOME', name: 'BAINOME'},
                    {data: 'btnBairro', orderable: false, searchable: false},
                    {data: 'CEP', name: 'CEP'},
                    {data: 'VRL_CONSTRUCAO', name: 'VRL_CONSTRUCAO'},
                    {data: 'VRL_TERRENO', name: 'VRL_TERRENO'},
                    {data: 'action', name: 'action', 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"
                    }
                },
            });
        });

        $(function () {
            $('#cep').mask("99999-999");
            $('#VRL_TERRENO, #VRL_CONSTRUCAO').priceFormat({
                //prefix: 'R$ ',
                prefix: '',
                centsSeparator: ',',
                thousandsSeparator: '.',
                limit: 17,
                centsLimit: 2
            });
        })
    </script>
    <script src="{{url(mix('modulos/tributos/assets/js/tributos/logradouro/list-create-logradouro.js'))}}"></script>
    <script src="{{url(mix('modulos/tributos/assets/js/tributos/logradouro/bairro/list-create-bairro.js'))}}"></script>
@endpush

<!--https://www.significados.com.br/logradouro/-->
<!--Logradouro: aeroporto, alameda, área, avenida, campo, chácara, colônia, condomínio, conjunto, distrito, esplanada, estação, estrada, favela, fazenda, feira, jardim, ladeira, lago, lagoa, largo, loteamento, morro, núcleo, parque, passarela, pátio, praça, quadra, recanto, residencial, rodovia, rua, setor, sítio, travessa, trecho, trevo, vale, vereda, via, viaduto, viela, vila.-->