Subversion Repositories SmartDukaan

Rev

Rev 35971 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
27863 tejbeer 1 
<link href="https://cdn.datatables.net/fixedcolumns/3.3.0/css/fixedColumns.bootstrap.css" rel="stylesheet"/>
27851 tejbeer 2 
 
27763 tejbeer 3 
<section class="wrapper">
27775 tejbeer 4 
    <div class="row">
5 
        <div class="col-lg-12">
27780 tejbeer 6 
            <h3 class="page-header"><i class="icon_document_alt"></i>PARTNER ONBOARDING</h3>
27775 tejbeer 7 
            <ol class="breadcrumb">
8 
                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">Home</a></li>
27780 tejbeer 9 
                <li><i class="icon_document_alt"></i>Partner Onboarding</li>
27775 tejbeer 10 
            </ol>
11 
        </div>
12 
    </div>
35971 aman 13 
 
14 
    ## Filter, Search and New Button (Top)
15 
    <div class="col-lg-12" style="margin-bottom: 15px;">
16 
        <div class="row">
17 
            <div class="col-lg-3">
18 
                <label style="margin-right: 10px;"><strong>Filter:</strong></label>
19 
                <select id="holdFilterSelect" class="form-control" style="width: 150px; display: inline-block;">
20 
                    <option value="pending" #if($holdFilter == "pending") selected #end>Pending</option>
21 
                    <option value="hold" #if($holdFilter == "hold") selected #end>On Hold</option>
22 
                    <option value="all" #if($holdFilter == "all") selected #end>All</option>
23 
                </select>
24 
            </div>
25 
            <div class="col-lg-6">
26 
                <label style="margin-right: 10px;"><strong>Search:</strong></label>
27 
                <input type="text" id="onboardingSearch" class="form-control"
28 
                       style="width: 250px; display: inline-block;"
29 
                       placeholder="Outlet, Phone, Code, City..." value="$!search">
30 
                <button type="button" class="btn btn-primary" id="searchBtn" style="margin-left: 5px;">
31 
                    <i class="fa fa-search"></i> Search
32 
                </button>
33 
                #if($search && $search != "")
34 
                    <button type="button" class="btn btn-default" id="clearSearchBtn" style="margin-left: 5px;">
35 
                        Clear
36 
                    </button>
37 
                #end
38 
            </div>
39 
            <div class="col-lg-3 text-right">
40 
                <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"
41 
                        style="font-size:12px;">New
42 
                </button>
43 
            </div>
44 
        </div>
45 
    </div>
46 
 
47 
    ## New Onboarding Modal (must be outside hidden div for Bootstrap to work)
48 
    <div id="myModal" class="modal fade" role="dialog">
49 
        <div class="modal-dialog modal-lg">
50 
            <!-- Modal content-->
51 
            <div class="modal-content">
52 
                <div class="modal-header">
53 
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
54 
                    <h4 class="modal-title">NEW ONBOARDING</h4>
55 
                </div>
56 
                <div class="modal-body" style="height: 400px; width: 1050px;">
57 
                    <form>
58 
 
31371 tejbeer 59 
                        <div class="form-row">
35971 aman 60 
                            <div class="form-group col-md-6">
61 
                                <label for="leadId">Lead Id </label>
62 
                                <input type="text" class="form-control leadIdOnboarding" id="leadId"
63 
                                       placeholder="Lead Id">
31371 tejbeer 64 
                            </div>
35971 aman 65 
 
66 
                        </div>
67 
                        <div class="form-row">
68 
                            <div class="form-group col-md-6">
69 
                                <label for="outLetName1">OutLet Name</label>
70 
                                <input type="text" class="form-control" id="outLetName1"
71 
                                       placeholder="OutLet Name">
27775 tejbeer 72 
                            </div>
35971 aman 73 
                            <div class="form-group col-md-6">
74 
                                <label for="number1">Mobile Number</label>
75 
                                <input type="number" class="form-control" id="number1" placeholder="Mobile Number">
76 
                            </div>
77 
                            <div class="form-group col-md-6">
78 
                                <label for="acquireddate1">Acquired Date</label>
79 
                                <input type="date" class="form-control" id="acquireddate1" placeholder="Acquired Date">
80 
                            </div>
81 
                        </div>
82 
                        <div>
83 
                            <div class="form-group col-md-3 ">
84 
                                <select class="form-control input-sm" id="authUserOnboarding" name="authUser"
85 
                                        placeholder="AuthUser">
86 
                                    <option value="" disabled selected>AuthUser</option>
87 
                                    #foreach($authUser in $authUsers)
88 
                                        <option value="$authUser.getId()">$authUser.getName()</option>
89 
                                    #end
90 
                                </select>
91 
                            </div>
92 
                        </div>
32348 jai.hind 93 
 
