@extends('layouts.main_without_top_button', ['title' => 'Transit Products | LOGISTICS'])
@section('title') Transit Products @endsection
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a >Operations</a> <span class="divider">/</span></li>
        <li><a >Settings</a> <span class="divider">/</span></li>
        <li class="active">Transit Products</li>
        </li>
    </ul>
@stop
{{--@section('msghead_menu')--}}
    {{--<li class="right btn-group">--}}
        {{--<div class="btn-group">--}}
            {{--<button class="btn dropdown-toggle" data-toggle="dropdown">--}}
                {{--<i class="icon-th"></i> &nbsp;OPTIONS <span class="caret"></span>--}}
            {{--</button>--}}
            {{--<ul class="dropdown-menu">--}}
                {{--<li><a onclick="create('{{ route('transit-products.create') }}')"><i class="icon-plus"></i> &nbsp;Create Transit Product</a></li>--}}
            {{--</ul>--}}
        {{--</div><!--btn-group-->--}}
    {{--</li>--}}
{{--@endsection--}}
@section('contentinner')


    <div class="tabbable" onload="loadScript()">
        @include('operations.settings.routes.includes.profile')
        <div class="tab-content">
            <div id="glyphs" class="tab-pane active">
                <div class="row-fluid" style="margin-bottom: 8px;">
                    <div class="span12  profile-left">
                        <div class="msghead" style="margin-bottom: 4px;margin-top: -20px;">
                            <ul class="msghead_menu">
                                <li class="right btn-group">
                                    <a class="btn" onclick="create('{{route('transit-products.create')}}')">CREATE PRODUCT</a>
                                </li>
                            </ul>
                            <span class="clearall"></span>
                        </div><!--msghead-->

                        <table class="table table-bordered table-condensed" id="main_table">
                            <thead>
                            <tr>
                                <th width='5px'><input type="checkbox" class="checkall"/></th>
                                <th>Name</th>
                                <th>Unit</th>
                                <th width='5px'>Action</th>
                            </tr>
                            </thead>
                        </table>
                    </div><!--span6-->
                </div><!--row-fluid-->
            </div><!--tab-pane-->
        </div>
    </div>
    <script>
        var mainDataTable = jQuery('#main_table').DataTable({
            "oLanguage": {
                "sLoadingRecords": "Please wait - loading orders...",
                "sZeroRecords": "No Driver available.",
                "sInfoEmpty": "No entries to display."
            },
            ajax: {
                url: "{{ route('transit-products.indexData') }}",
                method: 'POST',
                data: function (d) {},
                error: function (xhr, textStatus, error) {
                    onAjaxError(xhr, textStatus, error);
                }
            },
            "order": [[ 1, "desc" ]],
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "columns": [
                {data: 'checkbox'},
                {"class": "link", data: 'name'},
                {"class": "link", data: 'unit'},
                {data: 'action'}
            ],
            "fnDrawCallback": function () {
            },
            "bStateSave": true
        });

        function editFn(id) {
            var url = '{{ route("transit-products.edit", ":id") }}' . replace(':id', id);
            edit(url);
        }

        function destroyFn(id) {
            var url = '{{ route("transit-products.destroy", ":id") }}' . replace(':id', id);
            destroy(url);
        }

        var create_driver_modal = jQuery('#create_driver_modal');
        var form = create_driver_modal.find('form');
        form.on('submit', function(e) {
            e.preventDefault();
            addRecordFn(form);
        });

        // Ajax function to add a record
        function addRecordFn(form) {
            jQuery.ajax({
                url: form.attr('action'),
                type: form.attr('method'),
                data: form.serialize(),
                success: function (data) {
                    console.log(data);

                    jQuery('.has-error').removeClass('has-error');

                    if (data.state === 'Done') {
                        jQuery.jGrowl(data.msg);
                        mainDataTable.draw();
                    } else if (data.state === 'Fail') {
                        jQuery.jGrowl(data.msg);
                    } else {
                        var num = 0;
                        jQuery.each(data, function(k, v) {
                            field = k.substr(0, k.indexOf("."));

                            field = jQuery('select[name="'+ field +'[]"]').addClass('has-error');

                            if(num == 0) jQuery.jGrowl(v);

                            num++;
                        });
                    }
                },
                error: function (data) {
                    console.log('Error: ');
                    console.log(data);
                    jQuery.jGrowl('Error: Something went wrong');
                }
            });
        }

        // Ajax function to edit record
        function editRecordFn(id) {
            jQuery.ajax({
                url: '{{ route("drivers_management.edit", ":id") }}'. replace(':id', id),
                type: "GET",
                data: "",
                success: function (data) {
                    var driver_modal = jQuery('#driver_modal');
                    driver_modal.empty().append(data);
                    modelShow('driver_modal');

                    var driver_form = driver_modal.find('form');
                    driver_form.on('submit', function(e) {
                        e.preventDefault();
                        updateRecordFn(driver_form);
                    });
                },
                error: function (data) {
                    console.log('Error: ');
                    console.log(data);
                }
            });
        }

        function updateRecordFn(form) {
            jQuery.ajax({
                url: form.attr('action'),
                type: 'PUT',
                data: form.serialize(),
                success: function (data) {
                    if (data.state === 'Done') {
                        jQuery.jGrowl(data.msg);
                        mainDataTable.draw();
                    } else if (data.state === 'Fail') {
                        jQuery.jGrowl(data.msg);
                    } else {
                        var num = 0;
                        jQuery.each(data, function(k, v) {
                            field = k.substr(0, k.indexOf("."));

                            field = jQuery('select[name="'+ field +'[]"]').addClass('has-error');

                            if(num == 0) jQuery.jGrowl(v);

                            num++;
                        });
                    }
                },
                error: function (data) {
                    console.log('Error: ');
                    console.log(data);
                    jQuery.jGrowl('Error: Something went wrong');
                }
            });
        }

        //Ajax function to delete a record
        function deleteRecordFn(id) {
            swal({
                    title: "Are you sure?",
                    text: "You will not be able to recover this imaginary file!",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Yes, delete it!",
                    closeOnConfirm: false
                },
                function () {
                    swal({title: "", text: "", timer: 0, showConfirmButton: false});

                    jQuery.ajax({
                        url: "{{ route('drivers_management.destroy', ':id') }}". replace(':id', id),
                        type: 'DELETE',
                        {{--data: {"id":stadiumId, "_token": "{{ csrf_token() }}" },--}}
                        success: function (data) {
                            console.log(data.state + ' ' + data.msg);

                            if (data.state === 'Done') {
                                jQuery.jGrowl(data.msg);
                                mainDataTable.draw();
                            } else if (data.state === 'Fail') {
                                jQuery.jGrowl(data.msg);
                            } else {
                                jQuery.jGrowl('Something went wrong!');
                            }
                        },
                        error: function (data) {
                            jQuery.jGrowl('Fatal error');
                            console.log(data);
                        }
                    });
                });
        }

    </script>
    {{--<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyB79NNEPOp-SUuaqOMW7EtIxtss_5MbdnI&callback=initMap"></script>--}}
@stop