@extends('layouts.back')

@section('titulo', 'Pagar Contas')

@section('page_header','Painel')

@section('breadcrumbs')
@breadcrumbs(["itens" => ["Contas a Pagar" => route('contas-pagar.index'), "Pagar Contas #"]])
@endsection

@section('content')
    <div class="row">
        <div class="col-lg-12">

            <div class="row justify-content-end text-right">
                <div class="col-offset-md-6 col-md-6 mb-3">
                    <div class="btn-group">
                        <button class="btn btn-sm btn-success waves-effect waves-light" onclick="$('#form-principal').submit();">Salvar</button>
                        <a href="{{route('contas-pagar.index')}}" type="button" class="btn btn-sm btn-blue-grey waves-effect waves-light space-left-btn-top">Cancelar</a>
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Receber Contas</h4>
                </div>

                <form action="{{ route('salvar-contas-pagas')}}" method="post" class="form-horizontal form-bordered" enctype="multipart/form-data" id="form-principal">
                    @csrf

                    <div class="card-body">

                        @if ($errors->any())
                            <div class="row">
                                <div class="alert alert-danger col-md-6 col-md-offset-3">
                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                    <ul style="margin-bottom: 0px;">
                                        @foreach ($errors->all() as $error)
                                            <li>{{ $error }}</li>
                                        @endforeach
                                    </ul>
                                </div>
                            </div>
                        @endif

                        <div class="row no-gutters bg-light">
                            <div class="form-group col-md-2">
                                <label class="control-label col-md-12" for="documento">Documento: <span class="required">*</span></label>
                                <div class="col-md-12">
                                    <input type="text" class="form-control" id="filtro-documento" placeholder="Ex: 00001">
                                </div>
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label col-md-6" for="fornecedor">Fornecedor: <span class="required">*</span></label>
                                <div class="col-md-12">
                                    <select class="form-control" style="width: 100%;" id="filtro-fornecedor">
                                        <option value="0">Selecione o fornecedor</option>
                                        @foreach($fornecedores as $fornecedor)
                                            <option value="{{$fornecedor->id}}">{{$fornecedor->fantasia}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-5">
                                <label class="control-label col-md-5" for="periodo">Período:</label>
                                <div class="input-group col-md-12">
                                    <input type="date" class="form-control" id="filtro-start">
                                    <span class="input-group-text">a</span>
                                    <input type="date" class="form-control" id="filtro-end">
                                </div>
                            </div>

                            <div class="col-md-1" style="bottom: -32px;">
                                <a href="javascript:void();" class="btn btn-secondary btn-md waves-effect waves-light">Pesquisar</a>
                            </div>
                        </div>

                        <hr />

                        <div class="row no-gutters">
                            <div class="form-group col-md-4">
                                <label class="control-label col-md-12" for="forma_pagamento">Formas Pagamento:</label>
                                <div class="col-md-12">
                                    <select class="form-control" style="width: 100%;" id="forma_pagamento">
                                        @foreach($formas_pagamento as $forma_pagamento)
                                            <option value="{{$forma_pagamento->id}}">{{$forma_pagamento->descricao}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label col-md-12" for="instituicao">Inst. Financeira:</label>
                                <div class="col-md-12">
                                    <select class="form-control" style="width: 100%;" id="instituicao">
                                        @foreach($instituicoes_financeiras as $instituicao)
                                            <option value="{{$instituicao->id}}">{{$instituicao->nome}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="form-group col-md-4">
                                <label class="control-label col-md-12" for="centro_custo">Centros Custo:</label>
                                <div class="col-md-12">
                                    <select class="form-control" style="width: 100%;" id="centro_custo">
                                        @foreach($centros_custo as $centro_custo)
                                            <option value="{{$centro_custo->id}}">{{$centro_custo->descricao}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <div class="table-responsive">
                                    <table class="table table-hover">
                                        <thead class="thead-light">
                                            <tr>
                                                <th>#</th>
                                                <th>Emissão</th>
                                                <th>Documento</th>
                                                <th>Fornecedor</th>
                                                <th>Vencimento</th>
                                                <th>Valor em Aberto</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="card-footer">
                        <div class="ml-2">
                            <div class="btn-group">
                                <button class="btn btn-md btn-success waves-effect waves-light">Salvar</button>
                                <a href="{{ route('contas-pagar.index') }}" class="btn btn-md btn-blue-grey waves-effect waves-light">Cancelar</a>
                            </div>
                        </div>
                    </div>

                </form>


            </div>

        </div>
    </div>
@endsection

@push('footer_imports_end')
    <script src="{{ asset('adm/assets/js/contas.js') }}"></script>
@endpush