@extends('cfs/layouts/default')

@section('title')
    Talley Recieve
    @parent
@stop

@section('content')
    @include('common.errors')
    <section class="content-header">
        <h1>Talley Recieve</h1>
        <ol class="breadcrumb">
            <li>
                <a href="{{ route('cfs.dashboard') }}"> <i class="livicon" data-name="home" data-size="16"
                                                             data-color="#000"></i>
                    Dashboard
                </a>
            </li>
            <li>Talley Recieve</li>
            <li class="active">Create Talley Recieve</li>
        </ol>
    </section>
    <section class="content">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="card border-primary">
                        <div class="card-header bg-primary text-white">
                            <h4 class="card-title"><i class="livicon" data-name="user" data-size="16" data-loop="true"
                                                      data-c="#fff" data-hc="white"></i>
                                Talley and Receive
                            </h4></div>
                        {{--                        <br/>--}}
                        <div class="card-body">
                            <h4> Work order: {{ $workorder->servicetype->name }}</h4>
                            <div class="row" style="background-color: #e7e7e5;margin-bottom: -10px">

                                <div class="form-group col-sm-3">
                                    {!! Form::label('declaration', 'Declaration No:') !!}
                                    {!! Form::label('declaration', $cargodetail->cargoheader->cargodeclarations->declaration_number) !!}
                                </div>
                                <div class="form-group col-sm-5">
                                    {!! Form::label('consignee', 'Consignee:') !!}
                                    {!! Form::label('consignee', $cargodetail->cargoheader->cargodeclarations->consignees->name) !!}
                                </div>
                                <div class="form-group col-sm-4">
                                    {!! Form::label('consignee', 'Transitor:') !!}
                                    {!! Form::label('consignee',$cargodetail->cargoheader->cargodeclarations->transitors->name) !!}
                                </div>
                            </div>
                            <div class="row" style="background-color: #e7e7e5;margin-bottom: -10px">

                                <div class="form-group col-sm-3">
                                    {!! Form::label('t1', 'T1:') !!}
                                    {!! Form::label('t1', $cargodetail->cargoheader->t1) !!}
                                </div>
                                <div class="form-group col-sm-5">
                                    {!! Form::label('cargo_type', 'Cargo type:') !!}
                                    {!! Form::label('cargo_type', $cargodetail->cargotype->name) !!}
                                </div>
                                <div class="form-group col-sm-4">
                                    {!! Form::label('cargo_info', 'Cargo Info:') !!}
                                    @if( $cargodetail->container_number)
                                        {!! Form::label('bb_type', $cargodetail->container_number ."-". $cargodetail->container_type."[".$cargodetail->container_size."]") !!}
                                    @else
                                        {!! Form::label('bb_type', $cargodetail->bb_type) !!}
                                    @endif
                                </div>

                            </div>

                            <hr>
                            {!! Form::open(['route' => 'cfs.talleycfs.store']) !!}
                            <input hidden type="text" value="{{$workorder->id}}" name="work_order">
                            <div class="row">
                                <!-- Performed by Field -->
                                <div class="form-group col-sm-3">
                                    {!! Form::label('performed_by', 'Performed by:') !!}
                                    {!! Form::select('performed_by', $performedby,null, ['class' => 'form-control']) !!}
                                </div>
                                <!-- Laboure Association Field -->
                                <div class="form-group col-sm-3">
                                    {!! Form::label('labour_association', 'Labour Association:') !!}
                                    {!! Form::select('labour_association', $labourassociation,null, ['class' => 'form-control quantity']) !!}
                                </div>
                                <!-- uom Field -->
                                <div class="form-group col-sm-3">
                                    {!! Form::label('uom', 'UoM:') !!}
                                    {!! Form::select('uom', $uom,null, ['class' => 'form-control']) !!}
                                </div>
                                <div class="form-group col-sm-3">
                                    {!! Form::label('Detail Count', 'Detail Count:') !!}
                                    <input id="detail count" name="detailed_count" class="form-control"
                                           data-i-search="true">
                                    <!-- {!! Form::select('detailed_count', $uom,null, ['class' => 'form-control']) !!} -->
                                </div>
                                <!-- Unstaffed Count Field -->


                            </div>
                            <div class="row">
                                <div class="form-group col-sm-3">
                                    {!! Form::label('Unstaff Count', 'Unstaff Count:') !!}
                                    <input id="unstaff count" name="unstaff_count" class="form-control"
                                           data-i-search="true">
                                </div>
                                <div class="form-group col-sm-3">
                                    {!! Form::label('ontruck', 'Container on TRUCK:') !!}
                                    <input type='radio' name="inspected" class="form-control" value='ONTRUCK'>
                                </div>
                                <div class='form-group col-sm-3'>
                                    {!! Form::label('onground', 'Container on GROUND:') !!}
                                    <input type='radio' name="inspected" class="form-control" value='GROUND'>

                                </div>

                            </div>
                            <div class="row">
                                <!-- Weight Field -->
                                <div class="form-group col-sm-3">
                                    {!! Form::label('weight', 'Weight:') !!}
                                    {!! Form::text('weight', $cargodetail->weight, ['class' => 'form-control']) !!}
                                </div>

                                <!-- Quantity Field -->
                                <div class="form-group col-sm-3">
                                    {!! Form::label('quantity', 'Quantity:') !!}
                                    {!! Form::text('quantity', $cargodetail->quantity, ['class' => 'form-control']) !!}
                                </div>
                                <!-- Description Of Good Field -->
                                <div class="form-group col-sm-6">
                                    {!! Form::label('description', 'Description Of Good:') !!}
                                    {!! Form::text('description', $cargodetail->description_of_good, ['class' => 'form-control']) !!}
                                </div>
                            </div>

                            <div class="form-group col-sm-12 text-center">
                                {!! Form::submit('Save', ['class' => 'btn btn-primary']) !!}
                                <a href="{!! route('cfs.talleycfs.index') !!}" class="btn btn-secondary">Cancel</a>
                            </div>
                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </section>
