document.addEventListener('DOMContentLoaded', () => {
    const compteForm = document.getElementById('comptegf-form');
    const compteIdInput = document.querySelector('input[name="comptegf_id"]');
    const dateInput = document.getElementById('comptegf-date_operation');
    const debitInput = document.getElementById('comptegf-debit');
    const creditInput = document.getElementById('comptegf-credit');
    const libelleInput = document.getElementById('comptegf-libelle');
    const feedbackMessage = document.getElementById('comptegf-form-feedback');
    const createButton = document.querySelector('.create-button');
    const updateButton = document.querySelector('.update-button');
    const cancelEditButton = document.querySelector('.cancel-edit-button');
    const panel = document.querySelector('.comptegf-panel');
    const editButtons = document.querySelectorAll('.edit-comptegf-button');

    const setFeedback = (message) => {
        if (!feedbackMessage) {
            return;
        }
        feedbackMessage.textContent = message;
        feedbackMessage.style.display = message ? 'block' : 'none';
    };

    const resetFormMode = () => {
        if (!compteForm) {
            return;
        }

        compteForm.reset();
        compteIdInput.value = '';
        createButton.removeAttribute('disabled');
        createButton.hidden = false;
        updateButton.hidden = true;
        cancelEditButton.hidden = true;
        dateInput.removeAttribute('readonly');
        setFeedback('');
        panel.classList.remove('edit-mode');
    };

    const setEditMode = (row) => {
        const id = row.dataset.id || '';
        const dateOperation = row.dataset.date_operation || '';
        const debit = row.dataset.debit || '0.00';
        const credit = row.dataset.credit || '0.00';
        const libelle = row.dataset.libelle || '';

        compteIdInput.value = id;
        dateInput.value = dateOperation;
        debitInput.value = debit;
        creditInput.value = credit;
        libelleInput.value = libelle;

        createButton.setAttribute('disabled', 'disabled');
        createButton.hidden = true;
        updateButton.hidden = false;
        cancelEditButton.hidden = false;
        panel.classList.add('edit-mode');
        setFeedback('Mode édition activé. Modifiez puis enregistrez.');
    };

    editButtons.forEach((button) => {
        button.addEventListener('click', () => {
            const row = button.closest('tr');
            if (!row) {
                return;
            }
            setEditMode(row);
            libelleInput.focus();
        });
    });

    cancelEditButton.addEventListener('click', resetFormMode);
    resetFormMode();
});