добавление кнопки авторизации в хедер

src/main/java/com/example/dateplanner/models/entities/AppUser.java

@@ -3,6 +3,7 @@ package com.example.dateplanner.models.entities;
 import com.example.dateplanner.models.enums.Role;
 import lombok.Data;
 import lombok.NoArgsConstructor;
+import lombok.NonNull;
 import org.springframework.data.annotation.Id;
 import org.springframework.data.relational.core.mapping.Column;
 import org.springframework.data.relational.core.mapping.Table;
@@ -20,9 +21,14 @@ import java.util.UUID;
 public class AppUser implements UserDetails {
     @Id
     private UUID uuid;
-    private String username;
+    @NonNull
+    private String phone;
     private String password;
-    private Role role;
+    @NonNull
+    private String lastName;
+    @NonNull
+    private String firstName;
+    private Role role = Role.USER;
 
     @Column("dating_profile_uuid")
     private UUID datingProfileUuid = null;
@@ -40,6 +46,11 @@ public class AppUser implements UserDetails {
         return List.of(new SimpleGrantedAuthority("ROLE_" + getRole().toString()));
     }
 
+    @Override
+    public String getUsername() {
+        return this.phone;
+    }
+
     @Override
     public boolean isAccountNonExpired() {
         return UserDetails.super.isAccountNonExpired();

src/main/resources/static/css/header.css

@@ -0,0 +1,85 @@
+/* Модальное окно авторизации */
+.auth-tabs {
+    border: none ;
+    margin-bottom: 20px !important;
+}
+
+.auth-tabs .nav-link {
+    border: none !important;
+    color: #666;
+    font-weight: 500;
+    padding: 10px 0;
+    margin: 0 15px;
+    position: relative;
+}
+
+.auth-tabs .nav-link.active {
+    color: #e74c3c !important;
+    background: none;
+}
+
+.auth-tabs .nav-link.active:after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 3px;
+    background: #e74c3c;
+    border-radius: 3px;
+}
+
+.forgot-password {
+    font-size: 0.9rem;
+    color: #e74c3c;
+    text-decoration: none;
+}
+
+.auth-divider {
+    text-align: center;
+    position: relative;
+    margin: 20px 0;
+    color: #666;
+}
+
+.auth-divider:before {
+    content: '';
+    position: absolute;
+    top: 50%;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: #eee;
+    z-index: 1;
+}
+
+.auth-divider span {
+    background: white;
+    padding: 0 15px;
+    position: relative;
+    z-index: 2;
+}
+
+.social-auth-btn {
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 8px;
+    background: white;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+    margin-bottom: 10px;
+    transition: all 0.3s;
+    font-weight: 500;
+}
+
+.social-auth-btn:hover {
+    border-color: #e74c3c;
+    background: rgba(231, 76, 60, 0.05);
+}
+
+.social-auth-btn.vk { color: #4C75A3; }
+.social-auth-btn.google { color: #DB4437; }
+.social-auth-btn.yandex { color: #FF0000; }

src/main/resources/static/css/main.css

@@ -15,6 +15,27 @@
     color: white !important;
 }
 
+/* Добавляем новые стили для иконки авторизации */
+.auth-btn {
+    background: #e74c3c;
+    color: white;
+    border: none;
+    border-radius: 50px;
+    padding: 8px 20px;
+    font-weight: 600;
+    transition: all 0.3s;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    text-decoration: none;
+}
+
+.auth-btn:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 5px 15px rgba(231, 76, 60, 0.3);
+    color: white;
+}
+
 .love-gradient {
     background: linear-gradient(135deg, #e74c3c 0%, #fd79a8 100%);
     color: white;

src/main/resources/static/css/style.css

@@ -1,2 +1,3 @@
 @import "fonts.css";
-@import "main.css";
+@import "main.css";
+@import "header.css";

src/main/resources/static/js/site/blocks/header.js

@@ -24,11 +24,118 @@ function initHeader($header){
                             <a class="nav-link" href="#admin">Для организаций</a>
                         </li>
                     </ul>
-                    <button class="btn btn-heart ms-3" onclick="showLoginModal()">
+                    <button class="btn btn-heart ms-0 ms-lg-3" onclick="showLoginModal()">
                         <i class="fas fa-plus me-2"></i>Добавить место
                     </button>
+                    <div id="authButtonContainer" class="d-flex align-items-center ms-0 ms-lg-3 mt-2 mt-lg-0">
+                        <button class="auth-btn" data-bs-toggle="modal" data-bs-target="#authModal" style="padding-top: 12px; padding-bottom: 12px;">
+                            <i class="fas fa-user"></i>
+                            <span class="auth-btn-text">Войти</span>
+                        </button>
+                    </div>
                 </div>
             </div>
         </nav>
+        <!-- Модальное окно авторизации -->
+        <div class="modal fade" id="authModal" tabindex="-1" aria-hidden="true">
+            <div class="modal-dialog modal-dialog-centered">
+                <div class="modal-content">
+                    <div class="modal-header border-0">
+                        <h5 class="modal-title">Вход в DatePlanner</h5>
+                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+                    </div>
+                    <div class="modal-body p-4">
+                        
+                        <ul class="nav nav-tabs auth-tabs" id="authTab" role="tablist">
+                            <li class="nav-item" role="presentation">
+                                <button class="nav-link active" id="login-tab" data-bs-toggle="tab" data-bs-target="#login" type="button">
+                                    Вход
+                                </button>
+                            </li>
+                            <li class="nav-item" role="presentation">
+                                <button class="nav-link" id="register-tab" data-bs-toggle="tab" data-bs-target="#register" type="button">
+                                    Регистрация
+                                </button>
+                            </li>
+                        </ul>
+                        
+                        <div class="tab-content" id="authTabContent">
+                            <!-- Форма входа -->
+                            <div class="tab-pane fade show active" id="login" role="tabpanel">
+                                <form id="loginForm">
+                                    <div class="mb-3">
+                                        <label class="form-label">Email или телефон</label>
+                                        <input type="text" class="form-control" id="loginEmail" placeholder="example@mail.ru" required>
+                                    </div>
+                                    <div class="mb-3">
+                                        <label class="form-label">Пароль</label>
+                                        <input type="password" class="form-control" id="loginPassword" required>
+                                        <div class="text-end mt-2">
+                                            <a href="#" class="forgot-password" onclick="showForgotPassword()">Забыли пароль?</a>
+                                        </div>
+                                    </div>
+                                    <div class="mb-3 form-check">
+                                        <input type="checkbox" class="form-check-input" id="rememberMe">
+                                        <label class="form-check-label" for="rememberMe">Запомнить меня</label>
+                                    </div>
+                                    <button type="submit" class="btn btn-heart w-100">Войти</button>
+                                </form>
+                                
+                                <div class="auth-divider">
+                                    <span>или войдите через</span>
+                                </div>
+                                
+                                <button class="social-auth-btn vk" onclick="loginWithVK()">
+                                    <i class="fab fa-vk"></i> ВКонтакте
+                                </button>
+                                <button class="social-auth-btn google" onclick="loginWithGoogle()">
+                                    <i class="fab fa-google"></i> Google
+                                </button>
+                                <button class="social-auth-btn yandex" onclick="loginWithYandex()">
+                                    <i class="fab fa-yandex"></i> Яндекс
+                                </button>
+                            </div>
+                            
+                            <!-- Форма регистрации -->
+                            <div class="tab-pane fade" id="register" role="tabpanel">
+                                <form id="registerForm">
+                                    <div class="row">
+                                        <div class="col-md-6 mb-3">
+                                            <label class="form-label">Имя</label>
+                                            <input type="text" class="form-control" id="registerFirstName" required>
+                                        </div>
+                                        <div class="col-md-6 mb-3">
+                                            <label class="form-label">Фамилия</label>
+                                            <input type="text" class="form-control" id="registerLastName">
+                                        </div>
+                                    </div>
+                                    <div class="mb-3">
+                                        <label class="form-label">Email</label>
+                                        <input type="email" class="form-control" id="registerEmail" required>
+                                    </div>
+                                    <div class="mb-3">
+                                        <label class="form-label">Пароль</label>
+                                        <input type="password" class="form-control" id="registerPassword" required>
+                                        <small class="text-muted">Минимум 6 символов</small>
+                                    </div>
+                                    <div class="mb-3">
+                                        <label class="form-label">Подтвердите пароль</label>
+                                        <input type="password" class="form-control" id="registerPasswordConfirm" required>
+                                    </div>
+                                    <div class="mb-3 form-check">
+                                        <input type="checkbox" class="form-check-input" id="acceptTerms" required>
+                                        <label class="form-check-label" for="acceptTerms">
+                                            Я принимаю <a href="#" class="forgot-password">условия использования</a> и 
+                                            <a href="#" class="forgot-password">политику конфиденциальности</a>
+                                        </label>
+                                    </div>
+                                    <button type="submit" class="btn btn-heart w-100">Зарегистрироваться</button>
+                                </form>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
     `)
 }