alai-dev/ai-learning-platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 剩余页面 useT() + 页脚 SystemConfig 动态渲染

Browse Source 
- 学习分析/学习路径/设置/收藏/提示词工坊 页面 useT()
- 页脚联系邮箱/ICP备案号从 GET /public/config 动态获取
- 翻译键补齐: discover.viewCount/likeCount/postStats
This commit is contained in:
yuzhiran-dev
2026-05-22 18:09:15 +08:00
parent 477226ac15
commit 03b500b778
5 changed files with 104 additions and 243 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/my/favorites/page.tsx
+15 -45
View File
@@ -4,50 +4,30 @@ import { useEffect, useState } from 'react';
import Link from 'next/link';
import { apiFetch } from '../../../lib/auth';
import { Skeleton } from '@/components/ui/skeleton';
import { useT } from '@/i18n';
interface FavoritePrompt {
id: number;
promptId: number;
prompt: {
id: number;
title: string;
description: string;
likeCount: number;
};
}
interface FavoritePrompt { id: number; promptId: number; prompt: { id: number; title: string; description: string; likeCount: number } }
export default function FavoritesPage() {
const t = useT();
const [items, setItems] = useState<FavoritePrompt[]>([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
loadData();
}, []);
useEffect(() => { loadData(); }, []);
async function loadData() {
try {
const res = await apiFetch('/prompts/favorites');
const data = await res.json();
setItems(data.items || []);
} catch (e) { console.error(e) }
try { const res = await apiFetch('/prompts/favorites'); const data = await res.json(); setItems(data.items || []); } catch (e) { console.error(e) }
setLoading(false);
}
async function removeFavorite(promptId: number) {
try {
await apiFetch(`/prompts/${promptId}/favorite`, { method: 'POST' });
setItems(items.filter(i => i.promptId !== promptId));
} catch (e) { console.error(e) }
try { await apiFetch(`/prompts/${promptId}/favorite`, { method: 'POST' }); setItems(items.filter(i => i.promptId !== promptId)); } catch (e) { console.error(e) }
}
if (loading) return (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<Skeleton className="h-8 w-48 mb-6" />
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
<Skeleton className="h-24 rounded-xl" />
<Skeleton className="h-24 rounded-xl" />
<Skeleton className="h-24 rounded-xl" />
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">{[1,2,3].map(i => <Skeleton key={i} className="h-24 rounded-xl" />)}</div>
<Skeleton className="h-64 w-full rounded-xl" />
</div>
);
@@ -55,34 +35,24 @@ export default function FavoritesPage() {
return (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<div className="mb-8">
<Link href="/my" className="text-sm text-muted-foreground hover:text-brand-600 mb-2 inline-block">
&larr; 返回我的
</Link>
<h1 className="text-3xl font-bold text-foreground">我的收藏</h1>
<p className="mt-2 text-muted-foreground">收藏的提示词和课程内容</p>
<Link href="/my" className="text-sm text-muted-foreground hover:text-brand-600 mb-2 inline-block">&larr; {t.favorites.back}</Link>
<h1 className="text-3xl font-bold text-foreground">{t.favorites.title}</h1>
<p className="mt-2 text-muted-foreground">{t.favorites.desc}</p>
</div>
{items.length === 0 ? (
<div className="text-center py-20">
<div className="w-16 h-16 bg-muted rounded-2xl flex items-center justify-center mx-auto mb-4">
❤️
</div>
<p className="text-muted-foreground mb-4">还没有收藏任何内容</p>
<Link href="/prompts" className="px-4 py-2 bg-brand-600 text-white rounded-lg text-sm hover:bg-brand-700">
浏览提示词
</Link>
<div className="w-16 h-16 bg-muted rounded-2xl flex items-center justify-center mx-auto mb-4">❤️</div>
<p className="text-muted-foreground mb-4">{t.favorites.empty}</p>
<Link href="/prompts" className="px-4 py-2 bg-brand-600 text-white rounded-lg text-sm hover:bg-brand-700">{t.favorites.browsePrompts}</Link>
</div>
) : (
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{items.map(item => (
<div key={item.id} className="bg-card rounded-xl border border-border p-5 hover:shadow-md transition-shadow">
<div className="flex items-start justify-between mb-2">
<Link href={`/prompts/${item.prompt.id}`} className="font-semibold text-foreground hover:text-brand-600">
{item.prompt.title}
</Link>
<button onClick={() => removeFavorite(item.promptId)} className="text-muted-foreground hover:text-red-500 text-sm">
❤️
</button>
<Link href={`/prompts/${item.prompt.id}`} className="font-semibold text-foreground hover:text-brand-600">{item.prompt.title}</Link>
<button onClick={() => removeFavorite(item.promptId)} className="text-muted-foreground hover:text-red-500 text-sm">❤️</button>
</div>
<p className="text-sm text-muted-foreground mb-2 line-clamp-2">{item.prompt.description}</p>
<div className="text-xs text-muted-foreground">❤️ {item.prompt.likeCount}</div>
frontend/src/app/my/settings/page.tsx
+25 -56
View File
@@ -4,15 +4,12 @@ import { useEffect, useState } from 'react';
import { useRouter } from 'next/navigation';
import { apiFetch } from '../../../lib/auth';
import { Skeleton } from '@/components/ui/skeleton';
import { useT } from '@/i18n';
interface Profile {
nickname: string;
email: string;
phone: string;
avatar: string;
}
interface Profile { nickname: string; email: string; phone: string; avatar: string }
export default function SettingsPage() {
const t = useT();
const router = useRouter();
const [profile, setProfile] = useState<Profile>({ nickname: '', email: '', phone: '', avatar: '' });
const [loading, setLoading] = useState(true);
@@ -20,17 +17,13 @@ export default function SettingsPage() {
const [nickname, setNickname] = useState('');
const [email, setEmail] = useState('');
useEffect(() => {
loadProfile();
}, []);
useEffect(() => { loadProfile(); }, []);
async function loadProfile() {
try {
const res = await apiFetch('/dashboard/profile');
const data = await res.json();
setProfile(data);
setNickname(data.nickname || '');
setEmail(data.email || '');
setProfile(data); setNickname(data.nickname || ''); setEmail(data.email || '');
} catch (e) { console.error(e) }
setLoading(false);
}
@@ -39,16 +32,13 @@ export default function SettingsPage() {
e.preventDefault();
setSaving(true);
try {
await apiFetch('/dashboard/profile', {
method: 'PUT',
body: JSON.stringify({ nickname, email }),
});
alert('保存成功');
await apiFetch('/dashboard/profile', { method: 'PUT', body: JSON.stringify({ nickname, email }) });
alert(t.settings.saveSuccess);
} catch (e) { console.error(e) }
setSaving(false);
}
async function handleLogout() {
function handleLogout() {
localStorage.removeItem('token');
localStorage.removeItem('refreshToken');
router.push('/auth');
@@ -57,11 +47,7 @@ export default function SettingsPage() {
if (loading) return (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<Skeleton className="h-8 w-48 mb-6" />
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
<Skeleton className="h-24 rounded-xl" />
<Skeleton className="h-24 rounded-xl" />
<Skeleton className="h-24 rounded-xl" />
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">{[1,2,3].map(i => <Skeleton key={i} className="h-24 rounded-xl" />)}</div>
<Skeleton className="h-64 w-full rounded-xl" />
</div>
);
@@ -69,52 +55,35 @@ export default function SettingsPage() {
return (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<div className="mb-8">
<button onClick={() => router.back()} className="text-sm text-muted-foreground hover:text-foreground mb-4 block">&larr; 返回</button>
<h1 className="text-3xl font-bold text-foreground">设置</h1>
<p className="mt-2 text-muted-foreground">管理你的账号偏好</p>
<button onClick={() => router.back()} className="text-sm text-muted-foreground hover:text-foreground mb-4 block">&larr; {t.common.back}</button>
<h1 className="text-3xl font-bold text-foreground">{t.settings.title}</h1>
<p className="mt-2 text-muted-foreground">{t.settings.desc}</p>
</div>
<form onSubmit={handleSave} className="bg-card rounded-2xl border border-border p-6 space-y-6">
<h2 className="text-lg font-semibold text-foreground">个人信息</h2>
<h2 className="text-lg font-semibold text-foreground">{t.settings.personalInfo}</h2>
<div>
<label className="block text-sm font-medium text-foreground mb-1.5">昵称</label>
<input
type="text"
value={nickname}
onChange={e => setNickname(e.target.value)}
className="w-full px-4 py-2.5 border border-border rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-brand-500"
/>
<label className="block text-sm font-medium text-foreground mb-1.5">{t.settings.nicknameLabel}</label>
<input type="text" value={nickname} onChange={e => setNickname(e.target.value)}
className="w-full px-4 py-2.5 border border-border rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-brand-500" />
</div>
<div>
<label className="block text-sm font-medium text-foreground mb-1.5">邮箱</label>
<input
type="email"
value={email}
onChange={e => setEmail(e.target.value)}
className="w-full px-4 py-2.5 border border-border rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-brand-500"
/>
<label className="block text-sm font-medium text-foreground mb-1.5">{t.settings.emailLabel}</label>
<input type="email" value={email} onChange={e => setEmail(e.target.value)}
className="w-full px-4 py-2.5 border border-border rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-brand-500" />
</div>
<div className="flex gap-3">
<button
type="submit"
disabled={saving}
className="px-6 py-2.5 bg-brand-600 text-white rounded-xl text-sm font-medium hover:bg-brand-700 disabled:opacity-50"
>
{saving ? '保存中...' : '保存修改'}
<button type="submit" disabled={saving}
className="px-6 py-2.5 bg-brand-600 text-white rounded-xl text-sm font-medium hover:bg-brand-700 disabled:opacity-50">
{saving ? t.common.loading : t.settings.saveChanges}
</button>
</div>
</form>
<div className="bg-card rounded-2xl border border-border p-6 mt-6">
<h2 className="text-lg font-semibold text-foreground mb-4">账号安全</h2>
<button
onClick={handleLogout}
className="px-6 py-2.5 border border-red-200 text-red-600 rounded-xl text-sm font-medium hover:bg-red-50"
>
退出登录
<h2 className="text-lg font-semibold text-foreground mb-4">{t.settings.accountSecurity}</h2>
<button onClick={handleLogout} className="px-6 py-2.5 border border-red-200 text-red-600 rounded-xl text-sm font-medium hover:bg-red-50">
{t.common.logout}
</button>
</div>
</div>