@section('scripts')
<script>
    // Edit DU/DI Function
    function editDudi(id, nama) {
        const form = document.getElementById('editDudiForm');
        const nameInput = document.getElementById('edit_nama_dudi');
        
        form.action = `/admin/dudi/${id}`;
        nameInput.value = nama;
        
        const modal = new bootstrap.Modal(document.getElementById('editDudiModal'));
        modal.show();
    }

    // Confirm Delete Function - Updated to match SekolahController logic
    function confirmDelete(id, nama, siswaCount) {
        const form = document.getElementById('deleteDudiForm');
        const nameElement = document.getElementById('deleteDudiName');
        const warningElement = document.getElementById('deleteWarning');
        const infoElement = document.getElementById('deleteInfo');
        const siswaCountElement = document.getElementById('siswaCount');
        const confirmBtn = document.getElementById('confirmDeleteBtn');
        
        // Set form action and DU/DI name
        form.action = `/admin/dudi/${id}`;
        nameElement.textContent = nama;
        
        // Show/hide elements based on student count (same logic as SekolahController)
        if (siswaCount > 0) {
            // DU/DI has students - show warning and hide delete button
            siswaCountElement.textContent = siswaCount;
            warningElement.style.display = 'block';
            infoElement.style.display = 'none';
            confirmBtn.style.display = 'none';
        } else {
            // DU/DI has no students - allow deletion
            warningElement.style.display = 'none';
            infoElement.style.display = 'block';
            confirmBtn.style.display = 'inline-block';
        }
        
        const modal = new bootstrap.Modal(document.getElementById('deleteDudiModal'));
        modal.show();
    }

    // Auto show add modal if validation errors exist
    document.addEventListener('DOMContentLoaded', function() {
        @if($errors->any() && !old('_method'))
            const addModal = new bootstrap.Modal(document.getElementById('addDudiModal'));
            addModal.show();
        @endif

        // Show success/error messages
        @if(session('success'))
            showToast('success', '{{ session('success') }}');
        @endif

        @if(session('error'))
            showToast('error', '{{ session('error') }}');
        @endif
    });

    // Toast notification function
    function showToast(type, message) {
        const toastContainer = document.getElementById('toast-container') || createToastContainer();
        const toastId = 'toast-' + Date.now();
        
        const toastHtml = `
            <div id="${toastId}" class="toast align-items-center text-bg-${type === 'success' ? 'success' : 'danger'} border-0" role="alert" aria-live="assertive" aria-atomic="true">
                <div class="d-flex">
                    <div class="toast-body">
                        <i class="fas fa-${type === 'success' ? 'check-circle' : 'exclamation-circle'} me-2"></i>
                        ${message}
                    </div>
                    <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
                </div>
            </div>
        `;
        
        toastContainer.insertAdjacentHTML('beforeend', toastHtml);
        
        const toastElement = document.getElementById(toastId);
        const toast = new bootstrap.Toast(toastElement, {
            autohide: true,
            delay: 5000
        });
        
        toast.show();
        
        toastElement.addEventListener('hidden.bs.toast', function () {
            toastElement.remove();
        });
    }

    // Create toast container if it doesn't exist
    function createToastContainer() {
        const container = document.createElement('div');
        container.id = 'toast-container';
        container.className = 'toast-container position-fixed top-0 end-0 p-3';
        container.style.zIndex = '1055';
        document.body.appendChild(container);
        return container;
    }
</script>
@endsection