# 白马家园官网 - 产品需求文档 (PRD)

## 📋 文档信息

- **项目名称**：白马家园官网
- **版本**：v3.3
- **更新日期**：2025年1月16日
- **状态**：开发完成，准备部署

---

## 🎯 项目概述

### 1.1 项目背景

白马家园是一家专注于数字经济和新质生产力产业集群的科技公司，致力于通过军工技术和人工智能赋能小微企业和实体商业。公司需要建设一个现代化、响应式的官方网站，用于：

- 品牌形象展示（中英文双语）
- 产品矩阵介绍
- 客户商机获取
- 行业资讯传播
- 合作加盟引流

### 1.2 项目目标

1. **品牌升级**：打造数字化、科技感的品牌形象（中英文双语）
2. **产品展示**：清晰展示四大核心产品线
3. **商机转化**：通过客服企业微信二维码引导潜在客户直接联系
4. **内容营销**：自动抓取行业资讯，保持网站活跃度
5. **用户体验**：支持手机、平板、桌面全设备响应式访问
6. **国际化**：支持中英文切换，服务全球用户

### 1.3 目标用户

- **潜在合作伙伴**：实体商家、创业者、投资人
- **C端消费者**：小微企业主、门店经营者
- **媒体和行业人士**：记者、分析师、行业专家
- **国际用户**：海外华人和全球商业伙伴

---

## 🏗️ 系统架构

### 2.1 技术栈

```
前端：Next.js 16 + React 19 + TypeScript
UI框架：Tailwind CSS 4 + Radix UI
动画：Framer Motion
状态管理：React Hooks
后端：Next.js API Routes
部署：Vercel
国际化：Next.js i18n
```

### 2.2 目录结构

```
baima-home/
├── app/
│   ├── page.tsx              # 首页（中文）
│   ├── layout.tsx            # 全局布局
│   ├── globals.css           # 全局样式
│   ├── en/
│   │   └── page.tsx          # 首页（英文）
│   ├── about/                # 关于我们
│   ├── products/             # 产品矩阵
│   ├── news/                 # 新闻动态
│   ├── contact/              # 联系加盟
│   ├── admin/                # 后台管理
│   └── api/                  # API接口
│       ├── news/             # 新闻API（静态数据）
│       └── auto-fetch/       # 自动抓取API（静态数据）
├── components/
│   ├── home/                 # 首页组件
│   │   ├── Hero.tsx          # 首屏区域
│   │   ├── ProductPreview.tsx # 产品矩阵
│   │   ├── MissionVision.tsx  # 使命愿景价值观
│   │   ├── HonorSection.tsx   # 资质荣誉
│   │   └── Infrastructure.tsx # 生态基础设施
│   ├── layout/               # 布局组件
│   │   ├── Navbar.tsx        # 导航栏
│   │   └── Footer.tsx        # 页脚
│   └── ui/                   # 基础UI组件
├── lib/
│   └── utils.ts              # 工具函数
└── public/                   # 静态资源
```

---

## 📱 页面规划

### 3.1 前台页面

#### 首页 (/ 和 /en)
**设计风格**：单页全景布局，沉浸式体验

**功能模块**：
1. **Hero首屏**
   - 品牌Logo（大尺寸展示）
   - 核心标签：军工技术、AI赋能、小微企业
   - 价值主张：AI数智增长引擎
   - 三大核心价值：支付即锁粉、让利即引流、跨界即分润
   - CTA按钮：立即加入白马联盟 / Join Baima Alliance
   - 背景：深蓝色科技感渐变 + 网格效果

2. **产品矩阵**
   - 四大核心板块卡片布局
   - 金融科技支撑（白马智付）
   - 私域运营工具（AI拓客宝）【原名"爆客宝AI"】
   - 异业联盟系统（商家联盟）
   - 生态基础设施（智能硬件）
   - 每张卡片包含：标题、描述、功能特性列表
   - 【已移除】"深入了解"链接

3. **使命、愿景、价值观**【新增模块】
   - 使命：军工技术赋能实体经济，人工智能驱动万商互联
   - 愿景：天下白马是一家，一起赚钱一起花
   - 价值观：共创、共享、共富
   - 三大核心板块，渐变色背景，悬停动画效果
   - 支持中英文双语显示

4. **权威认证与技术实力**
   - 资质证书展示（ISO认证、高新技术企业等）
   - 专利技术展示（专利数量、软著）
   - 荣誉奖项展示（行业认可）
   - 响应式网格布局

5. **生态基础设施**
   - 会员系统
   - 供应链资源
   - 数字资产体系
   - 【已移除】智能监控（移至智能设备）
   - 【已移除】"为上市合规打造的底层架构"描述文字

6. **页脚**
   - 客服企业微信二维码（替代电话和邮箱）
   - 产品中心链接
   - 解决方案链接
   - 公司地址：天津市武清区京津产业新城海达商务大厦
   - 公司信息：天津白马晶选科技有限公司 | 天津白马家园健康科技有限公司
   - 版权信息
   - 【已移除】隐私政策、服务条款链接

