{% extends "base.html" %}
{% block title %}{{ tr('Учётка') }} — Puntavia{% endblock %}

{% block head %}
<style>
.narrow{max-width:520px}
.narrow .field{margin-bottom:14px}
.orgs{display:flex;flex-direction:column;gap:8px}
.orgs .li{display:flex;align-items:center;gap:12px;padding:11px 0;
  border-bottom:1px solid var(--line-soft)}
.orgs .li:last-child{border-bottom:0}
.orgs form{margin:0}
</style>
{% endblock %}

{% block content %}
<div class="pagehead">
  <div>
    <h1>{{ tr('Учётка') }}</h1>
    <p class="sub">{{ user.email }}</p>
  </div>
  <span class="pill"><span class="k">{{ org.name }}</span>
    <span class="v">{{ tr(role_names[member['role']]) }}</span></span>
</div>

{% if saved %}<div class="note">{{ tr('Сохранено.') }}</div>{% endif %}
{% if error %}<div class="note err">{{ error }}</div>{% endif %}

{% from "_ava.html" import avapick with context %}
<div class="card narrow" style="margin-top:18px">
  <div class="card-h">{{ tr('Имя и пароль') }}</div>
  <form method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
    <div class="field">
      <label for="name">{{ tr('Имя') }}</label>
      <input class="inp" id="name" name="name" value="{{ user.name or '' }}" maxlength="120">
    </div>
    <div class="field">
      <label>{{ tr('Аватар') }}</label>
      {{ avapick(user.name or user.email, user.avatar) }}
    </div>
    {# Язык кабинета — здесь, а не глобусом в шапке (владелец, 05.09): это
       настройка, которую человек ставит один раз, а не кнопка, нужная на
       каждом экране. Пустое значение = следовать за языком компании. #}
    <div class="field">
      <label for="locale">{{ tr('Язык кабинета') }}</label>
      <select class="sel" id="locale" name="locale">
        <option value="">{{ tr('Как в компании') }}{% if org_lang %} — {{ lang_names[org_lang] }}{% endif %}</option>
        {% for code in langs %}
        <option value="{{ code }}" {{ 'selected' if user.locale == code }}>{{ lang_names[code] }}</option>
        {% endfor %}
      </select>
    </div>
    <p class="sub" style="margin:16px 0 12px">{{ tr('Пароль меняется только вместе с текущим: одной cookie для этого мало.') }}
      {{ tr('После смены все прочие входы в эту учётку перестанут действовать.') }}</p>
    <div class="field">
      <label for="current_password">{{ tr('Текущий пароль') }}</label>
      <input class="inp" id="current_password" type="password" name="current_password"
             autocomplete="current-password" placeholder="{{ tr('только при смене пароля') }}">
    </div>
    <div class="field">
      <label for="new_password">{{ tr('Новый пароль') }}</label>
      <input class="inp" id="new_password" type="password" name="new_password" minlength="8"
             autocomplete="new-password" placeholder="{{ tr('не короче восьми знаков') }}">
    </div>
    <button class="btn" type="submit">{{ tr('Сохранить') }}</button>
  </form>
</div>

{% if my_orgs|length > 1 %}
<div class="card narrow" style="margin-top:16px">
  <div class="card-h">{{ tr('Ваши компании') }}</div>
  <div class="orgs">
    {% for o in my_orgs %}
    <div class="li">
      <span class="nm" style="flex:1">{{ o.name }}</span>
      {% if o.id == org.id %}
        <span class="tag">{{ tr('текущая') }}</span>
      {% else %}
      <form method="post" action="/switch/{{ o.id }}">
        <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <button class="btn out sm" type="submit">{{ tr('Перейти') }}</button>
      </form>
      {% endif %}
    </div>
    {% endfor %}
  </div>
</div>
{% endif %}
{% endblock %}