wagtail-enap-designsystem 1.2.1.131__py3-none-any.whl → 1.2.1.133__py3-none-any.whl

enap_designsystem/templates/enap_designsystem/includes/form_field.html

@@ -421,10 +421,106 @@
                         {% include 'enap_designsystem/includes/form_field.html' with block=field_block %}
                     {% endfor %}
                 </div>
+                {% elif option_block.value.action == 'end_form' %}
+                <div class="end-form-message"
+                    data-parent-field="{{ block.block_type }}_{{ block.id }}"
+                    data-trigger-value="{{ option_block.value.value }}"
+                    data-auto-submit="true"
+                    style="display: none; margin-top: 1rem; padding: 1rem; border: 1px solid #f5c6cb; border-radius: 8px; background: #f8d7da; color: #721c24;">
+                    <p>A ENAP AGRADECE SUA PARTICIPAÇÃO NESSA CHAMADA PÚBLICA SIMPLIFICADA...</p>
+                    <div class="loading-spinner" style="text-align: center; margin-top: 1rem;">
+                        <div style="display: inline-block; width: 20px; height: 20px; border: 3px solid #f3f3f3; border-top: 3px solid #721c24; border-radius: 50%; animation: spin 1s linear infinite;"></div>
+                    </div>
+                </div>
             {% endif %}
         {% endfor %}
     </div>
 
+
+    <script>
+        // JavaScript para campos condicionais com auto-submit
+        document.addEventListener('DOMContentLoaded', function() {
+            // Função para lidar com campos condicionais
+            function handleConditionalFields() {
+                const conditionalBlocks = document.querySelectorAll('[data-parent-field]');
+                
+                conditionalBlocks.forEach(block => {
+                    const parentFieldName = block.dataset.parentField;
+                    const triggerValue = block.dataset.triggerValue;
+                    const parentInputs = document.querySelectorAll(`[name="${parentFieldName}"]`);
+                    
+                    if (parentInputs.length === 0) return;
+                    
+                    function checkAndToggle() {
+                        let shouldShow = false;
+                        
+                        parentInputs.forEach(input => {
+                            if (input.type === 'radio') {
+                                if (input.checked && input.value === triggerValue) {
+                                    shouldShow = true;
+                                }
+                            } else if (input.type === 'select-one') {
+                                if (input.value === triggerValue) {
+                                    shouldShow = true;
+                                }
+                            }
+                        });
+                        
+                        if (shouldShow) {
+                            block.style.display = 'block';
+                            
+                            // Se tem auto-submit, finalizar formulário automaticamente
+                            if (block.dataset.autoSubmit === 'true') {
+                                setTimeout(() => {
+                                    // Submeter o formulário
+                                    const form = document.getElementById('wagtailForm');
+                                    if (form) {
+                                        // Adicionar um campo hidden para indicar finalização automática
+                                        const autoEndInput = document.createElement('input');
+                                        autoEndInput.type = 'hidden';
+                                        autoEndInput.name = 'auto_end_form';
+                                        autoEndInput.value = 'true';
+                                        form.appendChild(autoEndInput);
+                                        
+                                        // Submeter
+                                        form.submit();
+                                    }
+                                }, 2000); // Aguarda 2 segundos para mostrar a mensagem
+                            }
+                        } else {
+                            block.style.display = 'none';
+                        }
+                    }
+                    
+                    // Adicionar listeners
+                    parentInputs.forEach(input => {
+                        if (input.type === 'radio') {
+                            input.addEventListener('change', checkAndToggle);
+                        } else if (input.type === 'select-one') {
+                            input.addEventListener('change', checkAndToggle);
+                        }
+                    });
+                    
+                    // Verificar estado inicial
+                    checkAndToggle();
+                });
+            }
+            
+            // Inicializar
+            handleConditionalFields();
+        });
+        
+        // CSS para animação de loading
+        const style = document.createElement('style');
+        style.textContent = `
+            @keyframes spin {
+                0% { transform: rotate(0deg); }
+                100% { transform: rotate(360deg); }
+            }
+        `;
+        document.head.appendChild(style);
+    </script>
+
 {% elif block.block_type == 'country_field' %}
     <div class="form-group">
         <label for="{{ block.block_type }}_{{ block.id }}">
