前言¶
智能體開發者經常需要在手機上查看對話結果或調試輸出。DSH Web 默認在桌面端運行，移動端佈局會壓縮對話區、佔用較多屏幕空間，體驗不夠友好。這個插件爲 DSH Web 提供了一個移動端專用外殼：在移動視口下自動切換成抽屜導航、全屏對話、觸控友好的界面，桌面端行爲保持不變。
插件定位¶
dsh-mobile-ui 是一個 DSH Web 插件，爲移動端提供專用 UI 外殼。插件由 kaijia323 維護，分類爲客戶端插件。它在視口寬度 ≤ 767px 時生效，通過 html[data-dsh-mobile] 標記區分移動端與桌面端。
核心功能¶
抽屜式導航¶
左側欄在移動端不再佔用 grid 寬度，改爲覆蓋式抽屜（84vw，最大 320px，帶圓角和陰影）。頂部欄左側出現漢堡鍵用於打開抽屜。點擊會話行、點「新會話」（含品牌區）、切全局面板會自動收起抽屜。點遮罩或按 Esc 也會收起（有菜單打開時 Esc 只關菜單，抽屜留在原地）。抽屜內的就地操作（搜索、工作區展開、會話「…」菜單、底部「更多」菜單、菜單裏的置頂/歸檔/設置）不會關閉抽屜。
全屏對話區¶
對話區佔滿整屏，不與左側欄共用寬度。全局面板（插件頁、自動化任務等）底部有欄，左鍵開抽屜、右鍵回對話，避免”出不來”的死路。
設置面板適配¶
移動端設置面板改爲全屏、分類橫向排列，主題選擇以三塊並排顯示。
安全區適配¶
宿主側通過 viewport-fit=cover 注入頁面，樣式裏使用 env(safe-area-inset-*) 給抽屜、頂欄、輸入區留出劉海和小白條的位置。
鍵盤適配¶
跟蹤 visualViewport，用 --dsh-mobile-vv 讓佈局高度跟隨可見區域，輸入框不會被軟鍵盤頂出屏幕。切會話、新建會話、首次加載時輸入框不自動聚焦；點「＋」時需要輸入框焦點才能掛出菜單，只在同一輪點擊內短暫聚焦。
觸屏可達¶
會話行「…」和工作區行「… / ＋」在觸屏下常顯，手機上可以重命名、歸檔、置頂、在工作區新建會話。正文 16px、代碼 13.5px；控件最小高度 36px。
安裝與啓用¶
前提：DSH Web 0.2.1-rc.2（本插件按該版本構建；其他版本可能靜默降級成桌面樣式）。
方式一：插件市場¶
- 打開插件頁的實驗性「自定義插件市場」（插件 → 實驗性插件 → 更多）；
- 切到「發現」標籤，點「添加索引源」，填：
https://kaijia323.github.io/dsh-mobile-ui/index.json
- 找到「移動端外殼」，點安裝。
方式二：GitHub 地址¶
- 打開 DSH Web → 左側欄「插件」→ 右上「添加插件」；
- 輸入
github:kaijia323/dsh-mobile-ui； - 點「安裝」，裝完在插件列表裏啓用
dsh-mobile-ui。
方式三：本地目錄¶
git clone https://github.com/kaijia323/dsh-mobile-ui.git ~/dsh-mobile-ui
然後在「添加插件」裏填本地目錄路徑（例如 /home/you/dsh-mobile-ui）。
驗證安裝¶
手機寬度（≤ 767px）打開：左上角出現漢堡鍵、側欄變成覆蓋式抽屜、對話區佔滿整屏；桌面寬度下佈局與原來一致。
卸載 / 臨時關閉¶
- 插件列表裏禁用
dsh-mobile-ui； - 或地址後加
?dsh-mobile=off臨時關閉。
結構說明¶
| 文件 | 作用 |
|---|---|
index.js |
宿主半：webServer.tapIndex 注入 viewport-fit=cover 和首幀前的 data-dsh-mobile 標記 |
client.js |
瀏覽器半：樣式、視口標記、鍵盤高度、抽屜交互、頂部欄導航鍵、焦點守衛 |
cordis.patch.yml |
bundle 插入行 |
locale/{zh,en}.json |
插件列表裏的標題 / 描述 |
版本錨定與降級¶
抽屜、遮罩、面板底欄使用的是 DSH 自帶框架穩定的 data-* 錨點（[data-slot="sidebar"]、[data-slot="main"]、[data-shell-overlay]、[data-sidebar-collapsed]、[data-row-key]），升級後如果結構變了，樣式會自動降級成”沒有移動層”，不會把桌面端弄壞。設置頁、主題塊、統計 pill、加號按鈕這幾處用的是當前構建的哈希類名（.VOzbGW_*、_8HJdBW_*、bOPqQW_*、.uV2eYG_*、._7KE1Ra_*），升級後會靜默退回桌面樣式。
已知邊界¶
- 真機輸入法：軟鍵盤的彈出/收起時序、安全區數值，模擬環境量不出來，只能真機確認。
- 真實觸屏：滾動慣性、長按這類手勢只做了樣式預設。
- 半屏以上寬度（768–1023）仍走桌面版（56px 欄），沒有平板專用佈局。
- 輸入條統計與設置頁的少數版式依賴當前構建的哈希類名，升級後會靜默退回桌面樣式。
- 宿主半的 viewport meta 是全局替換的，桌面端也會帶
viewport-fit=cover（無視覺影響）。
適用場景¶
適合需要在移動設備上查看、調試 DSH Web 對話的開發者。如果你經常用手機訪問 DSH Web，這個插件可以讓界面更緊湊、操作更順手。
生態說明¶
DSH 理念是「一切皆插件」，社區目錄是獨立站點，與 DeepSeek / 幻方無官方從屬關係。
