@extends('layouts.admin')
@section('header_style')
    <link href="{{asset('assets/plugins/datatables/datatables.min.css')}}" rel="stylesheet" type="text/css"/>
    <link href="{{asset('assets/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css')}}" rel="stylesheet"      type="text/css"/>
    <link href="{{asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css')}}" rel="stylesheet"      type="text/css"/>
    <style type="text/css">
        td { 
            font-size: 14px !important; 
        }
    </style>
@endsection
@section('content')   
<div class="" style="min-height: 75vh; max-height: 75vh; height: 75vh; overflow: auto;">  
<div class="top-baar">
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="nav nav-tabs">
                <li class="nav-item {{ Request::is('*hotel/hotels/active*') ? '' : '' }}" >
                    <a class="nav-link" href="{{ route('active.index') }}"><font style="font-size:15px;"><b>Active</b></font></a>
                </li>                 
                <li class="nav-item {{ Request::is('*hotel/hotels/approval*') ? '' : '' }}">
                    <a class="nav-link" href="{{ route('approval.index') }}"><font style="font-size:15px;"><b>Approval</b></font></a>
                </li>               
                <li class="nav-item {{ Request::is('*hotel/hotels/inactive*') ? '' : '' }}">
                    <a class="nav-link" href="{{ route('inactive.index') }}"><font style="font-size:15px;"><b>Inactive</b></font></a>
                </li>
                <li class="nav-item {{ Request::is('*hotel/hotels/dida_hotel*') ? 'active' : '' }}" style="background-color: #67AAB3;">
                    <a class="nav-link active" style="background-color: #A0C6CF;" href="{{ route('dida_hotel.index') }}"><font style="font-size:15px;"><b>Dida Hotel</b></font></a>
                </li>
                <!-- <li class="nav-item {{ Request::is('*hotel/hotels/promotions*') ? '' : '' }}">
                    <a class="nav-link" href="{{ route('promotions.index') }}"><font style="font-size:15px;"><b>Promotions</b></font></a>
                </li> -->
                @if(Session::get('HOTEL_ADD') == '1')
                {{-- <div class="Add {{ Request::is('*add_hotel/hotel_details*') ? 'active' : '' }}"><a href="{{ route('add_hotel.add.hotel_details') }}" class="btn btn-primary " style="float: right;">ADD</a></div> --}}
                {{-- <div class="Add {{ Request::is('*add_hotel/hotel_details*') ? 'active' : '' }}">
                    <button type="button" class="btn btn-primary " style="float: right;" onclick="updateScript()">Update</button>
                </div> --}}
                
                @endif
            </ul>
           
        </nav>   
</div>
<div class="page-content-body-wrapper no-padding">
    <div class="page-content-body no-padding"> 
        <div class="portlet light">
            <div class="portlet-body no-padding"> 
                <div class="tabbable-custom tabbable-parallel"> 
                    <div class ="tab-content no-padding"> 
                    <div class="tab-pane active" id="active"> 
                        <div class="table-container"> 
                            <table class="table table-striped table-hover" id ="datatable-hotel-dida_hotel" data-url="{{ route('getDidaHotel') }}"> 
                                <thead> 
                                    <tr role="row" class="heading"> 
                                        <th style="text-align:center;" class="text-center"><b> No</b></th> 
                                        <th style="text-align:center;" class="text-center"><b> Hotel</b></th> 
                                        <th style="text-align:center;" class="text-center"><b> City</b></th> 
                                        <th style="text-align:center;"class="text-center"><b> Country</b></th>
                                        <th style="text-align:center;"class="text-center"><b> Supplied by</b></th>
                                        <th style="text-align:center;" class="text-center"><b>Action</b></th> 
                                    </tr> 
                                    <tr role="row" class="filter"> 
                                        <td></td>  
                                        <td> 
                                            <input type="text" class="form-control form-filter filter-search input-sm filter-name text-center" name="name" placeholder="Hotel"> 
                                        </td> 
                                        <td> 
                                            <input type="text" class="form-control form-filter filter-search input-sm filter-city text-center" name="city" placeholder="City"> 
                                        </td> 
                                        <td> 
                                            <input type="text" class="form-control form-filter filter-search input-sm filter-country text-center" name="country" placeholder="Country"> 
                                        </td>                                    
                                        <td> 
                                            <input type="text" class="form-control form-filter filter-search input-sm filter-supplied text-center" name="supplied" placeholder="Supplied"> 
                                        </td>                                    
                                        <td class="text-center"> 
                                        </td>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody> 
                                <p id="lastUpdated" style="float:right; margin-right:10px;">Last Updated: {{ $lastUpdatedDate }}</p>       
                            </table>
                        </div>
                    </div> 
                </div>
            </div>
        </div> 
    </div> 
</div> 
</div> 
</div>
@endsection
@section('footer_script')
    <script src="{{asset('assets/scripts/datatable.js' )}}" type="text/javascript"></script>
    <script src="{{asset('assets/plugins/datatables/datatables.min.js' )}}" type="text/javascript"></script>
    <script src="{{asset('assets/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js' )}}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/jquery-validation/js/jquery.validate.min.js') }}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/jquery-validation/js/additional-methods.min.js') }}"
            type="text/javascript"></script>
    <script src="{{asset('assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js' )}}"
            type="text/javascript"></script>
    <script>
        jQuery(document).ready(function () {
              new Datatable().init({
                    src: $("#datatable-hotel-dida_hotel"),
                    loadingMessage: 'Loading...',
                    dataTable: {
                    "processing": true,
                    "serverside": true,
                    "dom": "t<'row'<'col-sm-12 pull-right'p>>",
                    "pageLength": 10,
                    "ajax": ({
                        "url": $("#datatable-hotel-dida_hotel").data('url'),
                        "data": {
                        "hotel_type": 'active'
                        }
                    }),
                    "bStateSave": false,
                    "order": [],
                    columns: [
                        {
                        name: 'id', orderable: false,
                        render: function (data, type, full, meta) {
                            return meta.settings._iDisplayStart + meta.row + 1;
                        }
                        },
                        { data: 'name', name: 'name', orderable: false },
                        { data: 'city', name: 'city', orderable: false },
                        { data: 'country', name: 'country', orderable: false },
                        { data: 'supplied', name: 'supplied', orderable: false },
                        { data: 'action', name: 'action', orderable: false, searchable: false }
                    ],
                    columnDefs: [
                        {
                        targets: '_all',
                        defaultContent: '-'
                        }
                    ],
                    "pagingType": "bootstrap_full_number",
                    }
                });

                $('.filter-name').keyup(function () {
                    var table = $("#datatable-hotel-dida_hotel").DataTable();
                    table.column(1)
                    .search($(this).val())
                    .draw();

                });
                $('.filter-city').keyup(function () {
                    var table = $("#datatable-hotel-dida_hotel").DataTable();
                    table.column(2)
                    .search($(this).val())
                    .draw();

                });
                $('.filter-country').keyup(function () {
                    var table = $("#datatable-hotel-dida_hotel").DataTable();
                    table.column(3)
                    .search($(this).val())
                    .draw();

                });

        });
    </script> 
@endsection