{{-- resources/views/filament/components/payment-sync-script.blade.php --}}

<div id="payment-sync-container" style="display: none;"></div>

<script>
    // Payment sync functionality
    (function() {
        'use strict';

        let paymentSyncInitialized = false;

        function waitForElements() {
            // Filament'in yüklenmesini bekle
            if (document.querySelector('[data-field-wrapper="items"]') && !paymentSyncInitialized) {
                initializePaymentSync();
            } else {
                setTimeout(waitForElements, 500);
            }
        }

        function initializePaymentSync() {
            if (paymentSyncInitialized) return;
            paymentSyncInitialized = true;

            console.log("🚀 Payment sync başlatılıyor...");

            function attachPaymentListeners() {
                const paidInputs = document.querySelectorAll('input[name*="[paid]"]');
                console.log("💰 Bulunan paid input sayısı:", paidInputs.length);

                paidInputs.forEach((input, index) => {
                    // Önceki listener'ı kaldır
                    input.removeEventListener("input", handlePaymentChange);
                    input.removeEventListener("change", handlePaymentChange);

                    // Yeni listener'lar ekle
                    input.addEventListener("input", handlePaymentChange);
                    input.addEventListener("change", handlePaymentChange);

                    console.log(`📝 Listener ${index + 1} eklendi`);
                });
            }

            function handlePaymentChange(event) {
                console.log("💸 Payment change detected");
                const input = event.target;

                const row = input.closest('.fi-fo-repeater-item');
                if (!row) {
                    console.log("❌ Repeater row bulunamadı");
                    return;
                }

                const currencySelect = row.querySelector('select[name*="[currency_id]"]');
                if (!currencySelect) {
                    console.log("❌ Currency select bulunamadı");
                    return;
                }

                const selectedOption = currencySelect.options[currencySelect.selectedIndex];
                console.log("🏦 Selected currency option:", selectedOption?.text);

                // Currency code'u çıkar
                let currencyCode = "TRY"; // default
                if (selectedOption && selectedOption.text) {
                    const match = selectedOption.text.match(/^([A-Z]{3})/);
                    if (match) {
                        currencyCode = match[1];
                    }
                }

                console.log("💱 Detected currency code:", currencyCode);
                updateAmountReceived(currencyCode);
            }

            function updateAmountReceived(currencyCode) {
                console.log("🔄 Updating amount received for:", currencyCode);
                let totalPaid = 0;

                const paidInputs = document.querySelectorAll('input[name*="[paid]"]');

                paidInputs.forEach(input => {
                    const row = input.closest('.fi-fo-repeater-item');
                    const currencySelect = row?.querySelector('select[name*="[currency_id]"]');

                    if (currencySelect) {
                        const selectedOption = currencySelect.options[currencySelect.selectedIndex];
                        let inputCurrencyCode = "TRY";

                        if (selectedOption && selectedOption.text) {
                            const match = selectedOption.text.match(/^([A-Z]{3})/);
                            if (match) {
                                inputCurrencyCode = match[1];
                            }
                        }

                        if (inputCurrencyCode === currencyCode) {
                            const paidAmount = parseFloat(input.value) || 0;
                            totalPaid += paidAmount;
                            console.log(`➕ Added ${paidAmount}, Total: ${totalPaid}`);
                        }
                    }
                });

                console.log("💯 Final total paid:", totalPaid);

                // Services tablosundaki "Alınan Tutar" satırını güncelle
                const amountReceivedElement = document.getElementById(`amount-received-${currencyCode}`);

                if (amountReceivedElement) {
                    amountReceivedElement.textContent = totalPaid.toFixed(2) + " " + currencyCode;
                    console.log("✅ Updated amount received to:", totalPaid.toFixed(2) + " " + currencyCode);
                } else {
                    console.log("❌ Amount received element bulunamadı:", `amount-received-${currencyCode}`);
                }

                // Kalan tutarı hesapla ve güncelle
                updateRemainingAmount(currencyCode, totalPaid);
            }

            function updateRemainingAmount(currencyCode, totalPaid) {
                console.log("🧮 Calculating remaining amount for:", currencyCode);

                const invoiceAmountElement = document.getElementById(`invoice-amount-${currencyCode}`);
                const remainingAmountElement = document.getElementById(`remaining-amount-${currencyCode}`);

                if (!invoiceAmountElement) {
                    console.log("❌ Invoice amount element bulunamadı:", `invoice-amount-${currencyCode}`);
                    return;
                }

                if (!remainingAmountElement) {
                    console.log("❌ Remaining amount element bulunamadı:", `remaining-amount-${currencyCode}`);
                    return;
                }

                const invoiceText = invoiceAmountElement.textContent || invoiceAmountElement.innerText || '0';
                const invoiceAmount = parseFloat(invoiceText.replace(/[^0-9.-]/g, '')) || 0;

                console.log("💰 Invoice amount:", invoiceAmount);
                console.log("💸 Total paid:", totalPaid);

                const remainingAmount = invoiceAmount - totalPaid;
                console.log("🔢 Remaining amount:", remainingAmount);

                if (remainingAmount > 0.01) {
                    remainingAmountElement.innerHTML = `<span style="color: #dc2626; font-weight: bold;">${remainingAmount.toFixed(2)} ${currencyCode} (Kalan)</span>`;
                    console.log("🔴 Kalan borç:", remainingAmount.toFixed(2));
                } else if (remainingAmount < -0.01) {
                    remainingAmountElement.innerHTML = `<span style="color: #059669; font-weight: bold;">${Math.abs(remainingAmount).toFixed(2)} ${currencyCode} (Para Üstü)</span>`;
                    console.log("🟢 Para üstü:", Math.abs(remainingAmount).toFixed(2));
                } else {
                    remainingAmountElement.innerHTML = `<span style="color: #059669; font-weight: bold;">✅ Tamamen Ödendi</span>`;
                    console.log("✅ Tamamen ödendi");
                }
            }

            function attachCurrencyListeners() {
                const currencySelects = document.querySelectorAll('select[name*="[currency_id]"]');
                console.log("🏦 Bulunan currency select sayısı:", currencySelects.length);

                currencySelects.forEach((select, index) => {
                    select.removeEventListener("change", handleCurrencyChange);
                    select.addEventListener("change", handleCurrencyChange);
                    console.log(`🏦 Currency listener ${index + 1} eklendi`);
                });
            }

            function handleCurrencyChange(event) {
                console.log("🏦 Currency change detected");
                setTimeout(() => {
                    const currencies = new Set();

                    document.querySelectorAll('select[name*="[currency_id]"]').forEach(select => {
                        const selectedOption = select.options[select.selectedIndex];
                        if (selectedOption && selectedOption.text) {
                            const match = selectedOption.text.match(/^([A-Z]{3})/);
                            if (match) {
                                currencies.add(match[1]);
                            }
                        }
                    });

                    console.log("🌍 Found currencies:", Array.from(currencies));

                    currencies.forEach(currency => {
                        updateAmountReceived(currency);
                    });
                }, 100);
            }

            // Repeater değişikliklerini izle
            const observer = new MutationObserver(function(mutations) {
                let shouldReattach = false;

                mutations.forEach(function(mutation) {
                    if (mutation.type === 'childList') {
                        // Repeater item eklendi/silindi mi kontrol et
                        const addedNodes = Array.from(mutation.addedNodes);
                        const removedNodes = Array.from(mutation.removedNodes);

                        const hasRepeaterChanges = [...addedNodes, ...removedNodes].some(node => {
                            return node.nodeType === Node.ELEMENT_NODE &&
                                (node.classList?.contains('fi-fo-repeater-item') ||
                                    node.querySelector?.('.fi-fo-repeater-item'));
                        });

                        if (hasRepeaterChanges) {
                            shouldReattach = true;
                        }
                    }
                });

                if (shouldReattach) {
                    console.log("🔄 DOM değişikliği tespit edildi, listener'lar yeniden attach ediliyor");
                    setTimeout(() => {
                        attachPaymentListeners();
                        attachCurrencyListeners();
                    }, 300);
                }
            });

            // Repeater container'ı gözlemle
            const repeaterContainer = document.querySelector('[data-field-wrapper="items"]');
            if (repeaterContainer) {
                console.log("📦 Repeater container bulundu, observer başlatıldı");
                observer.observe(repeaterContainer, {
                    childList: true,
                    subtree: true
                });
            } else {
                console.log("❌ Repeater container bulunamadı");
            }

            // İlk setup
            attachPaymentListeners();
            attachCurrencyListeners();

            // Mevcut değerleri hesapla
            setTimeout(() => {
                console.log("🎯 İlk hesaplama başlatılıyor");
                const currencies = new Set();

                document.querySelectorAll('select[name*="[currency_id]"]').forEach(select => {
                    const selectedOption = select.options[select.selectedIndex];
                    if (selectedOption && selectedOption.text) {
                        const match = selectedOption.text.match(/^([A-Z]{3})/);
                        if (match) {
                            currencies.add(match[1]);
                        }
                    }
                });

                console.log("🌍 İlk hesaplama para birimleri:", Array.from(currencies));

                currencies.forEach(currency => {
                    updateAmountReceived(currency);
                });
            }, 500);
        }

        // Sayfa yüklendiğinde başlat
        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', waitForElements);
        } else {
            waitForElements();
        }
    })();
</script>