{% extends 'workflows/base_shell.html' %}
{% load static i18n %}

{% block title %}{% trans "Anfragen Dashboard" %}{% endblock %}



{% block extra_css %}
<link rel="stylesheet" href="{% static 'workflows/css/requests_dashboard.css' %}" />
{% endblock %}

{% block shell_body %}
<div class="topbar">
      <div class="brand-wrap">
        <a class="app-brand" href="/"><img class="brand-logo" src="{{ portal_logo_url }}" alt="{{ portal_company_name }} Logo" /></a>
      </div>
      <div class="quick-actions">
        <form method="post" action="{% url 'set_language' %}" class="lang-switch">
          {% csrf_token %}
          <input type="hidden" name="next" value="{{ request.get_full_path }}" />
          <button class="lang-btn {% if CURRENT_LANGUAGE == 'de' %}active{% endif %}" type="submit" name="language" value="de">DE</button>
          <button class="lang-btn {% if CURRENT_LANGUAGE == 'en' %}active{% endif %}" type="submit" name="language" value="en">EN</button>
        </form>
        <a class="btn btn-secondary" href="/">{% trans "Zur Startseite" %}</a>
      </div>
    </div>

    <section class="top-stack">
      <section class="hero">
        <div class="hero-grid">
          <div class="hero-card">
<span class="eyebrow">{% trans "Operations Console" %}</span>
<h1>{% trans "Anfragen Dashboard" %}</h1>
<p>{% trans "Steuert Onboarding- und Offboarding-Prozesse an einem Ort. Die Oberfläche priorisiert Kennzahlen, Aktivität und direkte Aktionen in der Vorgangsliste." %}</p>
            <div class="hero-pills">
<span class="hero-pill">{% trans "Onboarding + Offboarding" %}</span>
<span class="hero-pill">{% trans "PDFs + Live-Protokolle" %}</span>
<span class="hero-pill">{% trans "Suche + Bulk-Aktionen" %}</span>
            </div>
          </div>
          <article class="chart-card activity-card">
            <div class="section-head">
              <div>
<h2>{% trans "Aktivitätsverlauf" %}</h2>
<p>{% trans "Die letzten 14 Tage in einer kompakten Ansicht über alle Onboarding- und Offboarding-Vorgänge." %}</p>
              </div>
<span class="eyebrow">{% trans "14 Tage" %}</span>
            </div>
            <div class="chart" aria-label="Aktivitätsverlauf der letzten 14 Tage">
              {% for point in chart_points %}
                <div class="chart-col">
                  <div class="bar-value">{{ point.total }}</div>
                  <div class="bar-wrap">
                    <div class="bar" style="height: {{ point.height }}px"></div>
                  </div>
                  <div class="bar-label">{{ point.label }}</div>
                </div>
              {% endfor %}
            </div>
          </article>
        </div>
      </section>

      <section class="metrics-grid">
      <article class="stat-card">
        <div class="stat-head">
          <div>
<p class="stat-title">{% trans "Onboarding" %}</p>
            <div class="stat-value">{{ onboarding_total }}</div>
          </div>
          <div class="stat-kicker">ON</div>
        </div>
<div class="stat-foot">{% trans "Alle erfassten Onboarding-Vorgänge im aktuellen System." %}</div>
      </article>
      <article class="stat-card red">
        <div class="stat-head">
          <div>
<p class="stat-title">{% trans "Offboarding" %}</p>
            <div class="stat-value">{{ offboarding_total }}</div>
          </div>
          <div class="stat-kicker">OFF</div>
        </div>
<div class="stat-foot">{% trans "Austritte und Rückgaben in derselben Prozessübersicht." %}</div>
      </article>
      <article class="stat-card gold">
        <div class="stat-head">
          <div>
<p class="stat-title">{% trans "Gesamtbestand" %}</p>
            <div class="stat-value">{{ combined_total }}</div>
          </div>
          <div class="stat-kicker">Σ</div>
        </div>
<div class="stat-foot">{% trans "Alle Vorgänge, durchsuchbar und mit Dokumenten verknüpft." %}</div>
      </article>
      <article class="stat-card ink">
        <div class="stat-head">
          <div>
<p class="stat-title">{% trans "Aktivität 14 Tage" %}</p>
            <div class="stat-value">{{ chart_points|length }}</div>
          </div>
          <div class="stat-kicker">D</div>
        </div>
<div class="stat-foot">{% trans "Zeitraum des visuellen Aktivitätsverlaufs in dieser Übersicht." %}</div>
      </article>
    </section>
    </section>

    {% include 'workflows/includes/messages.html' %}

    <section class="content-grid">
      <section class="table-card" id="vorgaenge">
        <div class="table-head">
          <div>
