完善文档

完善用户操作文档
2025-05-27 12:12:56 +08:00 · 2025-05-27 00:03:12 +08:00 · 2025-05-24 22:48:10 +08:00 · 2025-05-24 22:17:47 +08:00 · 2025-05-24 13:43:54 +08:00 · 2025-05-23 21:54:03 +08:00
267 changed files with 3467 additions and 798 deletions
@@ -8,6 +8,27 @@
 - **【全功能】** 功能丰富：文本编辑、格式排版、多媒体插入、表格制作等。
 - **【全模态】** 人工智能：文字、语音、图片、视频，全模态功能创作体验。

+<table>
+  <tr>
+    <td colspan="2">
+      <img src="./docs/images/image-00.png" alt="image-00" width="100%" />
+    </td>
+  </tr>
+  <tr>
+    <td colspan="2">
+      <br />
+    </td>
+  </tr>
+  <tr>
+    <td>
+      <img src="./docs/images/image-01.png" alt="image-01"/>
+    </td>
+    <td>
+      <img src="./docs/images/image-02.png" alt="image-02"/>
+    </td>
+  </tr>
+</table>
+
 ## 与众不同

 UAI Editor 提供了完善的文档编辑能力和 AI 创作能力，支持 Markdown 语法，支持基础的富文本编辑功能，支持插入多种节点类型，提供了多种类型的实用工具。作为一个独立的纯前端文档编辑器，UAI Editor 可以轻松无缝集成到 Vue、React、Layui、Angular 等几乎任何前端框架。
@@ -40,125 +61,64 @@ UAI Editor 提供了完善的文档编辑能力和 AI 创作能力，支持 Mark
 * UAI Editor 支持全模态大模型，包括文本生成、语音识别、语音生成、文生图、图生图、局部重绘、图片理解、文生视频、图生视频、视频理解等。
 * UAI Editor 私有模型适配多种环境，包括英伟达显卡、天数智芯显卡、Pytorch、IPEX等。

-## 软件安装
+## 帮助文档

-### 基础软件安装
+UAI Editor 提供了一份使用文档，您可以通过以下方式访问：

