Add favicon SVG with gradient background and letter "R"

2025-12-30 21:04:47 +07:00
parent 29a25d6456
commit c91fab6122
21 changed files with 7510 additions and 70 deletions
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />

-    <link rel="shortcut icon" type="image/png" href="/favicon.png" />
+    <link rel="shortcut icon" type="image/svg" href="/favicon.svg" />

    <!-- add to homescreen for ios -->
    <meta name="mobile-web-app-capable" content="yes" />
--- a/packages/distribute/.gitignore
+++ b/packages/distribute/.gitignore
@@ -0,0 +1,23 @@
+# Nuxt dev/build outputs
+.output
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
--- a/packages/distribute/README.md
+++ b/packages/distribute/README.md
@@ -0,0 +1,166 @@
+# Riwa App 分发页
+
+基于 **Nuxt 4 + NuxtUI + TailwindCSS 4** 构建的现代化应用分发页面。
+
+## 技术栈
+
+- **框架**: Nuxt 4.2.2
+- **UI 库**: Nuxt UI 4.3.0 (内置 TailwindCSS 4)
+- **国际化**: @nuxtjs/i18n 10.2.1
+- **语言**: TypeScript 5.9.3
+- **代码规范**: @nuxt/eslint 1.12.1
+
+## 功能特性
+
+- ✨ 基于 NuxtUI 组件的简洁现代 UI
+- 🌙 自动深色模式支持（系统同步）
+- 🌍 多语言支持（中文/英文）
+- 📱 自动检测平台（iOS/Android/Desktop）
+- 📊 实时下载统计展示
+- 📝 版本更新日志
+- 📖 安装指引说明
+- 🔗 支持 iOS、Android、H5 三端下载
+- 🚀 SSR/SSG 支持
+- ⚡ Nitro 服务器引擎
+
+## 开发
+
+```bash
+# 安装依赖
+pnpm install
+
+# 启动开发服务器
+pnpm dev
+
+# 构建生产版本
+pnpm build
+
+# 预览生产构建
+pnpm preview
+
+# 生成静态站点
+pnpm generate
+```
+
+## 配置
+
+### 更新版本信息
+
+编辑 `server/utils/versions.ts` 文件：
+
+```typescript
+export const currentVersion: AppVersion = {
+  version: '1.0.0',
+  buildNumber: '100',
+  releaseDate: '2025-12-30',
+  releaseNotes: {
+    'zh-CN': ['更新内容...'],
+    'en-US': ['What\'s new...'],
+  },
+  downloads: {
+    ios: 'https://example.com/app.ipa',
+    android: 'https://example.com/app.apk',
+    h5: 'https://app.example.com',
+  },
+}
+```
+
+### 接入真实 API
+
+替换 `server/utils/versions.ts` 中的以下函数：
+
+- `fetchDownloadStats()` - 获取下载统计
+- `trackDownload()` - 记录下载事件
+
+或修改 `server/api/` 目录下的 API 路由文件。
+
+### 自定义主题
+
+Nuxt UI 使用 TailwindCSS 4，可在 `nuxt.config.ts` 中配置：
+
+```typescript
+export default defineNuxtConfig({
+  colorMode: {
+    preference: 'system', // 'light' | 'dark' | 'system'
+  },
+})
+```
+
+## 目录结构
+
+```
+packages/distribute/
+├── server/
+│   ├── api/                 # API 路由
+│   │   ├── version.get.ts   # 获取版本信息
+│   │   ├── stats.get.ts     # 获取统计数据
+│   │   └── track/
+│   │       └── [platform].post.ts  # 记录下载
+│   └── utils/
+│       └── versions.ts      # 版本数据和工具函数
+├── composables/
+│   └── usePlatformDetection.ts  # 平台检测 composable
+├── locales/
+│   ├── zh-CN.json          # 简体中文
+│   └── en-US.json          # 英文
+├── types/
+│   └── index.ts            # TypeScript 类型定义
+├── public/
+│   └── favicon.svg         # 网站图标
+├── app.vue                 # 主应用组件
+├── nuxt.config.ts          # Nuxt 配置
+├── tsconfig.json           # TypeScript 配置
+└── package.json
+```
+
+## API 路由
+
+- `GET /api/version` - 获取当前版本信息
+- `GET /api/stats` - 获取下载统计
+- `POST /api/track/:platform` - 记录下载事件（platform: ios | android | h5）
+
+## 部署
+
+### 静态站点生成（SSG）
+
+```bash
+pnpm generate
+```
+
+生成的静态文件在 `.output/public` 目录，可部署到：
+- Vercel
+- Netlify
+- GitHub Pages
+- Cloudflare Pages
+
+### 服务器端渲染（SSR）
+
+```bash
+pnpm build
+```
+
+使用 Nitro 服务器引擎，可部署到：
+- Vercel
+- Netlify Functions
+- Cloudflare Workers
+- Node.js 服务器
+
+## 自动导入
+
+Nuxt 自动导入以下内容：
+- Vue 3 API（ref, computed, watch 等）
+- Nuxt 组件和工具函数
+- NuxtUI 组件（UButton, UCard, UIcon 等）
+- Composables（自定义的 composables）
+
+无需手动 import！
+
+## 图标
+
+使用 NuxtUI 内置的 Iconify 图标：
+- Heroicons: `i-heroicons-*`
+- 其他图标集: 访问 [Iconify](https://icon-sets.iconify.design/)
+
+## License
+
+MIT
--- a/packages/distribute/app.vue
+++ b/packages/distribute/app.vue
@@ -0,0 +1,251 @@
+<script setup lang="ts">
+import type { DownloadStats } from '~/types'
+
+const { t, locale, setLocale } = useI18n()
+const colorMode = useColorMode()
+const { platform, isIOS, isAndroid } = usePlatformDetection()
+
+// 版本数据
+const { data: versionData } = await useFetch('/api/version')
+const version = computed(() => versionData.value || {
+  version: '1.0.0',
+  buildNumber: '100',
+  releaseDate: '2025-12-30',
+  releaseNotes: { 'zh-CN': [], 'en-US': [] },
+  downloads: { ios: '', android: '', h5: '' },
+})
+
+// 下载统计
+const { data: stats, refresh: refreshStats } = await useFetch<DownloadStats>('/api/stats')
+
+// 切换语言
+function toggleLanguage() {
+  setLocale(locale.value === 'zh-CN' ? 'en-US' : 'zh-CN')
+}
+
+// 下载处理
+async function handleDownload(type: 'ios' | 'android' | 'h5') {
+  const url = version.value.downloads[type]
+
+  if (type === 'h5') {
+    navigateTo(url, { external: true, open: { target: '_blank' } })
+  }
+  else {
+    navigateTo(url, { external: true })
+  }
+
+  await $fetch(`/api/track/${type}`, { method: 'POST' })
+  await refreshStats()
+}
+
+const isDark = computed(() => colorMode.value === 'dark')
+</script>
+
+<template>
+  <UApp>
+    <div class="min-h-screen">
+      <!-- Header -->
+    <UContainer>
+      <header class="sticky top-0 z-50 border-b border-gray-200 dark:border-gray-800 bg-white/80 dark:bg-gray-900/80 backdrop-blur-md">
+        <div class="flex items-center justify-between py-4">
+          <div class="flex items-center gap-3">
+            <div class="size-10 rounded-xl bg-linear-to-br from-primary-500 to-primary-600 flex items-center justify-center text-white font-bold text-xl">
+              R
+            </div>
+            <h1 class="text-xl font-bold text-gray-900 dark:text-white">
+              {{ t('appName') }}
+            </h1>
+          </div>
+
+          <div class="flex items-center gap-2">
+            <UButton
+              :label="locale === 'zh-CN' ? 'EN' : '中文'"
+              color="neutral"
+              variant="ghost"
+              @click="toggleLanguage"
+            />
+            <UButton
+              :icon="isDark ? 'i-heroicons-sun' : 'i-heroicons-moon'"
+              color="neutral"
+              variant="ghost"
+              @click="colorMode.preference = isDark ? 'light' : 'dark'"
+            />
+          </div>
+        </div>
+      </header>
+    </UContainer>
+
+    <!-- Main Content -->
+    <UContainer class="py-12">
+      <!-- Hero Section -->
+      <div class="text-center mb-16">
+        <div class="size-24 mx-auto mb-6 rounded-3xl bg-linear-to-br from-primary-500 to-primary-600 flex items-center justify-center shadow-xl">
+          <span class="text-white font-bold text-4xl">R</span>
+        </div>
+        <h2 class="text-4xl font-bold mb-4 text-gray-900 dark:text-white">
+          {{ t('downloadTitle') }}
+        </h2>
+        <div class="flex items-center justify-center gap-4 text-sm text-gray-600 dark:text-gray-400">
+          <span>{{ t('version') }} {{ version.version }}</span>
+          <span>•</span>
+          <span>{{ t('updateDate') }} {{ version.releaseDate }}</span>
+        </div>
+      </div>
+
+      <!-- Download Buttons -->
+      <div class="grid md:grid-cols-3 gap-4 mb-16">
+        <UCard
+          :class="isIOS && 'ring-2 ring-primary-500'"
+          class="cursor-pointer hover:shadow-xl transition-all hover:scale-105"
+          @click="handleDownload('ios')"
+        >
+          <div class="flex items-center gap-3 mb-2">
+            <UIcon name="i-heroicons-device-phone-mobile" class="size-8" />
+            <div>
+              <h3 class="font-semibold text-lg">
+                iOS
+              </h3>
+              <p class="text-xs text-gray-500 dark:text-gray-400">
+                iPhone & iPad
+              </p>
+            </div>
+          </div>
+          <p class="text-sm font-medium text-primary-500">
+            {{ t('downloadIOS') }}
+          </p>
+        </UCard>
+
+        <UCard
+          :class="isAndroid && 'ring-2 ring-primary-500'"
+          class="cursor-pointer hover:shadow-xl transition-all hover:scale-105"
+          @click="handleDownload('android')"
+        >
+          <div class="flex items-center gap-3 mb-2">
+            <UIcon name="i-heroicons-device-tablet" class="size-8" />
+            <div>
+              <h3 class="font-semibold text-lg">
+                Android
+              </h3>
+              <p class="text-xs text-gray-500 dark:text-gray-400">
+                APK Package
+              </p>
+            </div>
+          </div>
+          <p class="text-sm font-medium text-primary-500">
+            {{ t('downloadAndroid') }}
+          </p>
+        </UCard>
+
+        <UCard
+          class="cursor-pointer hover:shadow-xl transition-all hover:scale-105"
+          @click="handleDownload('h5')"
+        >
+          <div class="flex items-center gap-3 mb-2">
+            <UIcon name="i-heroicons-globe-alt" class="size-8" />
+            <div>
+              <h3 class="font-semibold text-lg">
+                Web
+              </h3>
+              <p class="text-xs text-gray-500 dark:text-gray-400">
+                H5 Version
+              </p>
+            </div>
+          </div>
+          <p class="text-sm font-medium text-primary-500">
+            {{ t('openH5') }}
+          </p>
+        </UCard>
+      </div>
+
+      <!-- Download Stats -->
+      <div v-if="stats" class="grid md:grid-cols-4 gap-4 mb-16">
+        <UCard>
+          <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">
+            {{ t('totalDownloads') }}
+          </p>
+          <p class="text-3xl font-bold text-gray-900 dark:text-white">
+            {{ stats.total.toLocaleString() }}
+          </p>
+        </UCard>
+        <UCard>
+          <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">
+            {{ t('todayDownloads') }}
+          </p>
+          <p class="text-3xl font-bold text-primary-500">
+            {{ stats.today.toLocaleString() }}
+          </p>
+        </UCard>
+        <UCard>
+          <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">
+            {{ t('iosDownloads') }}
+          </p>
+          <p class="text-3xl font-bold text-gray-900 dark:text-white">
+            {{ stats.ios.toLocaleString() }}
+          </p>
+        </UCard>
+        <UCard>
+          <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">
+            {{ t('androidDownloads') }}
+          </p>
+          <p class="text-3xl font-bold text-gray-900 dark:text-white">
+            {{ stats.android.toLocaleString() }}
+          </p>
+        </UCard>
+      </div>
+
+      <!-- What's New -->
+      <UCard class="mb-16">
+        <h3 class="text-2xl font-bold mb-6 text-gray-900 dark:text-white">
+          {{ t('whatsNew') }}
+        </h3>
+        <ul class="space-y-3">
+          <li
+            v-for="(note, index) in version.releaseNotes[locale]"
+            :key="index"
+            class="flex items-start gap-3 text-gray-700 dark:text-gray-300"
+          >
+            <span class="text-primary-500 mt-1">•</span>
+            <span>{{ note }}</span>
+          </li>
+        </ul>
+      </UCard>
+
+      <!-- Install Guide -->
+      <div class="grid md:grid-cols-2 gap-6">
+        <UCard>
+          <h3 class="text-xl font-bold mb-4 text-gray-900 dark:text-white">
+            {{ t('iosGuideTitle') }}
+          </h3>
+          <ol class="space-y-3 text-gray-700 dark:text-gray-300">
+            <li>{{ t('iosGuideStep1') }}</li>
+            <li>{{ t('iosGuideStep2') }}</li>
+            <li>{{ t('iosGuideStep3') }}</li>
+            <li>{{ t('iosGuideStep4') }}</li>
+          </ol>
+        </UCard>
+
+        <UCard>
+          <h3 class="text-xl font-bold mb-4 text-gray-900 dark:text-white">
+            {{ t('androidGuideTitle') }}
+          </h3>
+          <ol class="space-y-3 text-gray-700 dark:text-gray-300">
+            <li>{{ t('androidGuideStep1') }}</li>
+            <li>{{ t('androidGuideStep2') }}</li>
+            <li>{{ t('androidGuideStep3') }}</li>
+            <li>{{ t('androidGuideStep4') }}</li>
+          </ol>
+        </UCard>
+      </div>
+    </UContainer>
+
+    <!-- Footer -->
+    <footer class="mt-20 py-8 border-t border-gray-200 dark:border-gray-800">
+      <UContainer>
+        <div class="text-center text-sm text-gray-600 dark:text-gray-500">
+          <p>&copy; 2025 Riwa. All rights reserved.</p>
+        </div>
+      </UContainer>
+    </footer>
+    </div>
+  </UApp>
+</template>
--- a/packages/distribute/assets/css/main.css
+++ b/packages/distribute/assets/css/main.css
@@ -0,0 +1,2 @@
+@import "tailwindcss";
+@import "@nuxt/ui";
--- a/packages/distribute/composables/usePlatformDetection.ts
+++ b/packages/distribute/composables/usePlatformDetection.ts
@@ -0,0 +1,32 @@
+import type { Platform } from '~/types'
+
+export function usePlatformDetection() {
+  const platform = useState<Platform>('platform', () => 'unknown')
+
+  function detectPlatform(): Platform {
+    if (import.meta.server)
+      return 'unknown'
+
+    const ua = navigator.userAgent.toLowerCase()
+
+    if (/iphone|ipad|ipod/.test(ua))
+      return 'ios'
+    else if (/android/.test(ua))
+      return 'android'
+    else if (/windows|macintosh|linux/.test(ua))
+      return 'desktop'
+
+    return 'unknown'
+  }
+
+  onMounted(() => {
+    platform.value = detectPlatform()
+  })
+
+  return {
+    platform: readonly(platform),
+    isIOS: computed(() => platform.value === 'ios'),
+    isAndroid: computed(() => platform.value === 'android'),
+    isDesktop: computed(() => platform.value === 'desktop'),
+  }
+}
--- a/packages/distribute/data/versions.ts
+++ b/packages/distribute/data/versions.ts
@@ -0,0 +1,39 @@
+import type { AppVersion, DownloadStats } from '~/types'
+
+// 当前版本信息
+export const currentVersion: AppVersion = {
+  version: '1.0.0',
+  buildNumber: '100',
+  releaseDate: '2025-12-30',
+  releaseNotes: {
+    'zh-CN': [
+      '🎉 首次发布',
+      '✨ 全新的用户界面设计',
+      '🔐 增强的安全特性',
+      '⚡ 性能优化，响应速度提升 30%',
+      '🌍 支持多语言切换',
+      '🌙 深色模式支持',
+    ],
+    'en-US': [
+      '🎉 Initial Release',
+      '✨ Brand new user interface',
+      '🔐 Enhanced security features',
+      '⚡ Performance optimization, 30% faster response',
+      '🌍 Multi-language support',
+      '🌙 Dark mode support',
+    ],
+  },
+  downloads: {
+    ios: 'https://example.com/riwa-ios-1.0.0.ipa',
+    android: 'https://example.com/riwa-android-1.0.0.apk',
+    h5: 'http://localhost:5173',
+  },
+}
+
+// 模拟下载统计数据
+export const mockDownloadStats: DownloadStats = {
+  total: 12580,
+  today: 156,
+  ios: 7234,
+  android: 5346,
+}
--- a/packages/distribute/eslint.config.mjs
+++ b/packages/distribute/eslint.config.mjs
@@ -0,0 +1,8 @@
+import antfu from '@antfu/eslint-config'
+import withNuxt from './.nuxt/eslint.config.mjs'
+
+export default withNuxt(
+  antfu({
+    formatters: true,
+  }),
+)
--- a/packages/distribute/i18n/locales/en-US.json
+++ b/packages/distribute/i18n/locales/en-US.json
@@ -0,0 +1,26 @@
+{
+  "appName": "Riwa App",
+  "downloadTitle": "Download Riwa",
+  "version": "Version",
+  "updateDate": "Update Date",
+  "downloadIOS": "Download iOS",
+  "downloadAndroid": "Download Android",
+  "openH5": "Open Web Version",
+  "whatsNew": "What's New",
+  "downloadStats": "Download Statistics",
+  "totalDownloads": "Total Downloads",
+  "todayDownloads": "Today",
+  "iosDownloads": "iOS Downloads",
+  "androidDownloads": "Android Downloads",
+  "installGuide": "Installation Guide",
+  "iosGuideTitle": "iOS Installation",
+  "iosGuideStep1": "1. Click download button and wait",
+  "iosGuideStep2": "2. Go to Settings - General - VPN & Device Management",
+  "iosGuideStep3": "3. Trust the enterprise app certificate",
+  "iosGuideStep4": "4. Return to home screen and open Riwa App",
+  "androidGuideTitle": "Android Installation",
+  "androidGuideStep1": "1. Click download button and wait",
+  "androidGuideStep2": "2. Allow installation from unknown sources",
+  "androidGuideStep3": "3. Tap the APK file to install",
+  "androidGuideStep4": "4. Open the app after installation"
+}
--- a/packages/distribute/i18n/locales/zh-CN.json
+++ b/packages/distribute/i18n/locales/zh-CN.json
@@ -0,0 +1,26 @@
+{
+  "appName": "Riwa App",
+  "downloadTitle": "下载 Riwa",
+  "version": "版本",
+  "updateDate": "更新日期",
+  "downloadIOS": "下载 iOS 版",
+  "downloadAndroid": "下载 Android 版",
+  "openH5": "打开网页版",
+  "whatsNew": "更新内容",
+  "downloadStats": "下载统计",
+  "totalDownloads": "总下载量",
+  "todayDownloads": "今日下载",
+  "iosDownloads": "iOS 下载",
+  "androidDownloads": "Android 下载",
+  "installGuide": "安装指引",
+  "iosGuideTitle": "iOS 安装说明",
+  "iosGuideStep1": "1. 点击下载按钮，等待下载完成",
+  "iosGuideStep2": "2. 进入「设置」-「通用」-「VPN与设备管理」",
+  "iosGuideStep3": "3. 信任企业级应用证书",
+  "iosGuideStep4": "4. 返回主屏幕打开 Riwa App",
+  "androidGuideTitle": "Android 安装说明",
+  "androidGuideStep1": "1. 点击下载按钮，等待下载完成",
+  "androidGuideStep2": "2. 允许安装未知来源应用",
+  "androidGuideStep3": "3. 点击安装包进行安装",
+  "androidGuideStep4": "4. 安装完成后打开应用"
+}
--- a/packages/distribute/nuxt.config.ts
+++ b/packages/distribute/nuxt.config.ts
@@ -0,0 +1,54 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  modules: [
+    '@nuxt/ui',
+    '@nuxtjs/i18n',
+    '@nuxt/eslint',
+  ],
+
+  devtools: { enabled: true },
+
+  css: ['~/assets/css/main.css'],
+
+  colorMode: {
+    preference: 'system',
+  },
+
+  i18n: {
+    defaultLocale: 'zh-CN',
+    locales: [
+      {
+        code: 'zh-CN',
+        name: '简体中文',
+        file: 'zh-CN.json',
+      },
+      {
+        code: 'en-US',
+        name: 'English',
+        file: 'en-US.json',
+      },
+    ],
+    strategy: 'no_prefix',
+    detectBrowserLanguage: {
+      useCookie: true,
+      cookieKey: 'i18n_locale',
+      redirectOn: 'root',
+    },
+  },
+
+  app: {
+    head: {
+      charset: 'utf-8',
+      viewport: 'width=device-width, initial-scale=1',
+      title: 'Riwa App 下载',
+      meta: [
+        { name: 'description', content: 'Riwa App 下载 - iOS, Android, H5' },
+      ],
+      link: [
+        { rel: 'icon', type: 'image/svg+xml', href: '/favicon.svg' },
+      ],
+    },
+  },
+
+  compatibilityDate: '2025-12-30',
+})
--- a/packages/distribute/package.json
+++ b/packages/distribute/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "@riwa/distribute",
+  "version": "1.0.0",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt dev",
+    "build": "nuxt build",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "@nuxt/ui": "^4.3.0",
+    "@nuxtjs/i18n": "^10.2.1",
+    "nuxt": "^4.2.2"
+  },
+  "devDependencies": {
+    "@nuxt/eslint": "^1.12.1",
+    "typescript": "~5.9.3"
+  }
+}
--- a/packages/distribute/public/favicon.svg
+++ b/packages/distribute/public/favicon.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <defs>
+    <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#3b82f6;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#2563eb;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+  <rect width="100" height="100" rx="20" fill="url(#grad)"/>
+  <text x="50" y="70" font-family="Arial, sans-serif" font-size="60" font-weight="bold" fill="white" text-anchor="middle">R</text>
+</svg>
--- a/packages/distribute/server/api/stats.get.ts
+++ b/packages/distribute/server/api/stats.get.ts
@@ -0,0 +1,3 @@
+export default defineEventHandler(async () => {
+  return await fetchDownloadStats()
+})
--- a/packages/distribute/server/api/track/[platform].post.ts
+++ b/packages/distribute/server/api/track/[platform].post.ts
@@ -0,0 +1,14 @@
+export default defineEventHandler(async (event) => {
+  const platform = getRouterParam(event, 'platform') as 'ios' | 'android' | 'h5'
+
+  if (!['ios', 'android', 'h5'].includes(platform)) {
+    throw createError({
+      statusCode: 400,
+      message: 'Invalid platform',
+    })
+  }
+
+  await trackDownload(platform)
+
+  return { success: true }
+})
--- a/packages/distribute/server/api/version.get.ts
+++ b/packages/distribute/server/api/version.get.ts
@@ -0,0 +1,5 @@
+import { currentVersion } from '~/data/versions'
+
+export default defineEventHandler(() => {
+  return currentVersion
+})
--- a/packages/distribute/server/utils/stats.ts
+++ b/packages/distribute/server/utils/stats.ts
@@ -0,0 +1,16 @@
+import type { DownloadStats } from '~/types'
+import { mockDownloadStats } from '~/data/versions'
+
+// 获取下载统计（可替换为真实 API）
+export async function fetchDownloadStats(): Promise<DownloadStats> {
+  // 模拟 API 延迟
+  await new Promise(resolve => setTimeout(resolve, 500))
+  return mockDownloadStats
+}
+
+// 记录下载事件（可替换为真实 API）
+export async function trackDownload(platform: 'ios' | 'android' | 'h5'): Promise<void> {
+  // 模拟 API 延迟
+  await new Promise(resolve => setTimeout(resolve, 200))
+  console.log(`Download tracked: ${platform}`)
+}
--- a/packages/distribute/tsconfig.json
+++ b/packages/distribute/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}
--- a/packages/distribute/types/index.ts
+++ b/packages/distribute/types/index.ts
@@ -0,0 +1,23 @@
+export interface AppVersion {
+  version: string
+  buildNumber: string
+  releaseDate: string
+  releaseNotes: {
+    'zh-CN': string[]
+    'en-US': string[]
+  }
+  downloads: {
+    ios: string
+    android: string
+    h5: string
+  }
+}
+
+export interface DownloadStats {
+  total: number
+  today: number
+  ios: number
+  android: number
+}
+
+export type Platform = 'ios' | 'android' | 'desktop' | 'unknown'
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/favicon.svg
+++ b/public/favicon.svg
@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <defs>
+    <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#3b82f6;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#2563eb;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+  <rect width="100" height="100" rx="20" fill="url(#grad)"/>
+  <text x="50" y="70" font-family="Arial, sans-serif" font-size="60" font-weight="bold" fill="white" text-anchor="middle">R</text>
+</svg>