@extends('admin.layouts.master')

@section('title','service Page')

@section('content')
  <div class="container-fluid">
    <div class="row justify-content-center p-10 m-t-15">
      <div class="col-12">
        <form class="leadForm_wizard"
              action="{{isset($service) ? route('admin.services.update', $service) : route('admin.services.store')}}"
              method="POST" enctype="multipart/form-data">
          @csrf
          @isset($service)
            @method('PUT')
          @endisset
          <h4>Form inputs</h4>
          <div class="row">
            <div class="col-6 form-group">
              <label for="title_ar">Arabic Title</label>
              <input type="text" name="title_ar" class="form-control" id="title_ar" value="" placeholder="Arabic Title">
            </div>
            <div class="col-6 form-group">
              <label for="title_en">English Title</label>
              <input type="text" name="title_en" class="form-control" id="title_en" value=""
                     placeholder="English Title">
            </div>
          </div>
          <div class="row">
            <div class="col-6 form-group">
              <label for="desc_ar">Arabic Description</label>
              <textarea class="form-control ckeditor" name="desc_ar" id="content_ar" rows="3"></textarea>
            </div>
            <div class="col-6 form-group">
              <label for="desc_en">English Description</label>
              <textarea class="form-control ckeditor" name="desc_en" id="content_en" rows="3"></textarea>
            </div>
            <div class="col-6 form-group">
              {{-- <input type="number" class="form-control" name="section" value="{{request()->section_id}}" /> --}}
              <label for="Section">select Section</label>
              <select class="form-control" name="section">
                <option selected hidden>Select the Section</option>
                <option value="{{\App\AboutService::SECTION_FOR_SALE}}"> For Sale</option>
                <option value="{{\App\AboutService::SECTION_FOR_RENT}}"> For Rent</option>
                <option value="{{\App\AboutService::SECTION_PARTICIPATION}}"> Participation</option>
                <option value="{{\App\AboutService::SECTION_FOR_SWAP}}"> For Swap</option>
                <option value="{{\App\AboutService::SECTION_INCOME_PROPERTIES_INCOME}}"> Income Properties</option>
                <option value="{{\App\AboutService::SECTION_IN_AUCTION}}"> In Auction</option>
                <option value="{{\App\AboutService::SECTION_EXCLUSIVE_PROPERTIES}}"> Exclusive Properties</option>
                <option value="{{\App\AboutService::NEW_PROJECTS}}"> New Projects</option>
                <option value="{{\App\AboutService::SECTION_MORTGAGE}}"> Mortgage</option>
                <option value="{{\App\AboutService::SECTION_FORECLOSURE}}">Foreclosure</option>
                <option value="{{\App\AboutService::SECTION_SERVICED_APARTMENTS}}">Serviced Apartments</option>
                <option value="{{\App\AboutService::SECTION_REQUEST_FOR_BUY}}">Request Buy</option>
                <option value="{{\App\AboutService::SECTION_REQUEST_RENT}}">Request Rent</option>
              </select>
            </div>
            <div class="col-6 form-group">
              <label for="icon">select Icon</label>
              <div class="d-flex">
                <select class="custom-select" id="icon" name="icon">
                  @foreach($icons as $icon)
                    <option value="{{$icon->class}}">
                    {{$icon->class}}
                    </option>
                  @endforeach
                </select>
                <div id="icon__container" style="margin-inline-start: 5px;font-size: 26px;"></div>
              </div>
            </div>
          </div>
          <button type="submit" class="btn btn-primary">Save</button>
        </form>
      </div>
    </div>
  </div>
@endsection

@section('js')

<script>
	  $("#icon__container").html('<i class="' + $('#icon').val() + '"></i>');

    $("#icon").change(function(){
      var icono = $(this).val();
      $("#icon__container").html('<i class="' + icono + '"></i>');
    });
</script>

  @if(count($errors))
    @include('admin.layouts.js.old')
  @endif

  @isset($service)
    @include('admin.layouts.js.values', ['values' => $service] )
  @endisset
@endsection