35971 aman 94 
                        <div class="text-end form-group col-md-2" style="padding:22px;">
27775 tejbeer 95 
                            <button type="button" class="btn btn-primary" id="newmodal" data-dismiss="modal"
96 
                                    data-backdrop='static' data-keyboard='false'>submit
97 
                            </button>
35971 aman 98 
                        </div>
99 
                    </form>
27775 tejbeer 100 
                </div>
35971 aman 101 
                <div class="modal-footer">
102 
                    <button type="submit" class="btn btn-default" data-dismiss="modal">Close</button>
103 
                </div>
27775 tejbeer 104 
            </div>
105 
        </div>
106 
    </div>
107 
    <div class="col-lg-12">
108 
        <table class="table table-border table-condensed table-bordered" id="example" style="width:100%">
27763 tejbeer 109 
 
27848 tejbeer 110 
            <thead class="row htable" style="background:#F5F5F5;">
27775 tejbeer 111 
 
112 
            <tr style="color:black;">
113 
                <th>Id</th>
35971 aman 114 
                <th>Outlet Name(SM)</th>
27782 tejbeer 115 
                <th>Created On</th>
27780 tejbeer 116 
                <th>Acquired Date()</th>
35971 aman 117 
                <th class="hidden-col">Outlet Name(SM)</th>
28599 amit.gupta 118 
                <th>Phone Number(SM)</th>
31730 tejbeer 119 
                <th>Counter Potential</th>
35971 aman 120 
                <th>RBM Name(SM)</th>
27775 tejbeer 121 
                <th>City (SM)</th>
122 
                <th>State Head(SM)</th>
123 
                <th>BDM (SM)</th>
124 
                <th>Agreed Brand fees(SM)</th>
27780 tejbeer 125 
                <th>Received Brand fees(SM)</th>
35971 aman 126 
                <th>Final Brand fees(SM)</th>
27775 tejbeer 127 
                <th>Agreed Wallet(SM)</th>
35971 aman 128 
                <th class="hidden-col">Adv Stock Date(SM)</th>
129 
                <th class="hidden-col">KYC (legal)</th>
33891 tejus.loha 130 
                <th>Aadhaar Front(legal)</th>
131 
                <th>Aadhaar Back(legal)</th>
27780 tejbeer 132 
                <th>pan(legal)</th>
133 
                <th>GST(legal)</th>
134 
                <th>Cancel cheque(legal)</th>
135 
                <th>Rent agreement/Owner ship proof(legal)</th>
136 
                <th>LOI(legal)</th>
31431 amit.gupta 137 
                <th>Doc Compl</th>
27780 tejbeer 138 
                <th>Code(legal)</th>
35971 aman 139 
                <th class="hidden-col">Recee Planed(Kamini)</th>
140 
                <th class="hidden-col">Recee Actual(Kamini)</th>
141 
                <th class="hidden-col">Designing Planed(Kamini)</th>
27775 tejbeer 142 
                <th>Designing Actual(Kamini)</th>
36064 aman 143 
                <th class="hidden-col">Stock payment(kamini)</th>
35971 aman 144 
                <th class="hidden-col">Expected Date(kamini)</th>
36064 aman 145 
                <th class="hidden-col">Pay Date(Kamini)</th>
33845 tejus.loha 146 
                <th>Inaugration(SW)</th>
36064 aman 147 
                <th class="hidden-col">Billing Status(Kamini)</th>
28901 manish 148 
                <th>Verification</th>
27775 tejbeer 149 
                <th>Submit</th>
27780 tejbeer 150 
                <th>OutLet Open</th>
27799 tejbeer 151 
                <th>OutLet Reject</th>
31431 amit.gupta 152 
                <th>OutLet Hold</th>
153 
                <th>Notice Issue</th>
154 
                <th>Resend Veri</th>
155 
            </tr>
27775 tejbeer 156 
            </thead>
157 
            <tbody>
158 
                #foreach($pob in $partnerOnBoardingPanel )
28901 manish 159 
                #if($pob.getHoldTimestamp())
160 
                <tr  class="hold-onboarding">
161 
                   #parse("partner-onboarding-row-index.vm")
162 
 
163 
                </tr>
164 
                #else
28049 amit.gupta 165 
                <tr>
27844 tejbeer 166 
                   #parse("partner-onboarding-row-index.vm")
27775 tejbeer 167 
 
168 
                </tr>
169 
                #end
28901 manish 170 
                #end
27775 tejbeer 171 
 
172 
            </tbody>
173 
 
174 
        </table>
175 
    </div>
35971 aman 176 
 
177 
    ## Pagination Controls (Bottom)
178 
    <div class="col-lg-12" style="margin-top: 15px;">
179 
        <div class="row">
180 
            <div class="col-lg-12 text-center">
181 
                #if($totalRecords > 0)
182 
                    <span class="pagination-info">Showing $startRecord - $endRecord of $totalRecords</span>
