30 lines
1.9 KiB
Markdown
30 lines
1.9 KiB
Markdown
# 需求分析 —— 2026-04-18-19-37-56
|
||
|
||
## 需求来源
|
||
用户在实际使用中发现 4 个编辑器体验问题，要求进行修复和优化。
|
||
|
||
## 需求概述
|
||
|
||
### 需求 1：视频上传按钮位置调整
|
||
在 `ReportEditor` 的「视频分析」面板中，「上传视频」按钮当前位于视频缩略图列表的首位。用户希望将其移至列表末尾，以符合「先列出已有视频，最后提供添加操作」的操作直觉。
|
||
|
||
### 需求 2：图片占位符提示文字绝对居中
|
||
图片占位符（`.image-placeholder`）内的提示文字（如「插入/点击放置图片」）目前未在框中绝对居中。当占位符高度较大或行高不一时，文字会偏上或偏下。用户希望文字在占位符内绝对居中显示。
|
||
|
||
### 需求 3：删除图片后占位符恢复原始大小
|
||
当向图片占位符插入图片后，占位符会收缩到图片实际尺寸（`width:auto; height:auto`）。但点击「×」删除图片后，占位符不会恢复为原始预设大小，而是保持收缩后的尺寸。用户希望删除后占位符能恢复为最初创建时的宽度和高度。
|
||
|
||
### 需求 4：对齐按钮导致混合排版换行
|
||
点击富文本工具栏的「左对齐/居中/右对齐」按钮时，浏览器原生的 `document.execCommand('justifyLeft')` 等命令会粗暴地用 `<div align="left">` 包裹选区，导致包含 `.field-value` 或 `.image-placeholder` 的段落被肢解，文字与输入框/图片强制换行分离。用户希望对齐操作安全地作用于整个段落，不破坏混合排版结构。
|
||
|
||
## 涉及文件
|
||
- `src/pages/ReportEditor.tsx`（需求 1、2、3、4）
|
||
- `src/pages/TemplateManage.tsx`（需求 2、3、4）
|
||
- `src/utils/defaultContent.ts`（需求 2、3）
|
||
|
||
## 需求影响范围
|
||
- 视频分析面板布局
|
||
- 图片占位符的视觉表现和交互反馈
|
||
- 富文本对齐功能的实现方式
|
||
- 默认模板中占位符的 HTML 结构
|