@extends('layouts.main_without_top_button', ['title' => 'Pipelines Ammendment | LOGISTICS'])

@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a><span class="divider">/</span></li>
        <li><a href="{!! route('pipelines.pipeline-orders.pipeline-trucks') !!}">Pipelines Loading Orders</a><span
                    class="divider">/</span></li>
        <li class="active">Pipelines Ammendment</li>
    </ul>
@stop
@section('title', 'Pipelines Ammendment')
@section('contentinner')
    <style>
        .bootstrap-datetimepicker-widget {
            z-index: 99999 !important;
        }

        .dropdown-menu {
            top: 43%;
        }

        .customer-field {
            margin-bottom: 6px;
        }

        .pull-top {
            margin-top: -28px
        }


    </style>
    <div class="tabbable">

        <div class="tab-content">
            <div id="glyphs" class="tab-pane active" style="min-height: 450px">

                <div class="msghead">
                    <ul class="msghead_menu">
                        <li class="right btn-group">
                            @if(auth()->user()->can('CREATE PIPELINE AMMENDMENT'))
                                <button class="btn" style="margin-right: 2px" id="pipeline_amendments_button">
                                    AMENDMENT
                                </button>
                                @endif
                        </li>
                    </ul>
                    <span class="clearall"></span>
                </div><!--msghead-->
                <br>
                <table class="table table-bordered  table-condensed logistics_table" id="pipeline_order_ammendments">
                    <thead>
                    <tr>
                        <th class=" nosort" style="width: 2%"></th>
                        <th style="width: 25%">Vehicle</th>
                        <th style="width: 25%">Trailer</th>
                        <th style="width: 25%">Driver</th>
                    </tr>
                    </thead>
                </table>
            </div><!--tab-pane-->
        </div>
    </div>

    <script>

        var mainDataTable = jQuery('#pipeline_order_ammendments').on('error.dt',
            function (e, settings, techNote, message) {
                console.log('An error has been reported by DataTables: ', message);
                jQuery.jGrowl("ERROR LOADING DATA!", {header: 'Important'});
                stopSpinner();
            })
            .DataTable({
                aLengthMenu: [
                    [25, 50, 100],
                    [25, 50, 100]
                ],
                iDisplayLength: 100,
                "oLanguage": {
                    "sLoadingRecords": startSpinner(),
                    "sZeroRecords": "No pipeline truck to Display.",
                    "sProcessing": "Please wait - loading records...",
                    "sInfoEmpty": "No entries to display."
                },
                ajax: {
                    url: '{{route("pipelines.pipeline-orders.amendmentable",['id'=>$pipeline_loading_order->id])}}',
                    data: function (d) {
                    }
                },
                "initComplete": function (settings, json) {
                    stopSpinner();
                },
                scrollCollapse: true,
                "sPaginationType": "full_numbers",
                processing: true,
                serverSide: true,
                columns: [
                    {data: 'checkbox'},
                    {data: 'vehicle'},
                    {data: 'trailer'},
                    {data: 'driver'}
                ],
                "bStateSave": true
            });

        function reDrawRequisitionTable() {
            mainDataTable.draw();
        }

        jQuery('#pipeline_amendments_button').each(function () {
            if (jQuery(this).attr('initialized') != 'true') {
                jQuery(this).click(function () {
                    generatePipelineAmendment();
                });
                jQuery(this).attr('initialized', 'true');
            }
        });

        function generatePipelineAmendment() {

            var pipeline_order_id = '{{ $pipeline_loading_order->id }}' ;
            var loading_order_item_ids = new Array();
            jQuery('.loading_order_item_id').each(function () {
                if (jQuery(this).is(':checked')) {
                    loading_order_item_ids.push(jQuery(this).val());

                }
            });
            if(loading_order_item_ids.length == 1) {

                jQuery.ajax({
                    type: "GET",
                    cache: false,
                    url: "{{route('amendments.route-assignments-amendments.create')}}",
                    data: {
                        loading_order_item_ids: loading_order_item_ids,
                        pipeline_order_id: pipeline_order_id
                    },

                    beforeSend: function () {
                        startSpinner();
                    },
                    success: function (data) {
                        onAjaxSuccess(data, 'POST');
                    },
                    error: function (xhr, textStatus, error) {
                        onAjaxError(xhr, textStatus, error);
                    },
                    complete: function () {
                        stopSpinner();
                    }
                });

            } else {
                logistics_alert('PLEASE CHECK ONLY ONE ITEM TO CONTINUE', 'SELECTION DIALOG');
                return;
            }



            return false;
        }

    </script>

@stop