поправила иконки в login/auth

2025-08-19 12:51:05 +03:00 · 2025-08-19 12:51:05 +03:00 · d96b345026
commit d96b345026
parent c156486cb8
1 changed files with 96 additions and 130 deletions
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@ -18,105 +18,105 @@ export default function LoginPage() {
  const [rememberMe, setRememberMe] = useState(false)
  const [activeTab, setActiveTab] = useState<"login" | "register">("login")

- // Состояние и обработчики регистрационной формы / локальное состояние
+  // Состояние и обработчики регистрационной формы / локальное состояние
  const [registerFormData, setRegisterFormData] = useState({
    email: "", // Removed firstName, lastName
    password: "",
    confirmPassword: "",
-    name: "", 
+    name: "",
  })
  const [showRegisterPassword, setShowRegisterPassword] = useState(false)
  const [showConfirmRegisterPassword, setShowConfirmRegisterPassword] = useState(false)

  // Обработчик входа
-const handleLogin = async (e: React.FormEvent) => {
-  e.preventDefault();
+  const handleLogin = async (e: React.FormEvent) => {
+    e.preventDefault();

-  console.log('Перед отправкой:', { email, password });
+    console.log('Перед отправкой:', { email, password });

-  try {
-    const response = await connect.post('/auth/api/login', {
-      email,
-      password,
-      rememberMe,
-    });
-    if (response.status === 200 || response.status === 204 || response.status === 201) {
-      // Предположим, что сервер возвращает данные с токеном
-      const data = response.data;
+    try {
+      const response = await connect.post('/auth/api/login', {
+        email,
+        password,
+        rememberMe,
+      });
+      if (response.status === 200 || response.status === 204 || response.status === 201) {
+        // Предположим, что сервер возвращает данные с токеном
+        const data = response.data;

-      // Сохраняем данные в localStorage
-      localStorage.setItem('authToken', data.token);
-      localStorage.setItem('userEmail', data.user_email);
-      localStorage.setItem('userId', String(data.user_id));
-      
-      // Можно сохранить флаг входа
-      localStorage.setItem('isLoggedIn', 'true');
+        // Сохраняем данные в localStorage
+        localStorage.setItem('authToken', data.token);
+        localStorage.setItem('userEmail', data.user_email);
+        localStorage.setItem('userId', String(data.user_id));

-      // Перенаправляем пользователя
-      history.push("/home");
-    } else {
-      console.log('Ответ:', response);
-    }
-  } catch (error) {
-    if (axios.isAxiosError(error)) {
-      console.error('Ошибка при входе:', error.message);
-      if (error.response) {
-        console.error('Статус:', error.response.status);
-        console.error('Данные ответа:', error.response.data);
-        if (error.response.status === 400) {
-          alert('Неверные данные для входа');
-        }
+        // Можно сохранить флаг входа
+        localStorage.setItem('isLoggedIn', 'true');
+
+        // Перенаправляем пользователя
+        history.push("/home");
+      } else {
+        console.log('Ответ:', response);
      }
-    } else {
-      console.error('Неожиданная ошибка:', error);
+    } catch (error) {
+      if (axios.isAxiosError(error)) {
+        console.error('Ошибка при входе:', error.message);
+        if (error.response) {
+          console.error('Статус:', error.response.status);
+          console.error('Данные ответа:', error.response.data);
+          if (error.response.status === 400) {
+            alert('Неверные данные для входа');
+          }
+        }
+      } else {
+        console.error('Неожиданная ошибка:', error);
+      }
+      alert('Ошибка при входе');
+    }
+  };
+
+
+
+  // Обработчик регистрации
+  const handleRegisterSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    if (registerFormData.password !== registerFormData.confirmPassword) {
+      alert("Пароли не совпадают")
+      return
+    }
+    try {
+      const response = await connect.post('/auth/api/register', {
+        email: registerFormData.email,
+        name: registerFormData.email,
+        password: registerFormData.password,
+      })
+
+      // Предположим, что ответ содержит объект с токеном и другой информацией
+      const data = response.data
+
+      // Сохраняем нужные данные в localStorage
+      localStorage.setItem('authToken', data.token)
+      localStorage.setItem('userEmail', data.user_email)
+      localStorage.setItem('userId', String(data.user_id))
+      localStorage.setItem('userName', data.user_name)
+
+      console.log('Данные сохранены в localStorage')
+      alert('Вы успешно зерегистрировались!')
+      console.log('Отправляемые данные:', { email, password });
+
+      // После этого можно перейти или показать сообщение
+      history.push("/home")
+    } catch (error) {
+      console.error('Ошибка при регистрации:', error)
+      alert('Ошибка при регистрации')
    }
-    alert('Ошибка при входе');
  }
-};

-
-
-// Обработчик регистрации
-const handleRegisterSubmit = async (e: React.FormEvent) => {
-  e.preventDefault()
-  if (registerFormData.password !== registerFormData.confirmPassword) {
-    alert("Пароли не совпадают")
-    return
-  }
-  try {
-    const response = await connect.post('/auth/api/register', {
-      email: registerFormData.email,
-      name: registerFormData.email,
-      password: registerFormData.password,
+  const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setRegisterFormData({
+      ...registerFormData,
+      [e.target.name]: e.target.value,
    })
-
-    // Предположим, что ответ содержит объект с токеном и другой информацией
-    const data = response.data
-
-    // Сохраняем нужные данные в localStorage
-    localStorage.setItem('authToken', data.token)
-    localStorage.setItem('userEmail', data.user_email)
-    localStorage.setItem('userId', String(data.user_id))
-    localStorage.setItem('userName', data.user_name)
-
-    console.log('Данные сохранены в localStorage')
-    alert('Вы успешно зерегистрировались!')
-    console.log('Отправляемые данные:', { email, password });
-
-    // После этого можно перейти или показать сообщение
-    history.push("/home")
-  } catch (error) {
-    console.error('Ошибка при регистрации:', error)
-    alert('Ошибка при регистрации')
  }
-}
-
-const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-  setRegisterFormData({
-    ...registerFormData,
-    [e.target.name]: e.target.value,
-  })
-}



@ -141,22 +141,20 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
            <button
              type="button"
              onClick={() => setActiveTab("login")}
-              className={`flex-1 px-3 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${
-                activeTab === "login"
+              className={`flex-1 px-3 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${activeTab === "login"
                  ? "bg-white text-gray-800 shadow-lg"
                  : "text-white/80 hover:text-white hover:bg-white/10"
-              }`}
+                }`}
            >
              Вход
            </button>
            <button
              type="button"
              onClick={() => setActiveTab("register")}
-              className={`flex-1 px-3 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${
-                activeTab === "register"
+              className={`flex-1 px-3 py-3 rounded-xl text-lg font-semibold transition-all duration-300 ${activeTab === "register"
                  ? "bg-white text-gray-800 shadow-lg"
                  : "text-white/80 hover:text-white hover:bg-white/10"
-              }`}
+                }`}
            >
              Регистрация
            </button>
@ -182,16 +180,15 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
                  />
                  <svg
                    className="absolute right-3 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-500"
-                    xmlns="http://www.w3.org/2000/svg"
                    fill="none"
-                    viewBox="0 0 24 24"
                    stroke="currentColor"
-                    strokeWidth="2"
+                    viewBox="0 0 24 24"
                  >
                    <path
                      strokeLinecap="round"
                      strokeLinejoin="round"
-                      d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"
+                      strokeWidth={2}
+                      d="M16 12a4 4 0 10-8 0 4 4 0 008 0zm0 0v1.5a2.5 2.5 0 005 0V12a9 9 0 10-9 9m4.5-1.206a8.959 8.959 0 01-4.5 1.207"
                    />
                  </svg>
                </div>
@ -218,19 +215,8 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
                    aria-label={showPassword ? "Hide password" : "Show password"}
                  >
                    {showPassword ? (
-                      <svg
-                        className="w-5 h-5"
-                        xmlns="http://www.w3.org/2000/svg"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor"
-                        strokeWidth="2"
-                      >
-                        <path
-                          strokeLinecap="round"
-                          strokeLinejoin="round"
-                          d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.878 9.878L3 3m6.878 6.878L21 21"
-                        />
+                                           <svg xmlns="http://www.w3.org/2000/svg" className="w-5 h-5" viewBox="0 0 40 44" fill="none">
+                        <path d="M5.61017 0.723266C5.22511 0.35136 4.70938 0.145572 4.17406 0.150224C3.63874 0.154875 3.12667 0.369595 2.74813 0.748137C2.36959 1.12668 2.15487 1.63875 2.15021 2.17407C2.14556 2.70939 2.35135 3.22512 2.72326 3.61018L7.67226 8.55918C4.75267 10.756 2.20467 13.7736 0.299799 17.5874C0.158192 17.8708 0.0844727 18.1833 0.0844727 18.5001C0.0844727 18.8169 0.158192 19.1293 0.299799 19.4127C4.70572 28.2266 12.5294 32.7917 20.5 32.7917C23.6748 32.7917 26.8292 32.0669 29.7488 30.6378L35.3899 36.2769C35.775 36.6488 36.2907 36.8545 36.826 36.8499C37.3614 36.8452 37.8734 36.6305 38.252 36.252C38.6305 35.8734 38.8452 35.3614 38.8499 34.826C38.8545 34.2907 38.6487 33.775 38.2768 33.3899L5.61017 0.723266ZM26.6536 27.5406C24.6528 28.3225 22.5703 28.7084 20.5 28.7084C14.4383 28.7084 8.24597 25.4009 4.43213 18.5001C6.10017 15.4804 8.22555 13.1509 10.5939 11.4828L14.9712 15.8602C14.4242 17.0034 14.2453 18.2882 14.4592 19.5374C14.6731 20.7865 15.2692 21.9386 16.1653 22.8348C17.0615 23.7309 18.2136 24.327 19.4627 24.5409C20.7119 24.7548 21.9967 24.5759 23.1399 24.0289L26.6536 27.5406ZM33.8771 22.3711C34.8632 21.2359 35.7676 19.9476 36.568 18.5001C32.7541 11.5992 26.5638 8.29173 20.5 8.29173C20.2714 8.29173 20.0427 8.29649 19.814 8.30602L16.1697 4.66368C17.5933 4.36102 19.0446 4.20842 20.5 4.20839C28.4687 4.20839 36.2944 8.77356 40.7003 17.5874C40.8419 17.8708 40.9156 18.1833 40.9156 18.5001C40.9156 18.8169 40.8419 19.1293 40.7003 19.4127C39.656 21.5285 38.3343 23.4956 36.7701 25.2621L33.8771 22.3711Z" fill="#636B6F" />
                      </svg>
                    ) : (
                      <svg
@ -282,7 +268,7 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
          )}


-{/* Регистрация */}
+          {/* Регистрация */}
          {activeTab === "register" && (
            <form onSubmit={handleRegisterSubmit} className="space-y-4">
              <p className="text-gray-700 text-center text-lg font-medium mb-4">Создайте новый аккаунт</p>
@ -301,6 +287,8 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
                  placeholder="Электронная почта"
                  required
                />
+
+
              </div>
              {/* Password */}
              <div>
@ -325,19 +313,8 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
                    aria-label={showRegisterPassword ? "Hide password" : "Show password"}
                  >
                    {showRegisterPassword ? (
-                      <svg
-                        className="w-5 h-5"
-                        xmlns="http://www.w3.org/2000/svg"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor"
-                        strokeWidth="2"
-                      >
-                        <path
-                          strokeLinecap="round"
-                          strokeLinejoin="round"
-                          d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.878 9.878L3 3m6.878 6.878L21 21"
-                        />
+                      <svg xmlns="http://www.w3.org/2000/svg" className="w-5 h-5" viewBox="0 0 40 44" fill="none">
+                        <path d="M5.61017 0.723266C5.22511 0.35136 4.70938 0.145572 4.17406 0.150224C3.63874 0.154875 3.12667 0.369595 2.74813 0.748137C2.36959 1.12668 2.15487 1.63875 2.15021 2.17407C2.14556 2.70939 2.35135 3.22512 2.72326 3.61018L7.67226 8.55918C4.75267 10.756 2.20467 13.7736 0.299799 17.5874C0.158192 17.8708 0.0844727 18.1833 0.0844727 18.5001C0.0844727 18.8169 0.158192 19.1293 0.299799 19.4127C4.70572 28.2266 12.5294 32.7917 20.5 32.7917C23.6748 32.7917 26.8292 32.0669 29.7488 30.6378L35.3899 36.2769C35.775 36.6488 36.2907 36.8545 36.826 36.8499C37.3614 36.8452 37.8734 36.6305 38.252 36.252C38.6305 35.8734 38.8452 35.3614 38.8499 34.826C38.8545 34.2907 38.6487 33.775 38.2768 33.3899L5.61017 0.723266ZM26.6536 27.5406C24.6528 28.3225 22.5703 28.7084 20.5 28.7084C14.4383 28.7084 8.24597 25.4009 4.43213 18.5001C6.10017 15.4804 8.22555 13.1509 10.5939 11.4828L14.9712 15.8602C14.4242 17.0034 14.2453 18.2882 14.4592 19.5374C14.6731 20.7865 15.2692 21.9386 16.1653 22.8348C17.0615 23.7309 18.2136 24.327 19.4627 24.5409C20.7119 24.7548 21.9967 24.5759 23.1399 24.0289L26.6536 27.5406ZM33.8771 22.3711C34.8632 21.2359 35.7676 19.9476 36.568 18.5001C32.7541 11.5992 26.5638 8.29173 20.5 8.29173C20.2714 8.29173 20.0427 8.29649 19.814 8.30602L16.1697 4.66368C17.5933 4.36102 19.0446 4.20842 20.5 4.20839C28.4687 4.20839 36.2944 8.77356 40.7003 17.5874C40.8419 17.8708 40.9156 18.1833 40.9156 18.5001C40.9156 18.8169 40.8419 19.1293 40.7003 19.4127C39.656 21.5285 38.3343 23.4956 36.7701 25.2621L33.8771 22.3711Z" fill="#636B6F" />
                      </svg>
                    ) : (
                      <svg
@ -381,19 +358,8 @@ const handleRegisterInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
                    aria-label={showConfirmRegisterPassword ? "Hide password" : "Show password"}
                  >
                    {showConfirmRegisterPassword ? (
-                      <svg
-                        className="w-5 h-5"
-                        xmlns="http://www.w3.org/2000/svg"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor"
-                        strokeWidth="2"
-                      >
-                        <path
-                          strokeLinecap="round"
-                          strokeLinejoin="round"
-                          d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.878 9.878L3 3m6.878 6.878L21 21"
-                        />
+                                            <svg xmlns="http://www.w3.org/2000/svg" className="w-5 h-5" viewBox="0 0 40 44" fill="none">
+                        <path d="M5.61017 0.723266C5.22511 0.35136 4.70938 0.145572 4.17406 0.150224C3.63874 0.154875 3.12667 0.369595 2.74813 0.748137C2.36959 1.12668 2.15487 1.63875 2.15021 2.17407C2.14556 2.70939 2.35135 3.22512 2.72326 3.61018L7.67226 8.55918C4.75267 10.756 2.20467 13.7736 0.299799 17.5874C0.158192 17.8708 0.0844727 18.1833 0.0844727 18.5001C0.0844727 18.8169 0.158192 19.1293 0.299799 19.4127C4.70572 28.2266 12.5294 32.7917 20.5 32.7917C23.6748 32.7917 26.8292 32.0669 29.7488 30.6378L35.3899 36.2769C35.775 36.6488 36.2907 36.8545 36.826 36.8499C37.3614 36.8452 37.8734 36.6305 38.252 36.252C38.6305 35.8734 38.8452 35.3614 38.8499 34.826C38.8545 34.2907 38.6487 33.775 38.2768 33.3899L5.61017 0.723266ZM26.6536 27.5406C24.6528 28.3225 22.5703 28.7084 20.5 28.7084C14.4383 28.7084 8.24597 25.4009 4.43213 18.5001C6.10017 15.4804 8.22555 13.1509 10.5939 11.4828L14.9712 15.8602C14.4242 17.0034 14.2453 18.2882 14.4592 19.5374C14.6731 20.7865 15.2692 21.9386 16.1653 22.8348C17.0615 23.7309 18.2136 24.327 19.4627 24.5409C20.7119 24.7548 21.9967 24.5759 23.1399 24.0289L26.6536 27.5406ZM33.8771 22.3711C34.8632 21.2359 35.7676 19.9476 36.568 18.5001C32.7541 11.5992 26.5638 8.29173 20.5 8.29173C20.2714 8.29173 20.0427 8.29649 19.814 8.30602L16.1697 4.66368C17.5933 4.36102 19.0446 4.20842 20.5 4.20839C28.4687 4.20839 36.2944 8.77356 40.7003 17.5874C40.8419 17.8708 40.9156 18.1833 40.9156 18.5001C40.9156 18.8169 40.8419 19.1293 40.7003 19.4127C39.656 21.5285 38.3343 23.4956 36.7701 25.2621L33.8771 22.3711Z" fill="#636B6F" />
                      </svg>
                    ) : (
                      <svg