@if($section)
    <form method="post" action="{{ route('admin.app_settings.section_update',[$section]) }}" id="new_section" enctype="multipart/form-data">
@else
    <form method="post" action="{{ route('admin.app_settings.section_store') }}" id="new_section" enctype="multipart/form-data">
@endif

    @csrf
    <input type="hidden" name="section_type" value="{{ $sectionType }}">

    <ul class="nav nav-tabs nav-line-tabs mb-5 fs-6">
        @foreach(getStoreLanguages() as $language)
            <li class="nav-item">
                <a class="nav-link {{$language->code == 'ar'?'active':''}}" data-bs-toggle="tab" href="#g_lang_{{$language->code}}">{{$language->name_ar}}</a>
            </li>
        @endforeach
    </ul>
    <div class="tab-content mb-10" id="myTabContent">
        @foreach(getStoreLanguages() as $language)
            <div class="tab-pane fade{{$language->code == 'ar'?'show active':''}} " id="g_lang_{{$language->code}}" role="tabpanel">
                <!--begin::Input group-->
                <div class="mb-10 fv-row">
                    <!--begin::Label-->
                    <label class="required form-label">الاسم ب{{$language->name_ar}}</label>
                    <!--end::Label-->
                    <!--begin::Input-->
                    <input required dir="{{ $language->code == 'ar'?'rtl':'ltr' }}" type="text" name="title[{{ $language->code }}]" id="title_{{ $language->code }}"
                           placeholder="الاسم ب{{$language->name_ar}}"
                           value="{{ old("title.$language->code",(!empty($section) && $section->translate($language->code)?$section->translate($language->code)->title:'')) }}"
                           class="form-control mb-2{{ $errors->has("title.$language->code") ? ' is-invalid' : '' }}">
                    @if ($errors->has("title.$language->code"))
                        <span class="invalid-feedback">{{ $errors->first("title.$language->code") }}</span>
                    @endif

                    <span id="title_{{ $language->code }}_error" class="invalid-feedback custom-error"></span>
                </div>
                <!--end::Input group-->
                @if($sectionType == \App\Constants\StoreSectionTypes::BIG_IMAGES_PRODUCTS)
                <div class="mb-10 fv-row">
                    <label class="required form-label">التفاصيل ب{{$language->name_ar}}</label>

                    <textarea required dir="{{ $language->code == 'ar'?'rtl':'ltr' }}" name="details[{{ $language->code }}]"
                              id="details_{{ $language->code }}" rows="4"
                              class="form-control mb-2{{ $errors->has("details.$language->code") ? ' is-invalid' : '' }}">{{ old("details.$language->code",(!empty($section) && $section->translate($language->code)?$section->translate($language->code)->details:'')) }}</textarea>

                    <span id="details_{{ $language->code }}_error" class="invalid-feedback custom-error"></span>
                </div>
                @endif
            </div>
        @endforeach
    </div>

        @if(in_array($sectionType,[
            \App\Constants\StoreSectionTypes::SMALL_IMAGES_PRODUCTS,
            \App\Constants\StoreSectionTypes::MIDDLE_IMAGES_PRODUCTS,
            \App\Constants\StoreSectionTypes::BIG_IMAGES_PRODUCTS,
            \App\Constants\StoreSectionTypes::GRID_PRODUCTS,
        ]))

            <div class="mb-10 fv-row form-group">
                <label class="required form-label">@lang('general.content_type')</label>

                <select class="form-select content_type mb-2" required name="item_type"  data-control="select2" data-hide-search="true" data-placeholder="اختر">
                    <option></option>
                    @foreach($itemTypes as $type)
                    <option value="{{ $type }}" {{ (!empty($section->elements) && $type == $section->elements[0]->item_type)?'selected' : '' }}>{{ trans('general.type_'.$type) }}</option>
                    @endforeach
                    {{--<option value="{{ \App\Constants\StoreSectionElementContentTypes::OFFERS }}">@lang('general.type_offers')</option>--}}
                    {{--<option value="{{ \App\Constants\StoreSectionElementContentTypes::MAIN_CATEGORY }}">@lang('general.type_main_category')</option>--}}
                    {{--<option value="{{ \App\Constants\StoreSectionElementContentTypes::SUB_CATEGORY }}">@lang('general.type_sub_category')</option>--}}
                    {{--<option value="{{ \App\Constants\StoreSectionElementContentTypes::TAILOR_CATEGORY }}">@lang('general.type_tailor_category')</option>--}}
                    {{--<option value="{{ \App\Constants\StoreSectionElementContentTypes::PRODUCTS }}">@lang('general.type_products')</option>--}}
                </select>
            </div>

            <style>
                .option_item{
                    display: none;
                }
            </style>
            <div class="fv-row mb-10 option_item category form-group" style="{{!empty($section->elements) && in_array($section->elements[0]->item_type,[
            \App\Constants\StoreSectionElementContentTypes::MAIN_CATEGORY,
            \App\Constants\StoreSectionElementContentTypes::SUB_CATEGORY
            ]) ? 'display:block;' : ''}}">
                <label class="required form-label">@lang('general.type_main_category'):</label>
                <select class="form-select" name="category" required data-control="select2" data-hide-search="false" data-placeholder="الرجاء الاختيار.." data-allow-clear="false" >
                    <option></option>
                    @php
                    $catId = null;
                    if(!empty($element) && !empty($element->main_category_id)){
                        $catId = $element->main_category_id;
                    }elseif(!empty($section->elements[0]) && $section->elements[0]->item_type == \App\Constants\StoreSectionElementContentTypes::MAIN_CATEGORY){
                        $catId = $section->elements[0]->item_id;
                    }
                    @endphp
                    @foreach($categories as $cat)
                        <option value="{{$cat->getKey() }}" {{  $catId == $cat->getKey() ? 'selected' : '' }}>{{ $cat->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="fv-row mb-10 option_item sub_category form-group"
                 style="{{ (!empty($section->elements) && $section->elements[0]->item_type == \App\Constants\StoreSectionElementContentTypes::SUB_CATEGORY ) ? 'display:block;' : '' }}" >
                <label class="required form-label">@lang('general.type_sub_category'):</label>

                <select class="form-select"  name="subcategory" required data-control="select2" data-hide-search="false" data-placeholder="الرجاء الاختيار.." data-allow-clear="false" >
                    <option></option>
                    @foreach($subCategories as $id => $val)
                        <option value="{{$id }}" {{ (!empty($section->elements[0]) &&  $section->elements[0]->item_id == $id) ? 'selected' : '' }}>{{ $val }}</option>
                    @endforeach
                </select>
            </div>
            <div class="fv-row mb-10 option_item tailor_category form-group"
                 style="{{ (!empty($section->elements) && $section->elements[0]->item_type == \App\Constants\StoreSectionElementContentTypes::TAILOR_CATEGORY ) ? 'display:block;' : '' }}" >
                <label class="required form-label">@lang('general.type_tailor_category'):</label>
                <select class="form-select" name="tailor_category" required data-control="select2" data-hide-search="false" data-placeholder="الرجاء الاختيار.." data-allow-clear="false" >
                    <option></option>
                    @foreach($tailorCategories as $key => $cat)
                        <option value="{{$key }}" {{ (!empty($section->elements[0]) && $section->elements[0]->item_id == $key) ? 'selected' : '' }}>{{ $cat }}</option>
                    @endforeach
                </select>
            </div>
            <div class="fv-row mb-10 option_item products form-group"
                 style="{{ (!empty($section->elements) && $section->elements[0]->item_type == \App\Constants\StoreSectionElementContentTypes::PRODUCTS ) ? 'display:block;' : '' }}" >
                <label class="required form-label">@lang('general.type_products'):</label>
                <select name="products[]"  multiple="multiple" class="form-select" required data-control="select2" data-hide-search="false" data-placeholder="الرجاء الاختيار.." data-allow-clear="false" >
                    <option></option>
                    @foreach($products as $id => $val)
                        <option value="{{ $id }}" {{ ( !empty($itemProducts) && in_array($id,$itemProducts) ) ? 'selected' : '' }}>{{ $val }}</option>
                    @endforeach
                </select>
            </div>

        @endif


    <div class="justify-content-end d-flex align-items-center">
        <button type="button" class="btn btn-light" data-bs-dismiss="modal">الغاء</button>
        <button type="submit" class="btn btn-primary ms-2 submit_btn">
            <span class="indicator-label">@lang('general.save')</span>
            <span class="indicator-progress">@lang('general.please_wait')
                <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
            </span>
        </button>
    </div>
</form>