Subversion Repositories SmartDukaan

Rev

Rev 33945 | Rev 33951 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 33945 Rev 33946
Line 1... Line -...
1
<style>
-
 
2
    table th {
-
 
3
        text-align: center;
-
 
4
    }
-
 
5
 
-
 
6
    #rbm-arr-table td, #rbm-arr-table th {
-
 
7
        padding: 0.35rem;
-
 
8
        font-size: 20px;
-
 
9
    }
-
 
10
 
-
 
11
    .rb-name {
-
 
12
        font-size: 17px;
-
 
13
        font-weight: bold;
-
 
14
    }
-
 
15
 
-
 
16
    #rbm-arr-table td {
-
 
17
        text-align: center;
-
 
18
        background-size: 100% 100%;
-
 
19
        background-repeat: no-repeat;
-
 
20
        color: #000; /* Ensure text remains visible */
-
 
21
        font-weight: 400;
-
 
22
    }
-
 
23
 
-
 
24
</style>
-
 
25
 
-
 
26
<section class="wrapper">
1
<section class="wrapper">
27
    ##    <div class="row">
-
 
28
    ##        <div class="col-lg-12">
-
 
29
    ##            <h3 class="page-header"><i class="icon_document_alt"></i>RBM ARR</h3>
-
 
30
    ##            <ol class="breadcrumb">
-
 
31
    ##                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">Home</a></li>
-
 
32
    ##                <li><i class="icon_document_alt"></i>RBM Wise Today's ARR (Basis Product Movement)</li>
-
 
33
    ##            </ol>
-
 
34
    ##        </div>
-
 
35
    ##    </div>
-
 
36
 
-
 
37
    <div class="row">
2
    <div class="row">
38
        ##        <div class="col-lg-4">
-
 
39
        ##            <table>
-
 
40
        ##                <tr>
-
 
41
        ##                    <td><input type="date" class="form-control arr-start_date" placeholder="select date"></td>
-
 
42
        ##                    <td><button type="button" class="btn btn-info arr-button-mk">Submit</button></td>
-
 
43
        ##                </tr>
-
 
44
        ##            </table>
-
 
45
        ##        </div>
-
 
46
        ##        <div class="clearfix"></div>
-
 
47
        ##        <br>
-
 
48
        <div class="col-lg-12">
3
        <div class="col-lg-12">
49
            <table id="rbm-arr-table" class="table table-border table-condensed table-bordered" style="width:100%">
4
            <table id="rbm-arr-table" class="table table-border table-condensed table-bordered" style="width:100%">
50
                <thead>
5
                <thead>
51
                <tr>
6
                <tr>
52
                    <th>RBM</th>
7
                    <th>RBM</th>
Line 87... Line 42...
87
                                class="target-cell">$target.getTodayOtherMovingTarget()</span></td>
42
                                class="target-cell">$target.getTodayOtherMovingTarget()</span></td>
88
                        <td class="other-percent"></td>
43
                        <td class="other-percent"></td>
89
                    </tr>
44
                    </tr>
90
                    #end
45
                    #end
91
                </tbody>
46
                </tbody>
-
 
47
                <!-- Add a row for totals -->
92
                <tfoot>
48
                <tfoot>
93
                <tr>
49
                <tr>
94
                    <td><strong>Total</strong></td>
50
                    <td><strong>Total</strong></td>
95
                    <td><span id="total-achieved"></span> / <span id="total-target"></span></td>
51
                    <td><span id="total-achieved"></span> / <span id="total-target"></span></td>
96
                    <td class="total-percent"></td>
52
                    <td class="total-percent"></td>
Line 125... Line 81...
125
        let totalAchievedEol = 0, totalTargetEol = 0;
81
        let totalAchievedEol = 0, totalTargetEol = 0;
126
        let totalAchievedOther = 0, totalTargetOther = 0;
82
        let totalAchievedOther = 0, totalTargetOther = 0;
127
 
83
 
