# 左侧栏数字员工树形目录与 13/14 寸适配计划

  ## Summary
  在不改业务逻辑的前提下，重构客户端左侧栏的信息密度和响应式表现。目标是：删除顶部 logo 品牌块，让导航和新建对话整体上移；把新建对话下方的专家区改成固定高度的“数字员工”树形目录；同时保持当前蓝紫玻璃质感、浅色渐变、圆角卡片、细描边的原 有
  风格，不引入突兀的新视觉语言。

  ## Design Direction
  - 延续现有风格：
    - 保留浅色玻璃背景、蓝紫边框、柔和渐变、圆角卡片、轻阴影。
    - 不改成纯扁平黑白，也不引入强烈新配色。
    - 树形目录使用当前已有的紫蓝高亮、浅底卡片、细滚动条。
  - 降低突兀感：
    - 分类行高度、字体、圆角接近现有 `nav-item` 和 `sidebar-session-card`。
    - 展开专家项使用现有专家 SVG 图标体系，不用 emoji。
    - 动效只保留 150–200ms 的颜色/箭头旋转，不做明显弹层或位移动画。
  - 信息层级：
    - 顶部：主导航 + 新建对话。
    - 中部固定块：标题 `数字员工` + 树形分类。
    - 底部弹性块：会话列表。

  ## Key Changes
  - `App.tsx` 结构调整：
    - 删除 `<div className="sidebar-logo-block">...千匠问天...</div>`。
    - 保留 `nav-list`、`sidebarNewSessionAction` 原 class，避免影响自动化。
    - 在 `sidebar-experts-entry` 内新增标题栏：
      - 左侧文字：`数字员工`
      - 可选右侧轻量计数：专家总数，例如 `8`
    - 当前 `CATEGORY_CONFIG` 保留分类 id/name，但移除 emoji icon 依赖。
    - 分类头从 `<div onClick>` 改为 `<button type="button">`。
    - 专家项从 `<div onClick>` 改为 `<button type="button">`。
    - 展开内容改为行内树结构，不再使用绝对定位弹出层。
  - 树形目录行为：
    - 点击“内容营销”展开其专家列表，再点收起。
    - 点击专家后继续调用现有 `handleExpertSelect(entry)`。
    - 点击专家后仍关闭所有展开分类，沿用当前 `setExpandedCategories({})` 行为。
    - 空分类不展示展开内容；分类行仍显示但可禁用或显示 `0`，推荐显示但禁用展开。
  - 样式调整：
    - `.sidebar` 改为响应式宽度：`clamp(232px, 19vw, 280px)`。
    - 删除 logo 后缩小 `.sidebar-top` 的 gap 和顶部 padding，让“对话”区域自然上移。
    - `.sidebar-experts-entry` 固定高度：
      - 普通桌面：约 `280px`
      - 13/14 寸紧凑屏：约 `220–240px`
    - `.sidebar-expert-scroll` 只在数字员工块内部滚动：
      - `overflow-y: auto`
      - `overflow-x: hidden`
      - 透明/细滚动条
    - `.sidebar-session-section` 保持 `minmax(0, 1fr)`，吃掉剩余高度。
  - 13/14 寸适配：
    - 增加紧凑断点，推荐条件：
      - `@media (max-width: 1440px), (max-height: 820px)`
    - 紧凑模式压缩：
      - sidebar padding：从约 `24px/16px` 降到 `14–16px/12px`
      - nav-item 高度：从 `44px` 降到 `38–40px`
      - 新建对话高度：从 `46px` 降到 `40px`
      - 数字员工块 padding/gap 下降 2–4px
      - 会话卡片高度和间距轻微下降
    - 保证主工作区仍使用 `minmax(0, 1fr)`，不产生横向滚动。

    - `switchExpert`
    - `activateHomeShortcut`
    - `openHomeChat`
    - `nav-item`
    - `conversation-new-session`
    - `sidebar-new-session`
    - `sidebar-digital-workers-title`
    - `expert-tree-list`
    - `expert-tree-category`
    - `expert-tree-category-trigger`
    - `expert-tree-expert`

  ## Risk Points
  - `styles.css` 里侧栏样式重复较多，后面的 `.conversation-shell ...` 规则优先级更高，实际改动应放在后段生效区，避免被覆盖。
  - 删除 logo 后，侧栏顶部高度会明显变化，需要检查窗口拖拽区域是否仍可用。
  - 固定数字员工高度可能挤压会话列表，必须在 `1366×768` 检查。
  - 分类匹配目前依赖正则识别专家 id/name，新增专家可能落到“其他专家”。
  - 不要删除核心 DOM class，否则 smoke helper 或自动化选择器可能失效。
  - 当前有残留 Electron 进程 PID `32180` 曾拒绝结束，后续跑 smoke 前需确认不会干扰测试。

  ## Test Plan
  - 静态验证：
    - `corepack pnpm typecheck`
    - `corepack pnpm build`
  - 手动视觉检查：
    - `1366×768`：13 寸常见低高屏，重点看是否挤压、是否横向滚动。
    - `1440×900`：14 寸常见比例。
    - `1536×864`：Windows 缩放常见工作区。
    - `1920×1080`：标准桌面。
  - 功能检查：
    - “对话 / 数字员工 / 知识库 / 插件 / 设置”可切换。
    - “新对话”可点击。
    - “数字员工”标题存在。
    - 点击“内容营销”展开专家。
    - 点击专家后仍进入对应专家或填入快捷 prompt。
    - 会话列表可滚动、切换、关闭。
    - 数字员工块内部滚动，不影响整页布局。
  - UI 验收：
    - 无 logo 和“千匠问天”品牌块。
    - 导航和新建对话明显上移。
    - 树形目录不浮层遮挡。
    - 样式与现有蓝紫玻璃风一致。
    - 无横向滚动。