{% extends "base.html" %}
{% block title %}{{ target.first_name }} {{ target.last_name }} — Админ — Мои Товары{% endblock %}
{% block page_title %}Пользователь{% endblock %}

{% block content %}
<ol class="breadcrumb">
  <li><a href="/admin/users">Пользователи</a></li>
  <li>{{ target.first_name }} {{ target.last_name }}</li>
</ol>

{% if request.query_params.get('success') == 'reset_sent' %}
<div class="alert alert-gr"><span><i class="bi bi-check-circle"></i></span><div>Ссылка для сброса пароля отправлена.</div></div>
{% elif request.query_params.get('success') == 'invite_sent' %}
<div class="alert alert-gr"><span><i class="bi bi-check-circle"></i></span><div>Приглашение отправлено.</div></div>
{% elif request.query_params.get('success') == 'saved' %}
<div class="alert alert-gr"><span><i class="bi bi-check-circle"></i></span><div>Данные сохранены.</div></div>
{% endif %}

<!-- User header -->
<div style="display:flex;align-items:center;gap:14px;margin-bottom:24px;">
  <div class="avatar" style="width:48px;height:48px;font-size:16px;">
    {{ target.first_name[0] if target.first_name else '?' }}{{ target.last_name[0] if target.last_name else '' }}
  </div>
  <div>
    <div style="font-size:18px;font-weight:800;letter-spacing:-0.02em;">{{ target.first_name }} {{ target.last_name }}</div>
    <div class="mono" style="font-size:12px;color:#9EA8BE;">{{ target.email }}</div>
  </div>
</div>

