@extends('backend.layouts.app')

@section('title', app_name() . ' | Flight Schedule Management')

@section('breadcrumb-links')
    
@endsection
@section('after-styles')
{{Html::style('css/bootstrap-datepicker.min.css')}}
@endsection
@section('content')
<div class="box box-success">
        <div class="box-header with-border">
            <h3 class="box-title">Flight Schedule Management <small class="text-muted">Active Schedules</small></h3>
    
            <div class="box-tools pull-right">
                    <a href="{{ route('admin.schedule.create') }}" class="btn btn-success ml-1" data-toggle="tooltip" title="Create">Add Schedule</a>
                    <a href="{{ route('admin.schedule.deleted') }}" class="btn btn-danger ml-1" data-toggle="tooltip" title="View Deleted Schedules">View Trash</a>
            </div><!--box-tools pull-right-->
        </div><!-- /.box-header -->
    
        <div class="box-body">
            
<div class="row">
        <div class="col-lg-12">
            <form>
                <label>Flight Date</label>
                    <input type="text" name="date" placeholder="yyyy-mm-dd" class="datepicker"  data-date-format="yyyy-mm-dd" autocomplete="off">
                <label>Flight Type</label>
                <select name="type">
                        <option value="both">Both</option>
                        <option value="arrival">Arrival</option>
                        <option value="departure">Departure</option>
                </select>
                <button type="submit" class="btn-sm btn-primary btn">Filter</button>
            </form>
        </div>
    </div>
    <div class="row">

        <div class="col-lg-12">
            <div class="table-responsive">
                <table class="table">
                    <thead>
                    <tr>
                        <th>Flight Date</th>
                        <th>STA/STD</th>
                        <th>Flight Number</th>
                        <th>Airline</th>
                        <th>Origin/Destination</th>
                        <th>Flight Type</th>
                        <th>ETA/ETD</th>
                        <th>Flight Status</th>
                        <th>Display</th>
                        <th>@lang('labels.general.actions')</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($schedules as $schedule)
                        <tr>
                            <td>{{ $schedule->flight_date }}</td>
                            <td>{{ $schedule->sta }}</td>
                            <td>{{ $schedule->flight->code }}</td>
                            <td>{{ $schedule->airline->title }}</td>
                            <td>{{ $schedule->airport->title }}</td>
                            <td>{{ ucfirst($schedule->flight_type) }}</td>
                            <td>{{ $schedule->eta }}</td>
                            <td>{{ $schedule->status->title }}</td>
                            <td>{{ ($schedule->display == 1) ? 'Show' : 'Hide' }}</td>
                            <td>{!! $schedule->action_buttons !!}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div><!--col-->
    </div><!--row-->
    <div class="row">
        <div class="col-lg-12">
            <div class="float-left">
                {!! $schedules->total() !!} {{ trans_choice('labels.backend.access.users.table.total', $schedules->total()) }}
            </div>
            <div class="float-right">
                {!! $schedules->render() !!}
            </div>
        </div><!--col-->
    </div><!--row-->
        </div><!-- /.box-body -->
    </div><!-- /.box -->
    

@endsection
@section('after-scripts')
<script type="text/javascript" src="{{asset('js/bootstrap-datepicker.min.js')}}"></script>
<script type="text/javascript">
     $('.datepicker').datepicker({
        todayHighlight: true
     });
</script>
@endsection