dataanalysis / templates /index.html
Ansaribinhyder's picture
Revert back to original
bc46226
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IPM Golden vs Test Data Visualizer</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #e3f2fd, #ffffff);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
color: #333;
}
h1 {
color: #1e88e5;
font-size: 28px;
margin-bottom: 30px;
}
.card {
background: white;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
border-radius: 12px;
padding: 30px 40px;
width: 400px;
text-align: center;
transition: all 0.3s ease;
}
.card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
input[type="file"] {
margin: 15px 0;
padding: 10px;
border: 2px dashed #1e88e5;
border-radius: 8px;
background: #f9fbfc;
cursor: pointer;
width: 100%;
}
button {
background-color: #1e88e5;
color: white;
border: none;
border-radius: 8px;
padding: 12px 20px;
margin-top: 10px;
font-size: 15px;
cursor: pointer;
width: 100%;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #1565c0;
}
.reset-btn {
background-color: #e53935;
margin-top: 20px;
}
.reset-btn:hover {
background-color: #c62828;
}
.message {
color: #2e7d32;
margin-bottom: 15px;
font-weight: 500;
}
.error {
color: #c62828;
margin-bottom: 15px;
font-weight: 500;
}
footer {
position: absolute;
bottom: 10px;
font-size: 13px;
color: #777;
}
@media (max-width: 480px) {
.card {
width: 85%;
padding: 25px;
}
}
</style>
</head>
<body>
<h1>📊 IPM Golden vs Test Data Visualizer</h1>
{% if error %}
<div class="error">{{ error }}</div>
{% endif %}
{% if message %}
<div class="message">{{ message }}</div>
{% endif %}
{% if not golden_loaded %}
<div class="card">
<h3>Step 1: Upload Golden Data (.xlsx)</h3>
<form method="POST" enctype="multipart/form-data">
<input type="file" name="golden_file" accept=".xlsx" required>
<button type="submit">Upload Golden Data</button>
</form>
</div>
{% else %}
<div class="card">
<h3>Step 2: Upload New Test Data (.xlsx)</h3>
<form method="POST" enctype="multipart/form-data">
<input type="file" name="test_file" accept=".xlsx" required>
<button type="submit">Upload Test Data</button>
</form>
</div>
<div class="card" style="width: 250px; margin-top: 20px;">
<form action="/reset_golden">
<button class="reset-btn" type="submit">Reset Golden Data</button>
</form>
</div>
{% endif %}
<footer>© 2025 IPM Data Visualizer</footer>
</body>
</html>
<!-- New Code -->
<!-- <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>IPM5 Data Comparison</title>
</head>
<body>
<h1>Data Comparison Tool</h1>
{% if error %}
<p style="color: red;">Error: {{ error }}</p>
{% endif %}
{% if message %}
<p style="color: green;">{{ message }}</p>
{% endif %}
<hr>
{% if not golden_loaded %}
<h2>1. Upload Golden Data</h2>
<form method="POST" enctype="multipart/form-data">
<input type="file" name="golden_file" accept=".xlsx, .xls" required>
<button type="submit">Upload Golden File</button>
</form>
{% elif not test1_loaded %}
<h2>2. Upload Test Data 1 (Golden loaded)</h2>
<p style="color: blue;">Golden file loaded. Upload Test 1 file next.</p>
<form method="POST" enctype="multipart/form-data">
<input type="file" name="test1_file" accept=".xlsx, .xls" required>
<button type="submit">Upload Test 1 File</button>
</form>
<p><a href="{{ url_for('reset_golden') }}">Reset All Data</a></p>
{% elif not test2_loaded %}
<h2>3. Upload Test Data 2 (Golden & Test 1 loaded)</h2>
<p style="color: blue;">Test 1 file loaded. Upload Test 2 file next.</p>
<form method="POST" enctype="multipart/form-data">
<input type="file" name="test2_file" accept=".xlsx, .xls" required>
<button type="submit">Upload Test 2 File</button>
</form>
<p><a href="{{ url_for('reset_golden') }}">Reset All Data</a></p>
{% else %}
<p style="color: green;">All files loaded successfully!</p>
<a href="{{ url_for('download_comparison') }}">Download Comparison Excel</a>
<p><a href="{{ url_for('reset_golden') }}">Reset All Data</a></p>
{% endif %}
</body>
</html> -->