-首先，我们需要安装 `nodejs`、`npm`等用于开发的基础软件。
-
-Node.js 可以通过不同的方式安装，所有主要平台的官方软件包均可在 [https://nodejs.cn/download/](https://nodejs.cn/download/) 获得。
-
-一种非常方便的安装 Node.js 的方法是通过包管理器，[https://nodejs.cn/download/package-manager/](https://nodejs.cn/download/package-manager/) 中列出了适用于 macOS、Linux 和 Windows 的其他软件包管理器。
-
-### 有爱文档安装
-
-其次，我们需要安装 UAI Editor 软件，软件已经打包发布到 [https://www.npmjs.com/](https://www.npmjs.com/) 平台，可以直接通过以下命令安装：
+安装必要的软件`docsify`：

 ```bash
-npm i uai-editor
+npm i docsify -g
 ```

-## 软件集成
+### 开发者文档

-然后，我们可以将 UAI Editor 与自己的项目进行集成。
-
-作为一个独立的纯前端文档编辑器，UAI Editor 可以独立使用，也可以轻松无缝集成到 Vue、React、Layui、Angular 等几乎任何前端框架。
-
-### 独立使用
-
-* index.html
-
-```html
-<!doctype html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <title>UAI Editor</title>
-    <link rel="icon" href="/favicon.png" />
-</head>
-<body>
-    <div id="uai-editor"></div>
-    <script type="module" src="/src/main.ts"></script>
-</body>
-</html>
-```
-
-* main.ts
-
-```js
-import { UAIEditor } from "uai-editor";
-import "uai-editor/dist/style.css";
-
-new UAIEditor({
-    element: "#uai-editor",
-    content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
-})
-```
-
-### 与 VUE 集成
-
-```ts
-<template>
-  <div ref="editorDiv"/>
-</template>
-
-<script lang="ts">
-import { UAIEditor } from "uai-editor";
-import "uai-editor/dist/style.css";
-
-export default {
-  mounted(){
-    new UAIEditor({
-      element: this.$refs.editorDiv as Element,
-      content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
-    })
-  }
-}
-</script>
-```
-
-### 与 React 集成
-
-```js
-import {useEffect, useRef} from 'react';
-import { UAIEditor } from "uai-editor";
-import "uai-editor/dist/style.css";
-
-function App() {
-    const divRef = useRef(null);
-    useEffect(() => {
-        if (divRef.current) {
-            const uaiEditor = new UAIEditor({
-                element: divRef.current,
-                content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
-            })
-            return ()=>{
-                uaiEditor.destroy();
-            }
-        }
-    }, [])
-
-    return (
-        <>
-            <div ref={divRef} />
-        </>
-    )
-}
-
-export default App
-```
-
-## 软件运行
-
-最后，我们需要运行项目，执行以下命令可以运行项目或自己的项目：
+启动文档服务：

 ```bash
-npm i
-
-npm run dev
+docsify serve docs/developer --port 3000
 ```

+访问文档：
+
+[http://localhost:3000](http://localhost:3000)。
+
+<table>
+  <tr>
+    <td>
+      <img src="./docs/images/image-81.png" alt="image-81"/>
+    </td>
+    <td>
+      <img src="./docs/images/image-82.png" alt="image-82"/>
+    </td>
+  </tr>
+</table>
+
+### 用户文档
+
+启动文档服务：
+
+```bash
+docsify serve docs/user --port 3010
+```
+
+访问文档：
+
+[http://localhost:3010](http://localhost:3010)。
+
+<table>
+  <tr>
+    <td>
+      <img src="./docs/images/image-91.png" alt="image-91"/>
+    </td>
+    <td>
+      <img src="./docs/images/image-92.png" alt="image-92"/>
+    </td>
+  </tr>
+</table>
+
+或者，您也可以直接访问：[文档编辑](docs/user/base.md)、[附件插入](docs/user/insert.md)、[文档导出](docs/user/export.md)、[AI 功能](docs/user/chat.md)等文档。
+
 ## 开源优势

 * **免费使用：** 作为开源项目，UAI Editor 采用 [MIT 许可证](LICENSE) 对所有用户免费开放，无需担心版权问题。
@@ -176,4 +136,5 @@ UAI Editor 采用 [MIT 许可证](LICENSE)，您可以自由地使用、修改
 如果您觉得 UAI Editor 有用，请考虑通过以下方式支持我们：

 * ⭐ 给 UAI Editor 仓库 点个 Star，表示对项目的支持。
-* 🔗 如果您在项目中使用了 UAI Editor，请添加一个链接到 [https://gitee.com/AI-Labs/uai-editor](https://gitee.com/AI-Labs/uai-editor)。
+* 🔗 如果您在项目中使用了 UAI Editor，请添加一个链接到 [https://gitee.com/uai-team/uai-editor](https://gitee.com/uai-team/uai-editor) 或者 [https://github.com/uai-team/uai-editor](https://github.com/uai-team/uai-editor)。
+* ⛓️ UAI Editor 很多功能还存在不足，如果您感兴趣，欢迎优化 PR。
@@ -0,0 +1,7 @@
+# UAI Editor：有爱文档，有爱、有AI、有UI。
+
+> UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。
+
+UAI Editor 是一个基于 Typescript 的适合于国人使用的纯前端文档编辑器。UAI Editor 提供完善的文档编辑能力和 AI 创作能力，支持 Markdown 语法，支持基础的富文本编辑功能，支持插入多种格式的节点类型、提供了多种类型的实用工具。
+
+作为一个独立的纯前端文档编辑器，UAI Editor 可以轻松无缝集成到 Vue、React、Layui、Angular 等几乎任何前端框架。
@@ -0,0 +1,15 @@
+<!-- _coverpage.md -->
+
+# **有爱文档（UAI-Editor）开发文档**
+
+> 💪打造现代 UI 风格、面向 AI 的最强、最轻量级的个人&团队文档。
+
+## 有爱文档，有爱、有AI、有UI。开箱即用、支持所有前端框架。
+
+- **【全行业】** 无论您是：金融、教育、医疗、零售、互联网还是传统行业。
+- **【全场景】** 无论您是：文章创作、会议记录、学术论文还是知识库管理。
+- **【全功能】** 功能丰富：文本编辑、格式排版、多媒体插入、表格制作等。
+- **【全模态】** 人工智能：文字、语音、图片、视频，全模态功能创作体验。
+
+
+[开始](/README.md)
@@ -0,0 +1,7 @@
+- [首页](/)
+
+- 开源地址
+  - [Gitee](https://gitee.com/uai-team/uai-editor)
+  - [Github](https://github.com/uai-team/uai-editor)
+
+- 技术支持
@@ -0,0 +1,3 @@
+- 环境搭建
+  - [开发环境搭建](development.md)
+  - [前端框架集成](integration.md)
@@ -0,0 +1,102 @@
+# 开发环境搭建
+
+## 基础软件安装
+
+首先，我们需要安装 `nodejs`、`npm`等用于开发的基础软件。
+
+Node.js 可以通过不同的方式安装，所有主要平台的官方软件包均可在 [https://nodejs.cn/download/](https://nodejs.cn/download/) 获得。
+
+一种非常方便的安装 Node.js 的方法是通过包管理器，[https://nodejs.cn/download/package-manager/](https://nodejs.cn/download/package-manager/) 中列出了适用于 macOS、Linux 和 Windows 的其他软件包管理器。
+
+## 获取项目源码
+
+通过以下命令获取项目源代码：
+
+```bash
+git clone https://gitee.com/uai-team/uai-editor
+cd uai-editor
+```
+
+## 依赖软件安装
+
+有爱文档是一个`Nodejs`项目，正常情况下只需要执行`npm install`即可完成依赖的安装，但是因为项目中依赖了`@tiptap-pro`下的一些扩展，因此在执行`npm install`命令前需要做一些额外的操作。
+
+### 注册Tiptap Cloud账号
+
+通过[https://cloud.tiptap.dev/register](https://cloud.tiptap.dev/register)链接注册一个Tiptap Cloud账号。
+
+![](images/development-01.png)
+
+验证注册的邮箱。
+
+![](images/development-02.png)
+
+填写团队信息。
+
+![](images/development-03.png)
+
+填写个人信息。
+
+![](images/development-04.png)
+
+### 登录Tiptap Cloud账号
+
+通过[https://cloud.tiptap.dev/login](https://cloud.tiptap.dev/login)链接登录已有账号。
+
+![](images/development-05.png)
+
+### 获取NPM token
+
+通过[https://cloud.tiptap.dev/v2/features/pro-extensions](https://cloud.tiptap.dev/v2/features/pro-extensions)链接，获取个人的NPM registry token。
+
+![](images/development-06.png)
+
+复制以上Token的内容，备用。
+
+### 创建.npmrc配置文件
+
+根据官方文档[https://tiptap.dev/docs/guides/pro-extensions](https://tiptap.dev/docs/guides/pro-extensions)或[https://cloud.tiptap.dev/v2/features/pro-extensions](https://cloud.tiptap.dev/v2/features/pro-extensions)，在克隆项目的根目录下创建`.npmrc`文件，并填入文件内容。
+
+```bash
+@tiptap-pro:registry=https://registry.tiptap.dev/
+@tiptap-cloud:registry=https://registry.tiptap.dev/
+//registry.tiptap.dev/:_authToken=${上图中复制的Token}
+```
+
+即，`.npmrc`文件的内容应该为：
+
+```bash
+@tiptap-pro:registry=https://registry.tiptap.dev/
+@tiptap-cloud:registry=https://registry.tiptap.dev/
+//registry.tiptap.dev/:_authToken=SnF9fofcsYRXn***************WCtXj
+```
+
+此时，项目的目录结构应该为：
+
+```bash
+uai-editor
+├── src
+├── .gitignore
+├── .npmignore
+├── .npmrc     # 这个是通过前面的步骤新增加的配置文件
+├── LICENSE
+├── README.md
+├── index.html
+├── package.json
+├── tsconfig.json
+└── vite.config.ts
+```
+
+### 执行软件安装
+
+完成以上操作后，就可以执行`npm install`来进行依赖的安装了。
+
+## 软件运行
+
+最后，我们需要运行项目，执行以下命令可以运行项目或自己的项目：
+
+```bash
+npm install
+
+npm run dev
+```
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <title>有爱文档（UAI-Editor）</title>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+  <meta name="description" content="Description">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
+  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify@4/lib/themes/vue.css">
+</head>
+
+<body>
+  <div id="app"></div>
+  <script>
+    window.$docsify = {
+      // 项目名称
+      name: '有爱文档（UAI-Editor）',
+      // 仓库地址，点击右上角的Github章鱼猫头像会跳转到此地址
+      repo: 'https://gitee.com/uai-team/uai-editor',
+      // 侧边栏支持，默认加载的是项目根目录下的_sidebar.md文件
+      loadSidebar: true,
+      // 导航栏支持，默认加载的是项目根目录下的_navbar.md文件
+      loadNavbar: true,
+      // 封面支持，默认加载的是项目根目录下的_coverpage.md文件
+      coverpage: true,
+      // 最大支持渲染的标题层级
+      maxLevel: 5,
+      // 自定义侧边栏后默认不会再生成目录，设置生成目录的最大层级（建议配置为2-4）
+      subMaxLevel: 3,
+      // 小屏设备下合并导航栏到侧边栏
+      mergeNavbar: true,
+      /*搜索相关设置*/
+      search: 'auto', // default
+      search: {
+        maxAge: 86400000,// 过期时间，单位毫秒，默认一天
+        paths: 'auto',// 注意：仅适用于 paths: 'auto' 模式
+        placeholder: '搜索',
+        // 支持本地化
+        // placeholder: {
+        //   // '/zh-cn/': '搜索',
+        //   '/': 'Type to search'
+        // },
+        noData: '找不到结果',
+        depth: 4,
+        hideOtherSidebarContent: false,
+        namespace: 'UAI-Editor',
+      }
+    }
+  </script>
+  <!-- Docsify v4 -->
+  <script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
+  <script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/search.min.js"></script>
+</body>
+
+</html>
@@ -0,0 +1,163 @@
+# 前端框架集成
+
+作为一个独立的纯前端文档编辑器，UAI Editor 可以独立使用，也可以轻松无缝集成到 Vue、React、Layui、Angular 等几乎任何前端框架。
+
+## 有爱文档安装
+
+我们需要安装 UAI Editor 软件，软件已经打包发布到 [https://www.npmjs.com/](https://www.npmjs.com/) 平台，可以直接通过以下命令安装：
+
+```bash
+npm i @uai-team/uai-editor
+```
+
+## 软件集成
+
+然后，我们可以将 UAI Editor 与自己的项目进行集成。
+
+### 独立使用
+
+* index.html
+
+```html
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>UAI Editor</title>
+    <link rel="icon" href="/favicon.png" />
+</head>
+<body>
+    <div id="uai-editor"></div>
+    <script type="module" src="/src/main.ts"></script>
+</body>
+</html>
+```
+
+* main.ts
+
+```js
+import { UAIEditor } from '@uai-team/uai-editor';
+import '@uai-team/uai-editor/dist/style.css';
+
+new UAIEditor({
+    element: "#uai-editor",
+    content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
+})
+```
+
+### 与 VUE 集成
+
+```ts
+<template>
+  <div ref="editorDiv"/>
+</template>
+
+<script lang="ts">
+import { UAIEditor } from '@uai-team/uai-editor';
+import '@uai-team/uai-editor/dist/style.css';
+
+export default {
+  mounted(){
+    new UAIEditor({
+      element: this.$refs.editorDiv as Element,
+      content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
+    })
+  }
+}
+</script>
+```
+
+### 与 React 集成
+
+```js
+import {useEffect, useRef} from 'react';
+import { UAIEditor } from '@uai-team/uai-editor';
+import '@uai-team/uai-editor/dist/style.css';
+
+function App() {
+    const divRef = useRef(null);
+    useEffect(() => {
+        if (divRef.current) {
+            const uaiEditor = new UAIEditor({
+                element: divRef.current,
+                content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
+            })
+            return ()=>{
+                uaiEditor.destroy();
+            }
+        }
+    }, [])
+
+    return (
+        <>
+            <div ref={divRef} />
+        </>
+    )
+}
+
+export default App
+```
+
+## 与人工智能集成
+
+如果要在 UAI Editor 中使用 AI 功能，需要在初始化 UAIEditor 的时候配置相关的配置项：
+
+```js
+new UAIEditor({
+    element: "#uai-editor",
+    content: 'UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。',
+    ai: { // AI 配置项
+        chat: { // 聊天配置项
+            models: { // 模型配置项
+                "default": {
+                    modelType: 'openai',
+                    baseUrl: 'https://open.bigmodel.cn/api/paas/v4',
+                    apiKey: process.env.CHATGLM_APIKEY,
+                    model: 'glm-4-flash'
+                },
+                "GLM-4": { // 聊天功能选择使用的模型，配置智谱AI的GLM-4-Flash模型
+                    modelType: 'openai',
+                    baseUrl: 'https://open.bigmodel.cn/api/paas/v4',
+                    apiKey: process.env.CHATGLM_APIKEY, // 此处填写您智谱AI的 API Key
+                    model: 'glm-4-flash'
+                },
+                "InternLM2.5": { // 聊天功能选择使用的模型，配置上海人工智能实验室的InternLM2.5模型
+                    modelType: 'openai',
+                    baseUrl: 'https://internlm-chat.intern-ai.org.cn/puyu/api/v1',
+                    apiKey: process.env.INTERNLM_TOKEN, // 此处填写您上海人工智能实验室的 API Key
+                    model: 'internlm2.5-latest'
+                },
+            },
+        },
+        image: { // 图像配置项
+            models: { // 模型配置项
+                text2image: { // 文本生成图像模型配置项
+                    "default": {
+                        modelType: 'openai',
+                        baseUrl: 'https://open.bigmodel.cn/api/paas/v4', // images/generations
+                        apiKey: process.env.CHATGLM_APIKEY,
+                        model: 'cogview-3-flash'
+                    },
+                    "CogView-3": { // 绘图功能选择使用的模型，配置智谱AI的CogView-3-Flash模型
+                        modelType: 'openai',
+                        baseUrl: 'https://open.bigmodel.cn/api/paas/v4', // images/generations
+                        apiKey: process.env.CHATGLM_APIKEY, // 此处填写您智谱AI的 API Key
+                        model: 'cogview-3-flash'
+                    },
+                }
+            }
+        }
+    }
+})
+```
+
+## 软件运行
+
+最后，我们需要运行项目，执行以下命令可以运行项目或自己的项目：
+
+```bash
+npm install
+
+npm run dev
+```
@@ -0,0 +1,7 @@
+# UAI Editor：有爱文档，有爱、有AI、有UI。
+
+> UAI Editor 是一个面向 AI 的、现代 UI 风格的下一代富文本编辑器。开箱即用、支持所有前端框架。
+
+UAI Editor 是一个基于 Typescript 的适合于国人使用的纯前端文档编辑器。UAI Editor 提供完善的文档编辑能力和 AI 创作能力，支持 Markdown 语法，支持基础的富文本编辑功能，支持插入多种格式的节点类型、提供了多种类型的实用工具。
+
+作为一个独立的纯前端文档编辑器，UAI Editor 可以轻松无缝集成到 Vue、React、Layui、Angular 等几乎任何前端框架。
@@ -0,0 +1,15 @@
+<!-- _coverpage.md -->
+
+# **有爱文档（UAI-Editor）使用指南**
+
+> 💪打造现代 UI 风格、面向 AI 的最强、最轻量级的个人&团队文档。
+
+## 有爱文档，有爱、有AI、有UI。开箱即用、支持所有前端框架。
+
+- **【全行业】** 无论您是：金融、教育、医疗、零售、互联网还是传统行业。
+- **【全场景】** 无论您是：文章创作、会议记录、学术论文还是知识库管理。
+- **【全功能】** 功能丰富：文本编辑、格式排版、多媒体插入、表格制作等。
+- **【全模态】** 人工智能：文字、语音、图片、视频，全模态功能创作体验。
+
+
+[开始](/README.md)
@@ -0,0 +1,7 @@
+- [首页](/)
+
+- 开源地址
+  - [Gitee](https://gitee.com/uai-team/uai-editor)
+  - [Github](https://github.com/uai-team/uai-editor)
+
+- 技术支持
@@ -0,0 +1,20 @@
+- 项目介绍
+  - [项目简介](introduce.md)
+  - [开始使用](installation.md)
+
+- 常规使用
+  - [文档编辑](base.md)
+  - [附件插入](insert.md)
+  - [文档导出](export.md)
+
+- 人工智能
+  - [文本生成](chat.md)
+  - [文生图片](text2image.md)
+  - [图片优化](image2image.md)
+  - [局部重绘](inpainting.md)
+  - [图片理解](imagevision.md)
+  - [语音生成](tts.md)
+  - [语音识别](asr.md)
+  - [文生视频](text2video.md)
+  - [图生视频](image2video.md)
+  - [视频理解](videovision.md)
@@ -0,0 +1,11 @@
+# 语音识别
+
+UAI Editor 支持将用户插入的语音数据转换成文本，这是一个有用的功能，尤其是在做会议纪要的时候，可以先录音，再将录音数据转换成文字。
+
+在文档中选择音频数据，在弹出的浮动菜单中点击语音识别按钮。
+
+![](images/asr-01.png)
+
+等待结果，在音频数据后面会插入语音识别的内容。
+
+![](images/asr-02.png)
@@ -0,0 +1,127 @@
+# 文档编辑
+
+UAI Editor 提供了强大且方便的文档编辑功能。这些功能都放置在“开始”选项卡下。
+
+## 标题设置
+
+选中需要设置的文本，点击工具栏中的标题设置选项，可以设置标题样式。
+
+![](images/base-01.png)
+
+比如，可以将文本设置为一级标题。
+
+![](images/base-02.png)
+
+## 字体设置
+
+选中需要设置的文本，点击工具栏中的字体选项，可以设置字体样式。
+
+![](images/base-03.png)
+
+比如，可以将文本设置为楷体。
+
+![](images/base-04.png)
+
+## 字号设置
+
+选中需要设置的文本，点击工具栏中的字号选项，可以设置字体大小。
+
+![](images/base-05.png)
+
+比如，可以将文本设置为小一。
+
+![](images/base-06.png)
+
+## 样式设置
+
+UAI Editor 也可以设置字体的基础样式。
+
+### 粗体
+
+选中需要设置的文本，点击工具栏中的粗体按钮，可以设置文本为粗体。
+
+![](images/base-07.png)
+
+### 斜体
+
+选中需要设置的文本，点击工具栏中的斜体按钮，可以设置文本为斜体。
+
+![](images/base-08.png)
+
+### 下划线
+
+选中需要设置的文本，点击工具栏中的下划线按钮，可以设置文本加下划线。
+
+![](images/base-09.png)
+
+### 删除线
+
+选中需要设置的文本，点击工具栏中的删除线按钮，可以设置文本加删除线。
+
+![](images/base-10.png)
+
+### 下标
+
+选中需要设置的文本，点击工具栏中的下标按钮，可以设置文本为下标。
+
+![](images/base-11.png)
+
+### 上标
+
+选中需要设置的文本，点击工具栏中的上标按钮，可以设置文本为上标。
+
+![](images/base-12.png)
+
+### 字体颜色
+
+选中需要设置的文本，点击工具栏中的字体颜色设置选项，可以设置文本的颜色。
+
+![](images/base-13.png)
+
+### 背景颜色
+
+选中需要设置的文本，点击工具栏中的背景颜色设置选项，可以设置文本的背景颜色。
+
+![](images/base-14.png)
+
+### 有序列表
+
+选中需要设置的文本，点击工具栏中的有序列表设置选项，可以设置有序列表。
+
+![](images/base-15.png)
+
+### 无序列表
+
+选中需要设置的文本，点击工具栏中的无序列表设置选项，可以设置无序列表。
+
+![](images/base-16.png)
+
+### 缩进
+
+选中需要设置的文本，点击工具栏中的缩进按钮，可以设置文本缩进。
+
+![](images/base-17.png)
+
+### 左对齐
+
+选中需要设置的文本，点击工具栏中的左对齐按钮，可以设置文本左对齐。
+
+![](images/base-18.png)
+
+### 居中对齐
+
+选中需要设置的文本，点击工具栏中的居中对齐按钮，可以设置文本居中对齐。
+
+![](images/base-19.png)
+
+### 右对齐
+
+选中需要设置的文本，点击工具栏中的右对齐按钮，可以设置文本右对齐。
+
+![](images/base-20.png)
+
+### 引用
+
+选中需要设置的文本，点击工具栏中的引用按钮，可以设置引用。
+
+![](images/base-21.png)
@@ -0,0 +1,37 @@
+# 文本生成
+
+UAI Editor 支持与大模型进行对话，生成文本，这些功能包含两部分：有爱智聊 和 快捷命令。
+
+## 有爱智聊
+
+在人工智能选项卡下，点击工具栏中的有爱智聊按钮。
+
+![](images/chat-01.png)
+
+在打开的对话面板界面，我们可以选择需要对话的后端模型服务，InternLM3、DeepSeek V3、GLM-4、其他公有或私有化部署的模型都可以。
+
+![](images/chat-02.png)
+
+对话结果将会展示在对话窗口中。
+
+![](images/chat-03.png)
+
+鼠标移动到对话内容上，可以展示出操作菜单，通过操作菜单我们可以将对话内容插入到文档中或替换文档中选中的内容。
+
+![](images/chat-04.png)
+
+将在文档中的光标之后插入对话内容。
+
+![](images/chat-05.png)
+
+## 快捷命令
+
+除了通过对话面板进行大模型对话，我们还提供了与大模型对话的快捷命令。将光标移动到文档中需要大模型生成内容的地方，输入空格+斜线：` /` 可以弹出快捷命令。
+
+![](images/chat-06.png)
+
+比如，我们选择大模型翻译，则会在光标后插入翻译后的内容。
+
+![](images/chat-07.png)
+
+其他快捷命令的功能类似。
@@ -0,0 +1,118 @@
+# 文档导出
+
+UAI Editor 提供了文档导出功能，包括导出成Word文档、ODT文档、Markdown文档等。这些功能都放置在“导出”选项卡下。
+
+**但是，由于项目中使用的导出DOCX,ODT, Markdown功能，依赖@tiptap-pro扩展，所以使用该扩展进行文档导出需要创建Conversion App ID和JSON Web Token (JWT)。**
+
+## 前置配置工作
+
+### 注册Tiptap Cloud账号
+
+通过[https://cloud.tiptap.dev/register](https://cloud.tiptap.dev/register)链接注册一个Tiptap Cloud账号。
+
+![](images/development-01.png)
+
+验证注册的邮箱。
+
+![](images/development-02.png)
+
+填写团队信息。
+
+![](images/development-03.png)
+
+填写个人信息。
+
+![](images/development-04.png)
+
+### 登录Tiptap Cloud账号
+
+通过[https://cloud.tiptap.dev/login](https://cloud.tiptap.dev/login)链接登录已有账号。
+
+![](images/development-05.png)
+
+### 获取Conversion App ID和JWT
+
+通过[https://cloud.tiptap.dev/v2/cloud/convert](https://cloud.tiptap.dev/v2/cloud/convert)链接，获取个人的Conversion App ID和JWT。
+
+![](images/development-06.png)
+
+这里，Conversion App ID可以直接复制，而JWT则可以参考`documentation`文档生成，或者点击`Show example JWT`按钮获得一个临时JWT。
+
+![](images/development-07.png)
+
+### 设置环境变量
+
+由于项目中使用了环境变量进行配置，所以在获得Conversion App ID和JWT之后，需要在自己的电脑上设置环境变量：`TIPTAP_APP_ID`和`TIPTAP_JWT_TOKEN`。即：
+
+```bash
+TIPTAP_APP_ID=${前面获取到的Conversion App ID}
+TIPTAP_JWT_TOKEN=${前面获取到的JWT}
+```
+
+环境变量设置好以后，重启程序，就可以正常使用导出`DOCX`，`ODT`，`Markdown`功能了。
+
+> **目前Tiptap-Pro扩展可以免费使用，缺点就是JWT有效期很短，需要经常更换，后续考虑抛弃Tiptap-Pro扩展，使用自定义的方法来进行导出。**
+
+## 导出Word文档
+
+在工具栏点击导出Word文档按钮。
+
+![](images/export-01.png)
+
+等待文档导出、下载完成。
+
+![](images/export-02.png)
+
+可以打开导出的Word文件查看内容。
+
+![](images/export-03.png)
+
+## 导出ODT文档
+
+在工具栏点击导出ODT文档按钮。
+
+![](images/export-04.png)
+
+等待文档导出、下载完成。
+
+![](images/export-05.png)
+
+可以打开导出的ODT文件查看内容。
+
+![](images/export-06.png)
+
+## 导出PDF文档
+
+在工具栏点击导出PDF文档按钮。
+
+![](images/export-07.png)
+
+点击保存按钮。
+
+![](images/export-08.png)
+
+选择合适的路径并保存。
+
+![](images/export-09.png)
+
+等待文档导出、下载完成。
+
+![](images/export-10.png)
+
+可以打开导出的PDF文件查看内容。
+
+![](images/export-11.png)
+
+## 导出图片
+
+在工具栏点击导出图片按钮。
+
+![](images/export-12.png)
+
+等待文档导出、下载完成。
+
+![](images/export-13.png)
+
+可以打开导出的图片查看内容。
+
+![](images/export-14.png)
@@ -0,0 +1,27 @@
+# 图片优化
+
+UAI-Editor 支持对插入、生成的图片进行优化，也就是图生图。
+
+在文档中选择需要优化的图片，在弹出的浮动菜单中点击图片重绘按钮。
+
+![](images/image2image-01.png)
+
+在模态对话框中，操作类型选择图片优化。
+
+![](images/image2image-02.png)
+
+在提示词输入框中输入想要优化的内容。
+
+![](images/image2image-03.png)
+
+等待模型对图片进行优化。
+
+![](images/image2image-04.png)
+
+优化完成后，我们可以从优化的结果中选择一幅自己比较满意的图片，然后点击确定按钮进行确认。
+
+![](images/image2image-05.png)
+
+最后，文档中的原始图片将会替换为经过优化的图片。
+
+![](images/image2image-06.png)
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
wux_labs	ed14ab616a	完善文档	2025-05-27 12:12:56 +08:00
wux_labs	3eb217dd4e	完善文档	2025-05-27 00:03:12 +08:00
wux_labs	c9509e78d7	完善用户操作文档	2025-05-24 22:48:10 +08:00
wux_labs	a0c69d1884	完善用户操作文档	2025-05-24 22:17:47 +08:00
wux_labs	8161426055	添加文档	2025-05-24 13:43:54 +08:00
wux_labs	1d81ec0fef	优化样式	2025-05-23 21:54:03 +08:00
wux_labs	b10a317afc	优化代码功能	2025-05-03 23:47:25 +08:00
wux_labs	8f68480cf3	优化资源项	2025-05-03 23:18:38 +08:00
wux_labs	cdfd0605a0	优化资源项	2025-05-03 15:30:50 +08:00
wux_labs	8c175367a3	优化图片导出功能	2025-05-03 00:19:25 +08:00
wux_labs	2636e34ebd	调整图片大小	2025-03-29 21:47:07 +08:00
wux_labs	76e77c84f0	界面优化	2025-03-11 21:16:38 +08:00
wux_labs	9c42eb590a	添加论文搜索功能	2025-03-11 00:59:43 +08:00
wux_labs	033c0ffdbf	界面优化	2025-03-09 23:44:02 +08:00
wux_labs	5502be0f9e	文件上传改为Base64	2025-03-01 17:54:23 +08:00
wux_labs	25eb87abdb	修改文档	2025-02-27 23:52:29 +08:00
wux_labs	52aacaaefb	添加插入文件功能	2025-02-26 13:40:36 +08:00