@extends('layouts.app2')

@section('content')
<style type="text/css">
    #sample_4_wrapper {
        width: 100%;
        overflow-x: auto;
    }
    .wdth-78px {
        width: 78px;
    }
</style>
<div class="container-fluid">
    <div class="row-fluid">
        <!-- BEGIN PAGE TITLE & BREADCRUMB-->
        <h3 class="page-title">
            Finalization
        </h3>
        <ul class="breadcrumb">
            <li>
                <i class="icon-home"></i>
                <a href="#">Dashboard</a> 
                <i class="icon-angle-right"></i>
            </li>
            <li><a href="#">Finalization</a><i class="icon-angle-right"></i></li>
            <li><a href="#">All</a></li>
        </ul>
        <!-- END PAGE TITLE & BREADCRUMB-->
    </div>
    <div class="alert-div"></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 cursor-pointer" role="button" data-toggle="collapse" data-parent="#accordion1" href="#collapse1" aria-expanded="true" aria-controls="collapse1"><i class="icon-globe"></i>Finalization Reports - Filters</div>
                    <div class="tools">
                        <a href="javascript:;" class="reload"></a>
                        <a href="javascript:;" class="remove"></a>
                    </div>
                </div>
                <div class="portlet-body padding-unset">
                    {!! Form::open(['method' => 'POST', 'route' => 'mis.document.finalization.download_final_report', 'class' => 'margin-unset', 'id' => 'docFinalReportDownloadForm'])  !!}
                    <div class="panel-group" id="accordion1" role="tablist" aria-multiselectable="true">
                        <div class="panel panel-default">
                            <div id="collapse1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                                <div class="panel-body padding-10px">
                                    <div class="cargo-search-form search-filters">
                                        <div class="row-fluid">
                                          <div class="span2"></div>
                                          <div class="span4">
                                            <label for=" Date From"> Date From</label>
                                            <input type="date" class="form-control from_date" name="from_date">
                                            <div class="help-block with-errors"></div> 
                                          </div>

                                          <div class="span5 pull-right">
                                            <label for=" Date To"> Date To</label>
                                            <input type="date" class="form-control to_date" name="to_date">
                                            <div class="help-block with-errors"></div> 
                                          </div>
                                          <div class="span1"></div>
                                        </div>
                                        <div class="row-fluid" style="margin-bottom: 20px; margin-top: 20px;">
                                          <div class="span12">
                                            <center> 
                                              <a onclick="finalreport(this)" class="btn purple newbooking">Finalization Report</a>
                                            </center>
                                          </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
    <div class="row-fluid">
        <div class="span12">
            <div class="portlet box green">
                <div class="portlet-title">
                    <div class="caption cursor-pointer" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse2" aria-expanded="true" aria-controls="collapse2"><i class="icon-globe"></i>Search Filters</div>
                    <div class="tools">
                        <a href="javascript:;" class="reload"></a>
                        <a href="javascript:;" class="remove"></a>
                    </div>
                </div>
                <div class="portlet-body padding-unset">
                    {!! Form::open(['method' => 'GET', 'url' => '/transport/pdo_trip_close','id'=>'form1','class' => 'margin-unset', 'role' => 'search'])  !!} 
                      <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                        <div class="panel panel-default">
                          <div id="collapse2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                           <div class="panel-body padding-10px">
                              <div class="cargo-search-form search-filters">
                                <div class="row-fluid">
                                    <div class="span2">
                                        {!! Form::select('booking_number',['' => 'Select Booking No'] + $page_data['booking_no'] ,null, ['id'=>'booking_number','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('customer',['' => 'Select Customer'] + $page_data['customer'] ,null, ['id'=>'customer','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('customer_ref',['' => 'Select Customer Ref'] + $page_data['customer_ref'] ,null, ['id'=>'customer_ref','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('consignee',['' => 'Select Consignee'] + $page_data['consignee'] ,null, ['id'=>'consignee','class' => 'form-control']) !!}
                                    </div>
                                </div>
                                <div class="row-fluid">
                                    <div class="span2">
                                        {!! Form::select('trip',['' => 'Select Trip'] + $page_data['trip'] ,null, ['id'=>'trip','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('truck',['' => 'Select Truck'] + $page_data['truck'] ,null, ['id'=>'truck','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('driver',['' => 'Select Driver'] + $page_data['driver'] ,null, ['id'=>'driver','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('origin',['' => 'Select Origin'] + $page_data['origin'] ,null, ['id'=>'origin','class' => 'form-control']) !!}
                                    </div>
                                </div>
                                <div class="row-fluid">
                                    <div class="span2">
                                        {!! Form::select('destination',['' => 'Select Destination'] + $page_data['destination'] ,null, ['id'=>'destination','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('shipping_line',['' => 'Select Shipping Line'] + $page_data['shipping_line'] ,null, ['id'=>'shipping_line','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('lading_bill',['' => 'Select BL'] + $page_data['lading_bill'] ,null, ['id'=>'ladding_bill','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('cargo_type',['' => 'Select Cargo Type'] + $page_data['cargo_type'] ,null, ['id'=>'cargo_type','class' => 'form-control']) !!}
                                    </div>
                                </div>
                                <div class="row-fluid">
                                    <div class="span2">
                                        {!! Form::select('product',['' => 'Select Product'] + $page_data['product'] ,null, ['id'=>'product','class' => 'form-control']) !!}
                                    </div>
                                    <div class="span1"></div>
                                    <div class="span2">
                                        {!! Form::select('status',['' => 'Select Status'] + $page_data['status'] ,null, ['id'=>'status','class' => 'form-control']) !!}
                                    </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div><!-- panel-group -->
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
    <div class="row-fluid">
        <div class="span12">
            <div class="portlet box green">
                <div class="portlet-title">
                    <div class="caption cursor-pointer" role="button" data-toggle="collapse" data-parent="#accordion3" href="#collapse3" aria-expanded="true" aria-controls="collapse3"><i class="icon-globe"></i>Finalization</div>
                    <div class="span6 height-10px">
                        {!! Form::open(['method' => 'GET', 'url' => '/transport/pdo_trip_close','id'=>'form3','class' => 'display-flex'])  !!}
                          <input type="radio" name="type" id="type" onclick="javascript: submit()" value="1" {{ request('type')=='1' ? 'checked' : ''  }}><label for="Shipper">Own Truck</label>&nbsp;&nbsp;&nbsp;&nbsp;
                          <input type="radio" name="type" id="type" onclick="javascript: submit()" value="2" {{ request('type')=='2' ? 'checked' : ''  }}><label for="Shipper">Third Party Truck</label>
                        {!! Form::close()!!}
                    </div>
                    <div class="tools">
                        <input type="checkbox" @if($filter=='on')checked @endif name="checkboxitem" id="checkboxitem"  data-target="{{ url('transport/pdo_trip_close?checkboxitem=on') }}" data-target-off="{{ url('transport/pdo_trip_close?type=1') }}" style="width: 15px;">  Show All Closed
                        <input type="checkbox" @if($showall=='on')checked @endif name="showall" id="showall"  data-target="{{ url('transport/pdo_trip_close?showall=on') }}" data-target-off="{{ url('transport/pdo_trip_close?type=1') }}" style="width: 15px;">  Show All
                        <a href="javascript:;" class="reload"></a>
                        <a href="javascript:;" class="remove"></a>
                    </div>
                </div>
                <div class="portlet-body padding-unset">
                    <div class="panel-group" id="accordion3" role="tablist" aria-multiselectable="true">
                        <div class="panel panel-default">
                            <div id="collapse3" class="panel-collapse in collapse" role="tabpanel" aria-labelledby="headingOne">
                                <div class="panel-body padding-10px">
                                    <table class="table table-striped table-bordered table-hover table-full-width scrollable" id="my-table">
                                        <thead>
                                          <tr>
                                            <th style="display: none;">Id</th>
                                            <th> Date </th>  
                                            <th> Customer </th>       
                                            <th> Booking No </th>  
                                            <th> Cust Ref </th> 
                                            <th> Container </th>
                                            <th> Trip Number </th>
                                            <th> Truck </th>
                                            <th> Trailer </th>
                                            <th> Driver </th>
                                            <th> Origin </th>        
                                            <th> Destination </th>
                                            <th> Border </th>
                                            <th> Km </th>
                                            <th> Line </th>             
                                            <th> BL </th> 
                                            <th> Type </th>               
                                            <th> Product </th>          
                                            <th> Size </th>
                                            <th> Tons </th>
                                            <th> Packaging </th>
                                            <!-- <th>Cargo Id</th> -->
                                            <th>Status</th>
                                            <th>Detail</th>
                                            <!-- <th>Action</th> -->
                                          </tr>
                                        </thead>

                                        <tbody>
                                          @foreach($tracking as $t)
                                          <tr>
                                            <td style="display: none;">{{ $t->id }}</td>
                                            <td>{{ Helper::convert_to_ddmmyy(date("Y-m-d", strtotime($t->created_at))) }}</td>
                                            <td>{{ $t->cargo->order->customer['name'] }}</td>
                                            <td>{{ $t->cargo->order['booking_no'] }}</td>
                                            <td>{{ $t->cargo->order['customer_ref'] }}</td>
                                            <td>{{ $t->cargo['container'] }}</td>
                                            <td>{{ $t->trip_number }}</td>
                                            <td>{{ $t->truck }}</td>
                                            <td>{{ $t->trailer }}</td>
                                            <td>{{ $t->driver }}</td>
                                            <td>{{ $t->cargo->order->origin['origin'] }}</td>
                                            <td>{{ $t->cargo->order->destination['destination'] }}</td>
                                            <td>{{ $t->cargo->order->destination['border'] }}</td>
                                            <td>
                                             @if($t->cargo->order->destination['Km'])
                                             {{ number_format($t->cargo->order->destination['Km'], 2, '.', ',') }}
                                             @else
                                             {{ $t->cargo->order->destination['Km'] }}
                                             @endif
                                           </td>
                                           <td>{{ $t->cargo->order->shipping_line['name'] }}</td>
                                           <td>{{ $t->cargo->order['lading_bill'] }}</td>
                                           <!-- <td>{{ $t->cargo['cargo_type'] }}</td> -->
                                           <td>@if($t->cargo['cargo_type'] == 'containarized')
                                                CNTR
                                                @endif
                                                @if($t->cargo['cargo_type'] == 'break_bulk')
                                                BBK
                                                @endif
                                                @if($t->cargo['cargo_type'] == 'oog')
                                                OOG
                                                @endif
                                                @if($t->cargo['cargo_type'] == 'lcl')
                                                LCL
                                                @endif
                                            </td>
                                           <td>{{ $t->cargo['product'] }}</td>
                                           <td>{{ $t->cargo['size'] }}</td>
                                           <td>{{ $t->cargo['weight'] }}</td>
                                           <td>{{ $t->cargo['packaging'] }} Kg</td>
                                           <!--  <td>{{ $t->cargo['id'] }}</td> -->
                                           <td id="{{ $t->id }}">
                                            @if($t->status == 'Delivered')<p class="Delivered">Delivered</p>@endif
                                            @if($t->status == 'Invoiced')<p class="Invoiced">Invoiced</p> @endif
                                            @if($t->status == 'Closed')<p class="Closed">Closed</p>@endif

                                          </td>
                                          <td><button class="btn yellow detail" data-id="{{ $t->id}}" data-customer="{{ $t->cargo->order->customer['name'] }}" data-customer_ref="{{ $t->cargo->order['customer_ref'] }}" data-trip="{{ $t->trip_number }}" data-packaging="{{ $t->cargo['packaging'] }}" data-container="{{ $t->cargo['container'] }}" data-quantity="{{ $t->load_quantity }}" data-driver="{{ $t->driver }}" data-status="{{ $t->status }}" data-type="{{ $t->cargo['cargo_type'] }}" data-size="{{ $t->cargo['size'] }}" data-corridor="{{ $t->cargo->order['origin_id'] }}" data-customer_id="{{ $t->cargo->order['customer_id'] }}"><i class="icon-eye-open"></i></button></td>
                                          <!-- <td>@if($t->status != 'Closed')<a class="close_tab" data-id="{{ $t->id }}">Close</a>@endif</td> -->
                                        </tr>
                                        @endforeach    
                                        </tbody>
                                    </table>
                                    {!! $tracking->appends(request()->input())->links(); !!}
                                    <br><br>
                                    <div class="cargo-search-form">
                                      <div class="tools-control-table status-table">

                                        <div class="panel with-nav-tabs panel-default">
                                          <div class="panel-heading table-heading">
                                            <ul class="nav nav-tabs">
                                              <li class="active"><a href="#billing" data-toggle="tab"> Billing </a></li>
                                              <li><a href="#fcargo" data-toggle="tab">Cargo</a></li>
                                              <li><a href="#fuel" data-toggle="tab">Fuel</a></li>
                                              <li><a href="#closure" data-toggle="tab">Closure</a></li> 
                                            </ul>
                                          </div>
                                          <div class="panel-body">
                                            <div class="tab-content">

                                              <div class="tab-pane fade in active" id="billing">
                                                <div class="span6">
                                                  {!! Form::open(['method' => 'POST', 'url' => '/transport/finalization/save_billing'])  !!} 
                                                  <div class="form-border">

                                                    <div class="form-group span3">
                                                      <input type="hidden" class="planning_id form-control" name="planning_id" readonly="true">
                                                      <label>Customer</label>
                                                      <input type="text" class="customer form-control" name="customer" placeholder="Enter Customer" readonly="true">
                                                    </div>
                                                    <div class="span1"></div>

                                                    <div class="form-group span2">
                                                      <label>Customer Ref</label>
                                                      <input type="text" class="customer_ref form-control" name="customer_ref" placeholder="Enter Customer Ref" readonly="true">
                                                    </div>

                                                    <div class="form-group span3">
                                                      <label>Inv Nr</label>
                                                      <input type="text" class="form-control" placeholder="Enter Inv Nr" name="inv_nr" required="true">
                                                    </div>

                                                    <div class="form-group span3">
                                                      <label>Inv Date</label>
                                                      <input type="text" class="form-control" placeholder="Enter Inv Date" name="inv_date" id="datepicker1" required="true">
                                                    </div>

                                                      <div class="form-group span3">
                                                          <label>Currency</label>
                                                          <div class="select">
                                                              <select class="form-control" name="currency">
                                                                  <option value="usd">USD</option>
                                                                  <option value="mzm">MZM</option>
                                                                  <option value="zar">ZAR</option>
                                                              </select>
                                                          </div>
                                                      </div>

                                                    <div class="form-group span3">
                                                      <label>Rate</label>
                                                      <input type="text" class="customer_rate form-control" name="customer_rate">
                                                    </div>

                                                    <div class="form-group span3">
                                                      <label>Amount</label>
                                                      <input type="text" class="form-control" name="amount" placeholder="Enter Amount" required="true">
                                                    </div>

                                                    <div class="form-group span3">
                                                      <br/>
                                                      <input type="submit" class="btn btn-success" value="ADD">
                                                    </div>       
                                                  </div>
                                                  {!! Form::close() !!}
                                                </div>
                                                <div class="span6">
                                                  <div class="row">
                                                    <div class="table-heading">
                                                      <h4 class="col-md-6 col-sm-6 col-xs-6">Log</h4>
                                                    </div>
                                                    <div class="table-responsive tableContainer" id="status-log-table tableContainer">
                                                      <table class="table scrollTable">
                                                        <thead class="fixedHeader">
                                                          <tr>
                                                            <th width="14.28%">Customer</th>
                                                            <th width="14.28%"">Customer Ref</th>
                                                            <th width="14.28%">Inv Nr</th>
                                                            <th width="14.28%">Inv Date</th>
                                                            <th width="14.28%">Currency</th>
                                                            <th width="14.28%">Amount</th>
                                                            <th width="14.28%">Rate</th>
                                                          </tr>
                                                        </thead>
                                                        <tbody class="billing scrollContent">
                                                        </tbody>
                                                      </table>
                                                    </div>
                                                  </div>
                                                </div>
                                              </div>

                                              <div class="tab-pane fade" id="fcargo">
                                                  <div class="col-md-6">
                                                    {!! Form::open(['method' => 'POST', 'url' => '/transport/finalization/save_cargo'])  !!} 
                                                    <div class="form-border">
                                                      <div class="form-group col-md-3">
                                                        <input type="hidden" class="planning_id form-control" name="planning_id" readonly="true">
                                                        <label>Trip Number</label>
                                                        <input type="text" class="trip_number form-control" name="trip_number" placeholder="Enter Trip" readonly="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                        <label>Document</label>
                                                        <input type="text" class="form-control" name="document" placeholder="Enter Document" required="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                        <label>Doc Number</label>
                                                        <input type="text" class="form-control" placeholder="Enter Document Nr" name="doc_nr" required="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                        <label>Difference</label>
                                                        <input type="text" class="difference form-control" placeholder="Enter Difference" name="difference" required="true" readonly="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                        <label>Packaging</label>
                                                        <input type="text" class="packaging form-control" name="packaging" placeholder="Enter Packaging" required="true" readonly="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                        <label>Container</label>
                                                        <input type="text" class="container form-control" name="container" placeholder="Enter Container" readonly="true">
                                                      </div>

                                                      <div class="form-group col-md-3">
                                                       <label>Weight</label>
                                                       <input type="text" class="weight form-control" name="weight" placeholder="Enter Weight" required="true" readonly="true">
                                                     </div>

                                                     <div class="form-group col-md-3">
                                                      <label>Remark</label>
                                                      <input type="text" class="form-control" name="remark" placeholder="Enter Remark" required="true">
                                                    </div>

                                                    <div class="form-group col-md-3">
                                                      <label>Price</label>
                                                      <input type="text" class="kgprice form-control" name="price" placeholder="Enter Price" required="true">
                                                    </div>

                                                    <div class="form-group col-md-3">
                                                      <br/>
                                                      <input type="submit" class="btn btn-success" value="ADD">
                                                    </div>       
                                                  </div>
                                                    {!! Form::close() !!}
                                                  </div>
                                                  <div class="col-md-6">
                                                    <div class="row">
                                                      <div class="table-heading">
                                                        <h4 class="col-md-6 col-sm-6 col-xs-6">Log</h4>
                                                      </div>
                                                      <div class="table-responsive tableContainer" id="status-log-table tableContainer">
                                                        <table class="table scrollTable">
                                                          <thead class="fixedHeader">
                                                            <tr>
                                                              <th width="10%">Trip</th>
                                                              <th width="10%"">Doc</th>
                                                              <th width="10%">Doc Nr</th>
                                                              <th width="10%">Diff</th>
                                                              <th width="10%">Packaging</th>
                                                              <th width="10%">Price</th>
                                                              <th width="10%">Amount</th>
                                                              <th width="10%">Container</th>
                                                              <th width="10%">Weight</th>
                                                              <th width="10%">Remark</th>
                                                            </tr>
                                                          </thead>
                                                          <tbody class="cargo scrollContent">
                                                          </tbody>
                                                        </table>
                                                      </div>
                                                    </div>
                                                  </div>
                                              </div>

                                              <div class="tab-pane fade" id="fuel">
                                                <div class="col-md-12">
                                                  {!! Form::open(['method' => 'POST', 'url' => '/transport/finalization/save_finalization_fuel'])  !!} 
                                                  <div class="row">
                                                    <div class="table-responsive">
                                                      <table class="table">
                                                        <thead>
                                                          <tr>
                                                            <th>#</th>
                                                            <th width="10%">Trip</th>
                                                            <th width="10%">Driver</th>
                                                            <th width="10%">Corridor</th>
                                                            <th width="10%">Km</th>
                                                            <th width="10%">Fuel Allowance</th>
                                                            <th width="10%">Fuel Used</th>
                                                            <th width="10%">Km/ltr</th>
                                                            <th width="10%">Fuel Diff</th>
                                                            <th width="10%">Price/Ltr</th>
                                                            <th width="10%">Deduction</th>
                                                            <th width="10%">Remark</th>
                                                          </tr>
                                                        </thead>
                                                        <tbody class="fuel">
                                                        </tbody>
                                                      </table>
                                                    </div>
                                                  </div>
                                                  {!! Form::close() !!}
                                                </div>
                                              </div>

                                              <div class="tab-pane fade" id="closure">
                                                <div class="col-md-12">
                                                  {!! Form::open(['method' => 'POST', 'url' => '/transport/finalization/save_closure'])  !!}

                                                  <div class="form-group col-md-2">
                                                    <div class="plan"></div>
                                                    <label class="form-label">Driver</label>
                                                    <input type="text" class="driver form-control" name="driver" placeholder="Enter Driver" readonly="true">
                                                  </div>

                                                  <div class="form-group col-md-2">
                                                    <label class="form-label">Bonus</label>
                                                    <input type="text" class="bonus form-control" name="bonus" placeholder="Enter Bonus" required="true">
                                                  </div>

                                                  <div class="form-group col-md-2">
                                                    <label class="form-label">Cargo Deduction</label>
                                                    <input type="text" class="cargo_ded form-control" name="cargo_deduction" value="0" required="true">
                                                  </div>

                                                  <div class="form-group col-md-2">
                                                    <label class="form-label">Fuel Deduction</label>
                                                    <input type="text" class="fuel_ded form-control" placeholder="Enter Fuel Ded" value="0" name="fuel_ded" required="true">
                                                  </div>

                                                  <div class="form-group col-md-2">
                                                    <label class="form-label">Net Amount</label>
                                                    <input type="text" class="clos_amt form-control" name="amount" placeholder="Enter amount" required="true">
                                                  </div>

                                                  <div class="form-group col-md-2">
                                                    <br/>
                                                    <input type="submit" class="btn btn-success" value="ADD">
                                                  </div>       

                                                  {!! Form::close() !!}
                                                </div>
                                              </div>

                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('scripts')
<script type="text/javascript">
    function finalreport(element){
      var from_date = $('.from_date').val();
      var to_date   = $('.to_date').val();

      if(from_date == '' || to_date == '')
      {
        alert("Please select From Date & To Date");
      }
      else
      {
        $(element).closest('form').submit();
      }
    }
</script>
@endsection