@extends('template_pages.session')

@section('page_title', 'Configurações - Testar emissão de NFS-e')
@section('page_icon', 'file-badge-2')
@section('navbar', 'finance.navbar')

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

@section('content_page')
<div class="card-body mt-3 pt-0">
    <div class="col-md-12">
        <form id="form_test_invoice">
            {{ csrf_field() }}

            <div class="d-flex align-items-center gap-1 mb-3">
                <i data-lucide="file-text" class="fs-4"></i>
                <h4 class="mb-0">Teste de emissão (Asaas)</h4>
            </div>

            <div class="row">
                <div class="col-md-3 mb-3">
                    <label class="form-label">Cliente Faturável *</label>
                    <select class="form-select" name="asaas_customer_id" id="asaas_customer_id" style="width: 100%;" required>
                        <option value="">Selecione o cliente faturável...</option>
                        @foreach ($clients as $client)
                            <option value="{{ $client->asaas_id }}">
                                {{ $client->legal_name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3 mb-3">
                    <label class="form-label">Valor *</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="10,00" required/>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 mb-0">
                    <label class="form-label">Descrição NF *</label>
                    <textarea class="form-control" name="description" rows="3" required>Serviço de consultoria no período {mesanocorrente}</textarea>
                    <small class="text-muted d-block mt-1">Você pode utilizar a tag {mesanocorrente} para inserir o mês e ano corrente na descrição da NF.</small>
                </div>
            </div>

            <div class="row mt-3">
                <div class="btn-list col-12 col-lg-auto">
                    <button type="submit" class="btn btn-success" id="btn_add">Testar Emissão NFS-e</button>
                </div>
            </div>
        </form>
    </div>

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

    <div class="d-flex align-items-center gap-1 mb-3">
        <i data-lucide="list" class="fs-4"></i>
        <h4 class="mb-0">Lista de Testes</h4>
    </div>

    <div class="row mt-3">
        <div class="col">
            <table id="invoice-test-table" class="table table-striped table-hover align-middle mb-0">
                <thead class="bg-light align-middle bg-opacity-25 thead-sm">
                    <tr class="text-uppercase fs-xxs">
                        <th style="width: 1%;"></th>
                        <th>ID</th>
                        <th>Nome</th>
                        <th>CPF/CNPJ</th>
                        <th>Valor</th>
                        <th class="text-center checkbox-select-datatable">Status</th>
                        <th class="text-center checkbox-select-datatable">Ações</th>
                    </tr>
                </thead>
                <tbody>
                    <!-- Carregado via AJAX -->
                </tbody>
            </table>
        </div>
    </div>
</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>
<!-- Datatables js -->
<script src="{{ asset('assets/inspinia/plugins/datatables/dataTables.min.js') }}"></script>
<script src="{{ asset('assets/inspinia/plugins/datatables/dataTables.bootstrap5.min.js') }}"></script>
<script>
$(document).ready(function() {
    // Select2 para cliente Asaas (todos pré-carregados + busca local)
    $('#asaas_customer_id').select2({
        placeholder: 'Selecione o cliente faturável...',
        allowClear: true
    });

    // Inicializar DataTable
    var table = $('#invoice-test-table').DataTable({
        processing: true,
        serverSide: false, // Client-side processing para array simples
        ajax: {
            url: "{{ route('finance.settings.invoice.test.list.ajax') }}",
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token() }}'
            },
            dataSrc: 'data'
        },
        columns: [
            { data: 'expand', orderable: false, searchable: false, className: 'details-control align-middle text-center' },
            { data: 'id' },
            { data: 'name' },
            { data: 'document_number' },
            { data: 'value' },
            { data: 'status', className: 'text-center' },
            { data: 'actions', className: 'text-center' }
        ],
        order: [[1, 'desc']],
        pageLength: 10,
        lengthMenu: [[10, 20, 50, 100], [10, 20, 50, 100]],
        language: {
            url: '{{ asset('assets/inspinia/plugins/datatables/pt_br.json') }}',
            paginate: {
                first: '<i class="ti ti-chevrons-left"></i>',
                previous: '<i class="ti ti-chevron-left"></i>',
                next: '<i class="ti ti-chevron-right"></i>',
                last: '<i class="ti ti-chevrons-right"></i>'
            },
            processing: '',
        },
        drawCallback: function(settings) {
            if (typeof lucide !== 'undefined') {
                lucide.createIcons();
            }
        }
    });

    // Expandable rows logic
    $('#invoice-test-table tbody').on('click', '.toggle-row', function (e) {
        e.preventDefault();
        var tr = $(this).closest('tr');
        var row = table.row(tr);
        var icon = $(this).find('i');

        if (row.child.isShown()) {
            row.child.hide();
            tr.removeClass('shown');
            icon.attr('data-lucide', 'plus');
        } else {
            // Close other open rows
            table.rows().every(function() {
                if (this.child.isShown()) {
                    this.child.hide();
                    $(this.node()).removeClass('shown');
                    $(this.node()).find('.toggle-row i').attr('data-lucide', 'plus');
                }
            });

            row.child(row.data().details_html).show();
            tr.addClass('shown');
            icon.attr('data-lucide', 'minus');
        }
        lucide.createIcons();
    });

    // Cancel NFS Logic
    $('#invoice-test-table tbody').on('click', '.cancel-nfs', function (e) {
        e.preventDefault();
        var id = $(this).data('id');

        Swal.fire({
            title: 'Cancelar NFS-e de Teste (Asaas)?',
            text: "Deseja realmente cancelar esta Nota Fiscal de teste?",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Sim, cancelar!',
            cancelButtonText: 'Cancelar'
        }).then((result) => {
            if (result.isConfirmed) {
                // Show loading
                Swal.fire({
                    title: 'Processando...',
                    text: 'Aguarde enquanto a solicitação é processada.',
                    allowOutsideClick: false,
                    didOpen: () => {
                        Swal.showLoading();
                    }
                });

                $.ajax({
                    url: "{{ route('finance.settings.invoice.test.cancel') }}",
                    type: "POST",
                    data: {
                        id: id,
                        _token: "{{ csrf_token() }}"
                    },
                    success: function (response) {
                        if (response.success) {
                            Swal.fire(
                                'Cancelado!',
                                response.message,
                                'success'
                            );
                            table.ajax.reload(null, false);
                        } else {
                            Swal.fire(
                                'Erro!',
                                response.message,
                                'error'
                            );
                        }
                    },
                    error: function (xhr) {
                        Swal.fire(
                            'Erro!',
                            'Ocorreu um erro ao processar a solicitação.',
                            'error'
                        );
                    }
                });
            }
        });
    });

    // Validação monetária personalizada
    $.validator.addMethod("moneyValidation", function(value, element) {
        if (!value) return false;
        var cleanValue = value.replace(/\./g, '').replace(',', '.');
        var numValue = parseFloat(cleanValue);
        return !isNaN(numValue) && numValue > 0;
    }, "Por favor, insira um valor válido maior que zero");

    // Configuração da validação do formulário
    $("#form_test_invoice").validate({
        errorClass: "invalid-feedback",
        errorElement: "span",
        rules: {
            asaas_customer_id: { required: true },
            value: { required: true, moneyValidation: true },
            description: { required: true }
        },
        messages: {
            asaas_customer_id: { required: "Selecione o cliente faturável" },
            value: { required: "O valor é obrigatório" },
            description: { required: "A descrição é obrigatória" }
        },
        errorPlacement: function (error, element) {
            if (element.hasClass('select2-hidden-accessible')) {
                error.insertAfter(element.next('.select2-container'));
            } else if (element.parent('.input-group').length) {
                error.insertAfter(element.parent('.input-group'));
            } else {
                error.insertAfter(element);
            }
        },
        highlight: function (element, errorClass, validClass) {
            $(element).addClass('is-invalid');
            if ($(element).hasClass('select2-hidden-accessible')) {
                $(element).next('.select2-container').find('.select2-selection').addClass('is-invalid');
            }
        },
        unhighlight: function (element, errorClass, validClass) {
            $(element).removeClass('is-invalid');
            if ($(element).hasClass('select2-hidden-accessible')) {
                $(element).next('.select2-container').find('.select2-selection').removeClass('is-invalid');
            }
        },
        submitHandler: function(form) {
            var formData = $(form).serialize();
            var $form = $(form);

            $.ajax({
                url: "{{ route('finance.settings.invoice.test.store') }}",
                method: "POST",
                data: formData,
                beforeSend: function(){
                    $('#btn_add').prop('disabled', true).html('<i class="animate-spin" data-lucide="loader-2"></i> Enviando...');
                    lucide.createIcons();
                },
                success: function(response){
                    Swal.fire({
                        icon: 'success',
                        title: 'Sucesso!',
                        text: response.message,
                        timer: 1500,
                        showConfirmButton: false
                    }).then(() => {
                        $('#invoice-test-table').DataTable().ajax.reload();
                        $form[0].reset();
                        $('#asaas_customer_id').val(null).trigger('change');
                        $('#value').maskMoney('mask', 10.00);
                    });
                },
                error: function(xhr){
                    if (xhr.status === 422) {
                        var errors = xhr.responseJSON.errors;
                        $.each(errors, function(key, value) {
                            var input = $form.find('[name="' + key + '"]');
                            input.addClass('is-invalid');
                            // Se já existe invalid-feedback, remove antes de adicionar novo
                            var errorContainer;
                            if (input.parent('.input-group').length) {
                                errorContainer = input.parent('.input-group').next('.invalid-feedback');
                                if (errorContainer.length === 0) {
                                     input.parent('.input-group').after('<div class="invalid-feedback" style="display:block">' + value[0] + '</div>');
                                } else {
                                     errorContainer.text(value[0]).show();
                                }
                            } else {
                                errorContainer = input.next('.invalid-feedback');
                                if (errorContainer.length === 0) {
                                    input.after('<div class="invalid-feedback" style="display:block">' + value[0] + '</div>');
                                } else {
                                    errorContainer.text(value[0]).show();
                                }
                            }
                        });
                        Swal.fire({
                            icon: 'warning',
                            title: 'Atenção',
                            text: 'Verifique os campos obrigatórios.',
                        });
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro',
                            text: 'Erro ao salvar: ' + (xhr.responseJSON ? xhr.responseJSON.message : xhr.statusText),
                        });
                    }
                },
                complete: function() {
                    $('#btn_add').prop('disabled', false).text('Testar Emissão NFS-e');
                }
            });
        }
    });
});
</script>
@endpush