{% extends "base.html" %}

{% block title %}Профиль пользователя{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-4">
        <div class="card">
            <div class="card-body text-center">
                <div class="mb-3">

                </div>

                <h5 class="mb-1">{{ user.username }}</h5>
                <p class="text-muted small">Роль: {{ user.role }}</p>

                <div class="d-flex justify-content-center gap-3 mb-3">
                    {% if user.is_active %}
                    <span class="badge bg-success">Активен</span>
                    {% else %}
                    <span class="badge bg-danger">Деактивирован</span>
                    {% endif %}
                </div>

                <div class="text-start small text-muted">
                    <div class="mb-1"><i class="bi me-2"></i>Регистрация: {{ user.created_at|format_datetime }}</div>
                    <div class="mb-1"><i class="bi me-2"></i>Последний вход: {{ user.last_login|format_datetime or 'Никогда' }}</div>
                    {% if user.updated_at %}
                    <div><i class="bi  me-2"></i>Обновлен: {{ user.updated_at|format_datetime }}</div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-8">
        <div class="card">
            <div class="card-header">
                <ul class="nav nav-tabs card-header-tabs" id="profileTabs" role="tablist">
                    <li class="nav-item">
                        <button class="nav-link active" id="info-tab" data-bs-toggle="tab"
                                data-bs-target="#info" type="button" role="tab">
                            <i class="bi me-1"></i>Личные данные
                        </button>
                    </li>
                    <li class="nav-item">
                        <button class="nav-link" id="password-tab" data-bs-toggle="tab"
                                data-bs-target="#password" type="button" role="tab">
                            <i class="bi me-1"></i>Смена пароля
                        </button>
                    </li>
                </ul>
            </div>
            <div class="card-body">
                <div class="tab-content">
                    <!-- Вкладка "Личные данные" -->
                    <div class="tab-pane fade show active" id="info" role="tabpanel">
                        <form method="POST" action="{{ url_for('profile') }}">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">

                            <div class="mb-3">
                                <label for="email" class="form-label">Email</label>
                                <input type="email" class="form-control" id="email" name="email"
                                       value="{{ user.email or '' }}" placeholder="user@example.com">

                            </div>

                            <hr>
                            <h6 class="mb-3">Настройки уведомлений</h6>

                            <div class="mb-3">
                                <div class="form-check form-switch">
                                    <input class="form-check-input" type="checkbox" id="notify_email"
                                           name="notify_email" {% if user.notify_email %}checked{% endif %}>
                                    <label class="form-check-label" for="notify_email">
                                        <i class="bi me-1"></i>Уведомления на email
                                    </label>
                                </div>
                            </div>


                            <button type="submit" class="btn btn-secondary w-100">
                                <i class="bi me-1"></i>Сохранить изменения
                            </button>
                        </form>
                    </div>

                    <!-- Вкладка "Смена пароля" -->
                    <div class="tab-pane fade" id="password" role="tabpanel">
                        <form method="POST" action="{{ url_for('profile_change_password') }}">
                            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">

                            <div class="alert alert-secondary">
                                <i class="bi me-2"></i>Для безопасности используйте сложный пароль (не менее 8 символов,
                                с буквами разного регистра и цифрами)
                            </div>

                            <div class="mb-3">
                                <label for="old_password" class="form-label">Текущий пароль</label>
                                <input type="password" class="form-control" id="old_password"
                                       name="old_password" required>
                            </div>

                            <div class="mb-3">
                                <label for="new_password" class="form-label">Новый пароль</label>
                                <input type="password" class="form-control" id="new_password"
                                       name="new_password" required minlength="6">
                                <div class="form-text">Минимум 6 символов</div>
                            </div>

                            <div class="mb-3">
                                <label for="confirm_password" class="form-label">Подтвердите пароль</label>
                                <input type="password" class="form-control" id="confirm_password"
                                       name="confirm_password" required>
                            </div>

                            <button type="submit" class="btn btn-secondary w-100">
                                <i class="bi me-1"></i>Сменить пароль
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}