@extends('layouts.layout')

@section('content')


<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        {{ ucwords(str_replace('_', ' ', $url)) }}
        <small>Version 2.0</small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> SysManager</a></li>
        <li class="active">{{ ucwords(str_replace('_', ' ', $url)) }}</li>
    </ol>
</section>

<!-- ADD FORM -->

<!-- Main content -->
<section class="content">
    <div class="row">


        <!-- left column -->
        <div class="col-md-12">
            <!-- general form elements -->
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">{{ ucwords(str_replace('_', ' ', $url)) }}</h3>
                </div>
                <!-- /.box-header -->
                <!-- form start -->

                                 
                <form id="reservationNew" name="reservationNew" class="reservationNew"  action="" method="POST" role="form" enctype="multipart/form-data" onsubmit="return false;">

                    <div class="box-body">
                        
                        <div class="col-sm-12">
                            
                            <h5> </h5>

                            <div class="nav-tabs-custom">
                                <ul class="nav nav-tabs">
                                    <li><a href="#tab_1" data-toggle="tab">Details</a></li>
                                    <li class="active"><a href="#tab_2" data-toggle="tab">Trips </a></li>
                                    <li><a href="#tab_3" data-toggle="tab">History</a></li>
                                </ul>
                            </div>


                           
                            <div class="tab-content">

                                <div class="tab-pane" id="tab_1">

                                    <div class="">
                                        <!-- /.box-header -->
                                        <div class="box-body pad">

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Date</label>
                                                    <input value="" type="text" class="form-control datepicker" id="datepicker" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Client Name</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Office</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Client Type</label>
                                                     <select class="form-control" id="client_type" name="client_type">
                                                        <option value=""></option>
                                                    </select>
                                                   
                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Credit Type</label>
                                                    <select class="form-control" id="credit_type" name="credit_type">
                                                        <option value=""></option>
                                                    </select>
                                                    
                                                </div>
                                            </div>




                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Contact Name</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Email</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Phone</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Comment</label>
                                                    <textarea class="form-control"></textarea>

                                                </div>
                                            </div>

                                            <div class="col-sm-3">
                                                <div class="form-group">
                                                    <label for="exampleInputEmail1">Status</label>
                                                    <input value="" type="text" class="form-control" id="office" name="office" placeholder="">

                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    
                                    
                                              <!-- /.box-body -->
                            <div class="box-footer">
                                <input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
                                <button  type="submit" id="save_reservation" class="btn btn-primary">UPDATE</button>

                            </div>
                                    <!-- /.box -->
                                </div>



                                <!--///////////////////////////////////////// BEGINNING OF TAB 2 ///////////////////////////////////////////// -->
                                <!-- /.tab-pane -->
                                <div class="tab-pane active first_tab tab_second" id="tab_2">

                                    <div class="col-sm-12">
                                        <h6>Added Trips</h6>

                                        <div class="added_main_trips">
                                            <table class="table table-secondary table-responsive table-condensed table-hover table-bordered">
                                                <tr>
                                                    <th>ID</th>
                                                    <th>Passenger Name</th>
                                                    <th>Pickup Date</th>
                                                    <th>End Date</th>
                                                    <th>Departure</th>
                                                    <th>Destination</th>
                                                    <th>Vehicle Type</th>
                                                    <th>Service Type</th>
                                                    <th>Total Amount</th>
                                                    <th>Resources</th>
                                                    <!--<th>Driver</th>-->
                                                    <th style="width:80px">Action</th>
                                                </tr>

                                                                                                 <tr><td colspan='9'>Total Amount : 0.00</td></tr>

                                            </table>
                                        </div>
                                    </div>

                                </div>


                                <!--///////////////////////////////////////// BEGINNING OF TAB 2 ///////////////////////////////////////////// -->
                                <!-- /.tab-pane -->
                                <div class="tab-pane first_tab" id="tab_3">

                                    <div class="col-sm-12">&nbsp;</div>

                                </div>



                                <!--///////////////////////////////////////// ADDITIONAL SERVICE ///////////////////////////////////////////// -->
                                <!-- /.tab-pane -->


                            </div>

                           
                            </form>
                        </div>
                        <!-- /.box -->



                    </div>




            </div>
            </section>


            <script src="{{ URL::asset('js/global.js') }}"></script>
            <script src="{{ URL::asset('js/confirm.js') }}"></script>


            @endsection