@wendongfly/myhi 1.3.205 → 1.3.208

package/dist/chat.html

@@ -324,6 +324,28 @@
     @media (pointer: coarse) { #cmd-input { font-size: 1rem; padding: 0.75rem 0.75rem 0.35rem; line-height: 1.55; } }
     #input-toolbar { display: flex; align-items: center; padding: 0.25rem 0.4rem 0.4rem; gap: 0.15rem; }
     #input-toolbar .spacer { flex: 1; }
+    #model-chip { display: inline-flex; align-items: center; gap: 0.25rem; height: 28px; max-width: 11rem; padding: 0 0.55rem; margin-right: 0.15rem; border-radius: 14px; border: 1px solid var(--border); background: var(--surface2); color: var(--text2, var(--text)); font-size: 0.74rem; cursor: pointer; flex-shrink: 1; min-width: 0; }
+    #model-chip:hover { border-color: var(--purple); }
+    #model-chip svg { width: 14px; height: 14px; flex-shrink: 0; }
+    #model-chip #model-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
+    #model-chip .mc-caret { font-size: 0.7rem; color: var(--muted); flex-shrink: 0; }
+    @media (max-width: 480px) { #model-chip { max-width: 7.5rem; } }
+    #model-pop-ov { position: fixed; inset: 0; z-index: 80; display: none; }
+    #model-pop { position: fixed; z-index: 81; display: none; flex-direction: column; width: min(92vw, 340px); max-height: min(60vh, 460px); background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
+    #model-pop.open, #model-pop-ov.open { display: flex; }
+    #model-pop-list { overflow-y: auto; padding: 0.3rem 0; flex: 1; min-height: 0; }
+    #model-pop .mp-h { padding: 0.45rem 0.85rem 0.15rem; font-size: 0.68rem; color: var(--muted); }
+    #model-pop .mp-i { display: flex; align-items: center; gap: 0.45rem; padding: 0.45rem 0.85rem; cursor: pointer; font-size: 0.82rem; color: var(--text); }
+    #model-pop .mp-i:hover { background: var(--surface2); }
+    #model-pop .mp-i.on { background: var(--surface2); font-weight: 600; }
+    #model-pop .mp-n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    #model-pop .mp-sub { display: block; font-size: 0.66rem; color: var(--muted); font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    #model-pop .mp-tag { font-size: 0.62rem; padding: 0 0.35rem; border-radius: 8px; border: 1px solid; white-space: nowrap; flex-shrink: 0; font-weight: 400; }
+    #model-pop .mp-r { font-size: 0.68rem; color: var(--muted); white-space: nowrap; flex-shrink: 0; }
+    #model-pop .mp-ck { color: var(--green); flex-shrink: 0; }
+    #model-pop .mp-foot { border-top: 1px solid var(--surface2); padding: 0.45rem 0.6rem; display: flex; gap: 0.5rem; align-items: center; }
+    #model-pop .mp-foot input { flex: 1; min-width: 0; background: var(--bg); color: var(--text); border: 1px solid var(--border); border-radius: 7px; font-size: 0.74rem; padding: 0.3rem 0.5rem; outline: none; }
+    #model-pop .mp-foot a { font-size: 0.74rem; color: var(--text2, var(--text)); text-decoration: none; white-space: nowrap; }
     .inj-btn { flex-shrink: 0; height: 30px; border: 1px solid var(--yellow); background: rgba(210,153,34,0.12); color: var(--yellow); border-radius: 8px; padding: 0 0.6rem; font-size: 0.76rem; font-weight: 600; cursor: pointer; white-space: nowrap; align-self: center; }
     .inj-btn:hover { background: rgba(210,153,34,0.22); }
     .inj-tag { font-size: 0.66rem; margin-right: 0.35rem; color: var(--yellow); }
@@ -417,6 +439,24 @@
     #fp-sel-bar .fp-btn { padding: 0.3rem 0.45rem; white-space: nowrap; }
     .fp-item .fp-more { color: var(--muted); padding: 0 0.45rem; font-size: 1rem; line-height: 1; letter-spacing: 1px; flex-shrink: 0; align-self: flex-start; border-radius: 6px; cursor: pointer; }
     .fp-item .fp-more:hover { background: var(--surface2); color: var(--text); }
+    #fp-viewer { position: fixed; inset: 0; z-index: 95; background: rgba(0,0,0,0.92); display: none; flex-direction: column; }
+    #fp-viewer.open { display: flex; }
+    #fp-viewer .fv-head { display: flex; align-items: center; gap: 0.4rem; padding: 0.55rem 0.75rem; padding-top: max(0.55rem, env(safe-area-inset-top)); color: #eee; flex-shrink: 0; }
+    #fp-viewer .fv-title { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 0.85rem; }
+    #fp-viewer .fv-title b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
+    #fp-viewer .fv-title span { font-size: 0.68rem; color: #aaa; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: 'SF Mono', Consolas, monospace; }
+    #fp-viewer .fp-btn { background: rgba(255,255,255,0.12); color: #fff; border-color: rgba(255,255,255,0.2); white-space: nowrap; }
+    #fp-viewer .fv-body { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; overflow: auto; padding: 0 0.5rem max(0.5rem, env(safe-area-inset-bottom)); }
+    #fp-viewer .fv-body img { max-width: 100%; max-height: 100%; object-fit: contain; cursor: zoom-in; background: repeating-conic-gradient(#ccc 0 25%, #fff 0 50%) 0 0 / 16px 16px; }
+    #fp-viewer .fv-body img.zoom { max-width: none; max-height: none; cursor: zoom-out; }
+    #fp-viewer .fv-body.zoomed { align-items: flex-start; justify-content: flex-start; }
+    #fp-viewer .fv-body video { max-width: 100%; max-height: 100%; }
+    #fp-viewer .fv-body audio { width: min(90%, 32rem); }
+    #fp-viewer .fv-body iframe { width: 100%; height: 100%; border: 0; background: #fff; border-radius: 6px; }
+    #fp-viewer .fv-msg { color: #ddd; text-align: center; font-size: 0.88rem; line-height: 1.7; }
+    #fp-viewer .fv-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 2.6rem; height: 3.6rem; border: none; border-radius: 8px; background: rgba(255,255,255,0.14); color: #fff; font-size: 1.8rem; cursor: pointer; display: none; }
+    #fp-viewer .fv-nav.prev { left: 0.5rem; } #fp-viewer .fv-nav.next { right: 0.5rem; }
+    #fp-viewer.multi .fv-nav { display: block; }
     /* 行 / 工具 ⋯ 菜单：电脑上是贴着鼠标的小菜单，手机上是底部抽屉 */
     #fp-menu-ov { position: fixed; inset: 0; z-index: 90; }
     #fp-menu { position: fixed; z-index: 91; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.3); padding: 0.3rem 0; min-width: 12rem; max-width: 18rem; }
@@ -782,6 +822,11 @@
         <input type="file" id="file-input" style="display:none" onchange="uploadTempFile(this.files[0]); this.value='';">
         <span id="enter-hint" style="display:none;font-size:0.68rem;color:var(--muted);white-space:nowrap;align-self:center;margin-left:0.15rem"></span>
         <div class="spacer"></div>
+        <!-- 模型：当前会话用的模型，点开在上方选（读 myhi 本地场景配置 + 网关模型目录） -->
+        <button id="model-chip" style="display:none" onclick="openModelPop()" title="切换模型">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>
+          <span id="model-chip-name">默认</span><span class="mc-caret">⌃</span>
+        </button>
         <button class="tb-btn" id="voice-btn" onclick="openVaSheet()" title="语音输入 / 需求助手">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 00-3 3v8a3 3 0 006 0V4a3 3 0 00-3-3z"/><path d="M19 10v2a7 7 0 01-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/><line x1="8" y1="23" x2="16" y2="23"/></svg>
         </button>
@@ -824,7 +869,6 @@
     <div id="sk-claude-agent" style="display:none">
       <button class="sk sk-claude" id="sk-inbox" data-sk="draft" onclick="openInboxSheet()" style="color:var(--yellow)">📥 草稿<span id="inbox-badge" style="display:none;margin-left:0.2rem;background:var(--yellow);color:#000;border-radius:8px;padding:0 0.32rem;font-size:0.66rem;font-weight:700"></span></button>
       <button class="sk sk-claude" data-sk="folder" onclick="fpOpenFolder()" style="color:var(--blue2)">📂 文件夹</button>
-      <button class="sk sk-claude" data-sk="model" onclick="openModelSheet()">模型</button>
       <button class="sk sk-claude" id="btn-plan" data-sk="plan" onclick="togglePlanMode()">计划</button>
       <button class="sk sk-claude" data-sk="compact" onclick="doSlashCmd('/compact')">压缩</button>
       <button class="sk sk-claude" data-sk="resume" onclick="openResumeSheet()">恢复</button>
@@ -883,6 +927,19 @@
     <input type="file" id="fp-file-input" multiple style="display:none">
   </div>
 
+  <!-- 文件预览：图片 / PDF / 音视频（浏览器原生能显示的），文件面板和聊天里的文件链接共用 -->
+  <div id="fp-viewer">
+    <div class="fv-head">
+      <div class="fv-title"><b id="fv-name"></b><span id="fv-path"></span></div>
+      <button class="fp-btn" id="fv-open" title="在浏览器新标签页里打开">↗ 新标签</button>
+      <button class="fp-btn" id="fv-dl" title="下载">⬇</button>
+      <button class="fp-btn" onclick="fpClosePreview()" title="关闭 (Esc)">✕</button>
+    </div>
+    <div class="fv-body" id="fv-body"></div>
+    <button class="fv-nav prev" id="fv-prev" onclick="fpPreviewStep(-1)" title="上一张 (←)">‹</button>
+    <button class="fv-nav next" id="fv-next" onclick="fpPreviewStep(1)" title="下一张 (→)">›</button>
+  </div>
+
   <!-- 设置面板 -->
   <div id="settings-backdrop" onclick="closeSettings()"></div>
   <div id="settings-panel">
@@ -925,7 +982,6 @@
     <div class="setting-group" data-stab="task" style="display:none">
       <div class="set-task-hint">这些设置只对当前任务（或它所在的项目）生效，快捷栏里隐藏了的也能从这里打开。</div>
       <div class="set-task-grid">
-        <button onclick="closeSettings();openModelSheet()">🤖 模型</button>
         <button onclick="closeSettings();openGuardSheet()">🛡 隐私护栏</button>
         <button onclick="closeSettings();openSecretsSheet()">🔑 密钥</button>
         <button onclick="closeSettings();openFollowUpSheet()">🔄 自动跟进</button>
@@ -961,6 +1017,13 @@
     </div>
   </div>
 
+  <div id="model-pop-ov" onclick="closeModelPop()"></div>
+  <div id="model-pop">
+    <div id="model-pop-list"></div>
+    <div class="mp-foot">
+      <a id="model-pop-cfg" href="/?settings=1" target="_top">⚙ 配置模型</a>
+    </div>
+  </div>
   <div id="model-sheet" class="action-sheet">
     <div class="action-sheet-backdrop" onclick="closeModelSheet()"></div>
     <div class="action-sheet-box">
@@ -1311,6 +1374,7 @@
     <button class="pri" onmousedown="event.preventDefault()" onclick="askFromSelection(false)">💡 解释</button>
     <button onmousedown="event.preventDefault()" onclick="askFromSelection(true)">❓ 问一问…</button>
     <button onmousedown="event.preventDefault()" onclick="askCopySelection()">📋 复制</button>
+    <button onmousedown="event.preventDefault()" onclick="askSendToAI()" title="把选中的内容引用到输入框，接着写要求发给当前任务的 AI">💬 发给 AI</button>
   </div>
   <div id="ask-panel" role="dialog" aria-label="问一问">
     <div class="ask-head">
@@ -2508,7 +2572,22 @@
       return null;
     }
 
+    // 看图转文字的结果：折叠块，点开能看到主模型实际拿到的图片描述（描述可能漏细节，给用户核对）
+    function visionEl(msg) {
+      const d = document.createElement('details');
+      d.className = 'msg msg-vision';
+      d.style.cssText = 'margin:2px auto 6px;max-width:92%;font-size:0.8rem;color:var(--muted);border:1px solid var(--border);border-radius:8px;padding:4px 10px';
+      d.innerHTML = `<summary style="cursor:pointer">🖼 看图模型 ${escHtml(msg.vision.model || '')} 转成的文字（点开核对）</summary>` +
+        (msg.vision.items || []).map(it => `<div style="margin:6px 0 2px;word-break:break-all">${escHtml(it.path || '')}</div>` +
+          `<pre style="white-space:pre-wrap;word-break:break-word;margin:0;font-size:0.78rem;color:var(--text)">${escHtml(it.text || ('识别失败：' + (it.error || '')))}</pre>`).join('');
+      return d;
+    }
+
     function renderHistoryMessage(msg, parent) {
+      if (msg.type === 'system' && msg.vision) {
+        const st = document.createElement('div'); st.className = 'msg msg-status'; st.textContent = '— ' + msg.message + ' —';
+        parent.appendChild(st); parent.appendChild(visionEl(msg)); return;
+      }
       if (msg.type === 'assistant' && Array.isArray(msg.message?.content)) {
         for (const b of msg.message.content) { const k = blockKey(b, msg.message.id); if (k) _replayedBlocks.add(k); }
       } else if (msg.type === 'tool_result' && msg.id) _replayedBlocks.add('tr:' + msg.id);
@@ -2541,11 +2620,21 @@
         const sel = buildSyntheticUserEl(msg.content);
         if (sel) { parent.appendChild(sel); return; }
         if (syntheticUserKind(msg.content)) return;
+        // 看图转文字后发给模型的消息（对话记录里就是改写后的全文）：气泡只显示原话，图片描述收进折叠块
+        let content = msg.content, vis = null;
+        const vi = typeof content === 'string' ? content.indexOf('\n\n（注意：你当前用的模型不能直接看图') : -1;
+        if (vi > 0) {
+          const tail = content.slice(vi);
+          vis = { message: '', vision: { model: (tail.match(/看图模型 (\S+) 把图片/) || [])[1] || '',
+            items: [...tail.matchAll(/【图片 ([^】]+)】\n([\s\S]*?)(?=\n\n【图片 |$)/g)].map(m => ({ path: m[1], text: m[2] })) } };
+          content = content.slice(0, vi);
+        }
         const el = document.createElement('div');
         el.className = 'msg msg-input' + (msg.inject ? ' msg-inject' : '');
         const full = msg.timestamp ? new Date(msg.timestamp).toLocaleString('zh-CN') : '';
-        el.innerHTML = `<div><div class="bubble">${escHtml(msg.content)}</div><div class="meta" title="${escHtml(full)}">${injectTagHtml(msg.inject)}${msg.timestamp ? formatTime(new Date(msg.timestamp)) : ''}</div></div>`;
+        el.innerHTML = `<div><div class="bubble">${escHtml(content)}</div><div class="meta" title="${escHtml(full)}">${injectTagHtml(msg.inject)}${msg.timestamp ? formatTime(new Date(msg.timestamp)) : ''}</div></div>`;
         parent.appendChild(el);
+        if (vis) parent.appendChild(visionEl(vis));
         return;
       }
 
@@ -3085,6 +3174,9 @@
       updateControlUI(session.controlHolder === socket.id, session.controlHolderName);
 
       claudeSession = isClaudeSession(session) || session.mode === 'agent';
+      // 模型按钮只在配了自定义网关时出现（列表来自网关），由 refreshModelChip 决定显隐
+      if (session.mode !== 'agent') document.getElementById('model-chip').style.display = 'none';
+      if (session.mode === 'agent') refreshModelChip();
       updateShortcutBar();
       updatePlanButton();
       ctxUpdate(session.contextTokens || 0);
@@ -3154,6 +3246,7 @@
               _ctxNudgeLevel = 0; _lastCtxTokens = 0; ctxUpdate(0);
             }
             addStatusMessage(msg.message);
