3.3 KiB
Problema Resolvido: Subitens do Catálogo de Perfis
Problema Identificado
Os subitens do "Catálogo de Perfis" não estavam aparecendo na sidebar, mesmo com a classe expanded aplicada no HTML.
Causa Raiz
O problema estava na configuração adminConfig.toolsVisibility no arquivo app.js. Todos os itens do catálogo de perfis estavam configurados como false:
// Catálogo de Perfis
'cantoneiras': false,
'barras-redondas': false,
'tubos-circulares': false,
// ... etc
A função filterToolsByMode() é chamada durante a inicialização e esconde todos os itens que têm toolsVisibility: false quando o app está em modo simples (não-expert).
Solução Aplicada
1. Alteração no app.js
Mudei todos os itens do catálogo de perfis para true:
// Catálogo de Perfis
'cantoneiras': true,
'barras-redondas': true,
'tubos-circulares': true,
'perfis-i': true,
'perfis-w': true,
'tubos-rhs': true,
'chapas': true,
'perfis-hp': true,
'barras-roscadas': true,
'barras-chatas': true,
2. Melhorias no CSS (style.css)
Aumentei o max-height e adicionei opacity para melhor transição:
.sidebar-subcategory-content {
max-height: 0;
overflow: hidden;
transition: max-height var(--duration-normal) var(--ease-standard);
padding-left: var(--space-12);
opacity: 0;
}
.sidebar-subcategory.expanded .sidebar-subcategory-content {
max-height: 5000px !important;
padding-top: var(--space-4);
padding-bottom: var(--space-4);
opacity: 1;
}
3. Melhorias na Inicialização
Adicionei código para forçar a expansão das subcategorias marcadas como expanded no HTML:
// Force expand all subcategories that have the expanded class in HTML
const expandedSubcategories = document.querySelectorAll('.sidebar-subcategory.expanded');
console.log('📂 Subcategorias com classe expanded:', expandedSubcategories.length);
expandedSubcategories.forEach((subcat, index) => {
const content = subcat.querySelector('.sidebar-subcategory-content');
if (content) {
// Force display by setting max-height directly
content.style.maxHeight = '5000px';
content.style.opacity = '1';
console.log(`✅ Subcategoria ${index + 1} forçada a expandir:`, subcat.querySelector('.subcategory-title')?.textContent);
}
});
4. Debug Melhorado
Adicionei logs detalhados na função toggleCategory() para facilitar debugging futuro.
Resultado
Agora os 10 subitens do "Catálogo de Perfis" aparecem corretamente:
- 📐 Cantoneiras
- ⭕ Barras Redondas
- 🔘 Tubos Circulares
- 🏛️ Perfis I (IPE)
- 🏗️ Perfis W
- ▭ Tubos RHS
- 📄 Chapas
- 🏛️ Perfis HP
- 🔩 Barras Roscadas
- ▬ Barras Chatas
Arquivos Modificados
app.js- Configuração toolsVisibility e inicializaçãostyle.css- Estilos de subcategorias- Nenhuma alteração necessária no
index.html(estrutura já estava correta)
Teste
Para testar:
- Abra o
index.htmlno navegador - Verifique a aba "📦 MATERIAIS"
- Expanda "🏗️ AÇOS ESTRUTURAIS"
- Verifique que "📐 Catálogo de Perfis" mostra todos os 10 subitens
- Clique em qualquer subitem para carregar a seção correspondente