@extends('layouts.template')

@section('content')

<section class="order-booking">
    <div class="container">
    <div class="row">          
    {!! Form::open(['url' => '/logistic/order/store', 'id' => 'myform', 'class' => 'form-horizontal', 'files' => true]) !!}
    <h1 class="heading">Order Booking  <a href="{{ url('logistic/dashboard') }}" title="back"><i class="fa fa-undo" aria-hidden="true"></i></a> : 
        @if(Auth::user()->logistic_type == '2') 
            Export
        @endif  

        @if(Auth::user()->logistic_type == '1') 
            Import 
        @endif

        <span class="orderid">
            @if(count($lastInsertedID) > 0 ) 
                @if(Auth::user()->logistic_type == '2') 
                    #XI{{ $lastInsertedID[0]+1 }} 
                @endif  

                @if(Auth::user()->logistic_type == '1') 
                    #IE{{ $lastInsertedID[0]+1 }}
                @endif
            @else
                @if(Auth::user()->logistic_type == '2') 
                    #XI{{ 0+1 }} 
                @endif  

                @if(Auth::user()->logistic_type == '1') 
                    #IE{{ 0+1 }}
                @endif
            @endif
        </span>
    </h1>
    @if(Session::has('flash_message'))
    <div class="row">
        <div class="col-md-12">
            <p class="alert {{ Session::get('alert-class', 'alert-info') }}">{{ Session::get('flash_message') }}</p>
        </div> 
    </div>   
    @endif
    <div class="col-md-12 order-table-heading">
        <input type="hidden" name="logistic_type" value="{{ Auth::user()->logistic_type }}">
        <h4 class="col-md-3 col-sm-2 col-xs-12">Services <span class="error"> * </span></h4>
        <div class=" col-md-9 col-sm-10 col-xs-12 demo-list">

           <div class="checkbox checkbox-primary checkbox-inline">
                {!! Form::checkbox('services[]','clearance',null,array('id'=>'inlineCheckbox1','class' => 'styled')); !!} 
                <label for="inlineCheckbox1"> Clearance</label>
            </div>
            <div class="checkbox checkbox-primary checkbox-inline">
                {!! Form::checkbox('services[]','packing',null,array('id'=>'inlineCheckbox2','class' => 'styled')); !!}
                <label for="inlineCheckbox2"> Packing</label>
            </div>
            <div class="checkbox checkbox-primary checkbox-inline">
                {!! Form::checkbox('services[]','unpacking',null,array('id'=>'inlineCheckbox3','class' => 'styled')); !!}
                <label for="inlineCheckbox3"> UnPacking </label>
            </div>

            <div class="checkbox checkbox-primary checkbox-inline">
               {!! Form::checkbox('services[]','transportation',null,array('id'=>'inlineCheckbox4','class' => 'styled')); !!} 
               <label for="inlineCheckbox4"> Transportation </label>
            </div>

            <div class="checkbox checkbox-primary checkbox-inline">
                {!! Form::checkbox('services[]','warehouse',null,array('id'=>'inlineCheckbox5','class' => 'styled')); !!} 
                <label for="inlineCheckbox5"> Warehouse </label>
            </div>
            <span class="service-error"></span>
            <div class="clearfix"></div>
            {!! $errors->first('services', '<span class="help-block service-checkbox-error">:message</span>') !!} 
        </div>

    </div>

    <div class="customer-area">
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 customer-details">
            <h1>customer details</h1>
            <div class="customer-form">
                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('shipper') ?  'has-error' : ''}}">
                    <label for="Shipper"><i class="fa fa-plus-circle" data-toggle="modal" data-target="#myModal" aria-hidden="true"></i>
                     Shipper</label>
                    <span class="error"> * </span>
                    <div class="select" >
                        {!! Form::select('shipper',['' => 'Select Shipper'] + $page_data['shippers']->toArray() , null, ['id'=>'shipper','class' => 'form-control arr wh-select2-class']) !!}
                        {!! $errors->first('shipper', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('shipping_ref') ?  'has-error' : ''}}">
                    <label for="Shipping Ref">Shipping Ref</label>
                    <span class="error"> * </span>
                    {!! Form::text('shipping_ref', null, array('placeholder' => 'Shipping Ref','class' => 'form-control')) !!}
                    {!! $errors->first('shipping_ref', '<p class="help-block">:message</p>') !!}
                </div>

                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('port_agent') ? 'has-error' : ''}}">
                    <label for="Port Agent">Port Agent</label>
                    <span class="error"> * </span>
                    {!! Form::text('port_agent', null, array('placeholder' => 'Port Agent','class' => 'form-control')) !!}
                    {!! $errors->first('port_agent', '<p class="help-block">:message</p>') !!}
                </div>

                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('consignee') ?  'has-error' : ''}}">
                    <div class="select">
                        <label for="Consignee"><i class="fa fa-plus-circle" data-toggle="modal" data-target="#myModal" aria-hidden="true"></i>
                         Consignee</label>
                        <span class="error"> * </span>
                        {!! Form::select('consignee',['' => 'Select Consignee'] + $page_data['consignees']->toArray() , null, ['class' => 'form-control arr wh-select2-class', 'id' => 'consigneeId']) !!}
                        {!! $errors->first('shipper', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>

                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('consignee_ref') ?  'has-error' : ''}}">
                    <label for="Consignee Ref">Consignee Ref</label>
                    <span class="error"> * </span>
                    {!! Form::text('consignee_ref', null, array('placeholder' => 'Consignee Ref','class' => 'form-control')) !!}
                    {!! $errors->first('consignee_ref', '<p class="help-block">:message</p>') !!}
                </div>
                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('border_agent') ?  'has-error' : ''}}">
                    <label for="Border Agent">Border Agent</label>
                    {!! Form::text('border_agent', null, array('placeholder' => 'Border Agent','class' => 'form-control')) !!}
                    {!! $errors->first('border_agent', '<p class="help-block">:message</p>') !!}
                </div>

                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('notify') ?  'has-error' : ''}}">
                <div class="select">
                    <label for="Notify"><i class="fa fa-plus-circle" data-toggle="modal" data-target="#myModal" aria-hidden="true"></i>
                     Notify</label>
                    {!! Form::select('notify',['' => 'Select Notify'] + $page_data['notify']->toArray() , null, ['id'=>'notify','class' => 'form-control arr wh-select2-class']) !!}
                    {!! $errors->first('notify', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>

                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('customer_ref') ?  'has-error' : ''}}">
                    <label for="Customer Ref">Customer Ref</label>
                    <span class="error"> * </span>
                    {!! Form::text('customer_ref', null, array('placeholder' => 'Customer Ref','class' => 'form-control')) !!}
                    {!! $errors->first('customer_ref', '<p class="help-block">:message</p>') !!}
                </div>
                <div class="form-group col-md-4 col-sm-4 {{ $errors->has('customer') ?  'has-error' : ''}}">
                    <label for="Customer">Customer</label>
                    <span class="error"> * </span> <a href="javascript:void(0)" style="font-weight: 600;"><i data-toggle="modal" data-target="#myModal3" aria-hidden="true"><u>Apply</u></i></a>
                    <div class="select">
                        {!! Form::select('customer', ['' => 'Select Customer'] + $page_data['customers']->toArray() , null, ['id'=>'customer','class' => 'form-control arr wh-select2-class']) !!}
                        {!! $errors->first('customer', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                <div class="form-group col-md-12 col-sm-12 {{ $errors->has('delivery_address') ?  'has-error' : ''}}">
                    <label for="Delivery Address">Delivery Address</label>
                    {!! Form::textarea('delivery_address', null, ['size' => '30x5','class'=>'form-control inp_textarea','placeholder'=>'Delivery Address']) !!}
                    {!! $errors->first('delivery_address', '<p class="help-block">:message</p>') !!}
                </div>
                <div class="clearfix"></div>

            </div>
        </div>

        <div class="document-list col-lg-6 col-md-6 col-sm-6 col-xs-12">
            <h1>Document check list</h1>
            <div class="customer-document {{ $errors->has('document_files') ?  'has-error' : ''}}">
                <span class="col-sm-12 col-md-12">
                    @foreach($document_type as $dt)
                        @if($dt->type == Auth::user()->logistic_type)
                        <div class="col-sm-4 col-md-4">
                            <div class="file-upload">
                                {!! Form::checkbox('document_files[]', $dt->id, null, ['id'=>'area'.$dt->id,'class' => 'magic-checkbox area trigger_chk']) !!}                                
                                <label for="area{{$dt->id}}">{{ $dt->name }}</label>
                                {!! Form::file($dt->id.'_file[]', ['id'=>'file'.$dt->id,'multiple'=>'true','class'=>'file_u','style'=>'display:none;']) !!}
                                {!! Form::hidden($dt->id.'_hidden', $dt->name) !!}
                            </div>
                        </div>
                        @endif
                    @endforeach
                </span>
                {!! $errors->first('document_files', '<span class="help-block document-error">:message</span>') !!}
                <div class="clearfix"></div>
            </div>
        </div>
    </div>

    <div class="shipping-area">
        <div class="col-md-6 col-sm-12 col-xs-12 shiping-details">
            <h1>Shipping Details</h1>
            <div class="shipping-form">
                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('shipping_line') ?  'has-error' : ''}}">
                    <label for="Shipping Line">Shipping Line</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('shipping_line', ['' => 'Select Shipping Line'] + $page_data['shipping_lines']->toArray(), null, ['id'=>'shipping_line','class' => 'form-control arr']) !!}
                        {!! $errors->first('shipping_line', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('booking_no') ?  'has-error' : ''}}">
                    <label for="Booking Ref">Booking No</label>
                    <span class="error"> * </span>
                    {!! Form::text('booking_no', null, array('placeholder' => 'Booking No.','class' => 'form-control')) !!}
                    {!! $errors->first('booking_no', '<p class="help-block">:message</p>') !!} 
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('booking_ref') ?  'has-error' : ''}}">
                    <label for="Booking Ref">Booking Ref</label>
                    <span class="error"> * </span>
                    {!! Form::text('booking_ref', null, array('placeholder' => 'Booking Ref','class' => 'form-control')) !!}
                    {!! $errors->first('booking_ref', '<p class="help-block">:message</p>') !!} 
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('bill_of_lading') ?  'has-error' : ''}}">
                    <label for="Bill of Lading">Bill of Lading</label>
                    <span class="error"> * </span>
                    {!! Form::text('bill_of_lading', null, array('placeholder' => 'Bill Of Lading','class' => 'form-control')) !!}
                    {!! $errors->first('bill_of_lading', '<p class="help-block">:message</p>') !!} 
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('loading_port') ?  'has-error' : ''}}">
                    <label for="Port of Loading">Port of Loading</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('loading_port', ['' => 'Select Loading Port'] + $page_data['loading_port']->toArray() , null, ['class' => 'form-control arr']) !!}
                        {!! $errors->first('loading_port', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('discharge_port') ?  'has-error' : ''}}">
                    <label for="Port of Discharge">Port of Discharge</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('discharge_port', ['' => 'Select Discharge Port'] + $page_data['discharge_port']->toArray(), null, ['class' => 'form-control arr']) !!}
                        {!! $errors->first('discharge_port', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                 <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('origin') ?  'has-error' : ''}}">
                    <label for="Origin">Origin</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('origin', ['' => 'Select Origin'] + $page_data['origin']->toArray() , null, ['class' => 'form-control arr','id'=>'originChange']) !!}
                        {!! $errors->first('origin', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                  <div class="form-group col-lg-4 col-md-6 col-sm-6 col-xs-12 {{ $errors->has('destination') ?  'has-error' : ''}} ">
                    <label for="Destination">Destination</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('destination', ['' => 'Select Destination'] , null, ['class' => 'form-control arr','id'=>'destination']) !!}
                        {!! $errors->first('destination', '<p class="help-block">:message</p>') !!}
                    </div>

                </div>

               <div class="form-group col-lg-4 col-md-6 col-sm-4 col-xs-12 {{ $errors->has('remarks') ?  'has-error' : ''}}">
                    <label for="Origin">Remarks</label>
                    {!! Form::textarea('remarks', null, ['size' => '30x5','class'=>'form-control inp_textarea','placeholder'=>'Enter your Remark Here..']) !!}
                    {!! $errors->first('remarks', '<div class="help-block remark-error with-errors">:message</div>') !!}                            
                </div>
                <div class="clearfix"></div>
            </div>
        </div>

        <div class="col-md-6 col-sm-12 col-xs-12 cargo-details">
            <h1>cargo details</h1>
            <div class="cargo-form">
                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('vessel') ?  'has-error' : ''}}">
                    <label for="Vessel">Vessel  <a href="{{ route('logistic.order.vessel') }}" style="font-size:12px"><i><u>Schedule</u></i></a></label>
                    <div class="select">
                        {!! Form::select('vessel', ['' => 'Select Vessel'] + $page_data['vessels']->toArray() , null, ['id'=>'vessels','class' => 'form-control arr']) !!}
                        <!-- {!! Form::select('vessel', ['' => 'Select Vessel'], null, ['id'=>'vessels','class' => 'form-control arr']) !!} -->
                        {!! $errors->first('vessel', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('voyage') ?  'has-error' : ''}}">
                    <label for="Voyage">Voyage</label>
                    <div class="select">
                        {!! Form::select('voyage', ['' => 'Select Voyage'] , null, ['class' => 'form-control arr','id'=>'voyage']) !!}
                        {!! $errors->first('voyage', '<p class="help-block">:message</p>') !!}
                    </div>
                    
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('product') ?  'has-error' : ''}}">
                    <label for="Product"><i class="fa fa-plus-circle" data-toggle="modal" data-target="#myModal2" aria-hidden="true"></i>
                     Product</label>
                    <span class="error"> * </span>
                    <div class="select">
                        {!! Form::select('product', ['' => 'Select Product'] + $page_data['products']->toArray() , null, ['id'=>'product','class' => 'form-control arr']) !!}
                        {!! $errors->first('product', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('product_detail') ?  'has-error' : ''}}">
                    <label for="Product Details">Product Details</label>
                    <span class="error"> * </span>
                    {!! Form::text('product_detail', null, array('id'=>'product_details','placeholder' => 'Product Details','class' => 'form-control')) !!}
                    {!! $errors->first('product_detail', '<p class="help-block">:message</p>') !!} 
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('unit_price') ?  'has-error' : ''}}">
                    <label for="Unit Price">Unit Price</label>
                    {!! Form::text('unit_price', null, ['id'=>'unit_price','placeholder' => 'Unit Price','class' => 'form-control']) !!}
                    {!! $errors->first('unit_price', '<p class="help-block">:message</p>') !!} 
                </div>
                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('product_value') ?  'has-error' : ''}}">
                    <label for="Product Value">Product Value</label>
                    <span class="error"> * </span>
                    {!! Form::text('product_value', null, array('placeholder' => 'Product Value','class' => 'form-control','id'=>'product_value')) !!}
                    {!! $errors->first('product_value', '<p class="help-block">:message</p>') !!} 
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('hazardous') ?  'has-error' : ''}}">
                    <label for="Hazardous">Hazardous</label>
                    <div class="select">
                        {!! Form::select('hazardous',['' => 'Select Hazard'] + $page_data['hazardous_list']->toArray(), null, ['class' => 'form-control arr','id'=>'hazardChange']) !!}
                        {!! $errors->first('hazardous', '<p class="help-block">:message</p>') !!}
                    </div>
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('unno_imo') ?  'has-error' : ''}} ">
                    <label for="UNNO/IMO">UNNO/IMO</label>
                    <div class="select">
                        {!! Form::select('unno_imo', ['' => 'Select Unno/IMO'] , null, ['class' => 'form-control arr','id'=>'unno']) !!}
                        {!! $errors->first('unno_imo', '<p class="help-block">:message</p>') !!}
                    </div>  
                </div>

                <div class="form-group col-lg-4 col-md-6 col-sm-6 {{ $errors->has('msds') ?  'has-error' : ''}}">
                    <label for="MSDS">MSDS</label>
                    {!! Form::text('msds', null, array('placeholder' => 'MSDS','class' => 'form-control')) !!}
                    {!! $errors->first('msds', '<p class="help-block">:message</p>') !!} 
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
            
    <section class="conatinrised-form">
        <div class="container">
            <div class="row">
                <div class="col-md-12 last-heading">
                    <ul class="nav nav-pills">
                      <li class="active">
                        <a href="#1a" data-toggle="tab" aria-expanded="false" class="cargo_type">Containarized</a>
                      </li>
                      <li class=""><a href="#2a" data-toggle="tab" aria-expanded="false" class="cargo_type">Break Bulk</a>
                      </li>
                      <li class=""><a href="#3a" data-toggle="tab" aria-expanded="false" class="cargo_type">LCL/Airfreight</a>
                      </li>
                      <li><a href="#4a" data-toggle="tab" aria-expanded="true" class="cargo_type">OOG</a>
                      </li>
                    </ul>
                </div>
                <div class="tab-content clearfix">
                    <div class="input_fields_wrap tab-pane active" id="1a">
                        <div class="containersixed-table containarized">
                        <!-- <h4>Containarized</h4> -->
                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('container') ?  'has-error' : ''}}">
                            <label for="container">Container</label>
                            {!! Form::text('con_container', null, array('placeholder' => 'Container','class' => 'form-control test_validate','id'=>'container','maxlength'=>'11')) !!}
                            {!! $errors->first('con_container', '<p class="help-block">:message</p>') !!} 
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('size') ?  'has-error' : ''}}">
                            <label for="size">Size</label>
                            <div class="select">
                            {!! Form::select('size', [''=>'Select Size','20'=>'20`','40'=>'40`'] , null, ['class' => 'form-control arr','id'=>'size']) !!}
                            {!! $errors->first('size', '<p class="help-block">:message</p>') !!} 
                            </div>
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('size_type') ?  'has-error' : ''}}">
                            <label for="size_type">Size Type</label>
                            <div class="select">
                            {!! Form::select('size_type', [''=>'Select Size Type'] + $page_data['size']->toArray() , null, ['class' => 'form-control arr','id'=>'size_type']) !!}
                            {!! $errors->first('size_type', '<p class="help-block">:message</p>') !!} 
                            </div>
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('seal') ?  'has-error' : ''}}">
                            <label for="seal">Seal Nr</label>
                            {!! Form::text('seal', null, array('placeholder' => 'Seal','class' => 'form-control test_validate','id'=>'seal')) !!}
                            {!! $errors->first('seal', '<p class="help-block">:message</p>') !!} 
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('other_seal') ?  'has-error' : ''}}">
                            <label for="other_seal">Other Seal</label>
                            {!! Form::text('other_seal', null, array('placeholder' => 'Seal Other','class' => 'form-control','id'=>'other_seal')) !!}
                            {!! $errors->first('other_seal', '<p class="help-block">:message</p>') !!} 
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('con_quantity') ?  'has-error' : ''}}">
                            <label for="con_quantity">Cargo Qty</label>
                            {!! Form::text('con_quantity', null, array('placeholder' => 'Quantity','class' => 'form-control test_validate','id'=>'con_quantity')) !!}
                            {!! $errors->first('con_quantity', '<p class="help-block">:message</p>') !!}
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('con_packaging') ?  'has-error' : ''}}">
                            <label for="con_packaging">Packaging</label>
                            {!! Form::text('con_packaging', null, array('placeholder' => 'Packaging','class' => 'form-control test_validate','id'=>'con_packaging')) !!}
                            {!! $errors->first('con_packaging', '<p class="help-block">:message</p>') !!}
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('con_weight') ?  'has-error' : ''}}">
                        <label for="con_weight">Weight (Tons)</label>
                        {!! Form::text('con_weight', null, array('placeholder' => 'Weight','class' => 'form-control test_validate','id'=>'con_weight')) !!}
                        {!! $errors->first('con_weight', '<p class="help-block">:message</p>') !!} 
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('con_remark') ?  'has-error' : ''}}">
                        <label for="con_remark">Remarks</label>
                        {!! Form::text('con_remark', null, array('placeholder' => 'Remark','class' => 'form-control','id'=>'con_remark')) !!}
                        {!! $errors->first('con_remark', '<p class="help-block">:message</p>') !!} 
                        </div>
                        <button type="button" class="add_field_button" onclick="AddContanarisedData()"><i class="fa fa-plus" aria-hidden="true"></i></button>
                        <!--<div class="divider"></div>-->
                        <div class="table-containrised table-responsive">
                            <table id="containarized" class="table">
                                <thead>
                                    <tr>
                                      <th>Container</th> 
                                      <th>Size</th>
                                      <th>Size Type</th> 
                                      <th>Seal</th>                        
                                      <th>Other Seal</th>                     
                                      <th>Quantity</th>  
                                      <th>Packaging</th>
                                      <th>Weight</th>
                                      <th>Remark</th>
                                      <th>Action</th>                  
                                    </tr>
                                </thead>         
                                <tbody>
                                </tbody>
                                <tfoot>
                                    <tr>
                                      <td class="border_bottom"></td> 
                                      <td class="border_bottom"></td> 
                                      <td class="border_bottom"></td>                        
                                      <td class="border_bottom"></td>                     
                                      <td class="border_bottom"></td>  
                                      <td class="border_bottom"></td>
                                      <td class="border_bottom"></td>
                                      <td class="border_bottom"></td>
                                      <td class="border_bottom"></td>                  
                                    </tr>
                                    <tr>
                                    <tr>
                                      <td></td> 
                                      <td>Total</td> 
                                      <td></td>                        
                                      <td>20</td>                     
                                      <td class="con20_total_qty"></td>  
                                      <td></td>
                                      <td class="con20_total_weight"></td>
                                      <td></td>                  
                                    </tr>
                                    <tr>
                                      <td></td> 
                                      <td>Total</td> 
                                      <td></td>                        
                                      <td>40</td>                     
                                      <td class="con40_total_qty"></td>  
                                      <td></td>
                                      <td class="con40_total_weight"></td>
                                      <td></td>                  
                                    </tr>
                                </tfoot> 
                            </table>
                        </div> 
                       <div class="clearfix"></div>
                       </div>
                    </div>

                    <div class="input_fields_wrap1 tab-pane" id="2a">
                       <div class="containersixed-table break_bulk">
                        <!-- <h4>Break Bulk</h4> -->
                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('bb_cargo_product') ?  'has-error' : ''}}">
                        <label for="cargo_product">Product</label>
                        <div class="select">
                        {!! Form::select('bb_cargoproduct',[""=>"Select Product"] + $page_data['product']->toArray() ,null, array('class' => 'form-control arr', 'id'=>'bb_cargo_product')) !!}
                        {!! $errors->first('bb_cargoproduct', '<p class="help-block">:message</p>') !!} 
                        </div>
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('bb_quantity') ?  'has-error' : ''}}">
                        <label for="bb_quantity">Quantity</label>
                        {!! Form::text('bb_quantity', null, array('placeholder' => 'Quantity','class' => 'form-control','id'=>'bb_quantity')) !!}
                        {!! $errors->first('bb_quantity', '<p class="help-block">:message</p>') !!} 
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('bb_packaging') ?  'has-error' : ''}}">
                            <label for="bb_packaging">Packaging</label>
                            <div class="select">
                                {!! Form::select('bb_packaging', [""=>"Select Packing"] + $page_data['packaging']->toArray(),null, array('class' => 'form-control','id'=>'bb_packaging')) !!}
                                {!! $errors->first('bb_packaging', '<p class="help-block">:message</p>') !!}                                        
                            </div>
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('bb_weight') ?  'has-error' : ''}}">
                        <label for="bb_weight">Weight (TONS)</label>
                        {!! Form::text('bb_weight', null, array('placeholder' => 'Weight','class' => 'form-control','id'=>'bb_weight')) !!}
                        {!! $errors->first('bb_weight', '<p class="help-block">:message</p>') !!}
                        </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('bb_remark') ?  'has-error' : ''}}">
                        <label for="bb_remark">Remarks</label>
                        {!! Form::text('bb_remark', null, array('placeholder' => 'Remark','class' => 'form-control','id'=>'bb_remark')) !!}
                        {!! $errors->first('bb_remark', '<p class="help-block">:message</p>') !!} 
                       </div>
                        <button class="add_field_button1" type="button" onclick="AddBreakBulkData()"><i class="fa fa-plus" aria-hidden="true"></i> </button>
                        <!-- <div class="divider"></div> -->
                        <div class="table-containrised table-responsive">
                            <table id="break_bulk" class="table">
                                <thead>
                                    <tr>
                                      <th>Product</th> 
                                      <th>Quantity</th> 
                                      <th>Packaging</th>                        
                                      <th>Weight</th>
                                      <th>Remark</th>
                                      <th>Action</th>                  
                                    </tr>
                                </thead>         
                                <tbody>
                                   
                                </tbody>
                                <tfoot>
                                    <tr><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td></tr>
                                    <tr><td>Total</td><td class="bb_total_qty"></td><td></td><td class="bb_total_weight"></td></tr>
                                </tfoot>
                            </table>
                        </div> 

                       <div class="clearfix"></div>
                       </div>
                    </div>

                    <div class="input_fields_wrap-lcl tab-pane" id="3a">
                        <div class="containersixed-table lcl">
                        <!-- <h4>LCL</h4> -->
                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_cargo_product') ?  'has-error' : ''}}">
                        <label for="lcl_cargo_product">Product</label>
                        <div class="select">
                        {!! Form::select('lcl_cargoproduct', [""=>"Select Product"] + $page_data['product']->toArray(),null, array('class' => 'form-control','id'=>'lcl_cargo_product')) !!}
                        {!! $errors->first('lcl_cargoproduct', '<p class="help-block">:message</p>') !!} 
                        </div>
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_quantity') ?  'has-error' : ''}}">
                        <label for="lcl_quantity">Quantity</label>
                         {!! Form::text('lcl_quantity', null, array('placeholder' => 'Quantity','class' => 'form-control','id'=>'lcl_quantity')) !!}
                         {!! $errors->first('lcl_quantity', '<p class="help-block">:message</p>') !!} 
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_packaging') ?  'has-error' : ''}}">
                        <label for="lcl_packaging">Packaging</label>
                        <div class="select">
                        {!! Form::select('lcl_packaging',[""=>"Select Packing"] + $page_data['packaging']->toArray(),null, array('class' => 'form-control arr','id'=>'lcl_packaging')) !!}
                        {!! $errors->first('lcl_quantity', '<p class="help-block">:message</p>') !!} 
                        </div>
                       </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_length') ?  'has-error' : ''}}">
                        <label for="lcl_length">Length</label>
                        {!! Form::text('lcl_length', null, array('placeholder' => 'Length','class' => 'form-control','id'=>'lcl_length')) !!}
                        {!! $errors->first('lcl_length', '<p class="help-block">:message</p>') !!}
                       </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_width') ?  'has-error' : ''}}">
                        <label for="lcl_width">Width</label>
                        {!! Form::text('lcl_width', null, array('placeholder' => 'Width','class' => 'form-control','id'=>'lcl_width')) !!}
                        {!! $errors->first('lcl_width', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_height') ?  'has-error' : ''}}">
                        <label for="lcl_height">Height</label>
                        {!! Form::text('lcl_height', null, array('placeholder' => 'Height','class' => 'form-control','id'=>'lcl_height')) !!}
                        {!! $errors->first('lcl_height', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_weight') ?  'has-error' : ''}}">
                        <label for="lcl_weight">Weight</label>
                        {!! Form::text('lcl_weight', null, array('placeholder' => 'Weight','class' => 'form-control','id'=>'lcl_weight')) !!}
                        {!! $errors->first('lcl_weight', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('lcl_cbm') ?  'has-error' : ''}}">
                        <label for="lcl_cbm">CBM</label>
                        {!! Form::text('lcl_cbm', null, array('placeholder' => 'CBM','class' => 'form-control','id'=>'lcl_cbm')) !!}
                        {!! $errors->first('lcl_cbm', '<p class="help-block">:message</p>') !!}
                       </div>
                        <button class="add_field_button-lcl" type="button" onclick="AddlclData()"><i class="fa fa-plus" aria-hidden="true"></i></button>
                        <!-- <div class="divider"></div> -->
                        <div class="table-containrised table-responsive">
                            <table id="lcl" class="table">
                                <thead>
                                    <tr>
                                      <th>Product</th> 
                                      <th>Quantity</th> 
                                      <th>Packaging</th>
                                      <th>Length</th>
                                      <th>Width</th>
                                      <th>Height</th>                        
                                      <th>Weight</th>
                                      <th>Cbm</th> 
                                      <th>Action</th>                 
                                    </tr>
                                </thead>         
                                <tbody>
                                </tbody>
                                <tfoot>
                                    <tr><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td></tr>
                                    <tr><td>Total</td><td class="lcl_total_qty"></td><td></td><td></td><td></td><td></td><td class="lcl_total_weight"></td><td></td></tr>
                                </tfoot>
                            </table>
                        </div> 
                       <div class="clearfix"></div>
                      </div>
                    </div>

                    <div class="input_fields_wrap-oog tab-pane" id="4a">
                      <div class="containersixed-table oog">
                       <!--  <h4>OOG</h4> -->
                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_cargo_product') ?  'has-error' : ''}}">
                        <label for="og_cargo_product">Product</label>
                        <div class="select">
                        {!! Form::select('og_cargoproduct',[""=>"Select Product"] + $page_data['product']->toArray(), null, array('class' => 'form-control arr','id'=>'og_cargo_product')) !!}
                        {!! $errors->first('og_cargoproduct', '<p class="help-block">:message</p>') !!} 
                        </div>
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_quantity') ?  'has-error' : ''}}">
                        <label for="og_quantity">Quantity</label>
                         {!! Form::text('og_quantity', null, array('placeholder' => 'Quantity','class' => 'form-control','id'=>'og_quantity')) !!}
                         {!! $errors->first('og_quantity', '<p class="help-block">:message</p>') !!} 
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_packaging') ?  'has-error' : ''}}">
                        <label for="og_packaging">Packaging</label>
                        <div class="select">
                        {!! Form::select('og_packaging',[""=>"Select Packing"] + $page_data['packaging']->toArray(), null, array('class' => 'form-control arr','id'=>'og_packaging')) !!}
                        {!! $errors->first('og_packaging', '<p class="help-block">:message</p>') !!} 
                        </div>
                       </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_length') ?  'has-error' : ''}}">
                        <label for="og_length">Length</label>
                        {!! Form::text('og_length', null, array('placeholder' => 'Length','class' => 'form-control','id'=>'og_length')) !!}
                        {!! $errors->first('og_length', '<p class="help-block">:message</p>') !!}
                       </div>

                        <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_width') ?  'has-error' : ''}}">
                        <label for="og_width">Width</label>
                        {!! Form::text('og_width', null, array('placeholder' => 'Width','class' => 'form-control','id'=>'og_width')) !!}
                        {!! $errors->first('og_width', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_height') ?  'has-error' : ''}}">
                        <label for="og_height">Height</label>
                        {!! Form::text('og_height', null, array('placeholder' => 'Height','class' => 'form-control','id'=>'og_height')) !!}
                        {!! $errors->first('og_height', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_weight') ?  'has-error' : ''}}">
                        <label for="og_weight">Weight</label>
                        {!! Form::text('og_weight', null, array('placeholder' => 'Weight','class' => 'form-control','id'=>'og_weight')) !!}
                        {!! $errors->first('og_weight', '<p class="help-block">:message</p>') !!}
                       </div>

                       <div class="form-group col-md-4 col-sm-4 {{ $errors->has('og_cbm') ?  'has-error' : ''}}">
                        <label for="og_cbm">CBM</label>
                        {!! Form::text('og_cbm', null, array('placeholder' => 'CBM','class' => 'form-control','id'=>'og_cbm')) !!}
                        {!! $errors->first('og_cbm', '<p class="help-block">:message</p>') !!}
                       </div>
                        <button class="add_field_button-oog" type="button" onclick="AddOggData()"><i class="fa fa-plus" aria-hidden="true"></i></button>
                        <!-- <div class="divider"></div> -->
                        <div class="table-containrised table-responsive">
                            <table id="oog" class="table">
                                <thead>
                                    <tr>
                                      <th>Product</th> 
                                      <th>Quantity</th> 
                                      <th>Packaging</th>
                                      <th>Length</th>
                                      <th>Width</th>
                                      <th>Height</th>                        
                                      <th>Weight</th>
                                      <th>Cbm</th>
                                      <th>Action</th>                  
                                    </tr>
                                </thead>         
                                <tbody>
                                </tbody>
                                <tfoot>
                                    <tr><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td><td class="border_bottom"></td></tr>    
                                    <tr><td>Total</td><td class="og_total_qty"></td><td></td><td></td><td></td><td></td><td class="og_total_weight"></td><td></td></tr>
                                </tfoot>                        
                            </table>
                        </div> 
                       <div class="clearfix"></div>
                      </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class="form-group submit-btn">
        <input type="submit" value="save">
    </div>
    {!! Form::close() !!}
    </div>
    </div> 
</section>

<div class="data-modal modal fade" id="myModal" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <div class="modal-body">
                {!! Form::open(['url' => '/logistic/order/shipper', 'id' => 'shipperform', 'class' => 'form-vertical', 'files' => true]) !!}
                    
                <div class="row-fluid size">
                    <h5>Add New Shipper / Consignee / Notify</h5>
                    <br/>
                    <div class="form-group col-md-12 col-sm-12 {{ $errors->has('name') ?  'has-error' : ''}}">
                        {!! Form::text('name', null, array('placeholder' => 'Name','class' => 'form-control','id'=>'name')) !!}
                        {!! $errors->first('name', '<p class="help-block">:message</p>') !!}
                    </div>
                    <br/>
                    <div class="form-group col-md-12 col-sm-12 {{ $errors->has('type') ?  'has-error' : ''}}">
                        <div class="select">
                        <select id="typeSelectId" class="form-control js-select-type-multiple" name="type[]" multiple="multiple">
                          <option value="shipper">Shipper</option>
                          <option value="consignee">Consignee</option>
                          <option value="notify">Notify</option>
                        </select>
                        {!! $errors->first('type', '<p class="help-block">:message</p>') !!}
                        </div>
                    </div>
                    <input type="hidden" name="status" value="0">    
                    <br/>
                    <div class="form-group submit-btn shipper-btn">
                        <input type="submit" value="save">
                    </div>
               </div>
                {!! Form::close() !!}
            </div>
        </div>     
    </div>
</div>
<div class="data-modal modal fade" id="myModal2" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <div class="modal-body">
                {!! Form::open(['url' => '/logistic/order/product', 'id' => 'productform', 'class' => 'form-vertical', 'files' => true]) !!}
                    
                <div class="row-fluid size">
                    <h5>Add New Product</h5>
                    <br/>
                    <div class="form-group col-md-12 col-sm-12 {{ $errors->has('name') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('name', 'Name<span class="error">*</span>')) !!}</label>
                        {!! Form::text('name', null, array('placeholder' => 'Name','class' => 'form-control','id'=>'name')) !!}
                        {!! $errors->first('name', '<p class="help-block">:message</p>') !!}
                    </div>
                    <br/>
                    <div class="form-group col-md-12 col-sm-12 {{ $errors->has('description') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('description', 'Description<span class="error">*</span>')) !!}</label>
                        {!! Form::textarea('description', null, ['placeholder' => 'Description','class' => 'form-control']) !!}
                        {!! $errors->first('description', '<p class="help-block">:message</p>') !!}
                    </div>
                    <input type="hidden" name="status" value="0">
                    <br/>
                    <div class="form-group submit-btn shipper-btn">
                        <input type="submit" value="save">
                    </div>
               </div>
                {!! Form::close() !!}
            </div>
        </div>     
    </div>
</div>
<div class="data-modal modal fade" id="myModal3" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <div class="modal-body">
                {!! Form::open(['route' => 'logistic.order.customer.create', 'id' => 'customerform', 'class' => 'form-vertical', 'files' => true]) !!}
                    
                <div class="row-fluid size">
                    <h5>Add New Customer</h5>
                    <br/>
                    <div class="form-group col-sm-3 {{ $errors->has('name') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('name', 'Name<span class="error">*</span>')) !!}</label>
                        {!! Form::text('name', null, array('placeholder' => 'Name','class' => 'form-control','id'=>'name')) !!}
                        {!! $errors->first('name', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group col-sm-3 {{ $errors->has('company_name') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('company_name', 'Company Name<span class="error">*</span>')) !!}</label>
                        {!! Form::text('company_name', null, array('placeholder' => 'Company Name','class' => 'form-control','id'=>'company_name')) !!}
                        {!! $errors->first('company_name', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group col-sm-3 {{ $errors->has('landLine_no') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('landLine_no', 'Landline No<span class="error">*</span>')) !!}</label>
                        {!! Form::number('landLine_no', null, array('placeholder' => 'Landline No','class' => 'form-control','id'=>'landLine_no')) !!}
                        {!! $errors->first('landLine_no', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group col-sm-3 {{ $errors->has('phone_no') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('phone_no', 'Phone No<span class="error">*</span>')) !!}</label>
                        {!! Form::number('phone_no', null, array('placeholder' => 'Phone No','class' => 'form-control','id'=>'phone_no')) !!}
                        {!! $errors->first('phone_no', '<p class="help-block">:message</p>') !!}
                    </div>
                    <br>
                    <div class="form-group col-sm-3 {{ $errors->has('fax_no') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('fax_no', 'Fax No')) !!}</label>
                        {!! Form::number('fax_no', null, array('placeholder' => 'Fax No','class' => 'form-control','id'=>'fax_no')) !!}
                        {!! $errors->first('fax_no', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group col-sm-3 {{ $errors->has('email') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('email', 'Email')) !!}</label>
                        {!! Form::text('email', null, array('placeholder' => 'Email','class' => 'form-control','id'=>'email')) !!}
                        {!! $errors->first('email', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group col-sm-3 {{ $errors->has('website') ?  'has-error' : ''}}">
                        <label class="control-label">{!! Html::decode(Form::label('website', 'Website')) !!}</label>
                        {!! Form::text('website', null, array('placeholder' => 'Website','class' => 'form-control','id'=>'website')) !!}
                        {!! $errors->first('website', '<p class="help-block">:message</p>') !!}
                    </div>
                    <div class="form-group customer-save-btn" style="margin-top: 9.4%;">
                        <input type="hidden" name="status" value="0">
                        <input type="submit" value="Apply">
                    </div>
                    <br/>
                </div>
                {!! Form::close() !!}
            </div>
        </div>     
    </div>
</div>
<script>
    $(document).ready(function () {

        $('.submit-btn').hide();

        $('#bb_packaging').change(function(){
            var qty = $('#bb_quantity').val() ? $('#bb_quantity').val() : 0;
            var pack = $(this).val();
            var pack_val = parseInt(pack.replace('Kgs Bag',''));
            var bb_tons = (qty*pack_val);
            $('#bb_weight').val(bb_tons);
        });

        $('#bb_quantity').change(function(){
            var qty = $(this).val();
            var pack = $('#bb_packaging').val() ? $('#bb_packaging').val() : 0;
            var pack_val = parseInt(pack.replace('Kgs Bag',''));
            var bb_tons = (qty*pack_val)/1000;
            $('#bb_weight').val(bb_tons);
        });

        $('#lcl_length').change(function(){
            var l = $(this).val();
            var w = $('#lcl_width').val()  ? $('#lcl_width').val()  : 0;
            var h = $('#lcl_height').val() ? $('#lcl_height').val() : 0;
            var rst = (l*w*h);
            $('#lcl_cbm').val(rst);
        });

        $('#lcl_width').change(function(){
            var l = $('#lcl_length').val()  ? $('#lcl_length').val()  : 0;
            var w = $(this).val();
            var h = $('#lcl_height').val() ? $('#lcl_height').val() : 0;
            var rst = (l*w*h);
            $('#lcl_cbm').val(rst);
        });

        $('#lcl_height').change(function(){
            var l = $('#lcl_length').val()  ? $('#lcl_length').val()  : 0;
            var w = $('#lcl_width').val()  ? $('#lcl_width').val()  : 0;
            var h = $(this).val();
            var rst = (l*w*h);
            $('#lcl_cbm').val(rst);
        });

        $('#og_length').change(function(){
            var l = $(this).val();
            var w = $('#og_width').val()  ? $('#og_width').val()  : 0;
            var h = $('#og_height').val() ? $('#og_height').val() : 0;
            var rst = (l*w*h);
            $('#og_cbm').val(rst);
        });

        $('#og_width').change(function(){
            var l = $('#og_length').val()  ? $('#og_length').val()  : 0;
            var w = $(this).val();
            var h = $('#og_height').val() ? $('#og_height').val() : 0;
            var rst = (l*w*h);
            $('#og_cbm').val(rst);
        });

        $('#og_height').change(function(){
            var l = $('#og_length').val()  ? $('#og_length').val()  : 0;
            var w = $('#og_width').val()  ? $('#og_width').val()  : 0;
            var h = $(this).val();
            var rst = (l*w*h);
            $('#og_cbm').val(rst);
        });

        $('.trigger_chk').change(function() {
            if($(this).is(':checked')) {
                var value = $(this).val();
                $('#file'+value+'').prop('required',true);
            } else {
                var value = $(this).val();
                $('#file'+value+'').prop('required',false);
                 $('#file'+value+'').next(".help-block").hide();
            }
        });     

        $('#con_quantity').attr('readonly',true);
        $('#con_packaging').attr('readonly',true);
        $('#con_quantity').val('1');
        $('#con_packaging').val('0');
        $('#con_quantity').closest('.form-group').removeClass('has-error');
        $('#con_packaging').closest('.form-group').removeClass('has-error');

        var services = [];
        $('.styled').change(function () {
            services = $("input[name='services[]']:checked").map(function (i) {
                return $(this).val();
            }).get();

            // console.log(services);
            if($.inArray('packing', services) > -1 || $.inArray('unpacking', services) > -1){
                $('#con_quantity').attr('readonly',false);
                $('#con_packaging').attr('readonly',false);
                $('#con_quantity').val('');
                $('#con_packaging').val('');  
            }else {
                $('#con_quantity').attr('readonly',true);
                $('#con_packaging').attr('readonly',true);
                $('#con_quantity').val('1');
                $('#con_packaging').val('0');
                $('#con_quantity').closest('.form-group').removeClass('has-error');
                $('#con_packaging').closest('.form-group').removeClass('has-error');

            }
       
        });

        $("#product_value,#unit_price,#con_quantity,#con_weight,#bb_quantity,#bb_weight,#lcl_quantity,#lcl_length,#lcl_width,#lcl_height,#lcl_weight,#og_quantity,#og_weight,#og_length,#og_width,#og_height").keydown(function (e) {
            // Allow: backspace, delete, tab, escape, enter and .
            if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
                 // Allow: Ctrl+A, Command+A
                (e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) || 
                 // Allow: home, end, left, right, down, up
                (e.keyCode >= 35 && e.keyCode <= 40)) {
                     // let it happen, don't do anything
                     return;
            }
            // Ensure that it is a number and stop the keypress
            if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
                e.preventDefault();
            }
        });

        
        $('#shipperform').validate({
            highlight: function(element) {
                $(element).closest('.form-group').addClass('has-error');
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function(element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            focusInvalid: false, // do not focus the last invalid input
            ignore: "", // validate all fields including form hidden input
            rules: {
                'name': {
                   required: true,
                },
                'type[]': {
                   required: true,
                },
            },
            errorPlacement: function (error, element) {
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            },
            messages: {
                'name' : {
                    required : "The Name field is required",
                },
                'type[]' : {
                    required : "The Type field is required",
                },
            }
        });
        
        $('#myform').validate( {
            highlight: function(element) {
                $(element).closest('.form-group').addClass('has-error');
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function(element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            focusInvalid: false, // do not focus the last invalid input
            ignore: "", // validate all fields including form hidden input
            rules: {
                'shipper': {
                   required: true,
                },
                'shipping_ref': {
                   required: true,
                },
                'port_agent': {
                   required: true,
                },
                'consignee': {
                   required: true,
                },
                'consignee_ref': {
                   required: true,
                },
                'customer' : {
                   required: true,
                },
                'customer_ref' : {
                   required: true,
                },
                'shipping_line' : {
                    required : true,
                },
                'booking_no' : {
                    required: true,
                },
                'booking_ref' : {
                    required: true,
                },
                'bill_of_lading' : {
                    required:true,
                },
                'loading_port' : {
                    required: true,
                },
                'discharge_port' : {
                    required: true,
                },
                'destination' : {
                    required: true,
                },
                'origin' : {
                    required: true,
                },
                'product' : {
                    required:true,
                },
                'product_detail' : {
                    required: true,
                },
                'product_value' : {
                    required : true,
                },
                'services[]': {
                    required: true,
                },
           },
           errorPlacement: function (error, element) {
         
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    if (element.attr("name") == "services[]") {
                        error.appendTo('.service-error');
                    } else{
                        error.insertAfter(element);
                    }
                }
           },
           messages: {
                'shipper' : {
                    required: "The shipper field is required",
                },
                'shipping_ref' : {
                   required: "The shipping ref field is required",
                },
                'port_agent' : {
                   required: "The port agent field is required",
                },
                'consignee' : {
                   required: "The consignee field is required",
                },
                'consignee_ref' : {
                   required: "The consignee ref field is required",
                },
                'customer' : {
                   required: "The customer field is required",
                },
                'customer_ref' : {
                   required: "The customer ref field is required",
                },
                'shipping_line' : {
                    required : "The shipping line field is required",
                },
                'booking_no' : {
                    required: "The booking no field is required",
                },
                'booking_ref' : {
                    required: "The booking ref field is required",
                },
                'bill_of_lading' : {
                    required:"The lading bill field is required",
                },
                'loading_port' : {
                    required: "The loading port field is required",
                },
                'discharge_port' : {
                    required: "The discharge port field is required",
                },
                'destination' : {
                    required: "The destination field is required",
                },
                'origin' : {
                    required: "The origin field is required",
                },
                'product' : {
                    required: "The product field is required",
                },
                'product_detail' : {
                    required: "The product detail field is required",
                },
                'product_value' : {
                    required : "The product value field is requireds",
                },
                'services[]': {
                    required: "The service field is required",
                },
            },
            focusInvalid: false,
            invalidHandler: function(form, validator) {

                if (!validator.numberOfInvalids())
                    return;

                $('html, body').animate({
                    scrollTop: $(validator.errorList[0].element).offset().top
                }, 2000);

            }
       });

        $('#productform').validate({
            highlight: function(element) {
                $(element).closest('.form-group').addClass('has-error');
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function(element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            focusInvalid: false, // do not focus the last invalid input
            ignore: "", // validate all fields including form hidden input
            rules: {
                'name': {
                   required: true,
                },
                'description': {
                   required: true,
                },
            },
            errorPlacement: function (error, element) {
                if(element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            },
            messages: {
                'name' : {
                    required : "The Name field is required",
                },
                'description' : {
                    required : "The Description field is required",
                },
            }
        });

        $('.js-select-type-multiple').select2({
            placeholder: "Select Type"
        });

        $('#customerform').validate( {
            highlight: function(element) {
                jQuery(element).closest('.control-group').addClass('error');
                jQuery(element).closest('.control-group').addClass('error');
            },
            unhighlight: function(element) {
                jQuery(element).closest('.control-group').removeClass('error');
            },
            errorElement: 'span',
            errorClass: 'help-block',
            focusInvalid: false, // do not focus the last invalid input
            ignore: "", // validate all fields including form hidden input
            rules: {
                'name': {
                   required: true,
                },
                'company_name': {
                   required: true,
                },
                'phone_no': {
                  required : true,
                },
                'landLine_no': {
                  required : true,
                },
                'email': {
                  email    : true, 
                },
                'website': {
                  url      : true,
                },
                'status': {
                  required: true,
                },
           },
           messages: {
                'name' : {
                    required: "The name field is required",
                },
                'company_name': {
                   required: "The company name field is required",
                },
                'phone_no': {
                   required : "The phone no field is required",
                },
                'landLine_no': {
                  required : "The landline no field is required",
                },
                'email': {
                  email    : "Enter valid email address",
                },
                'website': {
                  url      : "Enter valid url like http://www.xyz.com",
                },
                'status' : {
                   required: "The status field is required",
                }
            }
        });
    });
</script>
<!--script-->
<script type="text/javascript">
    
    var con20_qty = [];
    var con20_wgt = [];
    var con40_qty = [];
    var con40_wgt = [];
    
    var bb_qty = [];
    var bb_wgt = [];
    var lcl_qty = [];
    var lcl_wgt = [];
    var og_qty = [];
    var og_wgt = [];

    var Exp = /((^[0-9]+[a-z]+)|(^[a-z]+[0-9]+))+[0-9a-z]+$/i;

    var xx  = [];
    var bb = [];
    var ll = [];
    var oo = [];

    $(document).on('click','.remove_data', function(e) {
            e.preventDefault();
          var id = $(this).attr('data-id');
          var size = $(this).attr('data-size');
          var qty = $(this).attr('data-quantity');
          var weight = $(this).attr('data-weight');
          var trqty = $('.con20_total_qty').text();
          var weightt = $('.con20_total_weight').text();
          var tr4qty = $('.con40_total_qty').text();
          var tr4weight = $('.con40_total_weight').text();
            if(size == '20') {
                var total20conqty = trqty - qty ;
                var total20conweight= weightt - weight;
                if(total20conqty == '0'){
                    $('.con20_total_qty').html('');
                    $('.con20_total_weight').html('');
                }else{
                    $('.con20_total_qty').html(total20conqty);
                    $('.con20_total_weight').html(total20conweight);
                    con20_qty.splice($.inArray(qty, con20_qty), 1);
                    con20_wgt.splice($.inArray(weight, con20_wgt), 1);
                    // con20_qty.pop(qty);
                    // con20_wgt.pop(weight);
                }
            } else {
                var total40conqty = tr4qty - qty ;
                var total40conweight= tr4weight - weight;
                if(total40conqty == '0') {
                    $('.con40_total_qty').html('');
                    $('.con40_total_weight').html('');
                }else{
                    $('.con40_total_qty').html(total40conqty);
                    $('.con40_total_weight').html(total40conweight);
                    con40_qty.splice($.inArray(qty, con40_qty), 1);
                    con40_wgt.splice($.inArray(weight, con40_wgt), 1);
                    // con40_qty.pop(qty);
                    // con40_wgt.pop(weight);
                }
            }
          if(id) {
            $('input[type="hidden"][name="container['+id+']"]').remove();
            $('input[type="hidden"][name="size['+id+']"]').remove();
            $('input[type="hidden"][name="size_type['+id+']"]').remove();
            $('input[type="hidden"][name="seal['+id+']"]').remove();
            $('input[type="hidden"][name="other_seal['+id+']"]').remove();
            $('input[type="hidden"][name="con_quantity['+id+']"]').remove();
            $('input[type="hidden"][name="con_packaging['+id+']"]').remove();
            $('input[type="hidden"][name="con_weight['+id+']"]').remove();
            $('input[type="hidden"][name="con_remark['+id+']"]').remove();
            $(this).closest("tr").remove();
          }

        });

        $(document).on('click','.remove_break_data', function(e) {
            e.preventDefault();
            var id = $(this).attr('data-id');
            var qty = $(this).attr('data-quantity');
            var weight = $(this).attr('data-weight');
            var trqty = $('.bb_total_qty').text();
            var trweight = $('.bb_total_weight').text();
            if(qty) {
              var total_qty = trqty - qty;
              var total_weight = trweight - weight;
              if(total_qty == '0'){
                $('.bb_total_qty').html('');
                $('.bb_total_weight').html('');
              }else {
                $('.bb_total_qty').html(total_qty);
                $('.bb_total_weight').html(total_weight);
                bb_qty.splice($.inArray(qty, bb_qty), 1);
                bb_wgt.splice($.inArray(weight, bb_wgt), 1);
                // bb_qty.pop(qty);
                // bb_wgt.pop(weight);
              }
            }
            if(id) {
                $('input[type="hidden"][name="bb_cargo_product['+id+']"]').remove();
                $('input[type="hidden"][name="bb_quantity['+id+']"]').remove();
                $('input[type="hidden"][name="bb_packaging['+id+']"]').remove();
                $('input[type="hidden"][name="bb_weight['+id+']"]').remove();
                $('input[type="hidden"][name="bb_remark['+id+']"]').remove();
                $(this).closest("tr").remove();
            }

        });

        $(document).on('click','.remove_lcl_data', function(e) {
            e.preventDefault();
            var id = $(this).attr('data-id');
            var qty = $(this).attr('data-quantity');
            var weight = $(this).attr('data-weight');
            var trqty = $('.lcl_total_qty').text();
            var trweight = $('.lcl_total_weight').text();
            if(qty) {
              var total_qty = trqty - qty;
              var total_weight = trweight - weight;
              if(total_qty == '0'){
                $('.lcl_total_qty').html('');
                $('.lcl_total_weight').html('');
              }else {
                $('.lcl_total_qty').html(total_qty);
                $('.lcl_total_weight').html(total_weight);
                lcl_qty.splice($.inArray(qty, lcl_qty), 1);
                lcl_wgt.splice($.inArray(weight, lcl_wgt), 1);
                // lcl_qty.pop(qty);
                // lcl_wgt.pop(weight);
              }
            }
            if(id) {
                $('input[type="hidden"][name="lcl_cargo_product['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_quantity['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_length['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_width['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_height['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_packaging['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_weight['+id+']"]').remove();
                $('input[type="hidden"][name="lcl_cbm['+id+']"]').remove();
                $(this).closest("tr").remove();
            }

        });

        $(document).on('click','.remove_oog_data', function(e) {
            e.preventDefault();
            var id = $(this).attr('data-id');
            var qty = $(this).attr('data-quantity');
            var weight = $(this).attr('data-weight');
            var trqty = $('.og_total_qty').text();
            var trweight = $('.og_total_weight').text();
            if(qty) {
              var total_qty = trqty - qty;
              var total_weight = trweight - weight;
              if(total_qty == '0'){
                $('.og_total_qty').html('');
                $('.og_total_weight').html('');
              }else {
                $('.og_total_qty').html(total_qty);
                $('.og_total_weight').html(total_weight);
                og_qty.splice($.inArray(qty, og_qty), 1);
                og_wgt.splice($.inArray(weight, og_wgt), 1);
                // og_qty.pop(qty);
                // og_wgt.pop(weight);
              }
            }
            if(id) {
                $('input[type="hidden"][name="og_cargo_product['+id+']"]').remove();
                $('input[type="hidden"][name="og_quantity['+id+']"]').remove();
                $('input[type="hidden"][name="og_length['+id+']"]').remove();
                $('input[type="hidden"][name="og_width['+id+']"]').remove();
                $('input[type="hidden"][name="og_height['+id+']"]').remove();
                $('input[type="hidden"][name="og_packaging['+id+']"]').remove();
                $('input[type="hidden"][name="og_weight['+id+']"]').remove();
                $('input[type="hidden"][name="og_cbm['+id+']"]').remove();
                $(this).closest("tr").remove();
            }

        });

    
    function AddContanarisedData() {
        var services = [];
        
        services = $("input[name='services[]']:checked").map(function (i) {
            return $(this).val();
        }).get();

        // console.log(services);
        if($.inArray('packing', services) > -1 || $.inArray('unpacking', services) > -1){
            $('#con_quantity').attr('readonly',false);
            $('#con_packaging').attr('readonly',false);
              
        }else {
            $('#con_quantity').attr('readonly',true);
            $('#con_packaging').attr('readonly',true);
            $('#con_quantity').val('1');
            $('#con_packaging').val('0');
            $('#con_quantity').closest('.form-group').removeClass('has-error');
            $('#con_packaging').closest('.form-group').removeClass('has-error');

        }
       
        var container = document.getElementById("container").value;
        var size = document.getElementById("size").value;  
        var size_type = document.getElementById("size_type").value;  
        var seal = document.getElementById("seal").value;
        var other_seal = document.getElementById("other_seal").value;
        var con_quantity = document.getElementById("con_quantity").value;
        var con_packaging = document.getElementById("con_packaging").value;
        var con_weight = document.getElementById("con_weight").value;
        var con_remark = document.getElementById("con_remark").value;

        $('.containarized .test_validate,.containarized select').each(function() {
            if ($(this).val() == '') {
                $(this).closest('.form-group').addClass('has-error');
            }
        });

        if(!container || !size || !seal || !con_quantity || !con_packaging || !con_weight) {
            return false;
        }
        else
        {
            if(!container.match(Exp))
            {
                alert("Container text should be alphanumeric");
            }
            else
            {
                // var x  = $('#containarized tbody tr').length;
                xx.push(1);
                var x = xx.length;
                inputt= '<button type="button" class="remove_data" data-id='+x+' data-size='+size+' data-quantity='+con_quantity+' data-weight='+con_weight+'><i class="fa fa-remove" aria-hidden="true"></i></button>';
                var rows = "";
                rows += "<td>" + container + "</td><td>" + size + "</td><td>" + size_type + "</td><td>" + seal + "</td><td>" + other_seal + "</td><td>" + con_quantity + "</td><td>" + con_packaging + "</td><td>" + con_weight + "</td><td>" + con_remark + "</td><td>" + inputt + "</td>";
                var tbody = document.querySelector("#containarized tbody");
                var tr = document.createElement("tr");
                tr.innerHTML = rows;
                tbody.appendChild(tr);

                if(size == '20') {
                    con20_qty.push(con_quantity);
                    con20_wgt.push(con_weight); 

                    var total20conqty = con20_qty.length;
                    //var total20conqty = con20_qty.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
                    var total20conweight= con20_wgt.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);

                    $('.con20_total_qty').html(total20conqty);
                    $('.con20_total_weight').html(total20conweight);
                
                } else {
                    con40_qty.push(con_quantity);
                    con40_wgt.push(con_weight); 

                    var total40conqty = con40_qty.length;
                    //var total40conqty = con40_qty.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
                    var total40conweight= con40_wgt.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);

                    $('.con40_total_qty').html(total40conqty); 
                    $('.con40_total_weight').html(total40conweight);
                } 
                //  var x  = $('#containarized tbody tr').length;
                $('.containarized').append('<input type="hidden" name="container['+x+']" value='+container+'><input type="hidden" name="size['+x+']" value='+size+'><input type="hidden" name="size_type['+x+']" value='+size_type+'><input type="hidden" name="seal['+x+']" value='+seal+'><input type="hidden" name="other_seal['+x+']" value='+other_seal+'><input type="hidden" name="con_quantity['+x+']" value='+con_quantity+'><input type="hidden" name="con_packaging['+x+']" value='+con_packaging+'><input type="hidden" name="con_weight['+x+']" value='+con_weight+'><input type="hidden" name="con_remark['+x+']" value='+con_remark+'>');

                if($.inArray('packing', services) > -1 || $.inArray('unpacking', services) > -1){
                    $('#con_quantity').attr('readonly',false);
                    $('#con_packaging').attr('readonly',false);
                    $('#con_quantity').val('');
                    $('#con_packaging').val('');  
                }else {
                    $('#con_quantity').attr('readonly',true);
                    $('#con_packaging').attr('readonly',true);
                    $('#con_quantity').val('1');
                    $('#con_packaging').val('0');
                    $('#con_quantity').closest('.form-group').removeClass('has-error');
                    $('#con_packaging').closest('.form-group').removeClass('has-error');

                }

                $('.submit-btn').show();

                $('#container').val('');
                $('#seal').val('');
                $('#size').val('');
                $('#other_seal').val('');
                $('#con_weight').val('');
                $('#con_remark').val('');
            }         
        }
    }

    function AddBreakBulkData() {
        var bb_cargo_product = document.getElementById("bb_cargo_product").value;
        var bb_quantity = document.getElementById("bb_quantity").value;  
        var bb_packaging = document.getElementById("bb_packaging").value;
        var bb_weight = document.getElementById("bb_weight").value;
        var bb_remark = document.getElementById("bb_remark").value; 

        $('.break_bulk input , .break_bulk select').each(function() {
            if ($(this).val() == '') {
                $(this).closest('.form-group').addClass('has-error');
            }
        });

        if(!bb_cargo_product || !bb_quantity || !bb_packaging || !bb_weight || !bb_remark) {
            return false;
        }
        else
        {    
            bb.push(1);
            var x = bb.length;
            inputt= '<button type="button" class="remove_break_data" data-id='+x+' data-quantity='+bb_quantity+' data-weight='+bb_weight+'><i class="fa fa-remove" aria-hidden="true"></i></button>';
            var rows = "";
            rows += "<td>" + bb_cargo_product + "</td><td>" + bb_quantity + "</td><td>" + bb_packaging + "</td><td>" + bb_weight + "</td><td>" + bb_remark + "</td><td>" + inputt + "</td>";
            var tbody = document.querySelector("#break_bulk tbody");
            var tr = document.createElement("tr");
            tr.innerHTML = rows;
            tbody.appendChild(tr);
            
            bb_qty.push(bb_quantity);
            bb_wgt.push(bb_weight);
            var totalqty = bb_qty.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            var totalweight= bb_wgt.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            $('.bb_total_qty').html(totalqty);
            $('.bb_total_weight').html(totalweight);
            
            $('.break_bulk').append('<input type="hidden" name="bb_cargo_product['+x+']" value='+bb_cargo_product+'><input type="hidden" name="bb_quantity['+x+']" value='+bb_quantity+'><input type="hidden" name="bb_packaging['+x+']" value='+bb_packaging+'><input type="hidden" name="bb_weight['+x+']" value='+bb_weight+'><input type="hidden" name="bb_remark['+x+']" value='+bb_remark+'>');

            $('.submit-btn').show();

            $('#bb_cargo_product').val('');
            $('#bb_quantity').val('');
            $('#bb_packaging').val('');
            $('#bb_weight').val('');
            $('#bb_remark').val('');
        }

    }

    function AddlclData() {

        var lcl_cargo_product = document.getElementById("lcl_cargo_product").value;
        var lcl_quantity = document.getElementById("lcl_quantity").value;  
        var lcl_packaging = document.getElementById("lcl_packaging").value;
        var lcl_length = document.getElementById("lcl_length").value;
        var lcl_width = document.getElementById("lcl_width").value;
        var lcl_height = document.getElementById("lcl_height").value;
        var lcl_weight = document.getElementById("lcl_weight").value;
        var lcl_cbm = document.getElementById("lcl_cbm").value;

        $('.lcl input , .lcl select').each(function() {
            if ($(this).val() == '') {
                $(this).closest('.form-group').addClass('has-error');
            }
        });    

        if(!lcl_cargo_product || !lcl_quantity || !lcl_packaging || !lcl_weight || !lcl_cbm || !lcl_length || !lcl_width || !lcl_height) {
            return false;
        }
        else
        {
            // var x  = $('#lcl tbody tr').length;
            ll.push(1);
            var x = ll.length;
            inputt= '<button type="button" class="remove_lcl_data" data-id='+x+' data-quantity='+lcl_quantity+' data-weight='+lcl_weight+'><i class="fa fa-remove" aria-hidden="true"></i></button>';  
            var rows = "";
            rows += "<td>" + lcl_cargo_product + "</td><td>" + lcl_quantity + "</td><td>" + lcl_packaging + "</td><td>" + lcl_length + "</td><td>" + lcl_width + "</td><td>" + lcl_height + "</td><td>" + lcl_weight + "</td><td>" + lcl_cbm + "</td><td>" + inputt + "</td>";

            var tbody = document.querySelector("#lcl tbody");
            var tr = document.createElement("tr");
            tr.innerHTML = rows;
            tbody.appendChild(tr);

            lcl_qty.push(lcl_quantity);
            lcl_wgt.push(lcl_weight);
            var lcltotalqty = lcl_qty.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            var lcltotalweight= lcl_wgt.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            $('.lcl_total_qty').html(lcltotalqty);
            $('.lcl_total_weight').html(lcltotalweight);

            $('.lcl').append('<input type="hidden" name="lcl_cargo_product['+x+']" value='+lcl_cargo_product+'><input type="hidden" name="lcl_quantity['+x+']" value='+lcl_quantity+'><input type="hidden" name="lcl_packaging['+x+']" value='+lcl_packaging+'><input type="hidden" name="lcl_length['+x+']" value='+lcl_length+'><input type="hidden" name="lcl_width['+x+']" value='+lcl_width+'><input type="hidden" name="lcl_height['+x+']" value='+lcl_height+'><input type="hidden" name="lcl_weight['+x+']" value='+lcl_weight+'><input type="hidden" name="lcl_cbm['+x+']" value='+lcl_cbm+'>');

            $('.submit-btn').show();

            $('#lcl_cargo_product').val('');
            $('#lcl_quantity').val('');
            $('#lcl_packaging').val('');
            $('#lcl_weight').val('');
            $('#lcl_length').val('');
            $('#lcl_width').val('');
            $('#lcl_height').val('');
            $('#lcl_cbm').val('');
        }
    }

    function AddOggData() {
        var og_cargo_product = document.getElementById("og_cargo_product").value;
        var og_quantity = document.getElementById("og_quantity").value;  
        var og_packaging = document.getElementById("og_packaging").value;
        var og_length = document.getElementById("og_length").value;
        var og_width = document.getElementById("og_width").value;
        var og_height = document.getElementById("og_height").value;
        var og_weight = document.getElementById("og_weight").value;
        var og_cbm = document.getElementById("og_cbm").value;

        $('.oog input , .oog select').each(function() {
            if ($(this).val() == '') {
                $(this).closest('.form-group').addClass('has-error');
            }
        });

        if(!og_cargo_product || !og_quantity || !og_packaging || !og_weight || !og_cbm || !og_length || !og_width || !og_height) {
            return false;
        }
        else
        {
            // var x  = $('#oog tbody tr').length;
            oo.push(1);
            var x = oo.length;
            inputt= '<button type="button" class="remove_oog_data" data-id='+x+' data-quantity='+og_quantity+' data-weight='+og_weight+'><i class="fa fa-remove" aria-hidden="true"></i></button>';
            var rows = "";
            rows += "<td>" + og_cargo_product + "</td><td>" + og_quantity + "</td><td>" + og_packaging + "</td><td>" + og_length + "</td><td>" + og_width + "</td><td>" + og_height + "</td><td>" + og_weight + "</td><td>" + og_cbm + "</td><td>" + inputt + "</td>";

            var tbody = document.querySelector("#oog tbody");
            var tr = document.createElement("tr");
            tr.innerHTML = rows;
            tbody.appendChild(tr);

            og_qty.push(og_quantity);
            og_wgt.push(og_weight);
            var ogtotalqty = og_qty.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            var ogtotalweight= og_wgt.reduce((pv, cv) => parseInt(pv)+parseInt(cv), 0);
            $('.og_total_qty').html(ogtotalqty);
            $('.og_total_weight').html(ogtotalweight);

            $('.oog').append('<input type="hidden" name="og_cargo_product['+x+']" value='+og_cargo_product+'><input type="hidden" name="og_quantity['+x+']" value='+og_quantity+'><input type="hidden" name="og_packaging['+x+']" value='+og_packaging+'><input type="hidden" name="og_length['+x+']" value='+og_length+'><input type="hidden" name="og_width['+x+']" value='+og_width+'><input type="hidden" name="og_height['+x+']" value='+og_height+'><input type="hidden" name="og_weight['+x+']" value='+og_weight+'><input type="hidden" name="og_cbm['+x+']" value='+og_cbm+'>');

            $('.submit-btn').show();

            $('#og_cargo_product').val('');
            $('#og_quantity').val('');
            $('#og_packaging').val('');
            $('#og_weight').val('');
            $('#og_length').val('');
            $('#og_width').val('');
            $('#og_height').val('');
            $('#og_cbm').val('');
        }
    }
</script>
<style type="text/css">
    .shipper-btn{
        display: block !important;
    }
    #shipperSelectBoxItContainer {
        display: none;
    }
    #notifySelectBoxItContainer {
        display: none;
    }
    #customerSelectBoxItContainer {
        display: none;
    }
    #consigneeIdSelectBoxItContainer {
        display: none;
    }
</style>
@endsection