银龄库功能开发详细方案

项目概述

基于银龄平台移动端现有架构，开发"银龄库"功能模块。"银龄库"即银龄人才库，是平台的核心功能之一，为银龄用户提供一个展示个人专长、技能和经验的平台。

技术栈

前端: React + TypeScript + Tailwind CSS（水墨风格移动端UI）
后端: Hono + TypeORM + MySQL
图标: Heroicons
图片存储: MinIO对象存储
认证: JWT Token

功能架构图

graph TD
    A[银龄库首页] --> B[人才列表]
    A --> C[人才搜索]
    B --> D[人才详情]
    B --> E[筛选功能]
    D --> F[个人档案]
    F --> G[编辑资料]
    G --> H[图片上传]

核心功能模块

1. 银龄人才卡片展示

卡片内容:
- 用户头像（圆形，带金色边框认证标识）
- 姓名和昵称
- 年龄和性别图标
- 专长技能标签云
- 所在地区（城市）
- 认证状态徽章
- 简介摘要（最多50字）
- 统计数据：被浏览次数、收藏次数

2. 列表页面功能

显示模式:
- 卡片模式（默认）：每行2个卡片
- 列表模式：详细信息展示
排序选项:
- 最新注册（默认）
- 最多浏览
- 最多收藏
- 认证优先
- 活跃度排序
筛选条件:
- 地区筛选（省市区三级联动）
- 年龄段筛选
- 技能分类筛选
- 认证状态筛选

3. 人才详情页面

页面结构:

顶部封面图区域
├── 个人信息卡片
│   ├── 头像 + 认证标识
│   ├── 基本信息（姓名、年龄、地区）
│   └── 联系方式按钮
技能展示区域
├── 专长技能标签
├── 个人履历时间线
└── 成就展示
统计数据区域
├── 服务次数
├── 好评率
└── 被收藏次数
互动区域
├── 收藏按钮
├── 联系按钮
└── 推荐分享

4. 个人档案管理

可编辑信息:
- 基础信息：姓名、昵称、年龄、地区
- 个人简介：1000字以内
- 专业技能：最多10个标签
- 工作经历：动态添加
- 教育背景：动态添加
- 证书认证：上传相关证书
图片管理:
- 头像上传（支持裁剪）
- 个人作品图片（最多9张）
- 证书/资质图片

数据库设计优化

基于现有SilverUserProfile实体，进行以下优化：

新增字段

-- 银龄人才扩展信息表
ALTER TABLE silver_user_profiles ADD COLUMN (
  skill_categories VARCHAR(500), -- JSON格式存储技能分类ID
  certification_images JSON, -- 认证图片URLs
  portfolio_images JSON, -- 作品集图片URLs
  experience_years INT, -- 工作年限
  service_areas VARCHAR(500), -- 服务区域JSON
  preferred_work_types VARCHAR(200), -- 偏爱工作类型JSON
  hourly_rate DECIMAL(10,2), -- 期望时薪
  availability_status TINYINT DEFAULT 0, -- 可服务状态
  response_time_avg INT, -- 平均响应时间（分钟）
  rating_average DECIMAL(3,2), -- 平均评分
  rating_count INT DEFAULT 0 -- 评分次数
);

-- 银龄人才分类表
CREATE TABLE silver_talent_categories (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(100) NOT NULL, -- 分类名称
  icon VARCHAR(100), -- 图标名称
  sort_order INT DEFAULT 0,
  is_active TINYINT DEFAULT 1
);

-- 银龄人才技能标签表
CREATE TABLE silver_talent_skills (
  id INT AUTO_INCREMENT PRIMARY KEY,
  profile_id INT NOT NULL,
  skill_name VARCHAR(100) NOT NULL,
  skill_level ENUM('初级', '中级', '高级', '专家') DEFAULT '中级',
  years_experience INT DEFAULT 0,
  certification_url VARCHAR(500),
  sort_order INT DEFAULT 0,
  FOREIGN KEY (profile_id) REFERENCES silver_user_profiles(id)
);

API接口设计

RESTful API路径结构

