# UEditor 组件配置修正说明

## 修正内容

### 1. 导入问题修正

**修正前：**
```javascript
import { computed, onMounted, reactive, ref } from 'vue'
import userApi from "../api/user";
```

**修正后：**
```javascript
import { computed, reactive } from 'vue'
// 移除了不存在的 userApi 导入
// 移除了未使用的 onMounted, ref 导入
```

### 2. 文件上传接口修正

**修正前：**
```javascript
serverUrl: '/admin/api/admin/system/editor', // 不存在的接口
```

**修正后：**
```javascript
serverUrl: '/support/file/upload', // 使用项目中已存在的文件上传接口
```

### 3. UEditor路径配置修正

**修正前：**
```javascript
UEDITOR_HOME_URL: import.meta.env.MODE=="development"?'/static/UEditorPlus/':'/admin/web/static/UEditorPlus/',
UEDITOR_CORS_URL: import.meta.env.MODE=="development"?'/static/UEditorPlus/':'/admin/web/static/UEditorPlus/',
```

**修正后：**
```javascript
UEDITOR_HOME_URL: '/UEditorPlus/',
UEDITOR_CORS_URL: '/UEditorPlus/',
```

### 4. 配置加载方式修正

**修正前：**
```javascript
loadConfigFromServer: true, // 从服务器加载配置
```

**修正后：**
```javascript
loadConfigFromServer: false, // 使用本地配置，避免服务器配置冲突
```

## 新增配置

### 文件上传配置

```javascript
// 图片上传配置
imageActionName: 'uploadimage',
imageFieldName: 'file',
imageMaxSize: 2048000, // 2MB
imageAllowFiles: ['.png', '.jpg', '.jpeg', '.gif', '.bmp'],
imageCompressEnable: true,
imageCompressBorder: 1600,

// 视频上传配置
videoActionName: 'uploadvideo',
videoFieldName: 'file',
videoMaxSize: 102400000, // 100MB
videoAllowFiles: ['.flv', '.swf', '.mkv', '.avi', '.rm', '.rmvb', '.mp4', '.webm'],

// 附件上传配置
fileActionName: 'uploadfile',
fileFieldName: 'file',
fileMaxSize: 51200000, // 50MB
fileAllowFiles: ['.doc', '.docx', '.pdf', '.zip', '.rar', '.txt', '.md']
```

### 错误处理配置

```javascript
tipError: function(message, title) {
  console.error('UEditor Error:', message);
  // 可以在这里集成项目的消息提示组件
}
```

## 文件上传流程

UEditor组件现在使用项目中的标准文件上传接口：

1. **接口地址**: `/support/file/upload`
2. **认证方式**: Bearer Token (从localStorage获取)
3. **文件字段**: `file`
4. **支持格式**: 根据文件类型自动识别

## 使用说明

### 基本用法

```vue
<template>
  <UEditor v-model="content" :id="'my_editor'" />
</template>

<script setup>
import { ref } from 'vue';
import UEditor from '/@/components/business/ueditor.vue';

const content = ref('<p>初始内容</p>');
</script>
```

### 在文章管理中使用

```vue
<template>
  <a-form-item label="内容" name="articleContent">
    <UEditor v-model="form.articleContent" :id="'article_content'" />
  </a-form-item>
</template>
```

## 注意事项

1. **文件上传**: 确保后端接口 `/support/file/upload` 正常工作
2. **认证**: 确保用户已登录且token有效
3. **文件大小**: 图片限制2MB，视频限制100MB，附件限制50MB
4. **路径配置**: UEditor资源文件位于 `/public/UEditorPlus/` 目录

## 测试建议

1. 测试基本文本编辑功能
2. 测试图片上传功能
3. 测试视频和附件上传功能
4. 检查文件上传后的显示效果
5. 验证错误处理是否正常工作

## 相关文件

- **组件文件**: `src/components/business/ueditor.vue`
- **资源文件**: `public/UEditorPlus/`
- **文件上传API**: `src/api/support/file-api.js`
- **文章管理表单**: `src/views/business/case-clinical-article/case-clinical-article-form.vue`