{% extends "base.html" %}
{% block title %}{{ tr('Сотрудники') }} — Puntavia{% endblock %}
{% block nav_team %}on{% endblock %}

{% block head %}
<style>
{# люди — плитками в одном блоке, как машины: общий слой .machwrap,
   .devgrid/.devcard, .mach-tools, .iconbtn, dialog.modal.
   Группы машин живут на «Машинах»: сотрудник — про отчёты, не про доступ. #}
.xhint{margin:0 0 16px}
.xhint a{color:var(--accent)}
.machines{display:flex;flex-wrap:wrap;gap:6px}
/* служебная выгрузка свёрнута: её несут в gestoría, а не смотрят каждый день */
.foldcard>summary{cursor:pointer;list-style:none;font-weight:600;
  font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;gap:8px;user-select:none}
.foldcard>summary::-webkit-details-marker{display:none}
.foldcard>summary::before{content:"\203a";font-size:16px;line-height:1;
  transition:transform .15s;display:inline-block}
.foldcard[open]>summary::before{transform:rotate(90deg)}
.foldcard>summary:hover{color:var(--fg)}
.foldcard[open]>summary{margin-bottom:12px}
.foldcard{margin-top:16px}
</style>
{% endblock %}

{% block crumb %}<span class="crumb"><span class="sep">/</span><span class="cr-here">{{ tr('Сотрудники') }}</span><span class="cr-note">{{ tr('людей') }} {{ people|length }}</span></span>{% endblock %}

{% block content %}
{% from "_ava.html" import ava, avapick with context %}
<div class="pagetabs">{% with tab = 'team' %}{% include "_tabs_team.html" %}{% endwith %}</div>
<div class="pagewrap">
{# перекрёстная подсказка, парная к «Доступу» #}
<p class="sub xhint">{{ tr('За кем закреплены компьютеры — сами они в кабинет не заходят.') }}
  {{ tr('Кто смотрит отчёты —') }} <a href="/users">{{ tr('на вкладке «Доступ»') }}</a>.</p>

<div class="card machwrap">
  <div class="card-h wsum">{{ tr('Люди') }}<span class="cnt">{{ people|length }}</span>
    {% if can_manage %}
    <span class="mach-tools">
      <button class="iconbtn" type="button" title="{{ tr('Добавить сотрудника') }}"
              aria-label="{{ tr('Добавить сотрудника') }}"
              onclick="document.getElementById('addPerson').showModal()">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"><path d="M12 5.2v13.6M5.2 12h13.6"/></svg>
      </button>
    </span>
    {% endif %}
  </div>

  {% if people %}
  <div class="devgrid">
    {% for p in people %}
    <div class="devcard">
      <div class="devcard-h">{{ ava(p.name, p.avatar, 24) }}<span class="nm-a">{{ p.name }}</span>
        {%- if not p.active %} <span class="tag">{{ tr('не работает') }}</span>{% endif %}</div>
      <div class="devfields">
        <div class="devfield">
          <div class="k">{{ tr('машины') }}</div>
          <div class="v machines">
            {% for d in by_person.get(p.id, []) %}
              <span class="chip{{ ' off' if not d.enabled }}">{{ d.name }}</span>
            {% else %}
              <span class="muted">{{ tr('машин нет') }}</span>
            {% endfor %}
          </div>
        </div>
      </div>
      {% if can_manage %}
      <details class="edit">
        <summary>{{ tr('Изменить') }}</summary>
        <form class="formrow edit-body" method="post">
          <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
          <input type="hidden" name="action" value="update_person">
          <input type="hidden" name="id" value="{{ p.id }}">
          <div class="field"><label>{{ tr('Имя') }}</label>
            <input class="inp sm" type="text" name="name" value="{{ p.name }}"
                   maxlength="120"></div>
          <label class="chkline" style="flex:none;padding-bottom:9px">
            <input type="checkbox" name="active" {{ 'checked' if p.active }}>
            <span class="muted">{{ tr('работает') }}</span></label>
          <button class="btn out sm" type="submit">{{ tr('Сохранить') }}</button>
          <div class="field" style="flex:1 1 100%">
            <label>{{ tr('Аватар') }}</label>
            {{ avapick(p.name, p.avatar) }}
          </div>
        </form>
      </details>
      {% endif %}
    </div>
    {% endfor %}
  </div>
  {% else %}
  <div class="empty in-card">
    <b>{{ tr('Сотрудников пока нет') }}</b>
    {{ tr('Заведите людей здесь, а на странице «Машины» закрепите за ними компьютеры. Сотрудник склеивает несколько машин в одну строку отчёта; доступ раздаётся группами машин на «Машинах».') }}
  </div>
  {% endif %}
</div>

{% if free %}
<div class="card" style="margin-top:18px">
  <div class="card-h">{{ tr('Машины без сотрудника') }}</div>
  <p class="sub">{{ tr('Пока машина ни за кем не закреплена, в отчётах она идёт отдельной строкой.') }}
    <a href="/devices">{{ tr('Закрепить →') }}</a></p>
  <div class="machines" style="margin-top:8px">
    {% for d in free %}<span class="chip">{{ d.name }}</span>{% endfor %}
  </div>
</div>
{% endif %}

{# Выгрузка для проверки — служебное действие, его несут в gestoría, а не
   смотрят каждый день. Свёрнута, чтобы не конкурировать с главным списком. #}
<details class="card foldcard">
  <summary>{{ tr('Учёт рабочего времени за период') }}</summary>
  <p class="sub" style="margin-bottom:10px">{{ tr('По каждому сотруднику и дню: начало, конец, перерывы и отработанное время. Таблица открывается в Excel — это то, что показывают при проверке.') }}</p>
  <form class="formrow" method="get" action="/export/jornada.csv">
    <div class="field"><label for="ef">{{ tr('С') }}</label>
      <input class="inp sm" id="ef" type="date" name="from" value="{{ month_first }}"></div>
    <div class="field"><label for="et">{{ tr('По') }}</label>
      <input class="inp sm" id="et" type="date" name="to" value="{{ today }}"></div>
    <button class="btn sm" type="submit">{{ tr('Скачать таблицу') }}</button>
  </form>
</details>

{% if can_manage %}
<dialog id="addPerson" class="modal">
  <div class="card-h wsum" style="margin-bottom:10px">{{ tr('Добавить сотрудника') }}
    <button class="btn out sm" type="button"
            onclick="this.closest('dialog').close()">✕</button></div>
  <p class="sub" style="margin-bottom:12px">{{ tr('У сотрудника машин может быть несколько — в отчётах это одна строка.') }}</p>
  <form class="formrow" method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
    <input type="hidden" name="action" value="add_person">
    <div class="field" style="flex:1 1 100%"><label for="pn">{{ tr('Имя') }}</label>
      <input class="inp sm" id="pn" type="text" name="name" required maxlength="120"></div>
    <div class="field" style="flex:1 1 auto"><label for="pe">{{ tr('Почта') }}</label>
      <input class="inp sm" id="pe" type="email" name="email" maxlength="160"
             placeholder="{{ tr('необязательно') }}"></div>
    <button class="btn sm" type="submit">{{ tr('Добавить') }}</button>
  </form>
</dialog>
{% endif %}
</div>
{% endblock %}