599 lines
22 KiB
Plaintext
599 lines
22 KiB
Plaintext
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Daily Progress Report</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family: Arial, sans-serif;
|
|
background: #f5f5f5;
|
|
color: #333;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1100px;
|
|
margin: 20px auto;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.header {
|
|
background: #b10000;
|
|
color: #fff;
|
|
padding: 20px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.header h1 {
|
|
font-size: 22px;
|
|
margin: 0;
|
|
}
|
|
|
|
.header .project-info {
|
|
font-size: 14px;
|
|
text-align: right;
|
|
}
|
|
|
|
.status-note {
|
|
font-size: 12px;
|
|
color: #555;
|
|
padding: 15px 20px 0 20px;
|
|
}
|
|
|
|
.status-cards {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 15px;
|
|
padding: 20px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.card {
|
|
flex: 1;
|
|
min-width: 200px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 8px;
|
|
padding: 15px;
|
|
text-align: center;
|
|
background: #fff;
|
|
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
|
|
/* <-- added shadow */
|
|
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
|
border-top: 1px solid #e63946;
|
|
|
|
}
|
|
|
|
.card:hover {
|
|
transform: translateY(-3px);
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.card h3 {
|
|
font-size: 14px;
|
|
margin: 0 0 10px 0;
|
|
}
|
|
|
|
.card p {
|
|
margin: 5px 0;
|
|
}
|
|
|
|
.card .value {
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.card-title {
|
|
font-size: 0.9rem;
|
|
text-transform: uppercase;
|
|
font-weight: 600;
|
|
color: #6c757d;
|
|
}
|
|
|
|
.attendance {
|
|
color: #b10000;
|
|
}
|
|
|
|
.tasks {
|
|
color: #007bff;
|
|
}
|
|
|
|
.completion {
|
|
color: #28a745;
|
|
}
|
|
|
|
.activities {
|
|
padding: 20px;
|
|
}
|
|
|
|
.activities h2 {
|
|
font-size: 18px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.table th,
|
|
.table td {
|
|
border: 1px solid #ddd;
|
|
padding: 8px;
|
|
text-align: center;
|
|
}
|
|
|
|
.table th {
|
|
background: #f0f0f0;
|
|
}
|
|
|
|
.footer {
|
|
background: #b10000;
|
|
color: #fff;
|
|
text-align: center;
|
|
padding: 15px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.footer a {
|
|
color: #fff;
|
|
margin: 0 8px;
|
|
text-decoration: none;
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 600px) {
|
|
.header {
|
|
flex-direction: column;
|
|
text-align: center;
|
|
}
|
|
|
|
.header .project-info {
|
|
text-align: center;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.status-cards {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
|
|
.legend {
|
|
margin-top: 10px;
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
font-size: 12px;
|
|
color: #555;
|
|
}
|
|
|
|
.legend-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.legend-color {
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 2px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.legend-red {
|
|
background: #b10000;
|
|
}
|
|
|
|
.legend-blue {
|
|
background: #007bff;
|
|
}
|
|
|
|
.legend-green {
|
|
background: #28a745;
|
|
}
|
|
|
|
.legend-gray {
|
|
background: #ccc;
|
|
}
|
|
|
|
|
|
|
|
.donut {
|
|
--percentage: 65;
|
|
/* Change this per chart */
|
|
--danger: #e63946;
|
|
--primary: #007bff;
|
|
--warning: #ffc107;
|
|
--success: #198754;
|
|
/* Fill color */
|
|
--track: #e9ecef;
|
|
/* Background track */
|
|
--size: 120px;
|
|
/* Default size */
|
|
--thickness: 20px;
|
|
/* Default thickness */
|
|
|
|
width: var(--size);
|
|
height: var(--size);
|
|
border-radius: 50%;
|
|
background: conic-gradient(var(--danger) calc(var(--percentage) * 1%),
|
|
var(--track) 0);
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: Arial, sans-serif;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
.donut::before {
|
|
content: "";
|
|
position: absolute;
|
|
width: calc(var(--size) - var(--thickness));
|
|
height: calc(var(--size) - var(--thickness));
|
|
border-radius: 50%;
|
|
background: #fff;
|
|
/* Inner cut-out */
|
|
}
|
|
|
|
.donut span {
|
|
position: absolute;
|
|
font-size: calc(var(--size) / 6);
|
|
}
|
|
|
|
/* Variants */
|
|
.donut.thin {
|
|
--size: 80px;
|
|
--thickness: 12px;
|
|
}
|
|
|
|
.donut.medium {
|
|
--size: 120px;
|
|
--thickness: 25px;
|
|
}
|
|
|
|
.donut.large {
|
|
--size: 180px;
|
|
--thickness: 35px;
|
|
}
|
|
|
|
/* Color variants */
|
|
.donut-success {
|
|
background: conic-gradient(var(--success) calc(var(--percentage) * 1%),
|
|
var(--track) 0);
|
|
color: var(--success)
|
|
}
|
|
|
|
.donut-warning {
|
|
background: conic-gradient(var(--warning) calc(var(--percentage) * 1%),
|
|
var(--track) 0);
|
|
color: var(--warning)
|
|
}
|
|
|
|
.donut-danger {
|
|
background: conic-gradient(var(--danger) calc(var(--percentage) * 1%),
|
|
var(--track) 0);
|
|
color: var(--danger)
|
|
}
|
|
|
|
.donut-primary {
|
|
background: conic-gradient(var(--primary) calc(var(--percentage) * 1%),
|
|
var(--track) 0);
|
|
color: var(--primary)
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<!-- Header -->
|
|
<div class="header">
|
|
<h1>Daily Progress Report</h1>
|
|
<div class="project-info">
|
|
<strong>Project:</strong> ANP ultimas wakad<br>
|
|
<strong>Date:</strong> 17 September 2025
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status Note -->
|
|
<div class="status-note">
|
|
* Project Status Reported - Generated at 18-Sep-2025 03:30:03 UTC
|
|
</div>
|
|
|
|
<!-- Status Cards -->
|
|
<div class="status-cards">
|
|
<div class="card">
|
|
<h4 class="card-title">TODAY'S ATTENDANCE</h4>
|
|
<div style="display:flex; flex-wrap:wrap;">
|
|
|
|
<!-- Left Column -->
|
|
<div style="width:50%; box-sizing:border-box;display:flex; justify-content:center; align-items:center;">
|
|
<!-- Medium -->
|
|
<div class="donut thin" style="--percentage: 66;">
|
|
<span>20 / 30</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Right Column -->
|
|
<div class="legend" style="width:50%; padding:15px; box-sizing:border-box;">
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;">
|
|
<span class="legend-color legend-green"></span> Completed
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;; ">
|
|
<span class="legend-color legend-blue"></span> In Progress
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px; text-align: left; display:left; justify-content:left; align-items:left!important;;">
|
|
<span class="legend-color legend-gray"></span> Pending
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div>
|
|
<div style="padding:10px; text-align:center;">
|
|
<p class="text-muted">Team members present on the site</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h4 class="card-title">DAILY TASKS COMPLETED</h4>
|
|
<div style="display:flex; flex-wrap:wrap;">
|
|
|
|
<!-- Left Column -->
|
|
<div style="width:50%; box-sizing:border-box;display:flex; justify-content:center; align-items:center;">
|
|
<!-- Medium -->
|
|
<div class="donut thin donut-primary" style="--percentage: 66;">
|
|
<span>20 / 30</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Right Column -->
|
|
<div class="legend" style="width:50%; padding:15px; box-sizing:border-box;">
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;">
|
|
<span class="legend-color legend-green"></span> Completed
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;; ">
|
|
<span class="legend-color legend-blue"></span> In Progress
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px; text-align: left; display:left; justify-content:left; align-items:left!important;;">
|
|
<span class="legend-color legend-gray"></span> Pending
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div>
|
|
<div style="padding:10px; text-align:center;">
|
|
<p class="text-muted">Team members present on the site</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<h4 class="card-title">DAILY TASKS COMPLETED</h4>
|
|
<p class="value tasks">20 / 30</p>
|
|
<p>Team member present</p>
|
|
<img src="data:image/png;base64,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" />
|
|
<div class="legend">
|
|
<div class="legend-item"><span class="legend-color legend-blue"></span> Completed</div>
|
|
<div class="legend-item"><span class="legend-color legend-green"></span> In Progress</div>
|
|
<div class="legend-item"><span class="legend-color legend-gray"></span> Pending</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h4 class="card-title">PROJECT COMPLETION STATUS</h4>
|
|
<p class=" value completion">20 / 30</p>
|
|
<p>Team member present</p>
|
|
<div class="legend">
|
|
<div class="legend-item"><span class="legend-color legend-green"></span> Completed</div>
|
|
<div class="legend-item"><span class="legend-color legend-blue"></span> In Progress</div>
|
|
<div class="legend-item"><span class="legend-color legend-gray"></span> Pending</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h4 class="card-title">Regularization Pending</h4>
|
|
<p class="value tasks">28/32</p>
|
|
<p class="text-muted">Regularization Pending</p>
|
|
<div class="legend">
|
|
<div class="legend-item"><span class="legend-color legend-green"></span> Completed</div>
|
|
<div class="legend-item"><span class="legend-color legend-blue"></span> In Progress</div>
|
|
<div class="legend-item"><span class="legend-color legend-gray"></span> Pending</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<!-- Row 1: Header -->
|
|
<div>
|
|
<h4 class="card-title">Checkout Pending</h4>
|
|
</div>
|
|
|
|
<!-- Row 2: Two Columns -->
|
|
<div style="display:flex; flex-wrap:wrap;">
|
|
|
|
<!-- Left Column -->
|
|
<div style="width:50%; box-sizing:border-box;display:flex; justify-content:center; align-items:center;">
|
|
<!-- Medium -->
|
|
<div class="donut thin donut-success" style="--percentage: 73;">
|
|
<span>73%</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Right Column -->
|
|
<div class="legend" style="width:50%; padding:15px; box-sizing:border-box;">
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;">
|
|
<span class="legend-color legend-green"></span> Completed
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;; ">
|
|
<span class="legend-color legend-blue"></span> In Progress
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px; text-align: left; display:left; justify-content:left; align-items:left!important;;">
|
|
<span class="legend-color legend-gray"></span> Pending
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Row 3: Full Width -->
|
|
<div>
|
|
<div style="padding:10px; text-align:center;">
|
|
<p class="text-muted">Team members present on the site</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<div>
|
|
<h4 class="card-title">Activity Report Pending</h4>
|
|
</div>
|
|
<div style="display:flex; flex-wrap:wrap;">
|
|
|
|
<!-- Left Column -->
|
|
<div style="width:50%; box-sizing:border-box;display:flex; justify-content:center; align-items:center;">
|
|
<!-- Medium -->
|
|
<div class="donut thin donut-warning" style="--percentage: 73;">
|
|
<span>73%</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Right Column -->
|
|
<div class="legend" style="width:50%; padding:15px; box-sizing:border-box;">
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;">
|
|
<span class="legend-color legend-green"></span> Completed
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px;text-align: left; display:left; justify-content:left; align-items:left!important;; ">
|
|
<span class="legend-color legend-blue"></span> In Progress
|
|
</div>
|
|
<div class="legend-item"
|
|
style="margin-bottom:10px; text-align: left; display:left; justify-content:left; align-items:left!important;;">
|
|
<span class="legend-color legend-gray"></span> Pending
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div>
|
|
<div style="padding:10px; text-align:center;">
|
|
<p class="text-muted">Team members present on the site</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<!-- Row 1: Header -->
|
|
<div>
|
|
<h4 class="card-title">Team Strength on Site</h4>
|
|
</div>
|
|
<table style="width: 100%;">
|
|
<tr>
|
|
<td style="text-align: left;">Site Engineer</td>
|
|
<td style="text-align: right;">1</td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left;">Weilder</td>
|
|
<td style="text-align: right;">15</td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left;">Helper</td>
|
|
<td style="text-align: right;">2</td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: left;">Painter</td>
|
|
<td style="text-align: right;">1</td>
|
|
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Activities -->
|
|
<div class="activities">
|
|
<h2>Activities (Tasks) Performed 17-Sep-2025</h2>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>NAME</th>
|
|
<th>JOB ROLE</th>
|
|
<th>CHECK IN</th>
|
|
<th>CHECK OUT</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Siddharth Barde</td>
|
|
<td>Site Engineer</td>
|
|
<td>17-Sep-2025 11:47 AM</td>
|
|
<td>-</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Siddharth Barde</td>
|
|
<td>Site Engineer</td>
|
|
<td>17-Sep-2025 11:47 AM</td>
|
|
<td>-</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Siddharth Barde</td>
|
|
<td>Site Engineer</td>
|
|
<td>17-Sep-2025 11:47 AM</td>
|
|
<td>-</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<div class="footer" style="display:flex; flex-wrap:wrap;">
|
|
<div style="width: 50%;text-align: left;">
|
|
Contact Us: contact[at]marcoaiot.com<br>
|
|
Marco AIoT technologies Pvt. Ltd. ©2025 All Rights Reserved
|
|
</div>
|
|
|
|
<div style="width: 50%; text-align: right;">
|
|
<!-- <a href="#">Instagram</a> | -->
|
|
<a href="#"><img src="https://cdn.marcoaiot.com/icons/brands/google.png" style="height: 15px;" /></a> |
|
|
|
|
<a href="#"><img src="https://cdn.marcoaiot.com/icons/brands/twitter.png" style="height: 15px;" /></a> |
|
|
|
|
<a href="#"><img src="https://cdn.marcoaiot.com/icons/brands/facebook.png" style="height: 15px;" /></a> |
|
|
<a href="#"><img src="https://cdn.marcoaiot.com/icons/brands/instagram.png" style="height: 15px;" /></a>
|
|
<!-- <a href="#"><img src="https://cdn.marcoaiot.com/icons/brands/youtube.png" style="height: 15px;" /></a> | <a
|
|
href="#">LinkedIn</a> |
|
|
<a href="#">YouTube</a> -->
|
|
</div>
|
|
|
|
</div>
|
|
<div style="text-align: center;width: 100%;background-color: #fff;margin:10px;font-size: small;color: #6c757d ;">
|
|
You have received this email because it contains important information about your Marco PMS Account account.
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |