fix(#1737): 生成页标题框聚焦即展开标题库列表 + 下拉箭头提示 #1739

Merged

auto-approve-bot merged 1 commits from fix/1737-title-autocomplete-open into develop 2026-09-06 14:47:04 +08:00

Conversation 5 Commits 1 Files Changed 3

+210 -21

xiaoxia commented 2026-09-06 14:40:56 +08:00

Owner

Copy Link

Copy Source

问题

Issue #1737：生成页第4步标题框用 antd AutoComplete（combobox 模式），该模式默认 showAction=[]——聚焦不展开下拉，必须先打字才看到标题库；且组件默认 suffixIcon: null 无下拉箭头，用户以为是纯输入框，不知道标题库已有标题可选。实测 /api/v1/titles 返回 9 条、数据/CSS/DOM 均正常，纯交互问题。

改动

1. 新增 TitleLibraryAutoComplete（components/title/TitleLibraryAutoComplete.tsx）：
   • 受控 open：onFocus 且标题库非空时展开，展示全部标题；onSelect/失焦/Esc 关闭（rc-select 失焦会主动 onToggleOpen(false)，onOpenChange 同步 state，不死循环）
   • suffixIcon 加下拉三角（DownOutlined），视觉提示可选择；有值时 allowClear 清除按钮照常
   • 保留 combobox 自由输入能力，自定义标题不受影响
   • 标题库为空时聚焦不展开（不出「暂无数据」空壳）
2. Step4TitleSettings：单视频标题框 + 批量 N 个标题框（视频1/2/3…）统一替换为新组件，placeholder 改为「输入或从标题库选择」（批量为「输入或选择视频 N 的标题」）
3. 单测 7 例：聚焦空框展开全量 / 输入关键词过滤 / 点击项回填并关闭 / 自由输入透传不受干扰 / 空库聚焦不展开 / 箭头图标渲染 / 初始值回显

验证

• tsc --noEmit / eslint --max-warnings 0 / prettier --check 全绿
• 全量 vitest 693 passed（+5）
• npm run build 通过

验收

staging 第4步标题框一点击即弹出标题库列表，可选、可搜、可自己输入，单视频与批量模式一致。

Closes #1737

## 问题 Issue #1737：生成页第4步标题框用 antd `AutoComplete`（combobox 模式），该模式默认 `showAction=[]`——**聚焦不展开下拉**，必须先打字才看到标题库；且组件默认 `suffixIcon: null` 无下拉箭头，用户以为是纯输入框，不知道标题库已有标题可选。实测 `/api/v1/titles` 返回 9 条、数据/CSS/DOM 均正常，纯交互问题。 ## 改动 1. **新增 `TitleLibraryAutoComplete`**（`components/title/TitleLibraryAutoComplete.tsx`）： - 受控 `open`：`onFocus` 且标题库非空时展开，展示全部标题；`onSelect`/失焦/Esc 关闭（rc-select 失焦会主动 `onToggleOpen(false)`，`onOpenChange` 同步 state，不死循环） - `suffixIcon` 加下拉三角（DownOutlined），视觉提示可选择；有值时 allowClear 清除按钮照常 - 保留 combobox 自由输入能力，自定义标题不受影响 - 标题库为空时聚焦不展开（不出「暂无数据」空壳） 2. **Step4TitleSettings**：单视频标题框 + 批量 N 个标题框（视频1/2/3…）统一替换为新组件，placeholder 改为「输入或从标题库选择」（批量为「输入或选择视频 N 的标题」） 3. **单测 7 例**：聚焦空框展开全量 / 输入关键词过滤 / 点击项回填并关闭 / 自由输入透传不受干扰 / 空库聚焦不展开 / 箭头图标渲染 / 初始值回显 ## 验证 - `tsc --noEmit` / `eslint --max-warnings 0` / `prettier --check` 全绿 - 全量 vitest **693 passed**（+5） - `npm run build` 通过 ## 验收 staging 第4步标题框一点击即弹出标题库列表，可选、可搜、可自己输入，单视频与批量模式一致。 Closes #1737

xiaoxia added 1 commit 2026-09-06 14:40:56 +08:00

fix(#1737): 生成页标题框聚焦即展开标题库+下拉箭头提示 ... 7365c52e02

- 抽出 TitleLibraryAutoComplete：受控 open，聚焦（标题库非空）即展开全部标题，失焦/选中/Esc 关闭；suffixIcon 加下拉三角；保留 combobox 自由输入
- 单视频/批量 N 个标题框统一替换，placeholder 改为「输入或从标题库选择」
- 新增 7 例单测：聚焦展开全量/关键词过滤/选中回填/自由输入/空库不展开/箭头图标/初始值

gitea-actions bot commented 2026-09-06 14:42:30 +08:00

Copy Link

Copy Source

🚀 预览环境已部署

项目	详情
PR号	#1739
预览链接	https://pr-1739.preview.xiaoxiajianji.com
API环境	staging

💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。

🔄 每次提交新代码后预览环境会自动更新。

🗑️ PR 关闭或合并后，预览环境会自动清理。

🚀 **预览环境已部署** | 项目 | 详情 | |------|------| | PR号 | #1739 | | 预览链接 | [https://pr-1739.preview.xiaoxiajianji.com](https://pr-1739.preview.xiaoxiajianji.com) | | API环境 | staging | > 💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。 > > 🔄 每次提交新代码后预览环境会自动更新。 > > 🗑️ PR 关闭或合并后，预览环境会自动清理。

auto-approve-bot approved these changes 2026-09-06 14:43:05 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

auto-approve-bot approved these changes 2026-09-06 14:43:05 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

auto-approve-bot commented 2026-09-06 14:44:10 +08:00

Collaborator

Copy Link

Copy Source

代码审查结果 - PR #1739

⚠️ 问题（0个需要修改）

无

💡 建议（1个可选）

1. TitleLibraryAutoComplete.tsx 第45行：filterOption 函数在组件每次渲染时都会重新创建，导致 AutoComplete 组件接收到新的 props 引用，可能触发不必要的子组件重渲染或过滤逻辑重新计算。
   • 修改建议：使用 useMemo 包裹 filterOption，或将其移至组件外部。

---

✅ 格式检查通过 | ✅ 逻辑审查通过 | ⚠️ 建议关注性能

---

_{🤖 由 AI 代码审查机器人自动生成 | 2026-09-06 06:44:10 | 模型:}

## 代码审查结果 - PR #1739 ### ⚠️ 问题（0个需要修改） 无 ### 💡 建议（1个可选） 1. **TitleLibraryAutoComplete.tsx 第45行**：`filterOption` 函数在组件每次渲染时都会重新创建，导致 `AutoComplete` 组件接收到新的 props 引用，可能触发不必要的子组件重渲染或过滤逻辑重新计算。 - 修改建议：使用 `useMemo` 包裹 `filterOption`，或将其移至组件外部。 --- ✅ 格式检查通过 | ✅ 逻辑审查通过 | ⚠️ 建议关注性能 --- _{🤖 由 AI 代码审查机器人自动生成 | 2026-09-06 06:44:10 | 模型:} <!-- AI_CODE_REVIEW_AUTO_COMMENT -->

auto-approve-bot merged commit e148f995a8 into develop 2026-09-06 14:47:04 +08:00

auto-approve-bot deleted branch fix/1737-title-autocomplete-open 2026-09-06 14:47:04 +08:00

gitea-actions bot commented 2026-09-06 14:47:25 +08:00

Copy Link

Copy Source

🗑️ 预览环境已清理

PR #1739 已关闭或合并，对应的预览环境已被清理。

如有需要，可以重新打开 PR 来重新生成预览环境。

🗑️ **预览环境已清理** PR #1739 已关闭或合并，对应的预览环境已被清理。 > 如有需要，可以重新打开 PR 来重新生成预览环境。

Sign in to join this conversation.

Reviewers

No Reviewers

auto-approve-bot

Labels

Clear labels

P0

阻塞性，必须立即处理

P1

高优先级

P2

中优先级

P3

低优先级/后考虑

architecture

架构设计

backend

后端相关

blocked

阻塞中

bug

Bug修复

ci-bug

CI本身的bug

ci-optimization

CI优化类任务

ci-pipeline

CI流水线/workflow相关

cleanup

代码清理

devops

运维/部署/CI

documentation

文档相关

feature

新功能

frontend

前端相关

question

需要讨论确认

ready

PR CI通过，可合并

refactor

代码重构

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

auto-approve-bot xiaoxia

No Assignees

3 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#1739