Upload inicial do TSCUT
This commit is contained in:
root
6
.gitignore
vendored
Normal file
6
.gitignore
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
node_modules
|
||||
dist
|
||||
.vercel
|
||||
.vscode
|
||||
.DS_Store
|
||||
*.local
|
||||
713
RELATORIO.html
Normal file
713
RELATORIO.html
Normal file
@@ -0,0 +1,713 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="pt-BR">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Plano de Corte - Ferro Redondo 1/2" ASTM A36</title>
|
||||
<style>
|
||||
:root {
|
||||
--color-primary: #1a6b8f;
|
||||
--color-primary-light: #2d8bb0;
|
||||
--color-success: #27ae60;
|
||||
--color-warning: #e67e22;
|
||||
--color-bg: #ffffff;
|
||||
--color-surface: #ffffff;
|
||||
--color-text: #2c3e50;
|
||||
--color-text-light: #7f8c8d;
|
||||
--color-border: #bdc3c7;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body {
|
||||
font-family: 'Arial', sans-serif;
|
||||
background-color: var(--color-bg);
|
||||
color: var(--color-text);
|
||||
line-height: 1.3;
|
||||
width: 210mm;
|
||||
height: 297mm;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 210mm;
|
||||
height: 297mm;
|
||||
margin: 0 auto;
|
||||
padding: 10mm;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
header {
|
||||
background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
color: white;
|
||||
padding: 10mm 8mm;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 6mm;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 14pt;
|
||||
margin-bottom: 2mm;
|
||||
}
|
||||
|
||||
header p {
|
||||
font-size: 8pt;
|
||||
opacity: 0.95;
|
||||
}
|
||||
|
||||
.summary {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
gap: 4mm;
|
||||
margin-bottom: 6mm;
|
||||
}
|
||||
|
||||
.summary-card {
|
||||
background: var(--color-surface);
|
||||
padding: 6mm;
|
||||
border-radius: 2px;
|
||||
border-left: 2px solid var(--color-primary);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.summary-card h3 {
|
||||
font-size: 7pt;
|
||||
color: var(--color-text-light);
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 3mm;
|
||||
}
|
||||
|
||||
.summary-card .value {
|
||||
font-size: 12pt;
|
||||
font-weight: bold;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.summary-card.success {
|
||||
border-left-color: var(--color-success);
|
||||
}
|
||||
|
||||
.summary-card.success .value {
|
||||
color: var(--color-success);
|
||||
}
|
||||
|
||||
.summary-card.warning {
|
||||
border-left-color: var(--color-warning);
|
||||
}
|
||||
|
||||
.summary-card.warning .value {
|
||||
color: var(--color-warning);
|
||||
}
|
||||
|
||||
.cutting-plan {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 4mm;
|
||||
margin-bottom: 4mm;
|
||||
}
|
||||
|
||||
.bar-section {
|
||||
background: var(--color-surface);
|
||||
padding: 6mm;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
border: 1px solid var(--color-border);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bar-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 4mm;
|
||||
padding-bottom: 2mm;
|
||||
border-bottom: 1px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.bar-title {
|
||||
font-size: 9pt;
|
||||
font-weight: bold;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.bar-stats {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1mm;
|
||||
font-size: 7pt;
|
||||
}
|
||||
|
||||
.bar-stat {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2mm;
|
||||
}
|
||||
|
||||
.bar-stat-label {
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.bar-stat-value {
|
||||
font-weight: bold;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 100%;
|
||||
height: 35mm;
|
||||
border: 0.5px solid var(--color-border);
|
||||
border-radius: 2px;
|
||||
background: #fafafa;
|
||||
margin-bottom: 2mm;
|
||||
}
|
||||
|
||||
.piece-label {
|
||||
font-size: 8px;
|
||||
font-weight: bold;
|
||||
text-anchor: middle;
|
||||
fill: white;
|
||||
}
|
||||
|
||||
.waste-label {
|
||||
font-size: 7px;
|
||||
font-weight: bold;
|
||||
text-anchor: middle;
|
||||
fill: #999;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.piece-dimension {
|
||||
font-size: 7px;
|
||||
text-anchor: middle;
|
||||
fill: var(--color-text);
|
||||
}
|
||||
|
||||
.pieces-table {
|
||||
width: 100%;
|
||||
font-size: 7pt;
|
||||
border-collapse: collapse;
|
||||
margin-bottom: 2mm;
|
||||
}
|
||||
|
||||
.pieces-table th {
|
||||
background-color: var(--color-primary);
|
||||
color: white;
|
||||
padding: 2mm;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pieces-table td {
|
||||
padding: 1.5mm;
|
||||
border-bottom: 0.5px solid var(--color-border);
|
||||
}
|
||||
|
||||
.pieces-table tr:nth-child(even) {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.efficiency-bar {
|
||||
width: 100%;
|
||||
height: 8mm;
|
||||
background-color: #e0e0e0;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.efficiency-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, var(--color-success) 0%, var(--color-primary-light) 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 7pt;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
footer {
|
||||
background: var(--color-surface);
|
||||
padding: 4mm;
|
||||
border-radius: 2px;
|
||||
border-top: 2px solid var(--color-primary);
|
||||
text-align: center;
|
||||
font-size: 7pt;
|
||||
color: var(--color-text-light);
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@media print {
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 210mm;
|
||||
height: 297mm;
|
||||
}
|
||||
.container {
|
||||
margin: 0;
|
||||
padding: 8mm;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1>📊 Plano de Corte Otimizado</h1>
|
||||
<p>Ferro Redondo 1/2" (Ø 12,7 mm) | Aço Carbono ASTM A36 | Barras de 6.000 mm</p>
|
||||
</header>
|
||||
|
||||
<div class="summary">
|
||||
<div class="summary-card success">
|
||||
<h3>Total de Peças</h3>
|
||||
<div class="value">28</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<h3>Barras Utilizadas</h3>
|
||||
<div class="value">4</div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<h3>Comprimento Total Necessário</h3>
|
||||
<div class="value">20.730 mm</div>
|
||||
</div>
|
||||
<div class="summary-card warning">
|
||||
<h3>Sobra Total</h3>
|
||||
<div class="value">3.270 mm</div>
|
||||
</div>
|
||||
<div class="summary-card success">
|
||||
<h3>Eficiência de Corte</h3>
|
||||
<div class="value">86,38%</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cutting-plan">
|
||||
<!-- BARRA 1 -->
|
||||
<div class="bar-section">
|
||||
<div class="bar-header">
|
||||
<div class="bar-title">📌 BARRA 1</div>
|
||||
<div class="bar-stats">
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Comprimento Usado:</span>
|
||||
<span class="bar-stat-value">5.975 mm</span>
|
||||
</div>
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Sobra:</span>
|
||||
<span class="bar-stat-value" style="color: #e67e22;">25 mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg viewBox="0 0 6200 120" height="50">
|
||||
<!-- Fundo da barra -->
|
||||
<rect x="0" y="10" width="6000" height="60" fill="#ecf0f1" stroke="#34495e" stroke-width="1.5"/>
|
||||
|
||||
<!-- Peça 1090mm (primeira) -->
|
||||
<rect x="0" y="10" width="1090" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="1090" y1="10" x2="1090" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="545" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1090</text>
|
||||
|
||||
<!-- Peça 1090mm (segunda) -->
|
||||
<rect x="1090" y="10" width="1090" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2180" y1="10" x2="2180" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="1635" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1090</text>
|
||||
|
||||
<!-- Peça 1090mm (terceira) -->
|
||||
<rect x="2180" y="10" width="1090" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="3270" y1="10" x2="3270" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2725" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1090</text>
|
||||
|
||||
<!-- Peça 1070mm (primeira) -->
|
||||
<rect x="3270" y="10" width="1070" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="4340" y1="10" x2="4340" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="3805" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1070</text>
|
||||
|
||||
<!-- Peça 1070mm (segunda) -->
|
||||
<rect x="4340" y="10" width="1070" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5410" y1="10" x2="5410" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="4875" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1070</text>
|
||||
|
||||
<!-- Peça 565mm -->
|
||||
<rect x="5410" y="10" width="565" height="60" fill="#9b59b6" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5975" y1="10" x2="5975" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="5692.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">565</text>
|
||||
|
||||
<!-- Sobra -->
|
||||
<rect x="5975" y="10" width="25" height="60" fill="#e74c3c" stroke="#c0392b" stroke-width="1.5" stroke-dasharray="3,3"/>
|
||||
<text x="5987.5" y="48" style="font-size: 9px; font-weight: bold; text-anchor: middle; fill: white;">25</text>
|
||||
</svg>
|
||||
|
||||
<table class="pieces-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="padding: 1mm;">Peça</th>
|
||||
<th style="padding: 1mm;">mm</th>
|
||||
<th style="padding: 1mm;">Qtd</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#1-3</td>
|
||||
<td style="padding: 0.8mm;">1090</td>
|
||||
<td style="padding: 0.8mm;">3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#4-5</td>
|
||||
<td style="padding: 0.8mm;">1070</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#6</td>
|
||||
<td style="padding: 0.8mm;">565</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr style="background: #ffe6e6;">
|
||||
<td style="padding: 0.8mm;"><strong>SOBRA</strong></td>
|
||||
<td style="padding: 0.8mm;">25</td>
|
||||
<td style="padding: 0.8mm;">mm</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="efficiency-bar" style="height: 6mm;">
|
||||
<div class="efficiency-fill" style="width: 99.58%; font-size: 6pt;">99,58%</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- BARRA 2 -->
|
||||
<div class="bar-section">
|
||||
<div class="bar-header">
|
||||
<div class="bar-title">📌 BARRA 2</div>
|
||||
<div class="bar-stats">
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Comprimento Usado:</span>
|
||||
<span class="bar-stat-value">5.705 mm</span>
|
||||
</div>
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Sobra:</span>
|
||||
<span class="bar-stat-value" style="color: #e67e22;">295 mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg viewBox="0 0 6200 120" height="50">
|
||||
<!-- Fundo da barra -->
|
||||
<rect x="0" y="10" width="6000" height="60" fill="#ecf0f1" stroke="#34495e" stroke-width="1.5"/>
|
||||
|
||||
<!-- Peça 1040mm -->
|
||||
<rect x="0" y="10" width="1040" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="1040" y1="10" x2="1040" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="520" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1040</text>
|
||||
|
||||
<!-- Peça 1035mm (primeira) -->
|
||||
<rect x="1040" y="10" width="1035" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2075" y1="10" x2="2075" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="1557.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1035</text>
|
||||
|
||||
<!-- Peça 1035mm (segunda) -->
|
||||
<rect x="2075" y="10" width="1035" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="3110" y1="10" x2="3110" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2592.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1035</text>
|
||||
|
||||
<!-- Peça 1035mm (terceira) -->
|
||||
<rect x="3110" y="10" width="1035" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="4145" y1="10" x2="4145" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="3627.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1035</text>
|
||||
|
||||
<!-- Peça 1020mm -->
|
||||
<rect x="4145" y="10" width="1020" height="60" fill="#9b59b6" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5165" y1="10" x2="5165" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="4655" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1020</text>
|
||||
|
||||
<!-- Peça 540mm -->
|
||||
<rect x="5165" y="10" width="540" height="60" fill="#f39c12" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5705" y1="10" x2="5705" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="5435" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">540</text>
|
||||
|
||||
<!-- Sobra -->
|
||||
<rect x="5705" y="10" width="295" height="60" fill="#e74c3c" stroke="#c0392b" stroke-width="1.5" stroke-dasharray="3,3"/>
|
||||
<text x="5852.5" y="48" style="font-size: 9px; font-weight: bold; text-anchor: middle; fill: white;">295</text>
|
||||
</svg>
|
||||
|
||||
<table class="pieces-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="padding: 1mm;">Peça</th>
|
||||
<th style="padding: 1mm;">mm</th>
|
||||
<th style="padding: 1mm;">Qtd</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#1</td>
|
||||
<td style="padding: 0.8mm;">1040</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#2-4</td>
|
||||
<td style="padding: 0.8mm;">1035</td>
|
||||
<td style="padding: 0.8mm;">3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#5</td>
|
||||
<td style="padding: 0.8mm;">1020</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#6</td>
|
||||
<td style="padding: 0.8mm;">540</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr style="background: #ffe6e6;">
|
||||
<td style="padding: 0.8mm;"><strong>SOBRA</strong></td>
|
||||
<td style="padding: 0.8mm;">295</td>
|
||||
<td style="padding: 0.8mm;">mm</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="efficiency-bar" style="height: 6mm;">
|
||||
<div class="efficiency-fill" style="width: 95.08%; font-size: 6pt;">95,08%</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- BARRA 3 -->
|
||||
<div class="bar-section">
|
||||
<div class="bar-header">
|
||||
<div class="bar-title">📌 BARRA 3</div>
|
||||
<div class="bar-stats">
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Comprimento Usado:</span>
|
||||
<span class="bar-stat-value">5.940 mm</span>
|
||||
</div>
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Sobra:</span>
|
||||
<span class="bar-stat-value" style="color: #e67e22;">60 mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg viewBox="0 0 6200 120" height="50">
|
||||
<!-- Fundo da barra -->
|
||||
<rect x="0" y="10" width="6000" height="60" fill="#ecf0f1" stroke="#34495e" stroke-width="1.5"/>
|
||||
|
||||
<!-- Peça 1020mm -->
|
||||
<rect x="0" y="10" width="1020" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="1020" y1="10" x2="1020" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="510" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">1020</text>
|
||||
|
||||
<!-- Peça 990mm -->
|
||||
<rect x="1020" y="10" width="990" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2010" y1="10" x2="2010" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="1515" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">990</text>
|
||||
|
||||
<!-- Peça 980mm -->
|
||||
<rect x="2010" y="10" width="980" height="60" fill="#9b59b6" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2990" y1="10" x2="2990" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2500" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">980</text>
|
||||
|
||||
<!-- Peça 515mm (primeira) -->
|
||||
<rect x="2990" y="10" width="515" height="60" fill="#f39c12" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="3505" y1="10" x2="3505" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="3247.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">515</text>
|
||||
|
||||
<!-- Peça 515mm (segunda) -->
|
||||
<rect x="3505" y="10" width="515" height="60" fill="#f39c12" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="4020" y1="10" x2="4020" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="3762.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">515</text>
|
||||
|
||||
<!-- Peça 485mm (primeira) -->
|
||||
<rect x="4020" y="10" width="485" height="60" fill="#1abc9c" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="4505" y1="10" x2="4505" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="4252.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">485</text>
|
||||
|
||||
<!-- Peça 485mm (segunda) -->
|
||||
<rect x="4505" y="10" width="485" height="60" fill="#1abc9c" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="4990" y1="10" x2="4990" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="4737.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">485</text>
|
||||
|
||||
<!-- Peça 475mm (primeira) -->
|
||||
<rect x="4990" y="10" width="475" height="60" fill="#e74c3c" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5465" y1="10" x2="5465" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="5227.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">475</text>
|
||||
|
||||
<!-- Peça 475mm (segunda) -->
|
||||
<rect x="5465" y="10" width="475" height="60" fill="#e74c3c" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="5940" y1="10" x2="5940" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="5702.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">475</text>
|
||||
|
||||
<!-- Sobra -->
|
||||
<rect x="5940" y="10" width="60" height="60" fill="#e74c3c" stroke="#c0392b" stroke-width="1.5" stroke-dasharray="3,3"/>
|
||||
<text x="5970" y="48" style="font-size: 9px; font-weight: bold; text-anchor: middle; fill: white;">60</text>
|
||||
</svg>
|
||||
|
||||
<table class="pieces-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="padding: 1mm;">Peça</th>
|
||||
<th style="padding: 1mm;">mm</th>
|
||||
<th style="padding: 1mm;">Qtd</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#1</td>
|
||||
<td style="padding: 0.8mm;">1020</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#2</td>
|
||||
<td style="padding: 0.8mm;">990</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#3</td>
|
||||
<td style="padding: 0.8mm;">980</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#4-5</td>
|
||||
<td style="padding: 0.8mm;">515</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#6-7</td>
|
||||
<td style="padding: 0.8mm;">485</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#8-9</td>
|
||||
<td style="padding: 0.8mm;">475</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr style="background: #ffe6e6;">
|
||||
<td style="padding: 0.8mm;"><strong>SOBRA</strong></td>
|
||||
<td style="padding: 0.8mm;">60</td>
|
||||
<td style="padding: 0.8mm;">mm</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="efficiency-bar" style="height: 6mm;">
|
||||
<div class="efficiency-fill" style="width: 99.00%; font-size: 6pt;">99,00%</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- BARRA 4 -->
|
||||
<div class="bar-section">
|
||||
<div class="bar-header">
|
||||
<div class="bar-title">📌 BARRA 4</div>
|
||||
<div class="bar-stats">
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Comprimento Usado:</span>
|
||||
<span class="bar-stat-value">3.110 mm</span>
|
||||
</div>
|
||||
<div class="bar-stat">
|
||||
<span class="bar-stat-label">Sobra:</span>
|
||||
<span class="bar-stat-value" style="color: #e67e22;">2.890 mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg viewBox="0 0 6200 120" height="50">
|
||||
<!-- Fundo da barra -->
|
||||
<rect x="0" y="10" width="6000" height="60" fill="#ecf0f1" stroke="#34495e" stroke-width="1.5"/>
|
||||
|
||||
<!-- Peça 475mm (primeira) -->
|
||||
<rect x="0" y="10" width="475" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="475" y1="10" x2="475" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="237.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">475</text>
|
||||
|
||||
<!-- Peça 475mm (segunda) -->
|
||||
<rect x="475" y="10" width="475" height="60" fill="#3498db" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="950" y1="10" x2="950" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="712.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">475</text>
|
||||
|
||||
<!-- Peça 460mm -->
|
||||
<rect x="950" y="10" width="460" height="60" fill="#2ecc71" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="1410" y1="10" x2="1410" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="1180" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">460</text>
|
||||
|
||||
<!-- Peça 435mm (primeira) -->
|
||||
<rect x="1410" y="10" width="435" height="60" fill="#9b59b6" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="1845" y1="10" x2="1845" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="1627.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">435</text>
|
||||
|
||||
<!-- Peça 435mm (segunda) -->
|
||||
<rect x="1845" y="10" width="435" height="60" fill="#9b59b6" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2280" y1="10" x2="2280" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2062.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">435</text>
|
||||
|
||||
<!-- Peça 415mm (primeira) -->
|
||||
<rect x="2280" y="10" width="415" height="60" fill="#f39c12" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="2695" y1="10" x2="2695" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2487.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">415</text>
|
||||
|
||||
<!-- Peça 415mm (segunda) -->
|
||||
<rect x="2695" y="10" width="415" height="60" fill="#f39c12" stroke="#34495e" stroke-width="1.5"/>
|
||||
<line x1="3110" y1="10" x2="3110" y2="70" stroke="#000" stroke-width="1"/>
|
||||
<text x="2902.5" y="48" style="font-size: 11px; font-weight: bold; text-anchor: middle; fill: white;">415</text>
|
||||
|
||||
<!-- Sobra -->
|
||||
<rect x="3110" y="10" width="2890" height="60" fill="#e74c3c" stroke="#c0392b" stroke-width="1.5" stroke-dasharray="3,3"/>
|
||||
<text x="4555" y="48" style="font-size: 9px; font-weight: bold; text-anchor: middle; fill: white;">2890</text>
|
||||
</svg>
|
||||
|
||||
<table class="pieces-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="padding: 1mm;">Peça</th>
|
||||
<th style="padding: 1mm;">mm</th>
|
||||
<th style="padding: 1mm;">Qtd</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#1-2</td>
|
||||
<td style="padding: 0.8mm;">475</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#3</td>
|
||||
<td style="padding: 0.8mm;">460</td>
|
||||
<td style="padding: 0.8mm;">1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#4-5</td>
|
||||
<td style="padding: 0.8mm;">435</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0.8mm;">#6-7</td>
|
||||
<td style="padding: 0.8mm;">415</td>
|
||||
<td style="padding: 0.8mm;">2</td>
|
||||
</tr>
|
||||
<tr style="background: #ffe6e6;">
|
||||
<td style="padding: 0.8mm;"><strong>SOBRA</strong></td>
|
||||
<td style="padding: 0.8mm;">2890</td>
|
||||
<td style="padding: 0.8mm;">mm</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="efficiency-bar" style="height: 6mm;">
|
||||
<div class="efficiency-fill" style="width: 51.83%; font-size: 6pt;">51,83%</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<strong>Material:</strong> Ferro Redondo 1/2" ASTM A36 | <strong>28 peças</strong> | 20.730 mm | Eficiência 86,38% | Sobras: B1=25mm | B2=295mm | B3=60mm | B4=2.890mm
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
195
index.html
Normal file
195
index.html
Normal file
@@ -0,0 +1,195 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="pt-BR">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" href="/logo.png" type="image/png">
|
||||
<title>Otimizador de Corte - TSCUT</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1><img src="/logo.png" alt="Logo" class="app-logo">Otimizador de Plano de Corte</h1>
|
||||
<p>Barras Lineares | Algoritmo FFD Avançado | Otimização com Múltiplas Barras</p>
|
||||
<button id="themeToggle" class="theme-toggle-btn" onclick="toggleTheme()" title="Alternar Tema">🌙</button>
|
||||
</header>
|
||||
|
||||
<div class="layout">
|
||||
<!-- PAINEL DE ENTRADA -->
|
||||
<div class="panel">
|
||||
<h2>📥 Dados de Entrada</h2>
|
||||
|
||||
<div class="form-group job-title-group">
|
||||
<label for="jobTitle" class="job-title-label">Título do Trabalho</label>
|
||||
<input type="text" id="jobTitle" placeholder="Ex: Estrutura Galpão A" class="job-title-input">
|
||||
<div class="job-actions">
|
||||
<button class="btn-primary btn-small" onclick="saveJob()">💾 Salvar
|
||||
Trabalho</button>
|
||||
<button class="btn-primary btn-small btn-secondary"
|
||||
onclick="document.getElementById('jobImport').click()">📂 Abrir Trabalho</button>
|
||||
<input type="file" id="jobImport" accept=".csv" class="hidden" onchange="loadJob()"
|
||||
title="Importar Trabalho">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PROCESSO DE CORTE -->
|
||||
<div class="process-section">
|
||||
<label class="section-label">🔥 Processo de Corte</label>
|
||||
<div class="process-options">
|
||||
<label class="process-option">
|
||||
<input type="radio" name="cuttingProcess" value="plasma" checked onchange="updateProcess()">
|
||||
<span class="process-name">Plasma (3mm)</span>
|
||||
</label>
|
||||
<label class="process-option">
|
||||
<input type="radio" name="cuttingProcess" value="saw" onchange="updateProcess()">
|
||||
<span class="process-name">Serra/Disco (2mm)</span>
|
||||
</label>
|
||||
<label class="process-option">
|
||||
<input type="radio" name="cuttingProcess" value="oxy" onchange="updateProcess()">
|
||||
<span class="process-name">Oxicorte (5mm)</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="section-divider">
|
||||
|
||||
<!-- BARRAS DISPONÍVEIS -->
|
||||
<h3 class="section-title">📦 Barras Disponíveis</h3>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="barDesc">Descrição</label>
|
||||
<input type="text" id="barDesc" placeholder="Ex: Cantoneira L3x1/4 A36">
|
||||
</div>
|
||||
|
||||
<div class="grid-2-col">
|
||||
<div class="form-group">
|
||||
<label for="barQty">Quantidade</label>
|
||||
<input type="number" id="barQty" value="1" min="1">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="barLength">Comp. (mm)</label>
|
||||
<input type="number" id="barLength" value="6000" min="100">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="barWeight">Peso (kg)</label>
|
||||
<input type="number" id="barWeight" value="45" min="0.1" step="0.1">
|
||||
</div>
|
||||
|
||||
<div class="action-row">
|
||||
<button id="btnAddBar" class="btn-primary" onclick="addBar()">➕ Adicionar Barra</button>
|
||||
<button id="btnCancelBarEdit" class="btn-danger hidden" onclick="cancelBarEdit()">🚫
|
||||
Cancelar</button>
|
||||
</div>
|
||||
|
||||
<div class="list-container mt-10" id="barsList">
|
||||
<div class="no-data">Nenhuma barra adicionada</div>
|
||||
</div>
|
||||
|
||||
<hr class="section-divider">
|
||||
|
||||
<!-- PEÇAS -->
|
||||
<h3 class="section-title">✂️ Peças (Demanda)</h3>
|
||||
|
||||
<div class="action-row mb-10">
|
||||
<button class="btn-primary import-btn" onclick="document.getElementById('fileImport').click()">📁
|
||||
Importar Arquivo</button>
|
||||
<input type="file" id="fileImport" accept=".xlsx,.xls,.csv" class="hidden" onchange="importFile()"
|
||||
title="Importar Arquivo de Peças">
|
||||
</div>
|
||||
<div id="importFeedback" class="feedback-msg">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="pieceTag">TAG/Identificação</label>
|
||||
<input type="text" id="pieceTag" placeholder="Ex: B101-2-15">
|
||||
</div>
|
||||
|
||||
<div class="grid-2-col">
|
||||
<div class="form-group">
|
||||
<label for="pieceLength">Comp. (mm)</label>
|
||||
<input type="number" id="pieceLength" placeholder="Ex: 3450" min="1">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="pieceQty">Quantidade</label>
|
||||
<input type="number" id="pieceQty" value="1" min="1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="action-row">
|
||||
<button id="btnAddPiece" class="btn-primary" onclick="addPiece()">➕ Adicionar Peça</button>
|
||||
<button id="btnCancelEdit" class="btn-danger hidden" onclick="cancelEdit()">🚫
|
||||
Cancelar</button>
|
||||
</div>
|
||||
|
||||
<div class="list-container mt-10" id="piecesList">
|
||||
<div class="no-data">Nenhuma peça adicionada</div>
|
||||
</div>
|
||||
|
||||
<hr class="section-divider">
|
||||
|
||||
<button class="btn-success btn-calc" onclick="calculateOptimization()">🔄 Calcular
|
||||
Otimização</button>
|
||||
<button class="btn-danger btn-clear" onclick="clearAll()">🗑️
|
||||
Limpar Tudo</button>
|
||||
</div>
|
||||
|
||||
<!-- PAINEL DE RESULTADOS -->
|
||||
<div>
|
||||
<div class="panel">
|
||||
<h2>📊 Resumo</h2>
|
||||
<div class="results" id="summaryResults">
|
||||
<div class="no-data grid-full-col">Calcule a otimização para ver os resultados
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel mt-20">
|
||||
<h2>📌 Peças Demandadas</h2>
|
||||
<div class="pieces-balloons" id="piecesBalloons">
|
||||
<div class="no-data full-width">Nenhuma peça adicionada</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="export-buttons">
|
||||
<button class="btn-primary" onclick="exportHTML()">📄 Exportar</button>
|
||||
<button class="btn-primary" onclick="printReport()">🖨️ Imprimir</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PLANO DE CORTE -->
|
||||
<div class="panel">
|
||||
<h2>✂️ Plano de Corte Otimizado</h2>
|
||||
<div class="bars-container" id="barsContainer">
|
||||
<div class="no-data">Resultados aparecerão após o cálculo</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TOAST CONTAINER -->
|
||||
<div id="toastContainer" class="toast-container"></div>
|
||||
|
||||
<!-- CONFIRM MODAL -->
|
||||
<div id="confirmModal" class="modal-overlay">
|
||||
<div class="modal">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title" id="modalTitle">Confirmação</div>
|
||||
</div>
|
||||
<div class="modal-body" id="modalMessage">
|
||||
Deseja confirmar esta ação?
|
||||
</div>
|
||||
<div class="modal-actions">
|
||||
<button class="modal-btn modal-btn-cancel" onclick="closeModal()">Cancelar</button>
|
||||
<button class="modal-btn modal-btn-confirm" id="modalConfirmBtn">Confirmar</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
1153
package-lock.json
generated
Normal file
1153
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
25
package.json
Normal file
25
package.json
Normal file
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"name": "tscut",
|
||||
"version": "1.0.0",
|
||||
"description": "Otimizador de Plano de Corte 2D",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"start": "vite preview --port $PORT --host 0.0.0.0",
|
||||
"preview": "vite preview",
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"keywords": [
|
||||
"cutting",
|
||||
"optimizer",
|
||||
"vite"
|
||||
],
|
||||
"author": "admtracksteel",
|
||||
"license": "ISC",
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"papaparse": "^5.5.3",
|
||||
"vite": "^7.3.1",
|
||||
"xlsx": "^0.18.5"
|
||||
}
|
||||
}
|
||||
BIN
public/logo.png
Normal file
BIN
public/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 505 KiB |
1187
src/main.js
Normal file
1187
src/main.js
Normal file
File diff suppressed because it is too large
Load Diff
1323
src/style.css
Normal file
1323
src/style.css
Normal file
File diff suppressed because it is too large
Load Diff
9
vite.config.js
Normal file
9
vite.config.js
Normal file
@@ -0,0 +1,9 @@
|
||||
export default {
|
||||
root: './',
|
||||
build: {
|
||||
outDir: 'dist',
|
||||
},
|
||||
preview: {
|
||||
allowedHosts: true
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user