Subversion Repositories SmartDukaan

Rev

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

Rev Author Line No. Line
33991 ranu 1
<link rel="stylesheet"
2
      href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/3.1.0/daterangepicker.min.css"/>
3
 
33951 ranu 4
<style>
5
    table th {
6
        text-align: center;
7
    }
8
 
9
    #rbm-arr-table td, #rbm-arr-table th {
10
        padding: 0.35rem;
33997 ranu 11
        font-size: 18px;
33951 ranu 12
    }
13
 
33953 ranu 14
    .text-bold {
15
        font-weight: bold !important;
16
    }
17
 
18
    .text-bold span {
19
        font-weight: bold;
20
    }
21
 
33951 ranu 22
    .rb-name {
33997 ranu 23
        font-size: 16px;
33951 ranu 24
        font-weight: bold;
25
    }
26
 
27
    #rbm-arr-table td {
28
        text-align: center;
29
        background-size: 100% 100%;
30
        background-repeat: no-repeat;
31
        color: #000; /* Ensure text remains visible */
32
        font-weight: 400;
33
    }
34
 
34055 ranu 35
    #rbm-aging-table td {
36
        text-align: center;
37
        background-size: 100% 100%;
38
        background-repeat: no-repeat;
39
        color: #000; /* Ensure text remains visible */
40
        font-weight: 400;
41
    }
42
 
43
    .border-top-bottom {
44
        border-top: 2px solid #000 !important;
45
        border-bottom: 2px solid #000 !important;
46
    }
47
 
48
    #rbm-aging-table td, #rbm-aging-table th {
49
        padding: 0.35rem;
50
        font-size: 18px;
51
    }
52
 
33951 ranu 53
</style>
54
 
33917 ranu 55
<section class="wrapper">
34055 ranu 56
    <div class="row" style="margin: 0">
33992 ranu 57
        #if($isGtEqL3)
34098 ranu 58
            <div class="col-md-12 text-right">
59
                <h4>RBM Wise Today's ARR (Basis Product Movement)</h4>
60
                <table style="float:right;margin-bottom: 10px;">
61
                    <tr>
62
                        <td>
63
                            <input placeholder="Set Duration" name="rbmArrPeriod"
64
                                   id="rbmArrPeriod"
65
                                   type="text" value="" class="form-control input-sm" style="height: 34px;">
66
                        </td>
67
                        <td>
68
                            <input class="btn btn-primary btn-sm rbm-target-achievement"
69
                                   type="button"
70
                                   value="View">
71
                        </td>
72
                        <td>
73
                            <input class="btn btn-primary btn-sm sold-catalog-report"
74
                                   type="button"
75
                                   value="Download row data">
76
                        </td>
77
                    </tr>
78
                </table>
79
            </div>
33992 ranu 80
        #end
33917 ranu 81
        <div class="col-lg-12">
82
            <table id="rbm-arr-table" class="table table-border table-condensed table-bordered" style="width:100%">
83
                <tr>
33939 ranu 84
                    <th>RBM</th>
85
                    <th>Total (ACH/TGT)</th>
86
                    <th>%</th>
87
                    <th>HID (ACH/TGT)</th>
88
                    <th>%</th>
33956 ranu 89
                    <th>FAST (ACH/TGT)</th>
90
                    <th>%</th>
33939 ranu 91
                    <th>RUN (ACH/TGT)</th>
92
                    <th>%</th>
34098 ranu 93
                    <th>SLOW (ACH/TGT)</th>
33939 ranu 94
                    <th>%</th>
95
                    <th>Other (ACH/TGT)</th>
96
                    <th>%</th>
33917 ranu 97
                </tr>
34098 ranu 98
                #foreach($target in $rbmArrViewModels)
33917 ranu 99
                    <tr>
33933 ranu 100
                        <td>$target.getRbmName()- $target.getWarehouseName()</td>
34098 ranu 101
 
33939 ranu 102
                        <td><span class="achieved-cell">$target.getTotalAchievedTarget()</span> / <span
103
                                class="target-cell">$target.getTodayTarget()</span></td>
104
                        <td class="total-percent"></td>
34098 ranu 105
 
