@extends('admin.layout')
@section('content')
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="page-title"> {{ translate('Edit Refund') }}</h3>
                <div class="d-inline-block align-items-center">
                    <nav>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}"><i
                                        class="mdi mdi-home-outline"></i></a></li>
                            <li class="breadcrumb-item" aria-current="page"> {{ translate('Edit Refund') }}</li>

                        </ol>
                    </nav>
                </div>
            </div>

        </div>
    </div>
    <!-- Main content -->
    <section class="content">
        {!! Form::open(['method' => 'patch', 'action' => ['Admin\RefundRequestController@update', $refundRequest->id], 'files' => true, 'class' => '', 'id' => 'refund_form']) !!}
        <div class="row">
            <div class="col-md">
                <div class="box">
                    <div class="box-header">
                        {{ translate('Client Information') }}
                    </div>
                    <div class="box-body">
                        <div class="row">
                            <div class="col-md-3">
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="name">{{ translate('Client') }}
                                    </label>
                                    <div>
                                        {!! Form::select('user_id', $clients, $refundRequest->user_id, ['required' => 'required', 'style' => 'width:100%', 'id' => 'user_id', 'class' => 'form-control select2', 'data-placeholder' => translate('Client')]) !!}

                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="firstname">{{ translate('First Name') }}
                                    </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                                    <div>
                                        {!! Form::text('firstname', $refundRequest->firstname, ['required' => 'required', 'class' => 'form-control', 'placeholder' => translate('Title')]) !!}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="lastname">{{ translate('Last Name') }}
                                    </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                                    <div>
                                        {!! Form::text('lastname', $refundRequest->lastname, ['required' => 'required', 'class' => 'form-control', 'placeholder' => translate('Last Name')]) !!}
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="email">{{ translate('Email') }}
                                    </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                                    <div>
                                        {!! Form::text('email', $refundRequest->email, ['required' => 'required', 'class' => 'form-control', 'placeholder' => translate('Email')]) !!}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="telephone">{{ translate('Phone') }}
                                    </label>
                                    <div>
                                        {!! Form::text('telephone', $refundRequest->telephone, ['class' => 'form-control', 'placeholder' => translate('Phone')]) !!}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="box-header">
                        {{ translate('Address Information') }}
                    </div>
                    <div class="box-body">
                        <div class="row">
                            <div class="col-md-3">
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="name">{{ translate('Address') }}
                                    </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                                    <div>
                                        {!! Form::select('address_id', $addresses, $address->id, ['required' => 'required', 'id' => 'address_id', 'style' => 'width:100%', 'class' => 'form-control select2', 'data-placeholder' => translate('Address')]) !!}

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="address_data_container">
                            
                        </div>


                    </div>

                </div>
            </div>
            <div class="col-md">
                <div class="box">
                    <div class="box-header">
                        {{ translate('Refunded Product') }}
                    </div>
                    <div class="box-body">
                        <div class="form-group">
                            <label for="name">{{ translate('Choose order') }}
                            </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                            <div>
                                {!! Form::select('order_id', $orders, $refundRequest->order_id, ['required' => 'required', 'id' => 'order_id', 'style' => 'width:100%', 'class' => 'form-control select2', 'data-placeholder' => translate('Choose order')]) !!}
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="name">{{ translate('Choose Product') }}
                            </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                            <div>
                                <select name="order_product_id" id="order_product_id" style="width:100%"
                                    class="form-control select2">
                                    @foreach ($orderProductsNew as $key => $value)
                                        <option value="{{ $key }}" quantity="{{ $value[0] }}" @if ($key == $refundRequest->order_product_id) selected @endif>{{ $value[1] }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="phonr">{{ translate('Quantity') }}
                            </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                            <div>
                                {!! Form::number('quantity', $refundRequest->quantity, ['id' => 'quantity', 'min' => 1, 'required' => 'required', 'class' => 'form-control', 'placeholder' => translate('Quantity')]) !!}
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="name">{{ translate('Choose Resone') }}
                            </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                            <div>
                                {!! Form::select('resone_id', $resones, $refundRequest->resone_id, ['required' => 'required', 'id' => 'resone_id', 'style' => 'width:100%', 'class' => 'form-control select2', 'data-placeholder' => translate('Choose Resone')]) !!}
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="phonr">{{ translate('Details') }}
                            </label>
                            <div>
                                {!! Form::textarea('customer_reson', $refundRequest->customer_reson, ['id' => 'customer_reson', 'class' => 'form-control', 'placeholder' => translate('Details')]) !!}
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="name">{{ translate('Refund Status') }}
                            </label><i style="color: crimson;font-size:.5em;" class="fa fa-asterisk"></i>
                            <div>
                                {!! Form::select('status', ['under_review' => translate('Under review'), 'approved' => translate('Approved'), 'rejected' => translate('Rejected')], $refundRequest->status, ['required' => 'required', 'id' => 'status', 'style' => 'width:100%', 'class' => 'form-control select2', 'data-placeholder' => translate('Refund Status')]) !!}
                            </div>
                        </div>
                    </div>

                </div>
                <button type="submit"
                    class="waves-effect waves-light btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                    style="width: 100%;">
                    <i class="ti-save-alt"></i> {{ translate('Save') }}
                </button>

                {!! Form::Close() !!}

    </section>
@endsection

@section('script')
    <script type="text/javascript">
        $('.select2').select2();
        $('#user_id').change(function() {
            var id = $(this).val();
            var url = "{{ route('getUserById') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                success: function(data) {
                    getUserOrders(id);
                    $("input[name=firstname]").val(data.user.f_name);
                    $("input[name=lastname]").val(data.user.l_name);
                    $("input[name=email]").val(data.user.email);
                    $("input[name=telephone]").val(data.user.phone);
                    $('#address_id').html('');
                    $('#address_id').append($('<option>', {
                        value: 0,
                        text: `{{ translate('Choose Address') }}`,
                        disabled: true,
                        selected: true
                    }));
                    $.each(data.addresses, function(i, item) {
                        $('#address_id').append($('<option>', {
                            value: i,
                            text: item
                        }));
                    });
                }
            });
            $('#order_product_id').html('');
            $('.select2').select2();
        })

        function getUserOrders(user_id) {
            var url = "{{ route('Order.getUserOrders') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    user_id: user_id
                },
                success: function(data) {
                    $('#order_id').html('');
                    $('#order_id').append($('<option>', {
                        value: 0,
                        text: `{{ translate('Choose Order') }}`,
                        disabled: true,
                    }));
                    $.each(data.orders, function(i, item) {
                        $('#order_id').append($('<option>', {
                            value: i,
                            text: item
                        }));
                    });
                }
            });
        }

        $('#order_id').change(function() {
            var order_id = $(this).val();
            var url = "{{ route('Order.getOrderProducts') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    order_id: order_id
                },
                success: function(data) {
                    $('#order_product_id').html('');
                    $('#order_product_id').append($('<option>', {
                        value: 0,
                        text: `{{ translate('Choose Product') }}`,
                        disabled: true,
                        selected: true
                    }));
                    $.each(data, function(i, item) {
                        $('#order_product_id').append($('<option>', {
                            value: i,
                            quantity: item[0],
                            text: item[1]
                        }));
                    });
                }
            });
        });
        $('#order_product_id').change(function() {
            $('#quantity').val(1)
            $('#quantity').attr('max', $('option:selected', this).attr('quantity'))
        })
       
        
        var url = "{{ route('Address.getOrderAdressData') }}"
        $.ajax({
            type: "POST",
            url: url,
            data: {
                _token: '{{ csrf_token() }}',
                id: {{ $refundRequest->address->id }}
            },
            success: function(data) {
                $('.address_data_container').html(data);
                $(".select2").select2();
            }
        });
        $('#address_id').change(function() {
            var url = "{{ route('Address.getOrderAdressData') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    id: $('#address_id').val()
                },
                success: function(data) {
                    $('.address_data_container').html(data);
                    $(".select2").select2();
                }
            });
        });
        function getprovices(e) {
            getprovicesAjax(e.value)
        }

        function getcities(e) {
            getcitiesAjax(e.value)
        }

        function getregions(e) {
            getregionsAjax(e.value)
        }
        function getprovicesAjax(id) {
            var url = "{{ route('Country.getProvinceiesByCountry') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                success: function(data) {
                    $('#province_id').html(null);
                    $.each(data, function(i, item) {
                        $('#province_id').append($('<option>', {
                            value: i,
                            text: item
                        }));
                    });
                    if (data.length != 0) {
                        getcitiesAjax($('#province_id').val())
                    } else {
                        $('#city_id').html(null);
                        $('#region_id').html(null);
                    }
                }
            });
        }

        function getcitiesAjax(id) {
            var url = "{{ route('Country.getCitiesByProvince') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                success: function(data) {
                    $('#city_id').html(null);
                    $.each(data, function(i, item) {
                        $('#city_id').append($('<option>', {
                            value: i,
                            text: item
                        }));
                    });
                    if (data.length != 0) {
                        getregionsAjax($('#city_id').val())
                    } else {
                        $('#region_id').html(null);
                    }
                }
            });
        }

        function getregionsAjax(id) {
            var url = "{{ route('Country.getRegionByCity') }}"
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                success: function(data) {
                    $('#region_id').html(null);
                    $.each(data, function(i, item) {
                        $('#region_id').append($('<option>', {
                            value: i,
                            text: item
                        }));
                    });

                }
            });
        }
    </script>
@endsection