@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')
<form method="POST" enctype="multipart/form-data" action="{{route('new.edit.new_booking')}}">
    @csrf
<div class="top-baar">
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <div class="Save"><button type="submit" class="btn btn-success" style="float: right;padding-right: 20px;padding-left: 20px;margin-right: 10px;">SAVE</button></div>
                <div class="Discard"><a href="{{ route('new.index') }}" class="btn btn-danger px-4 py-1" style="float: right;margin-right: 10px;">DISCARD</a></div>
            </div>
            </div> 
        </nav>   
</div>
<div class="d-none" id="">
    
</div>
<div class="card mt-1 mx-2" style="padding-left:20px;">
                <div class="col-2 ml-8 pl-8">
                    <div class="form-group row my-0 pt-5">
                        <label class="col-sm-2 form-label pt-1 text-left">Booking No. :</label>
                        <div class="col-sm-3 mb-3 mr-5">
                            <input autocomplete="off" type="text" name="booking_no" id="booking_no" class="form-control" value="{{$booking[0]->booking_id}}" required="" readonly="">
                            <input autocomplete="off" type="hidden" name="a_id" id="a_id" class="form-control" value="{{$id}}">
                        </div>
                        <div class="mx-3">  
                        </div>
                        <label class="col-sm-2 form-label pt-1 text-left">Check-in :</label>
                        <div class="col-sm-3 mb-3 mr-5">
                            <input autocomplete="off" type="text" name="checkin_date" id="checkin_date" class="form-control" value="{{$checkin}}" readonly>
                        </div>
                    </div>
                    <div class="form-group row my-0">
                        <label class="col-sm-2 form-label pt-1 text-left">Hotel* :</label>
                        <div class="col-sm-3 mb-3 mr-5">
                            <input autocomplete="off" type="text" name="hotel" id="hotel" class="form-control" value="{{$hotel_det[0]->name}}" required ="" readonly="">
                            
                        </div>
                        <div class="mx-3">  
                        </div>
                        <label class="col-sm-2 form-label pt-1 text-left">Check-out :</label>
                        <div class="col-sm-3 mb-3 mr-5">
                            <input autocomplete="off" type="text" name="checkout_date" id="checkout_date" class="form-control" value="{{$checkout}}" readonly>
                        </div>
                    </div>                    
                    <hr>                  
                    @php $previous_room = 0; @endphp
                    @foreach($bookingRoom as $key => $row)
                         @if($previous_room != $row->id)
                            <div class="col-12">
                                <div class="col-2">
                                    <label>Room: {{$row->name}} {{$row->room_type_name}}</label>
                                </div>
                                <div class="col-10">
                                    <input autocomplete="off" type="hidden" name="room_id[]" id="room_id" class="form-control" value="{{$row->id}}" required="" readonly="">
                                </div>
                            </div>
                            @php
                                $previous_room = $row->id;
                            @endphp
                         @endif
                         <table style="width: 25%;">
                            <tr>
                                <td style="width: 5%;">
                                    Name:
                                </td>
                                <td style="width: 20%;">
                                    <input type="text" name="first_name[]" class="form-control" value="{{$row->first_name}}">
                                    <input type="hidden" name="guest_id[]" class="form-control" value="{{$row->gid}}">
                                </td>
                            </tr>
                        </table>
                    @endforeach
                    <hr>
                </div>
            </div>
        </form>
@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 src="{{asset('assets/scripts/pages/booking/cancelled.js') }}" type="text/javascript"></script> 

@endsection