@@ -729,214 +825,118 @@
         {% endfor %}
     </div>
 
-<script>
-// JavaScript específico para conditional_field_condicional
-(function() {
-    console.log('🔧 Inicializando conditional_field_condicional para {{ block.block_type }}_{{ block.id }}');
-    
-    function initConditionalField() {
-        const fieldId = '{{ block.block_type }}_{{ block.id }}';
-        const triggers = document.querySelectorAll(`[data-field-id="${fieldId}"].conditional-condicional-trigger`);
-        
-        console.log(`🎯 Encontrados ${triggers.length} triggers para ${fieldId}`);
-        
-        if (triggers.length === 0) {
-            console.warn(`⚠️ Nenhum trigger encontrado para ${fieldId}`);
-            return;
-        }
-        
-        triggers.forEach((trigger, index) => {
-            console.log(`🔗 Configurando trigger ${index + 1}:`, trigger.type, trigger.name);
-            
-            trigger.addEventListener('change', function() {
-                console.log(`📝 Trigger mudou: ${this.value}`);
-                handleConditionalChange(fieldId, this.value);
-            });
-            
-            // Verificar estado inicial
-            if (trigger.checked || (trigger.type === 'select-one' && trigger.value)) {
-                console.log(`🚀 Estado inicial detectado: ${trigger.value}`);
-                handleConditionalChange(fieldId, trigger.value);
-            }
-        });
-    }
-    
-    function handleConditionalChange(fieldId, selectedValue) {
-        console.log(`🔄 Campo ${fieldId} mudou para: "${selectedValue}"`);
-        
-        // Ocultar todos os campos condicionais deste campo
-        const allFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
-        console.log(`📦 Encontrados ${allFields.length} campos condicionais`);
-        
-        allFields.forEach((field, index) => {
-            field.style.display = 'none';
-            console.log(`👁️ Ocultando campo ${index + 1}`);
-            
-            // Limpar valores dos campos ocultos
-            const inputs = field.querySelectorAll('input, select, textarea');
-            inputs.forEach(input => {
-                if (input.type === 'checkbox' || input.type === 'radio') {
-                    input.checked = false;
-                } else {
-                    input.value = '';
-                }
-                
-                // Disparar evento change para outros condicionais aninhados
-                input.dispatchEvent(new Event('change', { bubbles: true }));
-            });
-        });
-        
-        // Mostrar campos para o valor selecionado
-        if (selectedValue) {
-            const targetField = document.querySelector(`[data-parent-field="${fieldId}"][data-trigger-value="${selectedValue}"]`);
-            if (targetField) {
-                targetField.style.display = 'block';
-                
-                // Animação suave
-                targetField.style.opacity = '0';
-                targetField.style.transform = 'translateY(-10px)';
-                
-                setTimeout(() => {
-                    targetField.style.transition = 'all 0.3s ease';
-                    targetField.style.opacity = '1';
-                    targetField.style.transform = 'translateY(0)';
-                }, 10);
-                
-                console.log(`✅ Campos mostrados para: "${selectedValue}"`);
-                
-                // Scroll suave para os campos que apareceram
-                setTimeout(() => {
-                    targetField.scrollIntoView({ 
-                        behavior: 'smooth', 
-                        block: 'nearest' 
-                    });
-                }, 300);
-            } else {
-                console.warn(`⚠️ Nenhum campo condicional encontrado para valor: "${selectedValue}"`);
-            }
-        }
-    }
-    
-    // Inicializar quando DOM estiver pronto
-    if (document.readyState === 'loading') {
-        document.addEventListener('DOMContentLoaded', initConditionalField);
-    } else {
-        initConditionalField();
-    }
-})();
-</script>
 
 <style>
