lpj/resources/views/surveyor/js/utils.blade.php

<script>
    function showLoadingSwal(message) {
        Swal.fire({
            title: message,
            allowOutsideClick: false,
            didOpen: () => {
                Swal.showLoading();
            }
        });
    }

    function hideLoadingSwal() {
        Swal.close();
    }

    function previewImage(input, imageId) {
        const preview = document.getElementById(imageId);
        if (input.files && input.files[0]) {
            const reader = new FileReader();
            reader.onload = function(e) {
                preview.src = e.target.result;
                preview.classList.remove('hidden');
            }
            reader.readAsDataURL(input.files[0]);
        }
    }



    function formatNumber(input) {
        let value = input.value.replace(/[^\d.]/g, '');
        input.value = value;
    }


    function formatCurrency(value) {
        if (!value) return '';

        // Jika input adalah elemen, ambil nilainya
        const numericValue = typeof value === 'string' ? value : value.value;

        // Hapus semua karakter non-digit
        const cleanValue = numericValue.toString().replace(/[^\d]/g, '');

        // Format ke currency
        const formattedValue = new Intl.NumberFormat('id-ID').format(cleanValue);

        // Jika input adalah elemen, update nilainya
        if (typeof value !== 'string') {
            value.value = formattedValue;
        }

        return formattedValue;
    }

    function previewImage(input, previewId) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(e) {
                $('#' + previewId).attr('src', e.target.result).show();
            }
            reader.readAsDataURL(input.files[0]);
        } else {
            $('#' + previewId).hide();
        }
    }

    function addClonableItem(containerId, itemClass) {
        const container = document.getElementById(containerId);
        if (!container) {
            console.error(`Container with ID "${containerId}" not found.`);
            return;
        }

        const template = container.querySelector(`.${itemClass}`);
        if (!template) {
            console.error(`Template with class "${itemClass}" not found in container "${containerId}".`);
            return;
        }

        // Clone the template element
        const newElement = template.cloneNode(true);

        // Reset all input fields comprehensively
        const inputs = newElement.querySelectorAll('input, select, textarea');
        inputs.forEach(input => {
            // Reset based on input type
            switch (input.type) {
                case 'text':
                case 'number':
                case 'email':
                case 'tel':
                case 'password':
                case 'search':
                case 'url':
                case 'textarea':
                    input.value = '';
                    break;
                case 'checkbox':
                case 'radio':
                    input.checked = false;
                    break;
                case 'select-one':
                case 'select-multiple':
                    input.selectedIndex = 0;
                    break;
                case 'file':
                    input.value = '';
                    break;
            }

            // Remove any error classes or validation states
            input.classList.remove('is-invalid', 'error');

            // Reset any custom attributes if needed
            input.removeAttribute('data-previous-value');
        });

        // Reset select elements to their default state
        const selects = newElement.querySelectorAll('select');
        selects.forEach(select => {
            select.selectedIndex = 0;
        });

        // Make the delete button visible and bind the click event
        const deleteButton = newElement.querySelector('.remove-btn');
        if (deleteButton) {
            deleteButton.style.display = 'inline-block';
            deleteButton.addEventListener('click', () => {
                newElement.remove();
            });
        }

        // Reset any custom data attributes
        newElement.querySelectorAll('[data-clone-reset]').forEach(element => {
            const resetValue = element.getAttribute('data-clone-reset');
            if (resetValue) {
                if (element.tagName === 'INPUT' || element.tagName === 'SELECT' || element.tagName ===
                    'TEXTAREA') {
                    element.value = resetValue;
                } else {
                    element.textContent = resetValue;
                }
            }
        });

        // Optional: Regenerate unique IDs if needed
        const elementsWithId = newElement.querySelectorAll('[id]');
        elementsWithId.forEach(element => {
            const originalId = element.id;
            const newId = `${originalId}_${Date.now()}`;
            element.id = newId;

            // Update any labels or references
            const labels = newElement.querySelectorAll(`label[for="${originalId}"]`);
            labels.forEach(label => {
                label.setAttribute('for', newId);
            });
        });

        // Append the cloned element to the container
        container.appendChild(newElement);

        // Optional: Trigger any custom events or reinitialize plugins
        const event = new Event('cloneAdded', {
            bubbles: true
        });
        newElement.dispatchEvent(event);
    }
</script>