#### 关于我们 (/about)
- 公司介绍
- 团队介绍
- 发展历程
- 资质认证

#### 产品矩阵 (/products)
- 产品详情页
- 产品对比
- 定价方案
- 客户案例

#### 新闻动态 (/news)
- 新闻列表（静态数据展示）
- 新闻详情
- 分类筛选
- 搜索功能

#### 联系加盟 (/contact)
- 公司信息
- 地图定位
- 客服企业微信二维码（引导用户扫码联系）

### 3.2 后台管理 (/admin)

#### 登录验证
- 密码保护：固定密码 `admin123`
- 简洁的登录界面

#### 新闻动态管理
- 发布新闻（静态数据示例）
- 编辑新闻
- 删除新闻
- 分类管理
- 状态跟踪

#### 自动抓取管理
- 手动触发抓取（静态数据示例）
- 待审核列表
- 审核操作（通过/拒绝）
- 抓取历史记录
- 配置管理

### 3.3 语言切换

- 支持中英文双语
- 导航栏语言切换按钮
- 中文首页：`/`
- 英文首页：`/en`
- 页面内容自动切换
- 移动端支持滑出式菜单切换

---

## 📡 API 接口

### 4.1 新闻接口（静态数据）

**GET** `/api/news`

返回静态新闻数据示例，无需数据库支持。

### 4.2 自动抓取接口（静态数据）

**GET** `/api/auto-fetch`

返回静态抓取数据示例，无需数据库支持。

---

## 🤖 自动抓取系统

### 5.1 抓取策略（静态示例）

- **主要来源**：搜狗微信搜索（示例）
- **目标账号/关键词**：白马精选、白马家园
- **抓取频率**：每6小时自动抓取
- **手动触发**：管理员可随时手动抓取

### 5.2 智能过滤规则

#### 必须包含的关键词
- `白马精选`（必须）
- `数字经济`、`AI`、`人工智能`、`金融科技`、`小微企业`（至少一个）

#### 排除的关键词（房地产相关）
```
房地产、楼盘、房价、房产、住宅、商业地产
购房、租房、地产投资、物业、开盘、预售证
样板间、户型图、买房、卖房、出租、二手房
白马家园、白马花园、白马苑、白马小区（小区名称）
万科白马家园、恒大白马家园、碧桂园白马家园
别墅、豪宅、精装房、毛坯房
```

#### 分类规则
- `产品发布`：包含发布、上线、新品等关键词
- `荣誉获奖`：包含获奖、认证、荣誉等关键词
- `行业洞察`：包含趋势、分析、洞察等关键词
- `媒体报道`：包含报道、媒体等关键词
- 默认：`公司新闻`

---

## 🎨 设计规范

### 6.1 视觉风格

#### 配色方案
- **主色调**：橙色 `#FF6600`
  - 用途：CTA按钮、强调文字、图标、链接
- **辅助色**：深蓝色 `#0A1931`
  - 用途：背景、导航栏、文字
- **点缀色**：`#185ADB`（浅蓝）
- **背景色**：`#050A14`（深黑）

#### 字体规范
- **标题**：加粗加黑，层级分明
- **正文字体**：17px基础字号
- **英文字体**：Geist Sans
- **中文字体**：系统默认无衬线字体

### 6.2 响应式断点

```
移动端：< 640px
平板端：640px - 1024px  
桌面端：> 1024px
```

### 6.3 组件规范

- **按钮**：圆角矩形，阴影效果，悬停动画
- **卡片**：圆角边框，阴影，悬停效果
- **导航栏**：固定定位，滚动变色，语言切换
- **页脚**：多列布局，响应式堆叠，客服二维码
- **模块间距**：统一规范，保持视觉平衡

### 6.4 页面布局优化

#### Logo 尺寸
- 导航栏：56px（h-14）
- 首页Hero：64px - 112px（响应式）
- 页脚：56px（h-14）

#### 使命愿景价值观模块
- 深蓝渐变背景
- 三栏卡片布局
- 彩色图标（橙/蓝/绿渐变）
- 悬停动画效果
- 中英文双语内容

#### 新闻卡片
- 卡片可点击，支持跳转详情页
- 分类标签+日期展示
- 摘要截断（最多3行）
- 阅读更多链接

---

## 🔧 功能实现

### 7.1 已完成功能

✅ **前台功能**
- 首页单页全景布局（中英文双语）
- 使命愿景价值观模块
- 响应式设计（全设备适配）
- 产品矩阵展示
- 资质荣誉展示
- 新闻动态模块（静态数据）
- 合作加盟表单
- 页脚优化（企微二维码）

✅ **技术功能**
- SEO优化
- 性能优化
- 错误处理
- 加载状态
- 中英文国际化

### 7.2 待实现功能

