文字模拟面试

页面17-f7-interview.html · 文字模拟面试 · F7 · 验收见 ⑧ · 分工见 ⓪

阅读方式：每条先写界面上是什么，再写元素 ID 与接口。

展示顺序（按角色 · 章节号固定）

• 产品 / 老板：⓪ → ①～⑤ → ⑧
• 测试：⑧ → ①～⑤ → ⑦
• 研发：接口速查 → ①～⑤ → ⑥ → ⑦
• UI：①～⑤（图标路径在控件下）
• 数据 / 增长：⑨ → ⑥
• 多态页：③ 内分态 · ⑥⑦⑧⑨ 号不变

接口本页唯一 · POST /ai/f7/reply → list_chat_messages · 原型 mock · 完整见 ⑥

⓪ 本页做什么 · 分工速查

一句话：基于简历的 AI 文字模拟面试，3 能量点/轮，非真实 HR 承诺。

• 产品 / 老板：⑧；导出 PDF 后解锁 · 3 点/轮计费
• 测试：⑧ · 对话流 + 底栏输入发送
• UI：面试官/用户气泡 + 贴底输入栏
• 前端：F7 对话 API· 详 ⑥
• 合规：「非真实 HR 承诺」· AI 生成标识

① 顶栏 · 屏幕最上方

• 返回箭头 → btn_nav_back · 优先 history.back() · fallback 23-assistant-tab.html · index 机模 data-embed-back="shell" 回当前 Tab 壳层
• 「文字模拟面试」 · F7 徽章 → page_title
• 「非真实 HR 承诺 · 3 点/轮」 · 灰色小字 · 只展示

② 对话区 · 主内容滚动

• 消息列表容器 → list_chat_messages · chat-scroll-inner 贴 composer 上方 · 脚本追加用户气泡入此容器
• 面试官首问 · 「请用 1 分钟介绍你自己…」→ chat_interviewer
• 用户回答气泡 · 市场营销实习 · 示例文案 → chat_user
• 面试官追问 · 「你提到数据复盘…」→ chat_interviewer
• 「AI 生成」 · 居中标识 · 只展示 · 在 chat-scroll-footer

③ 贴底输入栏

• 输入框 · placeholder「输入回答…」→ input_interview_reply · type="text" · maxlength="2000" · enterkeyhint="send"
  • 长度：1～2000 字/轮 · 前端 maxlength + 粘贴超限 Toast「内容不能超过 2000 字」· 上线 API 同上限校验
  • 格式：纯文本 · 发送前 trim · 气泡用 textContent 渲染（不解析 HTML/脚本）
  • 为空：点发送 / Enter → 红框 · 无 Toast · 不调 API
  • 非空提交后：追加用户气泡 → 清空输入 · 滚到底 · 正式上线 再调 POST /ai/f7/reply 追加 AI 回复
• 「发送」 · 橙色按钮 → btn_send_reply
• 获焦：点输入框或 composer 空白 → 调起系统键盘 · composer 随 visualViewport 贴键盘上方 · 消息区滚到底
• 脚本 · _chat-composer.js · 与 29-emotion-d 共用

④ 本页无多态 Tab

单屏对话态 · 加载/失败态上线扩展见 ⑨。

⑤ 本页无底部 Tab

沉浸主路径支路 · 仅顶栏返回。

⑥ 模拟面试 · POST /ai/f7/reply（本页唯一）

说明：每轮用户发送走本接口；原型由 _chat-composer.js mock 气泡。上线追加 AI 回复到 list_chat_messages。路径以 dev-notes 拍板为准。替换清单 → dev-notes · 静态 mock → API。

• 何时调 · 点发送 / Enter · 非进页 GET
• 鉴权 · 需登录 · 扣能量点（规则见 dev-notes）
• 请求 · session_id · message（1～2000 字 · trim 后非空）· 可选 resume_id
• 响应→控件 · reply.text → 新 AI 气泡 · reply.follow_up 可选
• 失败与边界 · 空输入红框 · 超长 400 + Toast · 余额不足 → 跳充值 · 超时 Toast · 服务端须拒超大 body（防 paste 攻击）

⑦ 入口 · 出口

• 入口：助手 Tab · 能力中心 F7 · 表情分析完成页
• 出口：继续对话 · 返回助手 Tab（主入口）/ 能力中心 / 首页（依进入路径）

⑧ 怎么验收

1. 左右对照：面试官首问、用户示例回答、追问文案须与 ② 一致。
2. 接口专章：滚到 ⑥ · 可见 POST /ai/f7/reply 何时调与消息区映射。
3. 打开：双击 17-f7-interview.html。
4. 对话：见双气泡 + 底栏输入「输入回答…」+「发送」；输入栏贴屏幕最底（短对话也不得悬空）。
5. 消息贴底：气泡区贴在输入栏正上方 · 非屏幕中部悬空。
6. 获焦输入：点输入框 → 光标/键盘出现 · composer 高亮 · 可键入并发送（原型追加用户气泡）。
7. 长度：粘贴超长文本 → Toast「内容不能超过 2000 字」· 气泡不撑爆布局。
8. 合规：顶栏「非真实 HR 承诺」+ 底部 AI 标识可见。
9. 返回：index 机模「助手」Tab → 模拟面试 → ← 须回到 23-assistant-tab.html（非首页）。

⑨ 团队补充

• 图标资产（第二批） · app-image/ICON-CATALOG.md · 全站通用 §7 · 上传 §8 · 品牌 §9 · 本页见 §10 索引表
• 图标资产（第三批） · app-image/ICON-CATALOG.md · 状态栏 §11 · 增长/分享 §12 · 表单/附件 §13 · 法务 §14 · 订单/空态 §15 · 媒体/语音 §16 · 本页见 §10
• 图标资产（第四批） · app-image/ICON-CATALOG.md · F4 模块 §18 · 状态徽章 §19 · 弹窗/加载 §20 · 联系打码 §21 · 折叠/更多 §22 · 文件类型 §23 · 分享装饰 §24 · 账号 §25 · 本页见 §10
• 分期与排期 · 产品/研发见 launch-static-to-api · 开发说明 ②～⑦ 不写「阶段 N」
• 埋点 · f7_start · f7_reply_send · f7_round_complete
• 原型限制：静态对话 mock · 发送无响应 · 正式上线 → launch-static-to-api