@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->job_no}}">{{$item->job_no}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<form class="form" id="updateRefundStatusForm">
<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-book-open"></i>Updating Refund case Studies
                            </h4>
                                <input type="hidden" name="job_no">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="consignee_name">Consignee Name</label>
                                        <input type="text" class="form-control consignee_name" name="consignee_name">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="descripton">Description</label>
                                        <input type="text" class="form-control descripton" name="descripton">
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Shipping Go</label>
                                        <input type="text" class="form-control shipping" name="shipping" placeholder="shipping">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Container</label>
                                        <input type="text" class="form-control container" name="container" placeholder="container">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Shipping Marks</label>
                                        <input type="text" class="form-control shipping_remarks" name="shipping_remarks" placeholder="shipping_remarks">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Deposit Amount</label>
                                        <input type="text" class="form-control deposit_amount" name="deposit_amount" placeholder="Deposit Amount" value="{{$security_deposit->balance}}">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="case_status">Case Status</label>
                                        <input type="text" class="form-control" name="case_status" placeholder="Case Status">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="case_status">Case Status Date</label>
                                        <input type="date" class="form-control" name="case_status_date" placeholder="Case Status Date">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Memo</label>
                                        <input type="text" class="form-control" name="memo" placeholder="Memo">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Tentative Refund Date</label>
                                        <input type="date" class="form-control" name="refund_date" placeholder="Tentative Refund Date">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="">Case Submitted By</label>
                                        <select name="user_id" id="user_id" class="form-control">
                                            <option value="" selected disabled>Select Employee</option>
                                            @foreach ($users as $item)
                                                <option value="{{$item->id}}">{{$item->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>

                        <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> Update Refund case Studies

                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</form>
@endsection
@section('afterScript')
    <script>
        $(document).ready(function(){
            var do_count = 1;
            $('#shipping_id').select2();
            $('#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);
                        // console.log(data['deposit_amount'].deposit_amount);
                        $('#delivery_data').removeClass('d-none');
                        $('.consignee_name').val(data[0].consignee.consignee_name).prop('readonly',true);
                        $('.shipping_remarks').val(data[0].consignment_detail.shipping_marks).prop('readonly',true);
                        $('.shipping').val(data['shipping']!=null  ? data['shipping'].shipping_name : '').prop('readonly',true);
                        $('.descripton').val(data[0].consignment_detail.description).prop('readonly',true);
                        $('.container').val(data['containers_details'].length>0  ? data['containers_details'].length :  '0').prop('readonly',true);
                        $('.deposit_amount').prop('readonly',false);

                        $('[name=job_no]').val(id);

                        if(data['refund_statuses']!=null)
                        {
                            $('[name=case_status]').val(data['refund_statuses'].case_status);
                            $('[name=memo]').val(data['refund_statuses'].memo);
                            $('[name=refund_date]').val(data['refund_statuses'].refund_date);
                            $('[name=case_status_date]').val(data['refund_statuses'].case_status_date);
                            $('[name=user_id]').val(data['refund_statuses'].user_id).trigger('change');

                            
                        } else {
                            $('[name=case_status]').val(null);
                            $('[name=memo]').val(null);
                            $('[name=refund_date]').val(null);
                            $('[name=user_id]').val(null).trigger('change');
                        }

                        
                    },
                    error: function(e) {
                        console.log(e);
                    }
                });
            });

            $(document).on('click',"#saveBtn", function(e){
                e.preventDefault();
            
                var form_data = new FormData($("#updateRefundStatusForm")[0]);
                $.ajaxSetup({
                    headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    url : "{{ route('add_update_refund_status.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);
                        $('#updateRefundStatusForm')[0].reset();
                    },
                    error: function(err) {
                        swal('Not Valid',err.responseJSON.message,'error');
                        // setTimeout(function() { 
                        //     location.reload();
                        // }, 1000);
                    
                    }
                });
            });

        })
    </script>
@endsection