{% load i18n %}
{% load tz %}
<div id="openassessment__staff-info" class="wrapper--staff-info wrapper--ui-staff">
<div class="staff-info ui-staff ui-toggle-visibility is--collapsed">
    <h2 class="staff-info__title ui-staff__title ui-toggle-visibility__control">
      <i class="ico icon-caret-right"></i>
      <span class="staff-info__title__copy">{% trans "Course Staff Information" %}</span>
    </h2>

    <div class="staff-info__content ui-staff__content ui-toggle-visibility__content">

        <div class="staff-info__summary ui-staff__content__section">
            <dl class="submissions--total">
                <dt class="label">{% trans "Response total" %}:</dt>
                <dd class="value">{{ num_submissions }}</dd>
            </dl>
        </div>

        <div class="staff-info__status ui-staff__content__section">
          {% trans "Location" %}: {{ item_id }}
        </div>

        <div class="staff-info__status ui-staff__content__section">
            <table class="staff-info__status__table" summary="{% trans "Where are your students currently in this problem" %}">

                <caption class="title">{% trans "Student Progress" %}</caption>

                <thead>
                    <tr>
                        <th abbr="Step" scope="col">{% trans "Problem Step" %}</th>
                        <th abbr="# of Students" scope="col">{% trans "Active Students in Step" %}</th>
                    </tr>
                </thead>

                <tbody>
                  {% for item in status_counts %}
                  <tr>
                      <td class="label">{{ item.status }}</td>
                      <td class="value">{{ item.count }}</td>
                  </tr>
                  {% endfor %}
                </tbody>
            </table>
        </div>

        <div class="staff-info__status ui-staff__content__section">
            <table class="staff-info__status__table" summary="{% trans "Dates" %}">

                <caption class="title">{% trans "Dates" %}</caption>

                <thead>
                    <tr>
                        <th abbr="Problem Step" scope="col">{% trans "Problem Step" %}</th>
                        <th abbr="Release" scope="col">{% trans "Release Date" %}</th>
                        <th abbr="Due" scope="col">{% trans "Due Date" %}</th>
                    </tr>
                </thead>

                <tbody>
                  {% for item in step_dates %}
                  <tr>
                      <td class="label">{{ item.step }}</td>

                      {% if item.start %}
                      <td class="value">{{ item.start|utc|date:"N j, Y H:i e" }}</td>
                      {% else %}
                      <td class="value">{% trans "N/A" %}</td>
                      {% endif %}

                      {% if item.due %}
                      <td class="value">{{ item.due|utc|date:"N j, Y H:i e" }}</td>
                      {% else %}
                      <td class="value">{% trans "N/A" %}</td>
                      {% endif %}
                  </tr>
                  {% endfor %}
                </tbody>
            </table>
        </div>

        {% if display_schedule_training %}
        <div class="staff-info__classifierset ui-staff__content__section">
            {% if classifierset %}
            <table class="staff-info__classifierset__table" summary="{% trans "Classifier set" %}">
                <caption class="title">{% trans "Classifier set" %}</caption>
                <thead>
                    <th abbr="Field" scope="col">{% trans "Field" %}</th>
                    <th abbr="Value" scope="col">{% trans "Value" %}</th>
                </thead>
                <tbody>
                    <tr>
                        <td class="value">{% trans "Created at" %}</td>
                        <td class="value">{{ classifierset.created_at }}</td>
                    </tr>
                    <tr>
                        <td class="value">{% trans "Algorithm ID" %}</td>
                        <td class="value">{{ classifierset.algorithm_id }}</td>
                    </tr>
                    <tr>
                        <td class="value">{% trans "Course ID" %}</td>
                        <td class="value">{{ classifierset.course_id }}</td>
                    </tr>
                    <tr>
                        <td class="value">{% trans "Item ID" %}</td>
                        <td class="value">{{ classifierset.item_id }}</td>
                    </tr>
                </tbody>
            </table>
            {% else %}
            {% trans "No classifiers are available for this problem" %}
            {% endif %}
        </div>

        <div class="staff-info__status ui-staff__content__section">
            <a aria-role="button" href="" id="schedule_training" class="action--submit"><span class="copy">{% trans "Schedule Example-Based Assessment Training" %}</span></a>
            <div id="schedule_training_message"></div>
        </div>
        {% endif %}

        {% if display_reschedule_unfinished_tasks %}
        <div class="staff-info__status ui-staff__content__section">
            <a aria-role="button" href="" id="reschedule_unfinished_tasks" class="action--submit"><span class="copy">{% trans "Reschedule All Unfinished Example-Based Assessment Grading Tasks" %}</span></a>
            <div id="reschedule_unfinished_tasks_message"></div>
        </div>
        {% endif %}

        <div class="staff-info__student ui-staff__content__section">
            <div class="wrapper--input" class="staff-info__student__form">
                <form id="openassessment_student_info_form">
                    <ul>
                        <li class="openassessment__student-info_list">
                            <label for="openassessment__student_username" class="label">{% trans "Get Student Info" %}</label>
                        </li>
                        <li class="openassessment__student-info_list">
                            <input id="openassessment__student_username" type="text" class="value" maxlength="255">
                        </li>
                    </ul>
                    <ul class="list list--actions">
                        <li class="list--actions__item">
                            <a aria-role="button" href="" id="submit_student_username" class="action--submit"><span class="copy">{% trans "Submit" %}</span></a>
                        </li>
                    </ul>
                </form>
            </div>
            <div id="openassessment__student-info" class="staff-info__student__report"></div>
        </div>
    </div>
  </div>
</div>
