feat(docs): 添加mermaid支持并更新文档内容（构建文档）

Author: LC044

package/official-site/.vitepress/config.mts

@@ -1,6 +1,6 @@
 import { defineConfig } from 'vitepress'
-
-export default defineConfig({
+import { withMermaid } from "vitepress-plugin-mermaid";
+export default withMermaid(defineConfig({
   base: '/',
   title: "TrailSnap 行影集",
   description: "AI 驱动的智能相册与旅行足迹记录工具",
@@ -64,4 +64,4 @@ export default defineConfig({
       copyright: '版权所有 © 2025-至今 TrailSnap'
     }
   }
-})
+}))

package/official-site/.vitepress/theme/components/Home.vue

@@ -176,8 +176,8 @@ const prevTestimonial = () => {
 
             <!-- Tags -->
             <div class="flex flex-wrap justify-center lg:justify-start gap-3 mb-10">
-              <span class="px-4 py-2 bg-secondary dark:bg-secondary/20 rounded-full text-sm text-neutral-dark dark:text-gray-200 hover:-translate-y-1 transition-transform cursor-default">AI自动整理</span>
-              <span class="px-4 py-2 bg-secondary dark:bg-secondary/20 rounded-full text-sm text-neutral-dark dark:text-gray-200 hover:-translate-y-1 transition-transform cursor-default">票据智能识别</span>
+              <span class="px-4 py-2 bg-secondary dark:bg-secondary/20 rounded-full text-sm text-neutral-dark dark:text-gray-200 hover:-translate-y-1 transition-transform cursor-default">AI智能分类</span>
+              <span class="px-4 py-2 bg-secondary dark:bg-secondary/20 rounded-full text-sm text-neutral-dark dark:text-gray-200 hover:-translate-y-1 transition-transform cursor-default">车票智能识别</span>
               <span class="px-4 py-2 bg-secondary dark:bg-secondary/20 rounded-full text-sm text-neutral-dark dark:text-gray-200 hover:-translate-y-1 transition-transform cursor-default">可视化数据</span>
             </div>
 
@@ -189,7 +189,7 @@ const prevTestimonial = () => {
           </div>
 
           <!-- Visual Content -->
-          <div class="w-[80%] lg:w-[45%] relative flex justify-center">
+          <div class="w-[60%] lg:w-[30%] relative flex justify-center">
             <div class="relative w-full max-w-md animate-float">
               <!-- Main Visual Placeholder (Phone App Interface) -->
               <div class="bg-white dark:bg-slate-800 rounded-3xl shadow-float overflow-hidden border-8 border-white dark:border-slate-700 transform rotate-3 relative z-10 aspect-[9/16] flex items-center justify-center bg-gray-100 dark:bg-slate-900">
@@ -233,7 +233,7 @@ const prevTestimonial = () => {
     <section class="py-20 bg-white dark:bg-slate-900">
       <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
         <div class="text-center mb-16">
-          <h2 class="text-3xl font-bold text-neutral-dark dark:text-white mb-4">核心特色 · 重新定义出行记忆</h2>
+          <h2 class="text-3xl font-bold text-neutral-dark dark:text-white mb-4">核心特色 · 重新定义相册记忆</h2>
           <div class="w-16 h-1 bg-primary mx-auto rounded-full"></div>
         </div>
 
@@ -425,7 +425,7 @@ const prevTestimonial = () => {
           <div>
             <h4 class="text-lg font-bold mb-6">联系我们</h4>
             <ul class="space-y-3 text-sm text-white/80">
-              <li>邮箱：sixyuan044@gmail.com</li>
+              <li>邮箱：<a href="mailto:sixyuan044@gmail.com" class="hover:text-primary transition-colors">sixyuan044@gmail.com</a></li>
               <li>微信公众号：忆墨痕</li>
               <li class="relative group">
                 QQ群：
@@ -440,6 +440,7 @@ const prevTestimonial = () => {
                   <div class="absolute top-full left-4 border-8 border-transparent border-t-white"></div>
                 </div>
               </li>
+              <li>GitHub：<a href="https://github.com/LC044/TrailSnap" target="_blank" class="cursor-pointer border-b border-dashed border-white/40 hover:text-primary hover:border-primary transition-colors">LC044/TrailSnap</a></li>
             </ul>
           </div>
           <!-- Col 4 -->

package/official-site/docs/dev/architecture.md

@@ -6,32 +6,32 @@ TrailSnap 采用典型的前后端分离架构，由前端展示层、后端服
 
 ```mermaid
 flowchart TD
-    User[用户浏览器] -->|HTTP/HTTPS| FE[前端应用 (Vue 3 + Vite)]
+    User[👨‍💻 用户浏览器] -->|⚡ HTTP/HTTPS| FE[前端应用<br/>Vue 3 + Vite]
 
-    subgraph Frontend_Layer[前端展示层]
-      FE -->|Axios / REST| API8000[后端服务 (FastAPI, :8000)]
-      FE -->|Pinia| Store[全局状态管理]
-      FE -->|ElementPlus| UI[UI组件库]
+    subgraph Frontend_Layer[🖥️ 前端展示层]
+      FE -->|📡 Axios / REST| API8000
+      FE -->|💾 Pinia| Store[全局状态管理]
+      FE -->|🎨 ElementPlus| UI[UI组件库]
     end
 
-    subgraph Backend_Layer[后端服务层]
-      API8000 --> Routers[API Routers]
-      Routers --> Services[业务服务层]
-      Services -->|ORM| DBConn[SQLAlchemy]
-      Services -->|文件操作| FS[文件系统]
-      Services -->|异步任务| TM[TaskManager]
-      TM -->|HTTP 调用| AI8001[AI 微服务 (FastAPI, :8001)]
+    subgraph Backend_Layer[⚙️ 后端服务层]
+      API8001[后端服务<br/>FastAPI :8000] --> Routers[API路由分发]
+      Routers --> Services[业务逻辑服务]
+      Services -->|🗄️ ORM映射| DBConn[SQLAlchemy]
+      Services -->|📂 文件读写| FS[文件系统]
+      Services -->|⏳ 异步调度| TM[任务管理器]
+      TM -->|🔗 HTTP调用| AI8001
     end
 
-    subgraph AI_Service[AI 微服务]
-      AI8001 --> OCR[PaddleOCR]
-      AI8001 --> Face[InsightFace]
-      AI8001 --> OD[对象检测]
-      AI8001 --> Ticket[车票识别(YOLO+OCR)]
+    subgraph AI_Service[🤖 AI 微服务层]
+      AI8001[AI微服务<br/>FastAPI :8001] --> OCR[PaddleOCR 文字识别]
+      AI8001 --> Face[InsightFace 人脸识别]
+      AI8001 --> OD[目标对象检测]
+      AI8001 --> Ticket[车票识别<br/>YOLO + OCR]
     end
 
-    subgraph Data_Layer[数据层]
-      DBConn --> DB[(PostgreSQL)]
+    subgraph Data_Layer[💽 数据持久层]
+      DBConn --> DB[(PostgreSQL 数据库)]
       FS --> Storage[本地/挂载存储]
     end
 ```

package/official-site/docs/dev/guide.md

@@ -65,14 +65,14 @@ TrailSnap/
 项目依赖 PostgreSQL 和 pgvector 插件。推荐使用 Docker 启动：由于文档部署限制，请直接查看项目源码中 `package/server/README.md` 文件。
 
 ### 4.2 安装依赖
-推荐使用 `uv` 进行包管理，也可以使用 `pip`。
+推荐使用 `uv` 进行包管理。
 
 ```bash
 cd package/server
+# 安装 uv
+pip install uv
 # 使用 uv
 uv sync
-# 或者使用 pip
-pip install -r requirements.txt
 ```
 
 ### 4.3 配置文件
@@ -85,8 +85,11 @@ AI_URL=http://localhost:8001
 
 ### 4.4 运行服务
 ```bash
+# 第一次运行是需要初始化数据库
+python start.py
+
 # 开发模式启动
-uvicorn app.main:app --reload --port 8000
+uvicorn main:app --reload --port 8000
 ```
 API 文档地址：`http://localhost:8000/docs`
 
@@ -148,3 +151,22 @@ uvicorn app.main:app --reload --port 8001
    - `alembic current`: 查看当前版本
    - `alembic history`: 查看历史版本
    - `alembic downgrade -1`: 回滚上一个版本
+
+## 8. 打包docker镜像
+
+```bash
+cd TrailSnap
+# 一键打包docker镜像
+docker-compose up -d --build
+```
+
+```bash
+# 打包前端镜像
+docker build -t siyuan044/trailsnap-frontend:master -f package/website/Dockerfile .
+
+# 打包后端镜像
+docker build -t siyuan044/trailsnap-backend:master -f package/server/Dockerfile .
+
+# 打包AI镜像
+docker build -t siyuan044/trailsnap-ai:master -f package/ai/Dockerfile .
+```

package/official-site/docs/guide/install.md

@@ -105,9 +105,9 @@ TrailSnap 支持多种部署方式，推荐使用 Docker Compose 进行快速部
    ```
 
 4. **访问应用**
+   服务启动后，通过浏览器访问: `http://localhost:8082`
 
-   服务启动后，通过浏览器访问：
-   - 前端页面: `http://localhost:8082`
+5. **访问后端 API**
    - 后端 API: `http://localhost:8800/docs`
    - AI 服务文档: `http://localhost:8801/docs`
 

package/official-site/docs/guide/user.md

@@ -12,8 +12,6 @@
 4. [行程与票据](#4-行程与票据)
 5. [系统设置](#5-系统设置)
 
----
-
 ## 1. 快速开始
 
 ### 登录/注册
@@ -31,8 +29,6 @@
 2. 输入外部图库的地址，例如 /app/photos (注意docker挂载路径)
 3. 点击确认，系统会自动扫描该目录下的所有照片（任务进度可以在“设置->任务管理”中查看）。
 
----
-
 ## 2. 相册管理
 
 ### 创建相册
@@ -50,8 +46,6 @@
 - **地图视图**：在地图上显示照片拍摄地点，点亮你的足迹。
 - **详情查看**：点击照片可查看大图及详细元数据（ISO、快门、设备型号等）。
 
----
-
 ## 3. 智能功能
 
 TrailSnap 内置了强大的 AI 服务，为您提供以下智能体验：
@@ -69,8 +63,6 @@ TrailSnap 内置了强大的 AI 服务，为您提供以下智能体验：
 - **一键修图**：利用 AI 算法自动调整照片色彩、曝光，提升画质。
 - **生成 VLOG**：选择一段旅程或一个相册，AI 会自动挑选精彩片段，配上音乐，生成短视频。
 
----
-
 ## 4. 行程与票据
 
 这是 TrailSnap 专为旅行者设计的特色功能。
@@ -84,8 +76,6 @@ TrailSnap 内置了强大的 AI 服务，为您提供以下智能体验：
 - 系统会根据您的票据时间和照片时间，自动生成一条完整的“旅行时间轴”。
 - 您可以清晰地看到从出发到返程的完整轨迹。
 
----
-
 ## 5. 系统设置
 
 在设置页面，您可以进行以下配置：
@@ -95,6 +85,4 @@ TrailSnap 内置了强大的 AI 服务，为您提供以下智能体验：
 - **存储设置**：查看存储空间使用情况。
 - **任务管理**：查看后台任务进度（如正在进行的 AI 识别任务、缩略图生成任务）。
 
----
-
 如有任何使用问题，请联系系统管理员或查阅 [开发者文档](../dev/guide.md)。