3666 lines
192 KiB
JavaScript
3666 lines
192 KiB
JavaScript
/**
|
||
* Catálogo de Perfis - Sistema completo de consulta
|
||
* Integra dados dos CSVs brasil_completo com informações técnicas
|
||
*/
|
||
|
||
console.log('📐 Módulo perfis-catalog.js carregado');
|
||
|
||
// ========================================
|
||
// CANTONEIRAS
|
||
// ========================================
|
||
|
||
function getCantoneirasContent() {
|
||
console.log('🔧 getCantoneirasContent() chamada');
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">📐 Cantoneiras - Catálogo Completo Brasil</div>
|
||
<div class="section-description">Perfis de abas iguais laminados a quente - 39 modelos disponíveis</div>
|
||
</div>
|
||
|
||
<!-- Tabs de Navegação -->
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- TAB 1: TABELA TÉCNICA -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card">
|
||
<div class="card-title">🔍 Filtros de Busca</div>
|
||
<div class="form-grid">
|
||
<div class="form-group">
|
||
<label class="form-label">Tamanho</label>
|
||
<select class="form-control" id="cant-tamanho" onchange="filtrarCantoneiras()">
|
||
<option value="">Todos</option>
|
||
<option value="Pequena">Pequena (L25-L50)</option>
|
||
<option value="Média">Média (L63-L75)</option>
|
||
<option value="Grande">Grande (L100)</option>
|
||
<option value="Muito Grande">Muito Grande (L125)</option>
|
||
<option value="Extra-Grande">Extra-Grande (L150)</option>
|
||
<option value="Massiva">Massiva (L200)</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Peso Máximo (kg/m)</label>
|
||
<input type="number" class="form-control" id="cant-peso-max" placeholder="Ex: 10" onchange="filtrarCantoneiras()">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Buscar por Nome</label>
|
||
<input type="text" class="form-control" id="cant-busca" placeholder="Ex: L50x50" oninput="filtrarCantoneiras()">
|
||
</div>
|
||
</div>
|
||
<button class="btn btn-secondary" onclick="limparFiltrosCantoneiras()">🔄 Limpar Filtros</button>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-title">
|
||
📊 Tabela de Cantoneiras (39 modelos)
|
||
<button class="btn btn-primary" id="btn-carregar-cantoneiras" onclick="forcarCarregamentoCantoneiras()" style="float: right; margin-top: -4px;">
|
||
🔄 Carregar Dados
|
||
</button>
|
||
</div>
|
||
<div id="cantoneiras-table-container">
|
||
<div class="table-container">
|
||
<table id="cantoneiras-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Lado (mm)</th>
|
||
<th>Espessura (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Área (cm²)</th>
|
||
<th>Momento Inércia (cm⁴)</th>
|
||
<th>Raio Giração (cm)</th>
|
||
<th>Categoria</th>
|
||
<th>Ações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="cantoneiras-tbody">
|
||
<!-- Será preenchido via JavaScript -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div style="margin-top: 16px; padding: 12px; background: var(--color-bg-2); border-radius: 8px;">
|
||
<strong>📌 Total:</strong> <span id="cant-total">39</span> modelos encontrados
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 2: ESPECIFICAÇÕES COMPLETAS -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">📋 Especificações Técnicas Completas</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔧 Descrição Geral</h3>
|
||
<p><strong>Cantoneiras de aço laminadas a quente com abas iguais, seção em L</strong></p>
|
||
<p>Perfis estruturais versáteis amplamente utilizados em construção civil, naval e industrial. Fabricados por laminação a quente, apresentam excelente relação resistência/peso.</p>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📏 Faixa de Dimensões</h3>
|
||
<ul>
|
||
<li><strong>Lado:</strong> 25mm a 200mm</li>
|
||
<li><strong>Espessura:</strong> 3mm a 20mm</li>
|
||
<li><strong>Quantidade de modelos:</strong> 39 perfis diferentes</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📦 Distribuição dos Modelos</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Faixa</th>
|
||
<th>Quantidade</th>
|
||
<th>Aplicação Típica</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Pequena</strong></td>
|
||
<td>L25 - L50</td>
|
||
<td>12 modelos</td>
|
||
<td>Estruturas leves, suportes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Média</strong></td>
|
||
<td>L63 - L75</td>
|
||
<td>9 modelos</td>
|
||
<td>Treliças, galpões pequenos</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Grande</strong></td>
|
||
<td>L100</td>
|
||
<td>7 modelos</td>
|
||
<td>Estruturas médias, torres</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Muito Grande</strong></td>
|
||
<td>L125</td>
|
||
<td>4 modelos</td>
|
||
<td>Estruturas pesadas, pontes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Extra-Grande</strong></td>
|
||
<td>L150</td>
|
||
<td>4 modelos</td>
|
||
<td>Grandes vãos, offshore</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Massiva</strong></td>
|
||
<td>L200</td>
|
||
<td>3 modelos</td>
|
||
<td>Estruturas críticas, navais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔬 Qualidades Disponíveis (SAE)</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Qualidade SAE</th>
|
||
<th>Aplicação</th>
|
||
<th>Fy (MPa)</th>
|
||
<th>Fu (MPa)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>SAE 1008-1015</strong></td>
|
||
<td>Básico - Uso geral</td>
|
||
<td>210</td>
|
||
<td>400</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>SAE 1020-1025</strong></td>
|
||
<td>Médio - Estrutural</td>
|
||
<td>250</td>
|
||
<td>450</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>SAE 1035-1045</strong></td>
|
||
<td>Alto - Crítico</td>
|
||
<td>280</td>
|
||
<td>530</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📐 Comprimentos Comerciais</h3>
|
||
<ul>
|
||
<li><strong>Padrão:</strong> 6m, 9m, 12m, 13.5m</li>
|
||
<li><strong>Sob encomenda:</strong> Cortes customizados disponíveis</li>
|
||
<li><strong>Tolerância:</strong> ±10mm (NBR 9067)</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🎨 Acabamentos Disponíveis</h3>
|
||
<ul>
|
||
<li><strong>Laminado a quente (padrão):</strong> Acabamento rugoso com escamas de laminação</li>
|
||
<li><strong>Galvanizado (sob encomenda):</strong> Proteção contra corrosão, +15-20% custo</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📜 Normas Aplicáveis</h3>
|
||
<ul>
|
||
<li><strong>ABNT NBR 9067:</strong> Cantoneiras de abas iguais - Dimensões</li>
|
||
<li><strong>ABNT NBR 9064:</strong> Cantoneiras de aço - Tolerâncias</li>
|
||
<li><strong>ASTM A36:</strong> Especificação para aço estrutural carbono</li>
|
||
<li><strong>EN 10025-2:</strong> Produtos laminados a quente</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 3: FABRICANTES NO BRASIL -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">🏭 Fabricantes e Distribuição no Brasil</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🏢 Principais Fabricantes</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Fabricante</th>
|
||
<th>Participação</th>
|
||
<th>Localização</th>
|
||
<th>Especialidade</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr style="background: var(--color-bg-2);">
|
||
<td><strong>🥇 Gerdau</strong></td>
|
||
<td>~45%</td>
|
||
<td>Nacional (múltiplas unidades)</td>
|
||
<td>Todos os tamanhos</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>CSN</strong></td>
|
||
<td>~25%</td>
|
||
<td>Volta Redonda/RJ</td>
|
||
<td>Médios e grandes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Usiminas</strong></td>
|
||
<td>~15%</td>
|
||
<td>Ipatinga/MG</td>
|
||
<td>Grandes perfis</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Siderúrgica Toquinho</strong></td>
|
||
<td>~8%</td>
|
||
<td>Regional</td>
|
||
<td>Pequenos e médios</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Vallourec</strong></td>
|
||
<td>~5%</td>
|
||
<td>Belo Horizonte/MG</td>
|
||
<td>Especiais</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Aços Villares</strong></td>
|
||
<td>~2%</td>
|
||
<td>São Paulo/SP</td>
|
||
<td>Alta qualidade</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⏱️ Prazos de Entrega</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Tipo</th>
|
||
<th>Prazo</th>
|
||
<th>Observações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Estoque</strong></td>
|
||
<td>2-5 dias</td>
|
||
<td>Tamanhos comuns (L50-L100)</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Sob encomenda</strong></td>
|
||
<td>7-15 dias</td>
|
||
<td>Tamanhos especiais ou grandes volumes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Galvanizado</strong></td>
|
||
<td>+5-10 dias</td>
|
||
<td>Adicional ao prazo base</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📦 Embalagem e Transporte</h3>
|
||
<ul>
|
||
<li><strong>Embalagem:</strong> Feixes com cintas de aço</li>
|
||
<li><strong>Peso típico por feixe:</strong> 500-2000 kg</li>
|
||
<li><strong>Identificação:</strong> Etiqueta com especificação e lote</li>
|
||
<li><strong>Transporte:</strong> Caminhão truck ou carreta</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 4: PREÇOS 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">💰 Preços e Fatores de Custo (2025)</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">💵 Faixa de Preços por Kg</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Preço Mínimo (R$/kg)</th>
|
||
<th>Preço Máximo (R$/kg)</th>
|
||
<th>Preço Médio (R$/kg)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Pequenas (L25-L50)</strong></td>
|
||
<td>R$ 4.55</td>
|
||
<td>R$ 7.15</td>
|
||
<td>R$ 5.85</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Médias (L63-L75)</strong></td>
|
||
<td>R$ 3.85</td>
|
||
<td>R$ 6.05</td>
|
||
<td>R$ 4.95</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Grandes (L100+)</strong></td>
|
||
<td>R$ 3.50</td>
|
||
<td>R$ 5.50</td>
|
||
<td>R$ 4.50</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📊 Fatores de Preço Especiais</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Fator</th>
|
||
<th>Impacto no Preço</th>
|
||
<th>Observações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Pequenas (L25-L40)</strong></td>
|
||
<td>+30%</td>
|
||
<td>Menor demanda, produção especial</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Grandes (L150-L200)</strong></td>
|
||
<td>-5% a -10%</td>
|
||
<td>Economia de escala</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Volume >10 ton</strong></td>
|
||
<td>-10% a -15%</td>
|
||
<td>Desconto por volume</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Galvanizado</strong></td>
|
||
<td>+15% a +20%</td>
|
||
<td>Processo adicional</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Corte customizado</strong></td>
|
||
<td>+R$ 50-150/corte</td>
|
||
<td>Taxa fixa por corte</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔢 Calculadora de Preço Estimado</h3>
|
||
<div class="card" style="background: var(--color-bg-2);">
|
||
<div class="form-grid">
|
||
<div class="form-group">
|
||
<label class="form-label">Peso (kg/m)</label>
|
||
<input type="number" class="form-control" id="calc-peso" value="10" step="0.1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Comprimento (m)</label>
|
||
<input type="number" class="form-control" id="calc-comprimento" value="6" step="0.1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Quantidade (peças)</label>
|
||
<input type="number" class="form-control" id="calc-quantidade" value="10" step="1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Preço/kg (R$)</label>
|
||
<input type="number" class="form-control" id="calc-preco-kg" value="5.00" step="0.10">
|
||
</div>
|
||
</div>
|
||
<button class="btn btn-primary" onclick="calcularPrecoCantoneira()">💰 Calcular Preço Total</button>
|
||
<div id="calc-resultado" style="margin-top: 16px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 5: APLICAÇÕES -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">🔧 Aplicações Principais e Recomendações</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🏗️ Aplicações por Setor</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Setor</th>
|
||
<th>Aplicações</th>
|
||
<th>Tamanhos Típicos</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Construção Civil</strong></td>
|
||
<td>Galpões, edifícios, estruturas metálicas</td>
|
||
<td>L50 - L100</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Treliças</strong></td>
|
||
<td>Coberturas, pontes, torres</td>
|
||
<td>L63 - L125</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Naval</strong></td>
|
||
<td>Estruturas de embarcações, reforços</td>
|
||
<td>L75 - L150</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Industrial</strong></td>
|
||
<td>Suportes, plataformas, escadas</td>
|
||
<td>L40 - L100</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Offshore</strong></td>
|
||
<td>Plataformas, estruturas marítimas</td>
|
||
<td>L125 - L200</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Pontes</strong></td>
|
||
<td>Estruturas principais, contraventamento</td>
|
||
<td>L100 - L200</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⚙️ Compatibilidade de Conexões</h3>
|
||
<ul>
|
||
<li><strong>Parafusos estruturais:</strong> M12 a M36 (conforme tamanho)</li>
|
||
<li><strong>Soldagem:</strong> Eletrodo E7018 (SMAW) ou GMAW</li>
|
||
<li><strong>Furação:</strong> Fácil execução, furos de 13-40mm típicos</li>
|
||
<li><strong>Ligações:</strong> Chapas de gusset, cantoneiras de ligação</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔧 Serviços Adicionais Disponíveis</h3>
|
||
<ul>
|
||
<li><strong>Corte linear:</strong> Corte em comprimentos específicos</li>
|
||
<li><strong>Furação em CNC:</strong> Furos precisos conforme projeto</li>
|
||
<li><strong>Pintura epóxi:</strong> Proteção anticorrosiva</li>
|
||
<li><strong>Galvanização:</strong> Imersão a quente (sob encomenda)</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⚠️ Recomendações de Uso</h3>
|
||
<div style="padding: 16px; background: var(--color-bg-2); border-left: 4px solid var(--color-primary); border-radius: 8px;">
|
||
<ul style="margin: 0;">
|
||
<li><strong>Verificar flambagem:</strong> Cantoneiras são suscetíveis à flambagem lateral</li>
|
||
<li><strong>Considerar peso:</strong> Planejar transporte e içamento adequados</li>
|
||
<li><strong>Furação fácil:</strong> Ideal para conexões parafusadas</li>
|
||
<li><strong>Soldagem:</strong> Pré-aquecimento pode ser necessário para espessuras >12mm</li>
|
||
<li><strong>Proteção:</strong> Pintura ou galvanização recomendada para ambientes agressivos</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📚 Observações Técnicas</h3>
|
||
<ul>
|
||
<li>Comercializado em feixes com cintas de aço</li>
|
||
<li>Tolerâncias conforme NBR 9064: ±10mm comprimento</li>
|
||
<li>Acabamento rugoso padrão (escamas de laminação)</li>
|
||
<li>Identificação por tinta ou etiqueta no feixe</li>
|
||
<li>Certificado de qualidade 3.1 disponível sob solicitação</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
`;
|
||
|
||
|
||
// Auto-carregar dados das cantoneiras quando o conteúdo for renderizado
|
||
(function() {
|
||
console.log('🚀 Script inline de auto-carregamento executado');
|
||
|
||
// Aguardar um pouco para garantir que o DOM está pronto
|
||
setTimeout(async function() {
|
||
console.log('⏰ Timeout executado, tentando carregar cantoneiras...');
|
||
|
||
const tbody = document.getElementById('cantoneiras-tbody');
|
||
if (!tbody) {
|
||
console.error('❌ Elemento tbody não encontrado no auto-load');
|
||
return;
|
||
}
|
||
|
||
console.log('✅ Elemento tbody encontrado, iniciando carregamento...');
|
||
|
||
// Verificar se a função existe
|
||
if (typeof carregarCantoneiras === 'function') {
|
||
console.log('✅ Função carregarCantoneiras encontrada, executando...');
|
||
await carregarCantoneiras();
|
||
} else {
|
||
console.error('❌ Função carregarCantoneiras não encontrada');
|
||
console.log('Tentando carregamento direto...');
|
||
|
||
// Fallback: carregar diretamente
|
||
try {
|
||
const response = await fetch('BD/perfis/cantoneiras_brasil_completo.csv');
|
||
if (!response.ok) throw new Error('Erro ao carregar CSV');
|
||
|
||
const csvText = await response.text();
|
||
const linhas = csvText.trim().split('\\n');
|
||
|
||
const dados = [];
|
||
for (let i = 1; i < linhas.length; i++) {
|
||
const linha = linhas[i].trim();
|
||
if (!linha) continue;
|
||
|
||
const colunas = linha.split(',');
|
||
if (colunas.length >= 9) {
|
||
dados.push({
|
||
id: colunas[0].trim(),
|
||
nome: colunas[1].trim(),
|
||
lado_mm: parseFloat(colunas[2]),
|
||
espessura_mm: parseFloat(colunas[3]),
|
||
peso_kg_m: parseFloat(colunas[4]),
|
||
area_cm2: parseFloat(colunas[5]),
|
||
momento_inercia_cm4: parseFloat(colunas[6]),
|
||
raio_giracao_cm: parseFloat(colunas[7]),
|
||
tipo: colunas[8].trim()
|
||
});
|
||
}
|
||
}
|
||
|
||
console.log('✅ Dados carregados:', dados.length, 'cantoneiras');
|
||
|
||
// Exibir na tabela
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>\${item.nome}</strong></td>
|
||
<td>\${item.lado_mm}</td>
|
||
<td>\${item.espessura_mm}</td>
|
||
<td>\${item.peso_kg_m.toFixed(2)}</td>
|
||
<td>\${item.area_cm2.toFixed(2)}</td>
|
||
<td>\${item.momento_inercia_cm4.toFixed(2)}</td>
|
||
<td>\${item.raio_giracao_cm.toFixed(2)}</td>
|
||
<td><span class="badge">\${item.tipo}</span></td>
|
||
<td><button class="btn btn-sm btn-primary">👁️ Ver</button></td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
console.log('✅ Tabela preenchida com sucesso!');
|
||
|
||
} catch (error) {
|
||
console.error('❌ Erro no fallback:', error);
|
||
tbody.innerHTML = `
|
||
<tr>
|
||
<td colspan="9" style="text-align: center; padding: 20px; color: #ef4444;">
|
||
❌ Erro ao carregar dados: \${error.message}
|
||
<br><br>
|
||
<button class="btn btn-primary" onclick="location.reload()">🔄 Recarregar Página</button>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
}
|
||
}
|
||
}, 500); // Aguardar 500ms
|
||
})();
|
||
|
||
|
||
|
||
}
|
||
|
||
// Função para trocar tabs de perfis
|
||
/* Removido: definição duplicada de switchPerfilTab (versão simplificada) */
|
||
|
||
// Função para calcular preço de cantoneira
|
||
function calcularPrecoCantoneira() {
|
||
const peso = parseFloat(document.getElementById('calc-peso').value);
|
||
const comprimento = parseFloat(document.getElementById('calc-comprimento').value);
|
||
const quantidade = parseInt(document.getElementById('calc-quantidade').value);
|
||
const precoKg = parseFloat(document.getElementById('calc-preco-kg').value);
|
||
|
||
const pesoTotal = peso * comprimento * quantidade;
|
||
const precoTotal = pesoTotal * precoKg;
|
||
|
||
document.getElementById('calc-resultado').innerHTML = `
|
||
<div class="card" style="background: var(--color-success); color: white;">
|
||
<h3 style="margin: 0 0 12px 0;">💰 Resultado do Cálculo</h3>
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px;">
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Peso Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">${pesoTotal.toFixed(2)} kg</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ ${precoTotal.toFixed(2)}</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço por Peça</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ ${(precoTotal / quantidade).toFixed(2)}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
// Exportar funções
|
||
window.getCantoneirasContent = getCantoneirasContent;
|
||
window.calcularPrecoCantoneira = calcularPrecoCantoneira;
|
||
|
||
|
||
// ========================================
|
||
// CARREGAMENTO E FILTROS DE DADOS
|
||
// ========================================
|
||
|
||
// Cache de dados
|
||
let cantoneirasData = [];
|
||
|
||
// FUNÇÕES DE CARREGAMENTO DE DADOS
|
||
// ========================================
|
||
|
||
/**
|
||
* Carrega e exibe dados das cantoneiras do CSV
|
||
* VERSÃO ATUALIZADA: Usa Data Manager para cache inteligente
|
||
*/
|
||
async function carregarCantoneiras() {
|
||
console.log('📊 carregarCantoneiras() - INICIANDO');
|
||
console.log('🔍 Verificando disponibilidade:');
|
||
console.log(' - carregarCantoneirasV2:', typeof carregarCantoneirasV2);
|
||
console.log(' - window.dataManager:', typeof window.dataManager);
|
||
console.log(' - exibirCantoneirasV2:', typeof exibirCantoneirasV2);
|
||
|
||
// Aguardar Data Manager estar pronto (máximo 3 segundos)
|
||
let tentativas = 0;
|
||
while (!window.dataManager && tentativas < 30) {
|
||
console.log(`⏳ Aguardando Data Manager... (tentativa ${tentativas + 1}/30)`);
|
||
await new Promise(resolve => setTimeout(resolve, 100));
|
||
tentativas++;
|
||
}
|
||
|
||
// Verificar se Data Manager está disponível
|
||
if (typeof carregarCantoneirasV2 === 'function' && window.dataManager) {
|
||
console.log('✅ Usando Data Manager V2');
|
||
await carregarCantoneirasV2();
|
||
} else {
|
||
console.warn('⚠️ Data Manager V2 não disponível após espera. Usando método legado...');
|
||
console.log(' Motivo:', !window.dataManager ? 'dataManager não existe' : 'carregarCantoneirasV2 não é função');
|
||
// Fallback para método antigo se necessário
|
||
try {
|
||
const response = await fetch('BD/perfis/cantoneiras_brasil_completo.csv');
|
||
if (!response.ok) {
|
||
throw new Error(`HTTP error! status: ${response.status}`);
|
||
}
|
||
|
||
const csvText = await response.text();
|
||
const linhas = csvText.trim().split('\n');
|
||
|
||
const dados = [];
|
||
for (let i = 1; i < linhas.length; i++) {
|
||
const linha = linhas[i].trim();
|
||
if (!linha) continue;
|
||
|
||
const colunas = linha.split(',');
|
||
if (colunas.length >= 9) {
|
||
dados.push({
|
||
id: colunas[0].trim(),
|
||
nome: colunas[1].trim(),
|
||
lado_mm: parseFloat(colunas[2]),
|
||
espessura_mm: parseFloat(colunas[3]),
|
||
peso_kg_m: parseFloat(colunas[4]),
|
||
area_cm2: parseFloat(colunas[5]),
|
||
momento_inercia_cm4: parseFloat(colunas[6]),
|
||
raio_giracao_cm: parseFloat(colunas[7]),
|
||
tipo: colunas[8].trim()
|
||
});
|
||
}
|
||
}
|
||
|
||
window.cantoneirasData = dados;
|
||
exibirCantoneiras(dados);
|
||
|
||
} catch (error) {
|
||
console.error('❌ Erro ao carregar cantoneiras:', error);
|
||
document.getElementById('cantoneiras-tbody').innerHTML = `
|
||
<tr>
|
||
<td colspan="9" style="text-align: center; padding: 20px; color: var(--color-error);">
|
||
❌ Erro ao carregar dados: ${error.message}
|
||
</td>
|
||
</tr>
|
||
`;
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Exibe cantoneiras na tabela
|
||
*/
|
||
function exibirCantoneiras(dados) {
|
||
console.log('📋 exibirCantoneiras() chamada com', dados?.length, 'itens');
|
||
|
||
const tbody = document.getElementById('cantoneiras-tbody');
|
||
if (!tbody) {
|
||
console.error('❌ Elemento cantoneiras-tbody NÃO encontrado!');
|
||
return;
|
||
}
|
||
console.log('✅ Elemento tbody encontrado:', tbody);
|
||
|
||
if (!dados || dados.length === 0) {
|
||
console.warn('⚠️ Nenhum dado para exibir');
|
||
tbody.innerHTML = `
|
||
<tr>
|
||
<td colspan="9" style="text-align: center; padding: 20px;">
|
||
Nenhuma cantoneira encontrada
|
||
</td>
|
||
</tr>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
console.log('✅ Gerando HTML para', dados.length, 'cantoneiras...');
|
||
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>${item.nome}</strong></td>
|
||
<td>${item.lado_mm}</td>
|
||
<td>${item.espessura_mm}</td>
|
||
<td>${item.peso_kg_m.toFixed(2)}</td>
|
||
<td>${item.area_cm2.toFixed(2)}</td>
|
||
<td>${item.momento_inercia_cm4.toFixed(2)}</td>
|
||
<td>${item.raio_giracao_cm.toFixed(2)}</td>
|
||
<td><span class="badge badge-${getBadgeColor(item.tipo)}">${item.tipo}</span></td>
|
||
<td>
|
||
<button class="btn btn-sm btn-primary" onclick="verDetalhesCantoneira('${item.id}')">
|
||
👁️ Ver
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
// Atualizar contador
|
||
const totalEl = document.getElementById('cant-total');
|
||
if (totalEl) {
|
||
totalEl.textContent = dados.length;
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Retorna cor do badge baseado no tipo
|
||
*/
|
||
function getBadgeColor(tipo) {
|
||
const cores = {
|
||
'Pequena': 'info',
|
||
'Média': 'success',
|
||
'Grande': 'warning',
|
||
'Muito Grande': 'warning',
|
||
'Extra-Grande': 'error',
|
||
'Massiva': 'error'
|
||
};
|
||
return cores[tipo] || 'info';
|
||
}
|
||
|
||
/**
|
||
* Filtra cantoneiras baseado nos critérios
|
||
* VERSÃO ATUALIZADA: Usa Data Manager V2 se disponível
|
||
*/
|
||
function filtrarCantoneiras() {
|
||
// Usar versão V2 se disponível
|
||
if (typeof filtrarCantoneirasV2 === 'function') {
|
||
filtrarCantoneirasV2();
|
||
return;
|
||
}
|
||
|
||
// Fallback para versão legada
|
||
if (!window.cantoneirasData) {
|
||
console.warn('⚠️ Dados não carregados ainda');
|
||
return;
|
||
}
|
||
|
||
const tamanho = document.getElementById('cant-tamanho')?.value || '';
|
||
const pesoMax = parseFloat(document.getElementById('cant-peso-max')?.value) || Infinity;
|
||
const busca = document.getElementById('cant-busca')?.value.toLowerCase() || '';
|
||
|
||
const filtrados = window.cantoneirasData.filter(item => {
|
||
const matchTamanho = !tamanho || item.tipo === tamanho;
|
||
const matchPeso = item.peso_kg_m <= pesoMax;
|
||
const matchBusca = !busca || item.nome.toLowerCase().includes(busca);
|
||
|
||
return matchTamanho && matchPeso && matchBusca;
|
||
});
|
||
|
||
console.log(`🔍 Filtrados: ${filtrados.length} de ${window.cantoneirasData.length}`);
|
||
exibirCantoneiras(filtrados);
|
||
}
|
||
|
||
/**
|
||
* Limpa filtros
|
||
* VERSÃO ATUALIZADA: Usa Data Manager V2 se disponível
|
||
*/
|
||
function limparFiltrosCantoneiras() {
|
||
// Usar versão V2 se disponível
|
||
if (typeof limparFiltrosCantoneirasV2 === 'function') {
|
||
limparFiltrosCantoneirasV2();
|
||
return;
|
||
}
|
||
|
||
// Fallback para versão legada
|
||
const tamanhoEl = document.getElementById('cant-tamanho');
|
||
const pesoEl = document.getElementById('cant-peso-max');
|
||
const buscaEl = document.getElementById('cant-busca');
|
||
|
||
if (tamanhoEl) tamanhoEl.value = '';
|
||
if (pesoEl) pesoEl.value = '';
|
||
if (buscaEl) buscaEl.value = '';
|
||
|
||
if (window.cantoneirasData) {
|
||
exibirCantoneiras(window.cantoneirasData);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Mostra detalhes de uma cantoneira específica
|
||
*/
|
||
function verDetalhesCantoneira(id) {
|
||
if (!window.cantoneirasData) return;
|
||
|
||
const item = window.cantoneirasData.find(c => c.id === id);
|
||
if (!item) return;
|
||
|
||
// Criar modal com detalhes
|
||
const modalHTML = `
|
||
<div class="modal active" id="modal-detalhes-cant" onclick="fecharModalDetalhes(event)">
|
||
<div class="modal-content" onclick="event.stopPropagation()">
|
||
<div class="modal-header">
|
||
<div class="modal-title">📐 ${item.nome} - Detalhes Completos</div>
|
||
<button class="close-btn" onclick="fecharModalDetalhes()">×</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📏 Dimensões</h3>
|
||
<ul>
|
||
<li><strong>Lado:</strong> ${item.lado_mm} mm</li>
|
||
<li><strong>Espessura:</strong> ${item.espessura_mm} mm</li>
|
||
<li><strong>Categoria:</strong> ${item.tipo}</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⚖️ Propriedades de Massa</h3>
|
||
<ul>
|
||
<li><strong>Peso Linear:</strong> ${item.peso_kg_m.toFixed(2)} kg/m</li>
|
||
<li><strong>Área da Seção:</strong> ${item.area_cm2.toFixed(2)} cm²</li>
|
||
<li><strong>Peso por barra 6m:</strong> ${(item.peso_kg_m * 6).toFixed(2)} kg</li>
|
||
<li><strong>Peso por barra 12m:</strong> ${(item.peso_kg_m * 12).toFixed(2)} kg</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔧 Propriedades Geométricas</h3>
|
||
<ul>
|
||
<li><strong>Momento de Inércia:</strong> ${item.momento_inercia_cm4.toFixed(2)} cm⁴</li>
|
||
<li><strong>Raio de Giração:</strong> ${item.raio_giracao_cm.toFixed(2)} cm</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">💰 Estimativa de Preço</h3>
|
||
<p><strong>Preço estimado:</strong> R$ ${(item.peso_kg_m * 5.5).toFixed(2)}/m (baseado em R$ 5,50/kg)</p>
|
||
<p><em>* Preços podem variar conforme região, volume e fornecedor</em></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
|
||
// Adicionar ao body
|
||
const modalDiv = document.createElement('div');
|
||
modalDiv.innerHTML = modalHTML;
|
||
document.body.appendChild(modalDiv.firstElementChild);
|
||
}
|
||
|
||
/**
|
||
* Fecha modal de detalhes
|
||
*/
|
||
function fecharModalDetalhes(event) {
|
||
if (event && event.target.className !== 'modal active') return;
|
||
|
||
const modal = document.getElementById('modal-detalhes-cant');
|
||
if (modal) {
|
||
modal.remove();
|
||
}
|
||
}
|
||
|
||
/**
|
||
* Adiciona CSS para badges
|
||
*/
|
||
if (!document.getElementById('perfis-catalog-styles')) {
|
||
const style = document.createElement('style');
|
||
style.id = 'perfis-catalog-styles';
|
||
style.textContent = `
|
||
.badge {
|
||
display: inline-block;
|
||
padding: 4px 8px;
|
||
border-radius: 4px;
|
||
font-size: 11px;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
}
|
||
.badge-info {
|
||
background: rgba(59, 130, 246, 0.15);
|
||
color: #3b82f6;
|
||
border: 1px solid rgba(59, 130, 246, 0.3);
|
||
}
|
||
.badge-success {
|
||
background: rgba(34, 197, 94, 0.15);
|
||
color: #22c55e;
|
||
border: 1px solid rgba(34, 197, 94, 0.3);
|
||
}
|
||
.badge-warning {
|
||
background: rgba(245, 158, 11, 0.15);
|
||
color: #f59e0b;
|
||
border: 1px solid rgba(245, 158, 11, 0.3);
|
||
}
|
||
.badge-error {
|
||
background: rgba(239, 68, 68, 0.15);
|
||
color: #ef4444;
|
||
border: 1px solid rgba(239, 68, 68, 0.3);
|
||
}
|
||
.table-container {
|
||
overflow-x: auto;
|
||
margin: 16px 0;
|
||
}
|
||
.table-container table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
font-size: 13px;
|
||
}
|
||
.table-container th {
|
||
background: var(--color-bg-2);
|
||
padding: 10px;
|
||
text-align: left;
|
||
font-weight: 700;
|
||
border-bottom: 2px solid var(--color-border);
|
||
color: var(--color-gray-200); /* texto muito claro para alto contraste */
|
||
}
|
||
.table-container th sup {
|
||
color: inherit;
|
||
font-weight: 700;
|
||
opacity: 1;
|
||
}
|
||
.table-container td {
|
||
padding: 8px 10px;
|
||
border-bottom: 1px solid var(--color-border);
|
||
}
|
||
.table-container tr:hover {
|
||
background: var(--color-bg-1);
|
||
}
|
||
.btn-sm {
|
||
padding: 4px 8px;
|
||
font-size: 12px;
|
||
}
|
||
`;
|
||
document.head.appendChild(style);
|
||
}
|
||
|
||
console.log('✅ Funções de carregamento de cantoneiras registradas');
|
||
|
||
|
||
|
||
|
||
// ========================================
|
||
// FUNÇÕES PLACEHOLDER PARA OUTROS PERFIS
|
||
// ========================================
|
||
|
||
function getBarrasRedondasContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">⚫ Barras Redondas</div>
|
||
<div class="section-description">Catálogo completo de barras redondas estruturais</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchTab(0)" data-tab="0">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchTab(1)" data-tab="1">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchTab(2)" data-tab="2">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchTab(3)" data-tab="3">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchTab(4)" data-tab="4">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
|
||
<div>
|
||
<h3 style="margin: 0; color: var(--color-primary);">📊 Barras Redondas Disponíveis</h3>
|
||
<p style="margin: 8px 0 0 0; color: var(--color-text-secondary);">
|
||
Total: <strong id="barras_redondas-total">-</strong> diâmetros
|
||
</p>
|
||
</div>
|
||
<button class="btn btn-primary" onclick="forcarCarregamentoBarrasRedondas()">
|
||
🔄 Recarregar Dados
|
||
</button>
|
||
</div>
|
||
|
||
<div style="overflow-x: auto;">
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Diâmetro (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Área (cm²)</th>
|
||
<th>Categoria</th>
|
||
<th>Ações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="barras_redondas-tbody">
|
||
<tr>
|
||
<td colspan="6" style="text-align: center; padding: 40px;">
|
||
<div style="font-size: 48px; margin-bottom: 16px;">⏳</div>
|
||
<div style="font-size: 18px; font-weight: bold;">Carregando barras redondas...</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">📋 Especificações Técnicas Completas</h3>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔧 Descrição Geral</h4>
|
||
<p><strong>Barras redondas laminadas a quente e trefiladas</strong></p>
|
||
<p>Perfis maciços circulares amplamente utilizados em construção mecânica, estruturas, eixos e componentes. Fabricados por laminação a quente ou trefilação a frio para melhor acabamento.</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📏 Faixa de Dimensões</h4>
|
||
<ul>
|
||
<li><strong>Diâmetros:</strong> 6mm a 200mm</li>
|
||
<li><strong>Comprimentos padrão:</strong> 6m, 12m</li>
|
||
<li><strong>Quantidade de modelos:</strong> 25+ diâmetros</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Distribuição dos Modelos</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Diâmetros</th>
|
||
<th>Aplicações Típicas</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><span class="badge badge-info">Pequeno</span></td>
|
||
<td>6 - 16mm</td>
|
||
<td>Pinos, parafusos, tirantes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-info">Médio</span></td>
|
||
<td>20 - 50mm</td>
|
||
<td>Eixos, barras de ligação</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-warning">Grande</span></td>
|
||
<td>60 - 100mm</td>
|
||
<td>Eixos pesados, componentes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-danger">Massivo</span></td>
|
||
<td>120 - 200mm</td>
|
||
<td>Eixos industriais, forjaria</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔬 Qualidades Disponíveis (SAE)</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Qualidade</th>
|
||
<th>Aplicação</th>
|
||
<th>Tratamento</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>SAE 1020</td>
|
||
<td>Uso geral estrutural</td>
|
||
<td>Laminado a quente</td>
|
||
</tr>
|
||
<tr>
|
||
<td>SAE 1045</td>
|
||
<td>Eixos e componentes mecânicos</td>
|
||
<td>Normalizado ou T&R</td>
|
||
</tr>
|
||
<tr>
|
||
<td>SAE 4140</td>
|
||
<td>Alta resistência</td>
|
||
<td>Temperado e revenido</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🏭 Fabricantes no Brasil</h3>
|
||
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Fabricante</th>
|
||
<th>Localização</th>
|
||
<th>Gama de Produtos</th>
|
||
<th>Especialidade</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Gerdau</strong></td>
|
||
<td>Múltiplas plantas</td>
|
||
<td>Completa (6-200mm)</td>
|
||
<td>Principal fornecedor</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>ArcelorMittal</strong></td>
|
||
<td>Juiz de Fora (MG)</td>
|
||
<td>Média (20-100mm)</td>
|
||
<td>Qualidades especiais</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Villares Metals</strong></td>
|
||
<td>Sumaré (SP)</td>
|
||
<td>Especiais</td>
|
||
<td>Aços liga</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Aços Nobre</strong></td>
|
||
<td>São Paulo (SP)</td>
|
||
<td>Pequena a Média</td>
|
||
<td>Trefilados</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">📦 Comprimentos Comerciais</h4>
|
||
<p><strong>Padrão:</strong> 6m, 12m</p>
|
||
<p><strong>Especiais:</strong> Sob consulta</p>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">⏱️ Prazos de Entrega</h4>
|
||
<ul>
|
||
<li><strong>Estoque:</strong> 2-3 dias</li>
|
||
<li><strong>Sob encomenda:</strong> 5-10 dias</li>
|
||
<li><strong>Especiais:</strong> 15-30 dias</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">💰 Preços 2025</h3>
|
||
|
||
<div style="background: var(--color-warning); padding: 16px; border-radius: 8px; margin-bottom: 20px;">
|
||
<strong>⚠️ Preços de Referência:</strong> Valores médios de mercado. Consulte fornecedores para cotação atualizada.
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">💵 Faixa de Preços</h4>
|
||
<p><strong>Preço base:</strong> R$ 5,50 - R$ 8,50 por kg</p>
|
||
<p><strong>Variação por região:</strong> ±8-12%</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Fatores de Preço</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Situação</th>
|
||
<th>Variação</th>
|
||
<th>Observação</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>Diâmetros pequenos (6-12mm)</td>
|
||
<td><span class="badge badge-warning">+10%</span></td>
|
||
<td>Trefilados</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Qualidades especiais (4140, 4340)</td>
|
||
<td><span class="badge badge-danger">+30%</span></td>
|
||
<td>Aços liga</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Tratamento térmico</td>
|
||
<td><span class="badge badge-warning">+20%</span></td>
|
||
<td>T&R</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Quantidade >5 toneladas</td>
|
||
<td><span class="badge badge-success">-12%</span></td>
|
||
<td>Desconto volume</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📋 Normas Aplicáveis</h4>
|
||
<ul>
|
||
<li><strong>ABNT NBR 6006</strong> - Barras laminadas a quente</li>
|
||
<li><strong>ASTM A36</strong> - Aço estrutural carbono</li>
|
||
<li><strong>SAE J403</strong> - Classificação de aços carbono</li>
|
||
<li><strong>DIN 1013</strong> - Barras redondas (referência)</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🔧 Aplicações Principais</h3>
|
||
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px;">
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏗️ Construção Civil</h4>
|
||
<ul>
|
||
<li>Tirantes e ancoragens</li>
|
||
<li>Barras de ligação</li>
|
||
<li>Pinos estruturais</li>
|
||
<li>Elementos de fixação</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">⚙️ Mecânica</h4>
|
||
<ul>
|
||
<li>Eixos de transmissão</li>
|
||
<li>Componentes usinados</li>
|
||
<li>Pinos e buchas</li>
|
||
<li>Parafusos especiais</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏭 Industrial</h4>
|
||
<ul>
|
||
<li>Eixos industriais</li>
|
||
<li>Componentes de máquinas</li>
|
||
<li>Ferramentas</li>
|
||
<li>Matrizes e punções</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🔩 Fixação</h4>
|
||
<ul>
|
||
<li>Parafusos customizados</li>
|
||
<li>Pinos de cisalhamento</li>
|
||
<li>Rebites</li>
|
||
<li>Elementos de união</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">✅ Recomendações de Uso</h4>
|
||
<ul>
|
||
<li>✓ Verificar tolerância dimensional (h11 laminado, h9 trefilado)</li>
|
||
<li>✓ Considerar sobremetal para usinagem</li>
|
||
<li>✓ Tratamento térmico para aplicações mecânicas</li>
|
||
<li>✓ Soldagem requer pré-aquecimento em diâmetros >50mm</li>
|
||
<li>✓ Acabamento superficial: laminado (rugoso) ou trefilado (liso)</li>
|
||
<li>✓ Verificar retidão (máx 3mm/m)</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getTubosCircularesContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">⭕ Tubos Circulares</div>
|
||
<div class="section-description">Catálogo completo de tubos circulares estruturais</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchTab(0)" data-tab="0">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchTab(1)" data-tab="1">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchTab(2)" data-tab="2">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchTab(3)" data-tab="3">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchTab(4)" data-tab="4">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
|
||
<div>
|
||
<h3 style="margin: 0; color: var(--color-primary);">📊 Tubos Circulares Disponíveis</h3>
|
||
<p style="margin: 8px 0 0 0; color: var(--color-text-secondary);">
|
||
Total: <strong id="tubos_circulares-total">-</strong> perfis
|
||
</p>
|
||
</div>
|
||
<button class="btn btn-primary" onclick="forcarCarregamentoTubosCirculares()">
|
||
🔄 Recarregar Dados
|
||
</button>
|
||
</div>
|
||
|
||
<div style="overflow-x: auto;">
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Diâmetro (mm)</th>
|
||
<th>Espessura (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Área (cm²)</th>
|
||
<th>Categoria</th>
|
||
<th>Ações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="tubos_circulares-tbody">
|
||
<tr>
|
||
<td colspan="7" style="text-align: center; padding: 40px;">
|
||
<div style="font-size: 48px; margin-bottom: 16px;">⏳</div>
|
||
<div style="font-size: 18px; font-weight: bold;">Carregando tubos circulares...</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">📋 Especificações Técnicas Completas</h3>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔧 Descrição Geral</h4>
|
||
<p><strong>Tubos estruturais circulares sem costura e soldados</strong></p>
|
||
<p>Perfis tubulares versáteis com excelente resistência à compressão e torção. Fabricados por soldagem longitudinal ou processo sem costura para aplicações críticas.</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📏 Faixa de Dimensões</h4>
|
||
<ul>
|
||
<li><strong>Diâmetros:</strong> 21mm (3/4") a 610mm (24")</li>
|
||
<li><strong>Espessuras:</strong> 2mm a 25mm</li>
|
||
<li><strong>Quantidade de modelos:</strong> 40+ perfis</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Distribuição dos Modelos</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Diâmetros</th>
|
||
<th>Aplicações Típicas</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><span class="badge badge-info">Pequeno</span></td>
|
||
<td>21 - 60mm</td>
|
||
<td>Estruturas leves, guarda-corpos</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-info">Médio</span></td>
|
||
<td>76 - 114mm</td>
|
||
<td>Colunas, treliças</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-warning">Grande</span></td>
|
||
<td>140 - 273mm</td>
|
||
<td>Torres, estruturas pesadas</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-danger">Massivo</span></td>
|
||
<td>323 - 610mm</td>
|
||
<td>Estacas, pilares principais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔬 Qualidades Disponíveis</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Qualidade</th>
|
||
<th>Fy (MPa)</th>
|
||
<th>Fu (MPa)</th>
|
||
<th>Aplicação</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>ASTM A53 Gr.B</td>
|
||
<td>240</td>
|
||
<td>415</td>
|
||
<td>Uso geral estrutural</td>
|
||
</tr>
|
||
<tr>
|
||
<td>ASTM A500 Gr.B</td>
|
||
<td>290</td>
|
||
<td>400</td>
|
||
<td>Estruturas soldadas</td>
|
||
</tr>
|
||
<tr>
|
||
<td>API 5L Gr.B</td>
|
||
<td>245</td>
|
||
<td>415</td>
|
||
<td>Transporte e estruturas</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🏭 Fabricantes no Brasil</h3>
|
||
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Fabricante</th>
|
||
<th>Localização</th>
|
||
<th>Gama de Produtos</th>
|
||
<th>Especialidade</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Vallourec</strong></td>
|
||
<td>Belo Horizonte (MG)</td>
|
||
<td>Completa</td>
|
||
<td>Sem costura premium</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Gerdau</strong></td>
|
||
<td>Múltiplas plantas</td>
|
||
<td>Pequena a Média</td>
|
||
<td>Soldados estruturais</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Confab</strong></td>
|
||
<td>Pindamonhangaba (SP)</td>
|
||
<td>Média a Grande</td>
|
||
<td>Tubos industriais</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>V&M do Brasil</strong></td>
|
||
<td>Belo Horizonte (MG)</td>
|
||
<td>Especiais</td>
|
||
<td>Alta pressão</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Tupy</strong></td>
|
||
<td>Joinville (SC)</td>
|
||
<td>Média</td>
|
||
<td>Fundidos especiais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">📦 Comprimentos Comerciais</h4>
|
||
<p><strong>Padrão:</strong> 6m, 12m</p>
|
||
<p><strong>Especiais:</strong> Sob consulta (até 18m)</p>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">⏱️ Prazos de Entrega</h4>
|
||
<ul>
|
||
<li><strong>Estoque:</strong> 3-5 dias</li>
|
||
<li><strong>Sob encomenda:</strong> 10-15 dias</li>
|
||
<li><strong>Sem costura:</strong> 20-30 dias</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">💰 Preços 2025</h3>
|
||
|
||
<div style="background: var(--color-warning); padding: 16px; border-radius: 8px; margin-bottom: 20px;">
|
||
<strong>⚠️ Preços de Referência:</strong> Valores médios de mercado. Consulte fornecedores para cotação atualizada.
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">💵 Faixa de Preços</h4>
|
||
<p><strong>Soldados:</strong> R$ 6,00 - R$ 9,00 por kg</p>
|
||
<p><strong>Sem costura:</strong> R$ 10,00 - R$ 15,00 por kg</p>
|
||
<p><strong>Variação por região:</strong> ±10-15%</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Fatores de Preço</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Situação</th>
|
||
<th>Variação</th>
|
||
<th>Observação</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>Sem costura</td>
|
||
<td><span class="badge badge-danger">+50%</span></td>
|
||
<td>Processo premium</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Diâmetros pequenos (<60mm)</td>
|
||
<td><span class="badge badge-warning">+15%</span></td>
|
||
<td>Menor demanda</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Paredes grossas (>12mm)</td>
|
||
<td><span class="badge badge-warning">+10%</span></td>
|
||
<td>Processo especial</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Quantidade >15 toneladas</td>
|
||
<td><span class="badge badge-success">-18%</span></td>
|
||
<td>Desconto volume</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Teste hidrostático</td>
|
||
<td><span class="badge badge-warning">+taxa</span></td>
|
||
<td>Serviço adicional</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📋 Normas Aplicáveis</h4>
|
||
<ul>
|
||
<li><strong>ABNT NBR 5580</strong> - Tubos de aço carbono</li>
|
||
<li><strong>ASTM A53</strong> - Tubos soldados e sem costura</li>
|
||
<li><strong>ASTM A500</strong> - Tubos estruturais formados a frio</li>
|
||
<li><strong>API 5L</strong> - Tubos para transporte</li>
|
||
<li><strong>EN 10210-1</strong> - Perfis estruturais acabados a quente</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🔧 Aplicações Principais</h3>
|
||
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px;">
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏗️ Construção Civil</h4>
|
||
<ul>
|
||
<li>Colunas estruturais</li>
|
||
<li>Torres e mastros</li>
|
||
<li>Treliças espaciais</li>
|
||
<li>Guarda-corpos</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🌉 Infraestrutura</h4>
|
||
<ul>
|
||
<li>Estacas metálicas</li>
|
||
<li>Pontes e passarelas</li>
|
||
<li>Postes de iluminação</li>
|
||
<li>Estruturas de sinalização</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏭 Industrial</h4>
|
||
<ul>
|
||
<li>Tubulações estruturais</li>
|
||
<li>Suportes de equipamentos</li>
|
||
<li>Plataformas industriais</li>
|
||
<li>Estruturas de máquinas</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">⚓ Offshore</h4>
|
||
<ul>
|
||
<li>Plataformas marítimas</li>
|
||
<li>Jaquetas estruturais</li>
|
||
<li>Risers estruturais</li>
|
||
<li>Estruturas submarinas</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">✅ Recomendações de Uso</h4>
|
||
<ul>
|
||
<li>✓ Excelente resistência à compressão e torção</li>
|
||
<li>✓ Sem costura para aplicações críticas (alta pressão)</li>
|
||
<li>✓ Soldados para estruturas gerais (mais econômico)</li>
|
||
<li>✓ Teste hidrostático recomendado para aplicações críticas</li>
|
||
<li>✓ Tolerância dimensional: ±1% diâmetro, ±10% espessura</li>
|
||
<li>✓ Soldagem com E7018 ou GMAW (ER70S-6)</li>
|
||
<li>✓ Verificar flambagem local em paredes finas (D/t > 50)</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getPerfisIContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">🏛️ Perfis I (IPE)</div>
|
||
<div class="section-description">Catálogo completo de perfis I europeus</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchTab(0)" data-tab="0">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchTab(1)" data-tab="1">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchTab(2)" data-tab="2">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchTab(3)" data-tab="3">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchTab(4)" data-tab="4">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
|
||
<div>
|
||
<h3 style="margin: 0; color: var(--color-primary);">📊 Perfis I Disponíveis</h3>
|
||
<p style="margin: 8px 0 0 0; color: var(--color-text-secondary);">
|
||
Total: <strong id="perfis_i-total">-</strong> perfis
|
||
</p>
|
||
</div>
|
||
<button class="btn btn-primary" onclick="forcarCarregamentoPerfisI()">
|
||
🔄 Recarregar Dados
|
||
</button>
|
||
</div>
|
||
|
||
<div style="overflow-x: auto;">
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Altura (mm)</th>
|
||
<th>Largura Mesa (mm)</th>
|
||
<th>Esp. Alma (mm)</th>
|
||
<th>Esp. Mesa (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Categoria</th>
|
||
<th>Ações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="perfis_i-tbody">
|
||
<tr>
|
||
<td colspan="8" style="text-align: center; padding: 40px;">
|
||
<div style="font-size: 48px; margin-bottom: 16px;">⏳</div>
|
||
<div style="font-size: 18px; font-weight: bold;">Carregando perfis I...</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">📋 Especificações Técnicas Completas</h3>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔧 Descrição Geral</h4>
|
||
<p><strong>Perfis I laminados a quente padrão europeu (IPE)</strong></p>
|
||
<p>Perfis estruturais com seção em "I" otimizada para flexão. Mesas paralelas e alma esbelta proporcionam excelente relação resistência/peso. Padrão europeu amplamente utilizado no Brasil.</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📏 Faixa de Dimensões</h4>
|
||
<ul>
|
||
<li><strong>Alturas:</strong> 80mm (IPE 80) a 600mm (IPE 600)</li>
|
||
<li><strong>Pesos:</strong> 6kg/m a 122kg/m</li>
|
||
<li><strong>Quantidade de modelos:</strong> 18 perfis padrão</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Distribuição dos Modelos</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Perfis</th>
|
||
<th>Aplicações Típicas</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><span class="badge badge-info">Leve</span></td>
|
||
<td>IPE 80 - IPE 140</td>
|
||
<td>Vigas secundárias, estruturas leves</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-info">Médio</span></td>
|
||
<td>IPE 160 - IPE 240</td>
|
||
<td>Vigas principais, galpões</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-warning">Pesado</span></td>
|
||
<td>IPE 270 - IPE 360</td>
|
||
<td>Vigas de grande vão, pontes</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="badge badge-danger">Muito Pesado</span></td>
|
||
<td>IPE 400 - IPE 600</td>
|
||
<td>Estruturas críticas, grandes vãos</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">🔬 Qualidades Disponíveis</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Qualidade</th>
|
||
<th>Fy (MPa)</th>
|
||
<th>Fu (MPa)</th>
|
||
<th>Aplicação</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>EN S235JR</td>
|
||
<td>235</td>
|
||
<td>360</td>
|
||
<td>Uso geral estrutural</td>
|
||
</tr>
|
||
<tr>
|
||
<td>EN S275JR</td>
|
||
<td>275</td>
|
||
<td>430</td>
|
||
<td>Estruturas médias</td>
|
||
</tr>
|
||
<tr>
|
||
<td>EN S355J2</td>
|
||
<td>355</td>
|
||
<td>490</td>
|
||
<td>Alta resistência</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📐 Características Geométricas</h4>
|
||
<ul>
|
||
<li><strong>Mesas:</strong> Paralelas, largura constante</li>
|
||
<li><strong>Alma:</strong> Esbelta, otimizada para flexão</li>
|
||
<li><strong>Raio de concordância:</strong> 15mm (padrão)</li>
|
||
<li><strong>Inclinação das mesas:</strong> 0° (paralelas)</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🏭 Fabricantes no Brasil</h3>
|
||
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Fabricante</th>
|
||
<th>Localização</th>
|
||
<th>Gama de Produtos</th>
|
||
<th>Especialidade</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Gerdau</strong></td>
|
||
<td>Múltiplas plantas</td>
|
||
<td>IPE 80 - IPE 600</td>
|
||
<td>Linha completa</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>ArcelorMittal</strong></td>
|
||
<td>Juiz de Fora (MG)</td>
|
||
<td>IPE 100 - IPE 400</td>
|
||
<td>Perfis médios</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>CSN</strong></td>
|
||
<td>Volta Redonda (RJ)</td>
|
||
<td>IPE 160 - IPE 600</td>
|
||
<td>Perfis pesados</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Usiminas</strong></td>
|
||
<td>Ipatinga (MG)</td>
|
||
<td>IPE 120 - IPE 360</td>
|
||
<td>Qualidades especiais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">📦 Comprimentos Comerciais</h4>
|
||
<p><strong>Padrão:</strong> 12m, 13.5m</p>
|
||
<p><strong>Especiais:</strong> 6m, 9m, 15m (sob consulta)</p>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">⏱️ Prazos de Entrega</h4>
|
||
<ul>
|
||
<li><strong>Estoque (IPE 100-300):</strong> 5-7 dias</li>
|
||
<li><strong>Sob encomenda:</strong> 10-15 dias</li>
|
||
<li><strong>Perfis grandes (>400):</strong> 20-30 dias</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">💰 Preços 2025</h3>
|
||
|
||
<div style="background: var(--color-warning); padding: 16px; border-radius: 8px; margin-bottom: 20px;">
|
||
<strong>⚠️ Preços de Referência:</strong> Valores médios de mercado. Consulte fornecedores para cotação atualizada.
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">💵 Faixa de Preços</h4>
|
||
<p><strong>Preço base:</strong> R$ 7,00 - R$ 9,50 por kg</p>
|
||
<p><strong>Variação por região:</strong> ±10-12%</p>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📊 Fatores de Preço</h4>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Situação</th>
|
||
<th>Variação</th>
|
||
<th>Observação</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>Perfis pequenos (IPE 80-120)</td>
|
||
<td><span class="badge badge-warning">+12%</span></td>
|
||
<td>Menor demanda</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Perfis grandes (IPE 500-600)</td>
|
||
<td><span class="badge badge-warning">+15%</span></td>
|
||
<td>Produção especial</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Qualidade S355J2</td>
|
||
<td><span class="badge badge-warning">+8%</span></td>
|
||
<td>Aço de maior resistência</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Quantidade >25 toneladas</td>
|
||
<td><span class="badge badge-success">-15%</span></td>
|
||
<td>Desconto por volume</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Corte e furação</td>
|
||
<td><span class="badge badge-warning">+taxa</span></td>
|
||
<td>Serviços adicionais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div style="margin-bottom: 24px;">
|
||
<h4 style="color: var(--color-primary);">📋 Normas Aplicáveis</h4>
|
||
<ul>
|
||
<li><strong>ABNT NBR 5884</strong> - Perfil I estrutural de aço soldado</li>
|
||
<li><strong>EN 10025</strong> - Produtos laminados a quente</li>
|
||
<li><strong>EN 10034</strong> - Perfis I e H estruturais</li>
|
||
<li><strong>ASTM A992</strong> - Perfis estruturais (equivalente)</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary); margin-bottom: 20px;">🔧 Aplicações Principais</h3>
|
||
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px;">
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏗️ Construção Civil</h4>
|
||
<ul>
|
||
<li>Vigas principais e secundárias</li>
|
||
<li>Estruturas de galpões</li>
|
||
<li>Mezaninos e pisos</li>
|
||
<li>Coberturas metálicas</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🌉 Pontes e Viadutos</h4>
|
||
<ul>
|
||
<li>Vigas principais de pontes</li>
|
||
<li>Longarinas</li>
|
||
<li>Transversinas</li>
|
||
<li>Estruturas de passarelas</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏭 Industrial</h4>
|
||
<ul>
|
||
<li>Estruturas de máquinas</li>
|
||
<li>Suportes de equipamentos</li>
|
||
<li>Plataformas industriais</li>
|
||
<li>Pontes rolantes</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div style="background: var(--color-bg-2); padding: 16px; border-radius: 8px;">
|
||
<h4 style="color: var(--color-primary);">🏢 Edifícios</h4>
|
||
<ul>
|
||
<li>Vigas de piso</li>
|
||
<li>Estruturas de cobertura</li>
|
||
<li>Suportes de fachada</li>
|
||
<li>Estruturas mistas</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="margin-top: 24px;">
|
||
<h4 style="color: var(--color-primary);">✅ Recomendações de Uso</h4>
|
||
<ul>
|
||
<li>✓ Otimizado para flexão em torno do eixo forte</li>
|
||
<li>✓ Mesas paralelas facilitam ligações</li>
|
||
<li>✓ Verificar flambagem lateral com torção (FLT)</li>
|
||
<li>✓ Enrijecedores necessários em apoios concentrados</li>
|
||
<li>✓ Soldagem com E7018 ou GMAW recomendada</li>
|
||
<li>✓ Tolerância dimensional: ±3mm altura, ±2mm largura</li>
|
||
<li>✓ Verificar empenamento em perfis longos</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getPerfisWContent() {
|
||
console.log('🔧 getPerfisWContent() chamada');
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">🏗️ Perfis W (Wide Flange) - Catálogo Completo Brasil</div>
|
||
<div class="section-description">16 modelos comerciais • 4 séries (W150, W200, W250, W310)</div>
|
||
</div>
|
||
|
||
<!-- Tabs de Navegação (estrutura idêntica às Cantoneiras) -->
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- TAB 1: TABELA TÉCNICA -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card">
|
||
<div class="card-title">🔍 Filtros de Busca</div>
|
||
<div class="form-grid">
|
||
<div class="form-group">
|
||
<label class="form-label">Série</label>
|
||
<select class="form-control" id="w-serie" onchange="window._filtrarW()">
|
||
<option value="">Todas</option>
|
||
<option value="W150">W150</option>
|
||
<option value="W200">W200</option>
|
||
<option value="W250">W250</option>
|
||
<option value="W310">W310</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Peso Máximo (kg/m)</label>
|
||
<input type="number" class="form-control" id="w-peso-max" placeholder="Ex: 40" oninput="window._filtrarW()">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Buscar por Nome</label>
|
||
<input type="text" class="form-control" id="w-busca" placeholder="Ex: W200×22" oninput="window._filtrarW()">
|
||
</div>
|
||
</div>
|
||
<button class="btn btn-secondary" onclick="window._limparFiltrosW()">🔄 Limpar Filtros</button>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-title">
|
||
📊 Tabela de Perfis W (16 modelos)
|
||
</div>
|
||
<div id="w-table-container">
|
||
<div class="table-container">
|
||
<table id="w-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Altura (mm)</th>
|
||
<th>Largura (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Ix (cm⁴)</th>
|
||
<th>Wx (cm³)</th>
|
||
<th>Série</th>
|
||
<th>Preço 12m (R$)</th>
|
||
<th>Ações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="w-tbody">
|
||
<!-- Preenchido via script inline abaixo -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div style="margin-top: 16px; padding: 12px; background: var(--color-bg-2); border-radius: 8px;">
|
||
<strong>📌 Total:</strong> <span id="w-total">16</span> modelos disponíveis
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 2: ESPECIFICAÇÕES COMPLETAS -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">📋 Especificações Técnicas Completas</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔧 Descrição Geral</h3>
|
||
<p><strong>Perfis W (Wide Flange) laminados a quente, seção em H com mesas largas.</strong></p>
|
||
<p>Padrão ASTM amplamente utilizado no Brasil. Alta resistência à flexão com simetria dupla, ideal para vigas e colunas.</p>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📏 Faixa de Dimensões</h3>
|
||
<ul>
|
||
<li><strong>Altura:</strong> 150mm (W150) a 310mm (W310)</li>
|
||
<li><strong>Peso:</strong> 13 a 56 kg/m</li>
|
||
<li><strong>Quantidade de modelos:</strong> 16 perfis (4 por série)</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📦 Distribuição dos Modelos</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Série</th>
|
||
<th>Perfis</th>
|
||
<th>Quantidade</th>
|
||
<th>Aplicação Típica</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>W150</strong></td>
|
||
<td>13, 18, 24, 30 kg/m</td>
|
||
<td>4</td>
|
||
<td>Estruturas leves, vigas secundárias</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>W200</strong></td>
|
||
<td>15, 22, 31, 42 kg/m</td>
|
||
<td>4</td>
|
||
<td>Estruturas médias (padrão comercial)</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>W250</strong></td>
|
||
<td>17, 25, 38, 49 kg/m</td>
|
||
<td>4</td>
|
||
<td>Galpões e pórticos de 6-12m</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>W310</strong></td>
|
||
<td>21, 32, 44, 56 kg/m</td>
|
||
<td>4</td>
|
||
<td>Grandes vãos 10-16m</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔬 Qualidades Disponíveis (ASTM)</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Qualidade</th>
|
||
<th>Aplicação</th>
|
||
<th>Fy (MPa)</th>
|
||
<th>Fu (MPa)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>ASTM A36</strong></td>
|
||
<td>Uso geral</td>
|
||
<td>250</td>
|
||
<td>400</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>ASTM A572 Gr.50</strong></td>
|
||
<td>Alta resistência</td>
|
||
<td>345</td>
|
||
<td>450</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>ASTM A992</strong></td>
|
||
<td>Vigas/estruturas críticas</td>
|
||
<td>345</td>
|
||
<td>450</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📐 Comprimentos Comerciais</h3>
|
||
<ul>
|
||
<li><strong>Padrão:</strong> 12m, 13.5m, 15m</li>
|
||
<li><strong>Especiais:</strong> 6m, 9m, 18m (sob consulta)</li>
|
||
<li><strong>Tolerância:</strong> ±3mm (altura) | ±2mm (largura)</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🎨 Acabamentos Disponíveis</h3>
|
||
<ul>
|
||
<li><strong>Laminado a quente (padrão):</strong> Superfície com pátina</li>
|
||
<li><strong>Galvanizado (sob encomenda):</strong> +15-20% custo</li>
|
||
<li><strong>Pintura (ISO 12944 C3/C4/C5):</strong> 150-370 μm sistemas completos</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📜 Normas Aplicáveis</h3>
|
||
<ul>
|
||
<li><strong>ABNT NBR 5884</strong> - Perfis estruturais</li>
|
||
<li><strong>ABNT NBR 8800</strong> - Projeto de estruturas de aço</li>
|
||
<li><strong>ASTM A6</strong> - Requisitos gerais</li>
|
||
<li><strong>ASTM A36 / A992</strong> - Especificações de aço estrutural</li>
|
||
<li><strong>AISC 360</strong> - Especificação construção em aço</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 3: FABRICANTES NO BRASIL -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">🏭 Fabricantes e Distribuição no Brasil</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🏢 Principais Fabricantes</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Fabricante</th>
|
||
<th>Participação</th>
|
||
<th>Localização</th>
|
||
<th>Especialidade</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr style="background: var(--color-bg-2);">
|
||
<td><strong>🥇 Gerdau</strong></td>
|
||
<td>~60%</td>
|
||
<td>Nacional (múltiplas unidades)</td>
|
||
<td>W150-W310 (linha principal)</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>🥈 Açominas</strong></td>
|
||
<td>~30%</td>
|
||
<td>MG</td>
|
||
<td>Perfis médios e pesados</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>🥉 Usiminas</strong></td>
|
||
<td>~10%</td>
|
||
<td>Ipatinga/MG</td>
|
||
<td>Qualidade A992 (vigas)</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⏱️ Prazos de Entrega</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Tipo</th>
|
||
<th>Prazo</th>
|
||
<th>Observações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Estoque</strong></td>
|
||
<td>3-5 dias</td>
|
||
<td>W200×22, W250×25, W310×32</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Sob encomenda</strong></td>
|
||
<td>7-15 dias</td>
|
||
<td>Séries menos comuns</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Grandes perfis</strong></td>
|
||
<td>20-30 dias</td>
|
||
<td>Volume / logística especial</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📦 Embalagem e Transporte</h3>
|
||
<ul>
|
||
<li><strong>Embalagem:</strong> Feixes com cintas de aço</li>
|
||
<li><strong>Peso típico por feixe:</strong> 500-2000 kg</li>
|
||
<li><strong>Identificação:</strong> Etiqueta com especificação e lote</li>
|
||
<li><strong>Transporte:</strong> Caminhão truck ou carreta</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 4: PREÇOS 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">💰 Preços e Fatores de Custo (2025)</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">💵 Faixa de Preços por Kg</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Categoria</th>
|
||
<th>Preço Mínimo (R$/kg)</th>
|
||
<th>Preço Máximo (R$/kg)</th>
|
||
<th>Preço Médio (R$/kg)</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Leves (W150-W200)</strong></td>
|
||
<td>R$ 7.50</td>
|
||
<td>R$ 9.50</td>
|
||
<td>R$ 8.50</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Médios (W250)</strong></td>
|
||
<td>R$ 7.20</td>
|
||
<td>R$ 9.20</td>
|
||
<td>R$ 8.20</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Pesados (W310)</strong></td>
|
||
<td>R$ 7.00</td>
|
||
<td>R$ 9.00</td>
|
||
<td>R$ 8.00</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📊 Fatores de Preço Especiais</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Fator</th>
|
||
<th>Impacto no Preço</th>
|
||
<th>Observações</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Perfis pequenos (W150)</strong></td>
|
||
<td>+10%</td>
|
||
<td>Menor demanda</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Perfis muito grandes</strong></td>
|
||
<td>+15% a +18%</td>
|
||
<td>Produção e logística especiais</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Qualidade A992</strong></td>
|
||
<td>+6%</td>
|
||
<td>Especificação controlada</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Volume >30 ton</strong></td>
|
||
<td>-15% a -18%</td>
|
||
<td>Desconto por escala</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Galvanizado</strong></td>
|
||
<td>+15% a +20%</td>
|
||
<td>Processo adicional</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Corte/Furação/Pintura</strong></td>
|
||
<td>+taxa</td>
|
||
<td>Serviços adicionais</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔢 Calculadora de Preço Estimado</h3>
|
||
<div class="card" style="background: var(--color-bg-2);">
|
||
<div class="form-grid">
|
||
<div class="form-group">
|
||
<label class="form-label">Peso (kg/m)</label>
|
||
<input type="number" class="form-control" id="w-calc-peso" value="25" step="0.1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Comprimento (m)</label>
|
||
<input type="number" class="form-control" id="w-calc-comprimento" value="12" step="0.1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Quantidade (peças)</label>
|
||
<input type="number" class="form-control" id="w-calc-quantidade" value="8" step="1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Preço/kg (R$)</label>
|
||
<input type="number" class="form-control" id="w-calc-preco-kg" value="8.50" step="0.10">
|
||
</div>
|
||
</div>
|
||
<button class="btn btn-primary" onclick="window.calcularPrecoPerfilW()">💰 Calcular Preço Total</button>
|
||
<div id="w-calc-resultado" style="margin-top: 16px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- TAB 5: APLICAÇÕES -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div class="card-title">🔧 Aplicações Principais e Recomendações</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🏗️ Aplicações por Setor</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Setor</th>
|
||
<th>Aplicações</th>
|
||
<th>Séries Típicas</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>Construção Civil</strong></td>
|
||
<td>Edifícios, vigas de piso, colunas</td>
|
||
<td>W200 - W310</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Pontes</strong></td>
|
||
<td>Vigas principais, longarinas</td>
|
||
<td>W250 - W310</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Industrial</strong></td>
|
||
<td>Galpões, pórticos, suportes equipamentos</td>
|
||
<td>W200 - W250</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Offshore</strong></td>
|
||
<td>Plataformas, módulos, estruturas marítimas</td>
|
||
<td>W250 - W310</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Infraestrutura</strong></td>
|
||
<td>Passarelas, pontes pequenas</td>
|
||
<td>W200 - W250</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⚙️ Compatibilidade de Conexões</h3>
|
||
<ul>
|
||
<li><strong>Parafusos estruturais:</strong> M16 a M36</li>
|
||
<li><strong>Soldagem:</strong> E7018 (SMAW) ou GMAW ER70S-6</li>
|
||
<li><strong>Furação:</strong> Furos de 14-40mm típicos</li>
|
||
<li><strong>Ligações:</strong> Chapas de ligação e enrijecedores</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">🔧 Serviços Adicionais Disponíveis</h3>
|
||
<ul>
|
||
<li><strong>Corte linear:</strong> Comprimentos específicos</li>
|
||
<li><strong>Furação em CNC:</strong> Furos conforme projeto</li>
|
||
<li><strong>Pintura epóxi/poliuretano:</strong> Proteção ISO 12944</li>
|
||
<li><strong>Galvanização:</strong> Imersão a quente (sob encomenda)</li>
|
||
</ul>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">⚠️ Recomendações de Uso</h3>
|
||
<div style="padding: 16px; background: var(--color-bg-2); border-left: 4px solid var(--color-primary); border-radius: 8px;">
|
||
<ul style="margin: 0;">
|
||
<li><strong>Verificar FLT:</strong> Flambagem lateral com torção em vigas longas</li>
|
||
<li><strong>Enrijecedores:</strong> Necessários em apoios com cargas concentradas</li>
|
||
<li><strong>Proteção:</strong> Pintura ou galvanização conforme ambiente (C3/C4/C5)</li>
|
||
<li><strong>Qualidade:</strong> A992 recomendada para vigas</li>
|
||
<li><strong>Dimensional:</strong> Tolerâncias ±3mm altura | ±2mm largura</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<h3 style="color: var(--color-primary); margin-top: 20px;">📚 Observações Técnicas</h3>
|
||
<ul>
|
||
<li>Comercializado em feixes com cintas de aço</li>
|
||
<li>Certificado de qualidade 3.1 sob solicitação</li>
|
||
<li>Identificação por etiqueta/lote no feixe</li>
|
||
<li>Acabamento natural laminado a quente</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
`;
|
||
|
||
|
||
// Dados dos modelos (extraídos do guia técnico)
|
||
const W_MODELOS = [
|
||
// W150
|
||
{nome: 'W150×13', altura_mm: 150, largura_mm: 100, peso_kg_m: 13.0, ix_cm4: 407, wx_cm3: 54, serie: 'W150', preco_12m: 354},
|
||
{nome: 'W150×18', altura_mm: 150, largura_mm: 100, peso_kg_m: 17.9, ix_cm4: 537, wx_cm3: 72, serie: 'W150', preco_12m: 407},
|
||
{nome: 'W150×24', altura_mm: 150, largura_mm: 100, peso_kg_m: 23.9, ix_cm4: 696, wx_cm3: 93, serie: 'W150', preco_12m: 456},
|
||
{nome: 'W150×30', altura_mm: 150, largura_mm: 100, peso_kg_m: 29.8, ix_cm4: 854, wx_cm3: 114, serie: 'W150', preco_12m: 525},
|
||
// W200
|
||
{nome: 'W200×15', altura_mm: 200, largura_mm: 100, peso_kg_m: 15.3, ix_cm4: 606, wx_cm3: 61, serie: 'W200', preco_12m: 408},
|
||
{nome: 'W200×22', altura_mm: 200, largura_mm: 100, peso_kg_m: 22.1, ix_cm4: 870, wx_cm3: 87, serie: 'W200', preco_12m: 430},
|
||
{nome: 'W200×31', altura_mm: 200, largura_mm: 100, peso_kg_m: 31.4, ix_cm4: 1170, wx_cm3: 117, serie: 'W200', preco_12m: 560},
|
||
{nome: 'W200×42', altura_mm: 200, largura_mm: 100, peso_kg_m: 41.8, ix_cm4: 1530, wx_cm3: 153, serie: 'W200', preco_12m: 706},
|
||
// W250
|
||
{nome: 'W250×17', altura_mm: 250, largura_mm: 100, peso_kg_m: 17.5, ix_cm4: 1300, wx_cm3: 104, serie: 'W250', preco_12m: 465},
|
||
{nome: 'W250×25', altura_mm: 250, largura_mm: 100, peso_kg_m: 25.4, ix_cm4: 1860, wx_cm3: 149, serie: 'W250', preco_12m: 552},
|
||
{nome: 'W250×38', altura_mm: 250, largura_mm: 100, peso_kg_m: 37.9, ix_cm4: 2740, wx_cm3: 219, serie: 'W250', preco_12m: 752},
|
||
{nome: 'W250×49', altura_mm: 250, largura_mm: 100, peso_kg_m: 48.5, ix_cm4: 3430, wx_cm3: 274, serie: 'W250', preco_12m: 936},
|
||
// W310
|
||
{nome: 'W310×21', altura_mm: 310, largura_mm: 100, peso_kg_m: 21.0, ix_cm4: 2920, wx_cm3: 188, serie: 'W310', preco_12m: 594},
|
||
{nome: 'W310×32', altura_mm: 310, largura_mm: 100, peso_kg_m: 31.8, ix_cm4: 4280, wx_cm3: 276, serie: 'W310', preco_12m: 651},
|
||
{nome: 'W310×44', altura_mm: 310, largura_mm: 100, peso_kg_m: 43.7, ix_cm4: 5900, wx_cm3: 380, serie: 'W310', preco_12m: 936},
|
||
{nome: 'W310×56', altura_mm: 310, largura_mm: 100, peso_kg_m: 55.7, ix_cm4: 7360, wx_cm3: 474, serie: 'W310', preco_12m: 1206}
|
||
];
|
||
|
||
function _renderWTabela(dados) {
|
||
const tbody = document.getElementById('w-tbody');
|
||
if (!tbody) return;
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>\${item.nome}</strong></td>
|
||
<td>\${item.altura_mm}</td>
|
||
<td>\${item.largura_mm}</td>
|
||
<td>\${item.peso_kg_m.toFixed(1)}</td>
|
||
<td>\${item.ix_cm4}</td>
|
||
<td>\${item.wx_cm3}</td>
|
||
<td><span class="badge badge-info">\${item.serie}</span></td>
|
||
<td>R$ \${item.preco_12m.toFixed(0)}</td>
|
||
<td><button class="btn btn-sm btn-primary" onclick="alert('Modelo: \${item.nome}\\nSérie: \${item.serie}\\nIx: \${item.ix_cm4} cm⁴\\nWx: \${item.wx_cm3} cm³')">👁️ Ver</button></td>
|
||
</tr>
|
||
`).join('');
|
||
const totalEl = document.getElementById('w-total');
|
||
if (totalEl) totalEl.textContent = String(dados.length);
|
||
}
|
||
|
||
window._filtrarW = function() {
|
||
const serie = document.getElementById('w-serie').value.trim();
|
||
const pesoMaxStr = document.getElementById('w-peso-max').value;
|
||
const busca = document.getElementById('w-busca').value.trim().toLowerCase();
|
||
const pesoMax = pesoMaxStr ? parseFloat(pesoMaxStr) : null;
|
||
const filtrados = W_MODELOS.filter(m => {
|
||
if (serie && m.serie !== serie) return false;
|
||
if (pesoMax !== null && m.peso_kg_m > pesoMax) return false;
|
||
if (busca && !m.nome.toLowerCase().includes(busca)) return false;
|
||
return true;
|
||
});
|
||
_renderWTabela(filtrados);
|
||
};
|
||
|
||
window._limparFiltrosW = function() {
|
||
document.getElementById('w-serie').value = '';
|
||
document.getElementById('w-peso-max').value = '';
|
||
document.getElementById('w-busca').value = '';
|
||
_renderWTabela(W_MODELOS);
|
||
};
|
||
|
||
window.calcularPrecoPerfilW = function() {
|
||
const peso = parseFloat(document.getElementById('w-calc-peso').value);
|
||
const comprimento = parseFloat(document.getElementById('w-calc-comprimento').value);
|
||
const quantidade = parseInt(document.getElementById('w-calc-quantidade').value);
|
||
const precoKg = parseFloat(document.getElementById('w-calc-preco-kg').value);
|
||
const pesoTotal = peso * comprimento * quantidade;
|
||
const precoTotal = pesoTotal * precoKg;
|
||
document.getElementById('w-calc-resultado').innerHTML = `
|
||
<div class="card" style="background: var(--color-success); color: white;">
|
||
<h3 style="margin: 0 0 12px 0;">💰 Resultado do Cálculo</h3>
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px;">
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Peso Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">\${pesoTotal.toFixed(2)} kg</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ \${precoTotal.toFixed(2)}</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço por Peça</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ \${(precoTotal / quantidade).toFixed(2)}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
};
|
||
|
||
// Inicializa tabela ao renderizar conteúdo
|
||
setTimeout(() => _renderWTabela(W_MODELOS), 0);
|
||
|
||
|
||
|
||
}
|
||
|
||
function getTubosRHSContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">▭ Tubos RHS - Catálogo Estrutural Brasil</div>
|
||
<div class="section-description">Seções quadradas e retangulares (HSS) para estruturas metálicas</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<div style="display:flex; justify-content: space-between; align-items:center;">
|
||
<h3 style="margin: 0 0 12px 0; color: var(--color-primary);">📊 Série RHS disponível</h3>
|
||
<button class="btn btn-secondary" onclick="atualizarFonteTubos_rhs()">🗄️ Atualizar da Fonte</button>
|
||
</div>
|
||
<p style="color: var(--color-text-secondary);">Baseado em ASTM A500/DIN 2395. Dados completos em <span id="tubos_rhs-fonte">BD/perfis/tubos_rhs_brasil_completo.csv</span>.</p>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Designação</th>
|
||
<th>Largura (mm)</th>
|
||
<th>Altura (mm)</th>
|
||
<th>Espessura (mm)</th>
|
||
<th>Peso (kg/m)</th>
|
||
<th>Área (cm²)</th>
|
||
<th>Categoria</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="tubos_rhs-tbody">
|
||
<tr><td>50×50×2</td><td>50</td><td>50</td><td>2.0</td><td>3.6</td><td>4.58</td><td>Pequeno</td></tr>
|
||
<tr><td>75×75×4</td><td>75</td><td>75</td><td>4.0</td><td>10.7</td><td>13.62</td><td>Médio</td></tr>
|
||
<tr><td>120×80×4</td><td>120</td><td>80</td><td>4.0</td><td>15.1</td><td>19.22</td><td>Grande</td></tr>
|
||
<tr><td>150×150×6</td><td>150</td><td>150</td><td>6.0</td><td>33.1</td><td>42.13</td><td>Muito Grande</td></tr>
|
||
<tr><td>200×200×8</td><td>200</td><td>200</td><td>8.0</td><td>57.8</td><td>73.63</td><td>Massiva</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div style="margin-top: 12px; font-size: 13px; color: var(--color-text-secondary);">Observação: valores detalhados e demais modelos disponíveis no CSV.</div>
|
||
<div style="margin-top: 8px; font-size: 12px; color: var(--color-text-secondary);">
|
||
Total: <strong id="tubos_rhs-total">—</strong> modelos • Última atualização: <span id="tubos_rhs-last">—</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📋 Especificações Técnicas</h3>
|
||
<ul>
|
||
<li>Seções fechadas quadradas/retangulares (HSS/RHS) – alta rigidez torsional.</li>
|
||
<li>Normas principais: ASTM A500 (Graus B/C), DIN 2395, NBR 5590, ASTM A1085.</li>
|
||
<li>Faixas típicas: 50×50×2 até 250×250×8 (retangulares assimétricos inclusos).</li>
|
||
<li>Materiais: SAE 1020/1045 ou equivalentes; Fy 248–345 MPa conforme grau.</li>
|
||
<li>Acabamentos: natural laminado, galvanizado, pintura epóxi/PU.</li>
|
||
</ul>
|
||
<h4 style="color: var(--color-primary); margin-top: 16px;">🔎 Classificação</h4>
|
||
<ul>
|
||
<li>Pequeno: 50–75 mm (estruturas leves).</li>
|
||
<li>Médio: 80–100 mm (estruturas padrão).</li>
|
||
<li>Grande: 120–150 mm (estruturas robustas).</li>
|
||
<li>Muito Grande/Massiva: 200–250 mm (pontes/offshore).</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🏭 Fabricantes e Distribuição</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr><th>Fabricante</th><th>Participação</th><th>Localização</th><th>Especialidade</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td>Gerdau</td><td>~40%</td><td>Nacional</td><td>Quadrados/retangulares comuns</td></tr>
|
||
<tr><td>CSN</td><td>~25%</td><td>Volta Redonda/RJ</td><td>RHS médios/grandes</td></tr>
|
||
<tr><td>Usiminas</td><td>~20%</td><td>Ipatinga/MG</td><td>Grandes seções</td></tr>
|
||
<tr><td>Vallourec</td><td>~8%</td><td>Belo Horizonte/MG</td><td>Especiais/galvanizados</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<p style="margin-top: 12px; color: var(--color-text-secondary);">Lead time típico: 3–10 dias conforme dimensão e acabamento.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">💰 Preços 2025</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Categoria</th><th>Preço kg (R$)</th><th>Observações</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Pequeno</td><td>3.20 – 3.80</td><td>Estoque rápido</td></tr>
|
||
<tr><td>Médio</td><td>3.60 – 4.20</td><td>Mais comum no mercado</td></tr>
|
||
<tr><td>Grande</td><td>4.10 – 4.80</td><td>Sob encomenda parcial</td></tr>
|
||
<tr><td>Massiva</td><td>4.80 – 5.60</td><td>Offshore/pontes, prazo adicional</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<ul style="margin-top: 12px;">
|
||
<li>Galvanizado: +20% sobre preço base.</li>
|
||
<li>Pintura epóxi/PU: +8–12% conforme sistema.</li>
|
||
<li>Corte e furação CNC: sob orçamento.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🔧 Aplicações Principais</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Setor</th><th>Aplicações</th><th>Tamanhos Típicos</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Construção Civil</td><td>Colunas, vigas, pórticos</td><td>80×80×4 – 120×120×5</td></tr>
|
||
<tr><td>Infraestrutura</td><td>Passarelas, sinalização</td><td>100×100×4 – 150×150×6</td></tr>
|
||
<tr><td>Industrial</td><td>Estruturas de galpão, racks</td><td>75×75×4 – 120×80×5</td></tr>
|
||
<tr><td>Offshore</td><td>Módulos, jaquetas</td><td>200×200×6 – 250×250×8</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<h4 style="color: var(--color-primary); margin-top: 16px;">✅ Recomendações</h4>
|
||
<ul>
|
||
<li>Preferir Grau C (ASTM A500) para esforços elevados.</li>
|
||
<li>Executar enrijecedores em cargas concentradas.</li>
|
||
<li>Inspecionar cordão de solda em tubos com costura.</li>
|
||
<li>Proteções: galvanização ou pintura epóxi conforme ambiente.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
`;
|
||
|
||
|
||
// Atualiza diretamente da fonte CSV usando DataManager e repovoa todas as abas
|
||
window.atualizarFonteTubos_rhs = async function() {
|
||
try {
|
||
const tbody = document.getElementById('tubos_rhs-tbody');
|
||
const totalEl = document.getElementById('tubos_rhs-total');
|
||
const fonteEl = document.getElementById('tubos_rhs-fonte');
|
||
const lastEl = document.getElementById('tubos_rhs-last');
|
||
if (!tbody) return alert('❌ Tabela não encontrada');
|
||
|
||
tbody.innerHTML = `
|
||
<tr>
|
||
<td colspan="7" style="text-align:center; padding:32px;">
|
||
<div style="font-size:42px;">⏳</div>
|
||
<div style="margin-top:8px; color: var(--color-text-secondary);">Atualizando da fonte...</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
|
||
const prevMeta = window.dataManager.getTypeMetadata('tubos_rhs') || {};
|
||
const result = await window.dataManager.updateTypeData('tubos_rhs', { docSource: prevMeta.docSource });
|
||
const dados = result.data || [];
|
||
|
||
if (!dados.length) {
|
||
throw new Error('Fonte retornou 0 itens');
|
||
}
|
||
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>${item.nome}</strong></td>
|
||
<td>${item.largura_mm}</td>
|
||
<td>${item.altura_mm}</td>
|
||
<td>${item.espessura_mm}</td>
|
||
<td>${(typeof item.peso_kg_m === 'number') ? item.peso_kg_m.toFixed(2) : item.peso_kg_m}</td>
|
||
<td>${(typeof item.area_cm2 === 'number') ? item.area_cm2.toFixed(2) : item.area_cm2}</td>
|
||
<td><span class="badge badge-info">${item.tipo}</span></td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
if (totalEl) totalEl.textContent = dados.length;
|
||
if (fonteEl) fonteEl.textContent = result.source || 'BD/perfis/tubos_rhs_brasil_completo.csv';
|
||
if (lastEl) lastEl.textContent = new Date(result.lastUpdate || Date.now()).toLocaleString('pt-BR');
|
||
|
||
// Atualizar nota nas outras abas
|
||
['perfil-tab-1','perfil-tab-2','perfil-tab-3','perfil-tab-4'].forEach(id => {
|
||
const tab = document.getElementById(id);
|
||
if (tab) {
|
||
let note = document.getElementById('tubos_rhs-update-note-' + id);
|
||
if (!note) {
|
||
note = document.createElement('div');
|
||
note.id = 'tubos_rhs-update-note-' + id;
|
||
note.style.marginTop = '12px';
|
||
note.style.fontSize = '12px';
|
||
note.style.color = 'var(--color-text-secondary)';
|
||
tab.appendChild(note);
|
||
}
|
||
note.textContent = `Dados atualizados (${dados.length} itens) • Fonte: ${result.source} • ${new Date(result.lastUpdate).toLocaleString('pt-BR')} • Doc: ${result.docSource || '—'} (${result.docStatus || '—'})`;
|
||
}
|
||
});
|
||
|
||
// Injetar conteúdo enriquecido nas abas a partir do documento
|
||
const insights = result.docInsights || {};
|
||
// Especificações (tab-1)
|
||
(function(){
|
||
const especTab = document.getElementById('perfil-tab-1');
|
||
if (!especTab || !insights.sections) return;
|
||
const boxId = 'rhs-doc-especificacoes';
|
||
let box = document.getElementById(boxId);
|
||
if (!box) { box = document.createElement('div'); box.id = boxId; box.style.marginTop = '12px'; especTab.appendChild(box); }
|
||
box.innerHTML = `
|
||
<h4 style="color: var(--color-primary);">🔎 Conteúdo do Documento</h4>
|
||
${insights.sections.visaoGeral ? `<p>${insights.sections.visaoGeral}</p>` : ''}
|
||
${insights.sections.normasTecnicas ? `<div style="margin-top:8px;"><strong>Normas:</strong><br><pre style="white-space:pre-wrap;">${insights.sections.normasTecnicas}</pre></div>` : ''}
|
||
${Array.isArray(insights.recommendations) && insights.recommendations.length ? `<div style="margin-top:8px;"><strong>Recomendações:</strong><ul>${insights.recommendations.map(r=>`<li>${r}</li>`).join('')}</ul></div>` : ''}
|
||
`;
|
||
})();
|
||
// Fabricantes (tab-2)
|
||
(function(){
|
||
const fabTab = document.getElementById('perfil-tab-2');
|
||
if (!fabTab || !Array.isArray(insights.manufacturers) || !insights.manufacturers.length) return;
|
||
const boxId = 'rhs-doc-fabricantes';
|
||
let box = document.getElementById(boxId);
|
||
if (!box) { box = document.createElement('div'); box.id = boxId; box.style.marginTop = '12px'; fabTab.appendChild(box); }
|
||
box.innerHTML = `<h4 style="color: var(--color-primary);">🏭 Fabricantes do Documento</h4><ul>${insights.manufacturers.map(f=>`<li>${f}</li>`).join('')}</ul>`;
|
||
})();
|
||
// Preços (tab-3)
|
||
(function(){
|
||
const precoTab = document.getElementById('perfil-tab-3');
|
||
if (!precoTab || !Array.isArray(insights.priceHints) || !insights.priceHints.length) return;
|
||
const boxId = 'rhs-doc-precos';
|
||
let box = document.getElementById(boxId);
|
||
if (!box) { box = document.createElement('div'); box.id = boxId; box.style.marginTop = '12px'; precoTab.appendChild(box); }
|
||
box.innerHTML = `<h4 style="color: var(--color-primary);">💰 Indícios de Preço no Documento</h4><p>${insights.priceHints.join(' • ')}</p>`;
|
||
})();
|
||
// Aplicações (tab-4)
|
||
(function(){
|
||
const aplTab = document.getElementById('perfil-tab-4');
|
||
if (!aplTab || !Array.isArray(insights.applications) || !insights.applications.length) return;
|
||
const boxId = 'rhs-doc-aplicacoes';
|
||
let box = document.getElementById(boxId);
|
||
if (!box) { box = document.createElement('div'); box.id = boxId; box.style.marginTop = '12px'; aplTab.appendChild(box); }
|
||
box.innerHTML = `<h4 style="color: var(--color-primary);">🔧 Aplicações do Documento</h4><ul>${insights.applications.map(a=>`<li>${a}</li>`).join('')}</ul>`;
|
||
})();
|
||
|
||
alert('✅ Tubos RHS atualizados com enriquecimento pelo documento!');
|
||
} catch (err) {
|
||
console.error('❌ Erro ao atualizar Tubos RHS:', err);
|
||
alert('❌ Erro ao atualizar: ' + err.message);
|
||
}
|
||
};
|
||
|
||
|
||
|
||
}
|
||
|
||
// --- Perfis W: disponibilizar no escopo global para funcionamento dos filtros ---
|
||
// OBS: Scripts inseridos via innerHTML não executam; por isso registramos aqui.
|
||
if (!window.W_MODELOS) {
|
||
window.W_MODELOS = [
|
||
{nome: 'W150×13', altura_mm: 150, largura_mm: 100, peso_kg_m: 13.0, ix_cm4: 407, wx_cm3: 54, serie: 'W150', preco_12m: 354},
|
||
{nome: 'W150×18', altura_mm: 150, largura_mm: 100, peso_kg_m: 17.9, ix_cm4: 537, wx_cm3: 72, serie: 'W150', preco_12m: 407},
|
||
{nome: 'W150×24', altura_mm: 150, largura_mm: 100, peso_kg_m: 23.9, ix_cm4: 696, wx_cm3: 93, serie: 'W150', preco_12m: 456},
|
||
{nome: 'W150×30', altura_mm: 150, largura_mm: 100, peso_kg_m: 29.8, ix_cm4: 854, wx_cm3: 114, serie: 'W150', preco_12m: 525},
|
||
{nome: 'W200×15', altura_mm: 200, largura_mm: 100, peso_kg_m: 15.3, ix_cm4: 606, wx_cm3: 61, serie: 'W200', preco_12m: 408},
|
||
{nome: 'W200×22', altura_mm: 200, largura_mm: 100, peso_kg_m: 22.1, ix_cm4: 870, wx_cm3: 87, serie: 'W200', preco_12m: 430},
|
||
{nome: 'W200×31', altura_mm: 200, largura_mm: 100, peso_kg_m: 31.4, ix_cm4: 1170, wx_cm3: 117, serie: 'W200', preco_12m: 560},
|
||
{nome: 'W200×42', altura_mm: 200, largura_mm: 100, peso_kg_m: 41.8, ix_cm4: 1530, wx_cm3: 153, serie: 'W200', preco_12m: 706},
|
||
{nome: 'W250×17', altura_mm: 250, largura_mm: 100, peso_kg_m: 17.5, ix_cm4: 1300, wx_cm3: 104, serie: 'W250', preco_12m: 465},
|
||
{nome: 'W250×25', altura_mm: 250, largura_mm: 100, peso_kg_m: 25.4, ix_cm4: 1860, wx_cm3: 149, serie: 'W250', preco_12m: 552},
|
||
{nome: 'W250×38', altura_mm: 250, largura_mm: 100, peso_kg_m: 37.9, ix_cm4: 2740, wx_cm3: 219, serie: 'W250', preco_12m: 752},
|
||
{nome: 'W250×49', altura_mm: 250, largura_mm: 100, peso_kg_m: 48.5, ix_cm4: 3430, wx_cm3: 274, serie: 'W250', preco_12m: 936},
|
||
{nome: 'W310×21', altura_mm: 310, largura_mm: 100, peso_kg_m: 21.0, ix_cm4: 2920, wx_cm3: 188, serie: 'W310', preco_12m: 594},
|
||
{nome: 'W310×32', altura_mm: 310, largura_mm: 100, peso_kg_m: 31.8, ix_cm4: 4280, wx_cm3: 276, serie: 'W310', preco_12m: 651},
|
||
{nome: 'W310×44', altura_mm: 310, largura_mm: 100, peso_kg_m: 43.7, ix_cm4: 5900, wx_cm3: 380, serie: 'W310', preco_12m: 936},
|
||
{nome: 'W310×56', altura_mm: 310, largura_mm: 100, peso_kg_m: 55.7, ix_cm4: 7360, wx_cm3: 474, serie: 'W310', preco_12m: 1206}
|
||
];
|
||
}
|
||
|
||
function _renderWTabela(dados) {
|
||
const tbody = document.getElementById('w-tbody');
|
||
if (!tbody) return;
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>${item.nome}</strong></td>
|
||
<td>${item.altura_mm}</td>
|
||
<td>${item.largura_mm}</td>
|
||
<td>${item.peso_kg_m.toFixed(1)}</td>
|
||
<td>${item.ix_cm4}</td>
|
||
<td>${item.wx_cm3}</td>
|
||
<td><span class="badge badge-info">${item.serie}</span></td>
|
||
<td>R$ ${item.preco_12m.toFixed(0)}</td>
|
||
<td><button class="btn btn-sm btn-primary" onclick="alert('Modelo: ${item.nome}\nSérie: ${item.serie}\nIx: ${item.ix_cm4} cm⁴\nWx: ${item.wx_cm3} cm³')">👁️ Ver</button></td>
|
||
</tr>
|
||
`).join('');
|
||
const totalEl = document.getElementById('w-total');
|
||
if (totalEl) totalEl.textContent = String(dados.length);
|
||
}
|
||
|
||
window._filtrarW = function() {
|
||
const serie = document.getElementById('w-serie')?.value?.trim() || '';
|
||
const pesoMaxStr = document.getElementById('w-peso-max')?.value || '';
|
||
const busca = (document.getElementById('w-busca')?.value || '').trim().toLowerCase();
|
||
const pesoMax = pesoMaxStr ? parseFloat(pesoMaxStr) : null;
|
||
const filtrados = window.W_MODELOS.filter(m => {
|
||
if (serie && m.serie !== serie) return false;
|
||
if (pesoMax !== null && m.peso_kg_m > pesoMax) return false;
|
||
if (busca && !m.nome.toLowerCase().includes(busca)) return false;
|
||
return true;
|
||
});
|
||
_renderWTabela(filtrados);
|
||
};
|
||
|
||
window._limparFiltrosW = function() {
|
||
const serieEl = document.getElementById('w-serie');
|
||
const pesoEl = document.getElementById('w-peso-max');
|
||
const buscaEl = document.getElementById('w-busca');
|
||
if (serieEl) serieEl.value = '';
|
||
if (pesoEl) pesoEl.value = '';
|
||
if (buscaEl) buscaEl.value = '';
|
||
_renderWTabela(window.W_MODELOS);
|
||
};
|
||
|
||
window.calcularPrecoPerfilW = function() {
|
||
const peso = parseFloat(document.getElementById('w-calc-peso')?.value || '0');
|
||
const comprimento = parseFloat(document.getElementById('w-calc-comprimento')?.value || '0');
|
||
const quantidade = parseInt(document.getElementById('w-calc-quantidade')?.value || '0');
|
||
const precoKg = parseFloat(document.getElementById('w-calc-preco-kg')?.value || '0');
|
||
const pesoTotal = peso * comprimento * quantidade;
|
||
const precoTotal = pesoTotal * precoKg;
|
||
const resultadoEl = document.getElementById('w-calc-resultado');
|
||
if (resultadoEl) {
|
||
resultadoEl.innerHTML = `
|
||
<div class="card" style="background: var(--color-success); color: white;">
|
||
<h3 style="margin: 0 0 12px 0;">💰 Resultado do Cálculo</h3>
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px;">
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Peso Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">${pesoTotal.toFixed(2)} kg</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ ${precoTotal.toFixed(2)}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
};
|
||
|
||
// Render inicial quando a tabela existir
|
||
setTimeout(() => {
|
||
const tbody = document.getElementById('w-tbody');
|
||
if (tbody) {
|
||
_renderWTabela(window.W_MODELOS);
|
||
}
|
||
}, 0);
|
||
|
||
function getChapasContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">📄 Chapas Planas - Guia Técnico 2025</div>
|
||
<div class="section-description">Laminadas a quente/frio, galvanizadas e inox – múltiplas normas</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📊 Série de Chapas Comerciais</h3>
|
||
<p style="color: var(--color-text-secondary);">Dados resumidos do CSV (BD/perfis/chapas_brasil_completo.csv).</p>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Designação</th><th>Espessura (mm)</th><th>Peso (kg/m²)</th><th>Formato (mm)</th><th>Peso Chapa (kg)</th><th>Categoria</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>CHAPA 3.2mm (1/8")</td><td>3.2</td><td>25.12</td><td>2500×1250</td><td>78.5</td><td>Fina</td></tr>
|
||
<tr><td>CHAPA 6.35mm (1/4")</td><td>6.35</td><td>49.85</td><td>2500×1250</td><td>155.78</td><td>Média</td></tr>
|
||
<tr><td>CHAPA 12.7mm (1/2")</td><td>12.7</td><td>99.70</td><td>2500×1250</td><td>311.56</td><td>Grossa</td></tr>
|
||
<tr><td>CHAPA 25.4mm (1")</td><td>25.4</td><td>199.40</td><td>2000×1000</td><td>398.80</td><td>Muito Grossa</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📋 Especificações Técnicas</h3>
|
||
<ul>
|
||
<li>HR (laminação a quente) e CR (laminação a frio) conforme chapas_planas.md.</li>
|
||
<li>Normas: ASTM A36 (HR), ASTM A1008 (CR), ASTM A653 (galvanizadas), ASTM A240 (inox), equivalentes NBR.</li>
|
||
<li>Acabamentos: natural, galvanizado (Z100–Z200), inox 304/316L; tolerâncias ±1–3% conforme processo.</li>
|
||
<li>Larguras comerciais: 1000–1500 mm; formatos típicos 2500×1250 mm.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🏭 Fabricantes e Prazos</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Fabricante</th><th>Participação</th><th>Localização</th><th>Especialidade</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>CSN</td><td>~35%</td><td>Volta Redonda/RJ</td><td>HR/CR comuns</td></tr>
|
||
<tr><td>Usiminas</td><td>~35%</td><td>Ipatinga/MG</td><td>HR pesadas</td></tr>
|
||
<tr><td>Gerdau</td><td>~20%</td><td>Nacional</td><td>Chapas estruturais</td></tr>
|
||
<tr><td>Vallourec</td><td>~10%</td><td>BH/MG</td><td>Galvanizadas/Inox</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<p style="margin-top: 12px; color: var(--color-text-secondary);">Lead time: estoque 2–5 dias; sob encomenda 7–15 dias; galvanizado +5–10 dias.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">💰 Preços 2025</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Categoria</th><th>Preço kg (R$)</th><th>Observações</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Fina (3–5 mm)</td><td>3.10 – 3.60</td><td>HR/CR leve</td></tr>
|
||
<tr><td>Média (6–10 mm)</td><td>3.40 – 3.90</td><td>Estrutural padrão</td></tr>
|
||
<tr><td>Grossa (11–20 mm)</td><td>3.80 – 4.40</td><td>Estrutura pesada</td></tr>
|
||
<tr><td>Muito/Ultra Grossa (20+ mm)</td><td>4.30 – 5.20</td><td>Pontes/offshore</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<ul style="margin-top: 12px;">
|
||
<li>Galvanizadas: +20% (Z100–Z200).</li>
|
||
<li>Inox 304/316L: +300–400% sobre carbono.</li>
|
||
<li>Corte CNC e dobra: sob orçamento.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🔧 Aplicações & Recomendações</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Setor</th><th>Aplicações</th><th>Espessuras Típicas</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Construção Civil</td><td>Base de ligações, chapas de gusset</td><td>6–12 mm</td></tr>
|
||
<tr><td>Industrial</td><td>Painéis, suportes, reforços</td><td>6–20 mm</td></tr>
|
||
<tr><td>Offshore</td><td>Reforços críticos, tampas, consoles</td><td>12–50 mm</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<ul style="margin-top: 12px;">
|
||
<li>Soldagem SMAW E7018 ou GMAW ER70S-6.</li>
|
||
<li>Proteção: pintura epóxi ou galvanização a quente.</li>
|
||
<li>Tolerâncias conforme processo (chapas_planas.md).</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getPerfisHPContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">🏛️ Perfis HP (Heavy Plate) - Catálogo Brasil</div>
|
||
<div class="section-description">Estacas e seções especiais – referência Gerdau/Usiminas</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📊 Série HP disponível</h3>
|
||
<p style="color: var(--color-text-secondary);">Base de dados: BD/perfis/perfis_hp_brasil_completo.csv.</p>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Designação</th><th>Altura (mm)</th><th>Aba (mm)</th><th>tw/tf (mm)</th><th>Peso (kg/m)</th><th>Área (cm²)</th><th>Categoria</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>HP 100×20</td><td>100</td><td>100</td><td>4.3/6.4</td><td>20.0</td><td>25.5</td><td>Pequeno</td></tr>
|
||
<tr><td>HP 150×50</td><td>150</td><td>150</td><td>8.4/12.6</td><td>50.0</td><td>63.7</td><td>Grande</td></tr>
|
||
<tr><td>HP 200×73</td><td>200</td><td>200</td><td>9.4/14.2</td><td>73.0</td><td>93.0</td><td>Grande</td></tr>
|
||
<tr><td>HP 250×89</td><td>250</td><td>250</td><td>10.2/15.2</td><td>89.0</td><td>113.4</td><td>Muito Grande</td></tr>
|
||
<tr><td>HP 300×102</td><td>300</td><td>300</td><td>10.5/15.9</td><td>102.0</td><td>130.0</td><td>Massiva</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📋 Especificações</h3>
|
||
<ul>
|
||
<li>Referência técnica: perfis_w_hp_gerdau_acominas_guia_tecnico.md.</li>
|
||
<li>Normas: ABNT NBR 5884, ASTM A6/A36, AISC 360.</li>
|
||
<li>Aplicação principal: estacas e estruturas especiais com boa torção.</li>
|
||
<li>Materiais usuais: ASTM A36/A572; Fy 248–345 MPa.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🏭 Fabricantes</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Fabricante</th><th>Participação</th><th>Local</th><th>Especialidade</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Usiminas</td><td>~50%</td><td>Ipatinga/MG</td><td>Série HP completa</td></tr>
|
||
<tr><td>Gerdau</td><td>~40%</td><td>Nacional</td><td>HP médios/grandes</td></tr>
|
||
<tr><td>CSN</td><td>~10%</td><td>Volta Redonda/RJ</td><td>Disponibilidade sob encomenda</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<p style="margin-top: 12px; color: var(--color-text-secondary);">Prazos: estoque 3–7 dias; sob encomenda 10–20 dias.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">💰 Preços 2025</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Categoria</th><th>Preço kg (R$)</th><th>Observações</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Pequeno/Médio</td><td>3.60 – 4.20</td><td>Estacas leves</td></tr>
|
||
<tr><td>Grande</td><td>4.10 – 4.80</td><td>Estruturas pesadas</td></tr>
|
||
<tr><td>Muito Grande/Massiva</td><td>4.80 – 5.50</td><td>Offshore/ponte</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🔧 Aplicações</h3>
|
||
<ul>
|
||
<li>Estacas cravadas e estruturas submetidas a torção.</li>
|
||
<li>Pórticos especiais, módulos industriais e pontes leves.</li>
|
||
<li>Ambientes agressivos com proteção adequada (pintura/galvanização).</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getBarrasRoscadasContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">🔩 Barras Roscadas para Chumbadores</div>
|
||
<div class="section-description">ASTM A193 B7/B8/B8M – referência NBR 8800 (ancoragens)</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📊 Principais diâmetros</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Diâmetro</th><th>Material</th><th>Fy/Fu (MPa)</th><th>Comprimento padrão</th><th>Aplicação</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>1/2"</td><td>A193 B7</td><td>724 / 862</td><td>6 m</td><td>Ancoragens leves</td></tr>
|
||
<tr><td>3/4"</td><td>A193 B7</td><td>724 / 862</td><td>6 m</td><td>Padrão estrutural</td></tr>
|
||
<tr><td>7/8"</td><td>A193 B7</td><td>724 / 862</td><td>6 m</td><td>Estruturas pesadas</td></tr>
|
||
<tr><td>1"</td><td>A193 B7</td><td>724 / 862</td><td>6 m</td><td>Mega estruturas</td></tr>
|
||
<tr><td>3/4"</td><td>A193 B8M (316L)</td><td>552 / 689</td><td>6 m</td><td>Offshore extremo</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📋 Especificações</h3>
|
||
<ul>
|
||
<li>Fonte: barras_roscadas_chumbadores.md.</li>
|
||
<li>Normas: ASTM A193 B7/B8/B8M; porcas ASTM A563 DH; arruelas ASTM F436.</li>
|
||
<li>Rosca completa ponta-a-ponta; embutimento mínimo em concreto 250–350 mm.</li>
|
||
<li>Acabamentos: natural, galvanizado a quente; inox 304/316L para corrosão.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🏭 Fabricantes</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Fabricante</th><th>Participação</th><th>Local</th><th>Especialidade</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Gerdau</td><td>~35%</td><td>Nacional</td><td>Carbono B7</td></tr>
|
||
<tr><td>Confab</td><td>~25%</td><td>SP</td><td>Processos especiais</td></tr>
|
||
<tr><td>Usiminas</td><td>~20%</td><td>MG</td><td>Carbono premium</td></tr>
|
||
<tr><td>CSN</td><td>~10%</td><td>RJ</td><td>Galvanizado</td></tr>
|
||
<tr><td>Villares</td><td>~10%</td><td>SP</td><td>Inoxidáveis</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">💰 Preços 2025</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Diâmetro</th><th>Material</th><th>Preço por barra 6 m (R$)</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>3/4"</td><td>A193 B7</td><td>270</td></tr>
|
||
<tr><td>7/8"</td><td>A193 B7</td><td>312</td></tr>
|
||
<tr><td>1"</td><td>A193 B7</td><td>390</td></tr>
|
||
<tr><td>3/4"</td><td>A193 B8M</td><td>720</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<ul style="margin-top: 12px;">
|
||
<li>Galvanização a quente: +20%.</li>
|
||
<li>Porca dupla altura ASTM A563 DH e arruela F436 obrigatórias.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🔧 Aplicações</h3>
|
||
<ul>
|
||
<li>Ancoragem de pilares metálicos e consoles.</li>
|
||
<li>Estruturas com vibração – usar porca dupla altura.</li>
|
||
<li>Ambientes agressivos – preferir galvanizado ou inox.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
function getBarrasChatasContent() {
|
||
return `
|
||
<div class="section-header">
|
||
<div class="section-title">▬ Barras Chatas - Catálogo Brasil</div>
|
||
<div class="section-description">Seções retangulares sólidas para uso estrutural e industrial</div>
|
||
</div>
|
||
|
||
<div class="tabs-container">
|
||
<div class="tabs-nav">
|
||
<button class="tab-btn active" onclick="switchPerfilTab(0)">📊 Tabela Técnica</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(1)">📋 Especificações</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(2)">🏭 Fabricantes</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(3)">💰 Preços 2025</button>
|
||
<button class="tab-btn" onclick="switchPerfilTab(4)">🔧 Aplicações</button>
|
||
</div>
|
||
|
||
<!-- Tab 1: Tabela Técnica -->
|
||
<div class="tab-content active" id="perfil-tab-0">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📊 Série de Barras Chatas</h3>
|
||
<p style="color: var(--color-text-secondary);">CSV: BD/perfis/barras_chatas_brasil_completo.csv.</p>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Designação</th><th>Largura (mm)</th><th>Espessura (mm)</th><th>Peso (kg/m)</th><th>Categoria</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>12×3</td><td>12</td><td>3</td><td>0.28</td><td>Leve</td></tr>
|
||
<tr><td>25×6</td><td>25</td><td>6</td><td>1.18</td><td>Média</td></tr>
|
||
<tr><td>50×10</td><td>50</td><td>10</td><td>3.93</td><td>Pesada</td></tr>
|
||
<tr><td>100×20</td><td>100</td><td>20</td><td>15.70</td><td>Muito Pesada</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Especificações -->
|
||
<div class="tab-content" id="perfil-tab-1">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">📋 Especificações</h3>
|
||
<ul>
|
||
<li>Materiais: ASTM A36/A572; acabamento natural/galvanizado/pintado.</li>
|
||
<li>Tolerâncias dimensionais segundo ASTM A6/NBR correlatas.</li>
|
||
<li>Uso típico: chapas de base, reforços, espaçadores e peças usinadas.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Fabricantes -->
|
||
<div class="tab-content" id="perfil-tab-2">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🏭 Fabricantes</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Fabricante</th><th>Participação</th><th>Local</th><th>Especialidade</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Gerdau</td><td>~40%</td><td>Nacional</td><td>Série completa</td></tr>
|
||
<tr><td>Usiminas</td><td>~30%</td><td>MG</td><td>Larguras grandes</td></tr>
|
||
<tr><td>CSN</td><td>~20%</td><td>RJ</td><td>Disponibilidade sob encomenda</td></tr>
|
||
<tr><td>AÇO Minas</td><td>~10%</td><td>MG</td><td>Especiais</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 4: Preços 2025 -->
|
||
<div class="tab-content" id="perfil-tab-3">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">💰 Preços 2025</h3>
|
||
<div class="table-container">
|
||
<table>
|
||
<thead><tr><th>Categoria</th><th>Preço kg (R$)</th><th>Observações</th></tr></thead>
|
||
<tbody>
|
||
<tr><td>Leve</td><td>3.10 – 3.60</td><td>Uso geral</td></tr>
|
||
<tr><td>Média</td><td>3.40 – 4.00</td><td>Estrutural padrão</td></tr>
|
||
<tr><td>Pesada/Muito Pesada</td><td>4.10 – 5.20</td><td>Base, reforços</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 5: Aplicações -->
|
||
<div class="tab-content" id="perfil-tab-4">
|
||
<div class="card" style="background: var(--color-bg-1);">
|
||
<h3 style="color: var(--color-primary);">🔧 Aplicações</h3>
|
||
<ul>
|
||
<li>Chaparias de base, reforços de ligações e chapas de travamento.</li>
|
||
<li>Peças usinadas, espaçadores e conectores planos.</li>
|
||
<li>Preferir galvanização/pintura em ambientes agressivos.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
|
||
console.log('✅ Funções placeholder dos perfis registradas');
|
||
|
||
|
||
// ========================================
|
||
// FUNÇÃO PARA TROCAR TABS
|
||
// ========================================
|
||
|
||
/**
|
||
* Troca entre as tabs de um perfil
|
||
*/
|
||
function switchPerfilTab(index) {
|
||
console.log('🔄 Trocando para tab', index);
|
||
|
||
// Atualizar botões
|
||
document.querySelectorAll('.tab-btn').forEach((btn, i) => {
|
||
if (i === index) {
|
||
btn.classList.add('active');
|
||
} else {
|
||
btn.classList.remove('active');
|
||
}
|
||
});
|
||
|
||
// Atualizar conteúdo
|
||
document.querySelectorAll('.tab-content').forEach((content, i) => {
|
||
if (i === index) {
|
||
content.classList.add('active');
|
||
} else {
|
||
content.classList.remove('active');
|
||
}
|
||
});
|
||
}
|
||
|
||
console.log('✅ Função switchPerfilTab registrada');
|
||
// Exportar versão final para escopo global
|
||
window.switchPerfilTab = switchPerfilTab;
|
||
|
||
|
||
/**
|
||
* Calcula preço estimado de cantoneiras
|
||
*/
|
||
function calcularPrecoCantoneira() {
|
||
const peso = parseFloat(document.getElementById('calc-peso')?.value) || 0;
|
||
const comprimento = parseFloat(document.getElementById('calc-comprimento')?.value) || 0;
|
||
const quantidade = parseInt(document.getElementById('calc-quantidade')?.value) || 0;
|
||
const precoKg = parseFloat(document.getElementById('calc-preco-kg')?.value) || 0;
|
||
|
||
if (peso === 0 || comprimento === 0 || quantidade === 0 || precoKg === 0) {
|
||
alert('Por favor, preencha todos os campos');
|
||
return;
|
||
}
|
||
|
||
const pesoTotal = peso * comprimento * quantidade;
|
||
const precoTotal = pesoTotal * precoKg;
|
||
const precoPorPeca = precoTotal / quantidade;
|
||
|
||
const resultado = document.getElementById('calc-resultado');
|
||
if (resultado) {
|
||
resultado.innerHTML = `
|
||
<div class="card" style="background: var(--color-success); color: white; padding: 20px; margin-top: 16px;">
|
||
<h3 style="margin: 0 0 16px 0;">💰 Resultado do Cálculo</h3>
|
||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px;">
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Peso Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">${pesoTotal.toFixed(2)} kg</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço Total</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ ${precoTotal.toFixed(2)}</div>
|
||
</div>
|
||
<div>
|
||
<div style="font-size: 12px; opacity: 0.9;">Preço por Peça</div>
|
||
<div style="font-size: 24px; font-weight: bold;">R$ ${precoPorPeca.toFixed(2)}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
}
|
||
}
|
||
|
||
console.log('✅ Função calcularPrecoCantoneira registrada');
|
||
|
||
|
||
// ========================================
|
||
// FUNÇÃO DE CARREGAMENTO FORÇADO
|
||
// ========================================
|
||
|
||
/**
|
||
* Força o carregamento dos dados das cantoneiras
|
||
* Botão de emergência para o usuário
|
||
* VERSÃO ROBUSTA: Usa dados embutidos como prioridade
|
||
*/
|
||
async function forcarCarregamentoCantoneiras() {
|
||
console.log('🚨 CARREGAMENTO FORÇADO INICIADO PELO USUÁRIO');
|
||
|
||
const tbody = document.getElementById('cantoneiras-tbody');
|
||
if (!tbody) {
|
||
alert('❌ Erro: Elemento da tabela não encontrado!');
|
||
console.error('❌ Elemento tbody não encontrado');
|
||
return;
|
||
}
|
||
|
||
// Mostrar loading
|
||
tbody.innerHTML = `
|
||
<tr>
|
||
<td colspan="9" style="text-align: center; padding: 40px;">
|
||
<div style="font-size: 48px; margin-bottom: 16px;">⏳</div>
|
||
<div style="font-size: 18px; font-weight: bold;">Carregando dados...</div>
|
||
<div style="font-size: 14px; color: #666; margin-top: 8px;">Aguarde alguns segundos</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
|
||
try {
|
||
// PRIORIDADE 1: Usar dados embutidos (sempre funciona)
|
||
if (typeof obterDadosPerfil === 'function') {
|
||
console.log('✅ Usando dados embutidos (solução robusta)');
|
||
const dados = obterDadosPerfil('cantoneiras');
|
||
|
||
if (dados && dados.length > 0) {
|
||
// Exibir na tabela
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>${item.nome}</strong></td>
|
||
<td>${item.lado_mm}</td>
|
||
<td>${item.espessura_mm}</td>
|
||
<td>${item.peso_kg_m.toFixed(2)}</td>
|
||
<td>${item.area_cm2.toFixed(2)}</td>
|
||
<td>${item.momento_inercia_cm4.toFixed(2)}</td>
|
||
<td>${item.raio_giracao_cm.toFixed(2)}</td>
|
||
<td><span class="badge badge-info">${item.tipo}</span></td>
|
||
<td><button class="btn btn-sm btn-primary">👁️ Ver</button></td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
// Atualizar contador
|
||
const totalEl = document.getElementById('cant-total');
|
||
if (totalEl) {
|
||
totalEl.textContent = dados.length;
|
||
}
|
||
|
||
// Armazenar globalmente
|
||
window.cantoneirasData = dados;
|
||
|
||
console.log('🎉 CARREGAMENTO CONCLUÍDO (dados embutidos)');
|
||
return;
|
||
}
|
||
}
|
||
|
||
// PRIORIDADE 2: Tentar carregar CSV (se estiver em servidor)
|
||
console.log('📥 Tentando carregar CSV...');
|
||
const response = await fetch('BD/perfis/cantoneiras_brasil_completo.csv');
|
||
|
||
if (!response.ok) {
|
||
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
|
||
}
|
||
|
||
const csvText = await response.text();
|
||
const linhas = csvText.trim().split('\n');
|
||
|
||
console.log(`📊 CSV carregado: ${linhas.length} linhas`);
|
||
|
||
// Processar dados
|
||
const dados = [];
|
||
for (let i = 1; i < linhas.length; i++) {
|
||
const linha = linhas[i].trim();
|
||
if (!linha) continue;
|
||
|
||
const colunas = linha.split(',');
|
||
if (colunas.length >= 9) {
|
||
dados.push({
|
||
id: colunas[0].trim(),
|
||
nome: colunas[1].trim(),
|
||
lado_mm: parseFloat(colunas[2]),
|
||
espessura_mm: parseFloat(colunas[3]),
|
||
peso_kg_m: parseFloat(colunas[4]),
|
||
area_cm2: parseFloat(colunas[5]),
|
||
momento_inercia_cm4: parseFloat(colunas[6]),
|
||
raio_giracao_cm: parseFloat(colunas[7]),
|
||
tipo: colunas[8].trim()
|
||
});
|
||
}
|
||
}
|
||
|
||
console.log(`✅ Processados: ${dados.length} cantoneiras`);
|
||
|
||
if (dados.length === 0) {
|
||
throw new Error('Nenhum dado encontrado no CSV');
|
||
}
|
||
|
||
// Exibir na tabela
|
||
tbody.innerHTML = dados.map(item => `
|
||
<tr>
|
||
<td><strong>${item.nome}</strong></td>
|
||
<td>${item.lado_mm}</td>
|
||
<td>${item.espessura_mm}</td>
|
||
<td>${item.peso_kg_m.toFixed(2)}</td>
|
||
<td>${item.area_cm2.toFixed(2)}</td>
|
||
<td>${item.momento_inercia_cm4.toFixed(2)}</td>
|
||
<td>${item.raio_giracao_cm.toFixed(2)}</td>
|
||
<td><span class="badge badge-info">${item.tipo}</span></td>
|
||
<td><button class="btn btn-sm btn-primary">👁️ Ver</button></td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
// Atualizar contador
|
||
const totalEl = document.getElementById('cant-total');
|
||
if (totalEl) {
|
||
totalEl.textContent = dados.length;
|
||
}
|
||
|
||
// Armazenar globalmente
|
||
window.cantoneirasData = dados;
|
||
|
||
console.log('🎉 CARREGAMENTO FORÇADO CONCLUÍDO COM SUCESSO!');
|
||
|
||
} catch (error) {
|
||
console.error('❌ Erro no carregamento forçado:', error);
|
||
|
||
tbody.innerHTML = `
|
||
<tr>
|
||
<td colspan="9" style="text-align: center; padding: 40px;">
|
||
<div style="font-size: 48px; margin-bottom: 16px;">❌</div>
|
||
<div style="font-size: 18px; font-weight: bold; color: #ef4444;">Erro ao carregar dados</div>
|
||
<div style="font-size: 14px; color: #666; margin-top: 8px;">${error.message}</div>
|
||
<button class="btn btn-primary" onclick="forcarCarregamentoCantoneiras()" style="margin-top: 16px;">
|
||
🔄 Tentar Novamente
|
||
</button>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
|
||
alert(`❌ Erro ao carregar dados: ${error.message}`);
|
||
}
|
||
}
|
||
|
||
// Exportar função globalmente
|
||
window.forcarCarregamentoCantoneiras = forcarCarregamentoCantoneiras;
|
||
|
||
console.log('✅ Função de carregamento forçado disponível');
|
||
|
||
// ========================================
|
||
// AUTO-CARREGAMENTO
|
||
// ========================================
|
||
|
||
/**
|
||
* Detecta quando a seção de cantoneiras é exibida e carrega automaticamente
|
||
*/
|
||
function iniciarAutoCarregamentoCantoneiras() {
|
||
// Usar MutationObserver para detectar quando o botão aparece
|
||
const observer = new MutationObserver((mutations) => {
|
||
const botao = document.getElementById('btn-carregar-cantoneiras');
|
||
const tbody = document.getElementById('cantoneiras-tbody');
|
||
|
||
if (botao && tbody) {
|
||
console.log('🎯 Botão de carregamento detectado - iniciando auto-carregamento');
|
||
|
||
// Verificar se a tabela está vazia
|
||
const linhas = tbody.querySelectorAll('tr');
|
||
const estaVazia = linhas.length === 0 || tbody.textContent.includes('Será preenchido');
|
||
|
||
if (estaVazia) {
|
||
console.log('📊 Tabela vazia detectada - carregando automaticamente...');
|
||
|
||
// Aguardar um pouco e clicar no botão
|
||
setTimeout(() => {
|
||
console.log('🖱️ Clicando no botão automaticamente...');
|
||
botao.click();
|
||
observer.disconnect(); // Parar de observar
|
||
}, 500);
|
||
} else {
|
||
console.log('✅ Tabela já tem dados - não é necessário carregar');
|
||
observer.disconnect();
|
||
}
|
||
}
|
||
});
|
||
|
||
// Observar mudanças no body
|
||
observer.observe(document.body, {
|
||
childList: true,
|
||
subtree: true
|
||
});
|
||
|
||
console.log('👁️ Observer de auto-carregamento iniciado');
|
||
}
|
||
|
||
// Iniciar observer quando o script carregar
|
||
if (document.readyState === 'loading') {
|
||
document.addEventListener('DOMContentLoaded', iniciarAutoCarregamentoCantoneiras);
|
||
} else {
|
||
iniciarAutoCarregamentoCantoneiras();
|
||
}
|
||
|
||
console.log('✅ Sistema de auto-carregamento configurado');
|