Initial commit SteelBase - Oficiais e Funcionando
This commit is contained in:
Marcos
252
docs-historicos/AJUDA-DINAMICA-ABAS.md
Normal file
252
docs-historicos/AJUDA-DINAMICA-ABAS.md
Normal file
@@ -0,0 +1,252 @@
|
||||
# ✅ Sistema de Ajuda Dinâmica por Aba - IMPLEMENTADO
|
||||
|
||||
## Problema Resolvido
|
||||
|
||||
Antes, o ícone de ajuda (?) nos menus **SOLDAGEM** e **CONEXÕES** mostrava apenas informações da primeira aba, mesmo quando o usuário navegava para outras abas.
|
||||
|
||||
## Solução Implementada
|
||||
|
||||
Agora cada aba tem seu próprio conteúdo de ajuda específico que é atualizado automaticamente quando o usuário troca de aba.
|
||||
|
||||
---
|
||||
|
||||
## 📋 MENU SOLDAGEM - 6 Abas com Ajuda Individual
|
||||
|
||||
### Ícone Principal (ao abrir SOLDAGEM)
|
||||
- **ID:** `preaquecimento`
|
||||
- **Conteúdo:** Informações sobre Pré-Aquecimento AWS D1.1
|
||||
|
||||
### Abas e seus Conteúdos de Ajuda:
|
||||
|
||||
1. **🌡️ Pré-Aquecimento**
|
||||
- **ID:** `preaquecimento`
|
||||
- **Ajuda:** Cálculo de temperatura mínima, CEV, espessura, restrição
|
||||
- **Normas:** AWS D1.1, NBR 8800
|
||||
|
||||
2. **⚡ Filete**
|
||||
- **ID:** `filete`
|
||||
- **Ajuda:** Dimensionamento de soldas de filete, perna necessária
|
||||
- **Normas:** AWS D1.1, NBR 8800
|
||||
|
||||
3. **🔥 Energia**
|
||||
- **ID:** `energia`
|
||||
- **Ajuda:** Heat Input, controle de resfriamento, voltagem/corrente
|
||||
- **Normas:** AWS D1.1, ISO 17663
|
||||
|
||||
4. **📊 Consumo**
|
||||
- **ID:** `consumo-eletrodo`
|
||||
- **Ajuda:** Cálculo de consumo de eletrodos, perdas, eficiência
|
||||
- **Normas:** AWS Welding Handbook
|
||||
|
||||
5. **🔄 Sequência**
|
||||
- **ID:** `sequencia-soldagem`
|
||||
- **Ajuda:** Ordem de soldagem, controle de distorções
|
||||
- **Normas:** AWS D1.1
|
||||
|
||||
6. **📋 Padrões**
|
||||
- **ID:** `padroes-soldagem`
|
||||
- **Ajuda:** Normas, símbolos, qualificação, inspeção
|
||||
- **Normas:** AWS D1.1, ASME IX, NBR 8800
|
||||
|
||||
---
|
||||
|
||||
## 🔩 MENU CONEXÕES (Parafusos) - 5 Abas com Ajuda Individual
|
||||
|
||||
### Ícone Principal (ao abrir PARAFUSOS)
|
||||
- **ID:** `parafusos-cisalhamento`
|
||||
- **Conteúdo:** Informações sobre Cisalhamento de Parafusos
|
||||
|
||||
### Abas e seus Conteúdos de Ajuda:
|
||||
|
||||
1. **1️⃣ Cisalhamento**
|
||||
- **ID:** `parafusos-cisalhamento`
|
||||
- **Ajuda:** Resistência ao cisalhamento, planos de corte, A325/A490
|
||||
- **Normas:** NBR 8800, AISC 360
|
||||
|
||||
2. **2️⃣ Esmagamento**
|
||||
- **ID:** `parafusos-esmagamento`
|
||||
- **Ajuda:** Bearing, distância de borda, espaçamento
|
||||
- **Normas:** NBR 8800, AISC 360
|
||||
|
||||
3. **3️⃣ Bloco**
|
||||
- **ID:** `parafusos-bloco`
|
||||
- **Ajuda:** Ruptura em bloco, área líquida, cisalhamento + tração
|
||||
- **Normas:** AISC 360, NBR 8800
|
||||
|
||||
4. **4️⃣ Layout**
|
||||
- **ID:** `layout`
|
||||
- **Ajuda:** Layout de furação (já existia)
|
||||
- **Normas:** AISC, NBR 8800
|
||||
|
||||
5. **5️⃣ vs Solda**
|
||||
- **ID:** `parafuso-vs-solda`
|
||||
- **Ajuda:** Comparação parafuso vs solda (já existia)
|
||||
- **Normas:** AWS D1.1, NBR 8800
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Como Funciona Tecnicamente
|
||||
|
||||
### 1. Função `switchWeldTab(index)` - SOLDAGEM
|
||||
```javascript
|
||||
function switchWeldTab(index) {
|
||||
// ... código de troca de aba ...
|
||||
|
||||
// Atualiza botão de ajuda para a aba ativa
|
||||
const tabIds = ['preaquecimento', 'filete', 'energia', 'consumo-eletrodo', 'sequencia-soldagem', 'padroes-soldagem'];
|
||||
addHelpButton(tabIds[index]);
|
||||
}
|
||||
```
|
||||
|
||||
### 2. Função `switchTab(tabIndex)` - PARAFUSOS
|
||||
```javascript
|
||||
function switchTab(tabIndex) {
|
||||
// ... código de troca de aba ...
|
||||
|
||||
// Atualiza botão de ajuda para a aba ativa
|
||||
const tabIds = ['parafusos-cisalhamento', 'parafusos-esmagamento', 'parafusos-bloco', 'layout', 'parafuso-vs-solda'];
|
||||
if (tabIds[tabIndex]) {
|
||||
addHelpButton(tabIds[tabIndex]);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 3. Função `showSection(sectionId)` - Carregamento Inicial
|
||||
```javascript
|
||||
function showSection(sectionId) {
|
||||
// ... código de carregamento ...
|
||||
|
||||
setTimeout(() => {
|
||||
// Para seções com abas, mostra ajuda da primeira aba
|
||||
if (sectionId === 'preaquecimento') {
|
||||
addHelpButton('preaquecimento'); // Primeira aba de SOLDAGEM
|
||||
} else if (sectionId === 'parafusos') {
|
||||
addHelpButton('parafusos-cisalhamento'); // Primeira aba de PARAFUSOS
|
||||
} else {
|
||||
addHelpButton(sectionId);
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📚 Conteúdo de Ajuda Adicionado
|
||||
|
||||
### Cada entrada no `ajudaDatabase` contém:
|
||||
|
||||
- **titulo:** Título da ferramenta
|
||||
- **oQueE:** Definição técnica
|
||||
- **paraQueServe:** Objetivo e aplicação
|
||||
- **quandoUsar:** Situações de uso
|
||||
- **avisos:** Lista de alertas importantes (4-6 itens)
|
||||
- **campos:** Array de campos com:
|
||||
- nome
|
||||
- unidade
|
||||
- significado
|
||||
- intervalo típico
|
||||
- dica prática
|
||||
- **resultados:** HTML com fórmulas e interpretação
|
||||
- **referencias:** Array de normas e documentos
|
||||
- **manualRelacionado:** Links para manual técnico
|
||||
|
||||
---
|
||||
|
||||
## ✅ Resultado Final
|
||||
|
||||
### Experiência do Usuário:
|
||||
|
||||
1. **Usuário abre SOLDAGEM**
|
||||
- Vê ícone (?) no canto superior direito
|
||||
- Clica: vê ajuda sobre **Pré-Aquecimento**
|
||||
|
||||
2. **Usuário clica na aba "Filete"**
|
||||
- Ícone (?) continua visível
|
||||
- Clica: vê ajuda sobre **Soldas de Filete**
|
||||
|
||||
3. **Usuário clica na aba "Energia"**
|
||||
- Ícone (?) continua visível
|
||||
- Clica: vê ajuda sobre **Heat Input**
|
||||
|
||||
4. **E assim por diante...**
|
||||
|
||||
### Benefícios:
|
||||
|
||||
✅ **Ajuda contextual** - sempre relevante à aba atual
|
||||
✅ **Sem confusão** - usuário vê informação correta
|
||||
✅ **Profissional** - cada ferramenta tem documentação completa
|
||||
✅ **Educativo** - usuário aprende sobre cada cálculo
|
||||
✅ **Completo** - 11 novas entradas de ajuda adicionadas
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Ferramentas com Ajuda Completa
|
||||
|
||||
### Total: **32 ferramentas** com ajuda individual
|
||||
|
||||
#### MATERIAIS (4)
|
||||
- ✅ CEV Avançado
|
||||
- ✅ Seletor de Aço
|
||||
- ✅ Equivalências
|
||||
- ✅ Comparativo
|
||||
|
||||
#### CONEXÕES (5)
|
||||
- ✅ Cisalhamento de Parafusos
|
||||
- ✅ Esmagamento (Bearing)
|
||||
- ✅ Ruptura em Bloco
|
||||
- ✅ Layout de Furação
|
||||
- ✅ Parafuso vs Solda
|
||||
|
||||
#### SOLDAGEM (6)
|
||||
- ✅ Pré-Aquecimento
|
||||
- ✅ Filete
|
||||
- ✅ Energia (Heat Input)
|
||||
- ✅ Consumo de Eletrodos
|
||||
- ✅ Sequência de Soldagem
|
||||
- ✅ Padrões e Normas
|
||||
|
||||
#### ENSAIOS (4)
|
||||
- ✅ Dureza
|
||||
- ✅ Charpy
|
||||
- ✅ Certificado
|
||||
- ✅ Ultrassom
|
||||
|
||||
#### PINTURA (6)
|
||||
- ✅ Área de Pintura
|
||||
- ✅ Consumo de Tinta
|
||||
- ✅ Galvanização
|
||||
- ✅ Custo de Pintura
|
||||
- ✅ Secagem
|
||||
- ✅ Inspeção
|
||||
|
||||
#### ORÇAMENTO (3)
|
||||
- ✅ Orçamento Detalhado
|
||||
- ✅ Peso e Rigging
|
||||
- ✅ Referências Técnicas
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Como Testar
|
||||
|
||||
1. Abra o aplicativo: `http://localhost:8000`
|
||||
2. Clique em **SOLDAGEM** no menu lateral
|
||||
3. Observe o ícone (?) no canto superior direito
|
||||
4. Clique no (?): deve mostrar ajuda sobre **Pré-Aquecimento**
|
||||
5. Clique na aba **Filete**
|
||||
6. Clique no (?): deve mostrar ajuda sobre **Soldas de Filete**
|
||||
7. Repita para todas as 6 abas de SOLDAGEM
|
||||
8. Faça o mesmo teste para **CONEXÕES** (5 abas)
|
||||
|
||||
---
|
||||
|
||||
## 📝 Arquivos Modificados
|
||||
|
||||
- **app.js**
|
||||
- Adicionado 11 novas entradas no `ajudaDatabase`
|
||||
- Modificado `switchWeldTab()` para atualizar ajuda
|
||||
- Modificado `switchTab()` para atualizar ajuda
|
||||
- Modificado `showSection()` para carregar ajuda da primeira aba
|
||||
|
||||
---
|
||||
|
||||
**Desenvolvido com ❤️ para AÇO CALC PRO v7.5**
|
||||
Reference in New Issue
Block a user