updated code
This commit is contained in:
Pooja Fulari
@@ -1,110 +1,376 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Activity Logs</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: "Segoe UI", Tahoma, sans-serif;
|
||||
background-color: #f8f9fa;
|
||||
margin: 20px;
|
||||
}
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.top-buttons {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
form {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
input, button {
|
||||
padding: 8px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
button {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
table {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
background: white;
|
||||
box-shadow: 0 0 8px rgba(0,0,0,0.1);
|
||||
}
|
||||
th, td {
|
||||
padding: 12px;
|
||||
border: 1px solid #ddd;
|
||||
text-align: center;
|
||||
}
|
||||
th {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
tr:nth-child(even) {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
</style>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>Activity Logs</title>
|
||||
|
||||
<style>
|
||||
*{
|
||||
margin:0;
|
||||
padding:0;
|
||||
box-sizing:border-box;
|
||||
font-family:'Segoe UI',sans-serif;
|
||||
}
|
||||
|
||||
body{
|
||||
background:#eef2f7;
|
||||
display:flex;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar{
|
||||
width:260px;
|
||||
height:100vh;
|
||||
position:fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
background:linear-gradient(180deg,#0f172a,#1e293b);
|
||||
padding:25px;
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
.sidebar h2{
|
||||
text-align:center;
|
||||
margin-bottom:30px;
|
||||
font-size:24px;
|
||||
}
|
||||
|
||||
.sidebar a{
|
||||
display:block;
|
||||
padding:14px 16px;
|
||||
margin:10px 0;
|
||||
border-radius:10px;
|
||||
text-decoration:none;
|
||||
color:#dbeafe;
|
||||
transition:.3s;
|
||||
}
|
||||
|
||||
.sidebar a:hover{
|
||||
background:#3b82f6;
|
||||
color:white;
|
||||
}
|
||||
|
||||
/* Main */
|
||||
.main{
|
||||
margin-left:260px;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.header{
|
||||
height:50px;
|
||||
background:#fff;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding-left:30px;
|
||||
font-size:18px;
|
||||
font-weight:600;
|
||||
box-shadow:0 2px 8px rgba(0,0,0,.08);
|
||||
color:#1e293b;
|
||||
}
|
||||
|
||||
/* Title */
|
||||
.page-title{
|
||||
text-align:center;
|
||||
margin:30px 0 20px;
|
||||
font-size:32px;
|
||||
color:#1e293b;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
/* Filter Card */
|
||||
.filter-box{
|
||||
width:95%;
|
||||
max-width:1200px;
|
||||
margin:auto;
|
||||
background:white;
|
||||
padding:25px;
|
||||
border-radius:16px;
|
||||
box-shadow:0 4px 12px rgba(0,0,0,.06);
|
||||
}
|
||||
|
||||
.filter-form{
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:15px;
|
||||
justify-content:center;
|
||||
align-items:end;
|
||||
}
|
||||
|
||||
.filter-group{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
min-width:220px;
|
||||
}
|
||||
|
||||
label{
|
||||
font-weight:600;
|
||||
margin-bottom:8px;
|
||||
color:#334155;
|
||||
}
|
||||
|
||||
input{
|
||||
padding:11px 14px;
|
||||
border:1px solid #cbd5e1;
|
||||
border-radius:8px;
|
||||
outline:none;
|
||||
}
|
||||
|
||||
input:focus{
|
||||
border-color:#3b82f6;
|
||||
}
|
||||
|
||||
.btn{
|
||||
border:none;
|
||||
padding:12px 20px;
|
||||
border-radius:8px;
|
||||
cursor:pointer;
|
||||
font-weight:600;
|
||||
transition:.3s;
|
||||
}
|
||||
|
||||
.btn-primary{
|
||||
background:#3b82f6;
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
.btn-primary:hover{
|
||||
background:#2563eb;
|
||||
}
|
||||
|
||||
.btn-secondary{
|
||||
background:#64748b;
|
||||
color:white;
|
||||
}
|
||||
|
||||
.btn-secondary:hover{
|
||||
background:#475569;
|
||||
}
|
||||
|
||||
/* Table Section */
|
||||
.table-box{
|
||||
width:95%;
|
||||
max-width:1400px;
|
||||
margin:30px auto;
|
||||
background:white;
|
||||
border-radius:16px;
|
||||
overflow:auto;
|
||||
box-shadow:0 4px 12px rgba(0,0,0,.06);
|
||||
max-height:57vh;
|
||||
}
|
||||
|
||||
table{
|
||||
width:100%;
|
||||
border-collapse:collapse;
|
||||
min-width:1000px;
|
||||
}
|
||||
|
||||
th{
|
||||
position:sticky;
|
||||
top:0;
|
||||
background:#3b82f6;
|
||||
color:white;
|
||||
padding:15px;
|
||||
font-size:15px;
|
||||
}
|
||||
|
||||
td{
|
||||
padding:14px;
|
||||
text-align:center;
|
||||
border-bottom:1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
tr:nth-child(even){
|
||||
background:#f8fafc;
|
||||
}
|
||||
|
||||
tr:hover{
|
||||
background:#eaf2ff;
|
||||
}
|
||||
|
||||
/* Back Button */
|
||||
.top-actions{
|
||||
width:95%;
|
||||
max-width:1200px;
|
||||
margin:auto;
|
||||
display:flex;
|
||||
justify-content:flex-end;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
|
||||
.back-btn{
|
||||
background:#10b981;
|
||||
color:white;
|
||||
padding:12px 18px;
|
||||
text-decoration:none;
|
||||
border-radius:8px;
|
||||
font-weight:600;
|
||||
}
|
||||
|
||||
.back-btn:hover{
|
||||
background:#059669;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media(max-width:900px){
|
||||
|
||||
.sidebar{
|
||||
width:75px;
|
||||
padding:15px 10px;
|
||||
}
|
||||
|
||||
.sidebar h2{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.sidebar a{
|
||||
font-size:12px;
|
||||
padding:10px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.main{
|
||||
margin-left:75px;
|
||||
}
|
||||
|
||||
.page-title{
|
||||
font-size:26px;
|
||||
}
|
||||
|
||||
.filter-form{
|
||||
flex-direction:column;
|
||||
align-items:stretch;
|
||||
}
|
||||
|
||||
.filter-group{
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
height: auto;
|
||||
margin-left: 80px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h2>Activity Logs</h2>
|
||||
|
||||
<div class="top-buttons">
|
||||
<a href="{{ url_for('main.dashboard') }}">
|
||||
<button type="button">⬅ Back to Dashboard</button>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<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"
|
||||
class="logo"
|
||||
/>
|
||||
|
||||
<form method="get" action="{{ url_for('main.activity_log') }}" class="filter-form">
|
||||
<label for="username">Username:</label>
|
||||
<input type="text" id="username" name="username" placeholder="Enter username" value="{{ username or '' }}">
|
||||
<center><h2>Activity Logs</h2></center>
|
||||
<a href="{{ url_for('main.dashboard') }}">Dashboard</a>
|
||||
<a href="{{ url_for('main.activity_log') }}">Activity Logs</a>
|
||||
|
||||
<label for="start_date">Start Date:</label>
|
||||
<input type="date" id="start_date" name="start_date" value="{{ start_date or '' }}">
|
||||
</div>
|
||||
|
||||
<label for="end_date">End Date:</label>
|
||||
<input type="date" id="end_date" name="end_date" value="{{ end_date or '' }}">
|
||||
|
||||
<button type="submit" class="btn btn-primary">Filter</button>
|
||||
</form>
|
||||
<div class="main">
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th>Timestamp</th>
|
||||
<th>User</th>
|
||||
<th>Action</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
{% for log in logs %}
|
||||
<tr>
|
||||
<td>{{ log.timestamp }}</td>
|
||||
<td>{{ log.user }}</td>
|
||||
<td>{{ log.action }}</td>
|
||||
<td>{{ log.details }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
{% if logs|length == 0 %}
|
||||
<tr>
|
||||
<td colspan="4">No logs found</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
</table>
|
||||
<div class="header">
|
||||
LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.
|
||||
</div>
|
||||
|
||||
<h1 class="page-title">Activity Logs</h1>
|
||||
|
||||
<div class="top-actions">
|
||||
<a href="{{ url_for('main.dashboard') }}" class="back-btn">
|
||||
⬅ Back to Dashboard
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Filters -->
|
||||
<div class="filter-box">
|
||||
<form method="get"
|
||||
action="{{ url_for('main.activity_log') }}"
|
||||
class="filter-form">
|
||||
|
||||
<div class="filter-group">
|
||||
<label>Username</label>
|
||||
<input type="text"
|
||||
name="username"
|
||||
placeholder="Enter username"
|
||||
value="{{ username or '' }}">
|
||||
</div>
|
||||
|
||||
<div class="filter-group">
|
||||
<label>Start Date</label>
|
||||
<input type="date"
|
||||
name="start_date"
|
||||
value="{{ start_date or '' }}">
|
||||
</div>
|
||||
|
||||
<div class="filter-group">
|
||||
<label>End Date</label>
|
||||
<input type="date"
|
||||
name="end_date"
|
||||
value="{{ end_date or '' }}">
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary" type="submit">
|
||||
Filter
|
||||
</button>
|
||||
|
||||
<button class="btn btn-secondary"
|
||||
type="button"
|
||||
onclick="resetFilter()">
|
||||
Reset
|
||||
</button>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Logs Table -->
|
||||
<div class="table-box">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Timestamp</th>
|
||||
<th>User</th>
|
||||
<th>Action</th>
|
||||
<th>Details</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{% for log in logs %}
|
||||
<tr>
|
||||
<td>{{ log.timestamp }}</td>
|
||||
<td>{{ log.user }}</td>
|
||||
<td>{{ log.action }}</td>
|
||||
<td>{{ log.details }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
|
||||
{% if logs|length == 0 %}
|
||||
<tr>
|
||||
<td colspan="4">
|
||||
No logs found
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function resetFilter(){
|
||||
window.location.href="{{ url_for('main.activity_log') }}";
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function resetFilter() {
|
||||
window.location.href = "{{ url_for('main.activity_log') }}";
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
@@ -1,474 +1,369 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Filtered Task Display</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: #f7f9fc;
|
||||
margin: 20px;
|
||||
position: relative;
|
||||
}
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Filtered Task Display</title>
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
form {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
gap: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
body {
|
||||
display: flex;
|
||||
background: #eef2f7;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
}
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
width: 260px;
|
||||
background: linear-gradient(180deg, #0f172a, #1e293b);
|
||||
color: white;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
select,
|
||||
button {
|
||||
padding: 5px 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.sidebar a {
|
||||
display: block;
|
||||
padding: 12px;
|
||||
margin: 8px 0;
|
||||
color: #cbd5e1;
|
||||
text-decoration: none;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
button[type="submit"] {
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.sidebar a:hover {
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
}
|
||||
|
||||
button[type="submit"]:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
margin: 20px auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.button-container1 {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
/* Main */
|
||||
.main {
|
||||
margin-left: 260px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.button-container1 button {
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* Header */
|
||||
.header {
|
||||
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-container1 button:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
/* Title */
|
||||
.report_title {
|
||||
text-align: center;
|
||||
margin: 20px 0;
|
||||
font-size: 26px;
|
||||
color: #1e293b;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 15px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
/* Filters */
|
||||
form {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 15px;
|
||||
flex-wrap: wrap;
|
||||
background: white;
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.edit-mode-button {
|
||||
padding: 8px 16px;
|
||||
font-size: 14px;
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
select {
|
||||
padding: 10px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #ccc;
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
.edit-mode-button:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
/* Buttons */
|
||||
.button-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
#selectedFilters {
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.edit-mode-button {
|
||||
padding: 10px 18px;
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: #333;
|
||||
}
|
||||
.edit-mode-button:hover {
|
||||
background: #2563eb;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 30px;
|
||||
margin-left: 275px;
|
||||
}
|
||||
/* Table */
|
||||
.table-container {
|
||||
margin: 20px;
|
||||
overflow: auto;
|
||||
max-height: 65vh;
|
||||
background: white;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
th:nth-child(1),
|
||||
td:nth-child(1) {
|
||||
width: 300px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.main-task-row {
|
||||
background-color: #d9eaf7;
|
||||
font-weight: bold;
|
||||
}
|
||||
th:not(:first-child),
|
||||
td:not(:first-child) {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.subtask-row {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
th, td {
|
||||
padding: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.edit-field {
|
||||
display: none;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
th {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.no-tasks-message {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
color: #666666;
|
||||
}
|
||||
tr:nth-child(even) {
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
select {
|
||||
min-width: 200px;
|
||||
}
|
||||
.main-task-row {
|
||||
background: #dbeafe;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Sidebar Styling */
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
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;
|
||||
}
|
||||
.edit-field {
|
||||
display: none;
|
||||
width: 100%;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
height: auto;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.readonly {
|
||||
background: #e5e7eb;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
margin: 0 auto 20px;
|
||||
}
|
||||
.sidebar h2 {
|
||||
color: white;
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
.sidebar a {
|
||||
display: block;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
padding: 10px 15px;
|
||||
margin: 10px 0;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar a:hover {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 100%;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 15px 0;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
h1.report_title {
|
||||
text-align: center;
|
||||
margin-top: 100px;
|
||||
color: #333;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
overflow-y: auto;
|
||||
}
|
||||
th {
|
||||
position: sticky; /* Ensures the header stays on top */
|
||||
top: 58px; /* Keeps the header fixed at the top */
|
||||
z-index: 1; /* Ensures it's above the content */
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<img
|
||||
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<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"
|
||||
class="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>
|
||||
</div>
|
||||
<h2>Filter Task</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>
|
||||
<h1 class="report_title">Filtered Tasks</h1>
|
||||
<div class="main">
|
||||
|
||||
<form method="GET" action="{{ url_for('main.filter_tasks') }}">
|
||||
<!-- District Dropdown -->
|
||||
<label for="district">District:</label>
|
||||
<select name="district" id="district" onchange="this.form.submit()">
|
||||
<option value="">-- Select District --</option>
|
||||
{% for d in districts %}
|
||||
<option value="{{ d }}" {% if d == selected_district %}selected{% endif %}>{{ d }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<div class="header">LAXMI CIVIL ENGINEERING SERVICES</div>
|
||||
<h1 class="report_title">Filtered Tasks</h1>
|
||||
|
||||
<!-- Block Dropdown -->
|
||||
<label for="block">Block:</label>
|
||||
<select name="block" id="block" onchange="this.form.submit()">
|
||||
<option value="">-- Select Block --</option>
|
||||
{% for b in blocks %}
|
||||
<option value="{{ b }}" {% if b == selected_block %}selected{% endif %}>{{ b }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<!-- Filters -->
|
||||
<form method="GET" action="{{ url_for('main.filter_tasks') }}">
|
||||
<select name="district" id="district" onchange="this.form.submit()">
|
||||
<option value="">District</option>
|
||||
{% for d in districts %}
|
||||
<option value="{{ d }}" {% if d == selected_district %}selected{% endif %}>{{ d }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
|
||||
<!-- Village Dropdown -->
|
||||
<label for="village">Village:</label>
|
||||
<select name="village" id="village" onchange="this.form.submit()">
|
||||
<option value="">-- Select Village --</option>
|
||||
{% for v in villages %}
|
||||
<option value="{{ v }}" {% if v == selected_village %}selected{% endif %}>{{ v }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</form>
|
||||
<select name="block" id="block" onchange="this.form.submit()">
|
||||
<option value="">Block</option>
|
||||
{% for b in blocks %}
|
||||
<option value="{{ b }}" {% if b == selected_block %}selected{% endif %}>{{ b }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
|
||||
<div id="selectedFilters">
|
||||
{% if selected_district or selected_block or selected_village %}
|
||||
<p>
|
||||
{% if selected_district %}<strong>District:</strong> {{ selected_district }}{% endif %}
|
||||
{% if selected_block %} <strong> | Block:</strong> {{ selected_block }}{% endif %}
|
||||
{% if selected_village %} <strong> | Village:</strong> {{ selected_village }}{% endif %}
|
||||
</p>
|
||||
{% else %}
|
||||
<p><strong>No filters applied. Showing all tasks.</strong></p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<select name="village" id="village" onchange="this.form.submit()">
|
||||
<option value="">Village</option>
|
||||
{% for v in villages %}
|
||||
<option value="{{ v }}" {% if v == selected_village %}selected{% endif %}>{{ v }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</form>
|
||||
|
||||
<div class="button-container1">
|
||||
<button onclick="window.location.href='/'">Home Page</button>
|
||||
</div>
|
||||
<!-- Buttons -->
|
||||
<div class="button-container">
|
||||
<button class="edit-mode-button" onclick="toggleEditMode()">Edit</button>
|
||||
<button class="edit-mode-button" id="cancelBtn" onclick="cancelEditMode()" style="display:none;">Cancel</button>
|
||||
<button class="edit-mode-button" onclick="submitChangedFields()">Save</button>
|
||||
<button class="edit-mode-button" onclick="downloadExcel()">Download</button>
|
||||
</div>
|
||||
|
||||
<div class="button-container">
|
||||
<button class="edit-mode-button" type="button" onclick="toggleEditMode()">Edit Tasks</button>
|
||||
<button class="edit-mode-button" type="button" id="cancelBtn" onclick="cancelEditMode()" style="display: none;">Cancel</button>
|
||||
<button class="edit-mode-button" type="button" onclick="submitChangedFields()">Submit Updates</button>
|
||||
<button class="edit-mode-button" type="button" onclick="downloadExcel()">Download Excel</button>
|
||||
</div>
|
||||
{% set readonly_fields = [
|
||||
"previous_billing_amount",
|
||||
"in_this_ra_billing_amount",
|
||||
"cumulative_billed_qty",
|
||||
"cumulative_billed_amount",
|
||||
"variation_qty",
|
||||
"variation_amount"
|
||||
] %}
|
||||
|
||||
{% if grouped_tasks %}
|
||||
<table class="table-container">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Task Name</th>
|
||||
<th>Unit</th>
|
||||
<th>Qty</th>
|
||||
<th>Rate</th>
|
||||
<th>BOQ Amt</th>
|
||||
<th>Prev Billed Qty</th>
|
||||
<th>Prev Bill Amt</th>
|
||||
<th>RA Bill Qty</th>
|
||||
<th>RA Bill Amt</th>
|
||||
<th>Cum Billed Qty</th>
|
||||
<th>Cum Billed Amt</th>
|
||||
<th>Var Qty</th>
|
||||
<th>Var Amt</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% set formula_fields = [
|
||||
"previous_billing_amount",
|
||||
"in_this_ra_billing_amount",
|
||||
"cumulative_billed_qty",
|
||||
"cumulative_billed_amount",
|
||||
"variation_qty",
|
||||
"variation_amount"
|
||||
] %}
|
||||
{% if grouped_tasks %}
|
||||
<div class="table-container">
|
||||
<table id="taskTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Task</th>
|
||||
<th>Unit</th>
|
||||
<th>Qty</th>
|
||||
<th>Rate</th>
|
||||
<th>BOQ</th>
|
||||
<th>Prev Qty</th>
|
||||
<th>Prev Amt</th>
|
||||
<th>RA Qty</th>
|
||||
<th>RA Amt</th>
|
||||
<th>Cum Qty</th>
|
||||
<th>Cum Amt</th>
|
||||
<th>Var Qty</th>
|
||||
<th>Var Amt</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
{% for group in grouped_tasks %}
|
||||
<!-- <tr class="main-task-row">
|
||||
<td colspan="1">{{ group.task_name }}</td>
|
||||
</tr> -->
|
||||
<!-- <tr class="main-task-row">
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
{{ '' if group[field] in [None, 0, "0"] else group[field] }}
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr> -->
|
||||
<tr class="main-task-row">
|
||||
<tbody>
|
||||
{% for group in grouped_tasks %}
|
||||
<tr class="main-task-row">
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">
|
||||
{{ group[field] if group[field] is not none else '' }}
|
||||
</span>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="edit-field"
|
||||
name="{{ field }}_main_{{ loop.index }}"
|
||||
value="{{ group[field] if group[field] is not none else '' }}"
|
||||
data-original-value="{{ group[field] if group[field] is not none else '' }}"
|
||||
<span class="static-text">
|
||||
{{ '' if group[field] is none or group[field] == '0' or group[field] == 0 else group[field] }}
|
||||
</span>
|
||||
<input
|
||||
class="edit-field {% if field in readonly_fields %}readonly{% endif %}"
|
||||
name="{{ field }}_{{ group.id }}"
|
||||
value="{{ group[field] or '' }}"
|
||||
data-original-value="{{ group[field] or '' }}"
|
||||
{% if field in readonly_fields %}readonly{% endif %}
|
||||
>
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% for sub in group.subtasks %}
|
||||
<tr class="subtask-row">
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">
|
||||
{{ sub[field] if sub[field] is not none else '' }}
|
||||
</span>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
class="edit-field"
|
||||
name="{{ field }}_{{ sub.id }}"
|
||||
value="{{ sub[field] if sub[field] is not none else '' }}"
|
||||
data-original-value="{{ sub[field] if sub[field] is not none else '' }}"
|
||||
{% if field in formula_fields %} readonly style="background:#f5f5f5;" {% endif %}
|
||||
>
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% for sub in group.subtasks %}
|
||||
<tr>
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">{{ sub[field] or '' }}</span>
|
||||
|
||||
<input
|
||||
class="edit-field {% if field in readonly_fields %}readonly{% endif %}"
|
||||
name="{{ field }}_{{ sub.id }}"
|
||||
value="{{ sub[field] or '' }}"
|
||||
data-original-value="{{ sub[field] or '' }}"
|
||||
{% if field in readonly_fields %}readonly{% endif %}
|
||||
>
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% else %}
|
||||
<p class="no-tasks-message">No tasks found for the selected filters.</p>
|
||||
{% endif %}
|
||||
</table>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- ✅ Scripts -->
|
||||
<script>
|
||||
// Toggle edit mode
|
||||
function toggleEditMode() {
|
||||
document.querySelectorAll('.static-text').forEach(span => span.style.display = 'none');
|
||||
document.querySelectorAll('.edit-field').forEach(input => input.style.display = 'inline-block');
|
||||
document.getElementById('cancelBtn').style.display = 'inline-block';
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
function toggleEditMode(){
|
||||
document.querySelectorAll('.static-text').forEach(e=>e.style.display='none');
|
||||
document.querySelectorAll('.edit-field').forEach(e=>e.style.display='block');
|
||||
document.getElementById('cancelBtn').style.display='inline-block';
|
||||
}
|
||||
|
||||
function cancelEditMode(){
|
||||
document.querySelectorAll('.edit-field').forEach(input=>{
|
||||
input.style.display='none';
|
||||
input.value = input.dataset.originalValue;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.static-text').forEach(e=>e.style.display='inline');
|
||||
document.getElementById('cancelBtn').style.display='none';
|
||||
}
|
||||
|
||||
function submitChangedFields(){
|
||||
const updates = {};
|
||||
|
||||
document.querySelectorAll('.edit-field').forEach(input=>{
|
||||
if(!input.readOnly && input.value !== input.dataset.originalValue){
|
||||
updates[input.name] = input.value;
|
||||
}
|
||||
});
|
||||
|
||||
// Cancel edit mode
|
||||
function cancelEditMode() {
|
||||
document.querySelectorAll('.edit-field').forEach(input => {
|
||||
input.style.display = 'none';
|
||||
input.value = input.dataset.originalValue;
|
||||
});
|
||||
document.querySelectorAll('.static-text').forEach(span => span.style.display = 'inline-block');
|
||||
document.getElementById('cancelBtn').style.display = 'none';
|
||||
}
|
||||
if(Object.keys(updates).length === 0){
|
||||
alert("No changes detected");
|
||||
return;
|
||||
}
|
||||
|
||||
// Submit changed fields only
|
||||
function submitChangedFields() {
|
||||
const updates = {};
|
||||
document.querySelectorAll('.edit-field').forEach(input => {
|
||||
const original = input.dataset.originalValue;
|
||||
const current = input.value;
|
||||
if (current !== original) {
|
||||
updates[input.name] = current;
|
||||
}
|
||||
});
|
||||
fetch('/update_tasks',{
|
||||
method:'POST',
|
||||
headers:{'Content-Type':'application/json'},
|
||||
body:JSON.stringify(updates)
|
||||
})
|
||||
.then(res=>res.json())
|
||||
.then(()=>{
|
||||
alert("Updated successfully");
|
||||
location.reload();
|
||||
});
|
||||
}
|
||||
|
||||
if (Object.keys(updates).length === 0) {
|
||||
alert('No changes detected.');
|
||||
return;
|
||||
}
|
||||
function downloadExcel(){
|
||||
const d=document.getElementById("district").value;
|
||||
const b=document.getElementById("block").value;
|
||||
const v=document.getElementById("village").value;
|
||||
|
||||
fetch('/update_tasks', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(updates)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
alert(data.message || 'Tasks updated successfully.');
|
||||
window.location.reload();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error updating tasks:', error);
|
||||
alert('Failed to update tasks.');
|
||||
});
|
||||
}
|
||||
window.location=`/download_filtered_tasks?district=${d}&block=${b}&village=${v}`;
|
||||
}
|
||||
|
||||
// ✅ Filtering dependent dropdowns
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const districtDropdown = document.getElementById("district");
|
||||
const blockDropdown = document.getElementById("block");
|
||||
const villageDropdown = document.getElementById("village");
|
||||
</script>
|
||||
|
||||
districtDropdown.addEventListener("change", function () {
|
||||
let district = this.value;
|
||||
blockDropdown.innerHTML = '<option value="">Select Block</option>';
|
||||
villageDropdown.innerHTML = '<option value="">Select Village</option>';
|
||||
|
||||
if (district) {
|
||||
fetch(`/get_blocks?district=${district}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
data.forEach(block => {
|
||||
let option = document.createElement("option");
|
||||
option.value = block;
|
||||
option.textContent = block;
|
||||
blockDropdown.appendChild(option);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
blockDropdown.addEventListener("change", function () {
|
||||
let block = this.value;
|
||||
villageDropdown.innerHTML = '<option value="">Select Village</option>';
|
||||
|
||||
if (block) {
|
||||
fetch(`/get_villages?block=${block}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
data.forEach(village => {
|
||||
let option = document.createElement("option");
|
||||
option.value = village;
|
||||
option.textContent = village;
|
||||
villageDropdown.appendChild(option);
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function downloadExcel() {
|
||||
const district = document.getElementById("district").value;
|
||||
const block = document.getElementById("block").value;
|
||||
const village = document.getElementById("village").value;
|
||||
|
||||
let url = `/download_filtered_tasks?district=${district}&block=${block}&village=${village}`;
|
||||
window.location.href = url;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -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>`);
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@@ -1,366 +1,322 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>Tasks</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f8f9fa;
|
||||
color: #333;
|
||||
}
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Tasks</title>
|
||||
|
||||
h1, h2 {
|
||||
text-align: center;
|
||||
color: #007bff;
|
||||
}
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
|
||||
table {
|
||||
width: 90%;
|
||||
margin: 10px auto;
|
||||
border-collapse: collapse;
|
||||
background-color: #fff;
|
||||
font-size: 0.85em;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
margin-left: 285px;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 8px 10px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.main-task-row {
|
||||
background-color: #e3f2fd;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.subtask-row td {
|
||||
background-color: #fefefe;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.button-container a,
|
||||
.button-container button {
|
||||
padding: 10px 20px;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
background-color: #007bff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button-container a {
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.top-buttons {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.top-buttons button {
|
||||
padding: 8px;
|
||||
font-size: 12px;
|
||||
background-color: #28a745;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.top-buttons button:hover {
|
||||
background-color: #218838;
|
||||
}
|
||||
|
||||
.static-text {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.edit-field {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#searchBox {
|
||||
width: 300px;
|
||||
padding: 8px;
|
||||
margin: 0 auto 10px;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#taskTableWrapper {
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
margin: 15px auto;
|
||||
border: 4px solid #f3f3f3;
|
||||
border-top: 4px solid #007bff;
|
||||
border-radius: 50%;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
animation: spin 0.8s linear infinite;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* Sidebar Styling */
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
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;
|
||||
}
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
height: auto;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.sidebar a {
|
||||
display: block;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
padding: 10px 15px;
|
||||
margin: 10px 0;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar a:hover {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
.header {
|
||||
width: 100%;
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 15px 0;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Inter', sans-serif;
|
||||
background: #f1f5f9;
|
||||
}
|
||||
|
||||
</style>
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
width: 240px;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
background: linear-gradient(180deg, #0f172a, #1e293b);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
display: block;
|
||||
margin: 0 auto 20px;
|
||||
}
|
||||
|
||||
.sidebar a {
|
||||
display: block;
|
||||
color: #cbd5f5;
|
||||
text-decoration: none;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.sidebar a:hover {
|
||||
background: rgba(59,130,246,0.2);
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* 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);
|
||||
}
|
||||
|
||||
/* Main */
|
||||
.main {
|
||||
margin-left: 280px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/* Card */
|
||||
.card {
|
||||
background: white;
|
||||
padding: 0px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.05);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.card-item{
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.05);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
/* Buttons */
|
||||
.btn {
|
||||
padding: 10px 16px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-weight: 500;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
background: #22c55e;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: #ef4444;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
.search-box {
|
||||
width: 300px;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #ddd;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* Table */
|
||||
.table-wrapper {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
th {
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.main-task-row {
|
||||
background: #e0f2fe;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.subtask-row {
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
/* Editable */
|
||||
.static-text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.edit-field {
|
||||
display: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Loader */
|
||||
.spinner {
|
||||
border: 4px solid #eee;
|
||||
border-top: 4px solid #3b82f6;
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
animation: spin 0.8s linear infinite;
|
||||
margin: auto;
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
margin: 0 auto 20px;
|
||||
}
|
||||
|
||||
.table-wrapper {
|
||||
max-height: 670px; /* scroll area height */
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
thead th {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background: #3b82f6;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<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"
|
||||
class="logo"
|
||||
/>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<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"
|
||||
class="logo"
|
||||
/>
|
||||
<a href="/">Dashboard</a>
|
||||
<a href="/upload_excel">Upload Excel</a>
|
||||
<a href="/generate_report_page">Print Report</a>
|
||||
<!--<a href="/tasks">Show Tasks</a>-->
|
||||
<a href="/filter_tasks">Filter Tasks</a>
|
||||
</div>
|
||||
<div class="header">LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.</div>
|
||||
<h1>Uploaded Tasks</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-buttons">
|
||||
<button onclick="window.location.href='/'">Home Page</button>
|
||||
</div>
|
||||
<!-- Header -->
|
||||
<div class="header">
|
||||
LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.
|
||||
</div>
|
||||
|
||||
<div class="button-container">
|
||||
<a href="/generate_report_page">Print Task Wise Report</a>
|
||||
<button onclick="toggleEditMode()">Edit Tasks</button>
|
||||
<button onclick="cancelEditMode()" id="cancelBtn" style="display: none; background-color: #dc3545;">Cancel Edit</button>
|
||||
<button onclick="submitChangedFields()">Submit Updates</button>
|
||||
</div>
|
||||
<div class="main">
|
||||
|
||||
<div>
|
||||
<input type="text" id="searchBox" placeholder="Search tasks..." />
|
||||
</div>
|
||||
<!-- Buttons -->
|
||||
<div class="card-item">
|
||||
<button class="btn btn-success" onclick="window.location.href='/generate_report_page'">
|
||||
Print Report
|
||||
</button>
|
||||
<button class="btn btn-primary" onclick="toggleEditMode()">Edit</button>
|
||||
<button class="btn btn-danger" onclick="cancelEditMode()" id="cancelBtn" style="display:none;">Cancel</button>
|
||||
<button class="btn btn-primary" onclick="submitChangedFields()">Save</button>
|
||||
</div>
|
||||
|
||||
{% if work_details %}
|
||||
<h2>Work Details</h2>
|
||||
<table class="work-details">
|
||||
<tr><th>Name of Work</th><td>{{ work_details.name_of_work }}</td></tr>
|
||||
<tr><th>Cover Agreement No</th><td>{{ work_details.cover_agreement_no }}</td></tr>
|
||||
<tr><th>Name of Contractor</th><td>{{ work_details.name_of_contractor }}</td></tr>
|
||||
<tr><th>Name of TPI Agency</th><td>{{ work_details.name_of_tpi_agency }}</td></tr>
|
||||
<tr><th>Name of Division</th><td>{{ work_details.name_of_division }}</td></tr>
|
||||
<tr><th>Name of District</th><td>{{ work_details.district }}</td></tr>
|
||||
<tr><th>Village</th><td>{{ work_details.name_of_village }}</td></tr>
|
||||
<tr><th>Block</th><td>{{ work_details.block }}</td></tr>
|
||||
<tr><th>Scheme ID</th><td>{{ work_details.scheme_id }}</td></tr>
|
||||
<tr><th>Measurement Book</th><td>{{ work_details.measurement_book }}</td></tr>
|
||||
<tr><th>Date of Billing</th><td>{{ work_details.date_of_billing }}</td></tr>
|
||||
</table>
|
||||
{% endif %}
|
||||
<!-- Search -->
|
||||
<input type="text" id="searchBox" class="search-box" placeholder="Search tasks...">
|
||||
|
||||
<h2>Task Details</h2>
|
||||
<div class="spinner" id="loader"></div>
|
||||
<!-- Table -->
|
||||
<div class="card table-wrapper">
|
||||
<div class="spinner" id="loader"></div>
|
||||
|
||||
<div id="taskTableWrapper" style="opacity: 1;">
|
||||
<form id="task-form">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Main Task</th>
|
||||
<th>Unit</th>
|
||||
<th>Qty</th>
|
||||
<th>Rate</th>
|
||||
<th>BOQ Amt</th>
|
||||
<th>Prev Billed Qty</th>
|
||||
<th>Prev Bill Amt</th>
|
||||
<th>RA Bill Qty</th>
|
||||
<th>RA Bill Amt</th>
|
||||
<th>Cum Billed Qty</th>
|
||||
<th>Cum Billed Amt</th>
|
||||
<th>Var Qty</th>
|
||||
<th>Var Amt</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for group in grouped_tasks %}
|
||||
<tr class="main-task-row">
|
||||
{% for field in ["task_name", "unit", "qty", "rate", "boq_amount", "previous_billed_qty", "previous_billing_amount", "in_this_ra_bill_qty", "in_this_ra_billing_amount", "cumulative_billed_qty", "cumulative_billed_amount", "variation_qty", "variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">{{ group[field] }}</span>
|
||||
<input type="text" class="edit-field" name="{{ field }}_{{ group.id }}" value="{{ group[field] }}" data-original-value="{{ group[field] | trim }}" style="display: none;" />
|
||||
</td>
|
||||
<form id="task-form">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Task</th>
|
||||
<th>Unit</th>
|
||||
<th>Qty</th>
|
||||
<th>Rate</th>
|
||||
<th>BOQ</th>
|
||||
<th>Prev Qty</th>
|
||||
<th>Prev Amt</th>
|
||||
<th>RA Qty</th>
|
||||
<th>RA Amt</th>
|
||||
<th>Cum Qty</th>
|
||||
<th>Cum Amt</th>
|
||||
<th>Var Qty</th>
|
||||
<th>Var Amt</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{% for group in grouped_tasks %}
|
||||
<tr class="main-task-row">
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">{{ group[field] }}</span>
|
||||
<input type="text" class="edit-field" name="{{ field }}_{{ group.id }}" value="{{ group[field] }}" data-original-value="{{ group[field] }}">
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
|
||||
{% for sub in group.subtasks %}
|
||||
<tr class="subtask-row">
|
||||
{% for field in ["task_name","unit","qty","rate","boq_amount","previous_billed_qty","previous_billing_amount","in_this_ra_bill_qty","in_this_ra_billing_amount","cumulative_billed_qty","cumulative_billed_amount","variation_qty","variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">{{ sub[field] }}</span>
|
||||
<input type="text" class="edit-field" name="{{ field }}_{{ sub.id }}" value="{{ sub[field] }}" data-original-value="{{ sub[field] }}">
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% for sub in group.subtasks %}
|
||||
<tr class="subtask-row">
|
||||
{% for field in ["task_name", "unit", "qty", "rate", "boq_amount", "previous_billed_qty", "previous_billing_amount", "in_this_ra_bill_qty", "in_this_ra_billing_amount", "cumulative_billed_qty", "cumulative_billed_amount", "variation_qty", "variation_amount"] %}
|
||||
<td>
|
||||
<span class="static-text">{{ sub[field] }}</span>
|
||||
<input type="text" class="edit-field" name="{{ field }}_{{ sub.id }}" value="{{ sub[field] }}" data-original-value="{{ sub[field] | trim }}" style="display: none;" />
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
function toggleEditMode() {
|
||||
document.querySelectorAll('.static-text').forEach(span => span.style.display = 'none');
|
||||
document.querySelectorAll('.edit-field').forEach(input => input.style.display = 'inline-block');
|
||||
document.getElementById('cancelBtn').style.display = 'inline-block';
|
||||
}
|
||||
</div>
|
||||
|
||||
function cancelEditMode() {
|
||||
document.querySelectorAll('.static-text').forEach(span => span.style.display = 'inline-block');
|
||||
document.querySelectorAll('.edit-field').forEach(input => {
|
||||
input.style.display = 'none';
|
||||
input.value = input.getAttribute('data-original-value');
|
||||
});
|
||||
document.getElementById('cancelBtn').style.display = 'none';
|
||||
}
|
||||
<script>
|
||||
function toggleEditMode() {
|
||||
document.querySelectorAll('.static-text').forEach(e => e.style.display = 'none');
|
||||
document.querySelectorAll('.edit-field').forEach(e => e.style.display = 'block');
|
||||
document.getElementById('cancelBtn').style.display = 'inline-block';
|
||||
}
|
||||
|
||||
function submitChangedFields() {
|
||||
const updates = {};
|
||||
document.querySelectorAll('.edit-field').forEach(input => {
|
||||
const original = input.getAttribute('data-original-value') || '';
|
||||
const current = input.value.trim();
|
||||
if (current !== original.trim()) {
|
||||
updates[input.name] = current;
|
||||
}
|
||||
});
|
||||
|
||||
if (Object.keys(updates).length === 0) {
|
||||
alert("No changes made.");
|
||||
return;
|
||||
}
|
||||
|
||||
fetch('/update_tasks', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(updates)
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
alert(data.message || 'Update complete!');
|
||||
window.location.reload();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Update error:', error);
|
||||
alert('Error updating tasks');
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const searchBox = document.getElementById("searchBox");
|
||||
const tableWrapper = document.getElementById("taskTableWrapper");
|
||||
const loader = document.getElementById("loader");
|
||||
|
||||
document.querySelectorAll("tbody tr").forEach(row => {
|
||||
const text = Array.from(row.querySelectorAll("td")).map(cell => {
|
||||
const span = cell.querySelector(".static-text")?.innerText || '';
|
||||
const input = cell.querySelector(".edit-field")?.value || '';
|
||||
return (span + " " + input).toLowerCase();
|
||||
}).join(" ");
|
||||
row.setAttribute("data-search-text", text);
|
||||
});
|
||||
|
||||
let timeout;
|
||||
searchBox.addEventListener("input", function () {
|
||||
clearTimeout(timeout);
|
||||
loader.style.display = "block";
|
||||
tableWrapper.style.opacity = "0.3";
|
||||
|
||||
const term = this.value.toLowerCase();
|
||||
|
||||
timeout = setTimeout(() => {
|
||||
document.querySelectorAll("tbody tr").forEach(row => {
|
||||
const searchable = row.getAttribute("data-search-text");
|
||||
row.style.display = searchable.includes(term) ? "" : "none";
|
||||
});
|
||||
loader.style.display = "none";
|
||||
tableWrapper.style.opacity = "1";
|
||||
}, 150);
|
||||
});
|
||||
function cancelEditMode() {
|
||||
document.querySelectorAll('.static-text').forEach(e => e.style.display = 'inline');
|
||||
document.querySelectorAll('.edit-field').forEach(e => {
|
||||
e.style.display = 'none';
|
||||
e.value = e.dataset.originalValue;
|
||||
});
|
||||
</script>
|
||||
document.getElementById('cancelBtn').style.display = 'none';
|
||||
}
|
||||
|
||||
function submitChangedFields() {
|
||||
const updates = {};
|
||||
document.querySelectorAll('.edit-field').forEach(input => {
|
||||
if (input.value !== input.dataset.originalValue) {
|
||||
updates[input.name] = input.value;
|
||||
}
|
||||
});
|
||||
|
||||
if (!Object.keys(updates).length) return alert("No changes");
|
||||
|
||||
fetch('/update_tasks', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type':'application/json'},
|
||||
body: JSON.stringify(updates)
|
||||
}).then(res => res.json())
|
||||
.then(() => location.reload());
|
||||
}
|
||||
|
||||
/* Search */
|
||||
document.getElementById("searchBox").addEventListener("input", function () {
|
||||
const term = this.value.toLowerCase();
|
||||
document.querySelectorAll("tbody tr").forEach(row => {
|
||||
row.style.display = row.innerText.toLowerCase().includes(term) ? "" : "none";
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
@@ -1,166 +1,184 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Upload Excel</title>
|
||||
<style>
|
||||
/* General Styling */
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
body {
|
||||
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 50vh;
|
||||
background-color: #f4f7f9;
|
||||
margin-top: 0px;
|
||||
}
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
/* Sidebar Styling */
|
||||
.sidebar {
|
||||
width: 250px;
|
||||
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;
|
||||
}
|
||||
<title>Upload Excel</title>
|
||||
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
height: auto;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.sidebar a {
|
||||
display: block;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
padding: 10px 15px;
|
||||
margin: 10px 0;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
|
||||
.sidebar a:hover {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
}
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Inter', sans-serif;
|
||||
background: #f1f5f9;
|
||||
}
|
||||
|
||||
/* Main Container Styling */
|
||||
.main-content {
|
||||
margin: 400px auto;
|
||||
/* margin-left: 270px; */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: calc(100% - 270px);
|
||||
}
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
width: 240px;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
background: linear-gradient(180deg, #0f172a, #1e293b);
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
form {
|
||||
background-color: #ffffff;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
width: 90%;
|
||||
max-width: 400px;
|
||||
}
|
||||
.sidebar .logo {
|
||||
width: 60px;
|
||||
margin: 0 auto 20px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 2rem;
|
||||
color: #007bff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
input[type="file"] {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
font-size: 1rem;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
transition: border-color 0.3s ease;
|
||||
}
|
||||
|
||||
input[type="file"]:focus {
|
||||
border-color: #007bff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.upload {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background-color: #007bff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
|
||||
button:active {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
.header {
|
||||
width: 100%;
|
||||
background-color: #007bff;
|
||||
.sidebar h2 {
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 15px 0;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
|
||||
.sidebar a {
|
||||
color: #cbd5f5;
|
||||
text-decoration: none;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.sidebar a:hover {
|
||||
background: rgba(59,130,246,0.2);
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.header {
|
||||
margin-left: 270px;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 20px;
|
||||
background: white;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 2px 6px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
/* Main Content */
|
||||
.main-content {
|
||||
margin-left: 270px;
|
||||
height: calc(100vh - 60px);
|
||||
}
|
||||
|
||||
/* Upload Card */
|
||||
.upload-card {
|
||||
background: white;
|
||||
padding: 30px;
|
||||
margin: 150px auto;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.08);
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.upload-card h1 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
/* File Input */
|
||||
.file-input {
|
||||
border: 2px dashed #cbd5f5;
|
||||
padding: 25px;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 20px;
|
||||
transition: 0.3s;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.file-input:hover {
|
||||
border-color: #3b82f6;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.file-input input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Button */
|
||||
.upload-btn {
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
background: linear-gradient(135deg, #3b82f6, #2563eb);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
font-size: 15px;
|
||||
cursor: pointer;
|
||||
margin-top: 40px;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.upload-btn:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar">
|
||||
<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"
|
||||
class="logo"
|
||||
/>
|
||||
<a href="/">Dashboard</a>
|
||||
<a href="/upload_excel">Upload Excel</a>
|
||||
<a href="/generate_report_page">Print Report</a>
|
||||
<!--<a href="/tasks">Show Tasks</a>-->
|
||||
<a href="/filter_tasks">Filter Tasks</a>
|
||||
<h2>Upload Excel</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>
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header">
|
||||
LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="main-content">
|
||||
|
||||
<div class="upload-card">
|
||||
<h1>Upload Excel File</h1>
|
||||
|
||||
<form action="/upload" method="post" enctype="multipart/form-data">
|
||||
|
||||
<!-- FILE INPUT -->
|
||||
<label class="file-input">
|
||||
<span id="fileText">📁 Click to choose Excel file</span>
|
||||
<input type="file" name="file" id="fileInput" required>
|
||||
</label>
|
||||
|
||||
<!-- BUTTON -->
|
||||
<button type="submit" class="upload-btn">
|
||||
Upload File
|
||||
</button>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="main-content">
|
||||
<form action="/upload" method="post" enctype="multipart/form-data">
|
||||
<div class="header">LAXMI CIVIL ENGINEERING SERVICES PVT. LTD.</div>
|
||||
<h1>Upload Excel File</h1>
|
||||
<input type="file" name="file" required />
|
||||
<button class="upload" type="submit">Upload</button>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</div>
|
||||
|
||||
<!-- JS -->
|
||||
<script>
|
||||
document.getElementById("fileInput").addEventListener("change", function() {
|
||||
const fileName = this.files.length > 0 ? this.files[0].name : "Click to choose Excel file";
|
||||
document.getElementById("fileText").innerText = "📄 " + fileName;
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user