33939 ranu 106
                        <td><span class="achieved-cell">$target.getTodayAchievedHidTarget()</span> / <span
107
                                class="target-cell">$target.getTodayHidTarget()</span></td>
108
                        <td class="hid-percent"></td>
34098 ranu 109
 
33939 ranu 110
                        <td><span class="achieved-cell">$target.getTodayAchievedFastMovingTarget()</span> / <span
111
                                class="target-cell">$target.getTodayFastMovingTarget()</span></td>
34098 ranu 112
                        <td class="fast-percent"></td>
113
 
114
                        <td><span class="achieved-cell">$target.getTodayAchievedRunningTarget()</span> / <span
115
                                class="target-cell">$target.getTodayRunningTarget()</span></td>
33939 ranu 116
                        <td class="run-percent"></td>
34098 ranu 117
 
33939 ranu 118
                        <td><span class="achieved-cell">$target.getTodayAchievedSlowMovingTarget()</span> / <span
119
                                class="target-cell">$target.getTodaySlowMovingTarget()</span></td>
120
                        <td class="slow-percent"></td>
34098 ranu 121
 
33939 ranu 122
                        <td><span class="achieved-cell">$target.getTodayAchievedOtherMovingTarget()</span> / <span
123
                                class="target-cell">$target.getTodayOtherMovingTarget()</span></td>
124
                        <td class="other-percent"></td>
33917 ranu 125
                    </tr>
34098 ranu 126
                #end
33946 ranu 127
                <!-- Add a row for totals -->
33942 ranu 128
                <tr>
129
                    <td><strong>Total</strong></td>
33953 ranu 130
                    <td class="text-bold"><span class="achieved-cell">$totalAchieved </span> / <span
131
                            class="target-cell">$totalTargetSum</span></td>
132
                    <td class="total-percent text-bold"></td>
33951 ranu 133
 
33953 ranu 134
                    <td class="text-bold"><span class="achieved-cell">$totalHidAchievedSum</span> / <span
135
                            class="target-cell">$totalHidSum</span></td>
136
                    <td class="hid-percent text-bold"></td>
33951 ranu 137
 
33953 ranu 138
                    <td class="text-bold"><span class="achieved-cell">$totalFastAchievedSum</span> / <span
139
                            class="target-cell">$totalFastSum</span></td>
34098 ranu 140
                    <td class="fast-percent text-bold"></td>
141
 
142
                    <td class="text-bold"><span class="achieved-cell">$totalRunningAchievedSum</span> / <span
143
                            class="target-cell">$totalRunningSum</span></td>
33953 ranu 144
                    <td class="run-percent text-bold"></td>
33951 ranu 145
 
33953 ranu 146
                    <td class="text-bold"><span class="achieved-cell">$totalSlowAchievedSum</span> / <span
147
                            class="target-cell">$totalSlowSum</span></td>
148
                    <td class="slow-percent text-bold"></td>
33951 ranu 149
 
33953 ranu 150
                    <td class="text-bold"><span class="achieved-cell">$totalOtherAchievedSum</span> / <span
151
                            class="target-cell">$totalOtherSum</span></td>
152
                    <td class="other-percent text-bold"></td>
33942 ranu 153
                </tr>
33951 ranu 154
 
33917 ranu 155
            </table>
156
        </div>
157
    </div>
34055 ranu 158
 
159
    <div class="row" style="margin: 0">
34098 ranu 160
        <div class="col-md-12">
161
            <br>
162
            <h4> > 15 Days Aging Sold </h4>
163
            <table id="rbm-aging-table" class="table table-border table-condensed table-bordered"
164
                   style="width:100%">
165
                <thead>
166
                <tr>
167
                    <th>RBM</th>
168
                    <th>HID</th>
169
                    <th>FASTMOVING</th>
170
                    <th>RUNNING</th>
171
                    <th>SLOWMOVING</th>
172
                    <th>OTHER</th>
173
                    <th>TOTAL</th>
174
                </tr>
175
                </thead>
176
                <tbody>
177
                    #foreach($model in $sold15daysOldAgingModels)
34055 ranu 178
                    <tr>
