46 lines
1.7 KiB
React
46 lines
1.7 KiB
React
'use client';
|
||
|
||
import Link from 'next/link';
|
||
import { useEffect, useState } from 'react';
|
||
import AppLogo from './AppLogo';
|
||
import BottomNav from './BottomNav';
|
||
import { apiRequest, ensureLogin } from '../lib/api';
|
||
|
||
export default function Profile() {
|
||
const [results, setResults] = useState([]);
|
||
const [linkCode, setLinkCode] = useState('');
|
||
const [error, setError] = useState('');
|
||
useEffect(() => {
|
||
ensureLogin().then(() => apiRequest('/api/v1/me/results')).then(setResults).catch(error => setError(error.message));
|
||
}, []);
|
||
async function createLinkCode() {
|
||
try {
|
||
const data = await apiRequest('/api/v1/me/link-code', { method: 'POST' });
|
||
setLinkCode(data.code);
|
||
} catch (error) { setError(error.message); }
|
||
}
|
||
return (
|
||
<main className="pageShell profilePage">
|
||
<AppLogo title="我的偏爱档案" />
|
||
<section className="linkPanel">
|
||
<h2>连接独立饭类版</h2>
|
||
<p>生成一次性绑定码,在另一个小程序确认后合并历史。</p>
|
||
<button onClick={createLinkCode}>生成 10 分钟绑定码</button>
|
||
{linkCode ? <output>{linkCode}</output> : null}
|
||
</section>
|
||
<h2 className="sectionTitle">做过的测试 · {results.length}</h2>
|
||
{error ? <div className="emptyState">{error}</div> : null}
|
||
<section className="resultList">
|
||
{results.map(result => (
|
||
<Link key={result.id} href={`/results/${result.id}`} className="resultRow">
|
||
<span className="rankBadge">#1</span>
|
||
<span><small>{result.test_title}</small><strong>{result.champion_name}</strong></span>
|
||
<b>→</b>
|
||
</Link>
|
||
))}
|
||
</section>
|
||
<BottomNav />
|
||
</main>
|
||
);
|
||
}
|