feat: add WebUI documentation page to usage section

Author: BERADQ

content/docs/usage/index.mdx

@@ -24,6 +24,10 @@ import { Terminal, Download, FileArchive, FileCog, Play, Bot } from "lucide-reac
 
 </Callout>
 
+## WebUI
+
+如果你想要使用 WebUI 配置、访问、管理您的机器人，您可以直接跳转到[部署 WebUI](/docs/usage/webui)
+
 ## 系统要求
 
 为了方便用户，我们为以下主流平台提供了预编译的二进制文件。您可以直接下载并运行，无需手动编译。

content/docs/usage/meta.json

@@ -6,6 +6,7 @@
   "pages": [
     "---安装部署---",
     "index",
+    "webui",
     "plugin",
     "config"
   ]

content/docs/usage/webui.mdx

@@ -0,0 +1,245 @@
+---
+title: 部署 WebUI
+description: 通过 WebUI 部署、管理您的 sithra-rs 机器人
+---
+
+import { Steps, Step } from "fumadocs-ui/components/steps";
+import { Callout } from "fumadocs-ui/components/callout";
+import { Files, File, Folder } from "fumadocs-ui/components/files";
+import { Tabs, Tab } from "fumadocs-ui/components/tabs";
+import { Card, Cards } from "fumadocs-ui/components/card";
+import { GithubInfo } from "fumadocs-ui/components/github-info";
+import { Terminal, Download, FileArchive, FileCog, Play, Bot, Settings, Server, Globe, KeyRound } from "lucide-react";
+
+<Callout type="info" icon={<Bot />}>
+
+### 欢迎使用 sithra-web！
+
+sithra-web 为 sithra-rs 提供了现代化的 Web 用户界面，
+
+让您可以更直观、便捷地配置、访问和管理您的机器人。
+
+本篇文档将引导您在几分钟内完成 sithra-web 的下载、配置和启动。
+
+</Callout>
+
+## 系统要求
+
+为了方便用户，我们为以下主流平台提供了预编译的二进制文件。您可以直接下载并运行，无需手动编译。
+
+- [x] Linux (x86-64)
+- [ ] Windows (x86-64)
+- [ ] macOS (x86-64)
+- [ ] macOS (ARM64)
+
+<Callout title="其他平台">
+
+  如果您的操作系统或 CPU 架构不在上述列表内，您需要从源代码手动编译
+  sithra-web。请参考下文的 [从源码编译](#2-从源码编译) 部分。
+
+</Callout>
+
+<Callout type="info" icon={<KeyRound className="h-4 w-4" />} title="首次启动设置">
+
+  首次访问 WebUI 时，系统会要求您设置管理员用户名和密码，请务必妥善保管。
+
+</Callout>
+
+## 1. 下载与部署
+
+<Steps>
+
+<Step icon={<Download />} title="从 GitHub 下载">
+
+  前往 [GitHub Releases](https://github.com/SithraBot/sithra-rs/releases) 页面，根据您的操作系统下载最新版本的 sithra-web 压缩包。
+
+</Step>
+
+<Step icon={<FileArchive />} title="解压文件">
+
+  将下载的压缩包解压到一个您喜欢的目录。我们建议您为 sithra-web 创建一个独立的文件夹。
+
+  解压后，您的目录结构应该如下所示：
+
+  <Files>
+    <Folder name="sithra-web" defaultOpen>
+      <File name="sithra-web.exe" />
+      <Folder name="web">
+        <File name="index.html" />
+        <File name="...others" />
+      </Folder>
+      <File name="config.toml" />
+      <Folder name="config.d">
+      </Folder>
+      <Folder name="plugins">
+        <File name="example" />
+      </Folder>
+    </Folder>
+  </Files>
+</Step>
+<Step icon={<FileCog />} title="创建配置文件">
+  首次运行前，请确保 `config.toml` 文件存在于 sithra-web 的运行目录中。sithra-web 依赖此文件来加载和配置插件。
+
+<Callout type="warn" title="注意">
+
+  如果 sithra-web 在启动时没有找到 `config.toml` 文件，程序将会自动退出。
+
+</Callout>
+
+关于如何编写配置文件，请[参考文档：编写配置项](/docs/usage/config)。
+
+</Step>
+
+<Step icon={<Play />} title="启动服务">
+
+  一切就绪！现在您可以启动 sithra-web 了。
+
+<Tabs items={["Windows", "Linux/macOS"]}>
+
+  <Tab>
+
+    在终端中执行以下命令：
+
+    ```bash
+    .\sithra-web.exe
+    ```
+
+  </Tab>
+
+  <Tab>
+
+    首先，为文件添加可执行权限，然后运行它：
+
+    ```bash
+    chmod +x ./sithra-web
+    ./sithra-web
+    ```
+
+  </Tab>
+
+</Tabs>
+
+如果一切顺利，您将在终端看到 sithra-web 成功启动的日志信息。默认情况下，您可以访问 `http://127.0.0.1:8080` 来打开 WebUI。
+
+</Step>
+</Steps>
+
+## 服务配置
+
+<div className="flex items-center gap-2 mb-4">
+  <Settings className="w-5 h-5 text-primary" />
+  <span className="text-lg font-medium">命令行参数与环境变量</span>
+</div>
+
+sithra-web 提供了灵活的配置选项，您可以通过命令行参数或环境变量来调整服务行为。
+
+<Callout>
+
+  命令行参数的优先级高于环境变量。
+  
+</Callout>
+
+<Cards>
+
+  <Card title="--host" type="info" icon={<Server />}>
+  
+    **功能**: 设置服务监听的主机地址。
+
+    **默认值**: `127.0.0.1`
+
+    **环境变量**: `SITHRA_WEB_HOST`
+
+    **示例**: `sithra-web --host 0.0.0.0`
+
+  </Card>
+
+  <Card title="--port" icon={<Server />}>
+
+    **功能**: 设置服务监听的端口。
+
+    **默认值**: `8080`
+
+    **环境变量**: `SITHRA_WEB_PORT`
+
+    **示例**: `sithra-web --port 8000`
+
+  </Card>
+
+  <Card title="--web-path" icon={<Globe />}>
+
+    **功能**: 指定 Web UI 静态资源文件的路径。
+
+    **默认值**: `web`
+
+    **环境变量**: `SITHRA_WEB_PATH`
+
+    **示例**: `sithra-web --web-path /opt/sithra-web/ui`
+
+  </Card>
+
+  <Card title="--api-only" icon={<Terminal />}>
+
+    **功能**: 仅启动后端 API 服务，不托管 Web UI。
+
+    **默认值**: `false`
+
+    **环境变量**: `SITHRA_WEB_API_ONLY`
+
+    **示例**: `sithra-web --api-only`
+
+  </Card>
+
+</Cards>
+
+## 2. 从源码编译
+
+如果您是开发者，或者您需要在非官方支持的平台上运行 sithra-web，您可以选择从源代码进行编译。
+
+<Steps>
+  <Step>
+
+    ### 准备 Rust 环境
+
+    请确保您的系统中已安装 Rust
+    工具链。如果尚未安装，可以参考 [Rust
+    官方文档](https://www.rust-lang.org/tools/install) 进行安装。
+
+  </Step>
+  <Step>
+
+    ### 克隆源代码
+
+    使用 Git 克隆 sithra-rs 的代码仓库：
+
+    ```shell
+    git clone https://github.com/SithraBot/sithra-rs.git
+    cd sithra-rs
+    ```
+
+  </Step>
+  <Step>
+
+    ### 编译项目
+
+    在项目根目录下，执行 `cargo build` 命令并指定编译 `sithra-web`：
+
+    ```shell
+    cargo build -p sithra-web --release
+    ```
+
+    编译完成后，生成的可执行文件将位于 `target/release/` 目录下。
+
+  </Step>
+</Steps>
+
+## 获取帮助
+
+<div className="not-prose mt-0 flex flex-col gap-4">
+  <GithubInfo owner="SithraBot" repo="sithra-rs" />
+  <p className="text-sm text-fd-muted-foreground">
+    如果您在使用过程中遇到任何问题，或有任何功能建议，欢迎随时在 GitHub Issues
+    中提出。
+  </p>
+</div>
+
+您也可以加入我们的 QQ 群获取帮助：[948180922](https://qm.qq.com/q/9rhbJpXBF6)