{% extends 'base.html' %}

{% load crispy_forms_tags %}

{% block content %}
  <nav aria-label="breadcrumb">
    <ol class="breadcrumb">
      <li class="breadcrumb-item"><a href="{% url 'teachers:quiz_change_list' %}">問題作成データ</a></li>
      <li class="breadcrumb-item active" aria-current="page">{{ quiz.name }}</li>
    </ol>
  </nav>
  <h2 class="mb-3">
    {{ quiz.name }}
    <a href="{% url 'teachers:quiz_results' quiz.pk %}" class="btn btn-primary float-right">解答者データ</a>
  </h2>
  <div class="row mb-3">
    <div class="col-md-6 col-sm-8 col-12">
      <form method="post" novalidate>
        {% csrf_token %}
        {{ form|crispy }}
        <button type="submit" class="btn btn-success">保存</button>
        <a href="{% url 'teachers:quiz_change_list' %}" class="btn btn-outline-secondary" role="button">キャンセル</a>
        <a href="{% url 'teachers:quiz_delete' quiz.pk %}" class="btn btn-danger float-right">消去</a>
      </form>
    </div>
  </div>
  <div class="card">
    <div class="card-header">
      <div class="row">
        <div class="col-7">
          <strong>問題</strong>
        </div>
        <div class="col-3">
          <strong>解説</strong>
        </div>
        <div class="col-2">
          <strong>設問数</strong>
        </div>
      </div>
    </div>
    <div class="list-group list-group-flush list-group-formset">
      {% for question in questions %}
        <div class="list-group-item">
          <div class="row">
            <div class="col-7">
              <a href="{% url 'teachers:question_change' quiz.pk question.pk %}">{{ question.text }}</a>
            </div>
            <div class="col-3">
              {% if question.explanation %}
                ○
              {% else %}
                ✕
              {% endif %}
            </div>
            <div class="col-2">
              {{ question.answers_count }}
            </div>
          </div>
        </div>
      {% empty %}
        <div class="list-group-item text-center">
          <p class="text-muted font-italic mb-0">まだ問題は作成されていません。</p>
        </div>
      {% endfor %}
    </div>
    <div class="card-footer">
      <a href="{% url 'teachers:question_add' quiz.pk %}" class="btn btn-primary btn-sm">問題の追加</a>
    </div>
  </div>
{% endblock %}