@extends('template_pages.session')

@section('page_title', 'Editar Cliente Faturável #' . request()->route('id'))
@section('page_icon', 'hand-coins')
@section('navbar', 'finance.navbar')

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

@section('content_page')
<div class="card-body">
    <form id="editBillableClientForm" method="POST">
        {{ csrf_field() }}

        <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>

        <div class="row mt-3">
            <div class="col-lg mb-3">
                <label class="form-label">Razão Social / Nome *</label>
                <input class="form-control" placeholder="Razão Social" type="text" name="company_name" id="company_name" value="{{ $client->legal_name }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Tipo de documento *</label>
                <select name="document_type" class="form-control form-select select2" id="document_type" required>
                    <option value="cnpj" {{ $client->document_type == 'cnpj' ? 'selected' : '' }}>CNPJ</option>
                    <option value="cpf" {{ $client->document_type == 'cpf' ? 'selected' : '' }}>CPF</option>
                </select>
            </div>
            <div class="col-lg-2 mb-3">
                <label id="label_cpf_cnpj" class="form-label">{{ $client->document_type == 'cpf' ? 'CPF' : 'CNPJ' }} *</label>
                <input class="form-control" placeholder="{{ $client->document_type == 'cpf' ? 'CPF' : 'CNPJ' }}" type="text" name="cpf_cnpj" id="cpf_cnpj" value="{{ $client->document_type == 'cpf' ? \App\Helpers\FormatHelper::formatCpf($client->document_number) : \App\Helpers\FormatHelper::formatCnpj($client->document_number) }}" required/>
            </div>
            <div class="col-lg mb-3">
                <div class="form-group">
                    <label class="form-label">Cliente Institucional *</label>
                    <select class="form-control select2-show-search form-select" id="tipo_cliente" data-placeholder="Selecionar Cliente" name="id_institucional_client" required>
                        <option value="">Selecionar Cliente</option>
                        @foreach($institutionalClients as $instClient)
                            <option value="{{ $instClient->id }}" {{ $client->core_client_id == $instClient->id ? 'selected' : '' }}>
                                {{ $instClient->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <label class="form-label">Observação *</label>
                <textarea class="form-control" placeholder="Observação" rows="3" name="observation" required>{{ $client->observation }}</textarea>
            </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">Configurações de Cobrança</h4>
        </div>

        <div class="row mt-3">
            <div class="col-lg-3 select_preferential">
                <label class="form-label">Vencimento Preferencial</label>
                <div class="input-group">
                    <div class="input-group-text">
                        <i class="ti ti-calendar tx-16 lh-0 op-6"></i>
                    </div>
                    <select name="preferential_due_date" id="preferential_due_date" class="form-control form-select" data-bs-placeholder="Dia">
                        <option label="Dia"></option>
                        @for ($i = 1; $i <= 31; $i++)
                            <option value="{{ sprintf('%02d', $i) }}" {{ $client->preferential_due_date == sprintf('%02d', $i) ? 'selected' : '' }}>
                                {{ sprintf('%02d', $i) }}
                            </option>
                        @endfor
                    </select>
                </div>
            </div>
            <div class="col-lg-2">
                <label class="form-label">Vencimento apenas em dias úteis</label>
                <div class="col-12 box_boleto_pdf">
                    <div class="form-check form-switch fs-xxl">
                        <input type="checkbox" class="form-check-input" id="dueWeekdaysOnlySwitch" name="due_weekdays_only" {{ $client->due_on_working_days_only ? 'checked' : '' }}>
                    </div>
                </div>
            </div>
            <div class="col-lg-2">
                <label class="form-label">Habilitar Boleto em Anexo</label>
                <div class="col-12 box_boleto_pdf">
                    <div class="form-check form-switch fs-xxl">
                        <input type="checkbox" class="form-check-input" id="customSwitch" name="attached_bill" {{ $client->attached_bill ? 'checked' : '' }}>
                    </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="book-user" class="fs-4"></i>
            <h4 class="mb-0">Informações de Contato</h4>
        </div>

        @php
            $primaryContact = $client->contacts->where('is_primary', 1)->first();
            $additionalContacts = $client->contacts->where('is_primary', 0);
        @endphp

        <div class="row mt-3">
            <!-- Campo hidden para ID do contato principal -->
            <input type="hidden" name="contact_id" value="{{ $primaryContact->id ?? '' }}">
            <div class="col-md-4">
                <label class="form-label">Nome para contato *</label>
                <input type="text" class="form-control" name="contact_name" placeholder="Nome" value="{{ $primaryContact->name ?? '' }}" required>
            </div>
            <div class="col-md-4">
                <label class="form-label">E-mail Principal *</label>
                <input type="email" class="form-control" name="contact_mail" placeholder="E-mail" value="{{ $primaryContact->email ?? '' }}" required>
            </div>
            <div class="col-md-4">
                <label class="form-label">Telefone Principal</label>
                <input type="text" class="form-control phone_input" name="contact_phone" placeholder="(11) 91234-5678" value="{{ $primaryContact ? \App\Helpers\FormatHelper::formatPhone($primaryContact->phone) : '' }}">
            </div>
        </div>
        <div class="col-lg-12 custom-fields-container mt-2">
            <span class="btn btn-soft-secondary btn-sm add-custom-field gap-1">
                <i data-lucide="plus"></i> Adicionar contato
            </span>
            <div class="custom_fields_add {{ $additionalContacts->count() > 0 ? 'mt-2' : '' }}">
                @foreach($additionalContacts as $index => $contact)
                    <div class="custom_contact mb-2" id="custom_contact_{{ $index + 1 }}">
                        <div class="row cf-group add_contacts" id="custom-field-{{ $index + 1 }}">
                            <!-- Campo hidden para ID do contato adicional -->
                            <input type="hidden" name="contact_id_{{ $index + 1 }}" value="{{ $contact->id }}">
                            <div class="col-lg-4">
                                <input class="form-control contact_name" placeholder="Nome para contato" type="text" name="contact_name_{{ $index + 1 }}" value="{{ $contact->name }}">
                            </div>
                            <div class="col-lg-4">
                                <input class="form-control contact_email" placeholder="E-mail" type="email" name="contact_email_{{ $index + 1 }}" value="{{ $contact->email }}">
                            </div>
                            <div class="col-lg-4">
                                <div class="row m-0 space-between">
                                    <div class="col p-0">
                                        <input class="form-control phone_input contact_phone" placeholder="Telefone" type="text" name="contact_phone_{{ $index + 1 }}" value="{{ \App\Helpers\FormatHelper::formatPhone($contact->phone) }}">
                                    </div>
                                    <div class="col-auto p-0 ms-2">
                                        <span class="btn btn-danger remove-contact btn-icon"><i class="ti ti-minus"></i></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>

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

        <div class="d-flex align-items-center gap-1">
            <i data-lucide="map-pinned" class="fs-4"></i>
            <h4 class="mb-0">Endereço</h4>
        </div>

        <div class="row mt-3">
            <div class="col-lg-2 mb-3">
                <label class="form-label">CEP *</label>
                <div class="input-group">
                    <input type="text" class="form-control cep" name="zipcode" id="zipcode" placeholder="12345-678" value="{{ \App\Helpers\FormatHelper::formatCep($client->zipcode) }}">
                    <button class="btn btn-dark btn-icon rounded-end" type="button" id="search_zip_code"><i data-lucide="search"></i></button>
                    <div class="invalid-feedback">Por favor, insira um CEP válido.</div>
                </div>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Tipo Logradouro *</label>
                <input class="form-control" placeholder="Tipo Logradouro" type="text" name="street_type" id="street_type" value="{{ $client->street_type }}" required/>
            </div>
            <div class="col-lg-4 mb-3">
                <label class="form-label">Endereço *</label>
                <input class="form-control" placeholder="Endereço" type="text" name="street" id="street" value="{{ $client->street_name }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Número *</label>
                <input class="form-control" placeholder="Número" type="text" name="number" id="number" value="{{ $client->number }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Complemento</label>
                <input class="form-control" placeholder="Complemento" type="text" name="complement" id="complement" value="{{ $client->complement }}"/>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-2 mb-3">
                <label class="form-label">Bairro *</label>
                <input class="form-control" placeholder="Bairro" type="text" name="neighborhood" id="neighborhood" value="{{ $client->neighborhood }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Cidade *</label>
                <input class="form-control" placeholder="Cidade" type="text" name="city" id="city" value="{{ $client->city }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">Estado *</label>
                <input class="form-control" placeholder="Estado" type="text" name="state" id="state" value="{{ $client->state }}" required/>
            </div>
            <div class="col-lg-2 mb-3">
                <label class="form-label">País *</label>
                <input class="form-control" placeholder="País" type="text" name="country" id="country" value="{{ $client->country }}" required/>
            </div>
        </div>

        <!-- Botão -->
        <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_update">Salvar</button>
            </div>
            <div class="col-12 col-lg btn-list text-lg-end text-left mt-lg-0 mt-2">
                <a id="toggleStatus" class="btn {{ $client->status ? 'btn-danger' : 'btn-success' }}" href="javascript: void(0);">
                    {{ $client->status ? 'Desativar' : 'Ativar' }}
                </a>
            </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>
<!-- SweetAlert2 -->
<script src="{{ asset('assets/inspinia/plugins/sweetalert2/sweetalert2.min.js') }}"></script>
<!-- Validação Formulário -->
<script src="{{ asset('assets/inspinia/js/form-validation.js') }}"></script>

<script>
$(document).ready(function() {

    $('#cpf_cnpj').mask('00.000.000/0000-00');

    $('#document_type').on('change', function() {
        var tipoDoc = $(this).val();

        $('#cpf_cnpj').val('');

        if (tipoDoc === 'cnpj') {
            $('#label_cpf_cnpj').html('CNPJ <span class="text-red">*</span>');
            $('#cpf_cnpj').attr('placeholder', 'CNPJ');
            $('#cpf_cnpj').mask('00.000.000/0000-00');
        } else if (tipoDoc === 'cpf') {
            $('#label_cpf_cnpj').html('CPF <span class="text-red">*</span>');
            $('#cpf_cnpj').attr('placeholder', 'CPF');
            $('#cpf_cnpj').mask('000.000.000-00');
        }
    });

    // Aplicar máscara inicial baseada no tipo de documento atual
    var currentDocType = $('#document_type').val();
    if (currentDocType === 'cnpj') {
        $('#cpf_cnpj').mask('00.000.000/0000-00');
    } else if (currentDocType === 'cpf') {
        $('#cpf_cnpj').mask('000.000.000-00');
    }

    function reindexContacts(container) {
        $(container).find('.custom_contact').each(function(index) {
            var i = index + 1; // índice começa em 1
            $(this).attr('id', 'custom_contact_' + i);
            $(this).find('.add_contacts').attr('id', 'custom-field-' + i);
            $(this).find('input[name^="contact_id_"]').attr('name', 'contact_id_' + i);
            $(this).find('.contact_name').attr('name', 'contact_name_' + i);
            $(this).find('.contact_email').attr('name', 'contact_email_' + i);
            $(this).find('.contact_phone').attr('name', 'contact_phone_' + i);
        });
    }

    // Adicionar contato
    $('.custom-fields-container').on('click', '.add-custom-field', function() {
        var targetContainer = $('.custom_fields_add');
        var customFieldIndex = $(targetContainer).find('.custom_contact').length + 1;

        $('.custom_fields_add').addClass('mt-2');

        var fieldGroup = `
            <div class="custom_contact mb-2" id="custom_contact_${customFieldIndex}">
                <div class="row cf-group add_contacts" id="custom-field-${customFieldIndex}">
                    <!-- Campo hidden vazio para novos contatos (será criado novo) -->
                    <input type="hidden" name="contact_id_${customFieldIndex}" value="">
                    <div class="col-lg-4">
                        <input class="form-control contact_name" placeholder="Nome para contato" type="text" name="contact_name_${customFieldIndex}">
                    </div>
                    <div class="col-lg-4">
                        <input class="form-control contact_email" placeholder="E-mail" type="email" name="contact_email_${customFieldIndex}">
                    </div>
                    <div class="col-lg-4">
                        <div class="row m-0 space-between">
                            <div class="col p-0">
                                <input class="form-control phone_input contact_phone" placeholder="Telefone" type="text" name="contact_phone_${customFieldIndex}">
                            </div>
                            <div class="col-auto p-0 ms-2">
                                <span class="btn btn-danger remove-contact btn-icon"><i class="ti ti-minus"></i></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>`;

        $(targetContainer).append(fieldGroup);
        addPhoneMask();
    });

    // Remover contato e reindexar
    $('.custom-fields-container').on('click', '.remove-contact', function() {
        var container = $('.custom_fields_add');
        $(this).closest('.custom_contact').remove();
        reindexContacts(container);
    });

    $('.select2').select2();

    $('#document_type').select2({
        placeholder: "Selecione o tipo de documento"
    });

    $('#tipo_cliente').select2({
        placeholder: "Selecione o cliente institucional"
    });

    // Métodos de validação customizados
    $.validator.addMethod("phoneValidation", function(value, element) {
        return this.optional(element) || /^\(\d{2}\)\s\d{4,5}-\d{4}$/.test(value);
    }, "Por favor, insira um telefone válido no formato (11) 91234-5678");

    $.validator.addMethod("cpfValidation", function(value, element) {
        return this.optional(element) || /^\d{3}\.\d{3}\.\d{3}-\d{2}$/.test(value);
    }, "Por favor, insira um CPF válido no formato 000.000.000-00");

    $.validator.addMethod("cnpjValidation", function(value, element) {
        return this.optional(element) || /^\d{2}\.\d{3}\.\d{3}\/\d{4}-\d{2}$/.test(value);
    }, "Por favor, insira um CNPJ válido no formato 00.000.000/0000-00");

    $('#btn_update').on('click', function(e) {
        // Configuração da validação do formulário
        $("#editBillableClientForm").validate({
            errorClass: "invalid-feedback",
            errorElement: "span",
            rules: {
                company_name: {
                    required: true,
                    minlength: 2,
                    maxlength: 255
                },
                document_type: {
                    required: true
                },
                cpf_cnpj: {
                    required: true
                },
                id_institucional_client: {
                    required: true
                },
                observation: {
                    required: true
                },
                contact_name: {
                    required: true,
                    minlength: 2,
                    maxlength: 255
                },
                contact_mail: {
                    required: true,
                    email: true,
                    maxlength: 255
                },
                contact_phone: {
                    phoneValidation: true
                },
                zipcode: {
                    required: true
                },
                street_type: {
                    required: true
                },
                street: {
                    required: true,
                    maxlength: 255
                },
                number: {
                    required: true,
                    maxlength: 20
                },
                neighborhood: {
                    required: true,
                    maxlength: 100
                },
                city: {
                    required: true,
                    maxlength: 100
                },
                state: {
                    required: true,
                    maxlength: 100
                },
                country: {
                    required: true,
                    maxlength: 100
                }
            },
            messages: {
                company_name: {
                    required: "A razão social é obrigatória",
                    minlength: "A razão social deve ter pelo menos 2 caracteres",
                    maxlength: "A razão social não pode ter mais de 255 caracteres"
                },
                document_type: {
                    required: "Selecione o tipo de documento"
                },
                cpf_cnpj: {
                    required: "O CPF/CNPJ é obrigatório"
                },
                id_institucional_client: {
                    required: "Selecione o cliente institucional"
                },
                observation: {
                    required: "A observação é obrigatória"
                },
                contact_name: {
                    required: "O nome do contato é obrigatório",
                    minlength: "O nome deve ter pelo menos 2 caracteres",
                    maxlength: "O nome não pode ter mais de 255 caracteres"
                },
                contact_mail: {
                    required: "O e-mail é obrigatório",
                    email: "Por favor, insira um e-mail válido",
                    maxlength: "O e-mail não pode ter mais de 255 caracteres"
                },
                zipcode: {
                    required: "O CEP é obrigatório"
                },
                street_type: {
                    required: "O tipo de logradouro é obrigatório"
                },
                street: {
                    required: "O endereço é obrigatório",
                    maxlength: "O endereço não pode ter mais de 255 caracteres"
                },
                number: {
                    required: "O número é obrigatório",
                    maxlength: "O número não pode ter mais de 20 caracteres"
                },
                neighborhood: {
                    required: "O bairro é obrigatório",
                    maxlength: "O bairro não pode ter mais de 100 caracteres"
                },
                city: {
                    required: "A cidade é obrigatória",
                    maxlength: "A cidade não pode ter mais de 100 caracteres"
                },
                state: {
                    required: "O estado é obrigatório",
                    maxlength: "O estado não pode ter mais de 100 caracteres"
                },
                country: {
                    required: "O país é obrigatório",
                    maxlength: "O país não pode ter mais de 100 caracteres"
                }
            },
            highlight: function(element){
                // Para campos normais
                $(element).addClass('is-invalid');
                
                // Tratamento especial para Select2
                if ($(element).hasClass('select2-hidden-accessible')) {
                    $(element).next('.select2-container').find('.select2-selection').addClass('is-invalid');
                }
            },
            unhighlight: function(element){
                // Para campos normais
                $(element).removeClass('is-invalid');
                
                // Tratamento especial para Select2
                if ($(element).hasClass('select2-hidden-accessible')) {
                    $(element).next('.select2-container').find('.select2-selection').removeClass('is-invalid');
                }
            },
            errorPlacement: function(error, element) {
                // Para Select2, colocar o erro após o container do Select2
                if (element.hasClass('select2-hidden-accessible')) {
                    error.insertAfter(element.next('.select2-container'));
                } else {
                    error.insertAfter(element);
                }
            },
            submitHandler: function(form) {
                // Validar contatos adicionais dinamicamente
                var isValid = true;
                var errorMessages = [];

                $('.custom_contact').each(function(index) {
                    var contactName = $(this).find('.contact_name').val();
                    var contactEmail = $(this).find('.contact_email').val();
                    var contactPhone = $(this).find('.contact_phone').val();

                    // Se algum campo do contato foi preenchido, validar todos
                    if (contactName || contactEmail || contactPhone) {
                        if (!contactName) {
                            errorMessages.push(`Nome do contato ${index + 2} é obrigatório`);
                            isValid = false;
                        }

                        if (!contactEmail) {
                            errorMessages.push(`E-mail do contato ${index + 2} é obrigatório`);
                            isValid = false;
                        } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(contactEmail)) {
                            errorMessages.push(`E-mail do contato ${index + 2} é inválido`);
                            isValid = false;
                        }

                        if (contactPhone && !/^\(\d{2}\)\s\d{4,5}-\d{4}$/.test(contactPhone)) {
                            errorMessages.push(`Telefone do contato ${index + 2} é inválido`);
                            isValid = false;
                        }
                    }
                });

                if (!isValid) {
                    Swal.fire({
                        title: 'Erro de Validação!',
                        html: errorMessages.join('<br>'),
                        icon: 'error',
                        confirmButtonText: 'OK'
                    });
                    return false;
                }

                // Se chegou até aqui, o formulário é válido - enviar via AJAX
                submitFormAjax(form);
            }
        });
        $(".custom_contact").each(function(){
            $(this).find('.contact_name').rules("add", { 
                required:true,
                messages:{required:"Por favor, insira um nome"}
            });

            $(this).find('.contact_email').rules("add", { 
                required:true,
                email:true,
                messages:{required:"Por favor, insira um e-mail", email:"Por favor, insira um e-mail válido"}
            });
        });
    });

    // Adicionar funcionalidade de busca de CEP
    $('#search_zip_code').click(function() {
        var zipcode = $('#zipcode').val().replace(/\D/g, '');
        
        if (zipcode.length === 8) {
            var ws = '{{ route('zipcode_search.get', ':zipcode') }}';
            ws = ws.replace(':zipcode', zipcode);

            // Mostrar loading no botão
            $(this).prop('disabled', true);
            $(this).find('i').attr('data-lucide', 'loader-2').addClass('animate-spin');
            lucide.createIcons();

            $.get(ws, function(data) {
                if (data.resultado === "0") {
                    Swal.fire({
                        icon: 'warning',
                        title: 'CEP não encontrado',
                        text: 'O CEP informado não foi encontrado. Verifique e tente novamente.',
                        confirmButtonText: 'OK'
                    });
                } else {
                    // Preencher os campos com os dados retornados
                    $('#street_type').val(data.tipo_logradouro);
                    $('#street').val(data.logradouro);
                    $('#neighborhood').val(data.bairro);
                    $('#city').val(data.cidade);
                    $('#state').val(data.uf);
                    $('#country').val('Brasil');
                    
                    // Mostrar mensagem de sucesso
                    Swal.fire({
                        icon: 'success',
                        title: 'CEP encontrado!',
                        text: 'Endereço preenchido automaticamente.',
                        timer: 2000,
                        showConfirmButton: false
                    });
                }
            }).fail(function() {
                Swal.fire({
                    icon: 'error',
                    title: 'Erro na consulta',
                    text: 'Erro ao consultar CEP. Tente novamente.',
                    confirmButtonText: 'OK'
                });
            }).always(function() {
                // Restaurar botão
                $('#search_zip_code').prop('disabled', false);
                $('#search_zip_code').find('i').attr('data-lucide', 'search').removeClass('animate-spin');
                lucide.createIcons();
            });
        } else {
            Swal.fire({
                icon: 'warning',
                title: 'CEP inválido',
                text: 'Por favor, informe um CEP válido com 8 dígitos.',
                confirmButtonText: 'OK'
            });
        }
    });
});

function submitFormAjax(form) {
    var $form = $(form);
    var submitBtn = $form.find('button[type="submit"]');
    var btnText = submitBtn.find('.btn-text');
    var btnLoading = submitBtn.find('.btn-loading');
    
    // Desabilitar botão e mostrar loading
    submitBtn.prop('disabled', true);
    btnText.addClass('d-none');
    btnLoading.removeClass('d-none');
    
    // Preparar dados do formulário
    var formData = new FormData(form);

    var isAttachedBillChecked = $('#customSwitch').is(':checked');
    formData.append('attached_bill', isAttachedBillChecked ? 1 : 0);

    var isDueWeekdaysOnlySwitchChecked = $('#dueWeekdaysOnlySwitch').is(':checked');
    formData.append('due_weekdays_only', isDueWeekdaysOnlySwitchChecked ? 1 : 0);
    
    $.ajax({
        url: '{{ route("finance.billing.client.update", ["id" => $client->id]) }}',
        type: 'POST',
        data: formData,
        processData: false,
        contentType: false,
        success: function(response) {
            if (response.success) {
                Swal.fire({
                    title: 'Sucesso!',
                    text: response.message,
                    icon: 'success',
                    confirmButtonText: 'OK'
                }).then((result) => {
                    if (result.isConfirmed) {
                        window.location.href = response.redirect;
                    }
                });
            } else {
                Swal.fire({
                    title: 'Erro!',
                    text: response.message,
                    icon: 'error',
                    confirmButtonText: 'OK'
                });
            }
        },
        error: function(xhr) {
            var errorMessage = 'Erro interno do servidor';
            
            if (xhr.status === 422) {
                // Erro de validação do servidor
                var errors = xhr.responseJSON.errors;
                var errorList = '';
                
                $.each(errors, function(field, messages) {
                    $.each(messages, function(index, message) {
                        errorList += '• ' + message + '<br>';
                    });
                });
                
                errorMessage = errorList;
            } else if (xhr.responseJSON && xhr.responseJSON.message) {
                errorMessage = xhr.responseJSON.message;
            }
            
            Swal.fire({
                title: 'Erro!',
                html: errorMessage,
                icon: 'error',
                confirmButtonText: 'OK'
            });
        },
        complete: function() {
            // Reabilitar botão e esconder loading
            submitBtn.prop('disabled', false);
            btnText.removeClass('d-none');
            btnLoading.addClass('d-none');
        }
    });
}
$("#toggleStatus").click(function() {
    const button = $(this);
    const clientId = {{ $client->id }};
    const isActive = button.hasClass('btn-danger'); // Se tem classe danger, está ativo
    
    const title = isActive ? "Desativar Cliente Faturável?" : "Ativar Cliente Faturável?";
    const text = isActive ? "Tem certeza que deseja desativar este cliente faturável?" : "Tem certeza que deseja ativar este cliente faturável?";
    
    showAlert("confirm", {
        title: title,
        text: text
    }, {
        onConfirm: () => {
            // Fazer requisição AJAX
            $.ajax({
                url: `{{ route('finance.billing.client.toggle.status', ['id' => $client->id]) }}`,
                type: 'POST',
                data: {
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    if (response.success) {
                        // Atualizar o botão
                        if (response.status) {
                            // Cliente ativado - botão deve ser "Desativar" (vermelho)
                            button.removeClass('btn-success').addClass('btn-danger');
                            button.text('Desativar');
                            // Atualizar o badge de status
                            $('#status-display').html('<span class="badge text-bg-success fs-xxs">Ativo</span>');
                        } else {
                            // Cliente desativado - botão deve ser "Ativar" (verde)
                            button.removeClass('btn-danger').addClass('btn-success');
                            button.text('Ativar');
                            // Atualizar o badge de status
                            $('#status-display').html('<span class="badge text-bg-danger fs-xxs">Desativado</span>');
                        }
                        
                        showAlert("successToast", { text: response.message });
                    } else {
                        showAlert("errorToast", { text: response.message });
                    }
                },
                error: function(xhr) {
                    let errorMessage = 'Erro interno do servidor';
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMessage = xhr.responseJSON.message;
                    }
                    showAlert("errorToast", { text: errorMessage });
                }
            });
        },
        onCancel: () => {
            showAlert("canceledToast", { text: "Ação cancelada!" });
        }
    });
});
</script>
@endpush