34098 ranu 179
                        <th>$model.getRbmName()</th>
180
                        <td class="format-indian">$model.getHidBilled()</td>
181
                        <td class="format-indian">$model.getFastmovingBilled()</td>
182
                        <td class="format-indian">$model.getRunningBilled()</td>
183
                        <td class="format-indian">$model.getSlowmovingBilled()</td>
184
                        <td class="format-indian">$model.getOthersBilled()</td>
185
                        <td class="format-indian">$model.getTotalBilled()</td>
34055 ranu 186
                    </tr>
34098 ranu 187
                    #end
188
                <tr>
189
                    <th class="border-top-bottom"> Total</th>
190
                    <td class="border-top-bottom format-indian">$totalSoldHid</td>
191
                    <td class="border-top-bottom format-indian">$totalSoldFast</td>
192
                    <td class="border-top-bottom format-indian">$totalSoldRun</td>
193
                    <td class="border-top-bottom format-indian">$totalSoldSlow</td>
194
                    <td class="border-top-bottom format-indian">$totalSoldOther</td>
195
                    <td class="border-top-bottom format-indian">$totalSoldAging</td>
196
                </tr>
197
                    #foreach($aging in $our15DaysOldAgingStocks)
34055 ranu 198
                    <tr>
34098 ranu 199
                        <th class="border-top-bottom"> 15 days Balance Value</th>
200
                        <td class="border-top-bottom format-indian">$aging.getHidAgingStock()</td>
201
                        <td class="border-top-bottom format-indian">$aging.getFastmovingAgingStock()</td>
202
                        <td class="border-top-bottom format-indian">$aging.getRunningAgingStock()</td>
203
                        <td class="border-top-bottom format-indian">$aging.getSlomovingAgingStock()</td>
204
                        <td class="border-top-bottom format-indian">$aging.getOtherAgingStock()</td>
205
                        <td class="border-top-bottom format-indian">$aging.getTotal()</td>
34055 ranu 206
                    </tr>
34098 ranu 207
                    #end
208
                </tbody>
209
            </table>
210
        </div>
34055 ranu 211
    </div>
34103 ranu 212
 
213
    <div class="row" style="margin: 0">
214
        <div class="col-md-12">
215
            <br>
216
            <h4>Partner Billing Count </h4>
217
            <table id="rbm-aging-table" class="table table-border table-condensed table-bordered"
218
                   style="width:100%">
219
                <thead>
220
                <tr>
221
                    <th>RBM</th>
34114 ranu 222
                    <th>Targted Partner</th>
34120 ranu 223
                    <th>First Week Billed <br> (1-7)</th>
224
                    <th>Second Week Billed <br>(8-15)</th>
225
                    <th>Third Week Billed <br>(16-21)</th>
226
                    <th>Fourth Week Billed <br> (22-month end)</th>
34106 ranu 227
                    <th>MTD Billed</th>
34119 ranu 228
                    <th>Zero Billed</th>
34103 ranu 229
                </tr>
230
                </thead>
231
                <tbody>
232
                    #foreach($model in $sold15daysOldAgingModels)
233
                    <tr>
234
                        <th>$model.getRbmName()</th>
235
                        <td>
34114 ranu 236
                            #if($rbmTargetedFofoIdCountMap.get($model.getRbmName()))
237
                                $rbmTargetedFofoIdCountMap.get($model.getRbmName())
238
                            #else
239
 
240
                            #end
241
                        </td>
242
                        <td>
34103 ranu 243
                            #if($rbmBilledCountMapFirstWeek.get($model.getRbmName()))
244
                                $rbmBilledCountMapFirstWeek.get($model.getRbmName())
245
                            #else
246
 
247
                            #end
248
                        </td>
249
                        <td>
250
                            #if($rbmBilledCountMapSecondWeek.get($model.getRbmName()))
251
                                $rbmBilledCountMapSecondWeek.get($model.getRbmName())
252
                            #else
253
 
254
                            #end
255
                        </td>
256
                        <td>
257
                            #if($rbmBilledCountMapThirdWeek.get($model.getRbmName()))
258
                                $rbmBilledCountMapThirdWeek.get($model.getRbmName())
