DEMO-AGENT/docs/5.开发计划/1.自动汇总-前端线框图.md

自动汇总前端线框图

评审目标

在实现三栏页面前，先确认审核智能体工作台的信息架构、右侧文件汇总面板、工作流状态展示和移动端降级方式。

桌面端布局

flowchart LR
    A["左栏：会话列表<br/>新对话 / 搜索 / 历史会话"] --> B["中栏：聊天区<br/>顶部导航 / 消息流 / 输入框"]
    B --> C["右栏：文件汇总面板"]
    C --> C1["上半区：上传区<br/>拖拽上传 / 选择文件 / 上传状态"]
    C --> C2["中段：当前对话附件<br/>文件名 / 版本 / 大小 / 状态 / 删除"]
    C --> C3["下半区：工作流卡片<br/>批次号 / 节点进度 / 下载入口"]

右侧面板结构

flowchart TB
    P["文件汇总面板"] --> U["上传拖拽区"]
    U --> U0["无附件：提示上传文件或压缩包"]
    U --> U1["上传中：显示文件名和处理中状态"]
    U --> U2["上传失败：展示错误并允许重试"]
    P --> L["附件列表"]
    L --> L1["active 版本优先展示"]
    L --> L2["历史版本保留展示"]
    L --> L3["逻辑删除后从默认候选移除"]
    P --> W["工作流卡片列表"]
    W --> W1["运行中：节点逐项更新"]
    W --> W2["成功：展示 Markdown/Excel 下载"]
    W --> W3["失败：展示失败节点和错误说明"]

工作流状态流转

stateDiagram-v2
    [*] --> Pending: 用户上传附件
    Pending --> Running: 发送自动汇总提示词
    Running --> Extracting: 固化附件
    Extracting --> Scanning: 解压完成或跳过
    Scanning --> Counting: 生成文件清单
    Counting --> Detecting: 页数统计完成
    Detecting --> Reporting: 产品名识别完成
    Reporting --> Success: 生成报告与下载
    Running --> Failed: 批次级异常
    Extracting --> Failed: 解压安全检查失败
    Reporting --> Failed: 报告生成失败
    Success --> Restored: 刷新页面后状态恢复
    Failed --> Restored: 刷新页面后状态恢复

移动端布局

flowchart TB
    M["移动端工作台"] --> T["顶部：侧栏按钮 / 当前页面 / 用户菜单"]
    T --> Chat["聊天区优先展示"]
    Chat --> Composer["底部输入框"]
    T --> Drawer["会话侧栏抽屉"]
    Chat --> Panel["文件汇总面板下移或折叠"]
    Panel --> Upload["上传区"]
    Panel --> Workflow["工作流卡片"]

关键评审点

• 桌面端保持左侧会话、中间聊天、右侧文件汇总三栏，不改变现有聊天主路径。
• 右侧面板上半部分用于上传和附件列表，下半部分用于批次工作流卡片。
• 工作流卡片节点顺序固定为：附件固化、压缩包解压、文件扫描、页数统计、产品识别、报告输出、完成。
• 助手消息中的文件汇总结果使用安全 Markdown 渲染，用户消息仍按纯文本转义。
• 移动端优先保证聊天可用，文件汇总面板折叠或下移，不能遮挡输入框。