@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('Add 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('Add Refund') }}</li>

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

        </div>
    </div>
    <!-- Main content -->
    <section class="content">
        @if (Session::get('tenant_subscribtion_data')['refunds']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['refunds'] == 1)
            {!! Form::open(['method' => 'post', 'action' => 'Admin\RefundRequestController@store', 'files' => true, 'id' => 'refund_form', 'class' => '']) !!}
            <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, null, ['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', null, ['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', null, ['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', null, ['required' => 'required', 'class' => 'form-control', 'placeholder' => translate('Email')]) !!}
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="telephone">{{ translate('Phone') }}
                                        </label>
                                        <div>
                                            {!! Form::text('telephone', null, ['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', [], null, ['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', [], null, ['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>
                                    {!! Form::select('order_product_id', [], null, ['required' => 'required', 'id' => 'order_product_id', 'style' => 'width:100%', 'class' => 'form-control select2', 'data-placeholder' => translate('Choose Product')]) !!}
                                </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', null, ['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, null, ['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', null, ['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')], null, ['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>
                </div>
            </div>
            {!! Form::Close() !!}
        @else
            <div class="box">
                <div class="box-body">
                    <div class="row">
                        <div class="col-8 mx-auto text-center">
                            <br>
                            <img style="width: 12em;margin-bottom: 1em;" src="{{ url('/images/upgrad_limit.png') }}"
                                alt="">
                            <h4>
                                {{ translate('You need to upgrade to use this feature.') }}
                            </h4>
                            <h4 style="color: chocolate">{{ translate('Please Upgrade to use this feature.') }}
                            </h4>
                            <br>
                            <a class="btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                href="#">{{ translate('Upgrade now') }}</a>
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </section>
@endsection

@section('script')
    <script type="text/javascript">
        $('.select2').select2();
        $('#user_id').prepend($('<option>', {
            value: 0,
            text: `{{ translate('Choose Client') }}`,
            disabled: true,
            selected: true
        }));
        $('#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
                        }));
                    });
                }
            });
        })

        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,
                        selected: 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() }}',
            },
            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