@extends('layouts.hcp')
@section('content')

<div class="bg-light">
    <div class="container pt-3">
        <nav class="mb-0">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{route('index')}}"><u>Home</u></a></li>
                <li class="breadcrumb-item"><a href="{{route('hcp.index')}}"><u>Healthcare Professionals</u></a></li>
                <li class="breadcrumb-item"><a href="{{route('hcp.practice-support')}}"><u>Practice Support</u></a></li>
                <li class="breadcrumb-item active" aria-current="page">Directory Listing</li>
            </ol>
        </nav>
    </div>
</div>
<div class="py-5">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-6 text-center">
        <h5 class="subtitle mb-4 text-pry">Directory Listing</h5>
        <p>Are you a licensed healthcare professional trained in utilizing the Snyder Hemband? We'd love to include you in our online directory. Please complete the below form and we'll get in touch shortly with next steps.</p>
      </div>
    </div>
  </div>
</div>
<div class="bg-light">
  <div class="container py-5">
    <div class="row justify-content-center">
      <div class="col-lg-8">
        <h5 class="header mb-4">Complete the form below</h5>
        <form class="" action="{{ route('hcp.submit-practice-support-directory-listing-request') }}" method="post" autocomplete="off">
          @csrf
          <div class="row">
            <div class="col-12">
              @if(session('success'))
                <div class="alert alert-success fade show" role="alert">
                    {{session('success')}}
                </div>
              @endif

              @if($errors->any())
              <div class="alert alert-danger fade show" role="alert">
                  There were errors found!
              </div>
              @endif
            </div>
            <div class="col-lg-6 form-group mb-4">
              <label>First Name <span class="text-danger">*</span> </label>
              <input type="text" class="form-control rounded-0 py-3" required name="name_first" value="{{ old('name_first') }}">
              @error('name_first')
                <small class="text-warning">{{$message}}</small>
              @enderror
            </div>
            <div class="col-lg-6 form-group mb-4">
              <label>Last Name <span class="text-danger">*</span> </label>
              <input type="text" class="form-control rounded-0 py-3" required name="name_last" value="{{ old('name_last') }}">
              @error('name_last')
                <small class="text-warning">{{$message}}</small>
              @enderror
            </div>
          </div>
          <div class="form-group mb-4">
            <label>Title <span class="text-danger">*</span> </label>
            <input type="text" class="form-control rounded-0 py-3" required name="title" value="{{ old('title') }}">
            @error('title')
                <small class="text-warning">{{$message}}</small>
              @enderror
          </div>
          <div class="row">
            <div class="col-lg-5 form-group mb-4">
              <label>Practice Name <span class="text-danger">*</span> </label>
              <input type="text" class="form-control rounded-0 py-3" required name="practice_name" value="{{ old('practice_name') }}">
              @error('practice_name')
                <small class="text-warning">{{$message}}</small>
              @enderror
            </div>
            <div class="col-lg-3 form-group mb-4">
              <label>Practice Zip Code <span class="text-danger">*</span> </label>
              <input type="text" class="form-control rounded-0 py-3 zip" required name="zip" value="{{ old('zip') }}">
              @error('zip')
                <small class="text-warning">{{$message}}</small>
              @enderror
            </div>
            <div class="col-lg-4 form-group mb-4">
              <label>Practice Phone Number <span class="text-danger">*</span> </label>
              <input type="tel" class="form-control rounded-0 py-3 phone" required name="phone" value="{{ old('phone') }}">
              @error('phone')
                <small class="text-warning">{{$message}}</small>
              @enderror
            </div>
          </div>
          <div class="form-group mb-4">
            <label>Contact Email <span class="text-danger">*</span> </label>
            <input type="email" class="form-control rounded-0 py-3" required name="email" value="{{ old('email') }}">
            @error('email')
                <small class="text-warning">{{$message}}</small>
              @enderror
          </div>
          <div class="form-group mb-4">
            <label>Other comments</label>
            <textarea name="comment" class="form-control rounded-0" rows="6">{{ old('comment') }}</textarea>
            @error('comment')
                <small class="text-warning">{{$message}}</small>
              @enderror
          </div>
          <div class="form-group mb-4">
            {!! htmlFormSnippet() !!}
            @error('g-recaptcha-response')
              <small class="text-danger"><i class="fas fa-exclamation-triangle mr-2"></i>Invalid</small>
            @enderror
          </div>
          <button type="submit" class="btn btn-pry w-100 py-3">SUBMIT</button>
        </form>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
  function showField(_elem, _trigger) {
    var name = _elem.name;
    var val = $(_elem).val();
    if (val == _trigger) {
      $('.'+name).removeClass('d-none')
    }else {
      $('.'+name).addClass('d-none');
    }
  }
</script>
@endsection
