@extends('template_pages.session')

@section('page_title', 'Editar NF #' . ($invoice->id ?? ''))
@section('page_icon', 'file-text')
@section('navbar', 'finance.navbar')

@push('styles')
<!-- Select Plugin CSS -->
<link rel="stylesheet" href="{{ asset('assets/inspinia/plugins/select2/select2.min.css') }}">
<!-- Daterangepicker Plugin CSS -->
<link rel="stylesheet" href="{{ asset('assets/inspinia/plugins/daterangepicker/daterangepicker.css') }}" type="text/css">
@endpush

@section('content_page')
<div class="card-body">
    <form id="invoiceForm">
        {{ csrf_field() }}
        <input type="hidden" name="id" value="{{ $invoice->id }}">

        <div class="d-flex align-items-center gap-1">
            <i data-lucide="text" class="fs-4"></i>
            <h4 class="mb-0">Informações Básicas</h4>
        </div>

        @php
            $collaboratorName = $invoice->collaborator->name ?? 'Não informado';
            $nfTypeUi = $invoice->origin_type === 'award' ? 'Prêmio' : 'Serviço Prestado';
            $monthRef = $invoice->reference_date ? \Carbon\Carbon::parse($invoice->reference_date)->format('m') : null;
            $yearRef = $invoice->reference_date ? \Carbon\Carbon::parse($invoice->reference_date)->format('Y') : null;
            $expectedAmountDisplay = \App\Helpers\FormatHelper::decimalToCurrency($invoice->expected_amount ?? 0);
        @endphp

        <div class="row mt-3">
            <div class="col-md-4">
                <div class="p-2 border rounded bg-light mb-2">
                    <small class="text-muted">Colaborador</small>
                    <div>{{ $collaboratorName }}</div>
                </div>
            </div>
        </div>

        <div class="border-top border-dashed my-3"></div>

        <div class="d-flex align-items-center gap-1">
            <i data-lucide="hand-coins" class="fs-4"></i>
            <h4 class="mb-0">Informações da NF</h4>
        </div>

        <div class="row mt-3">
            <div class="col-md-4">
                <div class="p-2 border rounded bg-light mb-2">
                    <small class="text-muted">Tipo de Nota Fiscal</small>
                    <div>{{ $nfTypeUi }}</div>
                </div>
            </div>
            <div class="col-md-2">
                <div class="p-2 border rounded bg-light mb-2">
                    <small class="text-muted">Mês de Referência</small>
                    @php
                        $monthNames = [
                            '01' => 'Janeiro',
                            '02' => 'Fevereiro',
                            '03' => 'Março',
                            '04' => 'Abril',
                            '05' => 'Maio',
                            '06' => 'Junho',
                            '07' => 'Julho',
                            '08' => 'Agosto',
                            '09' => 'Setembro',
                            '10' => 'Outubro',
                            '11' => 'Novembro',
                            '12' => 'Dezembro',
                        ];
                    @endphp

                    <div>{{ isset($monthRef) ? ($monthNames[$monthRef] ?? 'Não informado') : 'Não informado' }}</div>
                </div>
            </div>
            <div class="col-md-2">
                <div class="p-2 border rounded bg-light mb-2">
                    <small class="text-muted">Ano de Referência</small>
                    <div>{{ $yearRef ?? 'Não informado' }}</div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="p-2 border rounded bg-light mb-2">
                    <small class="text-muted">Arquivo</small>
                    <div>{{ $fileInfo['filename'] }}</div>
                </div>
            </div>
        </div>

        <div class="row mt-3">
            <div class="col-md-4">
                <label class="form-label">Valor da NF *</label>
                <div class="input-group">
                    <span class="input-group-text">R$</span>
                    <input class="form-control money form-control-mb-0" placeholder="Valor" type="text" name="value" id="value" value="{{ $expectedAmountDisplay }}"/>
                </div>
            </div>
        </div>

        <div class="border-top border-dashed my-3"></div>
        <div class="row mt-2">
            <div class="btn-list col-12 col-lg-auto">
                <button type="submit" class="btn btn-success" id="btn_add">Salvar</button>
            </div>
        </div>
    </form>
