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

<div class="row">
  <div class="col-12">
    {% if studygroups is not empty %}
      <div class="table-responsive">
        <table class="table table-striped table-hover table-bordered">
          <caption class="sr-only">Studiengruppen</caption>
          <thead>
            <tr>
              <th scope="col" class="align-middle text-center">Studiengruppen-ID</th>
                {% if not singlevariants %}
                  <th scope="col" class="align-middle text-center">Variante</th>
                {% endif %}
                {% if canSeeUsername %}
                <th scope="col" class="align-middle text-center">Nutzernamen</th>
                {% else %}
                <th scope="col" class="align-middle text-center">User-IDs</th>
                {% endif %}
              <th scope="col" class="align-middle text-center">Zugewiesene Trainings</th>
              <th scope="col" class="align-middle text-center">Zeitlich zugewiesene Trainings</th>
              <th scope="col" class="align-middle text-center">Abhängig zugewiesene Trainings</th>
            </tr>
          </thead>
          <tbody>
            {% for sg in studygroups %}
              {% for sg_v_index, sg_v in sg['variants'] %}
                <tr>
                  <th scope="row" class="align-middle">{{ sg['studygroup_name'] }}</th>
                  {% if not singlevariants %}
                    <td class="align-middle">{{ sg_v_index+1 }}</td>
                  {% endif %}
                  {% if canSeeUsername %}
                    <td class="align-middle">
                      {% for user in sg_v['user'] %}
                        {{ user.display_name }}{% if not loop.last %},{% endif %}
                      {% endfor %}
                    </td>
                  {% else %}
                    <td class="align-middle">
                      {% for user in sg_v['user'] %}
                        {{ user.id }}{% if not loop.last %},{% endif %}
                     {% endfor %}
                    </td>
                  {% endif %}
                  <td class="align-middle">
                    {% for t in sg_v['trainings'] %}
                      {% if not t.getTrainingEnable() %}<i class="fas fa-eye-slash" aria-hidden="true" title="Training ist ausgeblendet"></i><span class="sr-only">Training ist ausgeblendet</span>&nbsp{% endif %}{{ t.title }}{% if not loop.last %},{% endif %}
                    {% else %}
                      -
                    {% endfor %}
                  </td>
                  <td class="align-middle">
                    {% for t_date in sg_v['datetrainings'] %}
                      {{ alltrainings[t_date.getTrainingId()].title }}&nbsp;({{ t_date.assignDatetime|date("d.m.Y") }}){% if not loop.last %},{% endif %}
                    {% else %}
                      -
                    {% endfor %}
                  </td>
                  <td class="align-middle">
                    {% for t_dep in sg_v['deptrainings'] %}
                      {{ alltrainings[t_dep.getTrainingId()].title }}&nbsp;({% for dep_tr in t_dep. getDependentTrainingsJsonDecoded() %}{{ alltrainings[dep_tr].title }}{% if not loop.last and loop.revindex != 2 %}, {% endif %}{% if loop.revindex == 2 %}{% if t_dep.getDependentCondition() == 'or' %} oder {% elseif t_dep.getDependentCondition() == 'and' %} und {% endif %}{% endif %}{% endfor %}){% if not loop.last %},{% endif %}
                    {% else %}
                      -
                    {% endfor %}
                  </td>
                </tr>
              {% endfor %}
            {% endfor %}
          </tbody>  
        </table>
      </div>
    {% else %}
      <div class="alert alert-info" role="alert">
        <h5><i aria-hidden="true" class="fas fa-info-circle"></i>&nbsp;Hinweis</h5>
        <p>
            Es gibt noch keine Studiengruppen im System.
        </p>
      </div>
    {% endif %}
  </div>
</div>