Subversion Repositories SmartDukaan

<style>

    #rbm-call-target-table td, #rbm-call-target-table th {

        font-size: 14px;

        text-align: center;

        padding: 0.4rem;

        vertical-align: middle;

    }

    #rbm-call-target-table thead th {

        background-color: #343a40;

        color: white;

        font-weight: 600;

    }

    #rbm-call-target-table tbody tr:first-child td {

        font-weight: bold;

        background-color: #00d6b2;

    }

    .highlight-target {

        background-color: #fff3cd !important;

        font-weight: bold;

    }

    .highlight-achieved {

        background-color: #d4edda !important;

    }

    .highlight-oos {

        background-color: #f8d7da !important;

    }

    .highlight-plan-today {

        background-color: #0f57a4 !important;

        color: white !important;

    }

    .highlight-carry-forward {

        background-color: #ffc107 !important;

        color: #000 !important;

    }

    .highlight-untouched {

        background-color: #dc3545 !important;

        color: white !important;

    }

    .highlight-future-plan {

        background-color: #6c757d !important;

        color: #000 !important;

    }

    .clickable {

        cursor: pointer;

        text-decoration: underline;

        color: #007bff;

    }

    .clickable:hover {

        color: #0056b3;

    }

    .modal-body table {

        width: 100%;

    }

    .modal-body table th, .modal-body table td {

        padding: 8px;

        border: 1px solid #ddd;

    }

</style>

<div class="container-fluid">

    <h3>RBM Call Target Summary</h3>

    <table id="rbm-call-target-table" class="table table-bordered table-striped">

        <thead>

        <tr>

            <th>RBM Name</th>

            <th>Partner Count</th>

            <th>(Ach/Tgt)</th>

            <th>Calling Target</th>

            <th>Called</th>

            <th class="highlight-plan-today">Plan Today</th>

            <th class="highlight-carry-forward">Carry Forward</th>

            <th style="background-color: #1e6e0e; color: white;">Zero Billing</th>

            <th class="highlight-untouched">Untouched</th>

            <th class="highlight-future-plan">Future Plan</th>

            <th>Normal</th>

            <th style="background-color: #c0392b;">Out of Sequence</th>

            <th>Download</th>

        </tr>

        </thead>

        <tbody>

            #set($totalPartnerCount = 0)

            #set($totalTodayTarget = 0)

            #set($totalValueAchieved = 0)

            #set($totalMovedToFuture = 0)

            #set($totalPlanToday = 0)

            #set($totalCarryForward = 0)

            #set($totalZeroBilling = 0)

            #set($totalUntouched = 0)

            #set($totalFuturePlan = 0)

            #set($totalNormal = 0)

            #set($totalOutOfSequence = 0)

            #set($totalL2CallingList = 0)

            #set($totalArrAchieved = 0)

            #set($totalArrTarget = 0)

            ## Total row first

            #foreach($model in $rbmCallTargetModels)

                #set($totalPartnerCount = $totalPartnerCount + $model.getPartnerCount())

                #set($totalTodayTarget = $totalTodayTarget + $model.getTodayTargetOfCall())

                #set($totalValueAchieved = $totalValueAchieved + $model.getValueTargetAchieved())

                #set($totalMovedToFuture = $totalMovedToFuture + $model.getMovedToFuture())

                #set($totalPlanToday = $totalPlanToday + $model.getPlanToday())

                #set($totalCarryForward = $totalCarryForward + $model.getCarryForward())

                #set($totalZeroBilling = $totalZeroBilling + $model.getZeroBilling())

                #set($totalUntouched = $totalUntouched + $model.getUntouched())

                #set($totalFuturePlan = $totalFuturePlan + $model.getFuturePlan())

                #set($totalNormal = $totalNormal + $model.getNormal())

                #set($totalOutOfSequence = $totalOutOfSequence + $model.getOutOfSequenceCount())

                #set($totalL2CallingList = $totalL2CallingList + $model.getL2CallingList())

                #if($arrAchievedByAuthId && $arrAchievedByAuthId.get($model.getAuthId()))

                    #set($totalArrAchieved = $totalArrAchieved + $arrAchievedByAuthId.get($model.getAuthId()))

                #end

                #if($arrTargetByAuthId && $arrTargetByAuthId.get($model.getAuthId()))

                    #set($totalArrTarget = $totalArrTarget + $arrTargetByAuthId.get($model.getAuthId()))

                #end

            #end

            #set($adjustedTotalTarget = $totalTodayTarget + $totalMovedToFuture)

            #set($adjustedTotalAchieved = $totalValueAchieved + $totalMovedToFuture)

        <tr>

            <td><strong>TOTAL</strong></td>

            <td><strong>$totalPartnerCount</strong></td>

            <td><strong><span class="lakh">$totalArrAchieved</span> / <span class="lakh">$totalArrTarget</span></strong>

            </td>

            <td class="highlight-target"><strong>$adjustedTotalTarget</strong></td>

            <td class="highlight-achieved currency"><strong>$adjustedTotalAchieved</strong></td>

            <td class="highlight-plan-today"><strong>$totalPlanToday</strong></td>

            <td class="highlight-carry-forward"><strong>$totalCarryForward</strong></td>

            <td><strong>$totalZeroBilling</strong></td>

            <td class="highlight-untouched"><strong>$totalUntouched</strong></td>

            <td class="highlight-future-plan"><strong>$totalFuturePlan</strong></td>

            <td><strong>$totalNormal</strong></td>

            <td class="highlight-oos"><strong>$totalOutOfSequence</strong></td>

            <td></td>

        </tr>

            #foreach($model in $rbmCallTargetModels)

                #set($rowTarget = $model.getTodayTargetOfCall() + $model.getMovedToFuture())

                #set($rowAchieved = $model.getValueTargetAchieved() + $model.getMovedToFuture())

            <tr>

                <td>$model.getRbmName()</td>

                <td>$model.getPartnerCount()</td>

                <td>

                    #if($arrAchievedByAuthId && $arrAchievedByAuthId.get($model.getAuthId()))

                        <span class="lakh">$arrAchievedByAuthId.get($model.getAuthId())</span>

                    #else

                    #end

                    /

                    #if($arrTargetByAuthId && $arrTargetByAuthId.get($model.getAuthId()))

                        <span class="lakh">$arrTargetByAuthId.get($model.getAuthId())</span>

                    #else

                    #end

                </td>

                <td class="highlight-target">$rowTarget</td>

                <td class="highlight-achieved currency">$rowAchieved</td>

                <td class="highlight-plan-today">$model.getPlanToday()</td>

                <td class="highlight-carry-forward">$model.getCarryForward()</td>

                <td>$model.getZeroBilling()</td>

                <td class="highlight-untouched">$model.getUntouched()</td>

                <td class="highlight-future-plan">$model.getFuturePlan()</td>

                <td>$model.getNormal()</td>

                <td class="highlight-oos" style="color: red;">

                    #if($model.getOutOfSequenceCount() > 0)

                        <span class="clickable" style="color: #e80404"

                              onclick="showOutOfSequenceDetails($model.getAuthId(), '$model.getRbmName()')">$model.getOutOfSequenceCount()</span>

                    #else

                    #end

                </td>

                <td>

                    <a href="/indent/rbm_call_target/download_raw_data?authId=$model.getAuthId()" target="_blank"

                       class="btn btn-sm btn-outline-success">CSV</a>

                </td>

            </tr>

            #end

        </tbody>

    </table>