</div>
@endsection

@push('scripts')
<!-- Select2 Plugin Js -->
<script src="{{ asset('assets/inspinia/plugins/select2/select2.min.js') }}"></script>
<!--Select 2 Demo js-->
<script src="{{ asset('assets/inspinia/js/pages/form-select2.js') }}"></script>
<!-- MaskMoney -->
<script src="{{ asset('assets/scripts/maskmoney/jquery.maskMoney.min.js') }}"></script>
<!-- Máscaras Js -->
<script src="{{ asset('assets/inspinia/plugins/inputmask/jquery.mask.min.js') }}"></script>
<script src="{{ asset('assets/scripts/masks.js') }}"></script>
<!-- Validação Formulário -->
<script src="{{ asset('assets/inspinia/js/form-validation.js') }}"></script>
<!-- SweetAlert2 -->
<script src="{{ asset('assets/inspinia/plugins/sweetalert2/sweetalert2.min.js') }}"></script>

<script>
$(document).ready(function() {
    // Garante a máscara de dinheiro
    if (typeof addMaskMoney === 'function') {
        addMaskMoney();
    } else {
        $('.money').maskMoney({symbol:'R$ ', thousands:'.', decimal:',', symbolStay: true});
    }

    $('#btn_add').on('click', function(e) {
        $("#invoiceForm").validate({
            ignore: [],
            errorClass: "invalid-feedback",
            errorElement: "span",
            rules: {
                value: { required: true }
            },
            messages: {
                value: { required: "Informe o valor da NF" }
            },
            errorPlacement: function (error, element) {
                if (element.hasClass('money')) {
                    error.insertAfter(element.closest('.input-group'));
                } else {
                    error.insertAfter(element);
                }
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('is-invalid');
                if ($(element).hasClass('money')) {
                    $(element).closest('.input-group').addClass('is-invalid');
                }
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
                if ($(element).hasClass('money')) {
                    $(element).closest('.input-group').removeClass('is-invalid');
                }
            },
            submitHandler: function(form) {
                submitFormAjax(form);
            }
        });
    });

    function submitFormAjax(form) {
        var $form = $(form);
        var submitBtn = $form.find('button[type="submit"]');
        var btnText = submitBtn.text();
        
        submitBtn.prop('disabled', true).html('<span class="spinner-border spinner-border-sm me-2" role="status"></span>Salvando...');
        
        var formData = new FormData(form);

        $.ajax({
            url: '{{ route('finance.invoices.edit.store') }}',
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function (response) {
                submitBtn.prop('disabled', false).text(btnText);
                if (response.success) {
                    Swal.fire({
                        title: 'Sucesso!',
                        text: response.message || 'NF salva com sucesso!',
                        icon: 'success',
                        confirmButtonText: 'OK'
                    }).then(() => {
                        if (response.redirect) {
                            window.location.href = response.redirect;
                        }
                    });
                }
            },
            error: function (xhr) {
                submitBtn.prop('disabled', false).text(btnText);
                let errorMessage = 'Ocorreu um erro ao salvar a NF.';
                
                if (xhr.status === 422) {
                    const errors = xhr.responseJSON.errors;
                    let errorList = '<ul>';
                    $.each(errors, function(field, messages) {
                        $.each(messages, function(index, message) {
                            errorList += '<li>' + message + '</li>';
                        });
                    });
                    errorList += '</ul>';
                    Swal.fire({ title: 'Erro de Validação!', html: errorList, icon: 'error', confirmButtonText: 'OK' });
                } else {
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMessage = xhr.responseJSON.message;
                    }
                    Swal.fire({ title: 'Erro!', text: errorMessage, icon: 'error', confirmButtonText: 'OK' });
                }
            }
        });
    }
});
</script>
@endpush