@extends('dashboard.layout.content')

@section('customTitle')
{{ __('general.add_coupon') }}
@endsection

@section('customStyle')
<link href='{{ asset("dashboard/$locale/assets/css/elements/alert.css") }}' rel="stylesheet" type="text/css" />
<link href='{{ asset("dashboard/$locale/plugins/flatpickr/flatpickr.css") }}' rel="stylesheet" type="text/css" />
<link href='{{ asset("dashboard/$locale/plugins/flatpickr/custom-flatpickr.css") }}' rel="stylesheet" type="text/css" />
@endsection

@section('customBody')
<div id="content" class="main-content">
    <div class="container">
        <div class="container">
            <div class="row">
                <div id="flStackForm" class="col-12 layout-spacing layout-top-spacing">
                    <div class="statbox widget box box-shadow">
                        <div class="widget-header">
                            <div class="row">
                                <div class="col-12">
                                    <h4>{{ __('general.add_coupon') }}</h4>
                                </div>
                            </div>
                        </div>
                        <div class="widget-content widget-content-area">
                            <form class="uroad-form" action="{{ route('dashboard.coupon.store') }}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="form-row mb-4">
                                    <div class="form-group col-md-4">
                                        <label for="category-id">{{ __('validation.attributes.category') }}</label>
                                        <select id="category-id" class="form-control basic" name="category_id">
                                            <option value="" selected>{{ __('validation.attributes.category') }}</option>
                                            @foreach ($categories as $category)
                                            <option value="{{ $category->id }}">
                                                {{ $category->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="company-id">{{ __('validation.attributes.company') }}</label>
                                        <select id="company-id" class="form-control" name="company_id">
                                            <option value="" selected>{{ __('validation.attributes.company') }}</option>
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="models">{{ __('validation.attributes.car') }}</label>
                                        <select id="models" class="form-control" name="models_id">
                                            <option value="" selected>{{ __('validation.attributes.car') }}</option>
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="country">{{ __('validation.attributes.country') }}</label>
                                        <select id="country" class="form-control select2-hidden-accessible" name="country_array">
                                            <option value="" selected>{{ __('validation.attributes.country') }}</option>
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="city-id">{{ __('validation.attributes.city') }}</label>
                                        <select id="city-id" class="form-control basic jquery-city-result" name="city_id">
                                            <option value="" selected>{{ __('validation.attributes.city') }}</option>
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="name">{{ __('validation.attributes.title') }}</label>
                                        <input required type="text" class="form-control" id="name" placeholder="{{ __('validation.attributes.title') }}" name="name">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="code">{{ __('validation.attributes.code') }}</label>
                                        <input required type="text" class="form-control" id="code" placeholder="{{ __('validation.attributes.code') }}" name="code">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="type">{{ __('validation.attributes.type') }}</label>
                                        <input type="text" class="form-control" id="type" placeholder="{{ __('validation.attributes.type') }}" name="type">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="discount-percentage">{{ __('validation.attributes.discount_percentage') }}</label>
                                        <input required type="number" class="form-control" id="discount-percentage" placeholder="{{ __('validation.attributes.discount_percentage') }}" name="discount_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="max_amount">{{ __('validation.attributes.max_discount_amount') }}</label>
                                        <input type="number" class="form-control" id="max_amount" placeholder="{{ __('validation.attributes.max_discount_amount') }}" name="max_amount">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="min_number_of_days">{{ __('validation.attributes.min_number_of_days') }}</label>
                                        <input type="number" class="form-control" id="min_number_of_days" placeholder="{{ __('validation.attributes.min_number_of_days') }}" name="min_number_of_days">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="quantity-per-user">{{ __('validation.attributes.number_of_using_times_per_customer') }}</label>
                                        <input type="number" class="form-control" id="quantity-per-user" placeholder="{{ __('validation.attributes.number_of_using_times_per_customer') }}" name="quantity_per_user">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="total-quantity">{{ __('validation.attributes.total_number_of_uses') }}</label>
                                        <input type="number" class="form-control" id="total-quantity" placeholder="{{ __('validation.attributes.total_number_of_uses') }}" name="total_quantity">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="start-date">{{ __('validation.attributes.start_date') }}</label>
                                        <input required class="form-control basicFlatpickr" id="start-date" placeholder="{{ __('validation.attributes.start_date') }}" name="start_date">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="end-date">{{ __('validation.attributes.end_date') }}</label>
                                        <input required class="form-control basicFlatpickr" id="end-date" placeholder="{{ __('validation.attributes.end_date') }}" name="end_date">
                                    </div>

                                </div>

                                <input type="submit" class="btn btn-primary mt-3" value="{{ __('general.submit') }}">
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('customScript')
<script src='{{ asset("dashboard/$locale/plugins/flatpickr/flatpickr.js") }}'></script>
<script src='{{ asset("dashboard/$locale/plugins/flatpickr/custom-flatpickr.js") }}'></script>
<script>
    $("#coupons-menu-box").attr("data-active", "true");

    $('#country').on('change', function () {
        $.ajax({
            url: "{{ route('dashboard.CityDependsOnCountry') }}",
            type: 'GET',
            data: {
                country_id: $(this).val(),
            },
            success: function (result) {
                $('.jquery-city-result').html(result);
            },
        });
    });

    ajaxSelect2('#company-id','/dashboard/select2/companies');
    ajaxSelect2('#car-id','/dashboard/select2/cars');
    ajaxSelect2('#country','/dashboard/select2/countries');

</script>

@endsection