{% extends "base.html" %}
{% block title %}Teacher Timetable{% endblock %}
{% block page_title %}Teacher Timetable View{% endblock %}
{% set active = "teacher-tt" %}

{% block topbar_actions %}
{% if selected_teacher %}
<a href="/export/teacher/{{ selected_teacher }}/pdf" class="btn btn-ghost btn-sm" target="_blank">
  Export PDF
</a>
{% endif %}
{% endblock %}

{% block content %}
<div class="class-tabs-wrap">
  <div class="class-tabs">
    {% for t in teachers %}
    <a href="/teacher-timetable?teacher_id={{ t.id }}"
       class="class-tab {% if t.id == selected_teacher %}active{% endif %}">
      {{ t.name }}
    </a>
    {% endfor %}
  </div>
</div>

{% if not cfg or not teachers %}
<div class="empty-state">
  <div class="empty-icon">👩‍🏫</div>
  <h3>No timetable or teachers yet</h3>
  <a href="/teachers" class="btn btn-primary">Add Teachers</a>
</div>
{% elif not grid %}
<div class="empty-state">
  <div class="empty-icon">📅</div>
  <h3>No periods assigned</h3>
  <p>Generate the class timetable first.</p>
  <a href="/timetable" class="btn btn-primary">View Timetable</a>
</div>
{% else %}
<div class="tt-container">
  <div class="tt-scroll">
    <table class="timetable">
      <thead>
        <tr>
          <th class="day-col">Day</th>
          {% for p in periods %}
            {% if p in break_periods %}<th class="break-col">Break</th>
            {% else %}<th>P{{ p }}</th>{% endif %}
          {% endfor %}
        </tr>
      </thead>
      <tbody>
        {% for day in days %}
        <tr>
          <td class="day-label">{{ day }}</td>
          {% for p in periods %}
          {% set cell = grid.get((day, p), {}) %}
            {% if p in break_periods %}
            <td class="cell-break">☕</td>
            {% elif cell %}
            <td class="tt-cell">
              <div class="cell-inner" style="border-left: 3px solid #4F8EF7">
                <div class="cell-subject">{{ cell.subj_name }}</div>
                <div class="cell-teacher">Gr.{{ cell.grade }}-{{ cell.section }}</div>
              </div>
            </td>
            {% else %}
            <td class="tt-cell cell-free"><div class="cell-free-label">Free</div></td>
            {% endif %}
          {% endfor %}
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

<!-- Workload Summary -->
<div class="card" style="margin-top:20px">
  <div class="card-header"><h3>Weekly Workload</h3></div>
  <div class="card-body">
    {% set total = [] %}
    {% for day in days %}{% for p in periods %}{% if grid.get((day,p)) and p not in break_periods %}{% set _ = total.append(1) %}{% endif %}{% endfor %}{% endfor %}
    <div class="workload-bar">
      <div class="workload-fill" style="width: {{ [total|length * 5, 100]|min }}%"></div>
    </div>
    <p style="margin:8px 0 0;color:#64748b;font-size:14px">
      <strong>{{ total|length }}</strong> teaching periods per week
    </p>
  </div>
</div>
{% endif %}
{% endblock %}