updated code

This commit is contained in:
Pooja Fulari
2026-04-27 10:18:10 +05:30
parent e46e1e52bb
commit ddf38f6bc3
61 changed files with 8687 additions and 1877 deletions

View File

@@ -1,196 +1,216 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Task Report Generator</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Generate Report</title>
<!-- Select2 CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet" />
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
<style>
body {
margin: 0;
font-family: 'Inter', sans-serif;
background: #f1f5f9;
}
body {
font-family: 'Arial', sans-serif;
background-color: #f4f7fc;
padding: 0 20px;
margin-left: 275px;
}
/* Sidebar */
.sidebar {
width: 240px;
height: 100vh;
position: fixed;
background: linear-gradient(180deg, #0f172a, #1e293b);
padding: 20px;
}
h1.report_title {
text-align: center;
margin-top: 100px;
color: #333;
font-size: 28px;
}
.sidebar img {
width: 60px;
display: block;
margin: 0 auto 20px;
}
form {
max-width: 500px;
margin: 60px auto;
padding: 30px;
background-color: #ffffff;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
border: 1px solid #e0e0e0;
}
.sidebar a {
display: block;
color: #cbd5f5;
text-decoration: none;
padding: 10px;
border-radius: 8px;
margin-bottom: 8px;
}
form label {
display: block;
margin-bottom: 10px;
font-size: 16px;
font-weight: bold;
color: #333;
}
.sidebar a:hover {
background: rgba(59,130,246,0.2);
color: white;
}
select, button {
width: 100%;
padding: 12px 16px;
font-size: 16px;
border-radius: 5px;
border: 1px solid #ddd;
margin-bottom: 20px;
background-color: #fafafa;
}
/* Header */
.header {
margin-left: 270px;
height: 60px;
background: white;
display: flex;
align-items: center;
padding-left: 20px;
font-weight: 600;
box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
button {
background-color: #28a745;
color: white;
border: none;
cursor: pointer;
}
/* Main */
.main {
margin-left: 280px;
padding: 30px;
}
button:hover { background-color: #218838; }
/* Card */
.card {
background: white;
padding: 30px;
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,0.08);
max-width: 500px;
margin: 100px auto;
}
.form-group { margin-bottom: 15px; }
/* Title */
.title {
text-align: center;
margin-bottom: 35px;
font-size: 22px;
font-weight: 600;
}
.sidebar {
width: 295px;
background-color: #f4f4f4;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
padding: 20px;
position: fixed;
top: 0;
left: 0;
bottom: 0;
display: flex;
flex-direction: column;
align-items: center;
z-index: 1001;
}
/* Form */
label {
display: block;
margin-bottom: 10px;
font-weight: 500;
margin-top: 10px;
}
.sidebar .logo { width: 60px; margin-bottom: 20px; }
select {
width: 100%;
padding: 10px;
border-radius: 8px;
border: 1px solid #ddd;
margin-bottom: 25px;
margin-top: 20px;
}
.sidebar a {
display: block;
color: #333;
text-decoration: none;
padding: 10px 15px;
margin: 10px 0;
border-radius: 5px;
text-align: center;
}
/* Button */
.btn {
width: 100%;
padding: 12px;
border: none;
border-radius: 10px;
background: linear-gradient(135deg, #3b82f6, #2563eb);
color: white;
font-size: 15px;
cursor: pointer;
transition: 0.3s;
margin-top: 20px;
}
.sidebar a:hover {
background-color: #007bff;
color: white;
}
.btn:hover {
opacity: 0.9;
}
.header {
width: 100%;
background-color: #007bff;
color: white;
text-align: center;
padding: 15px 0;
font-size: 24px;
font-weight: bold;
position: fixed;
top: 0;
left: 0;
z-index: 1000;
}
</style>
/* Select2 Fix */
.select2-container .select2-selection--single {
height: 42px;
border-radius: 8px;
border: 1px solid #ddd;
}
.select2-container .select2-selection__rendered {
line-height: 42px;
}
.select2-container .select2-selection__arrow {
height: 42px;
}
.sidebar .logo {
width: 60px;
margin: 0 auto 20px;
}
.sidebar h2 {
color: white;
text-align: center;
margin-bottom: 20px;
}
</style>
</head>
<body>
<!-- Sidebar -->
<div class="sidebar">
<!-- <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA..." class="logo"/> -->
<img
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA+CAYAAAB3NHh5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4JpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTMyIDc5LjE1OTI4NCwgMjAxNi8wNC8xOS0xMzoxMzo0MCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo4NkEzOEVGMzEwQTQxMUU4QUFBQkY0QTA2QzlEM0MxNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUQzQTIzRDE4NTkxMUU4ODE2Q0IwMTY0RjgxQTVGNyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUQzQTIzQzE4NTkxMUU4ODE2Q0IwMTY0RjgxQTVGNyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNS41IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmJhNmE4ZTBmLTI5ZWItNDBlMy05ZWFhLTYzNTdiYjdkMzcwNCIgc3RSZWY6ZG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOmRhMjgyMWMwLTYwYmQtMTE3Yi04ZGU3LWNjZmQ1MDgzNjUxNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrVd/GcAAASESURBVHja7FtrSBRRFL7rrg9MMjUzspTSSqUg6GFBmohh9SeIMOhXhBX0KzL80YN+SBD+qJ+RBhFEQogV0RMLKyuiqIig6GlZRmlRavl2O8c9I7dtZ2adM3d9zB742GHuzpn7zZl7zrnn3nF5vV7hJHEh4aLKaxfgeAXAjee0NoDX7ziCjl2yDsANwHbAsQD3mALYA3ii04e9gEZAP6BM5z9nAA2AKos8FwK+1pcX53noxCJAMuPBzQLEATbotEfpnMeHfIiuSzK4vhnw2KA9GJkryGIoz5hvyjlAr0F7e4BzuYBbdPwG8Mvg+m+APmYfh/qgWbiXqWzQpN3fUSyj19hj8gbYKV7Zwsp9hXS8BHBXIhsqiQglYTf9LgbcGQWywxKqG7cAssiy0aMVkWQLpzGVoYfvMWjvBlQwyKKPiWT2MU628DZACkPZa0CGQXs00zHOBnwBrLF4fTbgnb+X7mJ0qN/EH3iZYUVLfKz2sQMwSSZ8kkKFVTkKOKxw/KF1Zkhx26rUaFb5xFTUpjiWRtmQeHSGMiyNGQkTdgrhVKaeJBvycbM4zE2S/vHSpTRv7beo7CEgXiFh7GwTTSetCE5/f8iEMdOaajJFM5KtgHyFhDcC/gBeMfKEeJnwAcDyMTz0FgAqmTowG6zWxnCrA/zVc9lp9TmAcEgLAOE4HCY8zgoAZuI28RPdiuO45umHw9LuIKoWHPlOiY1RNeIETfI5gkWM6YABv/MZFMeHCWONOAFwWRFhrKjkEPFAshMwB/CReZ9LZn/QCM8ErBe+ZQ9VUid8JdpAclH4llO40kmFjBdmTmsXYL4NFQWzIkGXDt7adA8cGlgZzQrGS+OMpABwW2HVwkrbSAWH5gNBa0nBhCUk3TjOQ9BkIp0phyQ9wl6a+dwb56QTiEOmkNa2IgzyzpWA+zZ2oMNiG0eSydLp/l5aj/Qq4VsLyrXh5jgJz9NpK1Bo6UQqHuCCfbVZ2aSP5smbBW+pYx5gh4FDRM+6D/BZEWksQf2ULVxC5g80L8YqyFPx/xrvSOQUjaUSnfYyevWyFVr6t0wY92AsVXizJJNximnfFuFbAVElGHnyNKfVothjDpr4iyjNAgqlVfbSA+GKR7gAMLEIexzA1SMTjnUA4VjZspsAMQxluGqxVqhbFMetjQcB7xk6umXChUZzyCCkFnBcIeGblI3tZ+h4if3UCJczE49EoXbLA87VcWNLBUMHLvjVamO42YZqxljf8tAcjsNOIuxyGuEMGyoLPQr72SP4Ww/T5LBURZ226rweyWUUC+I2mW9jZ3GTeCnjHk0y4fOCNl8yvHQO4/oBYbzJPIaszKmmdsiEa4R+vSkYwe0IRyxee0X4PkEoNPgPfiKQSsmDVcHaXL5HshBH2i2OsauAdXRstNgWacOcvU12WtyPl6xcf53yb01Ub7sIeQHA6zcZKJ7IiYdMth5QNNpxOJ2pZ5rJGMZcGOvbuEq4WifZSWHoD0bSZS99FvCB6QHRcdXptONOuNP0KuuN+wYiZkV/MPJg6Ck77WPLvwIMAHzX4zyhUFlrAAAAAElFTkSuQmCC"
alt="LCEPL Logo"
/>
<a href="/">Dashboard</a>
<a href="/upload_excel">Upload Excel</a>
<a href="/generate_report_page">Print Report</a>
<a href="/filter_tasks">Filter Tasks</a>
class="logo"
/>
<h2>Print Report</h2>
<a href="/">Dashboard</a>
<a href="/upload_excel">Upload Excel</a>
<a href="/generate_report_page">Print Report</a>
<a href="/filter_tasks">Filter Tasks</a>
</div>
<div class="header">LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.</div>
<!-- Header -->
<div class="header">
LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.
</div>
<h1 class="report_title">Generate Task Report</h1>
<!-- Main -->
<div class="main">
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<script>
alert("{{ message }}");
</script>
{% endfor %}
{% endif %}
{% endwith %}
<div class="card">
<div class="title">Generate Task Report</div>
<form action="/report_excel" method="GET">
<form action="/report_excel" method="GET">
<!-- District -->
<div class="form-group">
<label for="district">District</label>
<select name="district" id="district" required>
<option value="" disabled selected>Select District</option>
{% for d in districts %}
<option value="{{ d }}">{{ d }}</option>
{% endfor %}
</select>
</div>
<!-- District -->
<label>District</label>
<select name="district" id="district" required>
<option value="">Select District</option>
{% for d in districts %}
<option value="{{ d }}">{{ d }}</option>
{% endfor %}
</select>
<!-- Block -->
<div class="form-group">
<label for="block">Block</label>
<select name="block" id="block" required>
<option value="" disabled selected>Select Block</option>
</select>
</div>
<!-- Block -->
<label>Block</label>
<select name="block" id="block" required>
<option value="">Select Block</option>
</select>
<!-- Main Task -->
<div class="form-group">
<label for="main_task">Main Task</label>
<select name="main_task" id="main_task" required>
<option value="" disabled selected>Select Main Task</option>
</select>
</div>
<!-- Task -->
<label>Main Task</label>
<select name="main_task" id="main_task" required>
<option value="">Select Main Task</option>
</select>
<button type="submit">Generate Report</button>
<button class="btn">Generate Report</button>
</form>
</form>
</div>
<!-- jQuery -->
</div>
<!-- JS -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- Select2 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>
<script>
$(document).ready(function () {
$('#district').select2({ width: '100%' });
$('#block').select2({ width: '100%' });
$('#main_task').select2({ width: '100%' });
$('#district, #block, #main_task').select2({ width: '100%' });
// District → Blocks
// District → Block
$('#district').on('change', function () {
const district = $(this).val();
$('#block').empty().append('<option value="">Select Block</option>');
@@ -198,43 +218,26 @@ $(document).ready(function () {
if (!district) return;
$.ajax({
url: '/get_blocks_by_district',
method: 'GET',
data: { district: district },
success: function (response) {
response.blocks.forEach(block => {
$('#block').append(`<option value="${block}">${block}</option>`);
$.get('/get_blocks_by_district', { district: district }, function (res) {
res.blocks.forEach(b => {
$('#block').append(`<option value="${b}">${b}</option>`);
});
}
});
});
// Block → Tasks
// Block → Task
$('#block').on('change', function () {
const block = $(this).val();
$('#main_task').empty().append('<option value="">Select Main Task</option>');
if (!block) return;
$.ajax({
url: '/get_tasks_by_block',
method: 'GET',
data: { block: block },
success: function (response) {
response.tasks.forEach(task => {
$('#main_task').append(`<option value="${task}">${task}</option>`);
$.get('/get_tasks_by_block', { block: block }, function (res) {
res.tasks.forEach(t => {
$('#main_task').append(`<option value="${t}">${t}</option>`);
});
}
});
});
});