183 
                    <ul class="pagination pagination-sm" style="margin: 0 15px; display: inline-flex;">
184 
                        #if($currentPage > 0)
185 
                            <li><a href="javascript:void(0)" class="onboarding-page-link" data-page="0">First</a></li>
186 
                            <li><a href="javascript:void(0)" class="onboarding-page-link" data-page="$prevPage">Prev</a>
187 
                            </li>
188 
                        #else
189 
                            <li class="disabled"><span>First</span></li>
190 
                            <li class="disabled"><span>Prev</span></li>
191 
                        #end
192 
 
193 
                        <li class="active"><span>Page $currentPageDisplay of $totalPages</span></li>
194 
 
195 
                        #if($currentPage < $lastPage)
196 
                            <li><a href="javascript:void(0)" class="onboarding-page-link" data-page="$nextPage">Next</a>
197 
                            </li>
198 
                            <li><a href="javascript:void(0)" class="onboarding-page-link" data-page="$lastPage">Last</a>
199 
                            </li>
200 
                        #else
201 
                            <li class="disabled"><span>Next</span></li>
202 
                            <li class="disabled"><span>Last</span></li>
203 
                        #end
204 
                    </ul>
205 
                    <select class="form-control onboarding-page-size" style="width: 120px; display: inline-block;">
206 
                        <option value="10" #if($pageSize==10)selected#end>10 per page</option>
207 
                        <option value="25" #if($pageSize==25)selected#end>25 per page</option>
208 
                        <option value="50" #if($pageSize==50)selected#end>50 per page</option>
209 
                        <option value="100" #if($pageSize==100)selected#end>100 per page</option>
210 
                    </select>
211 
                #end
212 
            </div>
213 
        </div>
214 
    </div>
27763 tejbeer 215 
</section>
216 
 
217 
 
218 
<script type="text/javascript">
219 
 
27775 tejbeer 220 
    $(document).ready(function () {
35971 aman 221 
 
222 
        // Hold filter change handler - reload via AJAX
223 
        $('#holdFilterSelect').on('change', function () {
224 
            refreshOnboardingList(0);
225 
        });
226 
 
227 
        // Search button click handler
228 
        $('#searchBtn').on('click', function () {
229 
            refreshOnboardingList(0);
230 
        });
231 
 
232 
        // Search on Enter key
233 
        $('#onboardingSearch').on('keypress', function (e) {
234 
            if (e.which === 13) {
235 
                refreshOnboardingList(0);
236 
            }
237 
        });
238 
 
239 
        // Clear search button
240 
        $('#clearSearchBtn').on('click', function () {
241 
            $('#onboardingSearch').val('');
242 
            refreshOnboardingList(0);
243 
        });
244 
 
245 
        // Pagination link click handler
246 
        $(document).on('click', '.onboarding-page-link', function (e) {
247 
            e.preventDefault();
248 
            refreshOnboardingList($(this).data('page'));
249 
        });
250 
 
251 
        // Page size change handler
252 
        $(document).on('change', '.onboarding-page-size', function () {
253 
            refreshOnboardingList(0);  // Reset to first page on size change
254 
        });
255 
 
256 
        // Destroy existing DataTable if it exists (prevents reinitialization error on AJAX reload)
257 
        if ($.fn.DataTable.isDataTable('#example')) {
258 
            $('#example').DataTable().destroy();
259 
        }
260 
 
27828 tejbeer 261 
      var dtable = $('#example').DataTable({
262 
             "scrollX": true,
27863 tejbeer 263 
            "scrollY": "518px",
27884 tejbeer 264 
            scrollCollapse: true,
35971 aman 265 
          "fixedHeader": true,
266 
          "order": [[0, "desc"]],
267 
          "paging": false,  // Disable client-side pagination (server-side)
268 
          "info": false,    // Hide DataTables info (we show our own)
269 
          fixedColumns: {
270 
              leftColumns: 2
271 
          },
33927 tejus.loha 272 
 
273 
          "columnDefs": [
27837 tejbeer 274 
                   { "targets": 1, "orderDataType":  "date-dd-mmm-yyyy", "type":"string" },
27817 tejbeer 275 
                   { "targets": 2, "orderDataType":  "date-dd-mmm-yyyy", "type":"string" },
27884 tejbeer 276 
                   { "targets": 3, "orderDataType": "date-dd-mmm-yyyy", "type": "string" },
35971 aman 277 
              {"targets": 5, "orderDataType": "dom-text-numeric", "type": "number"},
28933 manish 278 
                   { "targets": 6, "orderDataType": "dom-text", "type": "string" },
35971 aman 279 
              {"targets": 7, "orderDataType": "dom-text", "type": "string"},
280 
              {"targets": 8, "orderDataType": "dom-text", "type": "string"},
281 
              {"targets": 9, "orderDataType": "dom-text", "type": "string"},
28933 manish 282 
                   { "targets": 10, "orderDataType": "dom-text-numeric", "type":"number"},
35971 aman 283 
              {"targets": 11, "orderDataType": "dom-text-numeric", "type": "number"},
28933 manish 284 
                   { "targets": 12, "orderDataType": "date-dd-mmm-yyyy", "type": "string" },
35971 aman 285 
              {"targets": 13, "orderDataType": "dom-text-numeric", "type": "number"},
28933 manish 286 
                   { "targets": 14, "orderDataType": "date-dd-mmm-yyyy", "type": "string" },
35971 aman 287 
              {"targets": 22, "orderDataType": "dom-text", "type": "string"},
29139 manish 288 
                   { "targets": 23, "orderDataType": "dom-text", "type": "string" },
35971 aman 289 
              {"targets": 29, "orderDataType": "date-dd-mmm-yyyy", "type": "string"},
290 
              {"targets": 30, "orderDataType": "date-dd-mmm-yyyy", "type": "string"},
291 
              {"targets": 33, "orderDataType": "dom-text", "type": "string"},
292 
              ## Column hiding is done via CSS class="hidden-col" on <th>/<td> elements.
293 
              ## Do NOT use DataTables visible:false — it removes TDs from DOM,
294 
              ## which breaks td:eq(N) selectors in panel-listing.js double-click and submit handlers.
36064 aman 295 
              {"targets": [4, 15, 16, 26, 27, 28, 30, 31, 32, 34], "className": "hidden-col"}
35971 aman 296 
          ],
33927 tejus.loha 297 
 
35971 aman 298 
      });
33927 tejus.loha 299 
 
35971 aman 300 
        $('#authUserOnboarding').multiselect({
301 
            includeSelectAllOption: true,
302 
            multiple: true,
303 
            maxHeight: 200,
304 
            buttonWidth: '180px',
305 
            numberDisplayed: 1,
306 
            nonSelectedText: 'AuthUsers',
307 
            nSelectedText: ' - AuthUser Selected',
308 
            allSelectedText: 'All AuthUser Selected',
309 
            enableFiltering: true,
310 
            enableCaseInsensitiveFiltering: true
311 
        });
33927 tejus.loha 312 
 
35971 aman 313 
    });