</div>

<script type="text/javascript">

    document.addEventListener('DOMContentLoaded', function () {

        var elems = document.querySelectorAll('.lakh');

        for (var i = 0; i < elems.length; i++) {

            var val = parseInt(elems[i].textContent.trim());

            if (!isNaN(val)) {

                elems[i].textContent = (val / 100000).toFixed(1) + 'L';

            }

        }

    });

    function showOutOfSequenceDetails(authId, rbmName) {

        document.getElementById('oosModalLabel').textContent = 'Out of Sequence Calls - ' + rbmName;

        document.getElementById('oosDetailsContent').innerHTML = '<p>Loading...</p>';

        $('#oosModal').modal('show');

        fetch('/indent/rbm_call_target/oos_details?authId=' + authId)

                .then(function (response) {

                    return response.json();

                })

                .then(function (data) {

                    if (data && data.length > 0) {

                        var html = '<table class="table table-bordered table-sm"><thead><tr><th>S.No</th><th>Party Name</th><th>Code</th><th>Time</th></tr></thead><tbody>';

                        for (var i = 0; i < data.length; i++) {

                            html += '<tr><td>' + (i + 1) + '</td><td>' + data[i].partyName + '</td><td>' + data[i].code + '</td><td>' + data[i].time + '</td></tr>';

                        }

                        html += '</tbody></table>';

                        document.getElementById('oosDetailsContent').innerHTML = html;

                    } else {

                        document.getElementById('oosDetailsContent').innerHTML = '<p>No out of sequence calls found.</p>';

                    }

                })

                .catch(function () {

                    document.getElementById('oosDetailsContent').innerHTML = '<p>Error loading details. Please try again.</p>';

                });

    }

</script>