Subversion Repositories SmartDukaan

Rev

Rev 36313 | Rev 36334 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
29966 amit.gupta 1 
<html lang="en">
2 
<head>
29983 amit.gupta 3 
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
29988 amit.gupta 4 
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
5 
          integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
29966 amit.gupta 6 
    <style>
7 
        html, body {
29983 amit.gupta 8 
            margin-top: 10px;
29966 amit.gupta 9 
            padding: 0;
10 
        }
11 
 
12 
 
13 
        td, th {
29981 amit.gupta 14 
            font-size: 20px;
29966 amit.gupta 15 
        }
16 
 
29988 amit.gupta 17 
 
18 
        .table td, .table th {
19 
            padding: 0.25rem;
20 
        }
21 
 
30786 amit.gupta 22 
        tr:first-child.green td {
29981 amit.gupta 23 
            font-weight: bold;
29982 amit.gupta 24 
            background-color: #00d6b2;
29981 amit.gupta 25 
        }
29982 amit.gupta 26 
 
27 
        td {
29983 amit.gupta 28 
            font-size: 24px;
29982 amit.gupta 29 
        }
29966 amit.gupta 30 
    </style>
31 
    <link href="../resources/css/brand-logo.css" rel="stylesheet"/>
32 
</head>
33 
<body>
33991 ranu 34 
 
35 
    #if($isGtEqL2)
34055 ranu 36 
 
37 
        #parse("rbm-today-arr.vm")
35201 ranu 38 
    <br>
35147 ranu 39 
    <div class="container-fluid mb-3">
35202 ranu 40 
        <select id="categoryDropdown" class="form-control mb-3"
41 
                style="width:200px; display:inline-block;margin-right: 10px;">
35201 ranu 42 
            <option value="RBM">All RBMs</option>
43 
            <option value="BM">All BMs</option>
44 
            <option value="ASM">All ASMs</option>
35147 ranu 45 
        </select>
35174 ranu 46 
        <button class="partnerwise-billed-po btn btn-info btn-sm">Today PO and Billed (Partner
35172 ranu 47 
            wise)
48 
        </button>
35147 ranu 49 
 
35201 ranu 50 
        <div class="purchaseMilestoneContainer">
51 
            <!-- Initial table load -->
52 
            #parse("today_po_table_fragment.vm")
53 
        </div>
29966 amit.gupta 54 
 
35201 ranu 55 
    </div>
35199 ranu 56 
    <div class="container-fluid ">
33700 amit.gupta 57 
    <h3>Total Collection(Overall Collection/Limit Utilization))</h3>
29994 amit.gupta 58 
    <div class="row">
59 
        #foreach($warehouseEntry in $warehouseMap.entrySet())
31345 amit.gupta 60 
            <div class="col-lg-2" style="font-size: 20px">
29994 amit.gupta 61 
                $warehouseEntry.getValue() -
62 
                #if($warehouseCollectionMap.get($warehouseEntry.getKey()))
31250 amit.gupta 63 
                    <span class="currency">$warehouseCollectionMap.get($warehouseEntry.getKey())</span>
29994 amit.gupta 64 
                #else
65 
 
66 
                #end
31242 amit.gupta 67 
                /
31250 amit.gupta 68 
                #if($warehousePgCollectionMap.get($warehouseEntry.getKey()))
31251 amit.gupta 69 
                    <span class="currency">$warehousePgCollectionMap.get($warehouseEntry.getKey())</span>
31242 amit.gupta 70 
                #else
71 
 
72 
                #end
73 
 
29994 amit.gupta 74 
            </div>
75 
        #end
76 
    </div>
30784 amit.gupta 77 
</div>
35631 ranu 78 
        ##    #parse("today_target.vm")
36307 ranu 79 
 
36315 ranu 80 
        ## ============ RBM Performance Dashboard ============
81 
        #if($performanceDashboard && !$performanceDashboard.isEmpty())
36307 ranu 82 
        <style>
83 
            #performance-dashboard-table th {
84 
                font-size: 13px;
85 
                text-align: center;
86 
                padding: 0.4rem;
87 
                vertical-align: middle;
88 
            }
89 
 
90 
            #performance-dashboard-table td {
91 
                font-size: 13px;
92 
                text-align: center;
93 
                padding: 0.2rem;
94 
                vertical-align: middle;
95 
            }
96 
        </style>
97 
        <div class="container-fluid mb-3">
98 
            <h3 class="mb-2">RBM Performance Dashboard (MTD)</h3>
99 
            <div class="table-responsive">
100 
                <table class="table table-bordered table-striped" id="performance-dashboard-table"
