# MOSE Web网站结构文档

## 网站整体结构

网站由以下主要页面组成：
1. 首页 (Home.vue)
2. 生态系统页面 (Ecosystem.vue)
3. 关于页面 (About.vue)
4. 社区页面 (Community.vue)
5. 资源页面 (Resources.vue)
6. FAQ页面 (FAQ.vue)
7. 联系页面 (Contact.vue)
8. 404页面 (NotFound.vue)

每个页面都有共享的布局组件：
- 导航栏 (NavBar.vue)
- 页脚 (Footer.vue)

## 国际化支持
网站支持三种语言：
- 英文 (en.json)
- 中文 (zh.json)
- 日文 (ja.json)

## 详细页面结构与数据需求

### 1. 首页 (Home.vue)
首页包含以下主要模块：

#### 1.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题文本 (i18n: home.hero.title)
  - 副标题文本 (i18n: home.hero.subtitle)
  - 按钮文本 (i18n: home.cta.explore, home.cta.docs)

#### 1.2 视频播放器
- **位置**: Hero区域下方
- **数据需求**:
  - 视频标题 (i18n: home.video.title)
  - 视频文件路径 (/public/MOSEVideo.mp4)
  - 视频封面图片 (/public/images.png)

#### 1.3 里程碑模块 (MilestoneModule.vue)
- **位置**: 视频区域下方
- **数据需求**:
  - 标题 (i18n: milestones.title)
  - 副标题 (i18n: milestones.subtitle)
  - 里程碑列表数据:
    - 日期
    - 标题
    - 描述
    - 是否已完成

#### 1.4 活动计划模块 (EventsModule.vue)
- **位置**: 里程碑模块下方
- **数据需求**:
  - 标题 (i18n: events.title)
  - 副标题 (i18n: events.subtitle)
  - 活动列表数据:
    - 日期
    - 标题
    - 描述
    - 地点
    - 链接

#### 1.5 奖励机制模块 (RewardModule.vue)
- **位置**: 活动计划模块下方
- **数据需求**:
  - 标题 (i18n: rewards.title)
  - 副标题 (i18n: rewards.subtitle)
  - 空投数据:
    - 总地址数量
    - 符合条件地址数量
    - 每地址空投数量
    - 规则说明 (i18n: rewards.airdrop.rules.*)
  - 代币销毁数据:
    - 当前销毁量
    - 目标销毁量
    - 销毁百分比
    - 停止阈值
    - 销毁机制说明 (i18n: rewards.burn.mechanism.*)
    - 销毁里程碑数据

#### 1.6 收益制度模块 (IncentiveModule.vue)
- **位置**: 奖励机制模块下方
- **数据需求**:
  - 标题 (i18n: incentives.title)
  - 副标题 (i18n: incentives.subtitle)
  - 激励模型数据:
    - 模型ID
    - 模型名称
    - 奖励金额
    - 特性列表 (i18n: incentives.models.*.feature*)
  - 市场数据:
    - 交易规模 (transactionVolume)
    - 增长率 (growthRate)
    - 安全事件 (securityIncidents)

#### 1.7 市场数据模块 (MarketDataModule.vue)
- **位置**: 收益制度模块下方
- **数据需求**:
  - 标题 (i18n: incentives.market_data.title)
  - 副标题 (i18n: incentives.subtitle)
  - 市场统计数据:
    - 交易量数据
    - 增长率数据
    - 安全事件数据

#### 1.8 行动召唤区域
- **位置**: 页面底部，页脚之前
- **数据需求**:
  - 标题 (i18n: ecosystem.join.title)
  - 副标题 (i18n: ecosystem.join.subtitle)
  - 按钮文本 (i18n: ecosystem.join.cta)

### 2. 生态系统页面 (Ecosystem.vue)
生态系统页面包含以下主要模块：

#### 2.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: ecosystem.title)
  - 副标题 (i18n: ecosystem.subtitle)

#### 2.2 十大生态卡片 (EcosystemCard.vue)
- **位置**: Hero区域下方
- **数据需求**:
  - 标题 (i18n: ecosystem.ten_ecosystems.title)
  - 副标题 (i18n: ecosystem.ten_ecosystems.subtitle)
  - 生态系统列表数据:
    - ID
    - 标题
    - 描述
    - 图标
    - 链接

#### 2.3 全球公司布局 (CompanyCard.vue)
- **位置**: 十大生态卡片下方
- **数据需求**:
  - 标题 (i18n: ecosystem.companies.title)
  - 副标题 (i18n: ecosystem.companies.subtitle)
  - 公司列表数据:
    - ID
    - 名称 (i18n: ecosystem.companies.*.name)
    - 描述 (i18n: ecosystem.companies.*.description)
    - 业务重点 (i18n: ecosystem.companies.*.focus)
    - 团队规模 (i18n: ecosystem.companies.*.team)

