<!-- Search Modal -->
<div class="search-project selmodal-client-hub selmodal col-lg-7 col-sm-12 pt-4" id="SELECT_MODAL_RECORD_CLIENT_SCHED"  style="display: none; ">

    <div class="selmodal__body--limiter">
        <!-- Search Options -->
        <!-- ================================================================================= -->
        <div class="container-fluid row cf-desktop cf-mob">
            <!--
            <div class="col-md-4" style="display: none;">
                <div class="input-group mb-3" style="background-color: #ffffff;">
                    <select class="BSSP_SEARCH_REC_CL_SC_REC_SCHED_ID_CMB" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_CL_SC_REC_SCHED_ID_CMB" data-live-search="true" data-live-search-style="startsWith" data-style="btn-outline-secondary"></select>
                </div>
            </div>      
            -->
            
            <!--
            <div class="col-md-4" style="display: none;">
                <div class="input-group mb-3" style="background-color: #ffffff;">
                    <select class="BSSP_SEARCH_REC_CL_SC_REC_CLIENT_ID_CMB" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_CL_SC_REC_CLIENT_ID_CMB" data-live-search="true" data-live-search-style="startsWith" data-style="btn-outline-secondary"></select>
                </div>
            </div>      
            -->
            <!--
            <div class="col-md-4">
                Order
            </div>  
            <div class="col-md-4">
                <div class="input-group mb-3">
                    <input type="number" class="form-control" placeholder="Order : From" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_CL_SC_ORDER_FROM_TXT" />
                </div>
            </div>  
            <div class="col-md-4">
                <div class="input-group mb-3">
                    <input type="number" class="form-control" placeholder="Order : To" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_CL_SC_ORDER_TO_TXT" />
                </div>
            </div>  
            -->
            <!--                        
            <div class="col-md-3">
                <div class="input-group mb-3">
                    <select class="form-control" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_CL_SC_STATUS_CMB">
                        <option value="1">Inactive</option>
                        <option value="2" selected>Active</option>
                        <option value="3" disabled style="display:none">Closed</option>
                        <option value="4" disabled style="display:none">Completed</option>
                    </select>
                </div>
            </div>
            -->
        </div>
        
        <div class="container-fluid row mb-2">  
        <!--
            <div class="col-md-3">
                <div class="input-group mb-3">
                    <select class="form-control" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_ORDER_BY_CMB">                 
                        <option value="REC_CL_SC_ID_ASC">Order by : ID &darr;A-Z</option>
                        <option value="REC_CL_SC_ID">Order by : ID &uarr;Z-A</option>
                        <option value="REC_CL_SC_ORDER_ASC" selected>Order by : Order &darr;A-Z</option>
                        <option value="REC_CL_SC_ORDER">Order by : Order &uarr;Z-A</option>
                    </select>
                </div>
            </div>
        -->                         
            <div class="col-md-3" style="display: none;">
                <div class="input-group mb-3">
                    <select class="form-control" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_LIMIT_CMB">    
                        <option value="25">Show : 25 rows</option>
                        <option value="50">Show : 50 rows</option>
                        <option value="100" selected>Show : 100 rows</option>
                        <option value="500">Show : 500 rows</option>
                        <option value="1000">Show : 1,000 rows</option>
                    </select>
                </div>
            </div>  
                    
            
        </div>
        
        <div class="col-md-4">
                <div class="input-group mb-" style="background-color: #ffffff;display:none">
                    <select class="form-control col-md-12" id="SEARCH_REC_CLIENT_SCHED" data-live-search="true" data-live-search-style="startsWith" data-style="btn-outline-secondary"></select>
                </div>
        </div>  
            <!-- <div class="col-md-12">
                <div class="input-group mb-6" style="background-color: #ffffff;">
                    <select class="form-control col-md-12" id="SEARCH_REC_CLIENT_DAY" data-live-search="true" data-live-search-style="startsWith" data-style="btn-outline-secondary">
                        <option value="1">Monday</option>
                        <option value="2">Tuesday</option>
                        <option value="3">Wednesday</option>
                        <option value="4">Thursday</option>
                        <option value="5">Friday</option>
                        <option value="6">Saturday</option>
                        <option value="7">Sunday</option>
                    </select>
                </div>
            </div>
            <div class="col-md-12 search-btn" style="text-align: right;">
                <button class="btn btn-primary btn-block" type="button" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_CMD" title="Search"><i class="fas fa-search"></i> Search</button>
            </div>
    -->
        <div class="input-group day-select-mob">
            <div class="input-group mb-3">
                    <input type="text" class="form-control" placeholder="Name" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_REC_ACCOUNT_FNAME_TXT" />
            </div>
            <select class="custom-select mb-3" id="SEARCH_REC_CLIENT_DAY" data-live-search="true" data-live-search-style="startsWith" data-style="btn-outline-secondary">
                <option value="1">Monday</option>
                    <option value="2">Tuesday</option>
                    <option value="3">Wednesday</option>
                    <option value="4">Thursday</option>
                    <option value="5">Friday</option>
                    <option value="6">Saturday</option>
                    <option value="7">Sunday</option>
            </select>
            <div class="input-group mb-3">
                <button class="btn btn__primary--cus btn-block" type="button" id="SELECT_MODAL_RECORD_CLIENT_SCHED_SEARCH_CMD" title="Search"><i class="fas fa-search"></i> Search</button>
            </div>
        </div>

        <!-- Selection DataGridView -->
        <!-- ================================================================================= -->
        <div class="table-responsive table-fixed" >  
            <table class="table table-sm table-fit table-exp table-header-fixed " id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV"> 
                <thead class="bg_primary--cus text-white">
                    <tr style="cursor: pointer;"  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER">
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_ROW_IS_SELECTED"style="cursor: pointer;">Select</th>
                        <th id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_ROW_COUNT" style="cursor: pointer;display:none;">#</th>

                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_SC_ID" style="display: none;">ID</th>
                        <th id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_SC_ORDER" style="cursor: pointer;" >Order</th>
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_DAY" style="cursor: pointer;">Day</th>  
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_CLIENT_STORE_NAME" style="cursor: pointer;">Store Name</th>  
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_CUS_BALANCE" style="cursor: pointer;">Balance</th>
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_CLIENT" style="cursor: pointer;">Name</th>  
                          
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CLIENT_ADDRESS" style="cursor: pointer;">Address</th>
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CLIENT_CONTACT" style="cursor: pointer;">Contact</th>  
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_SC_REC_SCHED_ID" style="display: none;">Schedule</th>
                        <th  id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_SC_REC_CLIENT_ID" style="display: none;">Customer</th>
                                            
                        <th id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_HEADER_REC_CL_SC_STATUS" style="display: none;">Status</th>
                    </tr>
                </thead>
            
                <tbody class="hover-effect">
                    <tr style="cursor: pointer;" id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW">
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_ROW_IS_SELECTED"><input type='radio' name='SELECT_MODAL__RADIO'></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_ROW_COUNT" style="display:none;"></td>
                        
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_SC_ID" style="display: none;">ID</td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_SC_ORDER" style="cursor: pointer;">Order</td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_DAY" style="cursor: pointer;"></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_CLIENT_STORE_NAME" style="cursor: pointer;"></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_CUS_BALANCE" style="cursor: pointer;"></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_CLIENT" style="cursor: pointer;"></td>
                        
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CLIENT_ADDRESS" style="cursor: pointer;"></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CLIENT_CONTACT" style="cursor: pointer;"></td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_SC_REC_SCHED_ID" style="display: none;">Schedule</td>
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_SC_REC_CLIENT_ID" style="display: none;">Customer</td>
                                            
                        <td id="SELECT_MODAL_RECORD_CLIENT_SCHED_DGV_ROW_REC_CL_SC_STATUS" style="display: none;">Status</td>
                    </tr>
                </tbody>
            </table>
        </div>  
        <div class="container-fluid row pagination-input d-none">   
            <button class="btn btn-lg btn__primary--cus sm-prev-btn" id="SELECT_MODAL_RECORD_CLIENT_SCHED_LOAD_PREV_BBI"><i class="fas fa-chevron-left"></i></button>
            <select class="form-control col-md-2 sm-select-hub" id="SELECT_MODAL_RECORD_CLIENT_SCHED_LOAD_PAGING_CMB"></select>
            <button class="btn btn-lg btn-primary sm-next-btn" id="SELECT_MODAL_RECORD_CLIENT_SCHED_LOAD_NEXT_BBI"><i class="fas fa-chevron-right"></i></button>    
        </div>
    </div>
    <!-- Action Buttons -->
    <!-- ================================================================================= -->
    <div class="modal-footer justify-content-between">   
        <button class="btn btn-secondary" type="button" id="SELECT_MODAL_RECORD_CLIENT_SCHED_CANCEL_CMD" title="Cancel">Cancel</button>
        <button class="btn btn-primary" type="button" id="SELECT_MODAL_RECORD_CLIENT_SCHED_APPLY_CMD" title="OK">Okay</button>
    </div>
5
</div>
<script type="text/javascript" src="<!--[#SITE_URL;]-->/res/import/record/clientschedule/selmodal_hub.js?x=5"></script>
<script type="text/javascript" src="<!--[#SITE_URL;]-->/res/comm/record/cusschedule.js?x=2"></script>
<script type="text/javascript" src="<!--[#SITE_URL;]-->/res/comm/record/pos_sale.js"></script>