101 
                       style="font-size: 13px;">
102 
                    <thead>
103 
                    <tr style="background-color: rgb(52,58,64); color: white; text-align: center;">
104 
                        <th style="width: 40px;">Rank</th>
105 
                        <th>RBM Name</th>
106 
                        <th style="width: 80px;">Partners</th>
107 
                        <th style="background-color: rgb(0,123,255); color: white;">Login Hours<br><small>(15%)</small>
108 
                        </th>
109 
                        <th style="background-color: rgb(40,167,69); color: white;">Talk Time<br><small>(15%)</small>
110 
                        </th>
111 
                        <th style="background-color: rgb(23,162,184); color: white;">DRR Achv<br><small>(20%)</small>
112 
                        </th>
113 
                        <th style="background-color: rgb(253,126,20); color: white;">15 Days
114 
                            Ageing<br><small>(15%)</small></th>
115 
                        <th style="background-color: rgb(111,66,193); color: white;">&gt;1L
116 
                            Partners<br><small>(15%)</small></th>
117 
                        <th style="background-color: rgb(255,193,7); color: black;">Partner
118 
                            Rating<br><small>(20%)</small></th>
119 
                        <th style="background-color: rgb(220,53,69); color: white; width: 80px;">Score</th>
120 
                    </tr>
121 
                    </thead>
122 
                    <tbody>
123 
                        #foreach($dm in $performanceDashboard)
124 
                            #if($dm.getRank() == 1)
125 
                                #set($rowStyle = "text-align:center; background-color: rgb(255,248,225);")
126 
                                #set($scoreColor = "color: rgb(40,167,69);")
127 
                            #elseif($dm.getRank() == 2)
128 
                                #set($rowStyle = "text-align:center; background-color: rgb(245,245,245);")
129 
                                #set($scoreColor = "color: rgb(23,162,184);")
130 
                            #elseif($dm.getRank() == 3)
131 
                                #set($rowStyle = "text-align:center; background-color: rgb(255,243,224);")
132 
                                #set($scoreColor = "color: rgb(23,162,184);")
133 
                            #else
134 
                                #set($rowStyle = "text-align:center;")
135 
                                #set($scoreColor = "color: rgb(51,51,51);")
136 
                            #end
137 
                        <tr style="$rowStyle">
138 
                            <td>
139 
                                #if($dm.getRank() == 1)
140 
                                    <img src="../../../resources/images/king.png" style="width: 28px;" title="Rank 1">
141 
                                #elseif($dm.getRank() == 2)
142 
                                    <img src="../../../resources/images/trophy-cup.png" style="width: 24px;"
143 
                                         title="Rank 2">
144 
                                #elseif($dm.getRank() == 3)
145 
                                    <img src="../../../resources/images/bronze-medal.png" style="width: 24px;"
146 
                                         title="Rank 3">
147 
                                #else
148 
                                    $dm.getRank()
149 
                                #end
150 
                            </td>
151 
                            <td style="text-align: left;">$dm.getRbmName()</td>
152 
                            <td>$dm.getPartnerCount()</td>
153 
                            <td>$dm.getLoginHoursDisplay()</td>
154 
                            <td>$dm.getTalkTimeDisplay()</td>
155 
                            <td>$dm.getDrrAchvDisplay()</td>
156 
                            <td><span class="lakh">$dm.getAgingUnitsSold()</span></td>
157 
                            <td>$dm.getAbove1LPartnerCount()</td>
158 
                            <td>
159 
                                #if($dm.getPartnerRating() > 4)
160 
                                    <span style="color: rgb(40,167,69);">$dm.getRatingDisplay() &#9733;</span>
161 
                                #elseif($dm.getPartnerRating() > 3)
162 
                                    <span style="color: rgb(255,193,7);">$dm.getRatingDisplay() &#9733;</span>
163 
                                #elseif($dm.getPartnerRating() > 2)
164 
                                    <span style="color: rgb(253,126,20);">$dm.getRatingDisplay() &#9733;</span>
165 
                                #elseif($dm.getPartnerRating() > 0)
166 
                                    <span style="color: rgb(220,53,69);">$dm.getRatingDisplay() &#9733;</span>
167 
                                #else
168 
                                    -
169 
                                #end
170 
                            </td>
171 
                            <td style="font-size: 14px; $scoreColor">
172 
                                $dm.getScoreDisplay()
173 
                            </td>
174 
                        </tr>
175 
                        #end
176 
                    </tbody>
177 
                </table>
178 
            </div>
179 
        </div>
180 
        #end
181 
        ## ============ End RBM Performance Dashboard ============
182 
 
36234 ranu 183 
    <div id="rbm-call-target-container">
