All model filter are work and show bar chat and data table.

This commit is contained in:
2026-07-31 16:43:38 +05:30
parent 604e948986
commit 2d7d146ec3
3 changed files with 546 additions and 212 deletions

View File

@@ -57,54 +57,43 @@
<!-- Contractor -->
<div class="col-lg-4">
<label class="form-label fw-bold"> Subcontractor </label>
<select class="form-select" id="subcontractor">
<option value="">--- select contractor ---</option>
{% for s in subcontractors %}
<option value="{{s.id}}">
{{s.subcontractor_name}}
</option>
{% endfor %}
</select>
</div>
<!-- Category -->
<div class="col-lg-4">
<label class="form-label fw-bold">Category</label>
<select class="form-select" id="category">
<option value="">--- select category ---</option>
<option value="trench_excavation">Trench Excavation</option>
<option value="manhole_excavation">Manhole Excavation</option>
<option value="laying">Pipe Laying</option>
<option value="Manhole_Domestic_Chamber">Manhole Domestic Chamber</option>
<option value="Laying">Pipe Laying</option>
</select>
</div>
<!-- RA Bill -->
<div class="col-lg-4">
<label class="form-label fw-bold">
RA Bills
</label>
<select id="ra_bill"
class="form-select"
multiple>
</select>
<label class="form-label fw-bold"> RA Bills</label>
<select id="ra_bill" class="form-select" multiple></select>
</div>
</div>
<hr>
<!-- Search button -->
<button class="btn btn-primary" id="searchBtn">
<i class="bi bi-search"></i>Search
</button>
<!-- Reset button -->
<button class="btn btn-secondary" id="resetBtn">
<i class="bi bi-arrow-clockwise"></i>Reset
</button>
@@ -116,7 +105,7 @@
<div class="card-header">
<ul class="nav nav-pills">
<!--Bar Chart Tab -->
<li class="nav-item">
<button class="nav-link active"
data-bs-toggle="tab"
@@ -124,7 +113,8 @@
<i class="bi bi-bar-chart"></i> Bar Chart
</button>
</li>
<!-- Data Table Tab -->
<li class="nav-item">
<button class="nav-link"
data-bs-toggle="tab"
@@ -132,31 +122,23 @@
<i class="bi bi-table"></i> Data Table
</button>
</li>
</ul>
</div>
<div class="card-body">
<div class="tab-content">
<!-- BAR TAB -->
<div class="tab-pane fade show active" id="barTab">
<div style="height:600px">
<canvas id="barChart"></canvas>
</div>
</div>
<!-- TABLE TAB -->
<div class="tab-pane fade" id="tableTab">
<div class="table-responsive">
<table class="table table-bordered table-hover" id="resultTable">
<thead class="table-dark">
<tr>
<th>Sr No</th>
<th>Strata Type & Depth</th>
@@ -164,22 +146,16 @@
<th class="text-end">Sub Contractor Qty</th>
<th class="text-end">Difference</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
@@ -239,7 +215,6 @@
/* Search */
function loadDashboard() {
const subcontractor = document.getElementById("subcontractor").value;
const category = document.getElementById("category").value;
@@ -249,14 +224,36 @@
raBills = raBillChoice.getValue(true);
}
fetch(`/dashboard/api/trench-analysis?subcontractor=${subcontractor}&category=${category}&ra_bill=${raBills.join(",")}`)
let apiUrl = "";
switch (category) {
case "trench_excavation":
apiUrl = "/dashboard/api/tr-analysis";
break;
case "manhole_excavation":
apiUrl = "/dashboard/api/mh-analysis";
break;
case "Manhole_Domestic_Chamber":
apiUrl = "/dashboard/api/mdc-analysis";
break;
case "Laying":
apiUrl = "/dashboard/api/laying-analysis";
break;
default:
alert("Please select category");
return;
}
fetch(`${apiUrl}?subcontractor=${subcontractor}&category=${category}&ra_bill=${raBills.join(",")}`)
.then(response => response.json())
.then(data => {
console.log(data);
drawBar(data);
drawTable(data);
})
.catch(err => console.error(err));
@@ -301,7 +298,7 @@
plugins: {
title: {
display: true,
text: "Excavation Comparison"
text: data.title
},
legend: {
position: "bottom"
@@ -320,7 +317,7 @@
beginAtZero: true,
title: {
display: true,
text: "Excavation Qty (Cum)"
text: data.y_title
}
}
}
@@ -334,18 +331,17 @@
let html='';
for(let i=0;i<data.labels.length;i++){
const clientQty = Number(data.client_qty[i] || 0);
const subQty = Number(data.sub_qty[i] || 0);
const diff = clientQty - subQty;
html+=`
<tr>
<td class="text-center">${i + 1}</td>
<td>${data.labels[i]}</td>
<td class="text-end">${data.client_qty[i]}</td>
<td class="text-end">${data.sub_qty[i]}</td>
<td class="text-end fw-bold ${data.client_qty[i]- data.sub_qty[i] >= 0 ? 'text-success' : 'text-danger'}">
${data.client_qty[i]- data.sub_qty[i]}
</td>
<td class="text-end fw-bold ${diff >= 0 ? 'text-success' : 'text-danger'}">${diff.toFixed(2)}</td>
</tr>
`;