#### 2.4 特色项目区域
- **位置**: 全球公司布局下方
- **数据需求**:
  - 标题 (i18n: ecosystem.projects.featured)
  - 查看全部文本 (i18n: ecosystem.projects.viewAll)
  - 特色项目列表数据:
    - ID
    - 名称
    - 描述 (i18n: projects.*)
    - 分类
    - 图片
    - URL
    - 是否特色项目

#### 2.5 项目展示区域
- **位置**: 特色项目区域下方
- **数据需求**:
  - 标题 (i18n: ecosystem.projects.all)
  - 分类列表数据 (i18n: ecosystem.categories.*)
  - 项目列表数据 (与特色项目相同)

#### 2.6 合作伙伴区域
- **位置**: 项目展示区域下方
- **数据需求**:
  - 标题 (i18n: ecosystem.partners.title)
  - 副标题 (i18n: ecosystem.partners.subtitle)
  - 合作伙伴列表数据:
    - ID
    - 名称
    - 标志图片
    - URL

### 3. 关于页面 (About.vue)
关于页面包含以下主要模块：

#### 3.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: about.title)
  - 副标题 (i18n: about.subtitle)

#### 3.2 团队介绍区域
- **位置**: Hero区域下方
- **数据需求**:
  - 标题 (i18n: about.team.title)
  - 副标题 (i18n: about.team.subtitle)
  - 团队成员列表数据:
    - ID
    - 姓名
    - 职位
    - 简介
    - 照片
    - 社交媒体链接

#### 3.3 项目发展历程/路线图
- **位置**: 团队介绍区域下方
- **数据需求**:
  - 标题 (i18n: about.roadmap.title)
  - 副标题 (i18n: about.roadmap.subtitle)
  - 里程碑列表数据:
    - 日期
    - 标题
    - 描述
    - 是否已完成

#### 3.4 合作伙伴与生态
- **位置**: 项目发展历程下方
- **数据需求**:
  - 标题 (i18n: about.partners.title)
  - 副标题 (i18n: about.partners.subtitle)
  - 合作伙伴列表数据:
    - ID
    - 名称
    - 标志图片
    - 描述
    - URL

### 4. 社区页面 (Community.vue)
社区页面包含以下主要模块：

#### 4.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: community.title)
  - 副标题 (i18n: community.subtitle)

#### 4.2 社交媒体链接墙
- **位置**: Hero区域下方
- **数据需求**:
  - 标题 (i18n: community.social.title)
  - 副标题 (i18n: community.social.subtitle)
  - 社交媒体列表数据:
    - 平台名称
    - 图标
    - 链接
    - 关注人数

#### 4.3 论坛/讨论区链接
- **位置**: 社交媒体链接墙下方
- **数据需求**:
  - 标题 (i18n: community.forums.title)
  - 副标题 (i18n: community.forums.subtitle)
  - 论坛列表数据:
    - 名称
    - 描述
    - 链接
    - 用户数量

#### 4.4 信息公示区域
- **位置**: 论坛/讨论区链接下方
- **数据需求**:
  - 标题 (i18n: community.announcements.title)
  - 公告列表数据:
    - 日期
    - 标题
    - 摘要
    - 链接

### 5. 资源页面 (Resources.vue)
资源页面包含以下主要模块：

#### 5.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: resources.title)
  - 副标题 (i18n: resources.subtitle)

#### 5.2 文档资源区域
- **位置**: Hero区域下方
- **数据需求**:
  - 标题 (i18n: resources.docs.title)
  - 副标题 (i18n: resources.docs.subtitle)
  - 文档列表数据:
    - 标题
    - 描述
    - 链接
    - 类别

#### 5.3 开发者工具区域
- **位置**: 文档资源区域下方
- **数据需求**:
  - 标题 (i18n: resources.tools.title)
  - 副标题 (i18n: resources.tools.subtitle)
  - 工具列表数据:
    - 名称
    - 描述
    - 链接
    - 图标

#### 5.4 教程与指南区域
- **位置**: 开发者工具区域下方
- **数据需求**:
  - 标题 (i18n: resources.tutorials.title)
  - 副标题 (i18n: resources.tutorials.subtitle)
  - 教程列表数据:
    - 标题
    - 描述
    - 难度级别
    - 链接
    - 封面图片

### 6. FAQ页面 (FAQ.vue)
FAQ页面包含以下主要模块：

#### 6.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: faq.title)
  - 副标题 (i18n: faq.subtitle)

