{% extends "base.html" %}
{% block title %}Заявки — {{ client.name }} — Support Admin{% endblock %}
{% block content %}

{# ── Шапка клиента ── #}
<div style="display:flex;align-items:center;gap:12px;margin-bottom:16px">
  <a href="/admin/intradesk/clients" class="btn btn-secondary">← Назад</a>
  <h1 style="margin:0">{{ client.name }}</h1>
  {% if client.client_type == 10 %}
    <span class="badge badge-auth">Компания</span>
  {% elif client.client_type == 20 %}
    <span class="badge badge-pending">Физлицо</span>
  {% endif %}
</div>

{# ── Краткая инфо о клиенте ── #}
{% if client.email or client.address or client.description %}
<div class="card" style="padding:14px 20px">
  <div style="display:flex;gap:24px;flex-wrap:wrap;font-size:.85rem">
    {% if client.email %}<div>📧 {{ client.email }}</div>{% endif %}
    {% if client.address %}<div>📍 {{ client.address }}</div>{% endif %}
    {% if client.description %}
    <div style="flex-basis:100%;color:#555">{{ client.description }}</div>
    {% endif %}
  </div>
</div>
{% endif %}

{# ── Контактные лица ── #}
{% if users %}
<div class="card">
  <h2>Контактные лица ({{ users | length }})</h2>
  <table>
    <thead><tr><th>Имя</th><th>Email</th><th>Телефон</th></tr></thead>
    <tbody>
      {% for u in users %}
      <tr>
        <td>{{ u.name or (u.last_name ~ ' ' ~ u.first_name ~ ' ' ~ u.middle_name)|trim }}</td>
        <td style="font-size:.85rem">{{ u.email or '—' }}</td>
        <td style="font-size:.85rem">{{ u.phone or '—' }}</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endif %}

{# ── Фильтр заявок ── #}
<div class="card">
  <div class="filter-bar" style="margin-bottom:12px">
    <form method="get" style="display:flex;gap:8px;flex-wrap:wrap">
      <input type="hidden" name="page" value="0">
      <select name="status" onchange="this.form.submit()" style="width:auto">
        <option value="">Все статусы</option>
        {% for s in statuses %}
        <option value="{{ s }}" {% if status == s %}selected{% endif %}>{{ s }}</option>
        {% endfor %}
      </select>
      <button type="submit" class="btn btn-secondary">Применить</button>
      {% if status %}
      <a href="?page=0" class="btn btn-secondary">Сбросить</a>
      {% endif %}
    </form>
    <span style="margin-left:auto;font-size:.85rem;color:#666">
      Всего заявок: <strong>{{ total }}</strong>
    </span>
  </div>

  {# ── Таблица заявок ── #}
  {% if tasks %}
  <table>
    <thead>
      <tr>
        <th>#</th>
        <th>Тема</th>
        <th>Статус</th>
        <th>Приоритет</th>
        <th>Сервис</th>
        <th>Исполнитель</th>
        <th>Создана</th>
        <th>Обновлена</th>
      </tr>
    </thead>
    <tbody>
      {% for t in tasks %}
      <tr>
        <td style="font-size:.8rem;color:#666;white-space:nowrap">{{ t.task_number or t.id }}</td>
        <td style="max-width:260px">
          <span title="{{ t.name }}">
            {{ t.name[:80] }}{% if t.name | length > 80 %}…{% endif %}
          </span>
        </td>
        <td style="white-space:nowrap">
          {% set sn = t.status_name | lower %}
          {% if 'выполнен' in sn %}
            <span class="badge badge-closed">{{ t.status_name }}</span>
          {% elif 'работ' in sn %}
            <span class="badge badge-in_progress">{{ t.status_name }}</span>
          {% elif 'открыт' in sn %}
            <span class="badge badge-open">{{ t.status_name }}</span>
          {% else %}
            <span class="badge badge-pending">{{ t.status_name or '—' }}</span>
          {% endif %}
        </td>
        <td style="font-size:.85rem;white-space:nowrap">
          {% set pn = t.priority_name | lower %}
          {% if 'критич' in pn %}🔴{% elif 'высок' in pn %}🟠{% elif 'средн' in pn %}🟡{% else %}⚪{% endif %}
          {{ t.priority_name or '—' }}
        </td>
        <td style="font-size:.8rem;color:#555;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"
            title="{{ t.service_full_name or '' }}">
          {{ t.service_name or '—' }}
        </td>
        <td style="font-size:.85rem">{{ t.executor_name or '—' }}</td>
        <td style="font-size:.8rem;color:#666;white-space:nowrap">
          {{ (t.created_at or '')[:10] or '—' }}
        </td>
        <td style="font-size:.8rem;color:#666;white-space:nowrap">
          {{ (t.updated_at or '')[:10] or '—' }}
        </td>
      </tr>
      {% if t.description %}
      <tr style="background:#fafafa">
        <td></td>
        <td colspan="7" style="font-size:.8rem;color:#555;padding:4px 12px 8px">
          {{ t.description | striptags | truncate(200) }}
        </td>
      </tr>
      {% endif %}
      {% endfor %}
    </tbody>
  </table>

  {# ── Пагинация ── #}
  {% if pages > 1 %}
  <div style="display:flex;gap:8px;margin-top:14px;align-items:center;flex-wrap:wrap">
    {% if page > 0 %}
    <a href="?status={{ status }}&page={{ page - 1 }}" class="btn btn-secondary">← Назад</a>
    {% endif %}
    <span style="font-size:.85rem;color:#666">
      Стр. {{ page + 1 }} из {{ pages }}
    </span>
    {% if page < pages - 1 %}
    <a href="?status={{ status }}&page={{ page + 1 }}" class="btn btn-secondary">Вперёд →</a>
    {% endif %}
  </div>
  {% endif %}

  {% else %}
  <p style="color:#999">
    {% if status %}Нет заявок со статусом «{{ status }}».{% else %}Нет заявок.{% endif %}
  </p>
  {% endif %}
</div>
{% endblock %}