<h2>{% trans "Vorgänge" %}</h2>
<p>{% trans "Dokumente, Status und Einweisungsaktionen in einer verdichteten Arbeitsansicht." %}</p>
          </div>
<div class="table-head-meta">{% blocktrans with count=rows|length trimmed %}{{ count }} Einträge sichtbar{% endblocktrans %}</div>
        </div>
        <div class="table-controls">
          <div class="table-controls-grid">
            <div class="control-stack">
              <form method="get" action="/requests/#vorgaenge" class="search-form">
                <div class="search-box">
<input type="search" name="q" value="{{ search_query }}" placeholder="{% trans "Nach Name oder E-Mail suchen" %}" aria-label="{% trans "Nach Name oder E-Mail suchen" %}" />
                </div>
                <div class="filter-grid">
                  <div class="filter-field">
                    <label for="type-filter">{% trans "Typ" %}</label>
                    <select id="type-filter" name="type">
                      <option value="">{% trans "Alle" %}</option>
                      <option value="onboarding" {% if selected_type == 'onboarding' %}selected{% endif %}>{% trans "Onboarding" %}</option>
                      <option value="offboarding" {% if selected_type == 'offboarding' %}selected{% endif %}>{% trans "Offboarding" %}</option>
                    </select>
                  </div>
                  <div class="filter-field">
                    <label for="status-filter">{% trans "Status" %}</label>
                    <select id="status-filter" name="status">
                      <option value="">{% trans "Alle" %}</option>
                      {% for choice in status_choices %}
                      <option value="{{ choice.value }}" {% if selected_status == choice.value %}selected{% endif %}>{{ choice.label }}</option>
                      {% endfor %}
                    </select>
                  </div>
                  <div class="filter-field">
                    <label for="department-filter">{% trans "Abteilung" %}</label>
                    <select id="department-filter" name="department">
                      <option value="">{% trans "Alle" %}</option>
                      {% for department in departments %}
                      <option value="{{ department }}" {% if selected_department == department %}selected{% endif %}>{{ department }}</option>
                      {% endfor %}
                    </select>
                  </div>
                  <div class="filter-field">
                    <label for="date-from-filter">{% trans "Von" %}</label>
                    <input id="date-from-filter" type="date" name="date_from" value="{{ date_from }}" />
                  </div>
                  <div class="filter-field">
                    <label for="date-to-filter">{% trans "Bis" %}</label>
                    <input id="date-to-filter" type="date" name="date_to" value="{{ date_to }}" />
                  </div>
                </div>
                <div class="intro-actions">
<button class="btn btn-primary" type="submit">{% trans "Suchen" %}</button>
                  {% if has_filters %}
<a class="btn btn-secondary" href="/requests/#vorgaenge">{% trans "Zurücksetzen" %}</a>
                  {% endif %}
                </div>
              </form>
            </div>
            {% if can_delete_requests %}
            <div class="control-stack">
              <form method="post" action="/requests/" id="bulk-delete-form" data-confirm="{% trans 'Ausgewählte Einträge wirklich löschen?' %}">
                {% csrf_token %}
                <div class="bulk-toolbar">
<span class="bulk-info"><span id="selected-count">0</span> {% trans "ausgewählt" %}</span>
<button class="btn btn-secondary" type="submit">{% trans "Auswahl löschen" %}</button>
                </div>
              </form>
            </div>
            {% endif %}
          </div>
        </div>
        <div class="table-wrap">
          <table>
            <thead>
              <tr>
                {% if can_delete_requests %}<th class="select-col"><input type="checkbox" id="select-all" aria-label="Alle auswählen" /></th>{% endif %}
<th>{% trans "Typ" %}</th>
<th>{% trans "Person" %}</th>
<th>{% trans "E-Mail" %}</th>
<th>{% trans "Dokument" %}</th>
{% if can_run_intro_session or can_generate_intro_pdfs %}<th>{% trans "Einweisung" %}</th>{% endif %}
{% if can_view_request_timeline or can_retry_requests or can_delete_requests %}<th>{% trans "Aktion" %}</th>{% endif %}
              </tr>
            </thead>
            <tbody>
              {% for row in rows %}
              <tr>
                {% if can_delete_requests %}
                <td class="select-col">
                  <input type="checkbox" class="row-select" name="selected_requests" value="{{ row.kind_slug }}:{{ row.id }}" aria-label="{{ row.kind }} {{ row.name }}" form="bulk-delete-form" />
                </td>
                {% endif %}
                <td>
                  <span class="kind-pill {% if row.kind_slug == 'onboarding' %}onboarding{% else %}offboarding{% endif %}">{{ row.kind }}</span>
                </td>
                <td>
                  <div class="name-cell">
                    <div class="person-name">{{ row.name }}</div>
                  </div>
                </td>
                <td>
                  <a class="mail-link" href="mailto:{{ row.work_email }}">{{ row.work_email }}</a>
                </td>
                <td>
                  {% if row.pdf_url %}
