'还剩下i18N的一点bug'

7 months ago · 23becf0912
--- a/index.html
+++ b/index.html
@ -2,7 +2,7 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <link rel="icon" type="image/png" href="/public/LOGO.png" />
    <link href="/src/style.css" rel="stylesheet">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="MOSE Blockchain - Next-generation blockchain platform for high performance, security, and scalability" />
--- a/jiegou.txt
+++ b/jiegou.txt
@ -0,0 +1,158 @@
 # MOSE 官网架构文档（完整版）

 ## 全局结构
 - 语言支持：中英日文三语 i18n
 - 响应式设计：PC/平板/手机全适配 tailwindcss

 ## 首页 (Home)
 ### 1. Hero区域
 [动态Banner图/视频]
 - 主标题：全球隐私跨链基础设施领导者
 - 副标题：让隐私成为区块链的基本权利
 - CTA按钮：探索技术 | 阅读白皮书

 ### 2. 核心价值主张 (3×2网格布局)
 ┌──────────────┬──────────────┬──────────────┐
 │  🔒 隐私保护   │  ⛓️ 跨链互操作  │  🛡️ 合规安全   │
 │ 零知识证明技术 │ 支持12+主流公链 │ 新加坡MAS沙盒许可 │
 │ 匿名原子交换   │ 以太坊/Cosmos/Polkadot │ 瑞士FINMA合规咨询 │
 └──────────────┴──────────────┴──────────────┘

 ### 3. 项目简介
 "由瑞士加密合基金会、新加坡数字金融联盟等联合孵化，专注研发跨链隐私技术，为Web3提供去中心化隐私基础设施。全球布局：新加坡总部与十大生态枢纽，服务北美、欧洲、亚太等核心区域。"

 ### 4. 合作伙伴LOGO墙
 [滚动展示] 
 Binance Labs | Polychain Capital | Aleo | StarkWare | LayerZero | Axelar

 ### 5. 最新动态
 [公告滚动栏]
 - 主网V1.0发布，日交易量破$1亿
 - 获新加坡MAS沙盒许可
 - 东京开发者黑客松（奖金池$50万）

 ## 关于页 (About)
 ### 1. 愿景与使命
 **愿景**  
 构建全球用户信任的隐私保护基础设施，成为Web3世界的"隐私层"

 **使命**  
 通过技术创新打破链间壁垒，实现资产自由、匿名、安全的无边界流通

 ### 2. 团队介绍
 [卡片式布局 3×3网格]
 ┌─────────────────┬─────────────────┬─────────────────┐
 │  [James Park照片]  │  [Sophia Müller]  │  [Hiroshi Sato]  │
 │ 技术总裁          │ 全球运营总裁      │ 品牌策划总裁      │
 │ 前Combase亚太负责人│ 管理50+国合规团队 │ 东大区块链实验室主任│
 └─────────────────┴─────────────────┴─────────────────┘

 ### 3. 发展历程
 [时间轴设计]
 ● 2023 Q1: 协议白皮书发布（种子轮融资$800万）
 ● 2023 Q4: 测试网上线（接入以太坊、BNB Chain）
 ● 2024 Q2: 主网V1.0发布（日交易量破$1亿）
 ● 2025: 启动去中心化自治组织（MOSE DAO）

 ### 4. 合作伙伴
 [分类展示]
 - **技术合作**：Aleo（零知识证明）、StarkWare、LayerZero（跨链协议）、Axelar
 - **投资机构**：Binance Labs、Polychain Capital（估值$3亿）
 - **合规支持**：新加坡MAS、瑞士FINMA

 ## 技术页 (Technology)
 ### 1. 技术架构
 [四层架构示意图]
 1. **聚合层** - 整合Tornado、Raijour等10+混币协议
 2. **跨链层** - 基于F4-SNAPK5的匿名原子交换（延迟<30秒）
 3. **路由层** - 动态更新路由网络，自动跟踪监管高风险节点
 4. **应用层** - 开放SDK，支持DEX、NFT市场等场景一键隐私化

 ### 2. 核心创新
 [标签云+图标展示]
 - 🚀 跨链协议互操作性（已申请3项国际专利）
 - 🌐 兼容12+公链（DevKit被200+项目采用）
 - 🔐 F4-SNAPK5加密算法
 - ⚡ 无需数据的跨链路高效通信

 ## 生态系统 (Ecosystem)
 ### 1. 生态全景图
 [十大生态可视化]
 1. MOSE L1链 → 2. FlashBox → 3. xRouter引擎 → 4. MUSD稳定币 → 5. WEB3.0彩票
 6. DEX交易所 → 7. MOSE银行 → 8. MOSE钱包APP → 9. 反向跨境电商 → 10. 多国法币兑换

 ### 2. DApp展示
 [分类筛选+卡片布局]
 - 闪兑池（2025年6-12月）
 - Mosc C2C交易所（2026年1-6月）
 - MoSe交易所（2026年7月上线）

 ## 社区 (Community)
 ### 1. 社交媒体墙
 [图标链接] 
@mose202399 | @Nosafuture | @MoseComa

 ### 2. 论坛入口
 [嵌入式讨论区] 用户可直接留言互动

 ### 3. 信息公示
 [最新获奖公告]
 🏆 每日竞赛TOP10（第1名500枚MOSE）
 🏆 每周鲸鱼奖励榜（V5等级奖励300,000枚）

 ### 4. 社区风采
 [UGC内容展示]
 - 新加坡共识大会2024主题演讲
 - 迪拜监管科技峰会圆桌论坛
 - 东京开发者黑客松活动

 ## 常见问题 (FAQ)
 [分类折叠面板]
 ### 技术类
 Q: 如何保证跨链隐私？  
 A: 基于F4-SNAPK5算法实现匿名原子交换，延迟<30秒

 ### 代币经济
 Q: MOSE代币机制？  
 A: 总发行量3亿枚，其中：
   - 1.5亿枚用于闪兑池
   - 9450万枚用于动态+等级激励
   - 手续费100%销毁（目标销毁2.9亿枚）

 ### 收益制度
 Q: 如何获得收益？  
 A: 多级激励机制：
   - M1：推广≥5000枚 + 自持≥500枚（收益1%）
   - M5：≥3个M4部门 + 总持币≥300万（收益10%）
   - 巨鲸激励：V5等级（限量10人）均分20%手续费

 ## 全局页脚
 ### 联系我们
 - 商务合作: business@mose.org
 - 媒体问询: press@mose.org
 - 技术支持: dev@mose.org

 ### 法律信息
 © 2024 MOSE Protocol  |  隐私政策  |  服务条款

 ## 核心数据看板
 [实时显示]
 - 已销毁: 2.1亿/2.9亿 MOSE（72.41%）
 - 24h交易量: $1.2M（混币器日均$500万）
 - 季度收入: 
  - 跨链桥：$100万（0.3%手续费）
  - 混币器：$150万（0.3%服务费）

 ## 代币经济模型
 ### 静态激励
 - 前10万注册地址空投50枚MOSE
 - 每日释放1%，持币<100枚停止释放
 - 15日内未完成≥100枚闪兑则销毁

 ### 动态激励
 - 直推奖励：20%闪兑量进入奖励池
 - 等级分润：M5→M3→M1（级差2%）

 ### 燃烧机制
 - 跨链/混币手续费100%销毁
 - 目标：销毁至1000万枚停止
--- a/public/LOGO.png
+++ b/public/LOGO.png
--- a/public/MOSEVideo.mp4
+++ b/public/MOSEVideo.mp4
--- a/src/components/about/PartnersModule.vue
+++ b/src/components/about/PartnersModule.vue
@ -0,0 +1,141 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 合作伙伴数据
 const partners = {
  technology: [
    {
      id: 1,
      name: 'Aleo',
      description: t('about.partners.technology.aleo'),
      logo: '/public/LOGO.png',
      url: 'https://aleo.org'
    },
    {
      id: 2,
      name: 'StarkWare',
      description: t('about.partners.technology.starkware'),
      logo: '/public/LOGO.png',
      url: 'https://starkware.co'
    },
    {
      id: 3,
      name: 'LayerZero',
      description: t('about.partners.technology.layerzero'),
      logo: '/public/LOGO.png',
      url: 'https://layerzero.network'
    },
    {
      id: 4,
      name: 'Axelar',
      description: t('about.partners.technology.axelar'),
      logo: '/public/LOGO.png',
      url: 'https://axelar.network'
    }
  ],
  investors: [
    {
      id: 1,
      name: 'Binance Labs',
      description: t('about.partners.investors.binance'),
      logo: '/public/LOGO.png',
      url: 'https://labs.binance.com'
    },
    {
      id: 2,
      name: 'Polychain Capital',
      description: t('about.partners.investors.polychain'),
      logo: '/public/LOGO.png',
      url: 'https://polychain.capital'
    }
  ],
  compliance: [
    {
      id: 1,
      name: 'Singapore MAS',
      description: t('about.partners.compliance.mas'),
      logo: '/public/LOGO.png',
      url: 'https://www.mas.gov.sg'
    },
    {
      id: 2,
      name: 'Swiss FINMA',
      description: t('about.partners.compliance.finma'),
      logo: '/public/LOGO.png',
      url: 'https://www.finma.ch'
    }
  ]
 };
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-10 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('about.partners.title') }}
      </h2>
      
      <!-- 技术合作伙伴 -->
      <div class="mb-12">
        <h3 class="text-xl font-bold text-text mb-6 wow animate__animated animate__fadeInUp animate__duration-fast">
          {{ t('about.partners.technology_title') }}
        </h3>
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
          <div 
            v-for="partner in partners.technology" 
            :key="`tech-${partner.id}`"
            class="bg-background rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 wow animate__animated animate__fadeInUp animate__duration-fast"
          >
            <div class="flex items-center justify-center mb-4 h-16">
              <img :src="partner.logo" :alt="partner.name" class="max-h-full max-w-full" />
            </div>
            <h4 class="text-lg font-bold text-text text-center mb-2">{{ partner.name }}</h4>
            <p class="text-text-secondary text-center text-sm">{{ partner.description }}</p>
          </div>
        </div>
      </div>
      
      <!-- 投资机构 -->
      <div class="mb-12">
        <h3 class="text-xl font-bold text-text mb-6 wow animate__animated animate__fadeInUp animate__duration-fast">
          {{ t('about.partners.investors_title') }}
        </h3>
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
          <div 
            v-for="partner in partners.investors" 
            :key="`inv-${partner.id}`"
            class="bg-background rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 wow animate__animated animate__fadeInUp animate__duration-fast"
          >
            <div class="flex items-center justify-center mb-4 h-16">
              <img :src="partner.logo" :alt="partner.name" class="max-h-full max-w-full" />
            </div>
            <h4 class="text-lg font-bold text-text text-center mb-2">{{ partner.name }}</h4>
            <p class="text-text-secondary text-center text-sm">{{ partner.description }}</p>
          </div>
        </div>
      </div>
      
      <!-- 合规支持 -->
      <div>
        <h3 class="text-xl font-bold text-text mb-6 wow animate__animated animate__fadeInUp animate__duration-fast">
          {{ t('about.partners.compliance_title') }}
        </h3>
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
          <div 
            v-for="partner in partners.compliance" 
            :key="`comp-${partner.id}`"
            class="bg-background rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 wow animate__animated animate__fadeInUp animate__duration-fast"
          >
            <div class="flex items-center justify-center mb-4 h-16">
              <img :src="partner.logo" :alt="partner.name" class="max-h-full max-w-full" />
            </div>
            <h4 class="text-lg font-bold text-text text-center mb-2">{{ partner.name }}</h4>
            <p class="text-text-secondary text-center text-sm">{{ partner.description }}</p>
          </div>
        </div>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/ecosystem/CompanyCard.vue