+            if (msg.vision) { chatArea.appendChild(visionEl(msg)); scrollToBottom(); }
             // 同步计划模式状态到按钮
             if (msg.message.includes('进入计划模式')) {
               if (currentSession) currentSession.permissionMode = 'plan';
@@ -3671,6 +3764,11 @@
         saveDraftFromInput('busy');
         return;
       }
+      // 网关积分用尽：发出去大概率被网关拒，先提醒一句（本地 / 斜杠命令不算）
+      if (currentSession?.mode === 'agent' && !text.startsWith('/')) {
+        const q = quotaState();
+        if (q.out && !confirm(q.msg + '\n\n发出去大概率会被网关拒绝。仍要发送吗？')) return;
+      }
 
       if (!isController) {
         if (canTakeControl()) { socket.emit('take-control', { sessionId: SESSION_ID }); }
@@ -4079,7 +4177,7 @@
         <b>让它读文件</b>：打 <b>@</b> 从本项目逐层浏览、打字搜索；项目外打 <b>@D:</b>、<b>@/</b>、<b>@~/</b> 按路径逐层浏览；选中插路径；或点「文件」面板的 <b>@</b> 引用。<br>
         <b>工具/思考</b>：AI 干活的过程默认折叠，点「🔧 N 个工具调用」展开看命令与输出。<br>
         <b>AI 忙时</b>：想补充或提醒，点输入框右边「⚡ 插话」——不打断，AI 下一步就会看到并调整（气泡上显示「AI 已看到」）；不急的就回车「存草稿」排队，草稿里可排顺序、编辑、合并，开「依次自动发送」后每干完一轮自动发下一条，AI 忙时也能把草稿「⚡ 插入」当前任务。<br>
-        <b>看不懂就问</b>：在聊天里<b>选中</b>看不懂的词或一段话（手机长按选中），点「💡 解释」或「❓ 问一问」，答案在旁边小窗里，可以继续追问；这些问答<b>不会打扰正在干活的 AI</b>，想让它知道就点「👉 告诉 AI」。<br>
+        <b>看不懂就问</b>：在聊天里<b>选中</b>看不懂的词或一段话（手机长按选中），点「💡 解释」或「❓ 问一问」，答案在旁边小窗里，可以继续追问；这些问答<b>不会打扰正在干活的 AI</b>，想让它知道就点「👉 告诉 AI」。想直接拿这段内容跟 AI 说事，点「💬 发给 AI」：内容会引用到输入框，接着写要求再发送。<br>
         <b>AI 提问 / 交方案</b>：AI 需要你拿主意时会弹出选项，选一个即可，也可「跳过，让 AI 自己决定」；收起后输入框上方「❓ AI 在等你回答」可再打开。<br>
         <b>定位旧消息</b>：电脑上鼠标移到聊天区，右下角 ☰ 可列出你发过的消息点击跳转；看完点底部「↓ 回到底部」一键回来。
         ${sec('顶栏')}
@@ -4180,10 +4278,10 @@
             continue;
           }
           // 点整行 = 打开（文件夹进入 / 文件预览或编辑）；其余操作都在行尾 ⋯（电脑上右键也行）
