vscode-workbench/.trae/documents/userhome-visibility-plan.md

个人主页访客/主人视角区分方案

目标

区分"自己看自己的主页"和"看别人的主页"两种视角，访客视角隐藏所有隐私数据和个人信息。

---

当前状态分析

当前已实现	需要修改
isOwner 判断逻辑	后端 API 返回敏感数据给访客
数据分析标签页仅主人可见	侧边栏积分/金币卡片对所有人可见
封面上传仅主人可见	访客可见加入时间、地区、性别
快捷操作仅主人可见
不同操作按钮（关注/发消息/拉黑）

---

访客隐藏内容清单

完全隐藏（整个区块不渲染）

• 数据分析标签页（已处理）
• 快捷操作侧边栏（已处理）
• 积分/金币信息卡片
• 最近收藏卡片
• 封面上传按钮（已处理）
• 个人统计中的具体数值（文章数、粉丝数、关注数、点赞数）

个人信息部分隐藏

• 加入时间 → 隐藏
• 地区 → 隐藏
• 性别 → 隐藏
• 积分/金币 → 隐藏

访客可见内容

• 用户名
• 头像
• 个性签名
• 文章标签页（公开文章列表）
• 关注按钮 / 发消息按钮 / 拉黑按钮

---

实现方案

1. 后端修改

文件	修改
user/views/user.py	PublicProfileAPIView 新增 is_owner 判断，访客不返回 points、coins、analytics、date_joined、location、gender 等敏感字段

2. 前端修改

文件	修改
UserHome.tsx	侧边栏积分/金币卡片增加 isOwner 判断
UserHome.tsx	侧边栏最近收藏卡片增加 isOwner 判断
UserHome.tsx	Hero 区域隐藏加入时间、地区、性别（非主人）
UserHome.tsx	统计数字区域对访客隐藏具体数值
UserHome.css	访客模式下的统计区域样式适配

3. 国际化

文件	修改
zh.json / en.json / ja.json / ko.json / ru.json / zh-TW.json	新增 userHome.visitor.hiddenStats 翻译

---

详细实现步骤

Step 1: 后端 PublicProfileAPIView 修改

在 user/views/user.py 的 PublicProfileAPIView.get() 中：

is_owner = request.user.is_authenticated and request.user.id == user_id

data = {
    'id': user.id,
    'username': user.username,
    'avatar': user.avatar.url if user.avatar else '',
    'bio': user.bio or '',
    # ... 仅对主人返回的字段
}

if is_owner:
    data.update({
        'points': user.points,
        'coins': user.coins,
        'date_joined': user.date_joined.strftime('%Y-%m-%d'),
        'gender': user.get_gender_display(),
        'location': user.location or '',
        'analytics': analytics,
        'follower_count': 0,  # 实际需要查询
        'following_count': 0,
        'like_count': 0,
    })
else:
    # 访客可见字段
    data.update({
        'date_joined': None,
        'gender': '',
        'location': '',
    })

Step 2: 前端 UserHome.tsx 修改

Hero 区域（用户信息头部）：

• 非主人时隐藏：加入时间、地区、性别图标
• 非主人时隐藏：统计数字（文章数、粉丝数等），替换为"关注查看"提示

侧边栏：

• 积分/金币卡片：增加 {isOwner && (...)} 条件渲染
• 最近收藏卡片：增加 {isOwner && (...)} 条件渲染

Step 3: CSS 适配

添加 .userhome-stats-row--visitor 样式，使统计区域在访客模式下居中显示提示文字。

---

验证步骤

1. 登录后访问自己的主页 → 确认所有信息可见，数据分析可用
2. 访问他人主页 → 确认仅显示用户名、头像、签名、文章列表
3. 未登录访问他人主页 → 同上
4. 检查侧边栏 → 积分/金币/收藏卡片对访客隐藏