@extends('adminlte::page')

@section('title', " $title ")

@section('content')
<div class="container-fluid">
    
    <div class="row pt-4">
        <div class="col-md-4">
            <h4><a href="" class="btn btn-primary" title="Cadastrar Novo" data-toggle="modal" data-target="#categories"> + Cadastrar plano de contas</a></h4>
        </div>
        
        <div class="col-md-4"></div>
        
        <div class="col-md-4">
            <h4><a href="" class="btn btn-success float-right" title="Cadastrar Novo" data-toggle="modal" data-target="#expense"> + Cadastrar Despesa/Receita</a></h4>
        </div>
    </div>
    
    <div class="row pt-4">
        <div class="col-md-12">
            <div class="callout callout-warning">
                <h5 class='center'><i class="fas fa-info"></i> Caixa ( Despesas / Receitas )</h5>
            </div>
        </div>
    </div>
    
    <div class="card pt-4 callout callout-success">
        
        <form action="{{ route('financial.passiveExpensesSearch') }}" method='get'>
            @csrf
            <div class="row">
                <div class="col-md-12">
                    <h5 class='center'><i class="fas fa-search"></i> Filtros</h5>
                </div>

                <div class="col-md-1 mt-2">
                    <label class="control-label">CNPJ</label>
                    <select name="cnpj" class="form-control">
                        <option value="">-- Sel. --</option>
                        <option value="CAM" {{ ($filters['cnpj'] ?? '') == 'CAM' ? 'selected' : '' }}>CAM</option>
                        <option value="RIC" {{ ($filters['cnpj'] ?? '') == 'RIC' ? 'selected' : '' }}>RIC</option>
                        <option value="VAL" {{ ($filters['cnpj'] ?? '') == 'VAL' ? 'selected' : '' }}>VAL</option>
                        <option value="DIRSIL" {{ ($filters['cnpj'] ?? '') == 'DIRSIL' ? 'selected' : '' }}>DIRSIL</option>
                        <option value="LVP" {{ ($filters['cnpj'] ?? '') == 'LVP' ? 'selected' : '' }}>LVP</option>
                        <option value="LVD" {{ ($filters['cnpj'] ?? '') == 'LVD' ? 'selected' : '' }}>LVD</option>
                    </select>
                </div>

                <div class="col-md-1 mt-2">
                    <label class="control-label">Tipo</label>
                    <select name="type" class="form-control">
                        <option value="">-- Sel. --</option>
                        <option value="Despesa" {{ ($filters['type'] ?? '') == 'Despesa' ? 'selected' : '' }}>Despesa</option>
                        <option value="Receita" {{ ($filters['type'] ?? '') == 'Receita' ? 'selected' : '' }}>Receita</option>
                    </select>

                </div>

                <div class="col-md-3 mt-2">
                    <label class="control-label">Plano de Contas</label>
                    <select name="category_id" class="form-control">
                        <option value="">-- Selecione a Categoria --</option>
                        @foreach($expense_categories as $expense_category)
                            <option value="{{ $expense_category->id }}" {{ ($filters['category_id'] ?? null) == $expense_category->id ? 'selected' : '' }}>
                                {{ $expense_category->description }}
                            </option>
                        @endforeach
                    </select>

                </div>

                <div class="col-md-3 mt-2">
                    <label class="control-label"> Fornecedor</label>
                    <select name="supplier_id" class="form-control">
                        <option value="">-- Selecione o Fornecedor --</option>
                        @foreach($suppliers as $supplier)
                            <option value="{{ $supplier->id }}" {{ ($filters['supplier_id'] ?? null) == $supplier->id ? 'selected' : '' }}>
                                {{ $supplier->corporate_name }}
                            </option>
                        @endforeach
                    </select>

                </div>

                <div class="col-md-4 mt-2">
                    <label class="control-label"> Cliente</label>
                    <select name="customer_id" class="form-control">
                        <option value="">-- Selecione o Cliente --</option>
                        @foreach($customers as $customer)
                            <option value="{{ $customer->id }}" {{ ($filters['customer_id'] ?? null) == $customer->id ? 'selected' : '' }}>
                                {{ $customer->corporate_name }}
                            </option>
                        @endforeach
                    </select>

                </div>
            </div>

            <div class="row mt-4">
                <div class="col-md-2">
                    <label><i class="fas fa-calendar"></i> Data Inicial</label>
                    <input type='text' name='initial_date' class='form-control datepicker' value='' placeholder="Digite a data Inicial...">
                </div>
                
                <div class="col-md-2">
                    <label><i class="fas fa-calendar"></i> Data Final</label>
                    <input type='text' name='final_date' class='form-control datepicker' value='' placeholder="Digite a data Final...">
                </div>
            </div>
            
            <div class='modal-footer'>
                <button type='submit' class='btn btn-success'><i class='fa fa-search'></i></button>
            </div>
        </form>
        
    </div>
    
    @include('app.includes.alerts')
    
    <div class="row mt-3">
        <div class="col-md-12">
            <div class="table-responsive">
                @if(count($expense_liabilities) > 0)
                    <table class="table table-striped shadow">
                        <thead class="bg-secondary text-white">
                            <tr>
                                <th>Lançamento</th>
                                <th>CNPJ</th>
                                <th>Tipo</th>
                                <th>Plano</th>
                                <th>Beneficiário / Devedor</th>
                                <th>Valor</th>
                                <th>Pagamento</th>
                                <th>OBSERVAÇÃO</th>
                                <th>Atualizar</th>
                                <th>Excluir</th>
                            </tr>
                        </thead>

                        <tbody>
                            @foreach($expense_liabilities as $expense)
                                <tr class="{{ $expense->type == 'Despesa' ? 'table-danger' : ($expense->type == 'Receita' ? 'table-success' : '') }}">
                                    @if($expense->status == 1)
                                        <td class="text-primary"><strong>{{ date('d/m/Y', strtotime($expense->release_date_of)) }}</strong></td>
                                    @else
                                    <td>
                                        <a href="#" title="Para editar clique aqui" class="btn btn-outline-success me-1 edit-btn"
                                            data-bs-toggle="modal" data-bs-target="#expense-update"
                                            data-id="{{ $expense->id }}"
                                            data-release="{{ $expense->release_date_of }}"
                                            data-cnpj="{{ $expense->cnpj }}"
                                            data-type="{{ $expense->type }}"
                                            data-category="{{ $expense->category_id }}"
                                            data-customer="{{ $expense->customer_id }}"
                                            data-supplier="{{ $expense->supplier_id }}"
                                            data-price="{{ $expense->price }}"
                                            data-payday="{{ $expense->payday }}"
                                            data-notes="{{ $expense->notes }}">
                                            {{ date('d/m/Y', strtotime($expense->release_date_of)) }} 
                                        </a>
                                    </td>
                                    @endif
                            
                                    <td><strong>{{ $expense->cnpj }}</strong></td>
                                    <td><strong>{{ $expense->type }}</strong></td>
                                    <td>{{ $expense->category->description }}</td>
                                    <td>
                                        {{ isset($expense->customer_id) ? $expense->customer->corporate_name : "" }}
                                        {{ isset($expense->supplier_id) ? $expense->supplier->corporate_name : "" }}
                                    </td>
                                    <td>{{ number_format($expense->price, 2, ',', '.') }}</td>
                                    <td><span class="badge badge-secondary" style='font-size:16px;'>{{ date('d/m/Y', strtotime($expense->payday)) }}</span></td>
                                    <td>{{ $expense->notes }}</td>

                                    @if($expense->status == 1)
                                        <td class="text-primary"><strong>O.S ({{ $expense->autorization }}) - N/F ({{ $expense->nf }}) - BOLETO ({{ $expense->ticket }})</strong></td>
                                    @else
                                        <td>
                                            <form action="{{ route('financialPay.passiveExpensesUpdatePay', $expense->id) }}" method="POST" onsubmit="return confirm('Tem certeza que deseja atualizar?')">
                                                @csrf
                                                @method('PUT')
                                                <button type="submit" class="btn btn-success shadow"><i class="fas fa-edit"></i></button>
                                            </form>
                                        </td>
                                    @endif

                                    <td>
                                        <form action="{{ route('financial.passiveExpensesDestroy', $expense->id) }}" method="POST" onsubmit="return confirm('Tem certeza que deseja deletar?')">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-danger shadow"><i class="fas fa-trash"></i></button>
                                        </form>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>

                    <!-- Totais Gerais -->
                    <div class="text-right">
                        <strong>Total geral a pagar:</strong> R$ {{ number_format($totalPagar, 2, ',', '.') }}
                        <br>
                        <strong>Total geral a receber:</strong> R$ {{ number_format($totalReceber, 2, ',', '.') }}
                    </div>

                    <div class="card-header">
                        {!! $expense_liabilities->appends(request()->all())->links() !!}
                    </div>

                    @else
                    <div class="card text-center">
                        <p class='pt-3'>
                            <i class='far fa-thumbs-up fa-3x'></i><br>
                            Nenhuma conta a pagar/receber. <br> Contas a pagar/receber são despesas/receitas agendadas e ainda não pagas ou recebidas.
                        </p>
                        <p>
                            <a href="" class="btn btn-success" title="Cadastrar Novo" data-toggle="modal" data-target="#expense"> + Cadastrar Despesa/Receita</a>
                        </p>
                    </div>
                @endif
            </div>
        </div>
    </div>



    <!--MODAL Categoria-->
    <div class="modal fade" id="categories" tabindex="-1" role="dialog" aria-labelledby="formCreate">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header bg-primary">
                    <h4 class="modal-title" id="formCreate"> Cadastrando Categoria</h4>
                </div>
                <div class="modal-body">

                    <form action="{{ route('passive_expenses.store') }}" method="post">
                        @csrf
                        <div class="form-group">
                            <div class="col-sm-12">
                                <label class="control-label"> Categoria</label>
                                <input name="description" class="form-control" value="" placeholder="Digite a categoria..." type="text" required>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="col-sm-12">
                                <button type="button" class="btn btn-danger" data-dismiss="modal">Fechar</button>
                                <input type="submit" class="btn btn-primary" value="Salvar"/>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    
    <!--MODAL Despesas-->
    <div class="modal fade" id="expense" tabindex="-1" role="dialog" aria-labelledby="formCreate">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header bg-info">
                    <h4 class="modal-title" id="formCreate"> Cadastrando Despesa / Receita</h4>
                </div>
                <div class="modal-body">

                    <form id="formDespesa"  action="{{ route('financial.passiveExpensesStore') }}" method="post">
                        @csrf
                        <div class="row">
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-calendar"></i> Data do Lançamento</label>
                                <input name="release_date_of" class="form-control datepicker" value="" placeholder="Digite a data..." type="text" required>
                            </div>
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-check"></i> CNPJ</label>
                                 <select name="cnpj" class="form-control">
                                    <option value='CAM'>CAM</option>
                                    <option value='RIC'>RIC</option>
                                    <option value='VAL'>VAL</option>
                                    <option value='DIRSIL'>DIRSIL</option>
                                    <option value='LVP'>LVP</option>
                                    <option value='LVD'>LVD</option>
                                </select> 
                            </div>
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-check"></i> Tipo</label>
                                 <select name="type" class="form-control" id="typeSelect" required>
                                    <option value=''>--Selecione--</option>
                                    <option value='Despesa'>Despesa</option>
                                    <option value='Receita'>Receita</option>
                                </select>
                            </div>
                            
                            <div class="col-sm-6">
                                <label class="control-label"><i class="far fa-address-card"></i> Plano de Contas (categoria)</label>
                                <select name="category_id" class="form-control" required>
                                    <option value="">-- Selecione a Categoria --</option>
                                    @foreach($expense_categories as $expense_category)
                                        <option value="{{ $expense_category->id }}">{{ $expense_category->description }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
  
                        <div class="row mt-3">
                            
                            <div class="col-md-6" id="clienteDiv" style="display:none;">
                                <label class="control-label"><i class="fa fa-check"></i> Cliente</label>
                                <select name="customer_id" class="form-control" >
                                    <option value="">-- Selecione o Cliente para receita --</option>
                                    @foreach($customers as $customer)
                                        <option value="{{ $customer->id }}">{{ $customer->corporate_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            
                            <div class="col-md-6" id="fornecedorDiv" style="display:none;">
                                <label class="control-label"><i class="fa fa-check"></i> Fornecedor </label>
                                <select name="supplier_id" class="form-control">
                                    <option value="">-- Selecione o Fornecedor para despesa --</option>
                                    @foreach($suppliers as $supplier)
                                        <option value="{{ $supplier->id }}">{{ $supplier->corporate_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        
                        <div class="row mt-3">
                            <div class="col-sm-3">
                                <label class="control-label">R$ Valor Absoluto</label>
                                <input name="price" class="form-control money" value="" placeholder="Digite o valor da despesa/receita..." type="text" required>
                            </div>
                            
                            <div class="col-md-3">
                                <label class="control-label"><i class="fa fa-calendar"></i> Data de Pagamento</label>
                                <input name="payday" class="form-control datepicker" value="" placeholder="Digite a data do pagamento..." type="text" required>
                            </div>
                            
                        </div>
               
                        <div class="row pt-3">
                            <div class="col-sm-12">
                                <label class="control-label"> * Observação</label>
                                <textarea name="notes" class="form-control" rows="5"></textarea>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="col-sm-12">
                                <button type="button" class="btn btn-danger" data-dismiss="modal">Fechar</button>
                                <input type="submit" class="btn btn-primary" value="Salvar"/>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script>
        document.getElementById("typeSelect").addEventListener("change", function() {
            var type = this.value;
            var clienteDiv = document.getElementById("clienteDiv");
            var fornecedorDiv = document.getElementById("fornecedorDiv");

            if (type === "Despesa") {
                clienteDiv.style.display = "none";
                fornecedorDiv.style.display = "block";
            } else if (type === "Receita") {
                clienteDiv.style.display = "block";
                fornecedorDiv.style.display = "none";
            } else {
                clienteDiv.style.display = "none";
                fornecedorDiv.style.display = "none";
            }
        });
    </script>
    
    <!--MODAL Despesas update-->
    <div class="modal fade" id="expense-update" tabindex="-1" role="dialog" aria-labelledby="formUpdate">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header bg-success">
                    <h4 class="modal-title"> Editando Despesa / Receita</h4>
                </div>
                <div class="modal-body">

                    <form id="formDespesaUpdate"  action="{{ route('financial.passiveExpensesUpdate') }}" method="post">
                        @method('PUT')
                        @csrf
                        
                        <input type="hidden" name="id" id="id" class="form-control" value="" required>
                        
                        <div class="row">
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-calendar"></i> Data do Lançamento</label>
                                <input name="release_date_of" id="release" class="form-control datepicker" placeholder="Digite a data..." type="text">
                            </div>
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-check"></i> CNPJ</label>
                                 <select name="cnpj" class="form-control" id="cnpj">
                                 <option value='CAM'>CAM</option>
                                    <option value='RIC'>RIC</option>
                                    <option value='VAL'>VAL</option>
                                    <option value='DIRSIL'>DIRSIL</option>
                                    <option value='LVP'>LVP</option>
                                    <option value='LVD'>LVD</option>
                                </select>
                            </div>
                            
                            <div class="col-md-2">
                                <label class="control-label"><i class="fa fa-check"></i> Tipo</label>
                                 <select name="type" class="form-control" id="type">
                                    <option value='Despesa'>Despesa</option>
                                    <option value='Receita'>Receita</option>
                                </select>
                            </div>
                            
                            <div class="col-sm-6">
                                <label class="control-label"><i class="far fa-address-card"></i> Plano de Contas (categoria)</label>
                                <select name="category_id" class="form-control" id="category" required>
                                    <option value="">-- Selecione a Categoria --</option>
                                    @foreach($expense_categories as $expense_category)
                                        <option value="{{ $expense_category->id }}">{{ $expense_category->description }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
  
                        <div class="row mt-3">
                            
                            <div class="col-md-6">
                                <label class="control-label"><i class="fa fa-check"></i> Beneficiário (cliente)</label>
                                <select name="customer_id" class="form-control" id="customer">
                                    <option value="">-- Selecione o Cliente --</option>
                                    @foreach($customers as $customer)
                                        <option value="{{ $customer->id }}">{{ $customer->corporate_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            
                            <div class="col-md-6">
                                <label class="control-label"><i class="fa fa-check"></i> Devedor (fornecedor)</label>
                                <select name="supplier_id" class="form-control" id="supplier">
                                    <option value="">-- Selecione o Fornecedor --</option>
                                    @foreach($suppliers as $supplier)
                                        <option value="{{ $supplier->id }}">{{ $supplier->corporate_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        
                        <div class="row mt-3">
                            <div class="col-sm-3">
                                <label class="control-label">R$ Valor Absoluto</label>
                                <input name="price" class="form-control money" id="price" value="" placeholder="Digite o valor da despesa/receita..." type="text" required>
                            </div>
                            
                            <div class="col-md-8">
                                <label class="control-label"><i class="fa fa-calendar"></i> Data de Pagamento <code>( *altere manualmente ex: 01/01/2023 apenas os números )</code></label>
                                <input name="payday" class="form-control dataUpdate" id="payday" placeholder="Digite a data do pagamento..." type="text"  maxlength="10">
                            </div>
                            
                        </div>
               
                        <div class="row pt-3">
                            <div class="col-sm-12">
                                <label class="control-label"> * Observação</label>
                                <textarea name="notes" class="form-control" id='notes' rows="5"></textarea>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="col-sm-12">
                                <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Fechar</button>
                                <button type="submit" class="btn btn-success loading">Atualizar</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

    <script>
        // Aguarde o documento estar completamente carregado
        document.addEventListener('DOMContentLoaded', function () {
            // Adicione um ouvinte de evento de clique a todos os botões de edição
            var editButtons = document.querySelectorAll('.edit-btn');
            editButtons.forEach(function (button) {
                button.addEventListener('click', function () {
                    // Obtenha os valores dos atributos de dados do botão de edição clicado
                    var id = this.getAttribute('data-id');
                    var release = this.getAttribute('data-release');
                    var formattedRelease = moment(release).format('DD/MM/YYYY');
                    var cnpj = this.getAttribute('data-cnpj');
                    var type = this.getAttribute('data-type');
                    var category = this.getAttribute('data-category');
                    var customer = this.getAttribute('data-customer');
                    var supplier = this.getAttribute('data-supplier');
                    var price = this.getAttribute('data-price');
                    var formattedPrice = formatCurrency(price);
                    var payday = this.getAttribute('data-payday');
                    var formattedPayday = moment(payday).format('DD/MM/YYYY');
                    var notes = this.getAttribute('data-notes');
                    
                    // Preencha os campos do modal com os valores obtidos
                    document.getElementById('id').value = id;
                    document.getElementById('release').value = formattedRelease;
                    document.getElementById('cnpj').value = cnpj;
                    document.getElementById('type').value = type;
                    document.getElementById('category').value = category;
                    document.getElementById('customer').value = customer;
                    document.getElementById('supplier').value = supplier;
                    document.getElementById('price').value = formattedPrice;
                    document.getElementById('payday').value = formattedPayday;
                    document.getElementById('notes').value = notes; 
                });
            });
            
            function formatCurrency(value) {
                return new Intl.NumberFormat('pt-BR', {
                    style: 'currency',
                    currency: 'BRL',
                    minimumFractionDigits: 2,
                    maximumFractionDigits: 2
                }).format(value).replace('R$', '').trim();
            }
        });
    </script>
    
</div>
@stop