@stop
@section('footer_scripts')
    <script type="text/javascript">
        $(document).ready(function() {
            $('form').submit(function() {
                $('input[type=submit]').attr('disabled', 'disabled');
                return true;
            });
            $('.roro').hide();
            $('.bulk').hide();
        });

        $('#cargo_type').on('change', function() {
            var selected = $(this).val();
            // alert(selected);
            if (selected == 1) {
                $('.containerized').show();
                $('.roro').hide();
                $('.bulk').hide();
            } else if (selected == 2) {
                $('.containerized').hide();
                $('.roro').hide();
                $('.bulk').show();
            } else {
                $('.containerized').hide();
                $('.roro').show();
                $('.bulk').hide();
            }
        });

        $('#add-form').click(function(e) {
            e.preventDefault();
            var count = $('#formcountid').val();
            count = parseInt(count) + 1;
            count = count.toString();
            $('input[id=formcountid]').val(count);

            var selected = $('#cargo_type').val();
            if (selected == 1) {
                // alert(selected);
                var index = $('.containerized').length;
                // alert(index);
                index = index + 1;
                // Create clone
                var newel = $('#containerized').clone(true).prop('id', 'containerized_' + index);
                $(newel).find('.minus_me').attr('id', 'minus_' + index);
                $(newel).find(':button').attr('value', 'containerized_' + index);
                // Set name of new element
                $(newel).find('.container_number').attr('name', 'container_number_' + index);
                $(newel).find('.container_number').attr('id', 'container_number_' + index);
                $(newel).find('.container_type').attr('name', 'container_type_' + index);
                $(newel).find('.container_type').attr('id', 'container_type_' + index);
                $(newel).find('.container_size').attr('name', 'container_size_' + index);
                $(newel).find('.container_size').attr('id', 'container_size_' + index);
                $(newel).find('.terminal_location').attr('name', 'terminal_location_' + index);
                $(newel).find('.terminal_location').attr('id', 'terminal_location_' + index);

                var newother = $('#other').clone(true).prop('id', 'other_' + index);
                $(newother).find('.weight').attr('name', 'weight_' + index);
                $(newother).find('.weight').attr('id', 'weight_' + index);
                $(newother).find('.quantity').attr('name', 'quantity_' + index);
                $(newother).find('.quantity').attr('id', 'quantity_' + index);
                $(newother).find('.bill_of_ladding').attr('name', 'bill_of_ladding_' + index);
                $(newother).find('.bill_of_ladding').attr('id', 'bill_of_ladding_' + index);
                $(newother).find('.description_of_good').attr('name', 'description_of_good_' + index);
                $(newother).find('.description_of_good').attr('id', 'description_of_good_' + index);
                $(newother).find('.measurment').attr('name', 'measurment_' + index);
                $(newother).find('.measurment').attr('id', 'measurment_' + index);
                $(newother).find('.remark').attr('name', 'remark_' + index);
                $(newother).find('.remark').attr('id', 'remark_' + index);

                // Insert element
                $(newel).insertAfter('.other:last');
                $('<hr>').insertAfter('.other:last');
                $(newother).insertAfter('.containerized:last');
                $('#minus_' + index).css('visibility', 'visible');


            } else if (selected == 2) {
                var index = $('.bulk').length;
                // alert(index);
                index = index + 1;
                // Create clone
                var newel = $('#bulk').clone(true).prop('id', 'bulk_' + index);
                $(newel).find('.minus_me').attr('id', 'minusb_' + index);
                $(newel).find(':button').attr('value', 'bulk_' + index);
                // Set name of new element
                $(newel).find('.bb_type').attr('name', 'bb_type_' + index);
                $(newel).find('.bb_type').attr('id', 'bb_type_' + index);
                $(newel).find('.truck_location').attr('name', 'truck_location_' + index);
                $(newel).find('.truck_location').attr('id', 'truck_location_' + index);

                var newother = $('#other').clone(true).prop('id', 'otherb_' + index);
                $(newother).find('.weight').attr('name', 'weight_' + index);
                $(newother).find('.weight').attr('id', 'weight_' + index);
                $(newother).find('.quantity').attr('name', 'quantity_' + index);
                $(newother).find('.quantity').attr('id', 'quantity_' + index);
                $(newother).find('.bill_of_ladding').attr('name', 'bill_of_ladding_' + index);
                $(newother).find('.bill_of_ladding').attr('id', 'bill_of_ladding_' + index);
                $(newother).find('.description_of_good').attr('name', 'description_of_good_' + index);
                $(newother).find('.description_of_good').attr('id', 'description_of_good_' + index);
                $(newother).find('.measurment').attr('name', 'measurment_' + index);
                $(newother).find('.measurment').attr('id', 'measurment_' + index);
                $(newother).find('.remark').attr('name', 'remark_' + index);
                $(newother).find('.remark').attr('id', 'remark_' + index);

                // Insert element
                $(newel).insertAfter('.other:last');
                $('<hr>').insertAfter('.other:last');
                $(newother).insertAfter('.bulk:last');
                $('#minusb_' + index).css('visibility', 'visible');

            } else {
                var index = $('.roro').length;
                // alert(index);
                index = index + 1;
                // Create clone
                var newel = $('#roro').clone(true).prop('id', 'roro_' + index);
                $(newel).find('.minus_me').attr('id', 'minusr_' + index);
                $(newel).find(':button').attr('value', 'roro_' + index);
                // Set name and id of new element
                $(newel).find('.roro_type').attr('name', 'roro_type_' + index);
                $(newel).find('.roro_type').attr('id', 'roro_type_' + index);

                $(newel).find('.chassis_number').attr('name', 'chassis_number_' + index);
                $(newel).find('.chassis_number').attr('id', 'chassis_number_' + index);

                $(newel).find('.roro_location').attr('name', 'roro_location_' + index);
                $(newel).find('.roro_location').attr('id', 'roro_location_' + index);

                var newother = $('#other').clone(true).prop('id', 'otherr_' + index);
                $(newother).find('.weight').attr('name', 'weight_' + index);
                $(newother).find('.weight').attr('id', 'weight_' + index);
                $(newother).find('.quantity').attr('name', 'quantity_' + index);
                $(newother).find('.quantity').attr('id', 'quantity_' + index);
                $(newother).find('.bill_of_ladding').attr('name', 'bill_of_ladding_' + index);
                $(newother).find('.bill_of_ladding').attr('id', 'bill_of_ladding_' + index);
                $(newother).find('.description_of_good').attr('name', 'description_of_good_' + index);
                $(newother).find('.description_of_good').attr('id', 'description_of_good_' + index);
                $(newother).find('.measurment').attr('name', 'measurment_' + index);
                $(newother).find('.measurment').attr('id', 'measurment_' + index);
                $(newother).find('.remark').attr('name', 'remark_' + index);
                $(newother).find('.remark').attr('id', 'remark_' + index);

                // Insert element
                $(newel).insertAfter('.other:last');
                $('<hr>').insertAfter('.other:last');
                $(newother).insertAfter('.roro:last');
                $('#minusr_' + index).css('visibility', 'visible');
            }

        });

        $('.minus').click(function(e) {
            e.preventDefault();
            var count = $('#formcount').val();
            count = count - 1;
            $('#formcount').val(count);
            var element = $(this).val();
            var indx = element.split('_');
            element = '#' + element;
            var other = '#other_' + indx[1];
            var otherb = '#otherb_' + indx[1];
            var otherr = '#otherr_' + indx[1];
            $('div').remove(element);
            $('div').remove(other);
            $('div').remove(otherb);
            $('div').remove(otherr);
            $('hr:last').remove();

        });

        $('#check').click(function(e) {
            e.preventDefault();

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content'),
                },
            });

            $.ajax({
                url: "{{ url('/cfs/cargoheaders/check') }}",
                method: 'post',
                data: {
                    driver_licence: $('#driver_licence').val(),
                },
                success: function(result) {
                    // console.log(result);
                    $('.full_name').attr('value', result.fullname);
                    $('.licence_number').attr('value', result.licence);
                },
            });

        });

        $('#savedetail').click(function(e) {
            e.preventDefault();
            // alert();
            $('#formdetail').submit();
        });

    </script>
@stop