@extends('web.layouts.master')
@section('contents')


    <!-- start page title -->
    <section class="page-title">
        <div class="container">
            <h3 class="main-title">@lang('data.add_product_now')</h3>
        </div>
    </section>
    <!-- end page title -->

    <!-- start brands  -->
    <section class="commission-block">
        <div class="container">
            <div class="main-content grey-bg">
                <div class="row">
                    <div class="col-md-12 col-lg-12">
                        <div class="title">
                            <h3 class="no-psedu wow fadeInDown">@lang('data.add_product_now')</h3>
                        </div>
                        <div class="commission-form custom wow fadeInUp">
                            <form action="{{route('product.store')}}" method="post"
                                  enctype="multipart/form-data" id="form">
                                @csrf
                                <div class="row form-group d-flex p-0">
                                    <div class="col-md-6 single-slc">
                                        <label for="" class="label">@lang('data.chose_ad_type')</label>
                                        <select name="ads_type" id="ad_type" class="custom-select form-control"
                                                required>
                                            <option value="null">@lang('data.chose_ad_type')</option>


                                            @foreach($ad_types as $type)
                                                <option
                                                    value="{{$type->id}}"
                                                    @if ($errors->any())  @if(\Session::get('ads_type_session') == $type->id) selected @endif @endif >{{$type->name[\App::getLocale()]}}</option>
                                            @endforeach
                                        </select>
                                        {{--                                        @if ($errors->has('ads_type'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('ads_type') }}</small>--}}
                                        {{--                                        @endif--}}

                                    </div>


                                    <div class="col-md-6 single-slc">
                                        <label for="" class="label">@lang('data.chose_city_parent')</label>
                                        <select name="city_id" id="city_parent" class="custom-select form-control"
                                                required>

                                            <option value="null" selected>@lang('data.chose_city_parent')</option>
                                            @foreach($countries as $country)
                                                <option
                                                    value="{{$country->id}}"
                                                    @if ($errors->any())  @if(\Session::get('city_id_session') == $country->id) selected @endif @endif >{{$country->name[\App::getLocale()]}}</option>
                                            @endforeach

                                        </select>
                                        {{--                                        @if ($errors->has('city_id'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('city_id') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>


                                    <div class="col-md-6 single-slc" id="city_in" style="display: block">
                                        <label for="" class="label">@lang('data.chose_hay')</label>
                                        <select name="county_id" id="hay" class="custom-select form-control">

                                            <option></option>

                                        </select>
                                        {{--                                        @if ($errors->has('county_id'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('county_id') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>


                                </div>
                                <!-- start upload imgs -->
                                <div class="row form-group d-flex"><p class="col-12 label right">@lang('data.upload_ad_image')</p>
                                    <!-- multiple -->
                                    <div class="col-md-4 col-lg-4">
                                        <div class="item-upload upload-block">
                                            <div class="item-edit upload">
                                                <div class="item-preview">
                                                    <div class="upload__btn">
                                                        <img src="{{asset('web/img/dynamic/icons/plus.png')}}" alt="">
                                                        <input class="upload__input " id="files" type="file"
                                                            name="images[]" multiple="multiple" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-8 col-lg-8 all-preview">
                                        <div id="uploadPreview">
                                        </div>
                                    </div>
                                </div>
                                <!-- end upload imgs -->

                                <div class="row form-group w-padding">
                                    <div class="col-md-12">
                                    <label for="" class="label">@lang('data.ad_title')</label>
                                    <input type="text" value="{{old('title')}}" name="title" maxlength="191"
                                           class="form-control"
                                           placeholder="@lang('data.ad_title')" required>
                                    {{--                                    @if ($errors->has('title'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('title') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>
                                </div>

                                <div class="row form-group d-flex">
                                    <div class="col-md-6 single-slc">
                                        <label for="" class="label">@lang('data.main_category')</label>
                                        <select name="grand_id" id="grand_category" class="custom-select form-control"
                                                required>
                                            <option value="null">@lang('data.plz_select_ad_type')</option>
                                            @foreach($categories as $category)
                                                <option value="{{$category->id}}"
                                                        @if ($errors->any())  @if(\Session::get('grand_id_session') == $category->id) selected @endif @endif
                                                >{{$category->name[\App::getLocale()]}}</option>
                                            @endforeach
                                        </select>
                                        {{--                                        @if ($errors->has('grand_id'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('grand_id') }}</small>--}}
                                        {{--                                        @endif--}}

                                    </div>

                                    <div class="col-md-6 single-slc" id="parent_cat" @if($errors->any()) style="display: block"
                                         @else  style="display: none" @endif >
                                        <label for="" class="label">@lang('data.sub_category')</label>
                                        <select name="parent_id" id="parent_category" class="custom-select form-control"
                                        >
                                        </select>
                                        {{--                                        @if ($errors->has('parent_id'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('parent_id') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>


                                    <div class="col-md-6 single-slc" id="category_cat" style="display: none">
                                        <label for="" class="label">@lang('data.sub_category')</label>
                                        <select name="category_id" id="child_category"
                                                class="custom-select form-control"
                                        >
                                            <option>
                                            </option>
                                        </select>
                                        {{--                                        @if ($errors->has('category_id'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('category_id') }}</small>--}}
                                        {{--                                        @endif--}}

                                    </div>

                                </div>

                                <div class="row form-group w-padding">
                                    <div class="col-md-12 list">
                                    <p class="label-text">@lang('data.hide_mobile')</p>
                                    <ul class="list-unstyled">
                                        <li class="list-option inline">
                                            <input type="radio" value="true"
                                                   {{ old('hide_mobile') == 'true' ? 'checked' : ''}}  class="radio-btn show_mobile_false"
                                                   name="hide_mobile" id="e-opt1">
                                            <label for="e-opt1" class="label sm-pading">@lang('data.yes')</label>
                                        </li>
                                        <li class="list-option inline">
                                            <input type="radio" value="false" class="radio-btn show_mobile_true"
                                                   checked name="hide_mobile"
                                                   {{ old('hide_mobile') == 'false' ? 'checked' : ''}} id="e-opt2">
                                            <label for="e-opt2" class="label sm-pading">@lang('data.no')</label>
                                        </li>
                                    </ul>
                                    {{--                                    @if ($errors->has('hide_mobile'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('hide_mobile') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>
                                </div>

                                <div class="row form-group mobile_product w-padding" id="mobile_product">
                                    <div class="col-md-12">
                                        <div class="row">
                                            <div class="col-md-8">
                                                <label for="" class="label">@lang('data.mobile')</label>
                                                <input type="text" value="{{old('mobile')}}" name="mobile"
                                                       class="form-control"
                                                       placeholder="0096650000000"
                                                >
                                                @if ($errors->has('mobile'))
                                                    <small class="text-danger">{{ $errors->first('mobile') }}</small>
                                                @endif
                                            </div>
                                            <div class="col-md-4">
                                                <label for="" class="label">@lang('data.country_code')</label>

                                                <select name="country_code" required class="custom-select form-control">
                                                    @foreach(\App\Models\CountryCodes::all() as $code)
                                                        <option value="{{$code->code}}">{{$code->code}}</option>
                                                    @endforeach

                                                </select>


                                                {{--                                            @if ($errors->has('mobile'))--}}
                                                {{--                                                <small class="text-danger">{{ $errors->first('mobile') }}</small>--}}
                                                {{--                                            @endif--}}
                                            </div>

                                        </div>

                                    </div>
                                    </div>

                                <div class="row d-flex list flex-start w-padding">
                                    <div class="col-md-6 car_options form-group">
                                        <p class="label-text">@lang('data.ad_type_buy')</p>
                                        <ul class="list-unstyled">
                                            <li class="list-option inline">
                                                <input type="radio" value="buy"
                                                       {{ old('ad_type') == 'buy' ? 'checked' : ''}} class="radio-btn"
                                                       name="ad_type"
                                                       id="a-opt1">
                                                <label for="a-opt1" class="label sm-pading">@lang('data.buy')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('ad_type') == 'waiver' ? 'checked' : ''}} value="waiver"
                                                       class="radio-btn" name="ad_type"
                                                       id="a-opt2">
                                                <label for="a-opt2" class="label sm-pading">@lang('data.waiver')</label>
                                            </li>
                                        </ul>
                                        {{--                                        @if ($errors->has('ad_type'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('ad_type') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>

                                    <div class="col-md-6 car_options form-group">
                                        <p class="label-text">@lang('data.fetis')</p>
                                        <ul class="list-unstyled list">
                                            <li class="list-option inline">
                                                <input type="radio" class="radio-btn"
                                                       {{ old('fetis') == 'automatic' ? 'checked' : ''}} value="automatic"
                                                       name="fetis"
                                                       id="b-opt1">
                                                <label for="b-opt1"
                                                       class="label sm-pading">@lang('data.automatic')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio" class="radio-btn"
                                                       {{ old('fetis') == 'manual' ? 'checked' : ''}} value="manual"
                                                       name="fetis"
                                                       id="b-opt2">
                                                <label for="b-opt2" class="label sm-pading">@lang('data.manual')</label>
                                            </li>
                                        </ul>
                                    </div>
                                    {{--                                    @if ($errors->has('fetis'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('fetis') }}</small>--}}
                                    {{--                                    @endif--}}


                                    <div class="col-md-6 car_options form-group">
                                        <p class="label-text">@lang('data.fuel')</p>
                                        <ul class="list-unstyled">
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('fuel') == 'gasoline' ? 'checked' : ''}} class="radio-btn"
                                                       value="gasoline" name="fuel"
                                                       id="c-opt1">
                                                <label for="c-opt1"
                                                       class="label sm-pading">@lang('data.gasoline')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('fuel') == 'diesel' ? 'checked' : ''}} class="radio-btn"
                                                       value="diesel" name="fuel"
                                                       id="c-opt2">
                                                <label for="c-opt2" class="label sm-pading">@lang('data.diesel')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('fuel') == 'hybrid' ? 'checked' : ''}}  class="radio-btn"
                                                       value="hybrid" name="fuel"
                                                       id="c-opt3">
                                                <label for="c-opt3" class="label sm-pading">@lang('data.hybrid')</label>
                                            </li>
                                        </ul>
                                        {{--                                        @if ($errors->has('fuel'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('fuel') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>

                                    <div class="col-md-6 car_options form-group">
                                        <p class="label-text">@lang('data.status')</p>
                                        <ul class="list-unstyled">
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('car_status') == 'new' ? 'checked' : ''}} class="radio-btn"
                                                       value="new" name="car_status"
                                                       id="c-opt11">
                                                <label for="c-opt11" class="label sm-pading">@lang('data.new')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio" class="radio-btn"
                                                       {{ old('car_status') == 'used' ? 'checked' : ''}} value="used"
                                                       name="car_status"
                                                       id="c-opt12">
                                                <label for="c-opt12" class="label sm-pading">@lang('data.used')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio" class="radio-btn"
                                                       {{ old('car_status') == 'accident' ? 'checked' : ''}} value="accident"
                                                       name="car_status"
                                                       id="c-opt13">
                                                <label for="c-opt13"
                                                       class="label sm-pading">@lang('data.accident')</label>
                                            </li>
                                        </ul>
                                        {{--                                        @if ($errors->has('car_status'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('car_status') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>

                                    <div class="col-md-6 list car_options form-group">
                                        <p class="label-text">@lang('data.double')</p>
                                        <ul class="list-unstyled">
                                            <li class="list-option inline">
                                                <input type="radio" class="radio-btn"
                                                       {{ old('double') == 'true' ? 'checked' : ''}} value="true"
                                                       name="double"
                                                       id="d-opt1">
                                                <label for="d-opt1" class="label sm-pading">@lang('data.yes')</label>
                                            </li>
                                            <li class="list-option inline">
                                                <input type="radio"
                                                       {{ old('double') == 'false' ? 'checked' : ''}}  class="radio-btn"
                                                       value="false" name="double"
                                                       id="d-opt2">
                                                <label for="d-opt2" class="label sm-pading">@lang('data.no')</label>
                                            </li>
                                        </ul>
                                    </div>
                                    {{--                                    @if ($errors->has('double'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('double') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>

                                <div class="row form-group w-padding">
                                    <div class="col-md-6 form-group single-slc car_options">
                                    <label for="" class="label">@lang('data.model') </label>
                                    <select name="year" id="year" class="custom-select form-control">
                                        <option value="null">@lang('data.chose_model_year')</option>
                                        @for($i = 1970 ; $i <= 2020 ; $i ++)
                                            <option
                                                {{ old('year') == $i ? 'selected' : ''}}  value="{{$i}}">{{$i}}</option>
                                        @endfor
                                    </select>
                                    {{--                                    @if ($errors->has('year'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('year') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>

                                <div class="col-md-6 form-group car_options">
                                    <label for="" class="label">@lang('data.km')</label>
                                    <input type="text" value="{{old('km')}}" class="form-control" maxlength="191"
                                           name="km"
                                           placeholder="@lang('data.km')">
                                    {{--                                    @if ($errors->has('km'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('km') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>
                                </div>


                                <div class="form-group list w-padding">
                                    <p class="label-text">@lang('data.determine_price')</p>
                                    <ul class="list-unstyled">
                                        <li class="list-option inline">
                                            <input type="radio" value="true" class="radio-btn determine_price_true"
                                                   checked name="determine_price" id="e-opt5">
                                            <label for="e-opt5" class="label sm-pading">@lang('data.yes')</label>
                                        </li>
                                        <li class="list-option inline">
                                            <input type="radio" value="false" class="radio-btn determine_price_false"
                                                   name="determine_price" id="e-opt6">
                                            <label for="e-opt6" class="label sm-pading">@lang('data.no')</label>
                                        </li>
                                    </ul>
                                    {{--                                    @if ($errors->has('determine_price'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('determine_price') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>

                                <div class="form-group w-padding" id="show_price">
                                    <label for="" class="label">@lang('data.price')</label>
                                    <input type="text" class="form-control" value="{{old('price')}}" maxlength="191"
                                           name="price"
                                           placeholder="10000">
                                    {{--                                    @if ($errors->has('price'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('price') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>


                                <div class="form-group w-padding">
                                    <label for="" class="label">@lang('data.ad_details')</label>
                                    <textarea class="form-control" name="detail" placeholder="@lang('data.ad_details')"
                                              required>{{old('detail')}}</textarea>
                                    {{--                                    @if ($errors->has('detail'))--}}
                                    {{--                                        <small class="text-danger">{{ $errors->first('detail') }}</small>--}}
                                    {{--                                    @endif--}}
                                </div>

                                <div class="form-group w-padding">
                                    <h4 class="title main-color">@lang('data.commission_swear')</h4>
                                    <div class="text grey-bg">
                                        <p>بسم الله الرحمن الرحيم</p>
                                        <p>قال الله تعالى:
                                            "وَأَوْفُوا بِعَهْدِ اللَّهِ إِذَا عَاهَدتُّمْ وَلَا تَنقُضُوا الْأَيْمَانَ
                                            بَعْدَ تَوْكِيدِهَا وَقَدْ جَعَلْتُمُ اللَّهَ عَلَيْكُمْ كَفِيلًا"
                                            صدق الله العظيم
                                        </p>
                                    </div>
                                </div>
                                <div class="form-group w-padding">
                                    <div class="check-form-div">
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" name="swear" class="custom-control-input"
                                                   id="remmember-swear">
                                            <label class="custom-control-label" for="remmember-swear">
                                                أتعهد و أقسم بالله أنا المعلن أن أ دفع عمولة الموقع وهى 1% من قيمة البيع
                                                سواء، تم البيع عن طريقالموقع أو بسببه.
                                                كما أتعهد بدفع العمولة خلال 10 أيام من استلام كامل مبلغ المبايعة
                                            </label>
                                        </div>
                                        {{--                                        @if ($errors->has('swear'))--}}
                                        {{--                                            <small class="text-danger">{{ $errors->first('swear') }}</small>--}}
                                        {{--                                        @endif--}}
                                    </div>

                                    <p class="note">ملاحظة: عمولة الموقع هى على المعلن ولا تبرأ ذمة المعلن من العمولة
                                        الا في حال دفعها.</p>
                                </div>
                                <input type="hidden" name="lat" id="lat" value="{{old('lat')}}">
                                <input type="hidden" name="lng" id="lng" value="{{old('lng')}}">

                                <div class="col-12 center wow fadeInUp">
                                    <button type="submit" class="btn btn-main btn-hover full-width-btn submit_form">
                                        @lang('data.submit_ad')
                                    </button>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end brands  -->



@stop

@section('script')





    <script>


        window.onload = function () {
            $("#ad_type").change();
            $("#city_parent").change();
            $("#grand_category").change();
            $("#parent_category").change();
            $("#city_in").change();
            $(".car_options").hide();
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(showPosition);
            } else {
                x.innerHTML = "Geolocation is not supported by this browser.";
            }

            function showPosition(position) {
                $('#lat').val(position.coords.latitude);
                $('#lng').val(position.coords.longitude);
            }
        };


        $(".show_mobile_false").on('click', function () {
            $("#mobile_product").hide();
        });
        $(".show_mobile_true").on('click', function () {
            $("#mobile_product").show();

        });
        $(".determine_price_true").on('click', function () {
            $("#show_price").show();
        });
        $(".determine_price_false").on('click', function () {
            $("#show_price").hide();
        });


        $("#ad_type").on('change', function () {
            var ad_type = $("#ad_type").val();
            console.log(ad_type);
            $.ajax({
                type: 'POST',
                url: '{{route('grand_categories_ajax')}}',
                data: {ad_type: ad_type},

                success: function (data) {
                    console.log(data.grand_view);
                    console.log(data.parent_view);
                    if (data.car_option === 'true') {
                        $(".car_options").show();
                    } else {
                        $(".car_options").hide();
                    }

                    var DivToShowIn = parent_cat;

                    $("#grand_category").html('');
                    $("#parent_category").html('');
                    $("#grand_category").append(data.grand_view);
                    $("#parent_category").append(data.parent_view);
                    DivToShowIn.style.display = 'block';

                },
                error: function (jqXHR, textStatus, errorThrown) {
                    errorFunction();
                }
            });
        });
        $("#grand_category").on('change', function () {
            var category_id = $("#grand_category").val();
            $.ajax({
                type: 'GET',
                url: '{{route('get_parent_categories_ajax')}}',
                data: {category_id: category_id},

                success: function (data) {
                    console.log(data.parent_view);
                    console.log(data.car_option);
                    if (data.car_option === 'true') {
                        $(".car_options").show();
                    } else {
                        $(".car_options").hide();
                    }
                    var DivToShowIn = parent_cat;
                    var DivToShowOut = category_cat;

                    $("#parent_category").html('');
                    $("#parent_category").append(data.parent_view);
                    DivToShowIn.style.display = data.display;
                    DivToShowOut.style.display = 'none';

                },
                error: function (jqXHR, textStatus, errorThrown) {
                    errorFunction();
                }
            });
        });

        $("#parent_category").on('change', function () {
            var category_id = $("#parent_category").val();
            console.log(category_id);
            $.ajax({
                type: 'GET',
                url: '{{route('get_categories_ajax')}}',
                data: {category_id: category_id},

                success: function (data) {
                    console.log(data.child_view);
                    if (data.car_option === 'true') {
                        $(".car_options").show();
                    } else {
                        $(".car_options").hide();
                    }
                    var DivToShowIn = category_cat;
                    var DivToShowOut = category_cat;

                    $("#child_category").html('');
                    $("#child_category").append(data.child_view);
                    DivToShowOut.style.display = data.display;


                },
                error: function (jqXHR, textStatus, errorThrown) {
                    errorFunction();
                }
            });
        });
        $("#city_parent").on('change', function () {
            var city_id = $("#city_parent").val();
            $.ajax({
                type: 'GET',
                url: '{{route('get_cities_ajax')}}',
                data: {city_id: city_id},

                success: function (data) {
                    console.log(data.cities_view);
                    var DivToShowIn = city_in;

                    $("#hay").html('');
                    $("#hay").append(data.cities_view);
                    console.log(data.display);
                    DivToShowIn.style.display = data.display;
                    // DivToShowIn.style.display = data.display;

                },
                error: function (jqXHR, textStatus, errorThrown) {
                    errorFunction();
                }
            });
        });


    </script>





@stop