@extends('front.layouts.master')
@section('title', isset($title) ? $title : 'Home')
@section('description', isset($description) ? $description : '')
@section('keywords', isset($keywords) ? $keywords : '')
@section('content')

<!-- Breadcrumb Area -->
<div class="breadcrumb-area">
  <div class="container">
    <div class="breadcrumb-wrap text-center">
      <h2 class="page-title">{{ __('Membership') }}</h2>
      <ul class="breadcrumb-pages">
        <li class="page-item"><a class="page-item-link" href="{{ route('front') }}">{{ __('Home') }}</a></li>
        <li class="page-item">{{ __('Membership') }}</li>
      </ul>
    </div>
  </div>
</div>

<!-- Work Area -->
<div class="section">
  <div class="container">
    <div class="card border-0 rscnMembershipCard">
      <div class="card-header pb-0 border-bottom-0 bg-transparent">
        <div class="rscnMemberTit">{{ $title }}/{{ $user->name }}</div>
      </div>
      <form enctype="multipart/form-data" method="POST" action="{{ route('membershipForm.store') }}">
        @csrf
        <input type="hidden" id="type" name="type" value="{{ $type }}">
        <input type="hidden" id="user_id" name="user_id" value="{{ $user->id }}">
        <div class="card-body pb-0">
          @if($type == 'individual')
            @include('front.membership_new.admin.from_fields_current_user.individual')
          @elseif($type == 'employee')
            @include('front.membership_new.admin.from_fields_current_user.employee')
          @elseif($type == 'family')
            @include('front.membership_new.admin.from_fields_current_user.family')
          @elseif($type == 'corporate')
            @include('front.membership_new.admin.from_fields_current_user.corporate')
          @endif
        </div>
        <div class="card-footer border-top-0 bg-transparent">
          <button type="submit" class="btn rscnSaveBtn">{{ __('Save & Continue') }}</button>
        </div>
      </form>
    </div>
  </div>
</div>

@include('sweetalert::alert')

@endsection
@push('post_script')
  <script src="{{ asset('admin/js/jquery-3.6.0.min.js') }}"></script>
  <script src="{{ asset('admin/js/popper.min.js') }}"></script>
  <script src="{{ asset('admin/js/bootstrap.min.js') }}"></script>
  <script src="{{ asset('admin/js/custom/password-show.js') }}"></script>
  <script src="{{ asset('admin/js/custom/multiselect-dropdown.js') }}"></script>
  <script type="text/javascript">
    $(function() {
      let value = "962";
      $("#txtPhone").text(value);
      $("#country").change(function() {
        let countryCode = $(this).find('option:selected').data('country-code');
        $("#txtPhone").text(countryCode);
      });
    })
  </script>
  <script type="text/javascript">
    $(document).on("change",".countryList",function() {
      let countryCode = $(this).find('option:selected').data('country-code');
      $(this).parent().parent().find(".txtPhone1").text(countryCode);
    });
    $('.countryList').change();
  </script>
  <script>
    $('.add').click(function() {
      var ele = $('.block').clone(true);
      ele.find('.add-more-section').each(function(index) {
        console.log(ele);
        ele.find('input,select').each(function() {
          this.name = this.name.replace('['+index+']', '[' + (index + 1) + ']');
        });
      });
      $('.block:last').before(
        '<div class="block">' + ele[0].innerHTML +
        '<span class="remove rscnRemove">{{ __('Remove Option') }}</span><hr class="rscnFormDividorWith-my"></div>'
      );
      $('.countryList').change();
    });
    $('.optionBox').on('click', '.remove', function() {
      $(this).parent().remove();
    });
  </script>
@endpush