|
@@ -5,6 +5,92 @@ import { userClient } from '@/client/api';
|
|
|
import { useAuth } from '@/client/home/hooks/AuthProvider';
|
|
import { useAuth } from '@/client/home/hooks/AuthProvider';
|
|
|
import type { User } from '@/client/home/hooks/AuthProvider';
|
|
import type { User } from '@/client/home/hooks/AuthProvider';
|
|
|
|
|
|
|
|
|
|
+// Mock数据
|
|
|
|
|
+const MOCK_FOLLOWING: User[] = [
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 2,
|
|
|
|
|
+ username: "traveler",
|
|
|
|
|
+ nickname: "旅行爱好者",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/cnrhVkzwxjPwAaCfPbdc.png",
|
|
|
|
|
+ bio: "探索世界的每个角落,分享旅途的美好瞬间",
|
|
|
|
|
+ followingCount: 128,
|
|
|
|
|
+ followerCount: 2543,
|
|
|
|
|
+ isFollowing: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 3,
|
|
|
|
|
+ username: "coder_li",
|
|
|
|
|
+ nickname: "程序员小李",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/gaOngJwsRYRaVAuXXcmB.png",
|
|
|
|
|
+ bio: "前端开发 | React | TypeScript | 技术分享",
|
|
|
|
|
+ followingCount: 89,
|
|
|
|
|
+ followerCount: 1250,
|
|
|
|
|
+ isFollowing: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 4,
|
|
|
|
|
+ username: "foodie_wang",
|
|
|
|
|
+ nickname: "美食家小王",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/ubnKSIfAJTxIgXOKlciN.png",
|
|
|
|
|
+ bio: "美食探店 | 家常菜分享 | 烘焙爱好者",
|
|
|
|
|
+ followingCount: 215,
|
|
|
|
|
+ followerCount: 3876,
|
|
|
|
|
+ isFollowing: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 5,
|
|
|
|
|
+ username: "photographer_zhang",
|
|
|
|
|
+ nickname: "摄影师小张",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png",
|
|
|
|
|
+ bio: "风光摄影 | 城市夜景 | 人文纪实",
|
|
|
|
|
+ followingCount: 156,
|
|
|
|
|
+ followerCount: 5231,
|
|
|
|
|
+ isFollowing: true
|
|
|
|
|
+ }
|
|
|
|
|
+] as User[];
|
|
|
|
|
+
|
|
|
|
|
+const MOCK_FOLLOWERS: User[] = [
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 6,
|
|
|
|
|
+ username: "music_lover",
|
|
|
|
|
+ nickname: "音乐爱好者",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/jZUIxmJycoymBprLOUbT.png",
|
|
|
|
|
+ bio: "古典音乐 | 爵士乐 | 钢琴演奏",
|
|
|
|
|
+ followingCount: 45,
|
|
|
|
|
+ followerCount: 128,
|
|
|
|
|
+ isFollowing: false
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 7,
|
|
|
|
|
+ username: "book_reader",
|
|
|
|
|
+ nickname: "书虫",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/dURIMkkrRFpPgTuzkwnB.png",
|
|
|
|
|
+ bio: "文学爱好者 | 读书分享 | 书评",
|
|
|
|
|
+ followingCount: 120,
|
|
|
|
|
+ followerCount: 356,
|
|
|
|
|
+ isFollowing: false
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 8,
|
|
|
|
|
+ username: "fitness_trainer",
|
|
|
|
|
+ nickname: "健身教练",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png",
|
|
|
|
|
+ bio: "健身指导 | 营养规划 | 健康生活方式",
|
|
|
|
|
+ followingCount: 320,
|
|
|
|
|
+ followerCount: 2876,
|
|
|
|
|
+ isFollowing: false
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ id: 9,
|
|
|
|
|
+ username: "tech_reporter",
|
|
|
|
|
+ nickname: "科技记者",
|
|
|
|
|
+ avatar: "https://gw.alipayobjects.com/zos/rmsportal/GxqBpPqiaYWqCzevC3jK.png",
|
|
|
|
|
+ bio: "科技新闻 | 产品评测 | 行业观察",
|
|
|
|
|
+ followingCount: 256,
|
|
|
|
|
+ followerCount: 4210,
|
|
|
|
|
+ isFollowing: false
|
|
|
|
|
+ }
|
|
|
|
|
+] as User[];
|
|
|
type FollowType = 'following' | 'followers';
|
|
type FollowType = 'following' | 'followers';
|
|
|
|
|
|
|
|
const FollowPage: React.FC = () => {
|
|
const FollowPage: React.FC = () => {
|
|
@@ -47,8 +133,10 @@ const FollowPage: React.FC = () => {
|
|
|
if (!response.ok) throw new Error('获取列表失败');
|
|
if (!response.ok) throw new Error('获取列表失败');
|
|
|
|
|
|
|
|
const data = await response.json();
|
|
const data = await response.json();
|
|
|
- setUsers(data.data);
|
|
|
|
|
- setTotalCount(data.pagination.total);
|
|
|
|
|
|
|
+ // 如果API返回数据为空,则使用mock数据
|
|
|
|
|
+ const useMockData = data.data.length === 0;
|
|
|
|
|
+ setUsers(useMockData ? (type === 'following' ? MOCK_FOLLOWING : MOCK_FOLLOWERS) : data.data);
|
|
|
|
|
+ setTotalCount(useMockData ? (type === 'following' ? MOCK_FOLLOWING.length : MOCK_FOLLOWERS.length) : data.pagination.total);
|
|
|
} catch (error) {
|
|
} catch (error) {
|
|
|
console.error(`Error fetching ${type} list:`, error);
|
|
console.error(`Error fetching ${type} list:`, error);
|
|
|
} finally {
|
|
} finally {
|