-          const kind = e.isDir ? 'd' : isEditableFile(e.name) ? 'e' : 'f';
+          const kind = e.isDir ? 'd' : isEditableFile(e.name) ? 'e' : previewKind(e.name) ? 'p' : 'f';
           const a = `'${escAttr(rel)}','${kind}'`;
           html += `<div class="fp-item" onclick="fpOpen(${a})" oncontextmenu="fpItemMenu(event,${a})" title="${kind === 'f' ? '点击查看可用操作' : '点击打开'}">
-            <span class="fp-icon">${e.isDir ? '📁' : kind === 'e' ? '📝' : '📄'}</span>
+            <span class="fp-icon">${e.isDir ? '📁' : kind === 'e' ? '📝' : kind === 'p' ? ({ img: '🖼', pdf: '📕', video: '🎬', audio: '🎵' })[previewKind(e.name)] : '📄'}</span>
             <span class="fp-name">${escHtml(e.name)}</span>
             ${e.isDir ? '' : `<span class="fp-size">${fpFormatSize(e.size)}</span>`}
             <span class="fp-more" onclick="event.stopPropagation();fpItemMenu(event,${a})" title="更多操作">⋯</span>
@@ -4250,6 +4348,7 @@
       if (fpSel) return fpToggleSel(rel);
       if (kind === 'd') return fpNav(rel);
       if (kind === 'e') return openFileEditor(rel);
+      if (kind === 'p') return fpPreview(rel);
       fpItemMenu(null, rel, kind);
     };
     window.fpCopyPath = function(rel) {
@@ -4292,11 +4391,73 @@
       if (kind === 'd') items.push(['📂 打开', () => fpNav(rel)], ['⬇ 打包下载', () => fpZip([rel]), 'zip']);
       else {
         if (kind === 'e') items.push([/\.(html?|md|markdown)$/i.test(rel) ? '👁 查看 / 编辑' : '✏️ 编辑', () => openFileEditor(rel)]);
+        if (kind === 'p') items.push(['👁 预览', () => fpPreview(rel)]);
         items.push(['⬇ 下载', () => fpDownload(rel)]);
       }
       items.push(['@ 引用到消息', () => fpRefer(kind === 'd' ? rel + '/' : rel), '让 AI 读它'], ['📋 复制路径', () => fpCopyPath(rel)]);
       fpMenu(ev, rel, items);
     };
+    // ── 文件预览：图片 / PDF / 音视频 —— 浏览器自己能显示的直接看，不用先下载 ──────────
+    window.previewKind = function(name) {
+      const e = (String(name).toLowerCase().match(/\.([a-z0-9]+)$/) || [])[1] || '';
+      if (/^(png|jpe?g|gif|webp|bmp|ico|avif|svg)$/.test(e)) return 'img';
+      if (e === 'pdf') return 'pdf';
+      if (/^(mp4|webm|ogv|mov|m4v)$/.test(e)) return 'video';
+      if (/^(mp3|wav|ogg|oga|m4a|flac|aac|opus)$/.test(e)) return 'audio';
+      return null;
+    };
+    let _fvList = [], _fvIdx = 0;
+    const fvUrl = (rel, inline) => `/api/files/${SESSION_ID}/download?path=${encodeURIComponent(rel)}${inline ? '&inline=1' : ''}`;
+    window.fpPreview = function(rel) {
+      // 同一目录的图片可以左右翻（从文件面板打开时）
+      const dir = rel.includes('/') ? rel.slice(0, rel.lastIndexOf('/')) : '';
+      const sameDirImgs = previewKind(rel) === 'img' && dir === fpCurrentPath ? fpVisible.filter(r => previewKind(r) === 'img') : [];
+      _fvList = sameDirImgs.length > 1 ? sameDirImgs : [rel];
+      _fvIdx = Math.max(0, _fvList.indexOf(rel));
+      document.getElementById('fp-viewer').classList.add('open');
+      fvShow();
+    };
+    function fvShow() {
+      const rel = _fvList[_fvIdx], kind = previewKind(rel), url = fvUrl(rel, true);
+      const v = document.getElementById('fp-viewer'), body = document.getElementById('fv-body');
+      v.classList.toggle('multi', _fvList.length > 1);
+      document.getElementById('fv-name').textContent = rel.split('/').pop() + (_fvList.length > 1 ? `  (${_fvIdx + 1}/${_fvList.length})` : '');
+      document.getElementById('fv-path').textContent = typeof feditAbs === 'function' ? feditAbs(rel) : rel;
+      document.getElementById('fv-open').onclick = () => window.open(url, '_blank');
+      document.getElementById('fv-dl').onclick = () => fpDownload(rel);
+      body.classList.remove('zoomed');
+      if (kind === 'img') {
+        body.innerHTML = `<img src="${escAttr(url)}" alt="">`;
+        const img = body.querySelector('img');
+        img.onclick = () => { img.classList.toggle('zoom'); body.classList.toggle('zoomed', img.classList.contains('zoom')); };   // 点击看原尺寸
+        img.onerror = () => { body.innerHTML = '<div class="fv-msg">图片打不开（可能已被删除或格式损坏）</div>'; };
+      } else if (kind === 'video') {
+        body.innerHTML = `<video src="${escAttr(url)}" controls autoplay playsinline></video>`;
+      } else if (kind === 'audio') {
+        body.innerHTML = `<audio src="${escAttr(url)}" controls autoplay></audio>`;
+      } else if (kind === 'pdf') {
+        // 手机浏览器大多不能把 PDF 嵌在页面里（安卓会直接下载）：给按钮在新标签打开
+        if (matchMedia('(pointer: coarse)').matches) {
+          body.innerHTML = `<div class="fv-msg">手机浏览器不能在页面里直接显示 PDF<br><button class="fp-btn" style="margin-top:0.8rem;padding:0.5rem 1rem" onclick="window.open('${escAttr(url)}','_blank')">↗ 在新标签打开</button></div>`;
+        } else body.innerHTML = `<iframe src="${escAttr(url)}"></iframe>`;
+      }
+    }
+    window.fpPreviewStep = function(d) {
+      if (_fvList.length < 2) return;
+      _fvIdx = (_fvIdx + d + _fvList.length) % _fvList.length; fvShow();
+    };
+    window.fpClosePreview = function() {
+      const v = document.getElementById('fp-viewer');
+      v.classList.remove('open');
+      document.getElementById('fv-body').innerHTML = '';   // 停掉正在播放的音视频
+    };
+    document.addEventListener('keydown', (e) => {
+      if (!document.getElementById('fp-viewer').classList.contains('open')) return;
+      if (e.key === 'Escape') fpClosePreview();
+      else if (e.key === 'ArrowLeft') fpPreviewStep(-1);
+      else if (e.key === 'ArrowRight') fpPreviewStep(1);
+    });
+
     window.fpToolsMenu = function(ev) {
       const items = [
         ['🔄 同步到本地文件夹', () => fpStartSync(), 'Chrome / Edge'],
@@ -4433,7 +4594,13 @@
       const rel = feditNormPath(String(rawPath || '').trim());
       if (!rel) { addStatusMessage('路径为空'); return; }
       if (!isEditableFile(rel)) {
-        addStatusMessage('「' + rel.split('/').pop() + '」不是可编辑的文本类型，请用下载');
+        // 图片 / PDF / 音视频：浏览器能直接显示，打开预览（AI 只写文件名时在任务目录里按名字找）
+        if (previewKind(rel)) {
+          let p = rel;
+          if (!rel.includes('/')) { const hit = await feditFindByName(rel); if (hit) p = hit; }
+          return fpPreview(p);
+        }
+        addStatusMessage('「' + rel.split('/').pop() + '」浏览器打不开这种文件，请在文件面板里下载');
         return;
       }
       const sheet = document.getElementById('fedit-sheet');
@@ -4460,14 +4627,15 @@
           return;
         }
         const html = /\.html?$/i.test(d.name || d.path || '');
-        _fedit = { path: d.path, name: d.name, mtime: d.mtime, md: !!d.md, html, mode: 'edit', loaded: d.content, dirty: false };
+        const svg = /\.svg$/i.test(d.name || d.path || '');
+        _fedit = { path: d.path, name: d.name, mtime: d.mtime, md: !!d.md, html, svg, mode: 'edit', loaded: d.content, dirty: false };
         document.getElementById('fedit-path').textContent = feditAbs(d.path);
         document.getElementById('fedit-ta').value = d.content;
         document.getElementById('fedit-loading').style.display = 'none';
-        document.getElementById('fedit-tab-preview').style.display = (_fedit.md || html) ? '' : 'none';
+        document.getElementById('fedit-tab-preview').style.display = (_fedit.md || html || svg) ? '' : 'none';
         document.getElementById('fedit-newtab').style.display = html ? '' : 'none';
         // 文档类（md / html）默认「看」，要改再点 ✏️ 编辑
-        feditSetMode(_fedit.md || html ? 'preview' : 'edit');
+        feditSetMode(_fedit.md || html || svg ? 'preview' : 'edit');
       } catch (e) {
         addStatusMessage('打开出错: ' + e.message);
         sheet.classList.remove('open');
@@ -4526,15 +4694,21 @@
 
     window.feditSetMode = function(mode) {
       if (!_fedit) return;
-      if (mode === 'preview' && !_fedit.md && !_fedit.html) mode = 'edit';
+      if (mode === 'preview' && !_fedit.md && !_fedit.html && !_fedit.svg) mode = 'edit';
       _fedit.mode = mode;
       const ta = document.getElementById('fedit-ta');
       const pv = document.getElementById('fedit-preview');
       ta.style.display = mode === 'edit' ? 'block' : 'none';
       pv.style.display = mode === 'preview' ? 'block' : 'none';
-      pv.classList.toggle('html', mode === 'preview' && !!_fedit.html);
+      pv.classList.toggle('html', mode === 'preview' && !!(_fedit.html || _fedit.svg));
       document.getElementById('fedit-icon').textContent = mode === 'preview' ? '📄' : '✏️';
-      if (mode === 'preview') { if (_fedit.html) feditRenderHtml(pv, ta.value); else pv.innerHTML = renderMarkdown(ta.value); }
+      if (mode === 'preview') {
+        if (_fedit.html) feditRenderHtml(pv, ta.value);
+        else if (_fedit.svg) {   // SVG 用 <img> 渲染：图片上下文里内嵌脚本不执行；用编辑框内容，没保存的修改也能看
+          const u = URL.createObjectURL(new Blob([ta.value], { type: 'image/svg+xml' }));
+          pv.innerHTML = `<div style="height:100%;display:flex;align-items:center;justify-content:center;padding:0.5rem;box-sizing:border-box"><img src="${u}" style="max-width:100%;max-height:100%;object-fit:contain"></div>`;
+        } else pv.innerHTML = renderMarkdown(ta.value);
+      }
       document.getElementById('fedit-tab-edit').classList.toggle('on', mode === 'edit');
       document.getElementById('fedit-tab-preview').classList.toggle('on', mode === 'preview');
     };
@@ -5451,19 +5625,109 @@
       if (e.key === 'Enter') { e.preventDefault(); submitAskReply(); }
     });
 
-    window.openModelSheet = function() {
-      const list = document.getElementById('model-list');
-      list.innerHTML = '';
-      MODELS.forEach(m => {
-        const item = document.createElement('div');
-        item.className = 'action-sheet-item';
-        const isCurrent = currentModelId && m.id.includes(currentModelId);
-        item.innerHTML = `<div><div>${m.label}</div><div class="desc">${m.desc}</div></div>${isCurrent ? '<span class="check">✓</span>' : ''}`;
-        item.onclick = () => selectModel(m);
-        list.appendChild(item);
+    // ── 模型：聊天框里的「模型」按钮 + 上方弹出列表 ─────────────────────────────
+    // 列表 = myhi 本地配置（场景模型）+ 网关模型目录（这个 token 能用的，按厂商分组），当前会话的打勾
+    const CAP_ICON = { vision: '🖼', function_calling: '🧰', reasoning: '🧠' };
+    const TAG_LABEL = { recommended: ['推荐', 'var(--purple)'], cheap: ['便宜', 'var(--green)'], vision: ['看图', 'var(--blue)'], fast: ['快', 'var(--yellow)'], experimental: ['实验', 'var(--muted)'], deprecated: ['将下线', 'var(--red)'] };
+    let _modelInfo = null;   // /api/models 的结果（服务端缓存 10 分钟）
+    async function loadModelInfo(force) {
+      if (_modelInfo && !force) return _modelInfo;
+      try { _modelInfo = await (await fetch('/api/models')).json(); } catch { _modelInfo = _modelInfo || {}; }
+      return _modelInfo;
+    }
+    const modelName = (id) => { const m = (_modelInfo?.models || []).find(x => x.id === id); return m && m.kind !== 'alias' ? m.name : id; };
+    // 网关积分（新网关的 /v1/models?scope=token 才带；网关按积分计费，1 积分 = $0.01）：已用 / 上限，用尽时发消息前提醒
+    function quotaState() {
+      const t = _modelInfo?.token;
+      if (!t) return { text: '', out: false };
+      const fmt = (u, l) => `${u ?? '?'} / ${l} 积分`;
+      const parts = [];
+      if (t.dailyLimit != null) parts.push('今日已用 ' + fmt(t.dailyUsed, t.dailyLimit));
+      if (t.monthlyLimit != null) parts.push('本月已用 ' + fmt(t.monthlyUsed, t.monthlyLimit));
+      const dayOut = t.dailyLimit != null && t.dailyUsed != null && t.dailyUsed >= t.dailyLimit;
+      const monOut = t.monthlyLimit != null && t.monthlyUsed != null && t.monthlyUsed >= t.monthlyLimit;
+      const out = dayOut || monOut;
+      return { text: parts.length ? '积分：' + parts.join(' · ') : '', out,
+        msg: out ? `网关 token${t.name ? '「' + t.name + '」' : ''}${dayOut ? '今日' : '本月'}积分已用完（${dayOut ? fmt(t.dailyUsed, t.dailyLimit) : fmt(t.monthlyUsed, t.monthlyLimit)}）` : '' };
+    }
+    // 额度会变：每 5 分钟后台刷新一次（服务端本身也缓存 10 分钟）
+    setInterval(() => { if (currentSession?.mode === 'agent' && !document.hidden) loadModelInfo(true); }, 5 * 60_000);
+    window.refreshModelChip = async function() {
+      await loadModelInfo();
+      const cur = currentSession?.modelId || '';
+      const main = _modelInfo?.scenes?.main || '';
+      // 计划模式且系统设置里配了「计划」模型 → 这段时间实际用它（批准执行后回到主任务模型）
+      const plan = currentSession?.permissionMode === 'plan' ? (_modelInfo?.scenes?.plan || '') : '';
+      const el = document.getElementById('model-chip-name');
+      el.textContent = plan ? '计划·' + modelName(plan) : cur ? modelName(cur) : main ? modelName(main) : '默认';
+      const chip = document.getElementById('model-chip'), q = quotaState();
+      // 没配自定义网关（直连 Anthropic 等）：不提供模型选择，跟随 Claude Code 默认
+      chip.style.display = currentSession?.mode === 'agent' && _modelInfo?.gateway ? '' : 'none';
+      chip.title = '切换模型 · 当前：' + (plan ? plan + '（计划模式，系统设置 · 计划）\n执行时：' : '') + (cur || (main ? main + '（主任务默认）' : 'Claude Code 默认')) + (q.text ? '\n' + (q.out ? q.msg : q.text) : '');
+      chip.style.borderColor = q.out ? 'var(--red)' : '';   // 积分用尽：按钮描红
+    };
+    window.openModelPop = async function() {
+      const pop = document.getElementById('model-pop'), ov = document.getElementById('model-pop-ov'), list = document.getElementById('model-pop-list');
+      list.innerHTML = '<div class="mp-h">加载模型列表…</div>';
+      pop.classList.add('open'); ov.classList.add('open');
+      placeModelPop();
+      const d = await loadModelInfo(true);
+      const cur = currentSession?.modelId || '';
+      const main = d.scenes?.main || '';
+      // unfit：不适合当主会话模型的原因（不支持工具等）→ 变灰 + 说明，点了先确认
+      const row = (id, name, sub, right, tags, on, unfit, tip) => `<div class="mp-i${on ? ' on' : ''}" data-model="${escAttr(id)}" data-label="${escAttr(name)}"${unfit ? ` data-unfit="${escAttr(unfit)}" style="opacity:0.55"` : ''}${tip ? ` title="${escAttr(tip)}"` : ''}><span class="mp-n">${escHtml(name)}${unfit ? `<span class="mp-sub" style="color:var(--yellow)">⚠ ${escHtml(unfit)}</span>` : sub ? `<span class="mp-sub">${escHtml(sub)}</span>` : ''}</span>${(tags || []).map(t => TAG_LABEL[t] ? `<span class="mp-tag" style="color:${TAG_LABEL[t][1]};border-color:${TAG_LABEL[t][1]}">${TAG_LABEL[t][0]}</span>` : '').join('')}${right ? `<span class="mp-r">${escHtml(right)}</span>` : ''}${on ? '<span class="mp-ck">✓</span>' : ''}</div>`;
+      const q = quotaState();
+      let html = q.text ? `<div class="mp-h" style="${q.out ? 'color:var(--red);font-weight:600' : ''}">${escHtml(q.out ? q.msg : q.text)}</div>` : '';
+      html += row('default', '默认', main ? '主任务默认：' + main : '跟随 Claude Code 默认', '', [], !cur);
+      const gm = (d.models || []).filter(m => !m.id.includes('*'));   // 通配别名（claude-*）不能直接选
+      const listed = new Set(['default']);
+      if (gm.length) {
+        const by = {};
+        for (const m of gm) (by[m.provider || '其他'] ||= []).push(m);
+        for (const [prov, ms] of Object.entries(by)) {
+          html += `<div class="mp-h">${escHtml(prov)}${d.scoped ? '' : ' · 网关未按 token 过滤'}</div>`;
+          for (const m of ms) {
+            listed.add(m.id);
+            const sub = [m.kind === 'alias' && m.target ? '→ ' + m.target : '', m.caps.map(c => CAP_ICON[c]).filter(Boolean).join(' ')].filter(Boolean).join(' · ');
+            // 右侧：有渠道系数就显示倍率（如 0.51x），否则显示单价；单价放悬停提示里
+            const price = m.inputCost != null ? `$${m.inputCost}/$${m.outputCost} 每百万 token` : '';
+            // 时段价此刻生效（如「闲时 0.5x」）→ 放在右侧倍率前面
+            const tn = m.timeNow ? `${m.timeNow.label}${m.timeNow.multiplier != null ? ' ' + m.timeNow.multiplier + 'x' : ''}` : '';
+            const right = [tn, m.multiplier != null ? `${m.multiplier}x` : (m.inputCost != null ? `$${m.inputCost}/$${m.outputCost}` : '')].filter(Boolean).join(' · ');
+            html += row(m.id, m.kind === 'alias' ? m.id : m.name, sub, right, m.tags, cur === m.id, m.fit?.main || '', [price, m.multiplier != null ? `渠道系数 ${m.multiplier}` : '', tn ? '当前时段：' + tn : ''].filter(Boolean).join(' · '));
+          }
+        }
+      } else if (d.gateway && d.error) html += `<div class="mp-h">网关模型列表读取失败：${escHtml(d.error)}</div>`;
+      // 自定义：本地场景配置里填过、或本会话正在用、但不在网关列表里的名字
+      const custom = [...new Set([cur, ...Object.values(d.scenes || {})].filter(x => x && !listed.has(x)))];
+      if (custom.length) { html += '<div class="mp-h">自定义模型</div>'; for (const id of custom) { listed.add(id); html += row(id, id, '', '', [], cur === id); } }
+      // 模型只从网关目录来；没配自定义网关就不提供选择
+      if (!d.gateway) html = '<div class="mp-h" style="white-space:normal;line-height:1.5">没有配置自定义网关，使用 Claude Code 默认模型。<br>配置网关后，这里会列出网关上这个 token 可用的模型。</div>';
+      list.innerHTML = html;
+      list.querySelectorAll('[data-model]').forEach(el => el.onclick = () => {
+        if (el.dataset.unfit && !confirm(`「${el.dataset.label}」${el.dataset.unfit}。\n\n用它当主会话模型，AI 很可能干不了活。仍要切换吗？`)) return;
+        closeModelPop(); selectModel({ id: el.dataset.model, label: el.dataset.label });
       });
-      document.getElementById('model-sheet').classList.add('open');
-    };
+      // 只有管理员能改场景模型：成员隐藏「配置模型」
+      document.getElementById('model-pop-cfg').style.display = myRole === 'admin' ? '' : 'none';
+      list.querySelector('.mp-i.on')?.scrollIntoView({ block: 'nearest' });
+      placeModelPop();
+    };
+    // 贴着按钮弹在上方、右对齐；按钮不可见（PTY 会话 / 从设置菜单打开）时居中
+    function placeModelPop() {
+      const pop = document.getElementById('model-pop'), chip = document.getElementById('model-chip');
+      const r = chip.getBoundingClientRect(), w = pop.offsetWidth, h = pop.offsetHeight;
+      if (chip.offsetParent) {
+        pop.style.left = Math.max(8, Math.min(r.right - w, innerWidth - w - 8)) + 'px';
+        pop.style.top = Math.max(8, r.top - h - 6) + 'px';
+      } else { pop.style.left = Math.max(8, (innerWidth - w) / 2) + 'px'; pop.style.top = Math.max(8, (innerHeight - h) / 2) + 'px'; }
+    }
+    window.closeModelPop = function() {
+      document.getElementById('model-pop').classList.remove('open');
+      document.getElementById('model-pop-ov').classList.remove('open');
+    };
+    // 旧入口（终端会话快捷栏「模型」、设置菜单）都改走新弹层
+    window.openModelSheet = function() { openModelPop(); };
     window.closeModelSheet = function() {
       document.getElementById('model-sheet').classList.remove('open');
     };
@@ -5483,7 +5747,8 @@
         }, 100);
       }
       currentModelId = m.id;
-      addStatusMessage('模型已切换为 ' + m.label);
+      if (currentSession) currentSession.modelId = m.id === 'default' ? null : m.id;   // 服务端会持久化，重启后照样用
+      refreshModelChip();
     }
     window.selectCustomModel = function() {
       const v = (document.getElementById('model-custom').value || '').trim();
@@ -6398,6 +6663,7 @@
       btn.textContent = isPlan ? '退出计划' : '计划';
       btn.style.color = isPlan ? 'var(--orange)' : '';
       btn.style.fontWeight = isPlan ? '600' : '';
+      if (currentSession?.mode === 'agent' && window.refreshModelChip) refreshModelChip();   // 计划模型可能不同
     }
     window.togglePlanMode = function() {
       const isPlan = currentSession?.permissionMode === 'plan';
@@ -7342,6 +7608,19 @@
       if (custom) { renderAsk(); askInput.focus(); }
       else askSend('');
     };
+    // 「发给 AI」：选中的内容以引用格式放进输入框，光标停在下面，接着写要求再发（不直接发出去）
+    window.askSendToAI = function() {
+      if (!_askSel) return;
+      const quote = _askSel.text.trim().split('\n').map(l => '> ' + l).join('\n');
+      askHidePop();
+      window.getSelection()?.removeAllRanges();
+      const cur = cmdInput.value.replace(/\s+$/, '');
+      cmdInput.value = (cur ? cur + '\n\n' : '') + quote + '\n\n';
+      cmdInput.focus();
+      cmdInput.setSelectionRange(cmdInput.value.length, cmdInput.value.length);
+      cmdInput.dispatchEvent(new Event('input'));   // 让输入框按内容长高
+      cmdInput.scrollTop = cmdInput.scrollHeight;
+    };
     window.askCopySelection = function() {
       if (!_askSel) return;
       const t = _askSel.text;