Добавлена страница аккаунта с загрузкой данных через API, обработкой ошибок и отображением информации о пользователе.
This commit is contained in:
parent
4d9fbd6e77
commit
9b1cbc0300
50
src/app/account/page.tsx
Normal file
50
src/app/account/page.tsx
Normal 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>
|
||||
);
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user