ui: "+ 新建任务"按钮改通栏单独一行 (windows 320px pane 不再换行)
挪到 #pane-left 第一行 pane-head 之下的独立行,flex:1 撑满整行(primary 红底 通栏 CTA)。原塞 spacer 之后,中文五字在 320px pane 被挤断行。顺手删 @media phone 里 #hd-new 紧凑覆盖(通栏不需要缩)。 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
5e27ea9424
commit
84388b278e
|
|
@ -23,7 +23,7 @@
|
|||
|
||||
### 2026-05-22
|
||||
|
||||
- **"+ 新建任务"按钮从 header 挪到任务面板 pane-head**:`web/static/dev.html` `#hd-new` 节点直接在 HTML 里挪到 `#pane-left` 第一行 `.pane-head`(spacer 之后、`#filter-status` 之前),加 `small` 跟周边按钮对齐高度,保持 `primary` 红底显眼。语义更贴(新建任务 = 任务面板的动作);顶栏减负只剩身份区(brand / 用户名 / 退出登录);两种模式 DOM 一致,顺手删了 `embedInit` 里动态 `insertBefore` 那段。`@media phone` 段那条 `#hd-new` 紧凑覆盖照常生效。
|
||||
- **"+ 新建任务"按钮从 header 挪到任务面板 + 改通栏单独一行**:`web/static/dev.html` `#hd-new` 节点直接在 HTML 里挪到 `#pane-left`,放在第一行 `.pane-head`(任务标题 + 计数 + filter + 刷新 + 折叠)之下、搜索行之上的独立 `.pane-head` 行,`flex:1` 撑满整行(primary 红底通栏 CTA)。原本塞在第一行 spacer 之后,但 pane 320px 宽度下"+ 新建任务"中文五字会被挤断行,通栏解决根因。语义更贴(新建任务 = 任务面板的动作);顶栏减负只剩身份区(brand / 用户名 / 退出登录);两种模式 DOM 一致,顺手删了 `embedInit` 里动态 `insertBefore` 那段 + `@media phone` 里 `#hd-new` 紧凑覆盖(通栏环境不需要缩字号)。桌面 / 平板折叠态被 `#pane-left > * { display: none }` 自动藏掉,无需额外覆盖。
|
||||
- **dev SPA 加 iframe embed 模式(`?embed=1&parent_origin=...`)**:`web/static/dev.html` 加 embed 模式 — 父页面 iframe 嵌入时藏左上 brand / 顶栏 `#hd-who` / 退出登录按钮(桌面段整层 header `display:none`,移动段保留 header 给 `.mobile-tabs` 切换用),JS `embedInit` 把 `#hd-new`("+ 新建任务")从 header 节点移到任务面板 pane-head(spacer 之后、`#filter-status` 之前,加 `small` class 跟周边按钮对齐高度)。postMessage 协议:iframe 启动发 `{type:"zcbot-ready"}` 给父端,父端调自家后端用 `PLATFORM_KEY` 走 zcbot 已有的 `POST /v1/auth/login` 拿 JWT,通过 `{type:"zcbot-token", token, user_id, user_name?}` 推回 iframe;iframe 写 localStorage + `enterApp()`。401 时改写 `logout()` 不再 `location.reload()`,而是发 `{type:"zcbot-401"}` 通知父端重换 token,期间显灰底等待层(`#embed-waiting` spinner + 文案);新加 css class `body.embed-mode` / `body.embed-mode.embed-waiting` 控制可见性。**安全要点**:`event.origin` 双向校验(白名单 = URL 参数 `parent_origin`),缺参数直接显错误占位拒收;`PLATFORM_KEY` 留在 platform 后端绝不下发浏览器。`web/EMBED.md` 写给 platform 工程的对接手册(URL / 协议 / Node/Python 后端示例 / 父端前端示例 / CORS / CSP frame-ancestors 收紧建议 / 调试 + 故障兜底表)。否决:(a) URL 参数直接传 token —— Referer / 浏览器历史泄漏面;(b) 同源 + 共享 localStorage —— 用户明确说不同源;(c) 拆 dev.html 进 platform SPA route —— 工作量爆炸。
|
||||
- **dev SPA chat-input 支持 Ctrl+V 粘贴文件上传 + chat-hint 反馈**:`web/static/dev.html` 给 `#chat-input` 加 `paste` 监听 —— `e.clipboardData.files` 非空时 `preventDefault` + 复用现有 `uploadFiles(files)` 走 `/v1/files/upload` 落到 `state.filesPath`(与拖拽到右 pane 同通路);纯文本粘贴走默认不拦。`uploadFiles` 改返回 bool(成功 true / 失败 false,原 alert 行为不变);粘贴 handler 通过 `chat-hint` 广播 "上传中:<name>…" → "已粘贴:<name>"(4s 后回前一个 hint,同 `optimizePrompt` 救回范式,不破坏 streaming/optimizing 期间的状态)。失败仍走 alert,hint 立即恢复。placeholder 提示加 `Ctrl+V 可粘贴文件`。常见场景:截图后直接 Ctrl+V 入对话区当作素材上传,免去切窗口走右 pane 拖拽。
|
||||
- **dev SPA 文件预览弹框让出 chat-form 高度(打开期间输入区仍可点可打字)**:`web/static/dev.html` 给 `#file-preview-modal` 加 `bottom: var(--preview-bottom-inset, 0)` —— 默认 0 行为不变,`openFilePreview` 时 JS 量 `#chat-form.offsetHeight`(隐藏走 `offsetParent` 判空 → 0,无活动任务恢复全屏)写到弹框元素 inline style 上;`.card` 加 `max-height: calc(100vh - var(...) - 32px)` 让卡片随容器收缩不溢出,手机段同理用 `100dvh`。`closeFilePreview` `removeProperty` 清掉避免下次冗余。弹框遮罩本身物理上不覆盖底部输入区 → chat-form 自然可点击/打字,Esc 与点遮罩关闭逻辑不动。否决:(a) 整窗 `pointer-events: none` + card 收回 —— 遮罩物理还在覆盖,视觉仍遮挡;(b) 弹框抽进 `#pane-mid` 内 absolute —— 弹框来源含 `#pane-right` 文件列表和聊天 chip,挂 mid 内会限制弹框只能在 mid 列,且 `#pane-mid` 多层 flex 嵌套要重排;(c) 硬编一个常量 `bottom: 140px` —— chat-form 高度依据 textarea 用户拖拽变化(min 60 但可拉高),JS 量一次足够准。
|
||||
|
|
|
|||
|
|
@ -592,7 +592,6 @@
|
|||
/* tab 按钮:整行铺底,order:99 让它换行到 header 第二行 */
|
||||
.mobile-tabs { display: flex; order: 99; flex-basis: 100%; }
|
||||
.mobile-tabs button { flex: 1; }
|
||||
#hd-new { padding: 4px 8px; font-size: 12px; }
|
||||
#hd-logout { padding: 4px 8px; font-size: 12px; }
|
||||
|
||||
/* iOS 防 focus 自动缩放:input/textarea 字号 ≥ 16 */
|
||||
|
|
@ -745,7 +744,6 @@
|
|||
<span class="label">任务</span>
|
||||
<span class="small muted" id="task-count" style="font-size:11px;"></span>
|
||||
<span class="spacer"></span>
|
||||
<button id="hd-new" class="primary small">+ 新建任务</button>
|
||||
<select id="filter-status" class="small" style="width: auto;">
|
||||
<option value="">(全部)</option>
|
||||
<option value="active">进行中</option>
|
||||
|
|
@ -755,6 +753,9 @@
|
|||
<button id="btn-refresh-tasks" class="small" title="刷新">↻</button>
|
||||
<button id="pane-toggle-left" class="small" title="折叠任务列表">‹</button>
|
||||
</div>
|
||||
<div class="pane-head">
|
||||
<button id="hd-new" class="primary" style="flex:1;">+ 新建任务</button>
|
||||
</div>
|
||||
<div class="pane-head" style="gap: 6px;">
|
||||
<input id="filter-q" class="small" placeholder="搜索名称/描述..." style="flex:1; padding: 3px 6px;" />
|
||||
<select id="filter-wd" class="small" style="flex:1; padding: 3px 6px;">
|
||||
|
|
|
|||
Loading…
Reference in New Issue