| Line 4... |
Line 4... |
| 4 |
text-align: center;
|
4 |
text-align: center;
|
| 5 |
padding: 0.4rem;
|
5 |
padding: 0.4rem;
|
| 6 |
vertical-align: middle;
|
6 |
vertical-align: middle;
|
| 7 |
}
|
7 |
}
|
| 8 |
|
8 |
|
| - |
|
9 |
.badge {
|
| - |
|
10 |
display: inline-block;
|
| - |
|
11 |
padding: 4px 8px;
|
| - |
|
12 |
font-size: 12px;
|
| - |
|
13 |
font-weight: 600;
|
| - |
|
14 |
border-radius: 4px;
|
| - |
|
15 |
}
|
| - |
|
16 |
|
| - |
|
17 |
.agent-status-cell, .time-in-status-cell {
|
| - |
|
18 |
min-width: 80px;
|
| - |
|
19 |
}
|
| - |
|
20 |
|
| 9 |
#rbm-call-target-table thead th {
|
21 |
#rbm-call-target-table thead th {
|
| 10 |
background-color: #343a40;
|
22 |
background-color: #343a40;
|
| 11 |
color: white;
|
23 |
color: white;
|
| 12 |
font-weight: 600;
|
24 |
font-weight: 600;
|
| 13 |
}
|
25 |
}
|
| Line 78... |
Line 90... |
| 78 |
}
|
90 |
}
|
| 79 |
</style>
|
91 |
</style>
|
| 80 |
|
92 |
|
| 81 |
<div class="container-fluid">
|
93 |
<div class="container-fluid">
|
| 82 |
<h3>RBM Call Target Summary</h3>
|
94 |
<h3>RBM Call Target Summary</h3>
|
| 83 |
|
- |
|
| - |
|
95 |
<div class="row">
|
| - |
|
96 |
<div class="col-md-7">
|
| 84 |
<!-- Date-wise Called Partner Filter -->
|
97 |
<!-- Date-wise Called Partner Filter -->
|
| 85 |
<div class="card mb-3" style="max-width: 500px;">
|
98 |
<div class="card mb-3" style="max-width: 500px;">
|
| 86 |
<div class="card-body py-2">
|
99 |
<div class="card-body py-2">
|
| 87 |
<div class="d-flex align-items-center">
|
100 |
<div class="d-flex align-items-center">
|
| - |
|
101 |
<label for="historyDate" class="mb-0 mr-2"
|
| 88 |
<label for="historyDate" class="mb-0 mr-2" style="font-size: 14px; white-space: nowrap;">Date:</label>
|
102 |
style="font-size: 14px; white-space: nowrap;">Date:</label>
|
| 89 |
<input type="date" id="historyDate" class="form-control form-control-sm mr-2" style="width: 140px;">
|
103 |
<input type="date" id="historyDate" class="form-control form-control-sm mr-2"
|
| - |
|
104 |
style="width: 140px;">
|
| - |
|
105 |
<label for="historyRbm" class="mb-0 mr-2"
|
| 90 |
<label for="historyRbm" class="mb-0 mr-2" style="font-size: 14px; white-space: nowrap;">RBM:</label>
|
106 |
style="font-size: 14px; white-space: nowrap;">RBM:</label>
|
| 91 |
<select id="historyRbm" class="form-control form-control-sm mr-2" style="width: 150px;">
|
107 |
<select id="historyRbm" class="form-control form-control-sm mr-2" style="width: 150px;">
|
| 92 |
<option value="">Select RBM</option>
|
108 |
<option value="">Select RBM</option>
|
| 93 |
#foreach($model in $rbmCallTargetModels)
|
109 |
#foreach($model in $rbmCallTargetModels)
|
| 94 |
<option value="$model.getAuthId()">$model.getRbmName()</option>
|
110 |
<option value="$model.getAuthId()">$model.getRbmName()</option>
|
| 95 |
#end
|
111 |
#end
|
| 96 |
</select>
|
112 |
</select>
|
| 97 |
<button type="button" class="btn btn-primary btn-sm" onclick="showHistoryCalledPartners()">View</button>
|
113 |
<button type="button" class="btn btn-primary btn-sm" onclick="showHistoryCalledPartners()">
|
| - |
|
114 |
View
|
| - |
|
115 |
</button>
|
| - |
|
116 |
</div>
|
| - |
|
117 |
</div>
|
| 98 |
</div>
|
118 |
</div>
|
| 99 |
</div>
|
119 |
</div>
|
| - |
|
120 |
<div class="col-md-5">
|
| - |
|
121 |
<!-- Download All Call Data by Date -->
|
| - |
|
122 |
<div class="card mb-3" style="max-width: 450px;">
|
| - |
|
123 |
<div class="card-body py-2">
|
| - |
|
124 |
<div class="d-flex align-items-center">
|
| - |
|
125 |
<label for="downloadDate" class="mb-0 mr-2" style="font-size: 14px; white-space: nowrap;">Download
|
| - |
|
126 |
Call Data:</label>
|
| - |
|
127 |
<input type="date" id="downloadDate" class="form-control form-control-sm mr-2"
|
| - |
|
128 |
style="width: 140px;">
|
| - |
|
129 |
<button type="button" class="btn btn-success btn-sm" onclick="downloadCallData()">Download CSV
|
| - |
|
130 |
</button>
|
| - |
|
131 |
</div>
|
| - |
|
132 |
</div>
|
| - |
|
133 |
</div>
|
| - |
|
134 |
|
| - |
|
135 |
</div>
|
| 100 |
</div>
|
136 |
</div>
|
| 101 |
|
137 |
|
| - |
|
138 |
|
| 102 |
<table id="rbm-call-target-table" class="table table-bordered table-striped">
|
139 |
<table id="rbm-call-target-table" class="table table-bordered table-striped">
|
| 103 |
<thead>
|
140 |
<thead>
|
| 104 |
<tr>
|
141 |
<tr>
|
| 105 |
<th>RBM Name</th>
|
142 |
<th>RBM Name</th>
|
| - |
|
143 |
#*<th style="background-color: #17a2b8; color: white;">Agent Status</th>
|
| - |
|
144 |
<th style="background-color: #17a2b8; color: white;">Time in Status</th>*#
|
| 106 |
<th>Partner Count</th>
|
145 |
<th>Partner Count</th>
|
| 107 |
<th>(Ach/Tgt)</th>
|
146 |
<th>(Ach/Tgt)</th>
|
| 108 |
<th>Calling Target</th>
|
147 |
<th>Calling Target</th>
|
| 109 |
<th>Called</th>
|
148 |
<th>Called</th>
|
| 110 |
<th class="highlight-plan-today">Plan Today</th>
|
149 |
<th class="highlight-plan-today">Plan Today</th>
|
| Line 160... |
Line 199... |
| 160 |
#set($adjustedTotalTarget = $totalTodayTarget + $totalMovedToFuture)
|
199 |
#set($adjustedTotalTarget = $totalTodayTarget + $totalMovedToFuture)
|
| 161 |
#set($adjustedTotalAchieved = $totalValueAchieved + $totalMovedToFuture)
|
200 |
#set($adjustedTotalAchieved = $totalValueAchieved + $totalMovedToFuture)
|
| 162 |
|
201 |
|
| 163 |
<tr>
|
202 |
<tr>
|
| 164 |
<td><strong>TOTAL</strong></td>
|
203 |
<td><strong>TOTAL</strong></td>
|
| - |
|
204 |
#*<td>-</td>
|
| - |
|
205 |
<td>-</td>*#
|
| 165 |
<td><strong>$totalPartnerCount</strong></td>
|
206 |
<td><strong>$totalPartnerCount</strong></td>
|
| 166 |
<td><strong><span class="lakh">$totalArrAchieved</span> / <span class="lakh">$totalArrTarget</span></strong>
|
207 |
<td><strong><span class="lakh">$totalArrAchieved</span> / <span class="lakh">$totalArrTarget</span></strong>
|
| 167 |
</td>
|
208 |
</td>
|
| 168 |
<td class="highlight-target"><strong>$adjustedTotalTarget</strong></td>
|
209 |
<td class="highlight-target"><strong>$adjustedTotalTarget</strong></td>
|
| 169 |
<td class="highlight-achieved currency"><strong>$adjustedTotalAchieved</strong></td>
|
210 |
<td class="highlight-achieved currency"><strong>$adjustedTotalAchieved</strong></td>
|
| Line 178... |
Line 219... |
| 178 |
</tr>
|
219 |
</tr>
|
| 179 |
|
220 |
|
| 180 |
#foreach($model in $rbmCallTargetModels)
|
221 |
#foreach($model in $rbmCallTargetModels)
|
| 181 |
#set($rowTarget = $model.getTodayTargetOfCall() + $model.getMovedToFuture())
|
222 |
#set($rowTarget = $model.getTodayTargetOfCall() + $model.getMovedToFuture())
|
| 182 |
#set($rowAchieved = $model.getValueTargetAchieved() + $model.getMovedToFuture())
|
223 |
#set($rowAchieved = $model.getValueTargetAchieved() + $model.getMovedToFuture())
|
| - |
|
224 |
#set($agentStatus = $agentStatusByAuthId.get($model.getAuthId()))
|
| 183 |
<tr>
|
225 |
<tr>
|
| 184 |
<td>$model.getRbmName()</td>
|
226 |
<td>$model.getRbmName()</td>
|
| - |
|
227 |
#*<td class="agent-status-cell" data-authid="$model.getAuthId()">
|
| - |
|
228 |
#if($agentStatus && $agentStatus.getAgentStatus())
|
| - |
|
229 |
#if($agentStatus.getAgentStatus() == "On Call")
|
| - |
|
230 |
<span class="badge" style="background-color: #28a745; color: white;">$agentStatus.getAgentStatus()</span>
|
| - |
|
231 |
#elseif($agentStatus.getAgentStatus() == "Available")
|
| - |
|
232 |
<span class="badge" style="background-color: #17a2b8; color: white;">$agentStatus.getAgentStatus()</span>
|
| - |
|
233 |
#elseif($agentStatus.getAgentStatus() == "On Break")
|
| - |
|
234 |
<span class="badge" style="background-color: #ffc107; color: black;">$agentStatus.getAgentStatus()</span>
|
| - |
|
235 |
#elseif($agentStatus.getAgentStatus() == "Logged Out")
|
| - |
|
236 |
<span class="badge" style="background-color: #dc3545; color: white;">$agentStatus.getAgentStatus()</span>
|
| - |
|
237 |
#elseif($agentStatus.getAgentStatus() == "Trying")
|
| - |
|
238 |
<span class="badge" style="background-color: #fd7e14; color: white;">$agentStatus.getAgentStatus()</span>
|
| - |
|
239 |
#else
|
| - |
|
240 |
<span class="badge" style="background-color: #6c757d; color: white;">$agentStatus.getAgentStatus()</span>
|
| - |
|
241 |
#end
|
| - |
|
242 |
#else
|
| - |
|
243 |
<span class="badge" style="background-color: #6c757d; color: white;">-</span>
|
| - |
|
244 |
#end
|
| - |
|
245 |
</td>
|
| - |
|
246 |
<td class="time-in-status-cell" data-authid="$model.getAuthId()">
|
| - |
|
247 |
#if($agentStatus && $agentStatus.getTimeInStatus())
|
| - |
|
248 |
$agentStatus.getTimeInStatus()
|
| - |
|
249 |
#else
|
| - |
|
250 |
-
|
| - |
|
251 |
#end
|
| - |
|
252 |
</td>*#
|
| 185 |
<td>$model.getPartnerCount()</td>
|
253 |
<td>$model.getPartnerCount()</td>
|
| 186 |
<td>
|
254 |
<td>
|
| 187 |
#if($arrAchievedByAuthId && $arrAchievedByAuthId.get($model.getAuthId()))
|
255 |
#if($arrAchievedByAuthId && $arrAchievedByAuthId.get($model.getAuthId()))
|
| 188 |
<span class="lakh">$arrAchievedByAuthId.get($model.getAuthId())</span>
|
256 |
<span class="lakh">$arrAchievedByAuthId.get($model.getAuthId())</span>
|
| 189 |
#else
|
257 |
#else
|
| Line 338... |
Line 406... |
| 338 |
})
|
406 |
})
|
| 339 |
.catch(function () {
|
407 |
.catch(function () {
|
| 340 |
document.getElementById('calledDetailsContent').innerHTML = '<p>Error loading details. Please try again.</p>';
|
408 |
document.getElementById('calledDetailsContent').innerHTML = '<p>Error loading details. Please try again.</p>';
|
| 341 |
});
|
409 |
});
|
| 342 |
}
|
410 |
}
|
| - |
|
411 |
|
| - |
|
412 |
/* Agent Status columns commented out - uncomment when needed
|
| - |
|
413 |
// Auto-refresh agent status every 30 seconds
|
| - |
|
414 |
function refreshAgentStatus() {
|
| - |
|
415 |
fetch('/indent/rbm_call_target/get_agent_statuses')
|
| - |
|
416 |
.then(function (response) {
|
| - |
|
417 |
return response.json();
|
| - |
|
418 |
})
|
| - |
|
419 |
.then(function (data) {
|
| - |
|
420 |
if (data && data.length > 0) {
|
| - |
|
421 |
for (var i = 0; i < data.length; i++) {
|
| - |
|
422 |
var agent = data[i];
|
| - |
|
423 |
var statusCell = document.querySelector('.agent-status-cell[data-authid="' + agent.authId + '"]');
|
| - |
|
424 |
var timeCell = document.querySelector('.time-in-status-cell[data-authid="' + agent.authId + '"]');
|
| - |
|
425 |
|
| - |
|
426 |
if (statusCell) {
|
| - |
|
427 |
var statusHtml = getStatusBadge(agent.agentStatus);
|
| - |
|
428 |
statusCell.innerHTML = statusHtml;
|
| - |
|
429 |
}
|
| - |
|
430 |
if (timeCell) {
|
| - |
|
431 |
timeCell.textContent = agent.timeInStatus || '-';
|
| - |
|
432 |
}
|
| - |
|
433 |
}
|
| - |
|
434 |
}
|
| - |
|
435 |
})
|
| - |
|
436 |
.catch(function (err) {
|
| - |
|
437 |
console.error('Error refreshing agent status:', err);
|
| - |
|
438 |
});
|
| - |
|
439 |
}
|
| - |
|
440 |
|
| - |
|
441 |
function getStatusBadge(status) {
|
| - |
|
442 |
if (!status) return '<span class="badge" style="background-color: #6c757d; color: white;">-</span>';
|
| - |
|
443 |
|
| - |
|
444 |
var bgColor = '#6c757d';
|
| - |
|
445 |
var textColor = 'white';
|
| - |
|
446 |
|
| - |
|
447 |
if (status === 'On Call') {
|
| - |
|
448 |
bgColor = '#28a745';
|
| - |
|
449 |
} else if (status === 'Available') {
|
| - |
|
450 |
bgColor = '#17a2b8';
|
| - |
|
451 |
} else if (status === 'On Break') {
|
| - |
|
452 |
bgColor = '#ffc107';
|
| - |
|
453 |
textColor = 'black';
|
| - |
|
454 |
} else if (status === 'Logged Out') {
|
| - |
|
455 |
bgColor = '#dc3545';
|
| - |
|
456 |
} else if (status === 'Trying') {
|
| - |
|
457 |
bgColor = '#fd7e14';
|
| - |
|
458 |
}
|
| - |
|
459 |
|
| - |
|
460 |
return '<span class="badge" style="background-color: ' + bgColor + '; color: ' + textColor + ';">' + status + '</span>';
|
| - |
|
461 |
}
|
| - |
|
462 |
|
| - |
|
463 |
// Refresh every 20 seconds
|
| - |
|
464 |
setInterval(refreshAgentStatus, 20000);
|
| - |
|
465 |
|
| - |
|
466 |
// Initial refresh after page load
|
| - |
|
467 |
setTimeout(refreshAgentStatus, 2000);
|
| - |
|
468 |
*/
|
| - |
|
469 |
|
| - |
|
470 |
// Download All Call Data by Date
|
| - |
|
471 |
function downloadCallData() {
|
| - |
|
472 |
var selectedDate = document.getElementById('downloadDate').value;
|
| - |
|
473 |
if (!selectedDate) {
|
| - |
|
474 |
alert('Please select a date');
|
| - |
|
475 |
return;
|
| - |
|
476 |
}
|
| - |
|
477 |
window.location.href = '/indent/rbm_call_target/download_call_data?date=' + selectedDate;
|
| - |
|
478 |
}
|
| 343 |
</script>
|
479 |
</script>
|
| 344 |
|
480 |
|