33927 tejus.loha 314 
 
35971 aman 315 
    // Function to refresh onboarding list via AJAX
316 
    function refreshOnboardingList(page) {
317 
        var holdFilter = $('#holdFilterSelect').val() || 'pending';
318 
        var pageSize = $('.onboarding-page-size').val() || '25';
319 
        var search = $('#onboardingSearch').val() || '';
33927 tejus.loha 320 
 
35971 aman 321 
        var url = context + '/partnerOnBoardingPanel?holdFilter=' + encodeURIComponent(holdFilter)
322 
                + '&page=' + (page || 0)
323 
                + '&pageSize=' + pageSize
324 
                + '&search=' + encodeURIComponent(search);
33927 tejus.loha 325 
 
35971 aman 326 
        $.ajax({
327 
            url: url,
328 
            type: 'GET',
329 
            success: function (response) {
330 
                $('#main-content').html(response);
331 
            }
332 
        });
333 
    }
28862 manish 334 
 
335 
 
336 
 
337 
 
338 
 
27820 tejbeer 339 
</script>
27851 tejbeer 340 
 
341 
 
27820 tejbeer 342 
<style>
35971 aman 343 
    .hold-onboarding td {
344 
        background-color: crimson !important;
345 
    }
28901 manish 346 
 
35971 aman 347 
    /* Hide columns */
348 
    .hidden-col {
349 
        display: none !important;
350 
    }
28901 manish 351 
 
35971 aman 352 
    td.hidden-col {
353 
        display: none !important;
28901 manish 354 
}
355 
 
35971 aman 356 
    /* Pagination styling */
357 
    .pagination-info {
358 
        margin-right: 15px;
359 
        font-weight: bold;
360 
    }
28901 manish 361 
 
35971 aman 362 
    .pagination {
363 
        margin: 0;
364 
    }
31359 tejbeer 365 
 
35971 aman 366 
    .pagination li {
367 
        display: inline-block;
368 
        margin: 0 2px;
369 
    }
370 
 
371 
    .pagination li a, .pagination li span {
372 
        padding: 5px 10px;
373 
        border: 1px solid #ddd;
374 
        text-decoration: none;
375 
        color: #333;
376 
    }
377 
 
378 
    .pagination li.active span {
379 
        background-color: #337ab7;
380 
        color: white;
381 
        border-color: #337ab7;
382 
    }
383 
 
384 
    .pagination li.disabled span {
385 
        color: #999;
386 
        cursor: not-allowed;
387 
    }
27820 tejbeer 388 
</style>