259
                            #else
260
 
261
                            #end
262
                        </td>
263
                        <td>
264
                            #if($rbmBilledCountMapFourthWeek.get($model.getRbmName()))
265
                                $rbmBilledCountMapFourthWeek.get($model.getRbmName())
266
                            #else
267
 
268
                            #end
269
                        </td>
270
                        <td>
271
                            #if($rbmBilledCountMapMtd.get($model.getRbmName()))
272
                                $rbmBilledCountMapMtd.get($model.getRbmName())
273
                            #else
274
 
275
                            #end
276
                        </td>
34119 ranu 277
                        <td>
278
                            #if($zeroBilledCountMap.get($model.getRbmName()))
279
                                $zeroBilledCountMap.get($model.getRbmName())
280
                            #else
281
 
282
                            #end
283
                        </td>
34103 ranu 284
                    </tr>
285
                    #end
34119 ranu 286
                <tr>
287
                    <th class="border-top-bottom">Total</th>
288
                    <th class="border-top-bottom">$totalTargetedCount</th>
289
                    <th class="border-top-bottom">$totalFirstWeekCount</th>
290
                    <th class="border-top-bottom">$totalSecondWeekCount</th>
291
                    <th class="border-top-bottom">$totalThirdWeekCount</th>
292
                    <th class="border-top-bottom">$totalFourthWeekCount</th>
293
                    <th class="border-top-bottom">$totalMtdCount</th>
294
                    <th class="border-top-bottom">$totalZeroBilledCount</th>
295
                </tr>
34103 ranu 296
                </tbody>
297
            </table>
298
        </div>
299
    </div>
33930 ranu 300
</section>
33945 ranu 301
 
33930 ranu 302
<script>
34074 ranu 303
    function formatNumberIndian(num) {
34075 ranu 304
        x = num.toString();
305
        var lastThree = x.substring(x.length - 3);
306
        var otherNumbers = x.substring(0, x.length - 3);
307
        if (otherNumbers != '')
308
            lastThree = ',' + lastThree;
309
        var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
310
        return res;
34074 ranu 311
    }
312
 
313
    document.addEventListener("DOMContentLoaded", function () {
314
        document.querySelectorAll(".format-indian").forEach(function (el) {
315
            el.textContent = formatNumberIndian(el.textContent.trim());
316
        });
317
    });
318
</script>
319
 
320
 
321
<script>
33933 ranu 322
    function formatValueInLakh(value) {
33939 ranu 323
        return (value / 100000).toFixed(1) + 'L';
33930 ranu 324
    }
325
 
