Добавлена страница аккаунта с загрузкой данных через API, обработкой ошибок и отображением информации о пользователе.

This commit is contained in:
Redsandyg 2025-06-03 10:57:05 +03:00
parent 4d9fbd6e77
commit 9b1cbc0300

50
src/app/account/page.tsx Normal file
View File

@ -0,0 +1,50 @@
"use client";
import { useEffect, useState } from "react";
import styles from "../../styles/dashboard.module.css";
interface AccountData {
id: number;
login: string;
name: string | null;
email: string | null;
balance: number;
}
export default function AccountPage() {
const [account, setAccount] = useState<AccountData | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
fetch("/api/account")
.then((res) => {
if (!res.ok) throw new Error("Ошибка загрузки данных аккаунта");
return res.json();
})
.then((data) => {
setAccount(data);
setLoading(false);
})
.catch((err) => {
setError(err.message);
setLoading(false);
});
}, []);
if (loading) return <div className={styles.dashboard}>Загрузка...</div>;
if (error) return <div className={styles.dashboard}>Ошибка: {error}</div>;
if (!account) return <div className={styles.dashboard}>Нет данных</div>;
return (
<div className={styles.dashboard}>
<h1 className={styles.title}>Аккаунт</h1>
<div className={styles.card} style={{ maxWidth: 400, margin: "0 auto" }}>
<div><b>ID:</b> {account.id}</div>
<div><b>Логин:</b> {account.login}</div>
<div><b>Имя:</b> {account.name || "-"}</div>
<div><b>Email:</b> {account.email || "-"}</div>
<div><b>Баланс:</b> {account.balance.toLocaleString("ru-RU", { style: "currency", currency: "RUB" })}</div>
</div>
</div>
);
}