Subversion Repositories SmartDukaan

<style>

    table th {
        text-align: center;
    }

    #rbm-arr-table td, #rbm-arr-table th {
        padding: 0.35rem;
        font-size: 20px;
    }


    .rb-name {
        font-size: 17px;
        font-weight: bold;
    }
</style>

<section class="wrapper">
    ##    <div class="row">
    ##        <div class="col-lg-12">
    ##            <h3 class="page-header"><i class="icon_document_alt"></i>RBM ARR</h3>
    ##            <ol class="breadcrumb">
    ##                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">Home</a></li>
    ##                <li><i class="icon_document_alt"></i>RBM Wise Today's ARR (Basis Product Movement)</li>
    ##            </ol>
    ##        </div>
    ##    </div>

    <div class="row">
        ##        <div class="col-lg-4">
        ##         <table>
        ##             <tr>
        ##                 <td style="margin-right: 10px;"><input type="date" class="form-control arr-start_date" placeholder="select date"> </td>
        ##                 <td><button type="button" class="btn btn-info arr-button-mk">Submit</button> </td>
        ##             </tr>
        ##         </table>
        ##        </div>
        ##        <div class="col-lg-8"></div>
        <div class="clearfix"></div>
        <br>
        <div class="col-lg-12">
            <table id="rbm-arr-table" class="table table-border table-condensed table-bordered" style="width:100%">

                <thead>
                <tr>
                    <th rowspan="2" class="text-left">RBM</th>
                    <th class="text-center">HID</th>
                    <th>RUN</th>
                    <th>SLOW</th>
                    <th>EOL</th>
                    <th>Other</th>
                    <th>Total</th>
                </tr>
                <tr>
                    <th>ACH/TGT</th>

                    <th>ACH/TGT</th>

                    <th>ACH/TGT</th>

                    <th>ACH/TGT</th>

                    <th>ACH/TGT</th>

                    <th>ACH/TGT</th>

                </tr>

                </thead>
                #foreach($target in $rbmArrViewModels)
                    <tbody>
                    <tr>
                        <td class="rb-name">$target.getRbmName()- $target.getWarehouseName()</td>

                        <td><span class="target-cell">$target.getTodayAchievedHidTarget()</span> / <span
                                class="achieved-cell">$target.getTodayHidTarget()</span></td>

                        <td><span class="target-cell">$target.getTodayAchievedFastMovingTarget()</span> / <span
                                class="achieved-cell">$target.getTodayFastMovingTarget()</span></td>

                        <td><span class="target-cell">$target.getTodayAchievedSlowMovingTarget()</span> / <span
                                class="achieved-cell">$target.getTodaySlowMovingTarget()</span></td>

                        <td><span class="target-cell">$target.getTodayAchievedEolTarget()</span> / <span
                                class="achieved-cell">$target.getTodayEolTarget()</span></td>

                        <td><span class="target-cell">$target.getTodayAchievedOtherMovingTarget()</span> / <span
                                class="achieved-cell">$target.getTodayOtherMovingTarget()</span></td>

                        <td><span class="target-cell">$target.getTotalAchievedTarget()</span> / <span
                                class="achieved-cell">$target.getTodayTarget()</span></td>
                    </tr>
                    </tbody>
                #end

            </table>
        </div>


    </div>


</section>

<script>
    // Function to format all values in lakhs, converting thousands to lakhs and ignoring hundreds
    function formatValueInLakhs(value) {
        if (value >= 1000) {
            return (value / 100000).toFixed(1) + ' L'; // Convert thousands and above to lakhs
        } else {
            return '0.0 L'; // Display as 0.0 L for values less than 1000
        }
    }

    // Function to format target and achieved values in lakhs, with special handling for target = 0
    function formatTargets() {
        // Select all rows
        const rows = document.querySelectorAll('#rbm-arr-table tbody tr');

        rows.forEach(row => {
            // Find cells that contain both target and achieved values (ACH/TGT)
            const cells = row.querySelectorAll('td');

            cells.forEach(cell => {
                // Separate achieved and target values using the `/` separator
                let values = cell.textContent.split('/').map(val => val.trim());

                if (values.length === 2) {
                    let achievedValue = parseFloat(values[0].replace(/[^\d.-]/g, ''));
                    let targetValue = parseFloat(values[1].replace(/[^\d.-]/g, ''));

                    if (targetValue === 0) {
                        // If target is 0, display '-'
                        cell.innerHTML = '-';
                    } else {
                        // Format values to lakhs
                        let formattedAchieved = !isNaN(achievedValue) ? formatValueInLakhs(achievedValue) : '0.0 L';
                        let formattedTarget = !isNaN(targetValue) ? formatValueInLakhs(targetValue) : '0.0 L';

                        // Replace cell content with formatted values
                        cell.innerHTML = `<span class="achieved-cell">${formattedAchieved}</span> / <span class="target-cell">${formattedTarget}</span>`;

                        // Apply green background if achieved >= target
                        if (!isNaN(achievedValue) && !isNaN(targetValue) && achievedValue >= targetValue) {
                            cell.querySelector('.achieved-cell').style.backgroundColor = '#abf2abd4';
                        }
                    }
                }
            });
        });
    }

    // Run the function when the page loads or after data is dynamically added to the table
    window.onload = formatTargets;  // Call when the page is loaded
</script>