⏳ **内容功能**
- 新闻详情页完善
- 产品详情页
- 关于我们页面完善

⏳ **部署功能**
- Vercel部署
- 域名配置
- SSL证书
- 监控告警

---

## 🧪 测试用例

### 8.1 前台测试

#### 首页测试
- [x] Hero区域加载正常
- [x] 产品卡片显示完整
- [x] 使命愿景价值观模块显示
- [x] 资质荣誉网格布局
- [x] 新闻动态展示（静态数据）
- [x] 移动端响应式布局
- [x] 页面滚动动画效果
- [x] 中英文切换功能

---

## 🚀 部署计划

### 9.1 部署环境

- **开发环境**：本地 `localhost:3000`
- **测试环境**：Vercel Preview
- **生产环境**：Vercel Production

### 9.2 部署步骤

1. **代码推送**
   ```
   git push origin main
   ```

2. **Vercel导入**
   - 访问 https://vercel.com/new
   - 导入 GitHub 仓库 `wygogogo19/baima-home`

3. **自动部署**
   - Vercel自动检测并部署
   - 预览环境生成

4. **生产发布**
   - Vercel生产环境部署
   - 域名绑定
   - SSL证书配置

### 9.3 监控和维护

- **错误监控**：Vercel Error Tracking
- **性能监控**：Vercel Analytics
- **日志查看**：Vercel Logs
- **回滚机制**：Vercel Deployments

---

## 📊 项目进度

### 9.1 当前进度

- ✅ **需求分析**：完成
- ✅ **UI设计**：完成
- ✅ **前端开发**：完成
- ✅ **后端开发**：完成
- ✅ **国际化（中英文）**：完成
- ✅ **测试调试**：完成
- ⏳ **部署上线**：进行中

### 9.2 下一步计划

1. **短期目标**
   - [x] Vercel部署
   - [x] 生产环境测试

2. **中期目标（1周内）**
   - [ ] 完善前台页面
   - [ ] 新闻详情页开发
   - [ ] 绑定自定义域名

---

## 📝 变更日志

### v3.3 (2025-01-16) - 当前版本
- 🔄 完全移除数据库依赖
  - 删除 Prisma ORM 和所有数据库相关代码
  - 所有 API 接口改为静态数据返回
  - 删除 prisma/ 目录、lib/prisma.ts
  - 从 package.json 移除 Prisma 依赖
  - 不再需要 DATABASE_URL 环境变量
- 🔄 更新技术架构文档，移除数据库相关内容
- ✅ 简化部署流程，无需数据库配置

### v3.2 (2025-01-16)
- 🔄 更新资质认证描述
  - "支付业务许可证" → "收单外包服务机构备案"
- 🔄 产品矩阵多项优化
  - 支付能力："主扫被扫全支持" → "主扫、被扫模式全支持"
  - AI数字人："7x24小时直播 / 数字员工导购" → "AI直播/AI导购/AI客服/AI私域"
  - 企微私域（原消费券流转）："供应商进货 / 转赠他人使用" → "AI数字员工自动实现：社群运营/维护/导购/客服"
  - 锁定客户："一次锁定，终身受益" → "扫码即锁定推荐关系，终身享受消费分佣"
  - 数字资产 → 数字资产体系
  - RWA资产描述："积分抵用券互转" → "积分、抵用券、金币等"
  - 智能监控巡店移至智能设备
- 🔄 页面结构调整
  - 删除首页"最新动态"模块
  - 删除产品卡片"深入了解"链接
- ✅ 优化产品展示逻辑，提升用户体验

### v3.1 (2025-01-16)
- 🔄 删除"在线咨询留言"功能模块（Path A - 完全删除）
- 🗑️ 删除 Contact 数据模型及相关 API 路由
- 🗑️ 删除后台"客户留言管理"功能
- 🗑️ 删除前端"在线表单"提交功能
- ✅ 全站统一使用客服企业微信二维码作为对外联系入口

### v3.0 (2025-01-15)
- ✅ 新增使命愿景价值观模块
- ✅ 新增英文版首页 (/en)
- ✅ 新增中英文切换功能
- ✅ 新增自动抓取系统（搜狗微信）
- ✅ 新增智能过滤（排除房地产内容）
- ✅ 新闻卡片支持点击跳转详情页
- ✅ 页脚改为客服企业微信号码
- ✅ 移除"为上市合规打造的底层架构"
- ✅ 产品名称更新：爆客宝AI → AI拓客宝
- ✅ 移除页脚隐私政策、服务条款
- ✅ Logo尺寸优化放大
- ✅ 响应式设计优化

---

## 👥 团队

- **产品经理**：[待补充]
- **UI设计**：[待补充]
- **前端开发**：已完成
- **后端开发**：已完成
- **测试**：[待补充]

---

## 📞 联系方式

- **项目负责人**：[待补充]
- **技术对接**：[待补充]
- **更新日期**：2025年1月16日

---

*本文档将持续更新，记录项目进展和需求变更。*