<a class="doc-link" href="{{ row.pdf_url }}" target="_blank" rel="noopener">{% trans "PDF öffnen" %}</a>
                  {% else %}
<span class="person-meta">{% trans "Noch nicht verfügbar" %}</span>
                  {% endif %}
                  {% if row.status_key == 'failed' %}
                  <div class="person-meta" style="margin-top:8px; color:#8e1e1e;">{% trans "Fehlgeschlagen" %}</div>
                    {% if row.last_error %}
                  <div class="person-meta" style="margin-top:6px; color:#8e1e1e;">{{ row.last_error|truncatechars:140 }}</div>
                    {% endif %}
                  {% endif %}
                </td>
                {% if can_run_intro_session or can_generate_intro_pdfs %}
                <td class="actions-cell intro-panel">
                  {% if row.kind_slug == 'onboarding' %}
                    <details>
<summary class="intro-toggle">{% trans "Einweisung" %}</summary>
                      <div class="intro-menu">
                        <div class="intro-group">
<div class="intro-group-title">{% trans "Live-Protokoll" %}</div>
                          <div class="intro-actions">
                            {% if can_run_intro_session %}
<a class="btn btn-secondary" href="/requests/onboarding/{{ row.id }}/intro-session/">{% trans "Einweisung öffnen" %}</a>
                            {% endif %}
                            {% if can_run_intro_session and row.intro_session and row.intro_session.exported_pdf_url %}
<a class="btn btn-secondary" href="{{ row.intro_session.exported_pdf_url }}" target="_blank" rel="noopener">{% trans "Live-Protokoll öffnen" %}</a>
                            {% endif %}
                          </div>
                        </div>
                        {% if can_generate_intro_pdfs %}
                        <div class="intro-group">
<div class="intro-group-title">{% trans "Standard-Einweisungs-PDF" %}</div>
                          <div class="intro-actions">
                            {% if row.intro_pdf_url %}
                              <form method="post" action="/requests/onboarding/{{ row.id }}/intro-pdf/generate/" class="inline-form">
                                {% csrf_token %}
<button class="btn btn-secondary" type="submit">{% trans "Neu erzeugen" %}</button>
                              </form>
<a class="btn btn-secondary" href="{{ row.intro_pdf_url }}" target="_blank" rel="noopener">{% trans "Standard-PDF öffnen" %}</a>
                            {% else %}
                              <form method="post" action="/requests/onboarding/{{ row.id }}/intro-pdf/generate/" class="inline-form">
                                {% csrf_token %}
<button class="btn btn-secondary" type="submit">{% trans "PDF erzeugen" %}</button>
                              </form>
                            {% endif %}
                          </div>
                        </div>
                        {% endif %}
                      </div>
                      {% if row.intro_session %}
<div class="intro-meta">{% trans "Status:" %} {{ row.intro_session.get_status_display }}</div>
                      {% endif %}
                    </details>
                  {% else %}
<span class="person-meta">{% trans "Nicht relevant" %}</span>
                  {% endif %}
                </td>
                {% endif %}
                {% if can_view_request_timeline or can_retry_requests or can_delete_requests %}
                <td class="actions-cell">
                  {% if can_view_request_timeline %}
                  <a class="btn btn-secondary" href="/requests/timeline/{{ row.kind_slug }}/{{ row.id }}/">{% trans "Timeline" %}</a>
                  {% endif %}
                  {% if can_retry_requests and row.status_key == 'failed' %}
                  <form method="post" action="/requests/retry/{{ row.kind_slug }}/{{ row.id }}/" class="inline-delete" data-confirm="{% trans 'Eintrag erneut verarbeiten?' %}">
                    {% csrf_token %}
<button class="btn btn-secondary" type="submit">{% trans "Erneut versuchen" %}</button>
                  </form>
                  {% endif %}
                  {% if can_delete_requests %}
                  <form method="post" action="/requests/" class="inline-delete" data-confirm="{% trans 'Eintrag wirklich löschen?' %}">
                    {% csrf_token %}
<button class="btn btn-secondary" type="submit" name="single_delete" value="{{ row.kind_slug }}:{{ row.id }}">{% trans "Löschen" %}</button>
                  </form>
                  {% endif %}
                </td>
                {% endif %}
              </tr>
              {% empty %}
              <tr>
<td colspan="{{ column_count }}" class="empty-state">{% trans "Noch keine Vorgänge vorhanden." %}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      </section>
    </section>
    <div class="footer-bar">
<div class="footer-note">{{ portal_title }}</div>
    </div>
{% endblock %}

{% block extra_scripts %}
<script src="{% static 'workflows/js/requests_dashboard.js' %}"></script>
{% endblock %}