GET    /api/v1/silver-talents           # 获取人才列表
POST   /api/v1/silver-talents/search    # 搜索人才
GET    /api/v1/silver-talents/:id       # 获取人才详情
PUT    /api/v1/silver-talents/:id       # 更新我的档案
POST   /api/v1/silver-talents/upload    # 上传图片
GET    /api/v1/silver-talents/categories # 获取分类列表
GET    /api/v1/silver-talents/skills    # 获取技能标签
POST   /api/v1/silver-talents/:id/favorite # 收藏/取消收藏

搜索参数

interface TalentSearchParams {
  keyword?: string; // 关键词搜索
  city?: string; // 城市筛选
  minAge?: number;
  maxAge?: number;
  skills?: string[]; // 技能匹配
  certified?: boolean; // 仅认证用户
  available?: boolean; // 仅可服务用户
  sortBy?: 'createdAt' | 'rating' | 'popularity' | 'experience';
  sortOrder?: 'asc' | 'desc';
  page: number;
  pageSize: number;
}

UI组件规范

色彩方案

延续水墨风格色彩系统：

主背景: var(--ink-light) #f5f3f0
卡片背景: rgba(255,255,255,0.8)
文字颜色: var(--text-primary) #2f1f0f
强调色: var(--accent-blue) #4a6b7c
认证标识: var(--accent-green) #5c7c5c

组件尺寸规范

人才卡片: 宽 150px × 高 220px (双列布局)
头像尺寸: 60px × 60px (圆形)
间距系统: 8px, 12px, 16px, 24px
圆角统一: 12px (卡片), 50% (头像)

字体层级

姓名: font-serif text-lg font-bold
技能标签: font-sans text-xs
简介: font-sans text-sm line-clamp-2

移动端优化

手势操作

下拉刷新列表
左滑查看更多
长按卡片预览
双击头像放大

加载优化

分页加载（每页20条）
图片懒加载
骨架屏占位
预加载下一页

响应式适配

小屏: 单列卡片布局
中屏: 双列卡片布局
大屏: 三列卡片布局
字体大小动态调整

开发阶段计划

阶段1：后端基础 (2天)

创建缺失的DTO和Schema定义
实现基础CRUD API接口
添加搜索和筛选功能
实现收藏功能

阶段2：前端页面 (3天)

重构SilverTalentsPage页面
开发人才列表组件
开发人才详情页面
开发个人档案管理页面

阶段3：高级功能 (2天)

图片上传功能
地理位置服务
推荐算法实现
实时通知功能

阶段4：测试优化 (2天)

跨设备测试
性能优化
用户体验测试
Bug修复

技术实现要点

图片处理

头像压缩到200×200px，WebP格式
证书图片压缩到800×600px
CDN加速分发
图片水印防盗链

地理位置

基于IP的城市定位
手动选择地区功能
距离计算排序
地图集成展示

安全考虑

数据保护

敏感信息脱敏显示
图片加水印处理
联系方式保护机制
隐私设置控制

内容审核

人工审核+AI初审
敏感词过滤系统
举报处理机制
实时内容监控

测试方案

功能测试清单

人才列表加载和分页
搜索关键词匹配
筛选项组合查询
图片上传和显示
收藏/取消收藏功能
个人资料编辑
地理位置准确性
推荐算法准确性

性能测试指标

页面首屏加载 < 2秒
列表滚动流畅度 > 60fps
图片加载延迟 < 500ms
搜索响应时间 < 1秒

部署计划

环境配置

生产环境CDN配置
图片存储桶优化
数据库读写分离
Redis缓存集群

监控指标

页面访问量PV/UV
用户停留时间
功能使用频次
错误率和性能监控

用户反馈机制

数据收集

页面热力图分析
用户行为追踪
满意度问卷调查
A/B测试功能

持续优化

每月用户调研
功能迭代计划
性能持续监控
用户建议收集

结语

"银龄库"的开发将严格按照水墨风格设计规范实施，确保为中国银龄用户提供优雅、易用、富有文化内涵的使用体验。整个功能模块预计在9天内完成开发和测试，随后将逐步上线并根据用户反馈持续优化。

silver-talent-library-development-plan.md 7.9 KB Permalänk Historik Rå