70 lines
2.8 KiB
TypeScript
70 lines
2.8 KiB
TypeScript
|
// pages/DashboardPage.tsx
|
|||
|
|
import React, { useState } from 'react';
|
|||
|
|
import {useUser} from "../../utils/users/UseUser.ts";
|
|||
|
|
import {changePassword} from "../../API/users.ts";
|
|||
|
|
|
|||
|
|
|
|||
|
|
export function DashboardPage() {
|
|||
|
|
// Получаем данные о пользователе
|
|||
|
|
const userContext = useUser();
|
|||
|
|
const user = userContext?.user;
|
|||
|
|
|
|||
|
|
// Состояние для управления модальным окном
|
|||
|
|
const [isModalOpen, setModalOpen] = useState(false);
|
|||
|
|
const [currentPassword, setCurrentPassword] = useState('');
|
|||
|
|
const [newPassword, setNewPassword] = useState('');
|
|||
|
|
|
|||
|
|
// Обработчик смены пароля
|
|||
|
|
const handleChangePassword = async () => {
|
|||
|
|
try {
|
|||
|
|
await changePassword({ currentPassword, newPassword });
|
|||
|
|
alert('Пароль успешно изменен!');
|
|||
|
|
setModalOpen(false); // Закрыть модальное окно после успешной смены пароля
|
|||
|
|
} catch (error) {
|
|||
|
|
alert('Ошибка при смене пароля: ' + error.message);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className="dashboard">
|
|||
|
|
<div className="welcome-message">
|
|||
|
|
С возвращением, {user?.last_name} {user?.first_name} {user?.middle_name}!
|
|||
|
|
</div>
|
|||
|
|
<div className="user-role">
|
|||
|
|
Вы вошли как: {user?.roleTitle}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
!isModalOpen &&
|
|||
|
|
<button className="change-password-button" onClick={() => setModalOpen(true)}>
|
|||
|
|
Поменять пароль
|
|||
|
|
</button>
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
{isModalOpen && (
|
|||
|
|
<div className="change-password">
|
|||
|
|
<div className="modal-content">
|
|||
|
|
<label>
|
|||
|
|
Текущий пароль:
|
|||
|
|
<input
|
|||
|
|
type="password"
|
|||
|
|
value={currentPassword}
|
|||
|
|
onChange={(e) => setCurrentPassword(e.target.value)}
|
|||
|
|
/>
|
|||
|
|
</label>
|
|||
|
|
<label>
|
|||
|
|
Новый пароль:
|
|||
|
|
<input
|
|||
|
|
type="password"
|
|||
|
|
value={newPassword}
|
|||
|
|
onChange={(e) => setNewPassword(e.target.value)}
|
|||
|
|
/>
|
|||
|
|
</label>
|
|||
|
|
<button onClick={handleChangePassword}>Сменить пароль</button>
|
|||
|
|
<button onClick={() => setModalOpen(false)}>Закрыть</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
);
|
|||
|
|
}
|