@extends('admin.layouts.app')
@section('title')
    {{ __('create') }} {{ __('page') }}
@endsection
@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <form class="" id="blogForm" action="{{ route('module.blog.store') }}" method="POST"
                        enctype="multipart/form-data" onsubmit="validateForm(event, this)">
                        <input type="hidden" name="author_id" value="{{ auth()->id() }}">
                        @csrf
                        <div class="card-header">
                            <h3 class="card-title line-height-36">{{ __('create') }}</h3>

                            <button type="submit" class="btn bg-success float-right" value="submit_button"
                                name="submit_button">
                                <i class="fas fa-plus mr-1"></i>
                                {{ __('Submit') }}
                            </button>
                            <button type="submit" class="btn bg-warning float-right mr-2" value="save_close_button"
                                name="save_close_button">
                                <i class="fas fa-check mr-1"></i>
                                {{ __('save_and_close') }}
                            </button>
                            <a href="{{ route('module.blog.index') }}" class="btn mr-2 bg-primary float-right"><i
                                    class="fas fa-arrow-left"></i>&nbsp;{{ __('back') }}
                            </a>
                        </div>
                        <div class="container-fluid mt-3">
                            <input value="submit_button" name="button_type" type="hidden" id="button_type">

                            <div class="row">
                                <div class="form-group col-6">
                                    <x-forms.label name="{{ __('title') }}" :required="true" />
                                    <input value="{{ old('title') }}" name="title" id="title" type="text"
                                        class="form-control  @error('title') is-invalid @enderror"
                                        placeholder="{{ __('enter') }} {{ __('title') }}">
                                    <small class="text-danger"></small>
                                    @error('title')
                                        <span class="invalid-feedback"
                                            role="alert"><strong>{{ $message }}</strong></span>
                                    @enderror
                                </div>

                                <div class="form-group col-6">
                                    <x-forms.label name=" {{ __('url') }}" :required="true" />
                                    <input type="text" id="url" name="url" value="{{ old('url') }}"
                                        class="form-control  @error('url') is-invalid @enderror" placeholder="Url" />
                                    <small class="text-danger"></small>
                                    @error('url')
                                        <span class="invalid-feedback"
                                            role="alert"><strong>{{ $message }}</strong></span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-6">
                                    <x-forms.label name=" {{ __('category') }}" :required="true" />
                                    <select name="category_id" id="category_id"
                                        class="@error('category_id') required is-invalid @enderror w-100-p form-control">
                                        <option value="">{{ __('select_category') }}</option>
                                        @foreach ($categories as $category)
                                            <option {{ old('category_id') == $category['id'] ? 'selected' : '' }}
                                                data-class="{{ get_str($category['name']) }}"
                                                value="{{ $category['id'] }}" data-url="{{ $category['url'] }}">{{ $category['name'] }}</option>
                                            @if (!empty($category['recursive_sub_categories']))
                                                @foreach ($category['recursive_sub_categories'] as $sub_category)
                                                    <option
                                                        {{ old('category_id') == $sub_category['id'] ? 'selected' : '' }}
                                                        data-class="{{ get_str($category['name']) }}"
                                                        value="{{ $sub_category['id'] }}" data-url="{{ $sub_category['url'] }}"> - {{ $sub_category['name'] }}
                                                        ({{ $category['name'] }})</option>
                                                    @if (!empty($sub_category['recursive_sub_categories']))
                                                        @foreach ($sub_category['recursive_sub_categories'] as $sub_category2)
                                                            <option
                                                                {{ old('category_id') == $sub_category2['id'] ? 'selected' : '' }}
                                                                data-class="{{ get_str($category['name']) }}"
                                                                value="{{ $sub_category2['id'] }}" data-url="{{ $sub_category2['url'] }}"> --
                                                                {{ $sub_category2['name'] }} ({{ $category['name'] }})
                                                            </option>
                                                            @if (!empty($sub_category2['recursive_sub_categories']))
                                                                @foreach ($sub_category2['recursive_sub_categories'] as $sub_category3)
                                                                    <option
                                                                        {{ old('category_id') == $sub_category3['id'] ? 'selected' : '' }}
                                                                        data-class="{{ get_str($category['name']) }}"
                                                                        value="{{ $sub_category3['id'] }}" data-url="{{ $sub_category3['url'] }}"> ---
                                                                        {{ $sub_category3['name'] }}
                                                                        ({{ $category['name'] }})</option>
                                                                @endforeach
                                                            @endif
                                                        @endforeach
                                                    @endif
                                                @endforeach
                                            @endif
                                        @endforeach
                                    </select>
                                    <small class="text-danger"></small>
                                    @error('category_id')
                                        <span class="invalid-feedback"
                                            role="alert"><strong>{{ $message }}</strong></span>
                                    @enderror
                                </div>
                                <div class="form-group col-6">
                                    <x-forms.label name=" {{ __('status') }}" :required="true" />
                                    <select name="status" class="form-control {{ error('status') }} required"
                                        id="status">
                                        <option {{ old('status') == 'draft' ? 'selected' : '' }} value="draft">
                                            {{ __('draft') }}</option>
                                        <option {{ old('status') == 'published' ? 'selected' : '' }} value="published">
                                            {{ __('published') }}</option>
                                        <option {{ old('status') == 'unpublished' ? 'selected' : '' }} value="unpublished">
                                            {{ __('unpublished') }}</option>
                                    </select>
                                    <small class="text-danger"></small>
                                </div>

                            </div>

                            <div class="row">
                                <div class="form-group col-6 optional-field category-page">
                                    <label class="form-lebel">
                                        {{ __('parent_category') }}
                                    </label>
                                    <select name="parent_category_id" id="parent_category_id"
                                        class="@error('parent_category_id')  required category-page is-invalid @enderror w-100-p form-control">
                                        <option value="">{{ __('select_parent_category') }}</option>

                                        @foreach ($categories as $category)
                                            <option {{ old('parent_category_id') == $category['id'] ? 'selected' : '' }}
                                                value="{{ $category['id'] }}">{{ $category['name'] }}</option>
                                            @if (!empty($category['sub_category']))
                                                @foreach ($category['sub_category'] as $sub_category)
                                                    <option
                                                        {{ old('parent_category_id') == $sub_category['id'] ? 'selected' : '' }}
                                                        value="{{ $sub_category['id'] }}"> - {{ $sub_category['name'] }}
                                                        ({{ $category['name'] }})</option>
                                                @endforeach
                                            @endif
                                        @endforeach
                                    </select>
                                    <small class="text-danger"></small>
                                    @error('parent_category_id')
                                        <span class="invalid-feedback"
                                            role="alert"><strong>{{ $message }}</strong></span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row dropdown">
                                <div class="form-group col-6 optional-field country-page test-preparation lpt-page select_country_show"
                                    id="select_country_show">
                                    <x-forms.label name="country" :required="true" />
                                    <select name="country_id"
                                        class="form-control required country-page test-preparation lpt-page select2bs4  {{ error('country_id') }} "
                                        id="country_id">
                                        <option value="" class="d-none">
                                            {{ __('select_country') }}
                                        </option>
                                        @foreach ($countries as $country)
                                            <option {{ $country->id == old('country_id') ? 'selected' : '' }}
                                                value="{{ $country->id }}">
                                                {{ $country->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    <small class="text-danger"></small>
                                    @error('country_id')
                                        <span class="invalid-feedback d-block"
                                            role="alert"><strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>



                                <div class="form-group col-6 optional-field blog relative_university">

                                    <x-forms.label name="{{ __('select_university') }}" :required="false" />

                                    <select name="relative_university"
                                        class="form-control select2bs4 {{ error('relative_university') }} required blog"
                                        id="relative_university">


                                    </select>
                                    <small class="text-danger"></small>
                                    <x-forms.error name="relative_university" />
                                </div>
                            </div>

                            <div class="row">

                                <div class="col-12">
                                    <div class="">
                                        <ul class="nav nav-tabs" role="tablist">
                                            <li class="nav-item">
                                                <a class="nav-link active" data-toggle="tab" href="#tabs-1"
                                                    role="tab"> {{ __('Desktop') }}</a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-7"
                                                    role="tab">{{ __('Mobile') }}</a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-2"
                                                    role="tab">{{ __('images') }}</a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-3"
                                                    role="tab">{{ __('meta_tags') }}</a>
                                            </li>

                                            <li class="nav-item">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-5"
                                                    role="tab">{{ __('publish') }}</a>
                                            </li>
                                            <li class="nav-item">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-9"
                                                    role="tab">{{ __('Quick Links') }}</a>
                                            </li>
                                            <li class="nav-item optional-field blog">
                                                <a class="nav-link" data-toggle="tab" href="#tabs-6" role="tab">Blog
                                                    Banner</a>
                                            </li>
                                        </ul>
                                        <div class="body tab-content">

                                            <div class="card tab-pane active" id="tabs-1" role="tabpanel">

                                                <div class="card-body">

                                                    <div class="row optional-field blog consultancy category-page">
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Header Title (H1)" :required="false" />
                                                            <input type="text" id="header_title" name="header_title"
                                                                class="form-control required blog consultancy category-page"
                                                                value="{{ old('header_title') }}"
                                                                placeholder="Enter Header Title" />
                                                            <small class="text-danger"></small>
                                                        </div>

                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Introduction" :required="false" />
                                                            <textarea type="text" id="editor16" class="header_description form-control required"
                                                                name="header_description" placeholder="Enter Short Description">{{ old('header_description') }}</textarea>
                                                            <small class="text-danger"></small>
                                                            <x-forms.error name="header_description" />
                                                        </div>
                                                    </div>

                                                    <div class="row optional-field">
                                                        <div class="form-group ">
                                                            <x-forms.label name="Summary" :required="false" />
                                                            <textarea type="text" id="summary" class="form-control required blog " name="summary"
                                                                placeholder="Enter Summary">{{ old('summary') }}</textarea>
                                                            <small class="text-danger"></small>
                                                            <x-forms.error name="summary" />
                                                        </div>
                                                    </div>

                                                    <div class="row optional-field consultancy country-page test-preparation lpt-page">
                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('page') }} {{ __('header') }}
                                                            </label>
                                                            <textarea id="editor1" type="text" class="form-control" name="page_header"
                                                                placeholder="{{ __('page') }} {{ __('header') }}">{{ old('page_header') }}</textarea>
                                                            <small class="text-danger"></small>
                                                            @error('page_header')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row">
                                                        <div
                                                            class="form-group col-12 optional-field university-list-page consultancy country-page generic-pages category-page lpt-page">
                                                            <label class="form-lebel">
                                                                {{ __('middle_content') }}
                                                            </label>
                                                            <textarea id="editor2" type="text" class="form-control" name="middle_content"
                                                                placeholder="{{ __('middle_content') }}">{{ old('middle_content') }}</textarea>
                                                            @error('middle_content')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row descriptionBlock">

                                                        <div class="form-group col-12">
                                                            <x-forms.label name=" {{ __('description') }}"
                                                                :required="true" />
                                                            <textarea id="editor3" type="text" class="form-control editor3" name="description"
                                                                placeholder="{{ __('enter') }}  {{ __('description') }}">{{ old('description') }}</textarea>
                                                            <div id="description_iidd" class="editor3"></div>
                                                            <small class="text-danger"></small>
                                                            @error('description')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row">

                                                        <div
                                                            class="form-group col-12 optional-field consultancy country-page generic-pages category-page admission_desc blog">
                                                            <label class="form-lebel" id="admission_desc">
                                                                {{ __('admission_desc') }}
                                                            </label>
                                                            <textarea id="editor4" type="text"  class="form-control" name="admission_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('admission_desc') }}">{{ old('admission_desc') }}</textarea>
                                                            @error('admission_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field  country-page blog">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel" id="city_desc">
                                                                {{ __('city_desc') }}
                                                            </label>
                                                            <textarea id="editor5" type="text" class="form-control" name="city_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('city_desc') }}">{{ old('city_desc') }}</textarea>
                                                            @error('city_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field country-page blog">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel" id="cost_of_living_desc">
                                                                {{ __('cost_of_living_desc') }}
                                                            </label>
                                                            <textarea id="editor6" type="text" class="form-control" name="cost_of_living_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('cost_of_living_desc') }}">{{ old('cost_of_living_desc') }}</textarea>
                                                            @error('cost_of_living_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('scholarship_desc') }}
                                                            </label>
                                                            <textarea id="editor7" type="text" class="form-control" name="scholarship_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('scholarship_desc') }}">{{ old('scholarship_desc') }}</textarea>
                                                            @error('scholarship_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>


                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('visa_desc') }}
                                                            </label>
                                                            <textarea id="editor8" type="text" class="form-control" name="visa_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('visa_desc') }}">{{ old('visa_desc') }}</textarea>
                                                            @error('visa_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row optional-field country-page city-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('course_overview') }}
                                                            </label>
                                                            <textarea id="editor9" type="text" class="form-control" name="course_overview"
                                                                placeholder="{{ __('enter') }}  {{ __('course_overview') }}">{{ old('course_overview') }}</textarea>
                                                            @error('course_overview')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>


                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('similar_countries') }}
                                                            </label>
                                                            <textarea id="editor10" type="text" class="form-control" name="similar_countries"
                                                                placeholder="{{ __('enter') }}  {{ __('similar_countries') }}">{{ old('similar_countries') }}</textarea>
                                                            @error('similar_countries')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>





                                                    <div class="row university_overview country-page">
                                                        <div class="form-group col-12 ">
                                                            <label class="form-lebel">
                                                                {{ __('University Overview') }}
                                                            </label>
                                                            <textarea id="editor12" type="text" class="form-control" name="university_overview"
                                                                placeholder="{{ __('university_overview') }}">{{ old('university_overview') }}</textarea>
                                                            @error('university_overview')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    
                                                    <div class="row ">
                                                        <div class="form-group col-12 ">
                                                            <label class="form-lebel">
                                                                {{ __('Links Description') }}
                                                            </label>
                                                            <textarea id="editor17" type="text" class="form-control" name="links_desc"
                                                                placeholder="{{ __('Links Description') }}">{{ old('links_desc') }}</textarea>
                                                            @error('link_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row">
                                                        <div class="form-group col-6">
                                                            <x-forms.label name=" {{ __('tag') }}"
                                                                :required="false" />
                                                            <select name="tag_id[]"
                                                                class="@error('tag_id') is-invalid @enderror w-100-p select2bs44"
                                                                multiple>
                                                                <option value="" class="d-none" disabled>
                                                                    {{ __('select_tag') }}</option>
                                                                @foreach ($tags as $tag)
                                                                    <option
                                                                        {{ old('tag_id') == $tag->id ? 'selected' : '' }}
                                                                        value="{{ $tag->id }}">{{ $tag->name }}
                                                                    </option>
                                                                @endforeach
                                                            </select>
                                                            @error('tag_id')
                                                                <span class="invalid-feedback"
                                                                    role="alert"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>

                                                        <div
                                                            class="form-group col-6 optional-field test-preparation lpt-page">
                                                            <x-forms.label name="{{ __('Plans') }}"
                                                                :required="false" />
                                                            @foreach ($plans as $plan)
                                                            @endforeach
                                                            <select name="plan_id[]"
                                                                class="@error('plan_id') is-invalid @enderror w-100-p select2bs44"
                                                                multiple>
                                                                <option value="" class="d-none" disabled>
                                                                    {{ __('Select Plan') }}</option>
                                                                @foreach ($plans as $plan)
                                                                    <option
                                                                        {{ old('plan_id') == $plan->id ? 'selected' : '' }}
                                                                        value="{{ $plan->id }}">{{ $plan->title }}
                                                                    </option>
                                                                @endforeach
                                                            </select>
                                                            @error('plan_id')
                                                                <span class="invalid-feedback"
                                                                    role="alert"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>


                                            <div class="card tab-pane " id="tabs-7" role="tabpanel">
                                                <div class="card-body">

                                                    <div class="row optional-field blog consultancy category-page">
                                                    </div>
                                                    <div class="row optional-field consultancy country-page test-preparation lpt-page">
                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('page') }} {{ __('header') }}
                                                            </label>
                                                            <textarea id="mobile_editor1" type="text" class="form-control" name="mobile_page_header"
                                                                placeholder="{{ __('page') }} {{ __('header') }}">{{ old('mobile_page_header') }}</textarea>
                                                            <small class="text-danger"></small>
                                                            @error('mobile_page_header')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row">
                                                        <div
                                                            class="form-group col-12 optional-field university-list-page consultancy country-page generic-pages category-page lpt-page">
                                                            <label class="form-lebel">

                                                                {{ __('middle_content') }}
                                                            </label>
                                                            <textarea id="mobile_editor2" type="text" class="form-control" name="mobile_middle_content"
                                                                placeholder="{{ __('middle_content') }}">{{ old('mobile_middle_content') }}</textarea>
                                                            @error('middle_content')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row descriptionBlock" >

                                                        <div class="form-group col-12 description_textarea">
                                                            <x-forms.label name=" {{ __('description') }}"
                                                                :required="true" />
                                                            <textarea id="mobile_editor3" type="text" class="form-control editor3" name="mobile_description"
                                                                placeholder="{{ __('enter') }}  {{ __('description') }}">{{ old('mobile_description') }}</textarea>
                                                            <div id="description_iidd" class="editor3"></div>
                                                            <small class="text-danger"></small>
                                                            @error('mobile_description')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <hr>
                                                    @php
                                                        $indexCount = 0;
                                                    @endphp
                                                    <div class="row blog blog_strips_dropdown">
                                                        <div class="d-flex justify-content-between mb-3">
                                                            <label class="form-lebel">Blog Description</label>
                                                            <div class="d-flex justify-content-end" style="width: 67%">
                                                                <select class="form-control me-3" id="selectSection"
                                                                    style="width: 15%;">
                                                                    <option value="BlogDropdown">Blog Dropdown</option>
                                                                    <option value="BlogStrip"> Blog Strip</option>
                                                                </select>
                                                                <select class="form-control" id="stripPosition"
                                                                    style="width: 15%;">
                                                                    <option value="start">Strip in Starting</option>
                                                                    <option value="end" selected>Strip in End</option>
                                                                </select>
                                                                <button type="button" class="btn btn-primary addScore ml-3" style="width: 150px;">Add More <iclass="fa fa-plus ml-2"></i></button>
                                                            </div>
                                                        </div>
                                                        <div class="row appendBlogDescription">
                                                            <div class="col-6 countBlogArray">
                                                                <input type="hidden" value="BlogDropdown" name="blog_array[{{$indexCount}}][blog_type]">
                                                                <div class="form-group">
                                                                    <input type="text" class="form-control blog_header" value="" name="blog_array[{{$indexCount}}][blog_header]"  placeholder="Enter Header Title" />
                                                                </div>
                                                                <div class="form-group">                                                            
                                                                    <textarea id="editor13" type="text" name="blog_array[{{$indexCount}}][blog_description]" class="form-control"  placeholder="Enter Blog Descrition"></textarea>
                                                                </div>
                                                                <small class="text-danger"></small>
                                                            </div>
                                                        </div>              
                                                    </div>
                                                    <hr>

                                                    <div class="row">
                                                        <div
                                                            class="form-group col-12 optional-field consultancy country-page generic-pages category-page admission_desc blog">
                                                            <label class="form-lebel" id='mobile_admission_desc'>
                                                                {{ __('admission_desc') }}
                                                            </label>
                                                            <textarea id="mobile_editor4" type="text" class="form-control"  name="mobile_admission_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('admission_desc') }}">{{ old('mobile_admission_desc') }}</textarea>
                                                            @error('mobile_admission_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field consultancy country-page blog">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel" id="mobile_city_desc">
                                                                {{ __('city_desc') }}
                                                            </label>
                                                            <textarea id="mobile_editor5" type="text" class="form-control" name="mobile_city_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('city_desc') }}">{{ old('mobile_city_desc') }}</textarea>
                                                            @error('mobile_city_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('cost_of_living_desc') }}
                                                            </label>
                                                            <textarea id="mobile_editor6" type="text" class="form-control" name="mobile_cost_of_living_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('cost_of_living_desc') }}">{{ old('mobile_cost_of_living_desc') }}</textarea>
                                                            @error('mobile_cost_of_living_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>



                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('scholarship_desc') }}
                                                            </label>
                                                            <textarea id="mobile_editor7" type="text" class="form-control" name="mobile_scholarship_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('scholarship_desc') }}">{{ old('mobile_scholarship_desc') }}</textarea>
                                                            @error('mobile_scholarship_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>


                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('visa_desc') }}
                                                            </label>
                                                            <textarea id="mobile_editor8" type="text" class="form-control" name="mobile_visa_desc"
                                                                placeholder="{{ __('enter') }}  {{ __('visa_desc') }}">{{ old('mobile_visa_desc') }}</textarea>
                                                            @error('mobile_visa_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row optional-field country-page city-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('course_overview') }}
                                                            </label>
                                                            <textarea id="mobile_editor9" type="text" class="form-control" name="mobile_course_overview"
                                                                placeholder="{{ __('enter') }}  {{ __('course_overview') }}">{{ old('mobile_course_overview') }}</textarea>
                                                            @error('mobile_course_overview')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>


                                                    <div class="row optional-field country-page">

                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                {{ __('similar_countries') }}
                                                            </label>
                                                            <textarea id="mobile_editor10" type="text" class="form-control" name="mobile_similar_countries"
                                                                placeholder="{{ __('enter') }}  {{ __('similar_countries') }}">{{ old('mobile_similar_countries') }}</textarea>
                                                            @error('mobile_similar_countries')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row mobile_university_overview country-page">
                                                        <div class="form-group col-12 ">
                                                            <label class="form-lebel">
                                                                {{ __('University Overview') }}
                                                            </label>
                                                            <textarea id="editor14" type="text" class="form-control" name="mobile_university_overview"
                                                                placeholder="{{ __('university_overview') }}">{{ old('mobile_university_overview') }}</textarea>
                                                            @error('mobile_university_overview')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>

                                                    <div class="row ">
                                                        <div class="form-group col-12 ">
                                                            <label class="form-lebel">
                                                                {{ __('Links Description') }}
                                                            </label>
                                                            <textarea id="editor15" type="text" class="form-control" name="mobile_link_desc"
                                                                placeholder="{{ __('Mobile links descption') }}">{{ old('mobile_link_desc') }}</textarea>
                                                            @error('mobile_link_desc')
                                                                <span
                                                                    class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="card tab-pane" id="tabs-2" role="tabpanel">
                                                <div class="card-body">
                                                    <div class="row ">
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Image Title" :required="false" />
                                                            <x-forms.input type="text" name="imageTitle"
                                                                id="imageTitle" class="required blog"
                                                                value="{{ old('imageTitle') }}"
                                                                placeholder="Enter Image Title" />
                                                            <small class="text-danger"></small>
                                                        </div>
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Image AltText" :required="false" />
                                                            <x-forms.input type="text" name="imageAltText"
                                                                id="imageAltText" class="required blog"
                                                                value="{{ old('imageAltText') }}"
                                                                placeholder="Enter Image AltText" />
                                                            <small class="text-danger"></small>
                                                        </div>
                                                    </div>
                                                    <div class="row ">
                                                        <div class="form-group col-12">
                                                            <x-forms.label name=" {{ __('image') }}"
                                                                :required="false" />
                                                            <div class="upload-btn-wrapper">
                                                                <input type="file" id="image"
                                                                    class="required blog form-control dropify"
                                                                    data-default-file="" name="image"
                                                                    accept="image/png, image/jpg, image/jpeg, image/gif"
                                                                    data-allowed-file-extensions='["jpg", "jpeg","png", "gif"]'
                                                                    data-max-file-size="3M">

                                                            </div>
                                                            <small class="image text-danger"></small>
                                                            @error('image')
                                                                <span class="invalid-feedback d-block"
                                                                    role="alert"><strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="form-group col-12">
                                                            <label class="form-lebel">
                                                                YouTube Video Key
                                                            </label>
                                                            <input type="text" class="form-control"
                                                                name="youtube_key">
                                                            <small class="youtube_key text-danger"></small>
                                                            @error('youtube_key')
                                                                <span class="invalid-feedback d-block"
                                                                    role="alert"><strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>


                                            <div class="card tab-pane" id="tabs-3" role="tabpanel">

                                                <div class="card-body">
                                                    <div class="row">

                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Meta title" :required="false" />
                                                            <x-forms.input type="text" name="meta_title"
                                                                placeholder="Enter meta Title" />
                                                            <x-forms.error name="meta_title" />
                                                        </div>
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Robots" :required="false" />
                                                            <select name="robots"
                                                                class="form-control {{ error('robots') }}"
                                                                id="robots">
                                                                <option value="">{{ __('select_robots') }}</option>
                                                                <option
                                                                    {{ old('robots') == 'noindex, nofollow' ? 'selected' : '' }}
                                                                    value="noindex, nofollow">noindex, nofollow</option>
                                                                <option
                                                                    {{ old('robots') == 'nofollow, index' ? 'selected' : '' }}
                                                                    value="nofollow, index">nofollow, index</option>

                                                                <option
                                                                    {{ old('robots') == 'noindex, follow' ? 'selected' : '' }}
                                                                    value="noindex, follow">noindex, follow</option>
                                                                <option
                                                                    {{ old('robots') == 'index, follow' ? 'selected' : '' }}
                                                                    value="index, follow">index, follow</option>
                                                            </select>
                                                            @error('robots')
                                                                <span class="invalid-feedback d-block"
                                                                    role="alert"><strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>


                                                    </div>

                                                    <div class="row">

                                                        <div class="form-group col-12">
                                                            <x-forms.label name="Meta Description" :required="false" />
                                                            <textarea type="text" class="form-control" name="meta_description" placeholder="Enter meta Description">{{ old('meta_description') }}</textarea>
                                                            <x-forms.error name="meta_description" />
                                                        </div>

                                                    </div>

                                                    <div class="row">
                                                        <div class="form-group col-12">
                                                            <x-forms.label name="Meta keywords" :required="false" />
                                                            <x-forms.input type="text" name="meta_keywords"
                                                                placeholder="Enter meta keywords" />
                                                        </div>

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

                                            <div class="card tab-pane" id="tabs-5" role="tabpanel">
                                                <div class="card-body">
                                                    <div class="row">

                                                        <div class="form-group col-6">
                                                            <x-forms.label
                                                                name="{{ __('publish') }} {{ __('date') }}"
                                                                :required="false" />
                                                            <x-forms.input type="date" id="display_date" name="display_date"
                                                                placeholder="Enter Display Date" />
                                                            <x-forms.error name="display_date" />
                                                        </div>
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Header Strip" :required="false" />
                                                            <x-forms.input type="text" name="header_strip"
                                                                id="header_strip" value="{!! old('header_strip') !!}"
                                                                placeholder="Enter Header Strip" />
                                                            <x-forms.error name="header_strip" />
                                                        </div>
                                                    </div>
                                                    <div class="row blog">
                                                        <div class="form-check form-switch form-group col-6 p-2">
                                                            <div class="form-check form-switch ps-0">
                                                                <label class="form-check-label"
                                                                    for="Tranding"><strong>Trending</strong></label>
                                                                <input class="form-check-input ms-3" type="checkbox"
                                                                    role="switch" name="tranding" id="Tranding"
                                                                    value="1">

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

                                            <div class="card tab-pane" id="tabs-6" role="tabpanel">
                                                <div class="card-body">

                                                    <div class="row ">
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Banner Title" :required="false" />
                                                            <x-forms.input type="text" name="bannerTitle"
                                                                id="bannerTitle" value="{!! old('bannerTitle') !!}"
                                                                placeholder="Enter Banner Title" />
                                                            <small class="text-danger"></small>
                                                        </div>
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Banner Button Name" :required="false" />
                                                            <x-forms.input type="text" name="bannerButtonName"
                                                                id="bannerButtonName" value="{!! old('bannerButtonName') !!}"
                                                                placeholder="Enter Banner Button Name" />
                                                            <small class="text-danger"></small>
                                                        </div>

                                                    </div>
                                                    <div class="row">
                                                        <div class="form-group col-6">
                                                            <x-forms.label name="Banner Description" :required="false" />
                                                            <textarea rows="7" type="text" class="form-control" name="bannerDescription" spellcheck="true"
                                                                placeholder="Enter Banner Description">{!! old('bannerDescription') !!}</textarea>

                                                        </div>
                                                        <div class="form-group col-6">
                                                            <label class="form-lebel">
                                                                Banner Pdf

                                                            </label>
                                                            <div class="upload-btn-wrapper">
                                                                <input type="file" id="bannerPdf"
                                                                    class="form-control dropify" id="bannerPdf"
                                                                    data-default-file="" name="bannerPdf"
                                                                    accept="image/png, image/jpg, image/jpeg, image/gif, image/pdf"
                                                                    data-allowed-file-extensions='["jpg", "jpeg","png", "gif","pdf"]'
                                                                    data-max-file-size="6M">

                                                            </div>
                                                            <small class="bannerPdf text-danger"></small>
                                                            @error('bannerPdf')
                                                                <span class="invalid-feedback d-block"
                                                                    role="alert"><strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            {{-- Quick links --}}
                                            <div class="card tab-pane" id="tabs-9" role="tabpanel">

                                                <div class="card-body">
                                                    <div id="links">
                                                        <div class="row ">
                                                            <div class="form-group col-5">
                                                                <x-forms.label name="Link Name" :required="false" />
                                                                <x-forms.input type="text"
                                                                    name="quick_links[0][link_name]" id="link_name"
                                                                    value="{!! old('link_name') !!}"
                                                                    placeholder="Enter Link Name" />
                                                                <small class="text-danger"></small>
                                                            </div>
                                                            <div class="form-group col-5">
                                                                <x-forms.label name="Link Url" :required="false" />
                                                                <x-forms.input type="text"
                                                                    name="quick_links[0][link_url]" id="link_url"
                                                                    value="{!! old('link_url') !!}"
                                                                    placeholder="Enter Url Name" />
                                                                <small class="text-danger"></small>
                                                            </div>
                                                            <div class="form-group col-2 mt-4 d-flex align-items-end">
                                                                <a role="button" onclick="add_features_field()"
                                                                    class="btn bg-primary text-light"><i
                                                                        class="fas fa-plus"></i></a>


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

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


                                </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    </div>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2/css/select2.min.css">
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
    <link rel="stylesheet" href="{{ asset('backend/plugins/dropify/css/dropify.min.css') }}">
    <style>
        .ck-editor__editable_inline {
            min-height: 160px;
        }

        .select2-results__option[aria-selected=true] {
            display: none;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
            color: #fff;
            border: 1px solid #fff;
            background: #007bff;
            border-radius: 30px;
        }

        .height-124px {
            height: 124px !important
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
            color: #fff;
        }

        .align-items-center {
            -ms-flex-align: center !important;
            align-items: center !important;
        }

        .d-flex {
            display: -ms-flexbox !important;
            display: flex !important;
        }
    </style>
@endsection

@section('script')
    <script src="{{ asset('backend') }}/plugins/select2/js/select2.full.min.js"></script>
    <script src="{{ asset('backend/plugins/dropify/js/dropify.min.js') }}"></script>
    <script src="{{ asset('tinymce/tinymce.min.js') }}" referrerpolicy="origin"></script>
    <script>
        $(document).on("click", "#remove_item", function() {
            $(this).parent().parent('div').remove();
        });
        var count = 1;

        function add_features_field() {
            $('#links').append(
                `<div class="" id="links">
          <div class="row ">
         <div class="form-group col-5">
          <x-forms.label name="link Name" :required="false" />
           <x-forms.input type="text" name="quick_links[${count}][link_name]" id="quick_links"
            value="{!! old('link_name') !!}"
            placeholder="Enter Link Name" />
            <small class="text-danger"></small>
        </div>
        <div class="form-group col-5">
           <x-forms.label name="Link Url" :required="false" />
           <x-forms.input type="text" name="quick_links[${count}][link_url]" id="quick_links"
            value="{!! old('link_url') !!}"
            placeholder="Enter Url Name" />
            <small class="text-danger"></small>
        </div>
        <div class="form-group col-2 mt-4 d-flex align-items-end">
                    <a role="button" id="remove_item"
                        class="btn bg-danger text-light"><i class="fas fa-times"></i></a>
          </div>

         </div>                                      
        </div>`
            )
            count++;
        }





        $('.select2bs4').select2({
            theme: 'bootstrap4'
        });
        $('.select2bs44').select2({
            theme: 'bootstrap4',
            multiple: true,
            placeholder: 'Select Tags'
        });


        // dropify
        $('.dropify').dropify();

        for (var i = 0; i < 20; i++) {
            tinymce.init({
                selector: `#newEditor${i}`,
                plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount code imagetools fontawesome',
                toolbar: 'fontawesome | searchreplace | code |undo redo | blocks |bold italic underline strikethrough | align | link image media table | numlist bullist indent outdent',
                image_advtab: true,
                valid_elements: '*[*]',
                valid_children: '*[*]',
                extended_valid_elements: '*[*]',
                images_upload_handler: function(blobInfo, success, failure) {
                    return new Promise(function(resolve, reject) {
                        var xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', "{{ route('module.blog.upload') }}", true);
                        xhr.onload = function() {
                            var response = JSON.parse(xhr.responseText);
                            if (response.status === 200) {
                                var serverURL = window.location.protocol + '//' + window.location
                                    .hostname + ':' + window.location.port;
                                var imageURL = serverURL + '/' + response.location;
                                success(imageURL);
                                resolve(imageURL);
                            } else if (response.status === 403) {
                                reject(response.message);
                            }
                        };
                        xhr.onerror = function() {
                            reject('An error occurred during the image upload.');
                        };
                        var formData = new FormData();
                        formData.append('file', blobInfo.blob(), blobInfo.filename());
                        formData.append('_token', $('meta[name="csrf-token"]').attr('content'));
                        xhr.send(formData);
                    });
                }
            });
        }

        function editor(id) {
            tinymce.init({
                selector: `#newEditor${id}`,
                plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount code imagetools fontawesome',
                toolbar: 'fontawesome | searchreplace | code |undo redo | blocks |bold italic underline strikethrough | align | link image media table | numlist bullist indent outdent',
                image_advtab: true,
                valid_elements: '*[*]',
                valid_children: '*[*]',
                extended_valid_elements: '*[*]',
                images_upload_handler: function(blobInfo, success, failure) {
                    return new Promise(function(resolve, reject) {
                        var xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', "{{ route('module.blog.upload') }}", true);
                        xhr.onload = function() {
                            var response = JSON.parse(xhr.responseText);
                            if (response.status === 200) {
                                var serverURL = window.location.protocol + '//' + window.location
                                    .hostname + ':' + window.location.port;
                                var imageURL = serverURL + '/' + response.location;
                                success(imageURL);
                                resolve(imageURL);
                            } else if (response.status === 403) {
                                reject(response.message);
                            }
                        };
                        xhr.onerror = function() {
                            reject('An error occurred during the image upload.');
                        };
                        var formData = new FormData();
                        formData.append('file', blobInfo.blob(), blobInfo.filename());
                        formData.append('_token', $('meta[name="csrf-token"]').attr('content'));
                        xhr.send(formData);
                    });
                }
            });          
        }

        for (var i = 0; i < 20; i++) {
            tinymce.init({
                selector: `#editor${i}`,
                plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount code imagetools fontawesome',
                toolbar: 'fontawesome | searchreplace | code |undo redo | blocks |bold italic underline strikethrough | align | link image media table | numlist bullist indent outdent',
                image_advtab: true,
                valid_elements: '*[*]',
                valid_children: '*[*]',
                extended_valid_elements: '*[*]',
                images_upload_handler: function(blobInfo, success, failure) {
                    return new Promise(function(resolve, reject) {
                        var xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', "{{ route('module.blog.upload') }}", true);
                        xhr.onload = function() {
                            var response = JSON.parse(xhr.responseText);
                            if (response.status === 200) {
                                var serverURL = window.location.protocol + '//' + window.location
                                    .hostname + ':' + window.location.port;
                                var imageURL = serverURL + '/' + response.location;
                                success(imageURL);
                                resolve(imageURL);
                            } else if (response.status === 403) {
                                reject(response.message);
                            }
                        };
                        xhr.onerror = function() {
                            reject('An error occurred during the image upload.');
                        };
                        var formData = new FormData();
                        formData.append('file', blobInfo.blob(), blobInfo.filename());
                        formData.append('_token', $('meta[name="csrf-token"]').attr('content'));
                        xhr.send(formData);
                    });
                }
            });
        }

        $('.dropify').dropify();


        for (var i = 0; i < 20; i++) {
            tinymce.init({
                selector: `#mobile_editor${i}`,
                plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount code imagetools fontawesome',
                toolbar: 'fontawesome | searchreplace | code |undo redo | blocks |bold italic underline strikethrough | align | link image media table | numlist bullist indent outdent',
                image_advtab: true,
                valid_elements: '*[*]',
                valid_children: '*[*]',
                extended_valid_elements: '*[*]',
                images_upload_handler: function(blobInfo, success, failure) {
                    return new Promise(function(resolve, reject) {
                        var xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', "{{ route('module.blog.upload') }}", true);
                        xhr.onload = function() {
                            var response = JSON.parse(xhr.responseText);
                            if (response.status === 200) {
                                var serverURL = window.location.protocol + '//' + window.location
                                    .hostname + ':' + window.location.port;
                                var imageURL = serverURL + '/' + response.location;
                                success(imageURL);
                                resolve(imageURL);
                            } else if (response.status === 403) {
                                reject(response.message);
                            }
                        };
                        xhr.onerror = function() {
                            reject('An error occurred during the image upload.');
                        };
                        var formData = new FormData();
                        formData.append('file', blobInfo.blob(), blobInfo.filename());
                        formData.append('_token', $('meta[name="csrf-token"]').attr('content'));
                        xhr.send(formData);
                    });
                }
            });
        }
    </script>
    <script>
        $(document).ready(function() {
            $(".optional-field").hide();
            $(".category-page").hide();
            $(".country-page").hide();
            var selectElement = document.getElementById("category_id");
            var categoryId = selectElement.value;
            if (categoryId !== null) {
                var className = $('option:selected', this).data('class').trim();
            } else {
                var className = null;
            }
            let url = $('option:selected', this).data('url');            
            categoryHideShowFunction(className, url);

        });

        $("#category_id").change(function() {
            $(".optional-field").hide();
            $(".category-page").hide();
            $(".country-page").hide();
            var className = $('option:selected', this).data('class').trim();
            let url = $('option:selected', this).data('url');
            categoryHideShowFunction(className, url);
            if(className != 'blog'){
                $('.description_textarea').show();
            }
        });


        function categoryHideShowFunction(className, url) {
            $('.blog_strips_dropdown').hide();
            $('.description_textarea').hide();
            $(".optional-field").hide();
            $(".category-page").hide();
            $(".country-page").hide();
            if(url == 'city-page'){
                $('.consultancy').show();
                $('.admission_desc').hide();
                $('.city-page').show();
            }else{
                $("." + className).show();
            }

            if(className != 'blog'){
                $('.description_textarea').show();                
            }
            if(className == 'blog'){
                $('#admission_desc').text('Exam Strip');
                $('#mobile_admission_desc').text('Exam Strip');
                $('#city_desc').text('Course Strip');
                $('#mobile_city_desc').text('Course Strip');
                $('#cost_of_living_desc').text('Interactive Strip');
            }
            else if(className == 'consultancy'){
                $('.descriptionBlock').hide();
                $('#city_desc').text('Lower Content');
                $('#mobile_city_desc').text('Lower Content');
            }
            else{
                $('#admission_desc').text('Admission Description');
                $('#mobile_admission_desc').text('Admission Description');
                $('#city_desc').text('City Description');
                $('.descriptionBlock').show();
                $('#mobile_city_desc').text('City Description');
                $('#cost_of_living_desc').text('Cost of Living Description');
            }
        }
    </script>
    <script>
        function validateForm(event, form) {
            event.preventDefault();

            var category_ids = $('#category_id').val();
            var title = $('#title').val();
            var url = $('#url').val();
            var description = tinymce.get("editor3").getContent();
            var relative_university = $('#relative_university').val();
            var header_description = tinymce.get('editor16').getContent();
            var header_title = $('#header_title').val();
            var images = $('#image').val();
            var imageTitle = $('#imageTitle').val();
            var imageAltText = $('#imageAltText').val();
            $('.text-danger').text('');
            var isValid = true;

            if (title.trim() === '') {
                $('#title').next('.text-danger').text('Please enter a title.');
                $('#title').focus();
                isValid = false;
                return;
            }

            if (url.trim() === '') {
                $('#url').next('.text-danger').text('Please enter a URL.');
                $('#url').focus();
                isValid = false;
                return;
            }

            if (category_ids === null || category_ids === undefined || category_ids === '') {
                $('#category_id').nextAll('.text-danger').first().text('Please select a category.');
                $('#category_id').focus();
                isValid = false;
                return;
            }

            if (description == '') {
                $('a[href="#tabs-1"').click();
                $('#description_iidd').next('.text-danger').text('Please enter a description.');
                $('#description_iidd').focus();
                $('html, body').animate({
                    scrollTop: $('#description_iidd').offset().top
                }, 500);
                isValid = false;
                return;
            }

            var selectElement = document.getElementById("category_id");
            var categoryId = selectElement.value;
            var className = $('option:selected', selectElement).data('class').trim();
            if (className) {
                if (className == "blog") {
                    if (header_title.trim() === '') {
                        $('a[href="#tabs-1"').click();
                        $('#header_title').nextAll('.text-danger').first().text('Please enter a Header Title.');
                        $('#header_title').focus();
                        isValid = false;

                    } else if (header_description.trim() === '') {
                        $('a[href="#tabs-1"').click();
                        $('.header_description').nextAll('.text-danger').first().text('Please enter a Header Title.');
                        $('.header_description').focus();
                        isValid = false;

                    } else if (imageTitle.trim() === '') {
                        $('a[href="#tabs-2"]').click();
                        $('#imageTitle').nextAll('.text-danger').first().text('Please enter a Image Title.');
                        $('#imageTitle').focus();
                        isValid = false;
                    } else if (imageAltText.trim() === '') {
                        $('a[href="#tabs-2"]').click();
                        $('#imageAltText').nextAll('.text-danger').first().text('Please enter a Image AltText.');
                        $('#imageAltText').focus();
                        isValid = false;
                    } else if (images === null || images === undefined || images === '') {

                        var imagess = $('#image').data('default-file');
                        if (imagess.includes("default-post.png") || imagess === null) {
                            $('a[href="#tabs-2"]').click();
                            $('.image').text('Please select an image.');
                            $('#image').focus();
                            isValid = false;
                        }
                    }

                    let blog_array = $('.countBlogArray');
                    if (blog_array.length > 1) {
                        blog_array.each(function(index, element) {
                            let blog_header = $(this).find('.blog_header').val();
                            let editor_id = $(this).find('textarea').attr('id');

                            console.log(editor_id);
                            let blog_description = tinymce.get(editor_id).getContent();
                            if (blog_header != '' || blog_description != '') {
                                if (blog_header == '') {
                                    isValid = false;
                                    $(this).find('.text-danger').text('Please enter above Blog Header.');
                                    $(this).find('.text-danger')[0].scrollIntoView({
                                        behavior: 'smooth',
                                        block: 'end'
                                    });
                                    return false;
                                } else if (blog_description == '') {
                                    isValid = false;
                                    console.log(this);
                                    $(this).find('.text-danger').text('Please enter above Blog Description.');
                                    $(this).find('.text-danger')[0].scrollIntoView({
                                        behavior: 'smooth',
                                        block: 'end'
                                    });
                                    return false;
                                }
                            }
                        });
                    }

                    let blog_strip_array = $('.countBlogStripArray');                                                    
                    if(blog_strip_array.length > 1 ){
                        blog_strip_array.each(function(index, element) {
                            let editor_id = $(this).find('textarea').attr('id');
                            let blog_strip = tinymce.get(editor_id).getContent();
                            if(blog_strip == ''){
                                $(this).find('.text-danger').text('Please enter Blog Strip.');
                                $(this).find('.text-danger')[0].scrollIntoView({ behavior: 'smooth', block: 'end' });
                                isValid = false;
                                return false;
                            }
                        });
                    }
                } else if (className == "country-page") {
                    if ($('#country_id').val() === null || $('#country_id').val() === undefined || $('#country_id')
                    .val() === '') {
                        $('#country_id').nextAll('.text-danger').first().text('Please select country.');
                        $('#country_id').focus();
                        isValid = false;
                    }
                } else if (className == "category-page") {
                    if ($('#parent_category_id').val() === null || $('#parent_category_id').val() === undefined || $(
                            '#parent_category_id').val() === '') {
                        $('#parent_category_id').nextAll('.text-danger').first().text('Please select category.');
                        $('#parent_category_id').focus();
                        isValid = false;
                    }

                } else if (className == "consultancy") {
                    if (header_title.trim() === '') {
                        $('#header_title').nextAll('.text-danger').first().text('Please enter a Header Title.');
                        $('#header_title').focus();
                        isValid = false;

                    } else if (header_description.trim() === '') {
                        $('.header_description').nextAll('.text-danger').first().text('Please enter a Header Title.');
                        $('.header_description').focus();
                        isValid = false;
                    }

                }                
            }
            
            if (isValid) {

                var buttonName = event.submitter.name;

                var buttonName = event.submitter.name;

                if (buttonName === 'save_close_button') {
                    $('#button_type').val(buttonName);
                } else if (buttonName === 'submit_button') {
                    $('#button_type').val(buttonName);
                }
                form.submit();
            }
        }

        var indexCount = {{$indexCount}};
        $('.addScore').on('click', function () {
            indexCount++;
            let section = $('#selectSection').val();
            let position = $('#stripPosition').val();        
            let sectionHtml = '';
            if(section == 'BlogDropdown'){
                sectionHtml = 
                `                    
                    <div class="col-6 countBlogArray" id="block${indexCount}">
                        <input type="hidden" value="${section}" name="blog_array[${indexCount}][blog_type]">
                        <div class="form-group" style="position: relative;">
                            <input type="text" class="form-control blog_header" name="blog_array[${indexCount}][blog_header]"  placeholder="Enter Header Title" />
                            <i class="fa fa-times removeButton" onclick="removeBlock('block${indexCount}')" style="position: absolute; top: 50%; transform: translateY(-50%); right: 10px;"></i>
                        </div>
                        <div class="form-group">                                                            
                            <textarea type="text" class="form-control blog_description" id="newEditor${indexCount}" name="blog_array[${indexCount}][blog_description]" placeholder="Enter Blog Descrition"></textarea>
                        </div>
                        <small class="text-danger"></small>
                    </div>
                `
            }else if(section == 'BlogStrip'){
                sectionHtml = 
                `
                    <div class="col-6 countBlogStripArray" id="block${indexCount}">
                        <input type="hidden" value="${section}" name="blog_array[${indexCount}][blog_type]">
                        <div class="form-group" style="position: relative;">
                            <input type="text" class="form-control" placeholder="Enter Header Title" readonly/>
                            <i class="fa fa-times removeButton" onclick="removeBlock('block${indexCount}')" style="position: absolute; top: 50%; transform: translateY(-50%); right: 10px;"></i>
                        </div>
                        <div class="form-group">                                                            
                            <textarea type="text" class="form-control blog_strip" id="newEditor${indexCount}" name="blog_array[${indexCount}][blog_strip]" placeholder="Enter Blog Descrition"></textarea>
                        </div>
                        <small class="text-danger"></small>
                    </div>
                `
            }
        
            if(position == 'start'){
                $('.appendBlogDescription').prepend(sectionHtml);
            }else{
                $('.appendBlogDescription').append(sectionHtml);
            }    
            editor(indexCount);
        });

        function removeBlock(id) {
            $('#'+id).remove();
            let count = $('.countBlogArray').length;     
            if(count == 0){
                $('.addScore').trigger('click');
            }
        }



        $(".university_overview").hide();
        $('.select_country_show').hide();
        $('.relative_university').hide();

        $('#category_id').on('change', function() {
            var selectedCategory = $(this).find('option:selected').data('class');
            if (selectedCategory != 'media-page' || selectedCategory != 'test-preparation') {
                $('.relative_university').hide();
                $('.select_country_show').show();
            }
        });

        $(document).on('change', '#status', function () {
            let statusValue = $(this).val();
            console.log(statusValue);
            if(statusValue == 'published'){
                let displayDateValue = $('#display_date').val();
                if (!displayDateValue) { // Check if display_date is empty
                    let today = new Date();
                    let dd = String(today.getDate()).padStart(2, '0');
                    let mm = String(today.getMonth() + 1).padStart(2, '0');
                    let yyyy = today.getFullYear();

                    let todayStr = yyyy + '-' + mm + '-' + dd;
                    console.log(todayStr);
                    $('#display_date').val(todayStr);
                }
            }
        });

        $(document).ready(function() {
            $('#status').trigger('change');

            $('#country_id').on('change', function() {
                var selectedCountry = $(this).val();
                var university_id = "";
                var university_name = "";
                $('#relative_university').empty();
                $('#relative_university').empty().append($('<option>').val('').text('Select University'));
                $.ajax({
                    url: "{{ route('module.blog.get-universities') }}",
                    type: 'GET',
                    data: {
                        country_id: selectedCountry
                    },
                    dataType: 'json',
                    success: function(data) {
                        $.each(data, function(index, university) {
                            university_id = university.id;
                            university_name = university.name;
                            $('#relative_university').append($('<option>').val(
                                university_id).text(university_name));
                        });

                        $('.relative_university').show();
                    },
                    error: function() {

                        console.error('Failed to fetch universities.');
                    }
                });
            });
            $("#relative_university").on("change", function() {
                $(".university_overview").show();
                $(".mobile_university_overview").show();
            });
        });
    </script>
@endsection