@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row-fluid">
        <!-- BEGIN PAGE TITLE & BREADCRUMB-->
        <h3 class="page-title">
            Status
        </h3>
        <ul class="breadcrumb">
            <li>
                <i class="icon-home"></i>
                <a href="#">Dashboard</a> 
                <i class="icon-angle-right"></i>
            </li>
            <li><a href="#">Masters</a><i class="icon-angle-right"></i></li>
            <li><a href="#">Status</a></li>
            
        </ul>
        <!-- END PAGE TITLE & BREADCRUMB-->
    </div>
    @if(Session::has('flash_message'))
            <div class="row-fluid">
            <div class="span12">
                <p class="alert {{ Session::get('alert-class', 'alert-info') }}">{{ Session::get('flash_message') }}</p>
            </div> 
            </div>   
        @endif
  
    <div class="row-fluid">
        <div class="span12">
            <div class="portlet box green">
                <div class="portlet-title">
                    <div class="caption"><i class="icon-globe"></i>Status Records</div>
                    <div class="tools">
                        <a href="javascript:;" class="reload"></a>
                        <a href="javascript:;" class="remove"></a>
                    </div>
                </div>
                <div class="portlet-body">
                   <div class="clearfix">
                            <div class="btn-group pull-right">
                                 <div class="form-group col-md-3 col-sm-3">
                                    {!! Form::open(['method' => 'GET', 'url' => '/admin/logisticstatus', 'class' => 'form-vertical'])  !!}
                                        <div class="select">
                                            <select name="logistic_type" onChange="this.form.submit();">
                                                <option value="0">Select status</option>
                                                <option value="1" @if($searchtype == 1)selected @endif>Import</option>
                                                <option value="2" @if($searchtype == 2)selected @endif>Export</option>
                                            </select>
                                           <!--  {!! Form::select('logistic_type',[''=>'Select status','1'=>'Active','0'=>'Inactive'],null, ['id'=>'logistic_type','class' => 'form-control arr'],['onchange' => '(this.form.submit())']) !!}
                                            {!! $errors->first('logistic_type', '<p class="help-block">:message</p>') !!}  -->
                                        </div>
                                        {!! Form::close() !!}
                                 </div>
                               <a href="{{ url('/admin/logisticstatus/create') }}" class="btn green btn-sm" title="Add New Status">
                                    <i class="icon-plus" aria-hidden="true"></i> Add New Status
                                </a>
                            </div>
                        </div>
                <table class="table table-bordered table-hover table-full-width statustable" id="logistic_table1">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Status Per</th>
                        <th>Order</th>
                        <th>Import/Export</th>
                        <th>Color</th>
                        <th>Status</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($logistic_status as $item)
                        <tr id="item-{{ $item->id }}">
                            <td width="25%">{{ $item->type }}</td>
                            <!--td width="20%"><input type="text" name="order" id="{{'order'.$item->id}}" value= "{{$item->order}}">
                            </td-->
                            <td width="15%">
                                @if($item->status_per == 1)
                                    <p>BL</p>
                                @endif
                                @if($item->status_per == 2)
                                    <p>Truck</p>
                                @endif
                            </td>

                            <td width="10%">{{$item->order_no}}</td>

                            <td>
                                @if($item->logistic_type == 1)
                                Import
                                @endif
                                @if($item->logistic_type == 2)
                                Export
                                @endif
                            </td>

                            @if($item->order_no == 1)<td width="20%" style="background-color: #f2f2f2 "><p>Gray</p></td>
                            @endif
                            @if(($item->order_no == 2)||($item->order_no == 3)||($item->order_no == 4))<td width="20%" style="background-color:  #FF8C00 "><p>Orange</p></td>
                            @endif
                            @if($item->order_no == 5)<td width="20%" style="background-color:  #008000 "><p>Green</p></td>
                            @endif
                            </td>
                            <td>
                            @if($item->status == 1)
                            <p class="label label-success">Active</p>
                            @endif
                            @if($item->status == 0)
                            <p class="label label-warning">Inavtive</p>
                            @endif
                            </td>
                            
                            <td>
                                <a href="{{ url('/admin/logisticstatus/' . $item->id . '/edit') }}" title="Edit Status"><button class="btn purple btn-xs edittype"><i class="icon-edit" aria-hidden="true"></i></button></a>
                            
                            </td>
                            

                            <!--td width="20%"><button class="btn purple btn-primary editStatus" data-id={{$item->id}}><i class="icon-edit" aria-hidden="true"></i></button></td-->
                        </tr>
                    @endforeach
                </tbody>
            </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- jQuery UI -->
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
  
    $( "tbody" ).sortable({
    // Cancel the drag when selecting contenteditable items, buttons, or input boxes
    cancel: ":input,button,[contenteditable]",
    // Set it so rows can only be moved vertically
    axis: "y",
    // Triggered when the user has finished moving a row
    update: function (event, ui) {
        // sortable() - Creates an array of the elements based on the element's id. 
        // The element id must be a word separated by a hyphen, underscore, or equal sign. For example, <tr id='item-1'>
        var data = $(this).sortable('serialize');
        
        //alert(data); //<- Uncomment this to see what data will be sent to the server
 
        // AJAX POST to server
        $.ajax({
            headers: {
                'X-CSRF-Token': '{{ csrf_token() }}',
                },
            url: "{{ URL::to('Logistic/sortOrder') }}",
            data: data,
            type: 'POST',
            success: function(response) {
            // alert(response); <- Uncomment this to see the server's response
        }
        });
    }
});
});


</script>
@endsection