$(document).ready(function() {

    // ==========================================
    // 1. CONNECTION DETAILS LOGIC
    // ==========================================
    $('#connectionModeSelect').on('change', function() {
        if ($(this).val() === 'VPN Tunnel') {$('#vpnFormContainer').slideDown();
        } else {
            $('#vpnFormContainer').slideUp();
            $('#vpnFileInput').val('');
        }
    });

    $('#addConnectionForm').on('submit', function(e) {
        e.preventDefault();
        
        let $form =$(this);
        let $submitBtn =$('#btnSubmitConnection');
        let originalText = $submitBtn.html();
        let $alertBox =$('#connectionModalAlert');
        let formData = new FormData(this);

        $submitBtn.html('<span class="spinner-border spinner-border-sm me-2"></span>Saving...').prop('disabled', true);
        $alertBox.html(''); 
        $form.find('.is-invalid').removeClass('is-invalid');$form.find('.invalid-feedback').remove();

        $.ajax({
            url: $form.attr('action'),
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function(response) {
                if (response.success) {
                    $('#addConnectionModal').modal('hide');
                    Swal.fire({
                        icon: 'success',
                        title: 'Success!',
                        text: response.message,
                        confirmButtonColor: '#5c4df0'
                    }).then(() => location.reload());
                }
            },
            error: function(xhr) {
                if (xhr.status === 422) {
                    let errors = xhr.responseJSON.errors;
                    $alertBox.html(`
                        <div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
                            <i class="bi bi-exclamation-triangle-fill me-2"></i>
                            <div>Please check the highlighted fields below.</div>
                        </div>
                    `);
                    $.each(errors, function(key, value) {
                        let $input =$form.find('[name="' + key + '"]');
                        if ($input.length) {
                            $input.addClass('is-invalid');$input.parent().append('<div class="invalid-feedback d-block fw-medium small">' + value[0] + '</div>');
                        }
                    });
                } else {
                    $alertBox.html(`
                        <div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
                            <i class="bi bi-x-circle-fill me-2"></i>
                            <div>An error occurred. Please try again.</div>
                        </div>
                    `);
                }
            },
            complete: function() {
                $submitBtn.html(originalText).prop('disabled', false);
            }
        });
    });

    $('#addConnectionModal').on('hidden.bs.modal', function () {
        $('#addConnectionForm')[0].reset();
        $('#vpnFormContainer').hide();
        $('#connectionModalAlert').html('');
        $('#addConnectionForm').find('.is-invalid').removeClass('is-invalid');
        $('#addConnectionForm').find('.invalid-feedback').remove();
    });

    // ==========================================
    // 2. MULTIPLE DOCUMENT UPLOAD LOGIC
    // ==========================================
    $('#addDocRowBtn').on('click', function() {
        let newRow = `
            <div class="row g-2 mb-3 document-row">
                <div class="col-md-5">
                    <input type="text" name="document_names[]" class="form-control" placeholder="e.g. Rate Card" required>
                </div>
                <div class="col-md-6">
                    <input type="file" name="documents[]" class="form-control" required>
                </div>
                <div class="col-md-1">
                    <button type="button" class="btn btn-outline-danger w-100 remove-doc-row">
                        <i class="bi bi-trash"></i>
                    </button>
                </div>
            </div>
        `;
        $('#documentRowsContainer').append(newRow);
        updateRemoveButtons();
    });

    $(document).on('click', '.remove-doc-row', function() {$(this).closest('.document-row').remove();
        updateRemoveButtons();
    });

    function updateRemoveButtons() {
        if ($('.document-row').length > 1) {$('.remove-doc-row').prop('disabled', false);
        } else {
            $('.remove-doc-row').prop('disabled', true);
        }
    }

    $('#addDocumentForm').on('submit', function(e) {
        e.preventDefault();
        
        let $form =$(this);
        let $submitBtn =$('#btnSubmitDocuments');
        let originalText = $submitBtn.html();
        let $alertBox =$('#documentModalAlert');
        let formData = new FormData(this);

        $submitBtn.html('<span class="spinner-border spinner-border-sm me-2"></span>Uploading...').prop('disabled', true);
        $alertBox.html('');$form.find('.is-invalid').removeClass('is-invalid');

        $.ajax({
            url: $form.attr('action'),
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function(response) {
                if (response.success) {
                    $('#addDocumentModal').modal('hide');
                    Swal.fire({
                        icon: 'success',
                        title: 'Uploaded!',
                        text: response.message,
                        confirmButtonColor: '#5c4df0'
                    }).then(() => location.reload());
                }
            },
            error: function(xhr) {
                $alertBox.html(`
                    <div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
                        <i class="bi bi-exclamation-triangle-fill me-2"></i>
                        <div>Validation failed. Ensure all files are valid formats and under 10MB.</div>
                    </div>
                `);
            },
            complete: function() {
                $submitBtn.html(originalText).prop('disabled', false);
            }
        });
    });

    $('#addDocumentModal').on('hidden.bs.modal', function () {
        $('#addDocumentForm')[0].reset();
        $('#documentModalAlert').html('');
        $('.document-row:not(:first)').remove();
        updateRemoveButtons();
    });

    // ==========================================
    // 3. EDIT MNO PARTNER LOGIC
    // ==========================================
    $('.btn-edit-operator').on('click', function() {
        // Fetch data via the existing getJson endpoint
        $.ajax({
            url: `${baseUrl}/mnos/json/${operatorId}`, // Adjust URL if your route is named differently
            type: 'GET',
            success: function(data) {
                $('#edit_mno_id').val(data.id);
                $('#edit_name').val(data.name);
                $('#edit_country').val(data.country);
                $('#edit_connection_status').val(data.connection_status);
                $('#edit_connection_type').val(data.connection_type);
                
                $('#edit_mno_account_manager').val(data.mno_account_manager);
                $('#edit_technical_support_person').val(data.technical_support_person);
                $('#edit_contact_person').val(data.contact_person);
                $('#edit_contact_person_phone').val(data.contact_person_phone);
                $('#edit_contact_person_email').val(data.contact_person_email);
                $('#edit_support_skype').val(data.support_skype);
                
                $('#edit_buying_rate').val(data.buying_rate);
                $('#edit_rate_type').val(data.rate_type);
                $('#edit_payment_terms').val(data.payment_terms);

                // Reset tabs to Basic Info
                $('#editOperatorModal .nav-link').removeClass('active');
                $('#editOperatorModal .tab-pane').removeClass('show active');
                $('#editOperatorModal .nav-link').first().addClass('active');
                $('#edit-tab-basic').addClass('show active');
                
                $('#edit_contract_type').val(data.contract_type);
                $('#edit_contract_validity').val(data.contract_validity);
                
                // Handle Boolean for Auto Renew
                let isAutoRenew = data.contract_auto_renew === false || data.contract_auto_renew === 0 ? '0' : '1';
                $('#edit_contract_auto_renew').val(isAutoRenew).trigger('change');
                
                // Format date to YYYY-MM-DD for the HTML date input if it exists
                if (data.next_renewal_date) {
                    let formattedDate = data.next_renewal_date.split('T')[0];
                    $('#edit_next_renewal_date').val(formattedDate);
                } else {
                    $('#edit_next_renewal_date').val('');
                }

                // Reset tabs to Basic Info
                $('#editOperatorModal .nav-link').removeClass('active');
                $('#editOperatorModal .tab-pane').removeClass('show active');
                $('#editOperatorModal .nav-link').first().addClass('active');
                $('#edit-tab-basic').addClass('show active');

                $('#editOperatorModal').modal('show');
            }
        });
    });
    // Toggle the Renewal Date field based on Auto Renew selection
    $('#edit_contract_auto_renew').on('change', function() {
        if ($(this).val() === '0') {$('#renewal_date_container').slideDown();
            $('#edit_next_renewal_date').prop('required', true);
        } else {
            $('#renewal_date_container').slideUp();
            $('#edit_next_renewal_date').prop('required', false).val('');
        }
    });
    $('#editOperatorForm').on('submit', function(e) {
        e.preventDefault();
        let $form =$(this);
        let $btn =$('#btnUpdateOperator');
        let originalText = $btn.html();

        $btn.html('<span class="spinner-border spinner-border-sm me-2"></span>Updating...').prop('disabled', true);
        $form.find('.is-invalid').removeClass('is-invalid');$form.find('.invalid-feedback').remove();

        $.ajax({
            url: `${baseUrl}/mnos/${operatorId}`, // PUT endpoint
            type: 'POST', // Laravel uses POST + @method('PUT') for forms
            data: $form.serialize(),
            success: function(response) {
                $('#editOperatorModal').modal('hide');
                Swal.fire({
                    icon: 'success',
                    title: 'Updated!',
                    text: response.message,
                    timer: 1500,
                    showConfirmButton: false
                }).then(() => location.reload());
            },
            error: function(xhr) {
                if (xhr.status === 422) {
                    $.each(xhr.responseJSON.errors, function(key, value) {
                        let $input =$form.find('[name="' + key + '"]');
                        $input.addClass('is-invalid');$input.parent().append('<div class="invalid-feedback d-block fw-medium">' + value[0] + '</div>');
                    });
                    
                    // Auto-switch to the tab with the error
                    let $firstError =$form.find('.is-invalid').first();
                    if ($firstError.length) {
                        let tabId = $firstError.closest('.tab-pane').attr('id');$form.find('[data-bs-target="#' + tabId + '"]').tab('show');
                    }
                }
            },
            complete: function() {
                $btn.html(originalText).prop('disabled', false);
            }
        });
    });
});