+++ b/src/components/ecosystem/CompanyCard.vue
@ -1,98 +1,91 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { ref } from 'vue';
 import { ref, computed } from 'vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 十大分公司数据
 const companies = ref([
 // 使用计算属性实现响应式语言切换
 const companiesData = computed(() => [
  {
    id: 1,
    name: 'ecosystem.companies.singapore.name',
    description: 'ecosystem.companies.singapore.description',
    location: '新加坡',
    name: locale.value === 'zh' ? "新加坡总部" : "Singapore Headquarters",
    description: locale.value === 'zh' 
      ? "全球金融科技中心统筹技术研发与合规" 
      : "Global fintech hub overseeing R&D and compliance",
    focus: locale.value === 'zh' ? "技术研发、合规战略" : "Technology R&D, Compliance Strategy",
    team: locale.value === 'zh' ? "核心技术团队" : "Core technical team",
    location: locale.value === 'zh' ? "新加坡" : "Singapore",
    flag: '🇸🇬',
    position: { x: '75%', y: '60%' }
  },
  {
    id: 2,
    name: 'ecosystem.companies.switzerland.name',
    description: 'ecosystem.companies.switzerland.description',
    location: '瑞士',
    name: locale.value === 'zh' ? "香港分公司" : "Hong Kong Branch",
    description: locale.value === 'zh' 
      ? "服务亚太金融市场" 
      : "Serving APAC financial markets",
    focus: locale.value === 'zh' ? "机构合作" : "Institutional partnerships",
    team: locale.value === 'zh' ? "业务拓展团队" : "Business development",
    location: locale.value === 'zh' ? "香港" : "Hong Kong",
    flag: '🇭🇰',
    position: { x: '78%', y: '50%' }
  },
  {
    id: 3,
    name: locale.value === 'zh' ? "瑞士办公室" : "Switzerland Office",
    description: locale.value === 'zh' 
      ? "欧洲总部，专注于合规和法律事务" 
      : "European headquarters focusing on compliance and legal matters",
    focus: locale.value === 'zh' ? "金融合规和治理" : "Financial compliance and governance",
    team: locale.value === 'zh' ? "50+" : "50+",
    location: locale.value === 'zh' ? "瑞士" : "Switzerland",
    flag: '🇨🇭',
    position: { x: '48%', y: '35%' }
  },
  {
    id: 3,
    name: 'ecosystem.companies.japan.name',
    description: 'ecosystem.companies.japan.description',
    location: '日本',
    id: 4,
    name: locale.value === 'zh' ? "日本办公室" : "Japan Office",
    description: locale.value === 'zh' 
      ? "亚太地区技术中心，专注于技术研发" 
      : "Asia-Pacific tech center focusing on R&D",
    focus: locale.value === 'zh' ? "区块链技术创新" : "Blockchain technology innovation",
    team: locale.value === 'zh' ? "80+" : "80+",
    location: locale.value === 'zh' ? "日本" : "Japan",
    flag: '🇯🇵',
    position: { x: '85%', y: '40%' }
  },
  {
    id: 4,
    name: 'ecosystem.companies.uk.name',
    description: 'ecosystem.companies.uk.description',
    location: '英国',
    id: 5,
    name: locale.value === 'zh' ? "英国办公室" : "UK Office",
    description: locale.value === 'zh' 
      ? "欧洲金融创新中心" 
      : "European financial innovation center",
    focus: locale.value === 'zh' ? "金融创新" : "Financial innovation",
    team: locale.value === 'zh' ? "30+" : "30+",
    location: locale.value === 'zh' ? "英国" : "UK",
    flag: '🇬🇧',
    position: { x: '45%', y: '30%' }
  },
  {
    id: 5,
    name: 'ecosystem.companies.usa.name',
    description: 'ecosystem.companies.usa.description',
    location: '美国',
    flag: '🇺🇸',
    position: { x: '20%', y: '40%' }
  },
  {
    id: 6,
    name: 'ecosystem.companies.uae.name',
    description: 'ecosystem.companies.uae.description',
    location: '阿联酋',
    flag: '🇦🇪',
    position: { x: '60%', y: '50%' }
  },
  {
    id: 7,
    name: 'ecosystem.companies.korea.name',
    description: 'ecosystem.companies.korea.description',
    location: '韩国',
    flag: '🇰🇷',
    position: { x: '80%', y: '42%' }
  },
  {
    id: 8,
    name: 'ecosystem.companies.australia.name',
    description: 'ecosystem.companies.australia.description',
    location: '澳大利亚',
    flag: '🇦🇺',
    position: { x: '85%', y: '75%' }
  },
  {
    id: 9,
    name: 'ecosystem.companies.canada.name',
    description: 'ecosystem.companies.canada.description',
    location: '加拿大',
    flag: '🇨🇦',
    position: { x: '22%', y: '30%' }
  },
  {
    id: 10,
    name: 'ecosystem.companies.germany.name',
    description: 'ecosystem.companies.germany.description',
    location: '德国',
    flag: '🇩🇪',
    position: { x: '50%', y: '32%' }
  }
 ]);

 const selectedCompany = ref(companies.value[0]);
 // 十大分公司数据
 const companies = computed(() => companiesData.value);

 const selectedCompany = ref(companiesData.value[0]);

 const selectCompany = (company: any) => {
  selectedCompany.value = company;
 };

 // 根据当前语言获取公司名称和描述
 const getLocalizedCompanyInfo = computed(() => {
  return {
    name: selectedCompany.value.name,
    description: selectedCompany.value.description,
    focus: selectedCompany.value.focus,
    team: selectedCompany.value.team
  };
 });
 </script>

 <template>
@ -124,7 +117,7 @@ const selectCompany = (company: any) => {
                >
                  <span class="text-2xl mr-3">{{ company.flag }}</span>
                  <div>
                    <h4 class="font-medium text-text">{{ t(company.name) }}</h4>
                    <h4 class="font-medium text-text">{{ company.name }}</h4>
                    <p class="text-text-secondary text-sm">{{ company.location }}</p>
                  </div>
                </div>
@ -162,19 +155,19 @@ const selectCompany = (company: any) => {
              <div class="p-6">
                <div class="flex items-center mb-4">
                  <span class="text-3xl mr-3">{{ selectedCompany.flag }}</span>
                  <h3 class="text-xl font-bold text-text">{{ t(selectedCompany.name) }}</h3>
                  <h3 class="text-xl font-bold text-text">{{ getLocalizedCompanyInfo.name }}</h3>
                </div>
                
                <p class="text-text-secondary mb-6">{{ t(selectedCompany.description) }}</p>
                <p class="text-text-secondary mb-6">{{ getLocalizedCompanyInfo.description }}</p>
                
                <div class="grid grid-cols-2 gap-4">
                  <div class="bg-background p-4 rounded-lg">
                    <h4 class="text-sm font-medium text-text-secondary mb-1">{{ t('ecosystem.companies.focus') }}</h4>
                    <p class="text-text">{{ t(`ecosystem.companies.${selectedCompany.id}.focus`) }}</p>
                    <p class="text-text">{{ getLocalizedCompanyInfo.focus }}</p>
                  </div>
                  <div class="bg-background p-4 rounded-lg">
                    <h4 class="text-sm font-medium text-text-secondary mb-1">{{ t('ecosystem.companies.team') }}</h4>
                    <p class="text-text">{{ t(`ecosystem.companies.${selectedCompany.id}.team`) }}</p>
                    <p class="text-text">{{ getLocalizedCompanyInfo.team }}</p>
                  </div>
                </div>
              </div>
--- a/src/components/ecosystem/EcosystemCard.vue
+++ b/src/components/ecosystem/EcosystemCard.vue
@ -1,71 +1,87 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { computed } from 'vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 十大生态系统项目
 const ecosystems = [
 // 使用计算属性实现响应式语言切换
 const ecosystemsData = computed(() => [
  {
    id: 1,
    name: 'ecosystem.ten_ecosystems.mose_layer1.name',
    description: 'ecosystem.ten_ecosystems.mose_layer1.description',
    icon: 'M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4'
    name: locale.value === 'zh' ? "MOSE L1链" : "MOSE L1 Chain",
    description: locale.value === 'zh' ? "高性能可扩展底层区块链" : "High-performance, scalable base layer blockchain",
    icon: 'M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4',
    link: "#"
  },
  {
    id: 2,
    name: 'ecosystem.ten_ecosystems.flashbox.name',
    description: 'ecosystem.ten_ecosystems.flashbox.description',
    icon: 'M13 10V3L4 14h7v7l9-11h-7z'
    name: locale.value === 'zh' ? "闪兑盒子" : "FlashBox",
    description: locale.value === 'zh' ? "闪电快速交易与即时确认支付解决方案" : "Lightning-fast transactions and instant confirmations payment solution",
    icon: 'M13 10V3L4 14h7v7l9-11h-7z',
    link: "#"
  },
  {
    id: 3,
    name: 'ecosystem.ten_ecosystems.xrouter.name',
    description: 'ecosystem.ten_ecosystems.xrouter.description',
    icon: 'M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-.553-.894L15 4m0 13V4m0 0L9 7'
    name: locale.value === 'zh' ? "xRouter引擎" : "xRouter",
    description: locale.value === 'zh' ? "连接不同区块链的跨链路由协议" : "Cross-chain routing protocol connecting different blockchains",
    icon: 'M9 20l-5.447-2.724A1 1 0 013 16.382V5.618a1 1 0 011.447-.894L9 7m0 13l6-3m-6 3V7m6 10l4.553 2.276A1 1 0 0021 18.382V7.618a1 1 0 00-.553-.894L15 4m0 13V4m0 0L9 7',
    link: "#"
  },
  {
    id: 4,
    name: 'ecosystem.ten_ecosystems.musd.name',
    description: 'ecosystem.ten_ecosystems.musd.description',
    icon: 'M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z'
    name: locale.value === 'zh' ? "MUSD稳定币" : "MUSD Stablecoin",
    description: locale.value === 'zh' ? "与美元1:1挂钩的去中心化稳定币" : "Decentralized stablecoin pegged 1:1 to USD",
    icon: 'M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z',
    link: "#"
  },
  {
    id: 5,
    name: 'ecosystem.ten_ecosystems.dex.name',
    description: 'ecosystem.ten_ecosystems.dex.description',
    icon: 'M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4'
    name: locale.value === 'zh' ? "WEB3.0彩票" : "WEB3.0 Lottery",
    description: locale.value === 'zh' ? "基于区块链的透明公正彩票系统" : "Transparent and fair blockchain-based lottery system",
    icon: 'M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z',
    link: "#"
  },
  {
    id: 6,
    name: 'ecosystem.ten_ecosystems.bank.name',
    description: 'ecosystem.ten_ecosystems.bank.description',
    icon: 'M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3'
    name: locale.value === 'zh' ? "DEX交易所" : "MOSE DEX",
    description: locale.value === 'zh' ? "低滑点和低费用的去中心化交易所" : "Decentralized exchange with low slippage and fees",
    icon: 'M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4',
    link: "#"
  },
  {
    id: 7,
    name: 'ecosystem.ten_ecosystems.wallet.name',
    description: 'ecosystem.ten_ecosystems.wallet.description',
    icon: 'M17 9V7a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2m2 4h10a2 2 0 002-2v-6a2 2 0 00-2-2H9a2 2 0 00-2 2v6a2 2 0 002 2z'
    name: locale.value === 'zh' ? "MOSE银行" : "MOSE Bank",
    description: locale.value === 'zh' ? "支持多种资产的DeFi借贷平台" : "DeFi lending platform supporting multiple assets",
    icon: 'M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3',
    link: "#"
  },
  {
    id: 8,
    name: 'ecosystem.ten_ecosystems.privacy_tools.name',
    description: 'ecosystem.ten_ecosystems.privacy_tools.description',
    icon: 'M8 11V7a4 4 0 118 0m-4 8v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2z'
    name: locale.value === 'zh' ? "MOSE钱包APP" : "MOSE Wallet",
    description: locale.value === 'zh' ? "安全且用户友好的数字资产钱包" : "Secure and user-friendly digital asset wallet",
    icon: 'M17 9V7a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2m2 4h10a2 2 0 002-2v-6a2 2 0 00-2-2H9a2 2 0 00-2 2v6a2 2 0 002 2z',
    link: "#"
  },
  {
    id: 9,
    name: 'ecosystem.ten_ecosystems.dao.name',
    description: 'ecosystem.ten_ecosystems.dao.description',
    icon: 'M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z'
    name: locale.value === 'zh' ? "反向跨境电商" : "Cross-border E-commerce",
    description: locale.value === 'zh' ? "区块链支持的跨境电子商务平台" : "Blockchain-powered cross-border e-commerce platform",
    icon: 'M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z',
    link: "#"
  },
  {
    id: 10,
    name: 'ecosystem.ten_ecosystems.defi.name',
    description: 'ecosystem.ten_ecosystems.defi.description',
    icon: 'M12 8v13m0-13V6a2 2 0 112 2h-2zm0 0V5.5A2.5 2.5 0 109.5 8H12zm-7 4h14M5 12a2 2 0 110-4h14a2 2 0 110 4M5 12v7a2 2 0 002 2h10a2 2 0 002-2v-7'
    name: locale.value === 'zh' ? "多国法币兑换" : "Multi-currency Exchange",
    description: locale.value === 'zh' ? "支持多国法币与加密货币的兑换平台" : "Platform for exchanging multiple fiat currencies and cryptocurrencies",
    icon: 'M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z',
    link: "#"
  }
 ];
 ]);

 // 十大生态系统项目
 const ecosystems = computed(() => {
  return ecosystemsData.value;
 });
 </script>

 <template>
@ -98,8 +114,8 @@ const ecosystems = [
            </svg>
          </div>
          
          <h3 class="text-lg font-bold text-text mb-2 text-center">{{ t(ecosystem.name) }}</h3>
          <p class="text-text-secondary text-sm text-center">{{ t(ecosystem.description) }}</p>
          <h3 class="text-lg font-bold text-text mb-2 text-center">{{ ecosystem.name }}</h3>
          <p class="text-text-secondary text-sm text-center">{{ ecosystem.description }}</p>
          
          <div class="mt-4 pt-4 border-t border-background-light w-full text-center">
            <span class="inline-block px-3 py-1 bg-primary bg-opacity-10 text-primary-light text-xs rounded-full">
--- a/src/components/home/CoreValuesModule.vue
+++ b/src/components/home/CoreValuesModule.vue
@ -0,0 +1,81 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { computed } from 'vue';

 const { t } = useI18n();

 // 使用计算属性实现响应式语言切换
 const coreValues = computed(() => [
  {
    id: 1,
    icon: '🔒',
    title: t('home.core_values.privacy.title'),
    description: [
      t('home.core_values.privacy.desc1'),
      t('home.core_values.privacy.desc2')
    ]
  },
  {
    id: 2,
    icon: '⛓️',
    title: t('home.core_values.interop.title'),
    description: [
      t('home.core_values.interop.desc1'),
      t('home.core_values.interop.desc2')
    ]
  },
  {
    id: 3,
    icon: '🛡️',
    title: t('home.core_values.compliance.title'),
    description: [
      t('home.core_values.compliance.desc1'),
      t('home.core_values.compliance.desc2')
    ]
  }
 ]);
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-10 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('home.core_values.title') }}
      </h2>
      
      <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
        <div 
          v-for="(value, index) in coreValues" 
          :key="value.id"
          class="bg-background-light rounded-xl p-6 shadow-card hover:transform hover:scale-105 transition-all duration-300 wow animate__animated animate__fadeInUp"
          :class="{
            'animate__delay-xs': index === 1,
            'animate__delay-sm': index === 2
          }"
        >
          <div class="flex flex-col h-full">
            <div class="mb-4">
              <div class="text-4xl mb-3">{{ value.icon }}</div>
              <h3 class="text-xl font-bold text-text mb-2">{{ value.title }}</h3>
            </div>
            
            <div class="flex-grow">
              <ul class="space-y-2">
                <li 
                  v-for="(desc, descIndex) in value.description" 
                  :key="`${value.id}-desc-${descIndex}`"
                  class="text-text-secondary flex items-start"
                >
                  <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                  </svg>
                  <span>{{ desc }}</span>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/home/EventsModule.vue
+++ b/src/components/home/EventsModule.vue
@ -1,41 +1,56 @@
 <script setup lang="ts">
 import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { ref } from 'vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 定义活动数据
 const events = ref([
 // 使用计算属性实现响应式语言切换
 const eventsData = computed(() => [
  {
    id: 1,
    title: 'home.events.consensus_conference.title',
    description: 'home.events.consensus_conference.description',
    date: '2024-09-15',
    location: 'home.events.consensus_conference.location',
    date: "2024-05",
    title: locale.value === 'zh' ? "新加坡共识大会2024" : "Consensus 2024 Singapore",
    description: locale.value === 'zh' ? "隐私技术主题演讲" : "Keynote speech on privacy technology",
    location: "Singapore",
    link: "#",
    icon: 'M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h2a2 2 0 012 2h6a2 2 0 012-2h2a2 2 0 012 2v12a2 2 0 01-2 2z'
  },
  {
    id: 2,
    title: 'home.events.swiss_meeting.title',
    description: 'home.events.swiss_meeting.description',
    date: '2024-11-10',
    location: 'home.events.swiss_meeting.location',
    date: "2024-06",
    title: locale.value === 'zh' ? "东京开发者黑客松" : "Tokyo Developer Hackathon",
    description: locale.value === 'zh' ? "50万美元奖金池" : "$500,000 prize pool",
    location: "Tokyo",
    link: "#",
    icon: 'M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2'
  },
  {
    id: 3,
    title: 'home.events.privacy_summit.title',
    description: 'home.events.privacy_summit.description',
    date: '2024-07-20',
    location: 'home.events.privacy_summit.location',
    icon: 'M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z'
  }
 ]);

 const events = computed(() => {
  return eventsData.value.map(event => ({
    ...event,
    formattedTitle: event.title,
    formattedDescription: event.description,
    formattedLocation: event.location
  }));
 });

 // 格式化日期
 const formatDate = (dateString: string) => {
  const date = new Date(dateString);
  return new Intl.DateTimeFormat('zh-CN', {
  // 处理"2024-05"这种格式，转换为"2024-05-01"以便创建Date对象
  const fullDateString = dateString.length === 7 ? `${dateString}-01` : dateString;
  const date = new Date(fullDateString);
  
  // 如果只有年月，则只显示年月
  if (dateString.length === 7) {
    return new Intl.DateTimeFormat(locale.value === 'zh' ? 'zh-CN' : 'en-US', {
      year: 'numeric',
      month: 'long'
    }).format(date);
  }
  
  // 否则显示完整日期
  return new Intl.DateTimeFormat(locale.value === 'zh' ? 'zh-CN' : 'en-US', {
    year: 'numeric',
    month: 'long',
    day: 'numeric'
@ -77,21 +92,21 @@ const formatDate = (dateString: string) => {
              </div>
            </div>
            
            <h3 class="text-lg font-bold text-text mb-3">{{ t(event.title) }}</h3>
            <h3 class="text-lg font-bold text-text mb-3">{{ event.formattedTitle }}</h3>
            
            <p class="text-text-secondary text-sm mb-4">{{ t(event.description) }}</p>
            <p class="text-text-secondary text-sm mb-4">{{ event.formattedDescription }}</p>
            
            <div class="flex items-center text-xs text-text-secondary">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
              </svg>
              <span>{{ t(event.location) }}</span>
              <span>{{ event.formattedLocation }}</span>
            </div>
          </div>
          
          <div class="bg-background px-6 py-4 border-t border-background-dark">
            <a href="#" class="text-primary-light hover:text-primary-dark text-sm font-medium transition-colors btn-hover-glow inline-block">
            <a :href="event.link" class="text-primary-light hover:text-primary-dark text-sm font-medium transition-colors btn-hover-glow inline-block">
              {{ t('home.events.learn_more') }}
            </a>
          </div>
--- a/src/components/home/MilestoneModule.vue
+++ b/src/components/home/MilestoneModule.vue
@ -2,6 +2,8 @@
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 删除未使用的 milestones 变量，或者在组件中使用它
 </script>

 <template>
--- a/src/components/home/NewsModule.vue
+++ b/src/components/home/NewsModule.vue
@ -0,0 +1,150 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { ref, onMounted, onBeforeUnmount, computed } from 'vue';

 const { t, locale } = useI18n();

 // 使用计算属性实现响应式语言切换
 const news = computed(() => [
  {
    id: 1,
    title: t('home.news.mainnet_launch'),
    date: '2024-03-15'
  },
  {
    id: 2,
    title: t('home.news.mas_license'),
    date: '2024-02-20'
  },
  {
    id: 3,
    title: t('home.news.hackathon'),
    date: '2024-04-10'
  }
 ]);

 // 当前显示的新闻索引
 const currentNewsIndex = ref(0);
 // 自动滚动计时器
 let autoScrollTimer: number | null = null;

 // 显示下一条新闻
 const showNextNews = () => {
  currentNewsIndex.value = (currentNewsIndex.value + 1) % news.value.length;
 };

 // 显示上一条新闻
 const showPrevNews = () => {
  currentNewsIndex.value = (currentNewsIndex.value - 1 + news.value.length) % news.value.length;
 };

 // 开始自动滚动
 const startAutoScroll = () => {
  autoScrollTimer = window.setInterval(() => {
    showNextNews();
  }, 5000); // 每5秒切换一次
 };

 // 停止自动滚动
 const stopAutoScroll = () => {
  if (autoScrollTimer !== null) {
    clearInterval(autoScrollTimer);
    autoScrollTimer = null;
  }
 };

 // 格式化日期
 const formatDate = (dateString: string) => {
  const date = new Date(dateString);
  return new Intl.DateTimeFormat(locale.value === 'zh' ? 'zh-CN' : 'en-US', {
    year: 'numeric',
    month: 'long',
    day: 'numeric'
  }).format(date);
 };

 // 组件挂载时启动自动滚动，卸载时停止
 onMounted(() => {
  startAutoScroll();
 });

 onBeforeUnmount(() => {
  stopAutoScroll();
 });
 </script>

 <template>
  <section class="py-8 px-6 md:px-12 lg:px-24 bg-primary bg-opacity-10">
    <div class="container mx-auto">
      <div class="flex flex-col md:flex-row items-center justify-between">
        <div class="flex items-center mb-4 md:mb-0">
          <div class="w-10 h-10 rounded-full bg-primary bg-opacity-20 flex items-center justify-center mr-3">
            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light" fill="none" viewBox="0 0 24 24" stroke="currentColor">
              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z" />
            </svg>
          </div>
          <h2 class="text-xl font-bold text-text">{{ t('home.news.title') }}</h2>
        </div>
        
        <div class="flex-grow mx-4 relative overflow-hidden h-10">
          <transition-group 
            name="news-slide" 
            tag="div" 
            class="absolute w-full"
          >
            <div 
              v-for="(item, index) in news" 
              :key="item.id"
              v-show="index === currentNewsIndex"
              class="flex items-center justify-between w-full"
            >
              <span class="text-text-secondary">{{ formatDate(item.date) }}</span>
              <span class="text-text font-medium">{{ item.title }}</span>
            </div>
          </transition-group>
        </div>
        
        <div class="flex items-center space-x-2">
          <button 
            @click="showPrevNews"
            @mouseenter="stopAutoScroll"
            @mouseleave="startAutoScroll"
            class="w-8 h-8 rounded-full bg-background flex items-center justify-center hover:bg-primary hover:bg-opacity-20 transition-colors"
          >
            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-text-secondary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
            </svg>
          </button>
          
          <button 
            @click="showNextNews"
            @mouseenter="stopAutoScroll"
            @mouseleave="startAutoScroll"
            class="w-8 h-8 rounded-full bg-background flex items-center justify-center hover:bg-primary hover:bg-opacity-20 transition-colors"
          >
            <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-text-secondary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
            </svg>
          </button>
        </div>
      </div>
    </div>
  </section>
 </template>

 <style scoped>
 .news-slide-enter-active,
 .news-slide-leave-active {
  transition: all 0.5s ease;
 }

 .news-slide-enter-from {
  transform: translateY(20px);
  opacity: 0;
 }

 .news-slide-leave-to {
  transform: translateY(-20px);
  opacity: 0;
 }
 </style> 
--- a/src/components/home/PartnersModule.vue
+++ b/src/components/home/PartnersModule.vue
@ -0,0 +1,77 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 合作伙伴数据
 const partners = [
  {
    id: 1,
    name: 'Partner 1',
    logo: '/public/LOGO.png', // 使用默认图片，实际项目中应替换为实际logo
    url: 'https://partner1.com'
  },
  {
    id: 2,
    name: 'Partner 2',
    logo: '/public/LOGO.png',
    url: 'https://partner2.com'
  },
  {
    id: 3,
    name: 'Partner 3',
    logo: '/public/LOGO.png',
    url: 'https://partner3.com'
  },
  {
    id: 4,
    name: 'Partner 4',
    logo: '/public/LOGO.png',
    url: 'https://partner4.com'
  },
  {
    id: 5,
    name: 'Partner 5',
    logo: '/public/LOGO.png',
    url: 'https://partner5.com'
  },
  {
    id: 6,
    name: 'Partner 6',
    logo: '/public/LOGO.png',
    url: 'https://partner6.com'
  }
 ];
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-10 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('home.partners.title') }}
      </h2>
      
      <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6 wow animate__animated animate__fadeIn animate__delay-xs">
        <a 
          v-for="partner in partners" 
          :key="partner.id"
          :href="partner.url"
          target="_blank"
          rel="noopener noreferrer"
          class="bg-background-light rounded-xl p-6 flex items-center justify-center hover:shadow-lg transition-all duration-300 hover:transform hover:scale-105"
        >
          <div class="flex flex-col items-center">
            <img :src="partner.logo" :alt="partner.name" class="max-h-12 max-w-full mb-3" />
            <span class="text-text-secondary text-sm text-center">{{ partner.name }}</span>
          </div>
        </a>
      </div>
      
      <div class="text-center mt-8">
        <p class="text-text-secondary italic wow animate__animated animate__fadeIn animate__delay-sm">
          {{ t('home.partners.subtitle') }}
        </p>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/home/ProjectIntroModule.vue
+++ b/src/components/home/ProjectIntroModule.vue
@ -0,0 +1,60 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
    <div class="container mx-auto">
      <div class="max-w-4xl mx-auto bg-background p-8 md:p-10 rounded-2xl shadow-card relative overflow-hidden wow animate__animated animate__fadeIn animate__duration-normal">
        <div class="relative z-10">
          <h2 class="text-2xl md:text-3xl font-bold text-text mb-6 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
            {{ t('home.project_intro.title') }}
          </h2>
          
          <div class="prose prose-invert max-w-none text-text-secondary">
            <p class="mb-4 text-lg leading-relaxed wow animate__animated animate__fadeIn animate__delay-xs">
              {{ t('home.project_intro.description') }}
            </p>
            
            <div class="flex flex-col md:flex-row items-center justify-center gap-4 mt-8 wow animate__animated animate__fadeIn animate__delay-sm">
              <div class="flex items-center bg-background-dark px-4 py-2 rounded-lg">
                <div class="w-10 h-10 rounded-full bg-primary bg-opacity-20 flex items-center justify-center mr-3">
                  <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
                  </svg>
                </div>
                <span class="text-text">{{ t('home.project_intro.global_presence') }}</span>
              </div>
              
              <div class="flex items-center bg-background-dark px-4 py-2 rounded-lg">
                <div class="w-10 h-10 rounded-full bg-secondary bg-opacity-20 flex items-center justify-center mr-3">
                  <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-secondary" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
                  </svg>
                </div>
                <span class="text-text">{{ t('home.project_intro.security_focus') }}</span>
              </div>
              
              <div class="flex items-center bg-background-dark px-4 py-2 rounded-lg">
                <div class="w-10 h-10 rounded-full bg-accent bg-opacity-20 flex items-center justify-center mr-3">
                  <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-accent" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
                  </svg>
                </div>
                <span class="text-text">{{ t('home.project_intro.innovation') }}</span>
              </div>
            </div>
          </div>
        </div>
        
        <!-- 背景装饰 -->
        <div class="absolute top-0 left-0 w-full h-full overflow-hidden opacity-5">
          <div class="absolute top-1/3 right-1/4 w-64 h-64 rounded-full bg-primary-light blur-3xl"></div>
          <div class="absolute bottom-1/3 left-1/4 w-64 h-64 rounded-full bg-secondary blur-3xl"></div>
        </div>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/layout/Footer.vue
+++ b/src/components/layout/Footer.vue
@ -23,7 +23,7 @@ const currentYear = new Date().getFullYear();
        <!-- Logo & Description -->
        <div class="wow animate__animated animate__fadeIn animate__duration-fast">
          <div class="flex items-center mb-4">
            <img src="/public/vite.svg" alt="MOSE Logo" class="h-8 w-auto mr-2" />
            <img src="/public/LOGO.png" alt="MOSE Logo" class="h-8 w-auto mr-2" />
            <span class="text-xl font-bold text-primary-light">MOSE</span>
          </div>
          <p class="text-sm mb-6">
--- a/src/components/layout/NavBar.vue
+++ b/src/components/layout/NavBar.vue
@ -44,7 +44,7 @@ const emit = defineEmits(['changeLanguage']);
    <div class="container mx-auto flex justify-between items-center">
      <!-- Logo -->
      <router-link to="/" class="flex items-center animate__animated animate__fadeIn animate__duration-fast">
        <img src="/public/vite.svg" alt="MOSE Logo" class="h-8 w-auto mr-2" />
        <img src="/public/LOGO.png" alt="MOSE Logo" class="h-8 w-auto mr-2" />
        <span class="text-xl font-bold text-primary-light">MOSE</span>
      </router-link>

@ -68,6 +68,15 @@ const emit = defineEmits(['changeLanguage']);
          {{ t('nav.ecosystem') }}
        </router-link>
        
        <!-- 技术 -->
        <router-link 
          to="/technology"
          class="text-text-secondary hover:text-text transition-colors duration-200 animate__animated animate__fadeInDown animate__duration-fast animate__delay-sm"
          :class="{ 'text-primary-light font-medium': $route.path === '/technology' }"
        >
          {{ t('nav.technology') }}
        </router-link>
        
        <!-- 关于我们 -->
        <router-link 
          to="/about"
@ -199,6 +208,16 @@ const emit = defineEmits(['changeLanguage']);
          {{ t('nav.ecosystem') }}
        </router-link>
        
        <!-- 技术 -->
        <router-link 
          to="/technology"
          class="text-text-secondary hover:text-text py-2 animate__animated animate__fadeInRight animate__duration-fast animate__delay-sm"
          :class="{ 'text-primary-light font-medium': $route.path === '/technology' }"
          @click="isMenuOpen = false"
        >
          {{ t('nav.technology') }}
        </router-link>
        
        <!-- 关于我们 -->
        <router-link 
          to="/about"
--- a/src/components/rewards/IncentiveModule.vue
+++ b/src/components/rewards/IncentiveModule.vue
@ -1,54 +1,66 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { ref } from 'vue';
 // 移除有问题的导入
 // import MarketDataModule from '@/components/rewards/MarketDataModule.vue';
 import { ref, computed } from 'vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 激励机制数据
 const incentiveModels = ref([
 // 使用计算属性实现响应式语言切换
 const incentiveModelsData = computed(() => [
  {
    id: 'v4',
    name: 'V4',
    amount: 50000,
    features: [
      'incentives.models.v4.feature1',
      'incentives.models.v4.feature2',
      'incentives.models.v4.feature3'
    ],
    id: 1,
    name: locale.value === 'zh' ? "基础混币" : "Basic Mixing",
    amount: 0.3,
    features: locale.value === 'zh' 
      ? ["按交易额收取0.3%费用", "动态风险监控"]
      : ["0.3% fee on transaction amount", "Dynamic risk monitoring"],
    color: 'primary',
    active: true
  },
  {
    id: 'v5',
    name: 'V5',
    amount: 300000,
    features: [
      'incentives.models.v5.feature1',
      'incentives.models.v5.feature2',
      'incentives.models.v5.feature3'
    ],
    id: 2,
    name: locale.value === 'zh' ? "跨链桥" : "Cross-chain Bridge",
    amount: 0.3,
    features: locale.value === 'zh'
      ? ["每笔跨链交易收取0.3%手续费", "手续费+质押双收益"]
      : ["0.3% fee per cross-chain transaction", "Dual income from fees and staking"],
    color: 'secondary',
    active: false
  }
 ]);

 // 激励机制数据
 const incentiveModels = computed(() => incentiveModelsData.value);

 // 选择激励模型
 const selectedModel = ref(incentiveModels.value[0]);
 const selectedModel = ref(incentiveModelsData.value[0]);

 const selectModel = (model: any) => {
  selectedModel.value = model;
  incentiveModels.value.forEach(m => {
    m.active = m.id === model.id;
  // 更新激活状态
  incentiveModelsData.value.forEach(m => {
    if (m.id === model.id) {
      m.active = true;
    } else {
      m.active = false;
    }
  });
 };

 // 恢复市场数据
 const marketData = ref({
  transactionVolume: 120,
  growthRate: 3000,
  securityIncidents: 20
 // 使用映射.txt中的市场数据
 const marketDataRaw = {
  transaction_volume: 5000000,
  growth_rate: 300,
  security_incidents: 2000000000
 };

 // 格式化市场数据
 const marketData = computed(() => {
  return {
    transactionVolume: (marketDataRaw.transaction_volume / 1000000).toFixed(0), // 转换为亿
    growthRate: marketDataRaw.growth_rate,
    securityIncidents: (marketDataRaw.security_incidents / 100000000).toFixed(0), // 转换为亿
    unit: locale.value === 'zh' ? '亿美元' : 'billion USD'
  };
 });
 </script>

@ -71,7 +83,7 @@ const marketData = ref({
          :key="model.id"
          class="bg-background rounded-xl overflow-hidden shadow-card transition-all duration-300 transform hover:scale-105 wow animate__animated animate__fadeInUp"
          :class="[
            model.id === 'v4' ? 'animate__delay-xs' : 'animate__delay-sm',
            model.id === 1 ? 'animate__delay-xs' : 'animate__delay-sm',
            {'ring-2': model.active, [`ring-${model.color}`]: model.active}
          ]"
          @click="selectModel(model)"
@ -82,7 +94,7 @@ const marketData = ref({
                <span :class="`text-${model.color} text-xs font-medium px-2 py-1 rounded-full bg-${model.color} bg-opacity-10`">
                  {{ model.name }}
                </span>
                <h3 class="text-2xl font-bold text-text mt-2">{{ t(`incentives.models.${model.id}.title`) }}</h3>
                <h3 class="text-2xl font-bold text-text mt-2">{{ model.name }}</h3>
              </div>
              <div :class="`w-6 h-6 rounded-full border-2 border-${model.color} flex items-center justify-center`">
                <div 
@ -94,7 +106,7 @@ const marketData = ref({
            
            <div :class="`bg-${model.color} bg-opacity-10 rounded-xl p-6 mb-6 text-center`">
              <p class="text-text-secondary text-sm mb-1">{{ t('incentives.reward_amount') }}</p>
              <p :class="`text-${model.color} text-3xl font-bold`">{{ model.amount.toLocaleString('zh-CN') }} MOSE</p>
              <p :class="`text-${model.color} text-3xl font-bold`">{{ model.amount }}% MOSE</p>
            </div>
            
            <ul class="space-y-3">
@ -106,7 +118,7 @@ const marketData = ref({
                <svg xmlns="http://www.w3.org/2000/svg" :class="`h-5 w-5 text-${model.color} mr-2 mt-0.5 flex-shrink-0`" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t(feature) }}</span>
                <span class="text-text-secondary">{{ feature }}</span>
              </li>
            </ul>
          </div>
@ -119,7 +131,7 @@ const marketData = ref({
        </div>
      </div>
      
      <!-- 恢复市场数据展示 -->
      <!-- 市场数据展示 -->
      <div class="bg-background rounded-xl overflow-hidden shadow-card wow animate__animated animate__fadeIn animate__delay-md">
        <div class="p-6">
          <h3 class="text-xl font-bold text-text mb-6">{{ t('incentives.market_data.title') }}</h3>
@ -133,7 +145,7 @@ const marketData = ref({
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
                </svg>
              </div>
              <p class="text-2xl font-bold text-text">{{ marketData.transactionVolume }}亿美元</p>
              <p class="text-2xl font-bold text-text">{{ marketData.transactionVolume }} {{ marketData.unit }}</p>
              <p class="text-text-secondary text-sm mt-2">{{ t('incentives.market_data.transaction_subtitle') }}</p>
            </div>
            
@ -157,7 +169,7 @@ const marketData = ref({
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
                </svg>
              </div>
              <p class="text-2xl font-bold text-accent">{{ marketData.securityIncidents }}亿美元</p>
              <p class="text-2xl font-bold text-accent">{{ marketData.securityIncidents }} {{ marketData.unit }}</p>
              <p class="text-text-secondary text-sm mt-2">{{ t('incentives.market_data.security_subtitle') }}</p>
            </div>
          </div>
--- a/src/components/rewards/MarketDataModule.vue
+++ b/src/components/rewards/MarketDataModule.vue
@ -1,14 +1,31 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import { computed } from 'vue';

 const { t } = useI18n();

 // 使用映射.txt中的市场数据
 const marketDataRaw = {
  transaction_volume: 5000000,
  growth_rate: 300,
  security_incidents: 2000000000
 };

 // 格式化市场数据
 const formattedMarketData = computed(() => {
  return {
    transactionVolume: (marketDataRaw.transaction_volume / 1000000).toFixed(0), // 转换为亿
    growthRate: marketDataRaw.growth_rate,
    securityIncidents: (marketDataRaw.security_incidents / 100000000).toFixed(0) // 转换为亿
  };
 });

 // 市场数据
 const marketData = [
 const marketData = computed(() => [
  {
    id: 1,
    title: t('incentives.market_data.transaction_volume'),
    value: '120亿美元',
    value: `${formattedMarketData.value.transactionVolume}亿美元`,
    icon: 'M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2-3 .895-3 2 1.343 2 3 2',
    description: t('incentives.market_data.transaction_subtitle'),
    isActive: true,
@ -16,7 +33,7 @@ const marketData = [
  {
    id: 2,
    title: t('incentives.market_data.growth_rate'),
    value: '3000%',
    value: `${formattedMarketData.value.growthRate}%`,
    icon: 'M7 11l5-5m0 0l5 5m-5-5v12',
    description: t('incentives.market_data.growth_subtitle'),
    isActive: true,
@ -24,15 +41,15 @@ const marketData = [
  {
    id: 3,
    title: t('incentives.market_data.security_incidents'),
    value: '20亿美元',
    value: `${formattedMarketData.value.securityIncidents}亿美元`,
    icon: 'M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z',
    description: t('incentives.market_data.security_subtitle'),
    isActive: true,
  }
 ];
 ]);

 // 过滤出激活的数据
 const activeMarketData = marketData.filter(item => item.isActive);
 const activeMarketData = computed(() => marketData.value.filter(item => item.isActive));
 </script>

 <template>
--- a/src/components/rewards/RewardModule.vue
+++ b/src/components/rewards/RewardModule.vue
@ -1,66 +1,68 @@
 <script setup lang="ts">
 import { onMounted, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { ref, onMounted } from 'vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 模拟数据
 const totalAddresses = ref(1000000);
 const airdropAddresses = ref(100000);
 const airdropAmount = ref(50);

 // 销毁数据（整合自TokenBurnModule）
 // eslint-disable-next-line
 const burnData = {
  targetSupply: '10,000,000', // 目标供应量（1000万）
  totalBurned: '290,000,000', // 总销毁量（2.9亿）
  initialSupply: '300,000,000', // 初始供应量（3亿）
  burnPercentage: '96.7%' // 销毁比例
 // 使用映射.txt中的空投数据
 const airdropData = {
  total_addresses: 100000,
  eligible_addresses: 100000,
  tokens_per_address: 50,
  rules: {
    en: [
      "Daily release of 1%",
      "Rewards stop when holdings < 100 MOSE",
      "Unclaimed rewards expire after 15 days"
    ],
    zh: [
      "每日释放1%",
      "持币少于100枚时停止释放",
      "15日内未完成≥100枚闪兑则销毁"
    ]
  }
 };

 // 销毁里程碑
 // eslint-disable-next-line
 const burnMilestones = [
  {
    id: 1,
    date: '2022-Q1',
    amount: '50,000,000',
    description: t('rewards.tokenBurn.milestones.first'),
    completed: true,
  },
  {
    id: 2,
    date: '2022-Q3',
    amount: '75,000,000',
    description: t('rewards.tokenBurn.milestones.second'),
    completed: true,
  },
  {
    id: 3,
    date: '2023-Q1',
    amount: '80,000,000',
    description: t('rewards.tokenBurn.milestones.third'),
    completed: true,
  },
  {
    id: 4,
    date: '2023-Q4',
    amount: '85,000,000',
    description: t('rewards.tokenBurn.milestones.fourth'),
    completed: true,
  },
  {
    id: 5,
    date: '2024-Q2',
    amount: '10,000,000',
    description: t('rewards.tokenBurn.milestones.fifth'),
    completed: false,
 // 使用映射.txt中的代币销毁数据
 const tokenBurnData = {
  current_burned: 210000000,
  target_burned: 290000000,
  burn_percentage: 72.41,
  stop_threshold: 10000000,
  mechanism: {
    en: "100% of cross-chain and mixing fees burned",
    zh: "跨链与混币手续费100%销毁"
  }
 ];
 };

 // 计算属性
 const totalAddresses = computed(() => airdropData.total_addresses);
 const airdropAddresses = computed(() => airdropData.eligible_addresses);
 const airdropAmount = computed(() => airdropData.tokens_per_address);

 // 获取当前语言的规则
 const airdropRules = computed(() => {
  return locale.value === 'zh' ? airdropData.rules.zh : airdropData.rules.en;
 });

 // 获取当前语言的销毁机制描述
 const burnMechanism = computed(() => {
  return locale.value === 'zh' ? tokenBurnData.mechanism.zh : tokenBurnData.mechanism.en;
 });

 // 计算销毁百分比的显示值
 const displayBurnPercentage = computed(() => {
  return tokenBurnData.burn_percentage.toFixed(2);
 });

 // 计算进度条宽度
 const burnProgressWidth = computed(() => {
  return `${(tokenBurnData.current_burned / 300000000) * 100}%`;
 });

 // 用于展示目的，我们在控制台输出这些变量
 onMounted(() => {
  console.log('Burn data and milestones prepared for future usage:', burnData, burnMilestones);
  console.log('Airdrop and burn data prepared for future usage:', airdropData, tokenBurnData);
 });
 </script>

@ -95,11 +97,11 @@ onMounted(() => {
            <div class="grid grid-cols-2 gap-4 mb-6">
              <div class="bg-background-dark p-4 rounded-lg text-center">
                <p class="text-text-secondary text-sm mb-1">{{ t('rewards.airdrop.total_addresses') }}</p>
                <p class="text-text text-2xl font-bold">{{ totalAddresses.toLocaleString('zh-CN') }}</p>
                <p class="text-text text-2xl font-bold">{{ totalAddresses.toLocaleString(locale) }}</p>
              </div>
              <div class="bg-background-dark p-4 rounded-lg text-center">
                <p class="text-text-secondary text-sm mb-1">{{ t('rewards.airdrop.eligible_addresses') }}</p>
                <p class="text-text text-2xl font-bold">{{ airdropAddresses.toLocaleString('zh-CN') }}</p>
                <p class="text-text text-2xl font-bold">{{ airdropAddresses.toLocaleString(locale) }}</p>
              </div>
            </div>
            
@ -112,23 +114,11 @@ onMounted(() => {
          <div class="bg-background-dark p-6">
            <h4 class="text-lg font-bold text-text mb-4">{{ t('rewards.airdrop.rules.title') }}</h4>
            <ul class="space-y-3">
              <li class="flex items-start">
              <li v-for="(rule, index) in airdropRules" :key="index" class="flex items-start">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.airdrop.rules.daily_release') }}</span>
              </li>
              <li class="flex items-start">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.airdrop.rules.min_holding') }}</span>
              </li>
              <li class="flex items-start">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-primary-light mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.airdrop.rules.flash_swap') }}</span>
                <span class="text-text-secondary">{{ rule }}</span>
              </li>
            </ul>
          </div>
@ -152,7 +142,7 @@ onMounted(() => {
            <div class="relative pt-2 pb-8">
              <!-- 进度条 -->
              <div class="h-6 bg-background-dark rounded-full overflow-hidden">
                <div class="h-full bg-gradient-to-r from-accent to-accent-light rounded-full" style="width: 96.7%;"></div>
                <div class="h-full bg-gradient-to-r from-accent to-accent-light rounded-full" :style="{ width: burnProgressWidth }"></div>
              </div>
              
              <!-- 标签 -->
@ -165,11 +155,11 @@ onMounted(() => {
              <div class="absolute bottom-0 left-0 right-0 flex justify-between items-center">
                <div class="flex flex-col items-start">
                  <span class="text-text-secondary text-xs">{{ t('rewards.burn.current') }}</span>
                  <span class="text-accent font-bold">29,000,000 MOSE</span>
                  <span class="text-accent font-bold">{{ tokenBurnData.current_burned.toLocaleString(locale) }} MOSE</span>
                </div>
                <div class="flex flex-col items-end">
                  <span class="text-text-secondary text-xs">{{ t('rewards.burn.target') }}</span>
                  <span class="text-text font-bold">290,000,000 MOSE</span>
                  <span class="text-text font-bold">{{ tokenBurnData.target_burned.toLocaleString(locale) }} MOSE</span>
                </div>
              </div>
            </div>
@ -177,11 +167,11 @@ onMounted(() => {
            <div class="grid grid-cols-2 gap-4 mt-6">
              <div class="bg-background-dark p-4 rounded-lg text-center">
                <p class="text-text-secondary text-sm mb-1">{{ t('rewards.burn.percentage') }}</p>
                <p class="text-accent text-2xl font-bold">100%</p>
                <p class="text-accent text-2xl font-bold">{{ displayBurnPercentage }}%</p>
              </div>
              <div class="bg-background-dark p-4 rounded-lg text-center">
                <p class="text-text-secondary text-sm mb-1">{{ t('rewards.burn.stop_threshold') }}</p>
                <p class="text-text text-2xl font-bold">10,000,000</p>
                <p class="text-text text-2xl font-bold">{{ tokenBurnData.stop_threshold.toLocaleString(locale) }}</p>
              </div>
            </div>
          </div>
@ -193,19 +183,7 @@ onMounted(() => {
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-accent mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.burn.mechanism.fee_burn') }}</span>
              </li>
              <li class="flex items-start">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-accent mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.burn.mechanism.stop_condition') }}</span>
              </li>
              <li class="flex items-start">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-accent mr-2 mt-0.5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                </svg>
                <span class="text-text-secondary">{{ t('rewards.burn.mechanism.compound_growth') }}</span>
                <span class="text-text-secondary">{{ burnMechanism }}</span>
              </li>
            </ul>
          </div>
--- a/src/components/technology/ArchitectureModule.vue
+++ b/src/components/technology/ArchitectureModule.vue
@ -0,0 +1,144 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 架构层级数据
 const architectureLayers = [
  {
    id: 'aggregation',
    icon: '🔄',
    title: t('technology.architecture.aggregation.title'),
    description: t('technology.architecture.aggregation.description'),
    features: [
      t('technology.architecture.aggregation.features.0'),
      t('technology.architecture.aggregation.features.1'),
      t('technology.architecture.aggregation.features.2')
    ]
  },
  {
    id: 'crosschain',
    icon: '🔗',
    title: t('technology.architecture.crosschain.title'),
    description: t('technology.architecture.crosschain.description'),
    features: [
      t('technology.architecture.crosschain.features.0'),
      t('technology.architecture.crosschain.features.1'),
      t('technology.architecture.crosschain.features.2')
    ]
  },
  {
    id: 'routing',
    icon: '🧭',
    title: t('technology.architecture.routing.title'),
    description: t('technology.architecture.routing.description'),
    features: [
      t('technology.architecture.routing.features.0'),
      t('technology.architecture.routing.features.1'),
      t('technology.architecture.routing.features.2')
    ]
  },
  {
    id: 'application',
    icon: '🛠️',
    title: t('technology.architecture.application.title'),
    description: t('technology.architecture.application.description'),
    features: [
      t('technology.architecture.application.features.0'),
      t('technology.architecture.application.features.1'),
      t('technology.architecture.application.features.2')
    ]
  }
 ];
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-6 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('technology.architecture.title') }}
      </h2>
      
      <p class="max-w-3xl mx-auto text-center text-text-secondary mb-12 wow animate__animated animate__fadeIn animate__delay-xs animate__duration-fast">
        {{ t('technology.architecture.subtitle') }}
      </p>
      
      <!-- 架构图示 - 桌面端 -->
      <div class="hidden md:block mb-12 relative">
        <!-- 连接线条 -->
        <div class="absolute top-1/2 left-0 w-full h-1 bg-primary-light opacity-50 transform -translate-y-1/2 z-0"></div>
        
        <!-- 架构层级 -->
        <div class="flex justify-between relative z-10">
          <div 
            v-for="(layer, index) in architectureLayers" 
            :key="layer.id"
            class="w-1/4 px-4 wow animate__animated animate__fadeIn animate__duration-fast"
            :class="{
              'animate__delay-xs': index === 1,
              'animate__delay-sm': index === 2,
              'animate__delay-md': index === 3
            }"
          >
            <div class="bg-background-light rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 h-full relative">
              <!-- 顶部装饰圆点 -->
              <div class="absolute top-0 left-1/2 w-8 h-8 rounded-full bg-primary flex items-center justify-center transform -translate-x-1/2 -translate-y-1/2 text-xl">
                <span>{{ layer.icon }}</span>
              </div>
              
              <h3 class="text-xl font-bold text-text mb-4 text-center pt-2">{{ layer.title }}</h3>
              <p class="text-text-secondary text-center mb-4">{{ layer.description }}</p>
              
              <!-- 特点列表 -->
              <ul class="space-y-2">
                <li 
                  v-for="(feature, featureIndex) in layer.features" 
                  :key="`${layer.id}-feature-${featureIndex}`"
                  class="flex items-center"
                >
                  <span class="h-2 w-2 rounded-full bg-primary-light mr-2"></span>
                  <span>{{ feature }}</span>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      
      <!-- 架构图示 - 移动端 -->
      <div class="md:hidden space-y-6">
        <div 
          v-for="(layer, index) in architectureLayers" 
          :key="`mobile-${layer.id}`"
          class="bg-background-light rounded-xl p-6 shadow-card wow animate__animated animate__fadeInUp animate__duration-fast"
          :class="{
            'animate__delay-xs': index === 1,
            'animate__delay-sm': index === 2,
            'animate__delay-md': index === 3
          }"
        >
          <div class="flex items-center mb-4">
            <div class="w-10 h-10 rounded-full bg-primary flex items-center justify-center text-xl mr-4">
              <span>{{ layer.icon }}</span>
            </div>
            <h3 class="text-xl font-bold text-text">{{ layer.title }}</h3>
          </div>
          
          <p class="text-text-secondary mb-4">{{ layer.description }}</p>
          
          <!-- 特点列表 -->
          <ul class="space-y-2">
            <li 
              v-for="(feature, featureIndex) in layer.features" 
              :key="`${layer.id}-mobile-feature-${featureIndex}`"
              class="flex items-center"
            >
              <span class="h-2 w-2 rounded-full bg-primary-light mr-2"></span>
              <span>{{ feature }}</span>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/technology/EcosystemIntegrationModule.vue
+++ b/src/components/technology/EcosystemIntegrationModule.vue
@ -0,0 +1,95 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 集成场景
 const integrationScenarios = [
  {
    id: 1,
    icon: '💱',
    name: 'MOSE DEX',
    description: t('ecosystem.ten_ecosystems.dex.description')
  },
  {
    id: 2,
    icon: '🖼️',
    name: 'NFT',
    description: t('projects.mose_nft')
  },
  {
    id: 3,
    icon: '🏦',
    name: t('ecosystem.ten_ecosystems.bank.name'),
    description: t('ecosystem.ten_ecosystems.bank.description')
  },
  {
    id: 4,
    icon: '👛',
    name: t('ecosystem.ten_ecosystems.wallet.name'),
    description: t('ecosystem.ten_ecosystems.wallet.description')
  },
  {
    id: 5,
    icon: '🔒',
    name: t('ecosystem.ten_ecosystems.privacy_tools.name'),
    description: t('ecosystem.ten_ecosystems.privacy_tools.description')
  },
  {
    id: 6,
    icon: '🤝',
    name: t('ecosystem.ten_ecosystems.dao.name'),
    description: t('ecosystem.ten_ecosystems.dao.description')
  }
 ];
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-6 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('technology.ecosystem_integration.title') }}
      </h2>
      
      <p class="max-w-3xl mx-auto text-center text-text-secondary mb-12 wow animate__animated animate__fadeIn animate__delay-xs animate__duration-fast">
        {{ t('technology.ecosystem_integration.subtitle') }}
      </p>
      
      <!-- 整合描述 -->
      <div class="bg-primary bg-opacity-5 rounded-2xl p-8 mb-12 wow animate__animated animate__fadeIn animate__duration-fast">
        <p class="text-text-secondary text-center">
          {{ t('technology.ecosystem_integration.description') }}
        </p>
      </div>
      
      <!-- 集成场景网格 -->
      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
        <div 
          v-for="(scenario, index) in integrationScenarios" 
          :key="scenario.id"
          class="bg-background-light rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 wow animate__animated animate__fadeInUp animate__duration-fast"
          :class="{
            'animate__delay-xs': index % 3 === 1,
            'animate__delay-sm': index % 3 === 2
          }"
        >
          <div class="flex flex-col items-center text-center">
            <div class="text-4xl mb-4">{{ scenario.icon }}</div>
            <h3 class="text-xl font-bold text-text mb-2">{{ scenario.name }}</h3>
            <p class="text-text-secondary">{{ scenario.description }}</p>
          </div>
        </div>
      </div>
      
      <!-- 行动号召 -->
      <div class="mt-12 text-center wow animate__animated animate__fadeIn animate__delay-md animate__duration-fast">
        <router-link 
          to="/ecosystem" 
          class="inline-block bg-primary hover:bg-primary-dark text-white font-medium py-3 px-6 rounded-lg transition-colors duration-200"
        >
          {{ t('common.learnMore') }}
        </router-link>
      </div>
    </div>
  </section>
 </template> 
--- a/src/components/technology/InnovationModule.vue
+++ b/src/components/technology/InnovationModule.vue
@ -0,0 +1,83 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';

 const { t } = useI18n();

 // 核心创新数据
 const innovations = [
  {
    id: 'interoperability',
    icon: '🚀',
    title: t('technology.innovation.interoperability.title'),
    description: t('technology.innovation.interoperability.description'),
    detail: t('technology.innovation.interoperability.detail')
  },
  {
    id: 'compatibility',
    icon: '🌐',
    title: t('technology.innovation.compatibility.title'),
    description: t('technology.innovation.compatibility.description'),
    detail: t('technology.innovation.compatibility.detail')
  },
  {
    id: 'encryption',
    icon: '🔐',
    title: t('technology.innovation.encryption.title'),
    description: t('technology.innovation.encryption.description'),
    detail: t('technology.innovation.encryption.detail')
  },
  {
    id: 'communication',
    icon: '⚡',
    title: t('technology.innovation.communication.title'),
    description: t('technology.innovation.communication.description'),
    detail: t('technology.innovation.communication.detail')
  }
 ];
 </script>

 <template>
  <section class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
    <div class="container mx-auto">
      <h2 class="text-2xl md:text-3xl font-bold text-text mb-6 text-center wow animate__animated animate__fadeInUp animate__duration-fast">
        {{ t('technology.innovation.title') }}
      </h2>
      
      <p class="max-w-3xl mx-auto text-center text-text-secondary mb-12 wow animate__animated animate__fadeIn animate__delay-xs animate__duration-fast">
        {{ t('technology.innovation.subtitle') }}
      </p>
      
      <!-- 核心创新卡片 -->
      <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
        <div 
          v-for="(innovation, index) in innovations" 
          :key="innovation.id"
          class="bg-background rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 overflow-hidden wow animate__animated animate__fadeIn animate__duration-fast"
          :class="{
            'animate__delay-xs': index === 1,
            'animate__delay-sm': index === 2,
            'animate__delay-md': index === 3
          }"
        >
          <!-- 图标 -->
          <div class="flex items-center mb-4">
            <div class="w-10 h-10 rounded-full bg-primary bg-opacity-20 flex items-center justify-center text-2xl mr-4">
              <span>{{ innovation.icon }}</span>
            </div>
            <h3 class="text-xl font-bold text-text">{{ innovation.title }}</h3>
          </div>
          
          <!-- 简述 -->
          <div class="mb-4 inline-block bg-primary bg-opacity-10 rounded-full px-4 py-1 text-sm text-primary-light font-medium">
            {{ innovation.description }}
          </div>
          
          <!-- 详情 -->
          <p class="text-text-secondary">
            {{ innovation.detail }}
          </p>
        </div>
      </div>
    </div>
  </section>
 </template> 
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@ -2,6 +2,7 @@
  "nav": {
    "home": "Home",
    "ecosystem": "Ecosystem",
    "technology": "Technology",
    "about": "About Us",
    "resources": "Resources",
    "community": "Community",
@ -216,6 +217,41 @@
      "explore": "Explore Ecosystem",
      "docs": "Documentation"
    },
    "core_values": {
      "title": "Core Values",
      "privacy": {
        "title": "Privacy Protection",
        "desc1": "Zero-knowledge proof anonymous transactions",
        "desc2": "Anonymous atomic swap technology"
      },
      "interop": {
        "title": "Cross-chain Interoperability",
        "desc1": "Support for 12+ mainstream blockchains",
        "desc2": "Ethereum/Cosmos/Polkadot ecosystems"
      },
      "compliance": {
        "title": "Regulatory Compliance",
        "desc1": "Singapore MAS sandbox license",
        "desc2": "Dynamic routing to avoid high-risk nodes"
      }
    },
    "project_intro": {
      "title": "Project Introduction",
      "description": "Incubated by the Swiss Crypto Foundation, Singapore Digital Finance Alliance and others, MOSE focuses on cross-chain privacy technology research and development, providing decentralized privacy infrastructure for Web3. Global presence: Singapore headquarters with ten ecosystem hubs serving North America, Europe, Asia-Pacific and other core regions.",
      "global_presence": "Global Presence",
      "security_focus": "Security & Compliance",
      "innovation": "Technical Innovation"
    },
    "partners": {
      "title": "Partners",
      "subtitle": "Collaborating with industry leaders to advance blockchain technology"
    },
    "news": {
      "title": "Latest News",
      "mainnet_launch": "Mainnet V1.0 launch, daily transaction volume exceeds $100M",
      "mas_license": "Obtained Singapore MAS sandbox license",
      "hackathon": "Tokyo Developer Hackathon ($500K prize pool)"
    },
    "milestone": {
      "title": "Development Milestones",
      "july_2026": {
@ -392,6 +428,26 @@
      "mainnet_desc": "Released the beta version of our mainnet with improved performance and security.",
      "growth": "Ecosystem Growth",
      "growth_desc": "Expanded our ecosystem with various projects and partnerships."
    },
    "partners": {
      "title": "Our Partners",
      "technology_title": "Technology Partners",
      "investors_title": "Investors",
      "compliance_title": "Compliance Support",
      "technology": {
        "aleo": "Zero-Knowledge Proof Technology Provider",
        "starkware": "Scalability Solutions Provider",
        "layerzero": "Cross-chain Protocol Development Partner",
        "axelar": "Secure Cross-chain Communication Platform"
      },
      "investors": {
        "binance": "Leading cryptocurrency exchange investment arm",
        "polychain": "Valued at $300M, focused on blockchain tech investments"
      },
      "compliance": {
        "mas": "Monetary Authority of Singapore, providing regulatory sandbox",
        "finma": "Swiss Financial Market Supervisory Authority, compliance advisor"
      }
    }
  },
  "projects": {
@ -438,49 +494,70 @@
  },
  "community": {
    "hero": {
      "title": "MOSE Community",
      "subtitle": "Join our vibrant community and help build the future of blockchain"
      "title": "Community",
      "subtitle": "Join our vibrant community and stay connected with the latest updates and events"
    },
    "join": {
      "title": "Join Our Community",
      "subtitle": "Connect and learn with developers, users, and enthusiasts from around the world"
    },
    "channels": {
      "title": "Community Channels",
      "discord": {
        "title": "Discord",
        "description": "Join our Discord server for real-time discussions with developers and community members",
        "button": "Join Discord"
      },
      "telegram": {
        "title": "Telegram",
        "description": "Get the latest news and announcements through our Telegram channel",
        "button": "Join Telegram"
      },
      "twitter": {
        "title": "Twitter",
        "description": "Follow us on Twitter for updates and industry insights",
        "button": "Follow on Twitter"
      },
      "forum": {
        "title": "Forum",
        "description": "Participate in in-depth discussions, share ideas, and make proposals",
        "button": "Visit Forum"
    "social_media": {
      "title": "Social Media Wall",
      "official_post": "Official Post"
    },
    "forum": {
      "title": "Forum Entry",
      "description": "This is the official forum area. Only official teams can post topics, users can browse and comment.",
      "comments": "Comments",
      "no_comments": "No comments yet. Be the first to comment!",
      "username": "Username",
      "comment": "Comment",
      "cancel": "Cancel",
      "submit": "Submit",
      "view_comments": "View Comments",
      "topics": "Topics",
      "add_comment": "Add Comment"
    },
    "announcements": {
      "title": "Information Announcement",
      "awards_title": "Latest Award Announcements"
    },
    "highlights": {
      "title": "Community Highlights",
      "ugc_title": "UGC Content Showcase"
    },
    "time": {
      "today": "Today",
      "yesterday": "Yesterday",
      "days_ago": "{days} days ago"
    },
    "posts": {
      "mainnet_launch": {
        "title": "MOSE Mainnet Launch Plan",
        "content": "We are pleased to announce that the MOSE mainnet is scheduled for official launch in July 2026. Before then, we will release multiple testnet versions and welcome community members to participate in testing."
      },
      "singapore_license": {
        "title": "Singapore Regulatory Sandbox License Approved",
        "content": "We are honored to announce that the MOSE project has obtained a regulatory sandbox license from the Monetary Authority of Singapore (MAS), which is an important step towards compliance."
      },
      "tokyo_hackathon": {
        "title": "Tokyo Developer Hackathon Announcement",
        "content": "We will host the Tokyo Developer Hackathon in November 2024, with a total prize pool of $500,000. The event will focus on innovative applications of privacy computing and cross-chain solutions."
      }
    },
    "rewards": {
      "daily_contest": "Daily Contest TOP10 (1st place: 500 MOSE)",
      "weekly_whale": "Weekly Whale Rewards (V5 level: 300,000 MOSE)"
    },
    "events": {
      "title": "Community Events",
      "upcoming": "Upcoming Events",
      "past": "Past Events",
      "virtual": "Virtual",
      "inperson": "In-person",
      "register": "Register",
      "watch": "Watch Recording"
    },
    "contributors": {
      "title": "Community Contributors",
      "description": "Thank you to all the community members who have contributed to the MOSE ecosystem",
      "become": "Become a Contributor"
      "singapore_conference": "Singapore Consensus Conference 2024 Keynote",
      "dubai_summit": "Dubai RegTech Summit Roundtable",
      "tokyo_hackathon": "Tokyo Developer Hackathon"
    },
    "messages": {
      "progress": "The project is progressing very quickly, looking forward to the mainnet launch!",
      "team": "The team is very professional, and the technical documentation is detailed"
    },
    "comments": {
      "great": "Great! Can't wait to try the mainnet!",
      "testnet": "When will the testnet be open?",
      "congrats": "Congratulations! This is very important for the future development of the project."
    }
  },
  "faq": {
@ -552,5 +629,80 @@
    "cancel": "Cancel",
    "back": "Back",
    "next": "Next"
  },
  "technology": {
    "hero": {
      "title": "Technology Architecture",
      "subtitle": "Explore MOSE's cutting-edge technology and innovations"
    },
    "architecture": {
      "title": "Four-Layer Architecture",
      "subtitle": "MOSE employs an advanced four-layer architecture design to provide powerful support for various application scenarios",
      "aggregation": {
        "title": "Aggregation Layer",
        "description": "Integrates 10+ mixing protocols including Tornado and Raijour",
        "features": [
          "Multi-protocol Support",
          "Seamless Integration",
          "Efficient Aggregation"
        ]
      },
      "crosschain": {
        "title": "Cross-Chain Layer",
        "description": "Anonymous atomic swaps based on F4-SNAPK5 (delay <30 seconds)",
        "features": [
          "Rapid Exchange",
          "Privacy Protection",
          "Secure and Reliable"
        ]
      },
      "routing": {
        "title": "Routing Layer",
        "description": "Dynamically updates routing network, automatically tracks high-risk regulatory nodes",
        "features": [
          "Real-time Monitoring",
          "Risk Avoidance",
          "Intelligent Routing"
        ]
      },
      "application": {
        "title": "Application Layer",
        "description": "Open SDK supporting one-click privacy for DEX, NFT markets, and other scenarios",
        "features": [
          "Open APIs",
          "Easy Integration",
          "Rich Scenarios"
        ]
      }
    },
    "innovation": {
      "title": "Core Innovations",
      "subtitle": "MOSE's technological barriers and innovative advantages",
      "interoperability": {
        "title": "Cross-Chain Protocol Interoperability",
        "description": "3 international patents pending",
        "detail": "Enables seamless interaction between different blockchains, ensuring security and privacy during cross-chain asset transfers"
      },
      "compatibility": {
        "title": "Compatible with 12+ Public Chains",
        "description": "DevKit adopted by 200+ projects",
        "detail": "Supports Ethereum, Binance Smart Chain, Polkadot, Cosmos, and other mainstream chains, covering over 90% of market transaction volume"
      },
      "encryption": {
        "title": "F4-SNAPK5 Encryption Algorithm",
        "description": "Original zero-knowledge proof algorithm",
        "detail": "Provides more efficient computational performance and stronger security, improving transaction verification speed by 300%"
      },
      "communication": {
        "title": "Efficient Cross-Chain Communication Without Data",
        "description": "Breakthrough in traditional cross-chain communication bottlenecks",
        "detail": "Reduces communication overhead by 80% while ensuring the reliability and integrity of transaction verification"
      }
    },
    "ecosystem_integration": {
      "title": "Ecosystem Integration",
      "subtitle": "How MOSE technology supports the entire ecosystem",
      "description": "Through open APIs and development kits, MOSE technology can be seamlessly integrated into various application scenarios, providing secure, efficient, and private blockchain infrastructure"
    }
  }
 } 
--- a/src/i18n/locales/ja.json
+++ b/src/i18n/locales/ja.json
@ -2,6 +2,7 @@
  "nav": {
    "home": "ホーム",
    "ecosystem": "エコシステム",
    "technology": "テクノロジー",
    "about": "私たちについて",
    "resources": "リソース",
    "community": "コミュニティ",
@ -206,6 +207,41 @@
      "explore": "エコシステムを探索",
      "docs": "ドキュメント"
    },
    "core_values": {
      "title": "コアバリュー",
      "privacy": {
        "title": "プライバシー保護",
        "desc1": "ゼロ知識証明による匿名取引",
        "desc2": "匿名アトミックスワップ技術"
      },
      "interop": {
        "title": "クロスチェーン相互運用性",
        "desc1": "12以上の主要ブロックチェーンをサポート",
        "desc2": "イーサリアム/Cosmos/Polkadotエコシステム"
      },
      "compliance": {
        "title": "規制コンプライアンス",
        "desc1": "シンガポールMASサンドボックスライセンス",
        "desc2": "高リスクノードを回避する動的ルーティング"
      }
    },
    "project_intro": {
      "title": "プロジェクト紹介",
      "description": "スイス暗号財団、シンガポールデジタル金融連盟などによって共同で設立され、クロスチェーンプライバシー技術の研究開発に特化し、Web3に分散型プライバシーインフラストラクチャを提供しています。グローバル展開：シンガポール本社と10のエコシステムハブが北米、ヨーロッパ、アジア太平洋などの主要地域にサービスを提供しています。",
      "global_presence": "グローバル展開",
      "security_focus": "セキュリティとコンプライアンス",
      "innovation": "技術革新"
    },
    "partners": {
      "title": "パートナー",
      "subtitle": "業界リーダーと協力してブロックチェーン技術を推進"
    },
    "news": {
      "title": "最新ニュース",
      "mainnet_launch": "メインネットV1.0リリース、日次取引量が1億ドルを突破",
      "mas_license": "シンガポールMASサンドボックスライセンスを取得",
      "hackathon": "東京開発者ハッカソン（賞金プール50万ドル）"
    },
    "milestone": {
      "title": "開発マイルストーン",
      "july_2026": {
@ -322,5 +358,210 @@
    "cancel": "キャンセル",
    "back": "戻る",
    "next": "次へ"
  },
  "about": {
    "hero": {
      "title": "私たちについて",
      "subtitle": "MOSEのビジョン、ミッション、チームについて学ぶ"
    },
    "story": {
      "title": "私たちの物語",
      "paragraph1": "MOSEは高性能で安全かつスケーラブルなブロックチェーンプラットフォームの構築に専念するプロジェクトです。私たちの使命は、分散型アプリケーションに強力なインフラストラクチャを提供し、開発者が次世代のブロックチェーンアプリケーションを構築できるようにすることです。",
      "paragraph2": "私たちのチームはブロックチェーン技術の専門家、経験豊富な開発者、業界のリーダーで構成され、ブロックチェーン技術の開発と応用を推進するために協力しています。",
      "paragraph3": "MOSEの中心的な価値観には、分散化、セキュリティ、スケーラビリティ、コミュニティ主導の開発が含まれます。これらの価値観に導かれることで、より開かれた、公平で効率的なブロックチェーンエコシステムを構築できると信じています。"
    },
    "team": {
      "title": "私たちのチーム",
      "positions": {
        "ceo": "最高経営責任者 & 創設者",
        "cto": "最高技術責任者",
        "lead_dev": "リード開発者",
        "marketing": "マーケティングディレクター"
      }
    },
    "milestones": {
      "title": "マイルストーン",
      "founded": "MOSE設立",
      "founded_desc": "MOSEは高性能ブロックチェーンプラットフォームを作るというビジョンで設立されました。",
      "testnet": "テストネット立ち上げ",
      "testnet_desc": "主要な機能を備えたテストネットの立ち上げに成功しました。",
      "mainnet": "メインネットベータ",
      "mainnet_desc": "パフォーマンスとセキュリティを向上させたメインネットのベータ版をリリースしました。",
      "growth": "エコシステム拡大",
      "growth_desc": "様々なプロジェクトとパートナーシップでエコシステムを拡大しました。"
    },
    "partners": {
      "title": "パートナー",
      "technology_title": "技術パートナー",
      "investors_title": "投資家",
      "compliance_title": "コンプライアンスサポート",
      "technology": {
        "aleo": "ゼロ知識証明技術プロバイダー",
        "starkware": "スケーラビリティソリューションプロバイダー",
        "layerzero": "クロスチェーンプロトコル開発パートナー",
        "axelar": "安全なクロスチェーン通信プラットフォーム"
      },
      "investors": {
        "binance": "大手暗号通貨取引所の投資部門",
        "polychain": "評価額3億ドル、ブロックチェーン技術投資に特化"
      },
      "compliance": {
        "mas": "シンガポール金融管理局、規制サンドボックスを提供",
        "finma": "スイス金融市場監督機構、コンプライアンスアドバイザー"
      }
    }
  },
  "projects": {
    "mose_swap": "低手数料で高流動性の分散型取引所",
    "mose_nft": "MOSEブロックチェーン上でユニークなデジタル資産を取引",
    "mose_dao": "MOSEエコシステムの分散型ガバナンス",
    "mose_gaming": "MOSE上に構築されたPlay-to-Earnゲーム",
    "mose_bridge": "MOSE資産のクロスチェーンブリッジ",
    "mose_social": "分散型ソーシャルネットワーク",
    "mose_lending": "分散型貸付プロトコル",
    "mose_staking": "MOSEトークンをステーキングして報酬を獲得"
  },
  "technology": {
    "hero": {
      "title": "テクノロジーアーキテクチャ",
      "subtitle": "MOSEの最先端技術とイノベーションを探る"
    },
    "architecture": {
      "title": "4層アーキテクチャ",
      "subtitle": "MOSEは高度な4層アーキテクチャ設計を採用し、様々なアプリケーションシナリオに強力なサポートを提供します",
      "aggregation": {
        "title": "集約層",
        "description": "TornadoやRaijour等、10以上のミキシングプロトコルを統合",
        "features": [
          "マルチプロトコルサポート",
          "シームレスな統合",
          "効率的な集約"
        ]
      },
      "crosschain": {
        "title": "クロスチェーン層",
        "description": "F4-SNAPK5に基づく匿名アトミックスワップ（遅延<30秒）",
        "features": [
          "高速交換",
          "プライバシー保護",
          "安全で信頼性が高い"
        ]
      },
      "routing": {
        "title": "ルーティング層",
        "description": "ルーティングネットワークを動的に更新し、高リスク規制ノードを自動的に追跡",
        "features": [
          "リアルタイムモニタリング",
          "リスク回避",
          "インテリジェントルーティング"
        ]
      },
      "application": {
        "title": "アプリケーション層",
        "description": "オープンSDKがDEX、NFTマーケットなどのシナリオでワンクリックプライバシーをサポート",
        "features": [
          "オープンAPI",
          "簡単な統合",
          "豊富なシナリオ"
        ]
      }
    },
    "innovation": {
      "title": "核心的イノベーション",
      "subtitle": "MOSEの技術障壁と革新的な優位性",
      "interoperability": {
        "title": "クロスチェーンプロトコルの相互運用性",
        "description": "3つの国際特許出願中",
        "detail": "異なるブロックチェーン間のシームレスな相互作用を可能にし、クロスチェーン資産転送中のセキュリティとプライバシーを確保"
      },
      "compatibility": {
        "title": "12以上のパブリックチェーンと互換性",
        "description": "DevKitは200以上のプロジェクトに採用",
        "detail": "イーサリアム、バイナンススマートチェーン、ポルカドット、コスモスなどの主流チェーンをサポートし、市場取引量の90%以上をカバー"
      },
      "encryption": {
        "title": "F4-SNAPK5暗号化アルゴリズム",
        "description": "独自のゼロ知識証明アルゴリズム",
        "detail": "より効率的な計算性能と強力なセキュリティを提供し、取引検証速度を300%向上"
      },
      "communication": {
        "title": "データなしの効率的なクロスチェーン通信",
        "description": "従来のクロスチェーン通信のボトルネックを突破",
        "detail": "通信オーバーヘッドを80%削減しながら、取引検証の信頼性と完全性を確保"
      }
    },
    "ecosystem_integration": {
      "title": "エコシステム統合",
      "subtitle": "MOSE技術がエコシステム全体をどのようにサポートするか",
      "description": "オープンAPIと開発キットを通じて、MOSE技術はさまざまなアプリケーションシナリオにシームレスに統合でき、安全で効率的、プライベートなブロックチェーンインフラストラクチャを提供します"
    }
  },
  "community": {
    "hero": {
      "title": "コミュニティ",
      "subtitle": "活気あるコミュニティに参加して、最新情報やイベントを常に把握しましょう"
    },
    "social_media": {
      "title": "ソーシャルメディアウォール",
      "official_post": "公式投稿"
    },
    "forum": {
      "title": "フォーラム入口",
      "description": "これは公式フォーラムエリアです。公式チームのみがトピックを投稿でき、ユーザーは閲覧とコメントができます。",
      "comments": "コメント",
      "no_comments": "まだコメントはありません。最初のコメントを投稿しましょう！",
      "username": "ユーザー名",
      "comment": "コメント",
      "cancel": "キャンセル",
      "submit": "送信",
      "view_comments": "コメントを見る",
      "topics": "トピック",
      "add_comment": "コメントを追加"
    },
    "announcements": {
      "title": "お知らせ",
      "awards_title": "最新の受賞発表"
    },
    "highlights": {
      "title": "コミュニティハイライト",
      "ugc_title": "UGCコンテンツショーケース"
    },
    "time": {
      "today": "今日",
      "yesterday": "昨日",
      "days_ago": "{days}日前"
    },
    "posts": {
      "mainnet_launch": {
        "title": "MOSEメインネット立ち上げ計画",
        "content": "MOSEメインネットが2026年7月に正式にローンチされる予定であることをお知らせします。それまでに、複数のテストネットバージョンをリリースし、コミュニティメンバーのテスト参加を歓迎します。"
      },
      "singapore_license": {
        "title": "シンガポール規制サンドボックスライセンス承認",
        "content": "MOSEプロジェクトがシンガポール金融管理局（MAS）の規制サンドボックスライセンスを取得したことを発表できることを光栄に思います。これはコンプライアンスへの重要な一歩です。"
      },
      "tokyo_hackathon": {
        "title": "東京開発者ハッカソン発表",
        "content": "2024年11月に東京開発者ハッカソンを開催し、総賞金プールは50万ドルです。イベントはプライバシーコンピューティングとクロスチェーンソリューションの革新的なアプリケーションに焦点を当てます。"
      }
    },
    "rewards": {
      "daily_contest": "デイリーコンテストTOP10（1位：500 MOSE）",
      "weekly_whale": "ウィークリーホエールリワード（V5レベル：300,000 MOSE）"
    },
    "events": {
      "singapore_conference": "シンガポールコンセンサス会議2024基調講演",
      "dubai_summit": "ドバイRegTechサミット円卓会議",
      "tokyo_hackathon": "東京開発者ハッカソン"
    },
    "messages": {
      "progress": "プロジェクトの進捗は非常に速く、メインネットのローンチが楽しみです！",
      "team": "チームは非常にプロフェッショナルで、技術文書も詳細です"
    },
    "comments": {
      "great": "素晴らしい！メインネットを試すのが待ちきれません！",
      "testnet": "テストネットはいつ開放されますか？",
      "congrats": "おめでとうございます！これはプロジェクトの将来の発展にとって非常に重要です。"
    }
  }
 } 
--- a/src/i18n/locales/zh.json
+++ b/src/i18n/locales/zh.json
@ -2,6 +2,7 @@
  "nav": {
    "home": "首页",
    "ecosystem": "生态系统",
    "technology": "技术",
    "about": "关于我们",
    "resources": "资源",
    "community": "社区",
@ -216,6 +217,41 @@
      "explore": "探索生态系统",
      "docs": "文档"
    },
    "core_values": {
      "title": "核心价值主张",
      "privacy": {
        "title": "隐私保护",
        "desc1": "基于零知识证明的匿名交易",
        "desc2": "匿名原子交换技术"
      },
      "interop": {
        "title": "跨链互操作",
        "desc1": "支持12+主流公链",
        "desc2": "以太坊/Cosmos/Polkadot生态"
      },
      "compliance": {
        "title": "合规安全",
        "desc1": "新加坡MAS沙盒许可",
        "desc2": "动态路由规避高风险节点"
      }
    },
    "project_intro": {
      "title": "项目简介",
      "description": "由瑞士加密合基金会、新加坡数字金融联盟等联合孵化，专注研发跨链隐私技术，为Web3提供去中心化隐私基础设施。全球布局：新加坡总部与十大生态枢纽，服务北美、欧洲、亚太等核心区域。",
      "global_presence": "全球布局",
      "security_focus": "安全合规",
      "innovation": "技术创新"
    },
    "partners": {
      "title": "合作伙伴",
      "subtitle": "与行业领先机构合作，共同推动区块链技术发展"
    },
    "news": {
      "title": "最新动态",
      "mainnet_launch": "主网V1.0发布，日交易量破$1亿",
      "mas_license": "获新加坡MAS沙盒许可",
      "hackathon": "东京开发者黑客松（奖金池$50万）"
    },
    "milestone": {
      "title": "发展里程碑",
      "july_2026": {
@ -392,6 +428,26 @@
      "mainnet_desc": "发布主网Beta版，性能和安全性得到提升。",
      "growth": "生态系统扩展",
      "growth_desc": "通过各种项目和合作伙伴关系扩展我们的生态系统。"
    },
    "partners": {
      "title": "合作伙伴",
      "technology_title": "技术合作",
      "investors_title": "投资机构",
      "compliance_title": "合规支持",
      "technology": {
        "aleo": "零知识证明技术提供方",
        "starkware": "可扩展性解决方案提供商",
        "layerzero": "跨链协议开发伙伴",
        "axelar": "安全跨链通信平台"
      },
      "investors": {
        "binance": "全球领先的加密货币交易所投资部门",
        "polychain": "估值$3亿，专注区块链技术投资"
      },
      "compliance": {
        "mas": "新加坡金融管理局，提供监管沙盒",
        "finma": "瑞士金融市场监管局，合规顾问"
      }
    }
  },
  "projects": {
@ -438,49 +494,70 @@
  },
  "community": {
    "hero": {
      "title": "MOSE社区",
      "subtitle": "加入我们充满活力的社区，共同构建区块链的未来"
      "title": "社区",
      "subtitle": "加入我们充满活力的社区，及时了解最新动态和活动"
    },
    "join": {
      "title": "加入我们的社区",
      "subtitle": "与全球开发者、用户和爱好者一起交流和学习"
    },
    "channels": {
      "title": "社区渠道",
      "discord": {
        "title": "Discord",
        "description": "加入我们的Discord服务器，与开发者和社区成员实时交流",
        "button": "加入Discord"
      },
      "telegram": {
        "title": "Telegram",
        "description": "通过Telegram获取最新消息和公告",
        "button": "加入Telegram"
      },
      "twitter": {
        "title": "Twitter",
        "description": "关注我们的Twitter账号，了解最新动态和行业见解",
        "button": "关注Twitter"
      },
      "forum": {
        "title": "论坛",
        "description": "参与深度讨论，分享想法和提出建议",
        "button": "访问论坛"
    "social_media": {
      "title": "社交媒体墙",
      "official_post": "官方发布"
    },
    "forum": {
      "title": "论坛入口",
      "description": "这是官方论坛区，只有官方可以发布主题帖，用户可以浏览并留言评论。",
      "comments": "评论",
      "no_comments": "暂无评论，来发表第一条评论吧！",
      "username": "用户名",
      "comment": "评论内容",
      "cancel": "取消",
      "submit": "提交评论",
      "view_comments": "查看评论",
      "topics": "主题帖",
      "add_comment": "添加评论"
    },
    "announcements": {
      "title": "信息公示",
      "awards_title": "最新获奖公告"
    },
    "highlights": {
      "title": "社区风采",
      "ugc_title": "UGC内容展示"
    },
    "time": {
      "today": "今天",
      "yesterday": "昨天",
      "days_ago": "{days}天前"
    },
    "posts": {
      "mainnet_launch": {
        "title": "MOSE主网上线计划",
        "content": "我们很高兴地宣布，MOSE主网计划于2026年7月正式上线。在此之前，我们将发布多个测试网版本，欢迎社区成员参与测试。"
      },
      "singapore_license": {
        "title": "新加坡监管沙盒许可证获批",
        "content": "我们很荣幸地宣布，MOSE项目已获得新加坡金融管理局(MAS)的监管沙盒许可证，这是我们向合规化迈出的重要一步。"
      },
      "tokyo_hackathon": {
        "title": "东京开发者黑客松赛事公告",
        "content": "我们将在2024年11月举办东京开发者黑客松活动，总奖金池高达50万美元。活动将聚焦隐私计算和跨链解决方案的创新应用。"
      }
    },
    "rewards": {
      "daily_contest": "每日竞赛TOP10（第1名500枚MOSE）",
      "weekly_whale": "每周鲸鱼奖励榜（V5等级奖励300,000枚）"
    },
    "events": {
      "title": "社区活动",
      "upcoming": "即将举行的活动",
      "past": "往期活动",
      "virtual": "线上",
      "inperson": "线下",
      "register": "注册",
      "watch": "观看回放"
    },
    "contributors": {
      "title": "社区贡献者",
      "description": "感谢所有为MOSE生态系统做出贡献的社区成员",
      "become": "成为贡献者"
      "singapore_conference": "新加坡共识大会2024主题演讲",
      "dubai_summit": "迪拜监管科技峰会圆桌论坛",
      "tokyo_hackathon": "东京开发者黑客松活动"
    },
    "messages": {
      "progress": "项目进展非常快，期待主网上线！",
      "team": "团队非常专业，技术文档写得很详细"
    },
    "comments": {
      "great": "太棒了！等不及要尝试主网了！",
      "testnet": "测试网何时开放？",
      "congrats": "恭喜！这对项目的未来发展非常重要。"
    }
  },
  "faq": {
@ -552,5 +629,80 @@
    "cancel": "取消",
    "back": "返回",
    "next": "下一步"
  },
  "technology": {
    "hero": {
      "title": "技术架构",
      "subtitle": "探索MOSE的尖端技术和创新"
    },
    "architecture": {
      "title": "四层架构",
      "subtitle": "MOSE采用先进的四层架构设计，为各类应用场景提供强大支持",
      "aggregation": {
        "title": "聚合层",
        "description": "整合Tornado、Raijour等10+混币协议",
        "features": [
          "多协议支持",
          "无缝整合",
          "高效聚合"
        ]
      },
      "crosschain": {
        "title": "跨链层",
        "description": "基于F4-SNAPK5的匿名原子交换（延迟<30秒）",
        "features": [
          "快速交换",
          "隐私保护",
          "安全可靠"
        ]
      },
      "routing": {
        "title": "路由层",
        "description": "动态更新路由网络，自动跟踪监管高风险节点",
        "features": [
          "实时监控",
          "风险规避",
          "智能路由"
        ]
      },
      "application": {
        "title": "应用层",
        "description": "开放SDK，支持DEX、NFT市场等场景一键隐私化",
        "features": [
          "开放接口",
          "易于集成",
          "场景丰富"
        ]
      }
    },
    "innovation": {
      "title": "核心创新",
      "subtitle": "MOSE的技术壁垒和创新优势",
      "interoperability": {
        "title": "跨链协议互操作性",
        "description": "已申请3项国际专利",
        "detail": "实现不同区块链之间的无缝交互，保证资产跨链时的安全和隐私"
      },
      "compatibility": {
        "title": "兼容12+公链",
        "description": "DevKit被200+项目采用",
        "detail": "支持以太坊、Binance Smart Chain、Polkadot、Cosmos等主流公链，覆盖市场超90%交易量"
      },
      "encryption": {
        "title": "F4-SNAPK5加密算法",
        "description": "独创零知识证明算法",
        "detail": "提供更高效的计算性能和更强的安全性，交易验证速度提升300%"
      },
      "communication": {
        "title": "无需数据的跨链路高效通信",
        "description": "突破传统跨链通信瓶颈",
        "detail": "减少80%通信开销，同时保证交易验证的可靠性和完整性"
      }
    },
    "ecosystem_integration": {
      "title": "生态系统集成",
      "subtitle": "MOSE技术如何支持整个生态系统",
      "description": "通过开放的API和开发工具包，MOSE技术能够无缝集成到各类应用场景中，提供安全、高效、隐私的区块链基础设施"
    }
  }
 } 
--- a/src/router/index.ts
+++ b/src/router/index.ts
@ -36,6 +36,11 @@ const routes = [
    name: 'Contact',
    component: () => import('@/views/Contact.vue')
  },
  {
    path: '/technology',
    name: 'Technology',
    component: () => import('@/views/Technology.vue')
  },
  {
    path: '/:pathMatch(.*)*',
    name: 'NotFound',
--- a/src/views/About.vue
+++ b/src/views/About.vue
@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import PartnersModule from '../components/about/PartnersModule.vue';

 const { t } = useI18n();

@ -7,31 +8,47 @@ const { t } = useI18n();
 const teamMembers = [
  {
    id: 1,
    name: 'John Doe',
    position: t('about.team.positions.ceo'),
    image: '/public/images.png',
    linkedin: 'https://linkedin.com'
    name: t('about.team.member1.name'),
    position: t('about.team.member1.position'),
    bio: t('about.team.member1.bio'),
    image: '/public/LOGO.png',
    social: {
      twitter: 'https://twitter.com/',
      linkedin: 'https://linkedin.com/'
    }
  },
  {
    id: 2,
    name: 'Jane Smith',
    position: t('about.team.positions.cto'),
    image: '/public/images.png',
    linkedin: 'https://linkedin.com'
    name: t('about.team.member2.name'),
    position: t('about.team.member2.position'),
    bio: t('about.team.member2.bio'),
    image: '/public/LOGO.png',
    social: {
      twitter: 'https://twitter.com/',
      linkedin: 'https://linkedin.com/'
    }
  },
  {
    id: 3,
    name: 'Mike Johnson',
    position: t('about.team.positions.lead_dev'),
    image: '/public/images.png',
    linkedin: 'https://linkedin.com'
    name: t('about.team.member3.name'),
    position: t('about.team.member3.position'),
    bio: t('about.team.member3.bio'),
    image: '/public/LOGO.png',
    social: {
      twitter: 'https://twitter.com/',
      linkedin: 'https://linkedin.com/'
    }
  },
  {
    id: 4,
    name: 'Sarah Williams',
    position: t('about.team.positions.marketing'),
    image: '/public/images.png',
    linkedin: 'https://linkedin.com'
    name: t('about.team.member4.name'),
    position: t('about.team.member4.position'),
    bio: t('about.team.member4.bio'),
    image: '/public/LOGO.png',
    social: {
      twitter: 'https://twitter.com/',
      linkedin: 'https://linkedin.com/'
    }
  }
 ];

@ -125,17 +142,28 @@ const milestones = [
            <div class="p-5">
              <h3 class="text-lg font-bold text-text mb-1">{{ member.name }}</h3>
              <p class="text-text-secondary text-sm mb-3">{{ member.position }}</p>
              <a 
                :href="member.linkedin" 
                target="_blank" 
                rel="noopener noreferrer"
                class="text-primary-light hover:text-primary-dark transition-colors duration-200 flex items-center text-sm"
              >
                <svg class="h-4 w-4 mr-1" fill="currentColor" viewBox="0 0 24 24">
                  <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"></path>
                </svg>
                {{ t('common.linkedin') }}
              </a>
              <div class="flex space-x-2 mt-2">
                  <a 
                    :href="member.social.twitter" 
                    target="_blank" 
                    rel="noopener noreferrer"
                    class="text-primary-light hover:text-primary-dark transition-colors"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
                      <path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>
                    </svg>
                  </a>
                  <a 
                    :href="member.social.linkedin" 
                    target="_blank" 
                    rel="noopener noreferrer"
                    class="text-primary-light hover:text-primary-dark transition-colors"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
                      <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
                    </svg>
                  </a>
                </div>
            </div>
          </div>
        </div>
@ -224,5 +252,8 @@ const milestones = [
        </div>
      </div>
    </section>

    <!-- Partners Section -->
    <PartnersModule />
  </div>
 </template> 
--- a/src/views/Community.vue
+++ b/src/views/Community.vue
@ -4,87 +4,220 @@ import { ref } from 'vue';

 const { t } = useI18n();

 // 社区活动数据
 const upcomingEvents = ref([
 interface Comment {
  id: number;
  user: string;
  content: string;
  timestamp: string;
 }

 interface Post {
  id: number;
  title: string;
  content: string;
  author: string;
  timestamp: string;
  comments: Comment[];
 }

 // 社交媒体账号数据
 const socialMediaAccounts = [
  {
    id: 1,
    title: 'MOSE 开发者大会',
    date: '2023-12-15',
    type: 'virtual',
    image: '/public/images.png'
    platform: 'Twitter',
    handle: '@mose202399',
    icon: 'M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085a4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z',
    url: 'https://twitter.com/mose202399'
  },
  {
    id: 2,
    title: 'MOSE 区块链峰会',
    date: '2024-01-20',
    type: 'inperson',
    image: '/public/images.png'
    platform: 'Twitter',
    handle: '@Nosafuture',
    icon: 'M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085a4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z',
    url: 'https://twitter.com/Nosafuture'
  },
  {
    id: 3,
    title: 'MOSE 黑客松',
    date: '2024-02-10',
    type: 'virtual',
    image: '/public/images.png'
    platform: 'Twitter',
    handle: '@MoseComa',
    icon: 'M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085a4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z',
    url: 'https://twitter.com/MoseComa'
  }
 ]);
 ];

 const pastEvents = ref([
 // 奖励数据
 const rewardData = [
  {
    id: 4,
    title: 'MOSE 生态系统发布会',
    date: '2023-06-05',
    type: 'virtual',
    image: '/public/images.png',
    recording: '#'
    id: 1,
    title: t('community.rewards.daily_contest'),
    icon: '🏆'
  },
  {
    id: 5,
    title: 'MOSE 技术研讨会',
    date: '2023-08-12',
    type: 'inperson',
    image: '/public/images.png',
    recording: '#'
    id: 2,
    title: t('community.rewards.weekly_whale'),
    icon: '🏆'
  }
 ]);
 ];

 // 社区贡献者数据
 const contributors = ref([
 // 社区活动数据
 const communityEvents = [
  {
    id: 1,
    name: 'Alex Johnson',
    role: 'Core Developer',
    image: '/public/vite.svg',
    github: 'https://github.com'
    title: t('community.events.singapore_conference'),
    image: '/public/LOGO.png',
    date: '2024-06-15'
  },
  {
    id: 2,
    name: 'Sarah Chen',
    role: 'UI/UX Designer',
    image: '/public/vite.svg',
    github: 'https://github.com'
    title: t('community.events.dubai_summit'),
    image: '/public/LOGO.png',
    date: '2024-09-20'
  },
  {
    id: 3,
    name: 'David Kim',
    role: 'Community Manager',
    image: '/public/vite.svg',
    github: 'https://github.com'
    title: t('community.events.tokyo_hackathon'),
    image: '/public/LOGO.png',
    date: '2024-11-10'
  }
 ];

 // 官方论坛帖子
 const officialPosts: Post[] = [
  {
    id: 1,
    title: t('community.posts.mainnet_launch.title'),
    content: t('community.posts.mainnet_launch.content'),
    author: 'MOSE Team',
    timestamp: '2023-11-20T09:00:00',
    comments: [
      {
        id: 1,
        user: 'CryptoFan',
        content: t('community.comments.great'),
        timestamp: '2023-11-20T10:15:00'
      },
      {
        id: 2,
        user: 'BlockchainDev',
        content: t('community.comments.testnet'),
        timestamp: '2023-11-20T11:30:00'
      }
    ]
  },
  {
    id: 2,
    title: t('community.posts.singapore_license.title'),
    content: t('community.posts.singapore_license.content'),
    author: 'MOSE Compliance Team',
    timestamp: '2023-11-15T14:00:00',
    comments: [
      {
        id: 1,
        user: 'RegulationExpert',
        content: t('community.comments.congrats'),
        timestamp: '2023-11-15T15:20:00'
      }
    ]
  },
  {
    id: 4,
    name: 'Maria Rodriguez',
    role: 'Documentation',
    image: '/public/vite.svg',
    github: 'https://github.com'
    id: 3,
    title: t('community.posts.tokyo_hackathon.title'),
    content: t('community.posts.tokyo_hackathon.content'),
    author: 'MOSE Events Team',
    timestamp: '2023-11-10T11:00:00',
    comments: []
  }
 ]);
 ];

 // 新留言
 const newMessage = ref({
  postId: null as number | null,
  user: '',
  content: ''
 });

 // 当前查看的帖子ID
 const currentPostId = ref<number | null>(null);

 // 提交留言
 const submitComment = (postId: number) => {
  if (newMessage.value.user && newMessage.value.content) {
    // 查找帖子并添加评论
    const post = officialPosts.find(p => p.id === postId);
    if (post) {
      post.comments.push({
        id: post.comments.length + 1,
        user: newMessage.value.user,
        content: newMessage.value.content,
        timestamp: new Date().toISOString()
      });
      
      // 重置表单
      newMessage.value.user = '';
      newMessage.value.content = '';
      newMessage.value.postId = null;
    }
  }
 };

 // 准备留言
 const prepareComment = (postId: number) => {
  // 记录当前滚动位置
  const scrollPosition = window.scrollY;
  
  // 设置当前查看的帖子ID
  currentPostId.value = postId;
  newMessage.value.postId = postId;
  
  // 使用setTimeout确保DOM更新后再恢复滚动位置
  setTimeout(() => {
    window.scrollTo({
      top: scrollPosition,
      behavior: 'auto'
    });
  }, 0);
 };

 // 关闭评论
 const closeComment = () => {
  // 记录当前滚动位置
  const scrollPosition = window.scrollY;
  
  // 关闭评论区
  currentPostId.value = null;
  
  // 使用setTimeout确保DOM更新后再恢复滚动位置
  setTimeout(() => {
    window.scrollTo({
      top: scrollPosition,
      behavior: 'auto'
    });
  }, 0);
 };

 // 计算帖子发布时间
 const getTimeAgo = (timestamp: string) => {
  const now = new Date();
  const postTime = new Date(timestamp);
  const diffTime = Math.abs(now.getTime() - postTime.getTime());
  const diffDays = Math.floor(diffTime / (1000 * 60 * 60 * 24));
  
  if (diffDays < 1) {
    return t('community.time.today');
  } else if (diffDays === 1) {
    return t('community.time.yesterday');
  } else if (diffDays < 7) {
    return t('community.time.days_ago', { days: diffDays });
  } else {
    return new Date(timestamp).toLocaleDateString();
  }
 };
 </script>

 <template>
  <div class="bg-background min-h-screen">
    <!-- Hero Section -->
    <section class="relative py-32 px-6 md:px-12 lg:px-24 bg-background-dark overflow-hidden">
    <section class="relative py-24 px-6 md:px-12 lg:px-24 bg-background-dark overflow-hidden">
      <div class="container mx-auto relative z-10">
        <div class="max-w-3xl mx-auto text-center">
          <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-text mb-6 wow animate__animated animate__fadeInDown animate__duration-fast">
@ -104,177 +237,251 @@ const contributors = ref([
      </div>
    </section>
    
    <!-- Community Channels Section -->
    <!-- 1. 社交媒体墙 Section -->
    <section class="py-16 px-6 md:px-12 lg:px-24">
      <div class="container mx-auto">
        <div class="max-w-3xl mx-auto text-center mb-16">
          <h2 class="text-3xl font-bold text-text mb-4 wow animate__animated animate__fadeInUp">
            {{ t('community.join.title') }}
          </h2>
          <p class="text-text-secondary wow animate__animated animate__fadeInUp animate__delay-xs">
            {{ t('community.join.subtitle') }}
          </p>
        </div>
        <h2 class="text-3xl font-bold text-text mb-10 text-center wow animate__animated animate__fadeInUp">
          {{ t('community.social_media.title') }}
        </h2>
        
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
          <!-- Discord -->
          <div class="bg-background-light rounded-xl p-6 shadow-card wow animate__animated animate__fadeInUp">
            <div class="h-16 w-16 bg-primary/20 rounded-full flex items-center justify-center mb-4">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-primary-light" fill="currentColor" viewBox="0 0 24 24">
                <path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.608 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1634-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/>
              </svg>
            </div>
            <h3 class="text-xl font-bold text-text mb-2">{{ t('community.channels.discord.title') }}</h3>
            <p class="text-text-secondary mb-4">{{ t('community.channels.discord.description') }}</p>
            <a href="#" class="inline-block px-6 py-2 bg-primary text-text rounded-lg btn-hover-float">
              {{ t('community.channels.discord.button') }}
            </a>
          </div>
          
          <!-- Telegram -->
          <div class="bg-background-light rounded-xl p-6 shadow-card wow animate__animated animate__fadeInUp animate__delay-xs">
            <div class="h-16 w-16 bg-primary/20 rounded-full flex items-center justify-center mb-4">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-primary-light" fill="currentColor" viewBox="0 0 24 24">
                <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.96 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
        <div class="flex flex-wrap justify-center gap-6 mb-10">
          <a 
            v-for="account in socialMediaAccounts" 
            :key="account.id"
            :href="account.url"
            target="_blank"
            rel="noopener noreferrer"
            class="flex items-center bg-background-light p-4 rounded-xl shadow-card transition-all duration-300 hover:shadow-lg hover:-translate-y-1"
          >
            <div class="h-12 w-12 bg-primary bg-opacity-10 rounded-full flex items-center justify-center mr-4">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-primary-light" fill="currentColor" viewBox="0 0 24 24">
                <path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085a4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>
              </svg>
            </div>
            <h3 class="text-xl font-bold text-text mb-2">{{ t('community.channels.telegram.title') }}</h3>
            <p class="text-text-secondary mb-4">{{ t('community.channels.telegram.description') }}</p>
            <a href="#" class="inline-block px-6 py-2 bg-primary text-text rounded-lg btn-hover-float">
              {{ t('community.channels.telegram.button') }}
            </a>
          </div>
          
          <!-- Twitter -->
          <div class="bg-background-light rounded-xl p-6 shadow-card wow animate__animated animate__fadeInUp animate__delay-sm">
            <div class="h-16 w-16 bg-primary/20 rounded-full flex items-center justify-center mb-4">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-primary-light" fill="currentColor" viewBox="0 0 24 24">
                <path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>
              </svg>
            </div>
            <h3 class="text-xl font-bold text-text mb-2">{{ t('community.channels.twitter.title') }}</h3>
            <p class="text-text-secondary mb-4">{{ t('community.channels.twitter.description') }}</p>
            <a href="#" class="inline-block px-6 py-2 bg-primary text-text rounded-lg btn-hover-float">
              {{ t('community.channels.twitter.button') }}
            </a>
          </div>
          
          <!-- Forum -->
          <div class="bg-background-light rounded-xl p-6 shadow-card wow animate__animated animate__fadeInUp animate__delay-md">
            <div class="h-16 w-16 bg-primary/20 rounded-full flex items-center justify-center mb-4">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-primary-light" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8h2a2 2 0 012 2v6a2 2 0 01-2 2h-2v4l-4-4H9a1.994 1.994 0 01-1.414-.586m0 0L11 14h4a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2v4l.586-.586z" />
              </svg>
            </div>
            <h3 class="text-xl font-bold text-text mb-2">{{ t('community.channels.forum.title') }}</h3>
            <p class="text-text-secondary mb-4">{{ t('community.channels.forum.description') }}</p>
            <a href="#" class="inline-block px-6 py-2 bg-primary text-text rounded-lg btn-hover-float">
              {{ t('community.channels.forum.button') }}
            </a>
          </div>
            <span class="text-lg font-medium text-text">{{ account.handle }}</span>
          </a>
        </div>
      </div>
    </section>
    
    <!-- Community Events Section -->
    <!-- 2. 论坛入口 Section -->
    <section class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
      <div class="container mx-auto">
        <h2 class="text-3xl font-bold text-text mb-12 text-center wow animate__animated animate__fadeInUp">
          {{ t('community.events.title') }}
        <h2 class="text-3xl font-bold text-text mb-6 text-center wow animate__animated animate__fadeInUp">
          {{ t('community.forum.title') }}
        </h2>
        
        <!-- Upcoming Events -->
        <div class="mb-16">
          <h3 class="text-2xl font-bold text-text mb-6 wow animate__animated animate__fadeInUp">
            {{ t('community.events.upcoming') }}
          </h3>
          
          <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
            <div v-for="event in upcomingEvents" :key="event.id" class="bg-background rounded-xl overflow-hidden shadow-card wow animate__animated animate__fadeInUp">
              <div class="relative h-48 overflow-hidden">
                <img :src="event.image" :alt="event.title" class="w-full h-full object-cover" />
                <div class="absolute top-4 right-4 px-3 py-1 rounded-full" :class="event.type === 'virtual' ? 'bg-secondary' : 'bg-accent'">
                  <span class="text-xs font-medium text-text">
                    {{ t(`community.events.${event.type}`) }}
                  </span>
                </div>
              </div>
              <div class="p-6">
                <h4 class="text-xl font-bold text-text mb-2">{{ event.title }}</h4>
                <p class="text-text-secondary mb-4">{{ event.date }}</p>
                <button class="px-6 py-2 bg-primary text-text rounded-lg w-full btn-hover-glow">
                  {{ t('community.events.register') }}
                </button>
        <p class="text-text-secondary text-center mb-8 max-w-2xl mx-auto">
          {{ t('community.forum.description') }}
        </p>
        
        <!-- 优化后的论坛框 -->
        <div class="max-w-4xl mx-auto bg-background rounded-xl shadow-lg overflow-hidden border border-background-light">
          <!-- 论坛标题栏 -->
          <div class="bg-primary bg-opacity-10 p-4 border-b border-background-light">
            <div class="flex items-center justify-between">
              <h3 class="font-bold text-lg text-primary">MOSE Forum</h3>
              <div class="flex items-center space-x-2">
                <span class="inline-block w-2 h-2 rounded-full bg-green-500"></span>
                <span class="text-sm text-text-secondary">{{ officialPosts.length }} {{ t('community.forum.topics') }}</span>
              </div>
            </div>
          </div>
        </div>
        
        <!-- Past Events -->
        <div>
          <h3 class="text-2xl font-bold text-text mb-6 wow animate__animated animate__fadeInUp">
            {{ t('community.events.past') }}
          </h3>
          
          <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
            <div v-for="event in pastEvents" :key="event.id" class="bg-background rounded-xl overflow-hidden shadow-card wow animate__animated animate__fadeInUp">
              <div class="relative h-48 overflow-hidden">
                <img :src="event.image" :alt="event.title" class="w-full h-full object-cover opacity-70" />
                <div class="absolute top-4 right-4 px-3 py-1 rounded-full" :class="event.type === 'virtual' ? 'bg-secondary' : 'bg-accent'">
                  <span class="text-xs font-medium text-text">
                    {{ t(`community.events.${event.type}`) }}
                  </span>
          <!-- 论坛帖子列表区域 - 固定高度并可滚动 -->
          <div class="h-[600px] overflow-y-auto">
            <div class="p-6">
              <!-- 官方帖子列表 -->
              <div 
                v-for="post in officialPosts" 
                :key="post.id" 
                class="mb-6 overflow-hidden"
              >
                <!-- 帖子卡片 -->
                <div class="bg-background-light rounded-lg border border-background-light hover:border-primary-light transition-colors duration-300">
                  <!-- 帖子标题与内容 -->
                  <div class="p-5">
                    <div class="flex justify-between items-center mb-4">
                      <h3 class="text-xl font-bold text-text hover:text-primary transition-colors duration-300">{{ post.title }}</h3>
                      <span class="text-sm text-text-secondary bg-background-dark bg-opacity-20 px-2 py-1 rounded-full">{{ getTimeAgo(post.timestamp) }}</span>
                    </div>
                    <p class="text-text-secondary text-base mb-4 leading-relaxed">{{ post.content }}</p>
                    <div class="flex items-center text-sm text-text-secondary">
                      <span class="font-medium flex items-center">
                        <span class="inline-block w-8 h-8 rounded-full bg-primary bg-opacity-20 text-primary flex items-center justify-center mr-2">
                          {{ post.author.charAt(0) }}
                        </span>
                        {{ post.author }}
                      </span>
                      <span class="mx-2">•</span>
                      <span class="bg-primary bg-opacity-10 text-primary px-2 py-1 rounded-full text-xs">
                        {{ t('community.social_media.official_post') }}
                      </span>
                    </div>
                  </div>
                  
                  <!-- 帖子评论区 - 默认隐藏，点击展开 -->
                  <div v-if="currentPostId === post.id" class="border-t border-background-light">
                    <div class="p-5 bg-background bg-opacity-50">
                      <h4 class="font-bold text-base text-text mb-4 flex items-center">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2 text-primary" viewBox="0 0 20 20" fill="currentColor">
                          <path fill-rule="evenodd" d="M18 10c0 3.866-3.582 7-8 7a8.841 8.841 0 01-4.083-.98L2 17l1.338-3.123C2.493 12.767 2 11.434 2 10c0-3.866 3.582-7 8-7s8 3.134 8 7zM7 9H5v2h2V9zm8 0h-2v2h2V9zM9 9h2v2H9V9z" clip-rule="evenodd" />
                        </svg>
                        {{ t('community.forum.comments') }} ({{ post.comments.length }})
                      </h4>
                      
                      <!-- 评论列表 -->
                      <div v-if="post.comments.length > 0" class="space-y-4 mb-5 max-h-[250px] overflow-y-auto">
                        <div 
                          v-for="comment in post.comments" 
                          :key="comment.id" 
                          class="bg-background rounded-lg p-4 border border-background-light"
                        >
                          <div class="flex justify-between items-center mb-2">
                            <span class="font-bold text-text text-sm flex items-center">
                              <span class="inline-block w-6 h-6 rounded-full bg-secondary bg-opacity-20 text-secondary flex items-center justify-center mr-2 text-xs">
                                {{ comment.user.charAt(0) }}
                              </span>
                              {{ comment.user }}
                            </span>
                            <span class="text-xs text-text-secondary bg-background-dark bg-opacity-10 px-2 py-1 rounded-full">{{ getTimeAgo(comment.timestamp) }}</span>
                          </div>
                          <p class="text-text-secondary text-sm pl-8">{{ comment.content }}</p>
                        </div>
                      </div>
                      
                      <!-- 空评论提示 -->
                      <div v-else class="text-center text-text-secondary text-sm py-6 bg-background-dark bg-opacity-5 rounded-lg border border-dashed border-background-light">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-10 w-10 mx-auto mb-2 text-text-secondary opacity-50" viewBox="0 0 20 20" fill="currentColor">
                          <path fill-rule="evenodd" d="M18 10c0 3.866-3.582 7-8 7a8.841 8.841 0 01-4.083-.98L2 17l1.338-3.123C2.493 12.767 2 11.434 2 10c0-3.866 3.582-7 8-7s8 3.134 8 7zM7 9H5v2h2V9zm8 0h-2v2h2V9zM9 9h2v2H9V9z" clip-rule="evenodd" />
                        </svg>
                        {{ t('community.forum.no_comments') }}
                      </div>
                      
                      <!-- 添加评论表单 -->
                      <form @submit.prevent="submitComment(post.id)" class="mt-6 bg-background p-4 rounded-lg border border-background-light">
                        <h5 class="font-medium text-sm text-text mb-3">{{ t('community.forum.add_comment') }}</h5>
                        <div class="mb-3">
                          <input
                            type="text"
                            v-model="newMessage.user"
                            class="w-full px-4 py-2 text-sm rounded-lg border border-background-light bg-background focus:outline-none focus:ring-1 focus:ring-primary"
                            :placeholder="t('community.forum.username')"
                            required
                          >
                        </div>
                        
                        <div class="mb-3">
                          <textarea
                            v-model="newMessage.content"
                            rows="3"
                            class="w-full px-4 py-2 text-sm rounded-lg border border-background-light bg-background focus:outline-none focus:ring-1 focus:ring-primary"
                            :placeholder="t('community.forum.comment')"
                            required
                          ></textarea>
                        </div>
                        
                        <div class="flex justify-between items-center">
                                                <button
                        type="button"
                        class="px-4 py-2 border border-primary-light text-primary-light text-sm rounded-lg hover:bg-primary-light hover:bg-opacity-10 transition-colors duration-200"
                        @click="closeComment"
                      >
                        {{ t('community.forum.cancel') }}
                      </button>
                          
                          <button
                            type="submit"
                            class="px-4 py-2 bg-primary text-text text-sm rounded-lg hover:bg-primary-dark transition-colors duration-200 flex items-center"
                          >
                            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" viewBox="0 0 20 20" fill="currentColor">
                              <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-8.707l-3-3a1 1 0 00-1.414 0l-3 3a1 1 0 001.414 1.414L9 9.414V13a1 1 0 102 0V9.414l1.293 1.293a1 1 0 001.414-1.414z" clip-rule="evenodd" />
                            </svg>
                            {{ t('community.forum.submit') }}
                          </button>
                        </div>
                      </form>
                    </div>
                  </div>
                  
                  <!-- 查看评论按钮 -->
                  <div v-else class="p-4 flex justify-between items-center border-t border-background-light bg-background-dark bg-opacity-5">
                    <span class="text-sm text-text-secondary flex items-center">
                      <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" viewBox="0 0 20 20" fill="currentColor">
                        <path fill-rule="evenodd" d="M18 10c0 3.866-3.582 7-8 7a8.841 8.841 0 01-4.083-.98L2 17l1.338-3.123C2.493 12.767 2 11.434 2 10c0-3.866 3.582-7 8-7s8 3.134 8 7zM7 9H5v2h2V9zm8 0h-2v2h2V9zM9 9h2v2H9V9z" clip-rule="evenodd" />
                      </svg>
                      {{ t('community.forum.comments') }}: {{ post.comments.length }}
                    </span>
                    <button
                      @click="prepareComment(post.id)"
                      class="px-4 py-2 text-sm bg-primary text-text rounded-lg hover:bg-primary-dark transition-colors duration-200 flex items-center"
                    >
                      <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1" viewBox="0 0 20 20" fill="currentColor">
                        <path d="M10 12a2 2 0 100-4 2 2 0 000 4z" />
                        <path fill-rule="evenodd" d="M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z" clip-rule="evenodd" />
                      </svg>
                      {{ t('community.forum.view_comments') }}
                    </button>
                  </div>
                </div>
              </div>
              <div class="p-6">
                <h4 class="text-xl font-bold text-text mb-2">{{ event.title }}</h4>
                <p class="text-text-secondary mb-4">{{ event.date }}</p>
                <a :href="event.recording" class="px-6 py-2 bg-transparent border border-primary-light text-primary-light rounded-lg flex items-center justify-center btn-hover-shadow">
                  <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
                  </svg>
                  {{ t('community.events.watch') }}
                </a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    
    <!-- Community Contributors Section -->
    <!-- 3. 信息公示 Section -->
    <section class="py-16 px-6 md:px-12 lg:px-24">
      <div class="container mx-auto">
        <div class="max-w-3xl mx-auto text-center mb-12">
          <h2 class="text-3xl font-bold text-text mb-4 wow animate__animated animate__fadeInUp">
            {{ t('community.contributors.title') }}
          </h2>
          <p class="text-text-secondary wow animate__animated animate__fadeInUp animate__delay-xs">
            {{ t('community.contributors.description') }}
          </p>
        </div>
        <h2 class="text-3xl font-bold text-text mb-4 text-center wow animate__animated animate__fadeInUp">
          {{ t('community.announcements.title') }}
        </h2>
        
        <h3 class="text-xl font-medium text-text mb-8 text-center wow animate__animated animate__fadeIn animate__delay-xs">
          {{ t('community.announcements.awards_title') }}
        </h3>
        
        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 mb-12">
          <div v-for="contributor in contributors" :key="contributor.id" class="bg-background-light rounded-xl p-6 text-center shadow-card wow animate__animated animate__fadeInUp">
            <div class="w-24 h-24 rounded-full mx-auto mb-4 overflow-hidden">
              <img :src="contributor.image" :alt="contributor.name" class="w-full h-full object-cover" />
        <div class="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-3xl mx-auto">
          <div
            v-for="reward in rewardData"
            :key="reward.id"
            class="bg-background-light rounded-xl p-6 shadow-card hover:shadow-lg transition-all duration-300 flex items-center"
          >
            <div class="text-4xl mr-4">{{ reward.icon }}</div>
            <div class="flex-1">
              <p class="text-lg text-text font-medium">{{ reward.title }}</p>
            </div>
            <h4 class="text-xl font-bold text-text mb-1">{{ contributor.name }}</h4>
            <p class="text-text-secondary mb-4">{{ contributor.role }}</p>
            <a :href="contributor.github" class="text-primary-light hover:text-primary flex items-center justify-center">
              <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" fill="currentColor" viewBox="0 0 24 24">
                <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
              </svg>
              GitHub
            </a>
          </div>
        </div>
      </div>
    </section>
    
    <!-- 4. 社区风采 Section -->
    <section class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
      <div class="container mx-auto">
        <h2 class="text-3xl font-bold text-text mb-4 text-center wow animate__animated animate__fadeInUp">
          {{ t('community.highlights.title') }}
        </h2>
        
        <div class="text-center">
          <a href="#" class="inline-block px-8 py-3 bg-primary text-text rounded-lg btn-hover-scale">
            {{ t('community.contributors.become') }}
          </a>
        <h3 class="text-xl font-medium text-text mb-8 text-center wow animate__animated animate__fadeIn animate__delay-xs">
          {{ t('community.highlights.ugc_title') }}
        </h3>
        
        <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
          <div
            v-for="event in communityEvents"
            :key="event.id"
            class="bg-background rounded-xl overflow-hidden shadow-card hover:shadow-lg transition-all duration-300"
          >
            <div class="h-48 overflow-hidden">
              <img :src="event.image" :alt="event.title" class="w-full h-full object-cover hover:scale-105 transition-transform duration-300">
            </div>
            <div class="p-6">
              <h4 class="text-lg font-bold text-text mb-2">{{ event.title }}</h4>
              <p class="text-text-secondary">{{ event.date }}</p>
            </div>
          </div>
        </div>
      </div>
    </section>
@ -283,11 +490,11 @@ const contributors = ref([

 <style scoped>
 .shadow-card {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .shadow-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
 }
 </style> 
--- a/src/views/Ecosystem.vue
+++ b/src/views/Ecosystem.vue
@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import EcosystemCard from '@/components/ecosystem/EcosystemCard.vue';
 import CompanyCard from '@/components/ecosystem/CompanyCard.vue';
 import EcosystemCard from '../components/ecosystem/EcosystemCard.vue';
 import CompanyCard from '../components/ecosystem/CompanyCard.vue';
 // 移除重复引用的组件
 // import MarketDataModule from '@/components/rewards/MarketDataModule.vue';
 // import TokenBurnModule from '@/components/rewards/TokenBurnModule.vue';

 const { t } = useI18n();
 const { t, locale } = useI18n();

 // 当前选中的分类
 const selectedCategory = ref('all');
@ -23,140 +23,168 @@ const categories = [
  { id: 'social', name: t('ecosystem.categories.social') },
 ];

 // 项目数据
 const projects = [
 // 使用字符串变量而不是计算属性
 const isZhLang = computed(() => locale.value === 'zh');

 // 项目数据 - 使用计算属性实现响应式
 const projects = computed(() => [
  {
    id: 1,
    name: 'MOSE Swap',
    description: t('projects.mose_swap'),
    name: isZhLang.value ? '闪兑池' : 'Flash Exchange Pool',
    description: isZhLang.value ? '高效率的闪兑池服务，预计2025年6-12月上线' : 'Efficient flash exchange pool service, expected to launch between June-December 2025',
    category: 'defi',
    image: '/public/images.png',
    url: 'https://moseswap.io',
    featured: true
    image: '/public/LOGO.png',
    url: '#',
    featured: true,
    launchDate: '2025-06'
  },
  {
    id: 2,
    name: 'MOSE NFT Marketplace',
    description: t('projects.mose_nft'),
    category: 'nft',
    image: '/public/images.png',
    url: 'https://mosenft.io',
    featured: true
    name: isZhLang.value ? 'Mosc C2C交易所' : 'Mosc C2C Exchange',
    description: isZhLang.value ? '点对点加密货币交易平台，预计2026年1-6月上线' : 'Peer-to-peer cryptocurrency trading platform, expected to launch between January-June 2026',
    category: 'defi',
    image: '/public/LOGO.png',
    url: '#',
    featured: true,
    launchDate: '2026-01'
  },
  {
    id: 3,
    name: 'MOSE DAO',
    description: t('projects.mose_dao'),
    category: 'dao',
    image: '/public/images.png',
    url: 'https://mosedao.io',
    featured: true
    name: isZhLang.value ? 'MoSe交易所' : 'MoSe Exchange',
    description: isZhLang.value ? '全功能加密货币交易所，预计2026年7月上线' : 'Full-featured cryptocurrency exchange, expected to launch in July 2026',
    category: 'defi',
    image: '/public/LOGO.png',
    url: '#',
    featured: true,
    launchDate: '2026-07'
  },
  {
    id: 4,
    name: 'MOSE Gaming',
    description: t('projects.mose_gaming'),
    category: 'gaming',
    image: '/public/images.png',
    url: 'https://mosegaming.io',
    featured: false
    name: isZhLang.value ? 'MOSE NFT市场' : 'MOSE NFT Marketplace',
    description: t('projects.mose_nft'),
    category: 'nft',
    image: '/public/LOGO.png',
    url: 'https://mosenft.io',
    featured: false,
    launchDate: '2026-08'
  },
  {
    id: 5,
    name: 'MOSE Bridge',
    name: isZhLang.value ? 'MOSE跨链桥' : 'MOSE Bridge',
    description: t('projects.mose_bridge'),
    category: 'infrastructure',
    image: '/public/images.png',
    image: '/public/LOGO.png',
    url: 'https://mosebridge.io',
    featured: true
    featured: false,
    launchDate: '2026-09'
  },
  {
    id: 6,
    name: 'MOSE Social',
    name: isZhLang.value ? 'MOSE社交' : 'MOSE Social',
    description: t('projects.mose_social'),
    category: 'social',
    image: '/public/images.png',
    image: '/public/LOGO.png',
    url: 'https://mosesocial.io',
    featured: false
    featured: false,
    launchDate: '2026-10'
  },
  {
    id: 7,
    name: 'MOSE Lending',
    name: isZhLang.value ? 'MOSE借贷' : 'MOSE Lending',
    description: t('projects.mose_lending'),
    category: 'defi',
    image: '/public/images.png',
    image: '/public/LOGO.png',
    url: 'https://moselending.io',
    featured: false
    featured: false,
    launchDate: '2026-11'
  },
  {
    id: 8,
    name: 'MOSE Staking',
    name: isZhLang.value ? 'MOSE质押' : 'MOSE Staking',
    description: t('projects.mose_staking'),
    category: 'defi',
    image: '/public/images.png',
    image: '/public/LOGO.png',
    url: 'https://mosestaking.io',
    featured: false
    featured: false,
    launchDate: '2026-12'
  }
 ];
 ]);

 // 合作伙伴数据
 const partners = [
 // 合作伙伴数据 - 使用计算属性实现响应式
 const partners = computed(() => [
  {
    id: 1,
    name: 'Partner 1',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴1' : 'Partner 1',
    logo: '/public/LOGO.png',
    url: 'https://partner1.com'
  },
  {
    id: 2,
    name: 'Partner 2',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴2' : 'Partner 2',
    logo: '/public/LOGO.png',
    url: 'https://partner2.com'
  },
  {
    id: 3,
    name: 'Partner 3',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴3' : 'Partner 3',
    logo: '/public/LOGO.png',
    url: 'https://partner3.com'
  },
  {
    id: 4,
    name: 'Partner 4',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴4' : 'Partner 4',
    logo: '/public/LOGO.png',
    url: 'https://partner4.com'
  },
  {
    id: 5,
    name: 'Partner 5',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴5' : 'Partner 5',
    logo: '/public/LOGO.png',
    url: 'https://partner5.com'
  },
  {
    id: 6,
    name: 'Partner 6',
    logo: '/public/images.png',
    name: isZhLang.value ? '合作伙伴6' : 'Partner 6',
    logo: '/public/LOGO.png',
    url: 'https://partner6.com'
  }
 ];
 ]);

 // 筛选项目
 const filteredProjects = computed(() => {
  if (selectedCategory.value === 'all') {
    return projects;
    return projects.value;
  } else {
    return projects.filter(project => project.category === selectedCategory.value);
    return projects.value.filter(project => project.category === selectedCategory.value);
  }
 });

 // 特色项目
 const featuredProjects = computed(() => {
  return projects.filter(project => project.featured);
  return projects.value.filter(project => project.featured);
 });

 // 选择分类
 const selectCategory = (category: string) => {
  selectedCategory.value = category;
 };

 // 格式化发布日期
 const formatLaunchDate = (dateString: string, isZh: boolean) => {
  if (!dateString) return '';
  
  if (isZh) {
    if (dateString.startsWith('2025')) return '2025年下半年';
    if (dateString === '2026-01') return '2026年上半年';
    if (dateString === '2026-07') return '2026年7月';
    return '2026年下半年';
  } else {
    if (dateString.startsWith('2025')) return '2025 H2';
    if (dateString === '2026-01') return '2026 H1';
    if (dateString === '2026-07') return 'July 2026';
    return '2026 H2';
  }
 };
 </script>

 <template>
@ -214,6 +242,15 @@ const selectCategory = (category: string) => {
            <div class="p-6">
              <h3 class="text-xl font-bold text-text mb-2">{{ project.name }}</h3>
              <p class="text-text-secondary mb-4">{{ project.description }}</p>
              
              <!-- 发布时间标签 -->
              <div class="mb-4">
                <span class="px-3 py-1 bg-primary bg-opacity-10 text-primary-light text-sm rounded-full">
                  {{ isZhLang ? '预计上线: ' : 'Expected Launch: ' }} 
                  {{ formatLaunchDate(project.launchDate, isZhLang) }}
                </span>
              </div>
              
              <div class="flex justify-between items-center">
                <span class="px-3 py-1 bg-background text-primary-light text-xs rounded-full">
                  {{ t(`ecosystem.categories.${project.category}`) }}
@ -236,10 +273,14 @@ const selectCategory = (category: string) => {
    <!-- All Projects Section -->
    <section id="all-projects" class="py-16 px-6 md:px-12 lg:px-24 bg-background-light">
      <div class="container mx-auto">
        <h2 class="text-2xl md:text-3xl font-bold text-text mb-10 wow animate__animated animate__fadeInUp animate__duration-fast">
        <h2 class="text-2xl md:text-3xl font-bold text-text mb-4 wow animate__animated animate__fadeInUp animate__duration-fast">
          {{ t('ecosystem.title') }}
        </h2>
        
        <p class="text-text-secondary max-w-3xl mb-10 wow animate__animated animate__fadeIn animate__delay-xs">
          {{ isZhLang ? 'DApp项目展示 - 按计划发布时间排序' : 'DApp Projects - Sorted by scheduled release date' }}
        </p>
        
        <!-- Categories Filter -->
        <div class="flex flex-wrap gap-2 mb-10 wow animate__animated animate__fadeInUp animate__delay-xs animate__duration-fast">
          <button 
@ -266,6 +307,15 @@ const selectCategory = (category: string) => {
            <div class="p-4">
              <h3 class="text-lg font-bold text-text mb-2">{{ project.name }}</h3>
              <p class="text-text-secondary text-sm mb-4 line-clamp-2">{{ project.description }}</p>
              
              <!-- 发布时间标签 -->
              <div class="mb-4">
                <span class="px-2 py-1 bg-primary bg-opacity-10 text-primary-light text-xs rounded-full">
                  {{ isZhLang ? '预计上线: ' : 'Expected Launch: ' }} 
                  {{ formatLaunchDate(project.launchDate, isZhLang) }}
                </span>
              </div>
              
              <div class="flex justify-between items-center">
                <span class="px-2 py-0.5 bg-background-light text-primary-light text-xs rounded-full">
                  {{ t(`ecosystem.categories.${project.category}`) }}
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@ -1,15 +1,16 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import { ref } from 'vue';
 import MilestoneModule from '@/components/home/MilestoneModule.vue';
 import EventsModule from '@/components/home/EventsModule.vue';
 import RewardModule from '@/components/rewards/RewardModule.vue';
 import IncentiveModule from '@/components/rewards/IncentiveModule.vue';
 // 恢复MarketDataModule引用，因为首页需要展示市场数据
 import MarketDataModule from '@/components/rewards/MarketDataModule.vue';
 // TokenBurnModule在RewardModule中已包含相关功能，移除重复引用
 // import TokenBurnModule from '@/components/rewards/TokenBurnModule.vue';
 import MilestoneModule from '../components/home/MilestoneModule.vue';
 import EventsModule from '../components/home/EventsModule.vue';
 import RewardModule from '../components/rewards/RewardModule.vue';
 import IncentiveModule from '../components/rewards/IncentiveModule.vue';
 import MarketDataModule from '../components/rewards/MarketDataModule.vue';
 import NewsModule from '../components/home/NewsModule.vue';
 import CoreValuesModule from '../components/home/CoreValuesModule.vue';
 import ProjectIntroModule from '../components/home/ProjectIntroModule.vue';
 import PartnersModule from '../components/home/PartnersModule.vue';

 const { t } = useI18n();
 const router = useRouter();
@ -140,6 +141,18 @@ const formatTime = (timeInSeconds: number) => {
      </div>
    </section>
    
    <!-- 最新动态模块 -->
    <NewsModule />
    
    <!-- 核心价值主张模块 -->
    <CoreValuesModule />
    
    <!-- 项目简介模块 -->
    <ProjectIntroModule />
    
    <!-- 合作伙伴LOGO墙模块 -->
    <PartnersModule />
    
    <!-- Video Section -->
    <section class="py-16 px-6 md:px-12 lg:px-24">
      <div class="container mx-auto">
@ -152,8 +165,12 @@ const formatTime = (timeInSeconds: number) => {
            <video 
              ref="videoRef"
              src="/public/MOSEVideo.mp4" 
              class="w-full h-auto"
              poster="/public/images.png"
              class="w-full h-full object-cover"
              autoplay
              muted
              loop
              playsinline
              poster="/public/LOGO.png"
              @timeupdate="updateProgress"
              @click="togglePlay"
            ></video>
@ -254,7 +271,7 @@ const formatTime = (timeInSeconds: number) => {
    <!-- 收益制度模块 -->
    <IncentiveModule />
    
    <!-- 恢复市场数据模块 -->
    <!-- 市场数据模块 -->
    <MarketDataModule />
    
    <!-- Call to Action -->
--- a/src/views/Technology.vue
+++ b/src/views/Technology.vue
@ -0,0 +1,42 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n';
 import ArchitectureModule from '@/components/technology/ArchitectureModule.vue';
 import InnovationModule from '@/components/technology/InnovationModule.vue';
 import EcosystemIntegrationModule from '@/components/technology/EcosystemIntegrationModule.vue';

 const { t } = useI18n();
 </script>

 <template>
  <div class="bg-background min-h-screen">
    <!-- Hero Section -->
    <section class="relative py-24 px-6 md:px-12 lg:px-24 bg-background-dark overflow-hidden">
      <div class="container mx-auto relative z-10">
        <div class="max-w-3xl mx-auto text-center">
          <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-text mb-6 wow animate__animated animate__fadeInDown animate__duration-fast">
            {{ t('technology.hero.title') }}
          </h1>
          <p class="text-lg md:text-xl text-text-secondary mb-8 wow animate__animated animate__fadeIn animate__delay-xs animate__duration-fast">
            {{ t('technology.hero.subtitle') }}
          </p>
        </div>
      </div>
      
      <!-- Background Decoration -->
      <div class="absolute top-0 left-0 w-full h-full overflow-hidden opacity-10">
        <div class="absolute -top-24 -left-24 w-64 h-64 rounded-full bg-primary-light blur-3xl wow animate__animated animate__pulse animate__infinite"></div>
        <div class="absolute top-1/2 right-0 w-80 h-80 rounded-full bg-secondary blur-3xl wow animate__animated animate__pulse animate__infinite animate__delay-sm"></div>
        <div class="absolute -bottom-24 left-1/3 w-72 h-72 rounded-full bg-accent blur-3xl wow animate__animated animate__pulse animate__infinite animate__delay-md"></div>
      </div>
    </section>
    
    <!-- 技术架构模块 -->
    <ArchitectureModule />
    
    <!-- 核心创新模块 -->
    <InnovationModule />
    
    <!-- 生态系统集成模块 -->
    <EcosystemIntegrationModule />
  </div>
 </template> 
--- a/website_structure.txt
+++ b/website_structure.txt
@ -1,446 +1,189 @@
 # 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)
 # MOSE Web 网站结构文档

 ## 1. 整体架构

 MOSE Web 是一个基于 Vue 3 + TypeScript 构建的多语言网站，展示全球隐私跨链基础设施的官方网站。项目使用了以下技术栈：

 - **前端框架**：Vue 3 + TypeScript
 - **样式**：Tailwind CSS
 - **动画**：animate.css, wow.js
 - **国际化**：vue-i18n (支持中文、英文、日语)
 - **路由**：Vue Router
 - **媒体**：视频播放器

 ## 2. 页面结构

 ### 2.1 首页 (Home.vue)
 - **英雄区**：展示主标题、副标题和行动号召按钮
 - **视频区**：播放 MOSEVideo.mp4，自定义播放器控件
 - **里程碑模块**：展示项目发展里程碑，包括2026年7月的平台扩展计划
 - **活动计划模块**：展示即将举行的活动和会议
 - **奖励机制模块**：展示注册空投和代币销毁机制
 - **收益制度模块**：展示V4和V5两种激励机制
 - **市场数据模块**：展示交易规模、年增长率和安全事件数据
 - **行动号召区**：引导用户探索生态系统

 ### 2.2 生态系统页面 (Ecosystem.vue)
 - **英雄区**：展示生态系统标题和描述
 - **十大生态卡片**：展示MOSE的十大生态系统组件
 - **十大分公司布局**：展示全球公司分布和详情
 - **特色项目**：展示精选的生态系统项目
 - **所有项目**：按类别展示所有项目，支持筛选
 - **合作伙伴**：展示战略合作伙伴
 - **行动号召区**：鼓励加入生态系统

 ### 2.3 关于我们页面 (About.vue)
 - **英雄区**：展示关于我们的标题和描述
 - **我们的故事**：介绍MOSE的历史和使命
 - **团队介绍**：展示核心团队成员
 - **发展历程**：展示项目的重要里程碑

 ### 2.4 资源页面 (Resources.vue)
 - **英雄区**：展示资源标题和描述
 - **资源分类**：按类别展示各种资源
 - **资源项目**：展示文档、教程、SDK等资源
 - **订阅区**：允许用户订阅通讯

 ### 2.5 社区页面 (Community.vue)
 - **英雄区**：展示社区标题和描述
 - **社区渠道**：展示Discord、Telegram等社区渠道
 - **社区活动**：展示即将举行和过去的活动
 - **社区贡献者**：展示社区贡献者

 ### 2.6 常见问题页面 (FAQ.vue)
 - **英雄区**：展示FAQ标题和描述
 - **搜索区**：允许用户搜索问题
 - **问题分类**：按类别展示常见问题
 - **问题列表**：展示问题和答案

 ### 2.7 联系我们页面 (Contact.vue)
 - **英雄区**：展示联系我们的标题和描述
 - **联系表单**：允许用户发送消息
 - **联系信息**：展示地址、电话、工作时间等
 - **社交媒体**：展示社交媒体链接

 ### 2.8 404页面 (NotFound.vue)
 - 当访问不存在的路径时显示的页面

 ## 3. 组件结构

 ### 3.1 布局组件
 - **NavBar.vue**：顶部导航栏，包含菜单和语言切换
 - **Footer.vue**：页脚，包含版权信息和链接

 ### 3.2 首页组件
 - **MilestoneModule.vue**：展示发展里程碑，包括2026年7月的平台扩展计划
 - **EventsModule.vue**：展示活动计划，包括新加坡共识大会等
 - **CoreValuesModule.vue**：展示核心价值主张（隐私保护、跨链互操作、合规安全）
 - **ProjectIntroModule.vue**：展示项目简介
 - **PartnersModule.vue**：展示合作伙伴LOGO墙
 - **NewsModule.vue**：展示最新动态

 ### 3.3 生态系统组件
 - **EcosystemCard.vue**：展示十大生态系统，包括MOSE L1链、闪兑盒子等
 - **CompanyCard.vue**：展示全球公司布局，包括新加坡总部等

 ### 3.4 奖励组件
 - **RewardModule.vue**：展示奖励机制和代币销毁机制
 - **IncentiveModule.vue**：展示收益制度和部分市场数据
 - **MarketDataModule.vue**：展示市场数据，包括交易规模、增长率等

 ### 3.5 通用组件
 - **HelloWorld.vue**：基础组件示例

 ## 4. 数据需求

 ### 4.1 里程碑数据
 - 日期、标题、描述、完成状态

 ### 4.2 活动计划数据
 - 日期、标题、描述、位置、链接、图标

 ### 4.3 生态系统数据
 - 名称、描述、图标、链接

 ### 4.4 公司布局数据
 - 名称、描述、业务重点、团队规模、位置、国旗、地图位置

 ### 4.5 奖励机制数据
 - 空投数据：总地址数、符合条件地址、每地址奖励、规则
 - 代币销毁数据：已销毁数量、目标销毁数量、销毁比例、停止阈值、机制描述

 ### 4.6 激励模型数据
 - 名称、金额、特点、颜色、激活状态

 ### 4.7 市场数据
 - 交易规模、增长率、安全事件数据

 ### 4.8 项目数据
 - ID、名称、描述、类别、图片、URL、是否特色

 ### 4.9 合作伙伴数据
 - ID、名称、Logo、URL

 ### 4.10 核心价值主张数据
 - 图标、标题、描述

 ### 4.11 项目简介数据
 - 文本内容

 ### 4.12 最新动态数据
 - 标题、日期、内容

 ## 5. 国际化支持

 项目支持三种语言：
 - 中文 (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组件中。 
 - 英文 (en.json)
 - 日语 (ja.json)

 每个语言文件包含所有页面和组件的文本内容，按照层次结构组织。

 ## 6. 路由配置

 路由配置在 router/index.ts 中定义，支持以下路由：
 - / - 首页
 - /ecosystem - 生态系统
 - /about - 关于我们
 - /resources - 资源
 - /community - 社区
 - /faq - 常见问题
 - /contact - 联系我们
 - /* - 404页面

 ## 7. 样式主题

 网站使用深色主题，主要颜色包括：
 - 主色：#1D4ED8 (蓝色)
 - 背景色：深色背景
 - 文本色：白色/灰色
 - 强调色：根据不同组件有不同的强调色

 样式使用 Tailwind CSS 实现，包括响应式设计，适配不同屏幕尺寸：
 - sm: 640px
 - md: 768px
 - lg: 1024px
 - xl: 1280px

 ## 8. 动画效果

 网站使用 animate.css 和 wow.js 实现动画效果，包括：
 - 淡入淡出
 - 滑动
 - 脉冲
 - 缩放
 - 悬浮

 ## 9. 性能优化

 - 图片优化：使用适当大小的图片
 - 延迟加载：非关键资源延迟加载
 - 组件复用：避免重复组件和代码
 - 条件渲染：根据需要渲染组件

 ## 10. 未来扩展

 - 集成实时数据API
 - 添加用户认证功能
 - 增强社区互动功能
 - 添加多语言内容管理系统 
--- a/映射.txt
+++ b/映射.txt
@ -0,0 +1,346 @@
 # MOSE 官网数据映射文件

 ## 首页数据 (Home.vue)

 ### 里程碑模块 (MilestoneModule)
 milestones:
  - date: "2023-Q1"
    title: 
      en: "Whitepaper Release"
      zh: "协议白皮书发布"
    description: 
      en: "Seed round financing $8M"
      zh: "种子轮融资800万美元"
    completed: true

  - date: "2023-Q4"
    title: 
      en: "Testnet Launch"
      zh: "测试网上线"
    description: 
      en: "Connected to Ethereum and BNB Chain"
      zh: "接入以太坊和BNB链"
    completed: true

  - date: "2024-Q2"
    title: 
      en: "Mainnet V1.0 Launch"
      zh: "主网V1.0发布"
    description: 
      en: "Daily transaction volume exceeds $100M"
      zh: "日交易量突破1亿美元"
    completed: true

 ### 活动计划模块 (EventsModule)
 events:
  - date: "2024-05"
    title: 
      en: "Consensus 2024 Singapore"
      zh: "新加坡共识大会2024"
    description: 
      en: "Keynote speech on privacy technology"
      zh: "隐私技术主题演讲"
    location: "Singapore"
    link: "#"

  - date: "2024-06"
    title: 
      en: "Tokyo Developer Hackathon"
      zh: "东京开发者黑客松"
    description: 
      en: "$500,000 prize pool"
      zh: "50万美元奖金池"
    location: "Tokyo"
    link: "#"

 ### 奖励机制模块 (RewardModule)
 airdrop:
  total_addresses: 100000
  eligible_addresses: 100000
  tokens_per_address: 50
  rules:
    en: 
      - "Daily release of 1%"
      - "Rewards stop when holdings < 100 MOSE"
      - "Unclaimed rewards expire after 15 days"
    zh:
      - "每日释放1%"
      - "持币少于100枚时停止释放"
      - "15日内未完成≥100枚闪兑则销毁"

 token_burn:
  current_burned: 210000000
  target_burned: 290000000
  burn_percentage: 72.41
  stop_threshold: 10000000
  mechanism:
    en: "100% of cross-chain and mixing fees burned"
    zh: "跨链与混币手续费100%销毁"

 ### 收益制度模块 (IncentiveModule)
 incentive_models:
  - id: 1
    name: 
      en: "Basic Mixing"
      zh: "基础混币"
    reward_amount: 0.3
    features:
      en:
        - "0.3% fee on transaction amount"
        - "Dynamic risk monitoring"
      zh:
        - "按交易额收取0.3%费用"
        - "动态风险监控"

  - id: 2
    name: 
      en: "Cross-chain Bridge"
      zh: "跨链桥"
    reward_amount: 0.3
    features:
      en:
        - "0.3% fee per cross-chain transaction"
        - "Dual income from fees and staking"
      zh:
        - "每笔跨链交易收取0.3%手续费"
        - "手续费+质押双收益"

 market_data:
  transaction_volume: 5000000
  growth_rate: 300
  security_incidents: 2000000000

 ## 生态系统页面数据 (Ecosystem.vue)

 ### 十大生态卡片
 ecosystems:
  - id: 1
    title: 
      en: "MOSE L1 Chain"
      zh: "MOSE L1链"
    description: 
      en: "Supports xIoApp deployment"
      zh: "支持xIoApp部署"
    icon: "/public/ecosystem/l1-chain.svg"
    link: "#"

  - id: 2
    title: 
      en: "FlashBox"
      zh: "闪兑盒子"
    description: 
      en: "Instant anonymous exchange"
      zh: "即时匿名兑换"
    icon: "/public/ecosystem/flashbox.svg"
    link: "#"

 ### 全球公司布局
 companies:
  - id: 1
    name: 
      en: "Singapore Headquarters"
      zh: "新加坡总部"
    description: 
      en: "Global fintech hub overseeing R&D and compliance"
      zh: "全球金融科技中心统筹技术研发与合规"
    focus: 
      en: "Technology R&D, Compliance Strategy"
      zh: "技术研发、合规战略"
    team: 
      en: "Core technical team"
      zh: "核心技术团队"

  - id: 2
    name: 
      en: "Hong Kong Branch"
      zh: "香港分公司"
    description: 
      en: "Serving APAC financial markets"
      zh: "服务亚太金融市场"
    focus: 
      en: "Institutional partnerships"
      zh: "机构合作"
    team: 
      en: "Business development"
      zh: "业务拓展团队"

 ### 合作伙伴
 partners:
  - id: 1
    name: "Binance Labs"
    logo: "/public/partners/binance-labs.png"
    url: "https://labs.binance.com/"

  - id: 2
    name: "Polychain Capital"
    logo: "/public/partners/polychain.png"
    url: "https://polychain.capital/"

 ## 关于页面数据 (About.vue)

 ### 团队介绍
 team_members:
  - id: 1
    name: "James Park"
    position: 
      en: "Technical President"
      zh: "技术总裁"
    bio: 
      en: "Former head of Combase Asia Pacific, led DeFi products with 40% YoY growth"
      zh: "前Combase亚太负责人，主导DeFi产品年增长40%"
    photo: "/public/team/james-park.jpg"
    social: "https://linkedin.com/in/jamespark"

  - id: 2
    name: "Sophia Müller"
    position: 
      en: "Global Operations President"
      zh: "全球运营总裁"
    bio: 
      en: "Formerly at Branco Europe, managed compliance teams in 50+ countries"
      zh: "曾任职Branco欧洲，管理超50国合规团队"
    photo: "/public/team/sophia-muller.jpg"
    social: "https://linkedin.com/in/sophiamuller"

 ### 发展历程
 roadmap:
  - date: "2023-Q1"
    title: 
      en: "Whitepaper Release"
      zh: "白皮书发布"
    description: 
      en: "$8M seed funding secured"
      zh: "完成800万美元种子轮融资"
    completed: true

  - date: "2024-Q2"
    title: 
      en: "Mainnet V1.0 Launch"
      zh: "主网V1.0发布"
    description: 
      en: "Daily transaction volume exceeded $100M"
      zh: "日交易量突破1亿美元"
    completed: true

 ## 社区页面数据 (Community.vue)

 ### 社交媒体
 social_media:
  - platform: "Twitter"
    icon: "twitter"
    url: "https://twitter.com/mose202399"
    followers: 12500

  - platform: "Telegram"
    icon: "telegram"
    url: "https://t.me/Nosafuture"
    followers: 18000

 ### 公告
 announcements:
  - date: "2023-10-15"
    title: 
      en: "Mainnet V1.0 Launch Success"
      zh: "主网V1.0成功上线"
    summary: 
      en: "Daily transaction volume exceeded $100 million"
      zh: "日交易量突破1亿美元大关"
    link: "#"

 ## 资源页面数据 (Resources.vue)

 ### 文档资源
 documents:
  - title: 
      en: "Technical Whitepaper"
      zh: "技术白皮书"
    description: 
      en: "Complete technical specifications"
      zh: "完整技术规范"
    category: "technical"
    link: "/whitepaper.pdf"

  - title: 
      en: "Token Economics"
      zh: "代币经济学"
    description: 
      en: "Token distribution and burn mechanism"
      zh: "代币分配与销毁机制"
    category: "economic"
    link: "/token-economics.pdf"

 ## FAQ页面数据 (FAQ.vue)

 ### 问题分类
 categories:
  - id: "technology"
    name: 
      en: "Technology"
      zh: "技术问题"
  - id: "token"
    name: 
      en: "Token Economics"
      zh: "代币经济"

 ### 问答列表
 questions:
  - id: 1
    category: "technology"
    question: 
      en: "How does MOSE ensure cross-chain privacy?"
      zh: "MOSE如何保证跨链隐私？"
    answer: 
      en: "Using F4-SNAPK5 algorithm and zero-knowledge proofs for anonymous atomic swaps with <30s latency"
      zh: "基于F4-SNAPK5算法和零知识证明实现匿名原子交换，延迟<30秒"

  - id: 2
    category: "token"
    question: 
      en: "What is the total supply of MOSE tokens?"
      zh: "MOSE代币的总供应量是多少？"
    answer: 
      en: "300 million tokens, with 290 million to be burned through fee mechanisms"
      zh: "总发行量3亿枚，通过手续费机制销毁2.9亿枚"

 ## 联系页面数据 (Contact.vue)

 ### 地点信息
 locations:
  - city: 
      en: "Singapore"
      zh: "新加坡"
    address: 
      en: "1 Raffles Place, Singapore 048616"
      zh: "新加坡莱佛士坊1号"
    phone: "+65 1234 5678"
    email: "info@mose.org"

 ## 共享数据

 ### 合作伙伴数据 (多页面共享)
 partners_shared:
  - id: 1
    name: "Aleo"
    logo: "/public/partners/aleo.png"
    description: 
      en: "Zero-knowledge proof technology partner"
      zh: "零知识证明技术合作伙伴"
    url: "https://www.aleo.org/"

  - id: 2
    name: "StarkWare"
    logo: "/public/partners/starkware.png"
    description: 
      en: "ZK-Rollup scalability solutions"
      zh: "ZK-Rollup可扩展性解决方案"
    url: "https://starkware.co/"

 ### 代币销毁数据
 token_burn_shared:
  current_burned: 210000000
  target_burned: 290000000
  burn_percentage: 72.41
  stop_threshold: 10000000
  burn_mechanism: 
    en: "100% of cross-chain and mixing fees burned until 10 million tokens remain"
    zh: "跨链与混币手续费100%销毁，直至代币总量降至1000万枚"