@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>  > <a href="{{ route('invoice.index', ['id' => $id, 'iurl' => $iurl]) }}"></a> </h5>

                            <div class="nav-tabs-custom">
                                <ul class="nav nav-tabs">
                                    <li class="active"><a href="#tab_1" data-toggle="tab">Details</a></li>
                                    <li><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 active" 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 disabled 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 disabled 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 disabled 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>
                                                    <input disabled 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">Credit Type</label>
                                                    <input disabled 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">Contact Name</label>
                                                    <input disabled 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 disabled 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 disabled 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" disabled></textarea>

                                                </div>
                                            </div>

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

                                                </div>
                                            </div>


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



                                <!--///////////////////////////////////////// BEGINNING OF TAB 2 ///////////////////////////////////////////// -->
                                <!-- /.tab-pane -->
                                <div class="tab-pane 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>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>
                                                </tr>