更新配置4
This commit is contained in:
@@ -12,27 +12,32 @@ metadata:
|
||||
|
||||
## 会话摘要
|
||||
|
||||
用户反馈前端图标选择器(IconPicker)缺少直接上传功能——需要先到文件管理页面上传图片,再回到表单选择。本次在 IconPicker 组件的"已上传"标签页中增加了上传按钮,支持直接在弹窗内上传图标图片,上传完成后自动选中。
|
||||
1. IconPicker 增加上传按钮:前端图标选择器"已上传"标签页增加直接上传功能
|
||||
2. 修复 /view 端点 404:后端新增文件预览代理端点,每次请求实时向文件服务器获取 Token 并代理返回图片
|
||||
|
||||
## 关键操作
|
||||
|
||||
### IconPicker 增加上传按钮
|
||||
### 一、IconPicker 增加上传按钮
|
||||
|
||||
- **做了什么**: 在 IconPicker.vue 的"已上传"标签页头部增加了「上传」按钮,点击后选择图片即自动上传到文件服务(fileType=icon),上传完成自动刷新列表并选中新图标
|
||||
- **涉及文件**: `mokee-gateway-web/src/components/IconPicker.vue`
|
||||
- **具体改动**:
|
||||
1. 模板:在 popup-header 中添加 `<el-button>` 上传按钮(仅在 tab==='upload' 时显示)+ 隐藏 `<input type="file">`
|
||||
2. 模板:添加 `.upload-status-bar` 上传进度条(el-progress + Loading 动画)
|
||||
3. 脚本:导入 `Upload`, `Loading` 图标和 `ElMessage`
|
||||
4. 脚本:添加 `FILE_SERVICE`, `uploading`, `uploadPercent`, `fileInputRef` 状态
|
||||
5. 脚本:实现 `getFileServiceToken()` — 直调文件服务获取 Token(带缓存)
|
||||
6. 脚本:实现 `triggerUploadIcon()` / `onIconFileSelected()` — 选择文件后自动上传
|
||||
7. 样式:添加 `@keyframes spin` 和 `.upload-status-bar` 样式
|
||||
|
||||
- **上传流程**: 选择图片 → 获取文件服务 Token → FormData 上传(fileType=icon)→ file.wg.zgitm.com/api/upload → 刷新列表 → 自动选中新图标
|
||||
|
||||
- **结果**: TypeScript 编译通过,IconPicker.vue 无类型错误
|
||||
|
||||
### 二、新增文件预览代理端点 GET /{id}/view
|
||||
|
||||
- **做了什么**: 用户反馈上传图标后 `<img>` 加载 `/zgapi/v1/admin/file/{id}/view` 返回 404,原因是文件迁至外部存储后该端点被移除。本次在 admin 后端重新实现该端点,每次请求自动向文件服务器获取 Token → 下载文件 → 返回给浏览器
|
||||
- **涉及文件**:
|
||||
1. `mokee-gateway-admin/.../config/WebMvcConfig.java` — 新增 `fileServiceRestTemplate` Bean
|
||||
2. `mokee-gateway-admin/.../service/FileService.java` — 新增 `view()` 方法签名
|
||||
3. `mokee-gateway-admin/.../service/impl/FileServiceImpl.java` — 实现核心逻辑:查元信息 → 获取 Token → RestTemplate 代理下载 → 写回 HttpServletResponse
|
||||
4. `mokee-gateway-admin/.../controller/FileController.java` — 新增 `GET /{id}/view` 端点
|
||||
- **结果**: Maven 编译通过,零错误
|
||||
- **设计要点**:
|
||||
- 文件服务 URL 通过 `@Value("${file.service.url:https://file.wg.zgitm.com}")` 注入,可配置
|
||||
- Token 不使用缓存,每次请求实时获取(避免一次消费问题)
|
||||
- 端点不受 `UserContextInterceptor` 拦截(WebMvcConfig 中已排除 `/view` 路径)
|
||||
- 错误时返回纯文本状态(404/502/500),不依赖 JSON 响应结构
|
||||
|
||||
## 重要信息
|
||||
|
||||
- 文件服务 URL: `VITE_FILE_SERVICE_URL` 环境变量,默认 `https://file.wg.zgitm.com`
|
||||
|
||||
Reference in New Issue
Block a user