@extends('layouts.app')

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                <div class="pt-3 px-3">
                    <div class="row justify-content-center">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="job_id">Select Job Number</label>
                                <select id="job_id" name="job_id" class="form-control">
                                    <option selected disabled="">Select Job</option>
                                    @foreach ($jobs as $item)
                                    <option value="{{$item->id}}">{{$item->job_no}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<form class="form" id="deliveryGoodsForm">
    <div class="row d-none" id="delivery_data">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <div class="pt-3 px-3">
                        <form class="form">
                            <div class="form-body">
                                <h4 class="form-section">
                                    <i class="icon-user"></i> Job Details
                                </h4>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Consignee Name</label>
                                            <h4 class="consignee_name">...</h4>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Client Name</label>
                                            <h4 class="client_name">...</h4>
                                        </div>
                                    </div>

                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Description</label>
                                            <h4 class="description">...</h4>
                                        </div>
                                    </div>
                                    {{-- <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Consignment Qty</label>
                                            <h4 class="qty">...</h4>
                                        </div>
                                    </div> --}}
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Shipping Marks</label>
                                            <h4 class="shipping_marks">...</h4>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Warehouse</label>
                                            <h4 class="warehouse">...</h4>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Delivery Date</label>
                                            <h4 class="delivery_date">...</h4>
                                        </div>
                                    </div>
                                </div>
                                <h4 class="form-section">
                                    <i class="icon-book-open"></i>Add Clients Inventory
                                </h4>
                                <div class="row warehouse_qty">
                                    </div>
                                <div class="row">
                                    
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Warehouse</label>
                                            <select name="warehouse_id" id="warehouse_id" class="form-control">
                                                <option selected disabled>Select Value</option>
                                                @foreach($warehouse as $wh)
                                                <option value="{{$wh->id}}">{{$wh->name}}</option>
                                                @endforeach
                                                <option value="self">Self</option>

                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Delievery Qty (Bags)</label>
                                            <input type="number" placeholder="32" name="do_qty_bags" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">DO Number</label>
                                            <input type="number" placeholder="32" name="do_number" class="form-control">
                                        </div>
                                    </div>
                                    <!-- <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Delievery Qty (Bags)</label>
                                            <input type="number" placeholder="32" name="do_qty_bags" class="form-control">
                                        </div>
                                    </div> -->

                                    <!-- <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Delievery Qty (Cntr)</label>
                                            <input type="number" placeholder="32" name="do_qty_cntr" class="form-control">
                                        </div>
                                    </div> -->
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Delivery Date</label>
                                            <input type="date" placeholder="32" name="delivery_date" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Cartage Charges</label>
                                            <input type="number" placeholder="32" name="cartage_charges" class="form-control">
                                        </div>
                                    </div>
                                    <!-- <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Weight Charges</label>
                                            <input type="number" placeholder="32" name="weight_charges" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Unloading Charges</label>
                                            <input type="number" placeholder="32" name="unloading_charges" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Other Charges</label>
                                            <input type="number" placeholder="32" name="other_charges" class="form-control">
                                        </div>
                                    </div> -->
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Cartage By</label>
                                            <select name="cartage_by" id="" class="form-control">
                                                <option selected disabled>Select Value</option>
                                                @foreach($vendor as $ven)
                                                <option value="{{$ven->id}}">{{$ven->v_fname}} {{$ven->v_lname}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="">Upload File</label>
                                            <input type="file" name="do_file" id="" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6 d-none">
                                        <img src="" id="do_file" alt="do_file" class="w-25">
                                    </div>
                                </div>
                                <input type="hidden" name="job_no">
                                <input type="hidden" name="delivery_goods_id">
                                <div class="form-actions">
                                    <button type="button" class="btn btn-danger mr-1">
                                        <i class="icon-trash"></i> Cancel
                                    </button>
                                    <button type="button" class="btn btn-success" id="saveBtn">
                                        <i class="icon-note"></i> Add Delivery of Goods
                                    </button>
                                </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

@endsection

@section('afterScript')
<script>
    $(document).ready(function() {
        $('#job_id').select2().on('change', function() {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
                }
            });
            var id = $(this).val();
            $.ajax({
                url: 'getJob/' + id,
                method: 'GET',
                dataType: 'json',
                success: function(data) {
                    console.log(data);
                    $('.warehouse_qty').empty();
                    var output = '';
                    for (var i = 0; i < data.client_inventory_all.length; i++) {
                        output += '<div class="col-md-6">';
                        output += '<div class="form-group">';
                        output += '<label for="warehouse">Warehouse Name:</label>';
                        output +=
                            '<select name="warehouse" id="warehouse" class="form-control">';
                        output += '<option value="' + data.client_inventory_all[i].warehouse
                            .id + '">' + data.client_inventory_all[i].warehouse.name +
                            '</option></select></div></div><div class="col-md-6"><div class="form-group"><label for="">Qty (Bags)</label>';
                        output += '<h3>' + data.client_inventory_all[i].qty_bags + '</h3>';
                        output += '</div></div>';
                    }
                    $('.warehouse_qty').append(output);

                    $('#delivery_data').removeClass('d-none');
                    $('.consignee_name').text(data[0].consignee.consignee_name);
                    $('.description').text(data[0].consignment_detail.description);
                    $('.shipping_marks').text(data[0].consignment_detail.shipping_marks);
                    $('.client_name').text(data[0].client.client_name);
                    $('.container_no').text(data['contatiner'] != null && data['contatiner'].container_no);
                    $('.qty').text(data[0].consignment_detail.qty);
                    $('.containers').text(data['containers_details'].length);
                    if (data['client_inventory'] != null) {
                        $('.warehouse').text(data['client_inventory'].warehouse.name);
                        $('.delivery_date').text(data['client_inventory'].delivery_date);
                    }
                    $('[name=job_no]').val(id);
                    if (data['delivery_goods'] != null) {
                        $('[name=delivery_goods_id]').val(data['delivery_goods'].id);
                        $('[name=do_number]').val(data['delivery_goods'].do_number);
                        $('[name=do_qty_bags]').val(data['delivery_goods'].do_qty_bags);
                        $('[name=do_qty_cntr]').val(data['delivery_goods'].do_qty_cntr);
                        $('[name=delivery_date]').val(data['delivery_goods'].delivery_date);
                        $('[name=cartage_charges]').val(data['delivery_goods'].cartage_charges);
                        $('[name=weight_charges]').val(data['delivery_goods'].weight_charges);
                        $('[name=unloading_charges]').val(data['delivery_goods'].unloading_charges);
                        $('[name=other_charges]').val(data['delivery_goods'].other_charges);
                        $('[name=cartage_by]').val(data['delivery_goods'].cartage_by);
                        $('#do_file').attr('src', 'files/delivery_goods/' + data['delivery_goods'].do_file).parent().removeClass('d-none');

                    } else {
                        $('[name=delivery_goods_id]').val(null);
                        $('[name=do_number]').val(null);
                        $('[name=do_qty_bags]').val(null);
                        $('[name=do_qty_cntr]').val(null);
                        $('[name=delivery_date]').val(null);
                        $('[name=cartage_charges]').val(null);
                        $('[name=weight_charges]').val(null);
                        $('[name=unloading_charges]').val(null);
                        $('[name=other_charges]').val(null);
                        $('[name=cartage_by]').val(null);
                        $('#do_file').attr('src', '').parent().addClass('d-none');
                    }
                },
                error: function(e) {
                    console.log(e);
                }
            });
        });

        $(document).on('click', "#saveBtn", function(e) {
            e.preventDefault();

            var form_data = new FormData($("#deliveryGoodsForm")[0]);
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: "{{ route('add_delivery_goods.store') }}",
                type: "POST",
                data: form_data,
                async: false,
                cache: false,
                contentType: false,
                enctype: 'multipart/form-data',
                processData: false,
                success: function(res) {
                    swal("Inserted!", "Data has been Added Successfully!", "success");
                    //  setTimeout(function() { 
                    //     // location.reload();
                    // }, 1000);
                    $('#deliveryGoodsForm')[0].reset();
                },
                error: function(err) {
                    swal('Not Valid', err.responseJSON.message, 'error');
                    // setTimeout(function() { 
                    //     location.reload();
                    // }, 1000);

                }
            });
        });

        
    })
</script>
@endsection