<h1 class="text-center mb-5">{{ heading }}</h1>

<div class="row">
  <div class="offset-md-2 col-md-8">

    <form id="create-user-manually-form">

      <div class="form-group mb-4">
        <label class="label-above" for="input-field-user-name">Benutzername</label><span class="ml-1 text-danger">*</span>
        <input type="text" class="form-control"  name="username" id="input-field-user-name" placeholder="Benutzername" required>
        <span class="invalid-feedback d-none">Bitte geben Sie einen gültigen Benutzernamen ein.</span>
      </div>
    
      <div class="form-group">
        <label class="label-above"  for="input-field-mail">E-Mail</label><span class="ml-1 text-danger">*</span>
        <input type="email" class="form-control" id="input-field-mail" name="email" aria-describedby="emailHelp" placeholder="E-Mail" required>
        <span class="invalid-feedback d-none">Bitte geben Sie eine gültige E-Mail-Adresse ein.</span>
      </div>
      <div class="form-check mb-4 d-flex align-items-center">
        <input type="checkbox" class="form-check-input" id="checkbox-create-user-manually" name="check-mail" value="checked" checked>
        <label class="form-check-label ml-2" for="checkbox-create-user-manually">E-Mail-Benachrichtigung senden</label>
      </div>

      <div class="form-group mb-4">
        <label class="label-above"  for="input-field-studienid">Studienteilnehmer-ID</label>
        <input type="text" class="form-control" id="input-field-studienid" name="studienid"  placeholder="Studienteilnehmer-ID">
      </div>

      <div class="form-group mb-4">
        <label class="label-above"  for="input-field-studienid">Studiengruppen-ID</label>
        <input type="text" class="form-control" id="input-field-studiengruppenid" name="studiengruppenid"  placeholder="Studiengruppen-ID">
      </div>

      <div class="form-group mb-4">
        <label class="label-above" for="selectbox-trainer">Coach</label>
        <select class="form-control" id="selectbox-trainer" name="selectbox-trainer">
            <option value="">-</option>
            {% for trainer in trainers %}
            <option value="{{trainer.ID}}">{{trainer.display_name}}</option>
          {% endfor %}
        </select>
      </div>
    
      <div class="form-group mb-4">
        <label  class="label-above" for="selectbox-profil">Vorlage</label>
        <select class="form-control" id="selectbox-profil" name="selectbox-profil">
            <option value="">-</option>
            {% for vorlage in vorlagen %}
            <option value="{{vorlage.ID}}">{{vorlage.name}}</option>
          {% endfor %}
        </select>
      </div>

      {% if userCanGivePermissions %}
        <h3>Berechtigungen:</h3>
        {% for role in roles %}
          {% if userCanGivePermissionsAll or (userCanGivePermissionsBoss and role.getId() == "boss") or (userCanGivePermissionsTeamleader and role.getId() == "teamLeader") or (userCanGivePermissionskAdmin and role.getId() == "kAdmin") %}
            <div class="form-check {% if not loop.last %}mb-3{% endif %} d-flex align-items-center">
              <input class="form-check-input permission-checkbox" type="checkbox" value="{{ role.getId() }}" id="checkbox-{{ role.getId() }}">
              <div class="col-11 pl-3">
                <label class="form-check-label" for="checkbox-{{ role.getId() }}">
                  {{ role.getTitle() }}<br>
                  <span class="text-muted"><small>{{role.getDescription() }}</small></span>
                </label>
              </div>
            </div>
          {% endif %}
        {% else %}
          <div class="alert alert-info" role="alert">
            <h5><i class="fas fa-info-circle"></i>&nbsp;Hinweis</h5>
            <p class="mb-0">
              Es sind noch keine Berechtigungsrollen vorhanden, die vergeben werden können.
            </p>
          </div>
        {% endfor %}
      {% endif%}

      <br>
      <div class="form-group has-error">
        <span id="user-create-manually-error" class="invalid-feedback d-none"></span>
      </div>
      <button class="btn btn-primary" id="create-user-manually-button">Neuen Account anlegen</button>
      <p class="text-muted m-0">Alle mit <span class="text-danger">*</span> gekennzeichneten Felder sind Pflichtfelder.</p>
      {{submitnonce | raw}}
    
    </form>
    
  </div><!--/col-md-8-->

</div><!--/row-->