<div class="g2" style="align-items:start;">

  <!-- Left column -->
  <div style="display:flex;flex-direction:column;gap:14px;">

    <!-- Profile -->
    <div class="card">
      <div class="card-hd"><div><div class="card-title">Профиль</div></div></div>
      <div class="conn-detail">
        <div class="conn-row"><span class="conn-k">ID</span><span class="conn-v">{{ target.id }}</span></div>
        <div class="conn-row">
          <span class="conn-k">Email</span>
          <span class="conn-v" style="display:flex;align-items:center;gap:6px;">
            {{ target.email }}
            {% if target.is_email_confirmed %}
              <span class="tag tag-gr" style="font-size:10px;padding:1px 6px;">подтверждён</span>
            {% else %}
              <span class="tag tag-yl" style="font-size:10px;padding:1px 6px;">не подтверждён</span>
            {% endif %}
          </span>
        </div>
        <div class="conn-row"><span class="conn-k">Телефон</span><span class="conn-v">{{ target.phone or '—' }}</span></div>
        <div class="conn-row">
          <span class="conn-k">Роль</span>
          <span class="conn-v" style="font-family:inherit;">
            {% if target.role == 'system' %}<span class="tag tag-rd" style="font-size:10.5px;">Системный</span>
            {% elif target.role == 'admin' %}<span class="tag tag-or" style="font-size:10.5px;">Администратор</span>
            {% else %}<span class="tag tag-dim" style="font-size:10.5px;">Пользователь</span>
            {% endif %}
          </span>
        </div>
        <div class="conn-row">
          <span class="conn-k">Статус</span>
          <span class="conn-v" style="font-family:inherit;">
            {% if target.status == 'active' %}<span class="tag tag-gr"><span class="dot g"></span>Активен</span>
            {% elif target.status == 'pending' %}<span class="tag tag-yl"><span class="dot y pulse"></span>Ожидает</span>
            {% else %}<span class="tag tag-rd"><span class="dot r"></span>Заблокирован</span>
            {% endif %}
          </span>
        </div>
        <div class="conn-row"><span class="conn-k">Регистрация</span><span class="conn-v">{{ target.created_at | datefmt }}</span></div>
        {% if target.evotor_user_id %}
        <div class="conn-row"><span class="conn-k">Эвотор ID</span><span class="conn-v">{{ target.evotor_user_id }}</span></div>
        {% endif %}
        {% if target.invite_token %}
        <div class="conn-row"><span class="conn-k">Приглашение до</span><span class="conn-v">{{ target.invite_expires | datefmt }}</span></div>
        {% endif %}
      </div>
    </div>

    {% if target.evotor_meta %}
    <div class="card">
      <div class="card-hd"><div><div class="card-title">Данные Эвотор</div></div></div>
      <pre>{{ target.evotor_meta | tojson(indent=2) }}</pre>
    </div>
    {% endif %}

  </div>

  <!-- Right column -->
  <div style="display:flex;flex-direction:column;gap:14px;">

    <!-- Actions -->
    <div class="card">
      <div class="card-title" style="margin-bottom:14px;">Действия</div>
      <div style="display:flex;flex-direction:column;gap:8px;">
        {% if target.status != 'active' %}
        <form method="post" action="/admin/users/{{ target.id }}/activate">
          <button type="submit" class="btn btn-primary w-100">
            <i class="bi bi-check-circle"></i> Активировать
          </button>
        </form>
        {% endif %}
        {% if target.status != 'suspended' %}
        <form method="post" action="/admin/users/{{ target.id }}/suspend">
          <button type="submit" class="btn btn-danger w-100">
            <i class="bi bi-slash-circle"></i> Заблокировать
          </button>
        </form>
        {% endif %}
        <form method="post" action="/admin/users/{{ target.id }}/reset-password">
          <button type="submit" class="btn btn-outline w-100">
            <i class="bi bi-key"></i> Сбросить пароль
          </button>
        </form>
        <form method="post" action="/admin/users/{{ target.id }}/send-invite">
          <button type="submit" class="btn btn-outline w-100">
            <i class="bi bi-envelope"></i> Отправить приглашение
          </button>
        </form>
        <form method="post" action="/admin/users/{{ target.id }}/view-as">
          <button type="submit" class="btn btn-outline w-100">
            <i class="bi bi-eye"></i> Просмотр от имени пользователя
          </button>
        </form>
        {% if user.role == 'system' and target.id != user.id %}
        <form method="post" action="/admin/users/{{ target.id }}/delete"
              onsubmit="return confirm('Удалить пользователя {{ target.email }}? Это действие необратимо.')">
          <button type="submit" class="btn btn-danger btn-sm w-100">
            <i class="bi bi-trash"></i> Удалить
          </button>
        </form>
        {% endif %}
      </div>
    </div>

    <!-- Edit -->
    <div class="card">
      <div class="card-title" style="margin-bottom:14px;">Редактировать</div>
      <form method="post" action="/admin/users/{{ target.id }}/edit">
        <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;">
          <div class="form-row">
            <label class="form-lbl" for="first_name">Имя</label>
            <input class="inp" type="text" id="first_name" name="first_name" value="{{ target.first_name }}" required>
          </div>
          <div class="form-row">
            <label class="form-lbl" for="last_name">Фамилия</label>
            <input class="inp" type="text" id="last_name" name="last_name" value="{{ target.last_name }}" required>
          </div>
          <div class="form-row">
            <label class="form-lbl" for="middle_name">Отчество</label>
            <input class="inp" type="text" id="middle_name" name="middle_name" value="{{ target.middle_name or '' }}">
          </div>
        </div>
        <div class="form-row">
          <label class="form-lbl" for="email">Email</label>
          <input class="inp" type="email" id="email" name="email" value="{{ target.email }}">
        </div>
        <div class="form-row">
          <label class="form-lbl" for="phone">Телефон</label>
          <input class="inp" type="tel" id="phone" name="phone" value="{{ target.phone }}">
        </div>
        {% if user.role in ('system', 'admin') %}
        <div class="form-row">
          <label class="form-lbl" for="role">Роль</label>
          <select class="inp" id="role" name="role">
            <option value="user" {% if target.role == 'user' %}selected{% endif %}>Пользователь</option>
            <option value="admin" {% if target.role == 'admin' %}selected{% endif %}>Администратор</option>
            <option value="system" {% if target.role == 'system' %}selected{% endif %}>Системный</option>
          </select>
        </div>
        {% endif %}
        <button type="submit" class="btn btn-primary btn-sm">
          <i class="bi bi-save"></i> Сохранить
        </button>
      </form>
    </div>

  </div>
</div>
{% endblock %}