128
        rows.forEach(row => {
84
        rows.forEach(row => {
129
            const cells = row.querySelectorAll('td');
85
            const cells = row.querySelectorAll('td');
-
 
86
            cells.forEach((cell, index) => {
-
 
87
                const achievedSpan = cell.querySelector('.achieved-cell');
-
 
88
                const targetSpan = cell.querySelector('.target-cell');
-
 
89
                if (achievedSpan && targetSpan) {
-
 
90
                    const achievedValue = parseFloat(achievedSpan.textContent.replace(/[^\d.-]/g, ''));
-
 
91
                    const targetValue = parseFloat(targetSpan.textContent.replace(/[^\d.-]/g, ''));
-
 
92
 
-
 
93
                    // Add to totals
-
 
94
                    if (index === 1) {
-
 
95
                        totalAchieved += achievedValue || 0;
-
 
96
                        totalTarget += targetValue || 0;
-
 
97
                    } else if (index === 3) {
-
 
98
                        totalAchievedHid += achievedValue || 0;
-
 
99
                        totalTargetHid += targetValue || 0;
-
 
100
                    } else if (index === 5) {
-
 
101
                        totalAchievedRun += achievedValue || 0;
-
 
102
                        totalTargetRun += targetValue || 0;
-
 
103
                    } else if (index === 7) {
-
 
104
                        totalAchievedSlow += achievedValue || 0;
-
 
105
                        totalTargetSlow += targetValue || 0;
-
 
106
                    } else if (index === 9) {
-
 
107
                        totalAchievedEol += achievedValue || 0;
-
 
108
                        totalTargetEol += targetValue || 0;
-
 
109
                    } else if (index === 11) {
-
 
110
                        totalAchievedOther += achievedValue || 0;
-
 
111
                        totalTargetOther += targetValue || 0;
-
 
112
                    }
130
 
113
 
131
            cells.forEach(cell => {
-
 
132
                cells.forEach((cell, index) => {
114
                    // Format values in lakh
133
                    const achievedSpan = cell.querySelector('.achieved-cell');
-
 
134
                    const targetSpan = cell.querySelector('.target-cell');
-
 
135
                    if (achievedSpan && targetSpan) {
-
 
136
                        const achievedValue = parseFloat(achievedSpan.textContent.replace(/[^\d.-]/g, ''));
115
                    if (!isNaN(achievedValue)) achievedSpan.textContent = formatValueInLakh(achievedValue);
137
                        const targetValue = parseFloat(targetSpan.textContent.replace(/[^\d.-]/g, ''));
116
                    if (!isNaN(targetValue)) targetSpan.textContent = formatValueInLakh(targetValue);
138
 
117
 
139
                        // Add to totals
-
 
140
                        if (index === 1) {
-
 
141
                            totalAchieved += achievedValue || 0;
118
                    const percentCell = cell.nextElementSibling;
142
                            totalTarget += targetValue || 0;
119
                    if (percentCell && targetValue > 0) {
143
                        } else if (index === 3) {
-
 
144
                            totalAchievedHid += achievedValue || 0;
120
                        const percentage = ((achievedValue / targetValue) * 100).toFixed(1);
145
                            totalTargetHid += targetValue || 0;
121
                        percentCell.textContent = percentage + '%';
146
                        } else if (index === 5) {
-
 
-
 
122
 
147
                            totalAchievedRun += achievedValue || 0;
123
                        // Determine background color based on percentage
148
                            totalTargetRun += targetValue || 0;
124
                        let color;
149
                        } else if (index === 7) {
125
                        if (percentage <= 40) {
150
                            totalAchievedSlow += achievedValue || 0;
-
 
151
                            totalTargetSlow += targetValue || 0;
126
                            color = '#F56983FF'; // Orange for <= 40%
152
                        } else if (index === 9) {
127
                        } else if (percentage > 40 && percentage <= 75) {
153
                            totalAchievedEol += achievedValue || 0;
128
                            color = '#f2c947e8'; // Yellow for 41% - 75%
154
                            totalTargetEol += targetValue || 0;
-
 
155
                        } else if (index === 11) {
129
                        } else {
156
                            totalAchievedOther += achievedValue || 0;
-
 
157
                            totalTargetOther += targetValue || 0;
130
                            color = '#82ef8299'; // Green for > 75%
158
                        }
131
                        }
159
 
132
 
160
                        // Format values in lakh
-
 
161
                        if (!isNaN(achievedValue)) achievedSpan.textContent = formatValueInLakh(achievedValue);
-
 
162
                        if (!isNaN(targetValue)) targetSpan.textContent = formatValueInLakh(targetValue);
-
 
163
 
-
 
164
                        const percentCell = cell.nextElementSibling;
-
 
165
                        if (percentCell && targetValue > 0) {
-
 
166
                            const percentage = ((achievedValue / targetValue) * 100).toFixed(1);
-
 
167
                            percentCell.textContent = percentage + '%';
-
 
168
 
-
 
169
                            // Determine background color based on percentage
-
 
170
                            let color;
-
 
171
                            if (percentage <= 40) {
-
 
172
                                color = '#F56983FF'; // Orange for <= 40%
-
 
173
                            } else if (percentage > 40 && percentage <= 75) {
-
 
174
                                color = '#f2c947e8'; // Yellow for 41% - 75%
-
 
175
                            } else {
-
 
176
                                color = '#82ef8299'; // Green for > 75%
-
 
177
                            }
-
 
178
 
-
 
179
                            // Apply gradient background with the color
133
                        // Apply gradient background with the color
180
                            percentCell.style.background = `linear-gradient(to right, ${color} ${percentage}%, transparent ${percentage}%)`;
134
                        percentCell.style.background = `linear-gradient(to right, ${color} ${percentage}%, transparent ${percentage}%)`;
181
                        } else if (percentCell) {
135
                    } else if (percentCell) {
182
                            percentCell.textContent = 'N/A';
136
                        percentCell.textContent = 'N/A';
183
                            percentCell.style.background = 'none';
137
                        percentCell.style.background = 'none';
184
                        }
-
 
185
                    }
138
                    }
186
                });
139
                }
187
            });
140
            });
-
 
141
        });
188
 
142
 
189
            // Update total row with calculated totals
143
        // Update total row with calculated totals
190
            document.getElementById('total-achieved').textContent = formatValueInLakh(totalAchieved);
144
        document.getElementById('total-achieved').textContent = formatValueInLakh(totalAchieved);
191
            document.getElementById('total-target').textContent = formatValueInLakh(totalTarget);
145
        document.getElementById('total-target').textContent = formatValueInLakh(totalTarget);
192
            document.getElementById('total-achieved-hid').textContent = formatValueInLakh(totalAchievedHid);
146
        document.getElementById('total-achieved-hid').textContent = formatValueInLakh(totalAchievedHid);
193
            document.getElementById('total-target-hid').textContent = formatValueInLakh(totalTargetHid);
147
        document.getElementById('total-target-hid').textContent = formatValueInLakh(totalTargetHid);
194
            document.getElementById('total-achieved-run').textContent = formatValueInLakh(totalAchievedRun);
148
        document.getElementById('total-achieved-run').textContent = formatValueInLakh(totalAchievedRun);
195
            document.getElementById('total-target-run').textContent = formatValueInLakh(totalTargetRun);
149
        document.getElementById('total-target-run').textContent = formatValueInLakh(totalTargetRun);
196
            document.getElementById('total-achieved-slow').textContent = formatValueInLakh(totalAchievedSlow);
150
        document.getElementById('total-achieved-slow').textContent = formatValueInLakh(totalAchievedSlow);
197
            document.getElementById('total-target-slow').textContent = formatValueInLakh(totalTargetSlow);
151
        document.getElementById('total-target-slow').textContent = formatValueInLakh(totalTargetSlow);
198
            document.getElementById('total-achieved-eol').textContent = formatValueInLakh(totalAchievedEol);
152
        document.getElementById('total-achieved-eol').textContent = formatValueInLakh(totalAchievedEol);
199
            document.getElementById('total-target-eol').textContent = formatValueInLakh(totalTargetEol);
153
        document.getElementById('total-target-eol').textContent = formatValueInLakh(totalTargetEol);
200
            document.getElementById('total-achieved-other').textContent = formatValueInLakh(totalAchievedOther);
154
        document.getElementById('total-achieved-other').textContent = formatValueInLakh(totalAchievedOther);
201
            document.getElementById('total-target-other').textContent = formatValueInLakh(totalTargetOther);
155
        document.getElementById('total-target-other').textContent = formatValueInLakh(totalTargetOther);
202
        }
156
    }
203
 
157
 
204
        window.onload = formatTargets;
158
    window.onload = formatTargets;
205
</script>
159
</script>
206
 
-
 
207
 
-
 
208
 
-