35631 ranu 184 
        #parse("rbm_call_target.vm")
36234 ranu 185 
    </div>
32938 amit.gupta 186 
#end
35631 ranu 187 
 
188 
<!-- Modal for Out of Sequence Details -->
189 
<div class="modal fade" id="oosModal" tabindex="-1" role="dialog" aria-labelledby="oosModalLabel" aria-hidden="true">
190 
    <div class="modal-dialog modal-lg" role="document">
191 
        <div class="modal-content">
192 
            <div class="modal-header">
193 
                <h5 class="modal-title" id="oosModalLabel">Out of Sequence Calls</h5>
194 
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
195 
                    <span aria-hidden="true">&times;</span>
196 
                </button>
197 
            </div>
198 
            <div class="modal-body">
199 
                <div id="oosDetailsContent">
200 
                    <p>Loading...</p>
201 
                </div>
202 
            </div>
203 
            <div class="modal-footer">
204 
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
205 
            </div>
206 
        </div>
207 
    </div>
208 
</div>
35670 ranu 209 
 
210 
<!-- Modal for Called Partner Details -->
211 
<div class="modal fade" id="calledModal" tabindex="-1" role="dialog" aria-labelledby="calledModalLabel"
212 
     aria-hidden="true">
35709 ranu 213 
    <div class="modal-dialog modal-lg" role="document" style="max-width:max-content;">
214 
        <div class="modal-content">
35670 ranu 215 
            <div class="modal-header">
216 
                <h5 class="modal-title" id="calledModalLabel">Called Partners</h5>
217 
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
218 
                    <span aria-hidden="true">&times;</span>
219 
                </button>
220 
            </div>
221 
            <div class="modal-body">
222 
                <div id="calledDetailsContent">
223 
                    <p>Loading...</p>
224 
                </div>
225 
            </div>
226 
            <div class="modal-footer">
227 
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
228 
            </div>
229 
        </div>
230 
    </div>
231 
</div>
35631 ranu 232 
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
29983 amit.gupta 233 
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
234 
        integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
235 
        crossorigin="anonymous"></script>
236 
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
237 
        integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
238 
        crossorigin="anonymous"></script>
30036 amit.gupta 239 
<script type="text/javascript">
240 
    function numberToComma(x) {
29966 amit.gupta 241 
 
30036 amit.gupta 242 
        x = x.toString();
243 
        x = x.split('.');
244 
        var x1 = x[0];
245 
        var x2 = x.length > 1 && x[1] != '0' ? '.' + x[1] : '';
246 
        var lastThree = x1.substring(x1.length - 3);
247 
        var otherNumbers = x1.substring(0, x1.length - 3);
248 
        if (x1.charAt(x1.length - 4) == ',' || x1.charAt(x1.length - 4) == '-') {
249 
            console.log(lastThree)
250 
        } else {
251 
            if (otherNumbers != '')
252 
                lastThree = ',' + lastThree;
253 
        }
254 
        return otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + (lastThree)
255 
                + x2;
256 
 
257 
    }
258 
 
259 
    $(document).ready(function () {
260 
        $('.currency').each(function (index, ele) {
261 
            if (!isNaN(parseInt($(ele).html()))) {
262 
                $(ele).html(numberToComma($(ele).html()));
263 
            }
264 
        });
265 
    })
266 
</script>
33991 ranu 267 
 
268 
 
269 
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
270 
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
271 
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css"/>
272 
 
273 
<script>
274 
    // Initialize the date range picker
275 
    $('input[name="rbmArrPeriod"]').daterangepicker({
276 
        autoUpdateInput: false, // Prevent auto-filling the input with dates
277 
        locale: {
278 
            cancelLabel: 'Clear'
279 
        }
280 
    });
281 
 
282 
    // Update the input field when dates are selected
283 
    $('input[name="rbmArrPeriod"]').on('apply.daterangepicker', function (ev, picker) {
284 
        $(this).val(picker.startDate.format('YYYY-MM-DD') + ' - ' + picker.endDate.format('YYYY-MM-DD'));
285 
    });
286 
 
287 
    // Clear the input field when the user cancels
288 
    $('input[name="rbmArrPeriod"]').on('cancel.daterangepicker', function (ev, picker) {
289 
        $(this).val('');
290 
    });
291 
 
292 
    // Function to get the dates from the picker
293 
    function getDatesFromPicker(selector) {
294 
        const pickerElement = $(selector).data('daterangepicker');
295 
        if (!pickerElement) {
296 
            console.error('Date Range Picker is not initialized.');
297 
            return {startDate: null, endDate: null};
298 
        }
299 
        return {
300 
            startDate: pickerElement.startDate.format('YYYY-MM-DD'),
301 
            endDate: pickerElement.endDate.format('YYYY-MM-DD')
302 
        };
303 
    }