#### 6.2 问题分类区域
- **位置**: Hero区域下方
- **数据需求**:
  - 分类列表数据 (i18n: faq.categories.*)

#### 6.3 问答列表区域
- **位置**: 问题分类区域下方
- **数据需求**:
  - 问答列表数据:
    - 问题 (i18n: faq.questions.*.question)
    - 回答 (i18n: faq.questions.*.answer)
    - 分类

### 7. 联系页面 (Contact.vue)
联系页面包含以下主要模块：

#### 7.1 Hero区域
- **位置**: 页面顶部
- **数据需求**:
  - 标题 (i18n: contact.title)
  - 副标题 (i18n: contact.subtitle)

#### 7.2 联系表单
- **位置**: Hero区域下方
- **数据需求**:
  - 表单字段标签 (i18n: contact.form.*)
  - 表单提交按钮文本 (i18n: contact.form.submit)
  - 表单成功/错误消息 (i18n: contact.form.success, contact.form.error)

#### 7.3 联系信息区域
- **位置**: 联系表单旁边
- **数据需求**:
  - 标题 (i18n: contact.info.title)
  - 联系方式列表数据:
    - 类型 (电子邮件、电话等)
    - 值
    - 图标

#### 7.4 办公地点区域
- **位置**: 联系信息区域下方
- **数据需求**:
  - 标题 (i18n: contact.locations.title)
  - 地点列表数据:
    - 城市
    - 地址
    - 电话
    - 邮箱

### 8. 404页面 (NotFound.vue)
404页面包含以下主要元素：

#### 8.1 错误信息区域
- **位置**: 页面中央
- **数据需求**:
  - 标题 (i18n: notFound.title)
  - 描述 (i18n: notFound.description)
  - 返回首页按钮文本 (i18n: notFound.backHome)

## 共享组件

### 1. 导航栏 (NavBar.vue)
- **位置**: 所有页面顶部
- **数据需求**:
  - 网站标志
  - 菜单项列表数据:
    - 名称 (i18n: nav.*)
    - 链接
  - 语言切换选项:
    - 语言名称
    - 语言代码
  - 移动端菜单按钮文本

### 2. 页脚 (Footer.vue)
- **位置**: 所有页面底部
- **数据需求**:
  - 网站标志
  - 版权信息 (i18n: footer.copyright)
  - 菜单项列表数据:
    - 名称 (i18n: footer.nav.*)
    - 链接
  - 社交媒体链接列表数据:
    - 平台名称
    - 图标
    - 链接
  - 订阅通讯表单:
    - 标题 (i18n: footer.newsletter.title)
    - 描述 (i18n: footer.newsletter.description)
    - 输入框占位文本 (i18n: footer.newsletter.placeholder)
    - 提交按钮文本 (i18n: footer.newsletter.submit)

## 数据结构与格式

### 1. 国际化文本
所有文本内容应通过i18n系统提供，存储在以下文件中：
- src/i18n/locales/en.json (英文)
- src/i18n/locales/zh.json (中文)
- src/i18n/locales/ja.json (日文)

### 2. 静态资源
- 图片: public/目录
- 视频: public/目录
- 图标: 通过SVG内联或图标库提供

### 3. 动态数据
对于可能需要从API获取的数据，应考虑以下格式：
- JSON格式
- 遵循上述各模块的数据需求结构
- 包含适当的分页、过滤和排序参数

## 数据匹配要求

为了将外部数据正确匹配到网站结构中，请确保：

1. **数据格式一致性**：外部数据应与各组件期望的数据结构保持一致
2. **ID匹配**：使用唯一标识符(ID)确保数据正确关联
3. **国际化支持**：对于多语言内容，确保每种语言都有对应的翻译
4. **图片/媒体资源路径**：确保外部数据中的媒体资源路径与网站的资源路径结构匹配
5. **日期格式**：统一日期格式，建议使用ISO标准格式(YYYY-MM-DD)
6. **数值格式**：确保数值类型数据(如金额、百分比等)格式一致

## 特别注意事项

1. **生态系统公司数据**：CompanyCard.vue组件使用ID(数字)作为公司标识符，而不是名称。确保i18n文件中的公司数据使用相同的ID结构(ecosystem.companies.1.focus而不是ecosystem.companies.singapore.focus)

2. **市场数据重复**：MarketDataModule.vue和IncentiveModule.vue都包含市场数据展示，但数据结构略有不同。确保外部数据能同时满足这两种结构的需求。

3. **代币销毁数据**：RewardModule.vue现在包含了原TokenBurnModule.vue的功能，确保代币销毁相关数据能正确映射到RewardModule组件中。