Form

index.blade.php

@extends('layout.admin')

@section('title', 'Websites')


@section('content')

    @include('admin.partials.menu-sidebar')

    <div class="mainpanel">

    @include('admin.partials.header')

        <div class="contentpanel">
            <div class="panel panel-default panel-morris">
                <div class="panel-heading">
                    <div class="form-group">
                        <div class="col-md-2">
                            {!! Form::select('bus', $vehicles, null, ['class' => 'select2 col-md-12', 'data-placeholder' => "Choose a bus", 'id' => 'vehicle_id']) !!}
                        </div>
                        <div class="col-md-2">
                            <input type="text" class="form-control" placeholder="mm/dd/yyyy" id="datepicker" value="{{ date('m/d/Y') }}">
                        </div>
                        <div class="col-md-2">
                            <button id="check" class="btn btn-warning">Check</button>
                        </div>
                        <div class="col-md-2 route hidden">
                            <strong>Source: </strong><span id="source"></span>
                        </div>
                        <div class="col-md-3 route hidden">
                            <strong>Destination: </strong><span id="destination"></span>
                        </div>
                        <div class="col-md-3 route hidden">
                            <strong>Shift: </strong><span id="shift"></span>
                        </div>
                    </div>
                </div><!-- panel-heading -->
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="table-responsive">
                                <table class="table mb30" id="user-booking">
                                    <thead>
                                        <tr>
                                            <th>Customer</th>
                                            <th>Seat</th>
                                            <th>Phone</th>
                                            <th width="40%">Message</th>
                                            <th>Ticket link</th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div><!-- table-responsive -->
                        </div><!-- col-md-6 -->
                    </div>
                </div><!-- panel-body -->
            </div>
        </div>
    </div>

@endsection

@section('js')
    @parent
    <script>
        var itemsInTable = $('#user-booking').DataTable({
            "processing": true,
            'ajax': {
                "type": 'POST',
                'url' : '/booking/list',
                "data": function ( d ) {
                    d._token = "{{ csrf_token() }}";
                    d.date = $("#datepicker").val();
                    d.vehicle_id = $("#vehicle_id").val();
                }
            },
            "columns": [
                { "data": "customer_name" },
                { "data": "seat" },
                { "data": "phone" },
                { "data": "message" },
                { "data": "link" }
            ]
        });
        $("#check").on('click', function () {
            itemsInTable.ajax.reload();
            $.post('/route', {
                _token: "{{ csrf_token() }}",
                date: $("#datepicker").val(),
                vehicle_id: $("#vehicle_id").val()
            }, function (data) {
                $('.route').removeClass('hidden');
                var returnData = jQuery.parseJSON(data);
                $('#source').html(returnData.route.source);
                $('#destination').html(returnData.route.destination);
                if(returnData.shift == 'd') {
                    $('#shift').html("Day");
                } else if(returnData.shift == 'n') {
                    $('#shift').html("Night");
                }
            }).error(function (error) {
                if(error.status == 422) {
                    $('.route').addClass('hidden');
                }
            })
        });
    </script>
@endsection