304 
 
305 
    // Button click event
306 
    $(document).on('click', '.sold-catalog-report', function () {
307 
        const dates = getDatesFromPicker('input[name="rbmArrPeriod"]');
308 
        const startDate = dates.startDate;
309 
        const endDate = dates.endDate;
310 
 
311 
        if (!startDate || !endDate) {
312 
            alert("Start date and end date cannot be empty!!");
313 
            return;
314 
        }
315 
 
316 
        let endPoint = `/downloadSoldCatalogReport?startDate=${startDate}&endDate=${endDate}`;
317 
        window.open(endPoint, '_blank');
318 
        ;
319 
    });
33997 ranu 320 
 
35172 ranu 321 
 
33997 ranu 322 
    // Button click event
35172 ranu 323 
    $(document).on('click', '.partnerwise-billed-po', function () {
324 
        let endPoint = `/downloadModelBrandWisePo`;
325 
        window.open(endPoint, '_blank');
326 
        ;
327 
    });
328 
 
329 
    // Button click event
33997 ranu 330 
    $(document).on('click', '.rbm-target-achievement', function () {
331 
        const dates = getDatesFromPicker('input[name="rbmArrPeriod"]');
332 
        const startDate = dates.startDate;
333 
        const endDate = dates.endDate;
334 
 
335 
        if (!startDate || !endDate) {
336 
            alert("Start date and end date cannot be empty!!");
337 
            return;
338 
        }
339 
 
340 
        let endPoint = `/getDateWiseRabmTargetAndAchievements?startDate=${startDate}&endDate=${endDate}`;
341 
        window.open(endPoint, '_blank');
342 
        ;
343 
    });
33991 ranu 344 
</script>
35147 ranu 345 
 
346 
<script>
35201 ranu 347 
    function refreshTodayPOTable() {
348 
        var selectedCategory = $('#categoryDropdown').val();
35147 ranu 349 
 
35201 ranu 350 
        $.ajax({
351 
            url: "/indent/today_po_table_fragment",
352 
            type: "GET",
353 
            data: {categoryType: selectedCategory},
354 
            success: function (response) {
355 
                $('.purchaseMilestoneContainer').fadeOut(200, function () {
356 
                    $(this).html(response).fadeIn(200);
357 
                });
358 
            },
359 
            error: function (xhr, status, error) {
360 
                console.error("Error loading table: " + error);
361 
                alert("Failed to load table data. Please try again.");
362 
            }
363 
        });
364 
    }
365 
 
366 
    // Refresh table when dropdown changes
367 
    $('#categoryDropdown').on('change', refreshTodayPOTable);
368 
 
369 
    // Optional: load default table on page load
35147 ranu 370 
    $(document).ready(function () {
35201 ranu 371 
        refreshTodayPOTable();
35147 ranu 372 
    });
35201 ranu 373 
 
374 
 
35147 ranu 375 
</script>
376 
 
35757 ranu 377 
<script>
378 
    // Smart page refresh - pauses when modal is open or audio is playing
379 
    (function () {
380 
        var REFRESH_INTERVAL = 360000; // 360 seconds = 6 minutes
381 
 
382 
        function isAnyModalOpen() {
383 
            // Check if any Bootstrap modal is currently shown
384 
            return $('.modal.show').length > 0 || $('.modal.in').length > 0;
385 
        }
386 
 
387 
        function isAnyAudioPlaying() {
388 
            // Check if any audio element is currently playing
389 
            var audioElements = document.querySelectorAll('audio');
390 
            for (var i = 0; i < audioElements.length; i++) {
391 
                if (!audioElements[i].paused) {
392 
                    return true;
393 
                }
394 
            }
395 
            return false;
396 
        }
397 
 
398 
        function canRefresh() {
399 
            return !isAnyModalOpen() && !isAnyAudioPlaying();
400 
        }
401 
 
402 
        function smartRefresh() {
403 
            if (canRefresh()) {
404 
                location.reload();
405 
            }
406 
            // If can't refresh now, check again in 10 seconds
407 
            // This ensures refresh happens soon after modal closes or audio stops
408 
        }
409 
 
410 
        // Set up the refresh interval
411 
        setInterval(function () {
412 
            if (canRefresh()) {
413 
                location.reload();
414 
            }
415 
        }, REFRESH_INTERVAL);
416 
    })();
417 
</script>
418 
 
29966 amit.gupta 419 
</body>
420 
</html>