190 lines
6.5 KiB
Markdown
190 lines
6.5 KiB
Markdown
## 2026-10-22 后台转码设置页面
|
||
|
||
### 开工确认与计划
|
||
|
||
- 仓库：ReelShortWeb
|
||
- 基线：`develop` / `origin/develop` = `723d056`
|
||
- 工作区：开工前干净
|
||
- 分支：`feature/transcode-profile-settings`
|
||
- 计划：`docs/plans/2026-10-22-transcode-profile-settings.md`
|
||
|
||
```text
|
||
$ git status --short --branch && git rev-parse --short HEAD
|
||
## develop...origin/develop
|
||
723d056
|
||
```
|
||
|
||
解读：基于指定 develop 基线创建隔离工作树。后端契约已确认字段为
|
||
`enabled / segmentSeconds / ladder / sprite`，权限为 `episode:upload`。
|
||
默认服务端动态菜单只读取 `sys_menu`，本单按“只改 Web”约束在不改后端的前提下，
|
||
对具备 `episode:upload` 的账号补充本地受控菜单，后端接口仍执行最终鉴权。
|
||
|
||
### 实现与门禁
|
||
|
||
- 新增 `/content/media-transcode` 静态路由和服务端动态菜单补充；
|
||
菜单标题走 `router.transcodeSettings`，只在账号具备 `episode:upload` 时加入。
|
||
- 新增转码设置页面，字段严格为 `enabled / segmentSeconds / ladder / sprite`；
|
||
支持档位增删、动态行校验、首个错误字段定位及服务端返回值回填。
|
||
- API 使用现有 axios Result 包装，GET 初始化、PUT 保存；成功/失败/校验提示全部走中英 i18n。
|
||
- 当前工程没有单元/组件测试框架，未新增依赖；使用 ESLint、TypeScript 与构建门禁。
|
||
|
||
```text
|
||
$ pnpm lint:eslint
|
||
> fruitshorts-admin@1.0.0 lint:eslint /private/tmp/reelshortweb-transcode-settings
|
||
> eslint --fix --ext .js,.ts,.vue ./src
|
||
|
||
$ pnpm ts:check
|
||
> fruitshorts-admin@1.0.0 ts:check /private/tmp/reelshortweb-transcode-settings
|
||
> pnpm vue-tsc --noEmit --skipLibCheck
|
||
```
|
||
|
||
解读：ESLint 零告警，TypeScript 类型检查通过。
|
||
|
||
```text
|
||
$ pnpm build:dev
|
||
> fruitshorts-admin@1.0.0 build:dev /private/tmp/reelshortweb-transcode-settings
|
||
> VITE_CJS_IGNORE_WARNING=1 vite build --mode dev
|
||
|
||
WARN Circular chunk: element-plus -> vue-chunks -> element-plus. Please adjust the manual chunk logic for these chunks.
|
||
|
||
Build successful. Please see dist-dev directory
|
||
```
|
||
|
||
解读：开发构建成功；circular chunk 为仓库既有 Element Plus 分包警告，本次未改构建配置。
|
||
|
||
## 2026-10-22 剧集转码面板组件拆分
|
||
|
||
- 分支：`feature/transcode-panel-split`
|
||
- 基线：`develop` / `origin/develop` = `52b10d3`
|
||
- 计划：`docs/plans/2026-10-22-transcode-panel-split.md`
|
||
|
||
已读取 `AGENTS.md` 与 `CODING_STANDARDS.md`。当前
|
||
`EpisodeTranscodePanel.vue` 为 816 行，超过单文件 500 行红线。
|
||
拆分将保持父组件的数据获取、轮询清理、分页请求与切集重置逻辑不变。
|
||
|
||
### 拆分结果
|
||
|
||
```text
|
||
$ wc -l src/views/contentManagement/upload/EpisodeTranscodePanel.vue \
|
||
src/views/contentManagement/upload/EpisodeTranscodeStatusBadge.vue \
|
||
src/views/contentManagement/upload/EpisodeTranscodeStatusPanel.vue \
|
||
src/views/contentManagement/upload/EpisodeTranscodeRenditions.vue \
|
||
src/views/contentManagement/upload/EpisodeTranscodeFrames.vue \
|
||
src/views/contentManagement/upload/episodeTranscodeUi.ts
|
||
266 EpisodeTranscodePanel.vue
|
||
45 EpisodeTranscodeStatusBadge.vue
|
||
155 EpisodeTranscodeStatusPanel.vue
|
||
119 EpisodeTranscodeRenditions.vue
|
||
315 EpisodeTranscodeFrames.vue
|
||
93 episodeTranscodeUi.ts
|
||
```
|
||
|
||
解读：父面板只保留接口调用、轮询、请求序号、分页状态与组件组合；
|
||
状态、清晰度、帧图分别独立，全部文件均低于 500 行。
|
||
|
||
### 门禁
|
||
|
||
```text
|
||
$ pnpm ts:check
|
||
> vue-tsc --noEmit --skipLibCheck
|
||
（通过）
|
||
|
||
$ pnpm lint:eslint
|
||
> eslint --fix --ext .js,.ts,.vue ./src
|
||
（0 error / 0 warning）
|
||
|
||
$ pnpm build:dev
|
||
WARN Circular chunk: element-plus -> vue-chunks -> element-plus.
|
||
Build successful. Please see dist-dev directory
|
||
```
|
||
|
||
解读：组件 props/emits、类型检查、ESLint 和开发构建全部通过；
|
||
循环 chunk 为项目既有警告。轮询启停、接口路径、分页参数和 locales 文案未改变。
|
||
|
||
## 2026-10-22 转码媒资 ID 前端精度修复
|
||
|
||
- 分支：`feature/transcode-media-id-fix-ui`
|
||
- 基线：`develop` / `origin/develop` = `a4893c3`
|
||
|
||
已复现 `Number('2113150398670966786')` 变为 `2113150398670966800`。
|
||
本次将媒资、任务 id 全链路按字符串处理，禁止 Number 转换；没有媒资时
|
||
禁用重新转码并显示空态。
|
||
|
||
```text
|
||
$ node -e "const id='2113150398670966786'; console.log(String(Number(id)))"
|
||
2113150398670966800
|
||
```
|
||
|
||
解读：Snowflake id 超过 JS 安全整数，字符串化后的 Number 已失真。
|
||
|
||
### 实现
|
||
|
||
- `EpisodeTranscodeItem` 的 episodeId/mediaAssetId/taskId，以及 rendition/thumbnail
|
||
相关 id 类型改为字符串。
|
||
- 父面板使用 `detail.mediaAssetId` 原始字符串和正则校验，不再 Number 转换。
|
||
- 手动转码与帧图分页接口原样传递字符串 id。
|
||
- `mediaAssetId` 为空时按钮保持禁用，空态优先展示后端 errorMsg 原因。
|
||
|
||
静态检查确认：
|
||
|
||
```text
|
||
$ rg -n "Number\([^\n]*mediaAssetId|mediaAssetId[^\n]*Number\(" \
|
||
src/views/contentManagement/upload src/api/admin
|
||
（无匹配）
|
||
```
|
||
|
||
### 门禁
|
||
|
||
```text
|
||
$ pnpm lint:eslint
|
||
> eslint --fix --ext .js,.ts,.vue ./src
|
||
（0 error / 0 warning）
|
||
|
||
$ pnpm ts:check
|
||
> vue-tsc --noEmit --skipLibCheck
|
||
（通过）
|
||
|
||
$ pnpm build:dev
|
||
WARN Circular chunk: element-plus -> vue-chunks -> element-plus.
|
||
Build successful. Please see dist-dev directory
|
||
```
|
||
|
||
解读：字符串 id 链路、类型检查、ESLint 与开发构建均通过；
|
||
循环 chunk 为项目既有警告。
|
||
|
||
## 2026-10-22 转码面板实时进度与更新时间
|
||
|
||
- 分支：`feature/transcode-progress-ui`
|
||
- 基线：`develop` / `origin/develop` = `0d5d0d8`
|
||
- 计划：`docs/plans/2026-10-22-transcode-progress-ui.md`
|
||
|
||
后端将补充 task.updatedAt；前端在现有轮询面板中展示进度、状态、
|
||
最近更新时间，并在 RUNNING/QUEUED progress=0 时显示等待进度上报提示。
|
||
|
||
### 实现
|
||
|
||
- `EpisodeTranscodeItem` 增加 `updatedAt`。
|
||
- 状态区展示“最近更新”，格式沿用 `formatDateTime`。
|
||
- RUNNING/QUEUED 且 progress=0 时显示“处理中（等待进度上报）”。
|
||
- SUCCESS/FAILED 继续停止轮询；关闭面板继续清理定时器。
|
||
- 所有 id 保持字符串传递，不引入 Number 转换。
|
||
|
||
### 门禁
|
||
|
||
```text
|
||
$ pnpm lint:eslint
|
||
> eslint --fix --ext .js,.ts,.vue ./src
|
||
（0 error / 0 warning）
|
||
|
||
$ pnpm ts:check
|
||
> vue-tsc --noEmit --skipLibCheck
|
||
（通过）
|
||
|
||
$ pnpm build:dev
|
||
WARN Circular chunk: element-plus -> vue-chunks -> element-plus.
|
||
Build successful. Please see dist-dev directory
|
||
```
|
||
|
||
解读：进度与更新时间类型、ESLint、TypeScript 和开发构建全部通过；
|
||
循环 chunk 为项目既有警告。
|