-/* Estilos específicos para conditional_field_condicional */
-.conditional-field-condicional-group {
-    position: relative;
-    margin-bottom: 1.5rem;
-}
-
-.conditional-condicional-fields {
-    border-left: 4px solid var(--primary-color, #2A5E2C);
-    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
-    transition: all 0.3s ease;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
-    border-radius: 8px;
-    overflow: hidden;
-}
-
-.conditional-condicional-fields:hover {
-    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
-}
-
-.conditional-fields-header {
-    margin-bottom: 1rem;
-    padding-bottom: 0.5rem;
-    border-bottom: 1px solid #dee2e6;
-    background: rgba(42, 94, 44, 0.05);
-    margin: -1rem -1rem 1rem -1rem;
-    padding: 0.75rem 1rem;
-}
-
-.conditional-fields-header .text-muted {
-    color: var(--primary-color, #2A5E2C) !important;
-    font-weight: 600;
-    font-size: 0.9rem;
-}
-
-/* Melhorar a aparência dos campos aninhados */
-.conditional-condicional-fields .form-group {
-    margin-bottom: 1.25rem;
-}
-
-.conditional-condicional-fields .form-group:last-child {
-    margin-bottom: 0;
-}
-
-.conditional-condicional-fields .form-control {
-    border-color: #d1d9e0;
-    background: white;
-}
-
-.conditional-condicional-fields .form-control:focus {
-    border-color: var(--primary-color, #2A5E2C);
-    box-shadow: 0 0 0 2px rgba(42, 94, 44, 0.1);
-}
-
-/* Animações */
-@keyframes slideInDown {
-    from {
-        opacity: 0;
-        transform: translateY(-15px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0);
+    /* Estilos específicos para conditional_field_condicional */
+    .conditional-field-condicional-group {
+        position: relative;
+        margin-bottom: 1.5rem;
     }
-}
-
-.conditional-condicional-fields.show {
-    animation: slideInDown 0.3s ease-out;
-}
-
-/* Indicador visual para campos condicionais ativos */
-.conditional-condicional-fields::before {
-    content: '';
-    position: absolute;
-    left: -4px;
-    top: 0;
-    bottom: 0;
-    width: 4px;
-    background: linear-gradient(to bottom, var(--primary-color, #2A5E2C), #4CAF50);
-    border-radius: 0 2px 2px 0;
-}
-
-/* Responsivo */
-@media (max-width: 768px) {
+
     .conditional-condicional-fields {
-        padding: 0.75rem;
-        margin-top: 0.75rem;
-        border-left-width: 3px;
+        border-left: 4px solid var(--primary-color, #2A5E2C);
+        background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
+        transition: all 0.3s ease;
+        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
+        border-radius: 8px;
+        overflow: hidden;
     }
-    
+
+    .conditional-condicional-fields:hover {
+        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+    }
+
     .conditional-fields-header {
-        margin: -0.75rem -0.75rem 0.75rem -0.75rem;
-        padding: 0.6rem 0.75rem;
+        margin-bottom: 1rem;
+        padding-bottom: 0.5rem;
+        border-bottom: 1px solid #dee2e6;
+        background: rgba(42, 94, 44, 0.05);
+        margin: -1rem -1rem 1rem -1rem;
+        padding: 0.75rem 1rem;
     }
-    
+
     .conditional-fields-header .text-muted {
-        font-size: 0.85rem;
+        color: var(--primary-color, #2A5E2C) !important;
+        font-weight: 600;
+        font-size: 0.9rem;
     }
-}
 
-@media (max-width: 480px) {
-    .conditional-condicional-fields {
-        padding: 0.6rem;
-        border-left-width: 2px;
+    /* Melhorar a aparência dos campos aninhados */
+    .conditional-condicional-fields .form-group {
+        margin-bottom: 1.25rem;
     }
-    
-    .conditional-fields-header {
-        margin: -0.6rem -0.6rem 0.6rem -0.6rem;
-        padding: 0.5rem 0.6rem;
+
+    .conditional-condicional-fields .form-group:last-child {
+        margin-bottom: 0;
+    }
+
+    .conditional-condicional-fields .form-control {
+        border-color: #d1d9e0;
+        background: white;
+    }
+
+    .conditional-condicional-fields .form-control:focus {
+        border-color: var(--primary-color, #2A5E2C);
+        box-shadow: 0 0 0 2px rgba(42, 94, 44, 0.1);
+    }
+
+    /* Animações */
+    @keyframes slideInDown {
+        from {
+            opacity: 0;
+            transform: translateY(-15px);
+        }
+        to {
+            opacity: 1;
+            transform: translateY(0);
+        }
+    }
+
+    .conditional-condicional-fields.show {
+        animation: slideInDown 0.3s ease-out;
+    }
+
+    /* Indicador visual para campos condicionais ativos */
+    .conditional-condicional-fields::before {
+        content: '';
+        position: absolute;
+        left: -4px;
+        top: 0;
+        bottom: 0;
+        width: 4px;
+        background: linear-gradient(to bottom, var(--primary-color, #2A5E2C), #4CAF50);
+        border-radius: 0 2px 2px 0;
+    }
+
+    /* Responsivo */
+    @media (max-width: 768px) {
+        .conditional-condicional-fields {
+            padding: 0.75rem;
+            margin-top: 0.75rem;
+            border-left-width: 3px;
+        }
+        
+        .conditional-fields-header {
+            margin: -0.75rem -0.75rem 0.75rem -0.75rem;
+            padding: 0.6rem 0.75rem;
+        }
+        
+        .conditional-fields-header .text-muted {
+            font-size: 0.85rem;
+        }
+    }
+
+    @media (max-width: 480px) {
+        .conditional-condicional-fields {
+            padding: 0.6rem;
+            border-left-width: 2px;
+        }
+        
+        .conditional-fields-header {
+            margin: -0.6rem -0.6rem 0.6rem -0.6rem;
+            padding: 0.5rem 0.6rem;
+        }
     }
-}
 </style>
 
 
@@ -1639,253 +1639,6 @@
     });
 
 
-    // ADICIONE ESTE CÓDIGO AO FINAL DO SEU <script> NO form_field.html
-
-    // ========================================
-    // SISTEMA MULTI-REDIRECIONAMENTO
-    // ========================================
-
-    // Variáveis de controle
-    let multiRedirectFields = new Map();
-    let pendingActions = new Map();
-
-    // INICIALIZAÇÃO DOS CAMPOS MULTI-REDIRECT
-    function initializeMultiRedirectFields() {
-        console.log('🔀 Inicializando multi-redirecionamento...');
-        
-        const groups = document.querySelectorAll('.checkbox-multi-redirect-group');
-        console.log(`🔍 Encontrados ${groups.length} grupos multi-redirect`);
-        
-        groups.forEach(group => {
-            try {
-                const configData = group.getAttribute('data-field-config');
-                if (!configData) {
-                    console.log('⚠️ Configuração não encontrada para grupo:', group);
-                    return;
-                }
-                
-                const config = JSON.parse(configData);
-                multiRedirectFields.set(config.fieldId, config);
-                
-                const inputs = group.querySelectorAll('.multi-redirect-input');
-                inputs.forEach(input => {
-                    input.addEventListener('change', function() {
-                        handleMultiRedirectChange(config, this);
-                    });
-                });
-                
-                console.log(`✅ Campo configurado: ${config.fieldId} (${config.fieldType})`);
-                
-            } catch (error) {
-                console.error('❌ Erro configuração multi-redirect:', error, group);
-            }
-        });
-        
-        console.log(`🔀 ${multiRedirectFields.size} campos multi-redirect ativos`);
-    }
-
-    // GERENCIAR MUDANÇA NO CAMPO
-    function handleMultiRedirectChange(config, input) {
-        const value = input.value;
-        const isSelected = input.checked || (input.tagName === 'SELECT' && value);
-        
-        console.log(`🎯 Campo ${config.fieldId}: valor="${value}", selecionado=${isSelected}`);
-        
-        // Para radio e select, sempre processar se tem valor
-        // Para checkbox, só processar se estiver marcado
-        const shouldProcess = (config.fieldType === 'checkbox') ? input.checked : Boolean(value);
-        
-        if (!shouldProcess) {
-            hideAllMessages(config.fieldId);
-            hideAllConditionalFields(config.fieldId);
-            return;
-        }
-        
-        const option = config.options.find(opt => opt.value === value);
-        if (!option) {
-            console.log(`⚠️ Opção não encontrada para valor: ${value}`);
-            return;
-        }
-        
-        console.log(`🚀 Executando ação: ${option.action} para "${option.value}"`);
-        
-        // Limpar ações/mensagens anteriores
-        clearPreviousActions(config.fieldId);
-        
-        // Mostrar mensagem se configurada
-        if (option.message) {
-            showMultiRedirectMessage(config.fieldId, option);
-        }
-        
-        // Processar ação
-        const delay = (option.delay || 1) * 1000;
-        
-        switch (option.action) {
-            case 'continue':
-                console.log('➡️ Continuando normalmente');
-                break;
-                
-            case 'next_step':
-                console.log('⏩ Programando próxima etapa');
-                setTimeout(() => {
-                    if (typeof nextStep === 'function') {
-                        nextStep();
-                    } else {
-                        console.log('⚠️ Função nextStep não encontrada');
-                    }
-                }, delay);
-                break;
-                
-            case 'specific_section':
-                if (option.targetSection) {
-                    console.log(`🎯 Programando redirecionamento para: ${option.targetSection}`);
-                    setTimeout(() => {
-                        if (typeof redirectToSpecificSection === 'function') {
-                            redirectToSpecificSection(option.targetSection);
-                        } else {
-                            console.log('⚠️ Função redirectToSpecificSection não encontrada');
-                        }
-                    }, delay);
-                }
-                break;
-                
-            case 'skip_to_end':
-                console.log('⏭️ Programando finalização');
-                setTimeout(() => {
-                    skipToFinalStep();
-                }, delay);
-                break;
-                
-            case 'show_fields':
-                console.log(`👁️ Mostrando campos condicionais para: ${value}`);
-                showConditionalFields(config.fieldId, value);
-                break;
-        }
-    }
-
-    // MOSTRAR MENSAGEM DE REDIRECIONAMENTO
-    function showMultiRedirectMessage(fieldId, option) {
-        const blockId = fieldId.split('_').pop();
-        const optionIndex = multiRedirectFields.get(fieldId).options.findIndex(opt => opt.value === option.value);
-        const messageEl = document.getElementById(`redirect_message_${blockId}_${optionIndex}`);
-        
-        if (messageEl) {
-            messageEl.style.display = 'block';
-            console.log(`💬 Mensagem mostrada para opção: ${option.value}`);
-            
-            setTimeout(() => {
-                messageEl.scrollIntoView({ 
-                    behavior: 'smooth', 
-                    block: 'center' 
-                });
-            }, 100);
-        }
-    }
-
-    // MOSTRAR CAMPOS CONDICIONAIS
-    function showConditionalFields(fieldId, value) {
-        // Primeiro esconder todos os campos condicionais deste campo
-        hideAllConditionalFields(fieldId);
-        
-        // Mostrar apenas o campo correspondente ao valor selecionado
-        const conditionalField = document.querySelector(
-            `[data-parent-field="${fieldId}"][data-option-value="${value}"]`
-        );
-        
-        if (conditionalField) {
-            conditionalField.style.display = 'block';
-            console.log(`👁️ Campos condicionais mostrados para: ${value}`);
-            
-            setTimeout(() => {
-                conditionalField.scrollIntoView({ 
-                    behavior: 'smooth', 
-                    block: 'center' 
-                });
-            }, 200);
-        }
-    }
-
-    // OCULTAR TODAS AS MENSAGENS
-    function hideAllMessages(fieldId) {
-        const blockId = fieldId.split('_').pop();
-        const messages = document.querySelectorAll(`[id^="redirect_message_${blockId}_"]`);
-        
-        messages.forEach(message => {
-            message.style.display = 'none';
-        });
-    }
-
-    // OCULTAR TODOS OS CAMPOS CONDICIONAIS
-    function hideAllConditionalFields(fieldId) {
-        const conditionalFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
-        
-        conditionalFields.forEach(field => {
-            field.style.display = 'none';
-        });
-    }
-
-    // LIMPAR AÇÕES ANTERIORES
-    function clearPreviousActions(fieldId) {
-        pendingActions.delete(fieldId);
-        hideAllMessages(fieldId);
-    }
-
-    // PULAR PARA ETAPA FINAL
-    function skipToFinalStep() {
-        console.log(`⏭️ Executando pulo para final`);
-        
-        // Adicionar campo hidden indicando redirecionamento
-        const form = document.getElementById('wagtailForm');
-        if (form) {
-            let skipField = form.querySelector('input[name="form_redirected"]');
-            if (!skipField) {
-                skipField = document.createElement('input');
-                skipField.type = 'hidden';
-                skipField.name = 'form_redirected';
-                form.appendChild(skipField);
-            }
-            skipField.value = 'true';
-            
-            console.log('📨 Submetendo formulário...');
-            form.submit();
-        } else {
-            console.log('⚠️ Formulário não encontrado');
-        }
-    }
-
-    // FUNÇÃO PARA REDIRECIONAR PARA SEÇÃO ESPECÍFICA (caso não exista)
-    if (typeof redirectToSpecificSection === 'undefined') {
-        function redirectToSpecificSection(sectionTitle) {
-            console.log(`🎯 Procurando seção: "${sectionTitle}"`);
-            
-            // Procurar divisores com título correspondente
-            const dividers = document.querySelectorAll('.divider-title');
-            
-            for (const divider of dividers) {
-                const dividerTitle = divider.textContent?.trim() || '';
-                
-                if (dividerTitle.toLowerCase().includes(sectionTitle.toLowerCase()) ||
-                    sectionTitle.toLowerCase().includes(dividerTitle.toLowerCase())) {
-                    
-                    console.log(`✅ Seção encontrada: "${dividerTitle}"`);
-                    
-                    // Scroll para o divisor
-                    setTimeout(() => {
-                        divider.scrollIntoView({ 
-                            behavior: 'smooth', 
-                            block: 'center' 
-                        });
-                    }, 100);
-                    
-                    return true;
-                }
-            }
-            
-            console.log(`❌ Seção "${sectionTitle}" não encontrada`);
-            return false;
-        }
-    }
-
     // INICIALIZAÇÃO QUANDO DOM CARREGAR
     document.addEventListener('DOMContentLoaded', function() {
         // Aguardar um pouco para garantir que tudo carregou

{wagtail_enap_designsystem-1.2.1.131.dist-info → wagtail_enap_designsystem-1.2.1.133.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: wagtail-enap-designsystem
-Version: 1.2.1.131
+Version: 1.2.1.133
 Summary: Módulo de componentes utilizado nos portais ENAP, desenvolvido com Wagtail + CodeRedCMS
 Author: Renan Campos
 Author-email: renan.oliveira@enap.gov.br