326
    function formatTargets() {
327
        const rows = document.querySelectorAll('#rbm-arr-table tbody tr');
33942 ranu 328
        let totalAchieved = 0, totalTarget = 0;
329
        let totalAchievedHid = 0, totalTargetHid = 0;
34098 ranu 330
        let totalAchievedFast = 0, totalTargetFast = 0;
331
        let totalAchievedRunning = 0, totalTargetRunning = 0;
33942 ranu 332
        let totalAchievedSlow = 0, totalTargetSlow = 0;
333
        let totalAchievedOther = 0, totalTargetOther = 0;
33930 ranu 334
 
335
        rows.forEach(row => {
33931 ranu 336
            const cells = row.querySelectorAll('td');
33946 ranu 337
            cells.forEach((cell, index) => {
338
                const achievedSpan = cell.querySelector('.achieved-cell');
339
                const targetSpan = cell.querySelector('.target-cell');
340
                if (achievedSpan && targetSpan) {
341
                    const achievedValue = parseFloat(achievedSpan.textContent.replace(/[^\d.-]/g, ''));
342
                    const targetValue = parseFloat(targetSpan.textContent.replace(/[^\d.-]/g, ''));
33944 ranu 343
 
33946 ranu 344
                    // Add to totals
345
                    if (index === 1) {
346
                        totalAchieved += achievedValue || 0;
347
                        totalTarget += targetValue || 0;
348
                    } else if (index === 3) {
349
                        totalAchievedHid += achievedValue || 0;
350
                        totalTargetHid += targetValue || 0;
351
                    } else if (index === 5) {
34098 ranu 352
                        totalAchievedFast += achievedValue || 0;
353
                        totalTargetFast += targetValue || 0;
33946 ranu 354
                    } else if (index === 7) {
34098 ranu 355
                        totalAchievedRunning += achievedValue || 0;
356
                        totalTargetRunning += targetValue || 0;
357
                    } else if (index === 9) {
33946 ranu 358
                        totalAchievedSlow += achievedValue || 0;
359
                        totalTargetSlow += targetValue || 0;
360
                    } else if (index === 11) {
361
                        totalAchievedOther += achievedValue || 0;
362
                        totalTargetOther += targetValue || 0;
363
                    }
33930 ranu 364
 
33946 ranu 365
                    // Format values in lakh
366
                    if (!isNaN(achievedValue)) achievedSpan.textContent = formatValueInLakh(achievedValue);
367
                    if (!isNaN(targetValue)) targetSpan.textContent = formatValueInLakh(targetValue);
33942 ranu 368
 
33946 ranu 369
                    const percentCell = cell.nextElementSibling;
370
                    if (percentCell && targetValue > 0) {
371
                        const percentage = ((achievedValue / targetValue) * 100).toFixed(1);
372
                        percentCell.textContent = percentage + '%';
33931 ranu 373
 
33946 ranu 374
                        // Determine background color based on percentage
375
                        let color;
33962 ranu 376
                        if (percentage <= 1) {
377
                            percentCell.style.color = `red`
378
                        }
33946 ranu 379
                        if (percentage <= 40) {
380
                            color = '#F56983FF'; // Orange for <= 40%
34110 ranu 381
                        } else if (percentage > 40 && percentage <= 95) {
382
                            color = '#f2c947e8'; // Yellow for 41% - 95%
33946 ranu 383
                        } else {
34110 ranu 384
                            color = '#82ef8299'; // Green for > 95%
33946 ranu 385
                        }
33945 ranu 386
 
33946 ranu 387
                        // Apply gradient background with the color
388
                        percentCell.style.background = `linear-gradient(to right, ${color} ${percentage}%, transparent ${percentage}%)`;
389
                    } else if (percentCell) {
33953 ranu 390
                        percentCell.textContent = "-";
33946 ranu 391
                        percentCell.style.background = 'none';
33931 ranu 392
                    }
33946 ranu 393
                }
33930 ranu 394
            });
33946 ranu 395
        });
33942 ranu 396
 
33946 ranu 397
    }
33944 ranu 398
 
33958 ranu 399
    function groupRowsByRbm() {
400
        const rows = document.querySelectorAll('#rbm-arr-table tbody tr');
401
        let currentRbm = null;
402
        let rbmGroup = [];
403
 
404
        rows.forEach((row, index) => {
405
            const rbmCell = row.cells[0];
406
            if (!rbmCell) return;
407
 
408
            const rbmName = rbmCell.textContent.split('-')[0].trim(); // Extract RBM name
409
 
410
            if (rbmName !== currentRbm) {
411
                // Apply border to the previous group
412
                if (rbmGroup.length > 0) {
413
                    applyBorderToGroup(rbmGroup);
414
                }
415
 
416
                // Reset for new RBM
417
                currentRbm = rbmName;
418
                rbmGroup = [];
419
            }
420
 
421
            // Add the row to the current group
422
            rbmGroup.push(row);
423
 
424
            // Apply border to the last group
425
            if (index === rows.length - 1 && rbmGroup.length > 0) {
426
                applyBorderToGroup(rbmGroup);
427
            }
428
        });
429
    }
430
 
431
    function applyBorderToGroup(group) {
432
        if (group.length === 0) return;
433
 
434
        // Add border styles to the first and last rows in the group
435
        //group[0].style.borderTop = '2px solid #000'; // Black border for start
436
        group[group.length - 1].style.borderBottom = '2px solid #000'; // Black border for end
437
    }
438
 
439
    window.onload = function () {
440
        formatTargets(); // Format targets first
441
        groupRowsByRbm(); // Group rows by RBM
442
    };
443
 
444
 
33945 ranu 445
</script>