Редизайн страницы профиля: современный дизайн с выводом роли пользователя

This commit is contained in:
2025-12-02 00:08:33 +03:00
parent b86bf5b8c6
commit 8e6e26ccba

View File

@@ -3,85 +3,78 @@
{% block title %}Профиль{% endblock %} {% block title %}Профиль{% endblock %}
{% block content %} {% block content %}
<div class="container-fluid px-4"> <div class="container py-4">
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-12 col-lg-10 col-xl-8"> <div class="col-12 col-lg-8">
<div class="card shadow"> <!-- Карточка профиля -->
<div class="card-header bg-primary text-white text-center py-3 py-md-4"> <div class="card shadow-sm">
<h3 class="mb-0"> <div class="card-body p-4">
<i class="bi bi-person-circle me-2 d-block d-md-inline"></i> <!-- Заголовок -->
Ваш профиль <div class="d-flex align-items-center mb-4">
</h3> <div class="bg-primary bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-3"
</div> style="width: 64px; height: 64px;">
<div class="card-body p-3 p-md-4"> <i class="bi bi-person-fill text-primary" style="font-size: 2rem;"></i>
<div class="row g-4"> </div>
<div class="col-12 col-md-4 text-center"> <div>
<div class="profile-icon bg-light rounded-circle d-flex align-items-center justify-content-center mx-auto mb-3" <h4 class="mb-0 fw-bold">{{ user.name }}</h4>
style="width: 100px; height: 100px;"> <p class="text-muted mb-0">{{ user.email }}</p>
<i class="bi bi-person-fill" style="font-size: 3rem; color: #0d6efd;"></i> </div>
</div>
<hr class="my-4">
<!-- Информация -->
<div class="row g-3">
<!-- Роль -->
<div class="col-md-6">
<div class="d-flex align-items-start">
<i class="bi bi-person-badge text-primary me-3 mt-1"></i>
<div class="flex-grow-1">
<small class="text-muted d-block">Роль</small>
{% if user.get_tenant_role %}
<span class="badge bg-primary">{{ user.get_tenant_role.name }}</span>
{% else %}
<span class="text-muted">Не назначена</span>
{% endif %}
</div>
</div> </div>
</div> </div>
<div class="col-12 col-md-8">
<div class="profile-info">
<div class="d-flex flex-column flex-md-row mb-3">
<div class="me-md-4 mb-2 mb-md-0">
<i class="bi bi-person-fill text-primary me-2"></i>
<span class="fw-bold">Имя:</span>
</div>
<div>
<span class="text-muted">{{ user.name }}</span>
</div>
</div>
<div class="d-flex flex-column flex-md-row mb-3"> <!-- Статус email -->
<div class="me-md-4 mb-2 mb-md-0"> <div class="col-md-6">
<i class="bi bi-envelope-fill text-primary me-2"></i> <div class="d-flex align-items-start">
<span class="fw-bold">Email:</span> <i class="bi bi-shield-check text-primary me-3 mt-1"></i>
</div> <div class="flex-grow-1">
<div> <small class="text-muted d-block">Статус email</small>
<span class="text-muted">{{ user.email }}</span> {% if user.is_email_confirmed %}
</div> <span class="badge bg-success">
</div> <i class="bi bi-check-circle me-1"></i>Подтвержден
</span>
<div class="d-flex flex-column flex-md-row mb-3"> {% else %}
<div class="me-md-4 mb-2 mb-md-0"> <span class="badge bg-warning text-dark">
<i class="bi bi-shield-check text-primary me-2"></i> <i class="bi bi-exclamation-circle me-1"></i>Не подтвержден
<span class="fw-bold">Статус email:</span> </span>
</div> {% endif %}
<div>
{% if user.is_email_confirmed %}
<span class="badge bg-success d-inline-flex align-items-center w-auto">
<i class="bi bi-check-circle me-1"></i> Подтвержден
</span>
{% else %}
<span class="badge bg-warning text-dark d-inline-flex align-items-center w-auto">
<i class="bi bi-exclamation-circle me-1"></i> Не подтвержден
</span>
{% endif %}
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="d-flex flex-column flex-md-row justify-content-end gap-2 mt-4 pt-3 border-top"> <hr class="my-4">
<a href="{% url 'index' %}" class="btn btn-outline-secondary">
<i class="bi bi-arrow-left me-1"></i> Назад
</a>
<!-- Действия -->
<div class="d-flex flex-wrap gap-2">
<a href="{% url 'accounts:change_password' %}" class="btn btn-primary">
<i class="bi bi-key me-1"></i>Сменить пароль
</a>
{% if not user.is_email_confirmed %} {% if not user.is_email_confirmed %}
<button class="btn btn-outline-warning" type="button" onclick="resendConfirmation()"> <button class="btn btn-outline-warning" type="button" onclick="resendConfirmation()">
<i class="bi bi-envelope me-1"></i> Повторить письмо <i class="bi bi-envelope me-1"></i>Повторить письмо
</button> </button>
{% endif %} {% endif %}
<a href="{% url 'index' %}" class="btn btn-outline-secondary ms-auto">
<a href="{% url 'accounts:change_password' %}" class="btn btn-outline-primary"> <i class="bi bi-arrow-left me-1"></i>Назад
<i class="bi bi-key me-1"></i> Сменить пароль
</a> </a>
<button class="btn btn-outline-secondary" type="button" onclick="editProfile()">
<i class="bi bi-pencil me-1"></i> Редактировать
</button>
</div> </div>
</div> </div>
</div> </div>
@@ -91,13 +84,7 @@
<script> <script>
function resendConfirmation() { function resendConfirmation() {
// In a real application, this would make an AJAX request to resend the confirmation email
alert('Письмо для подтверждения отправлено на ваш email!'); alert('Письмо для подтверждения отправлено на ваш email!');
} }
function editProfile() {
// For now, we'll just show an alert; in a real app this would open an edit form
alert('Функция редактирования профиля будет реализована позже.');
}
</script> </script>
{% endblock %} {% endblock %}