dsh-remote-plugin 0.6.6 → 0.6.8

package/README.en.md

@@ -1,46 +1,52 @@
 # dsh-remote-plugin
 
-[![Awesome DSH Plugin](https://awesome-dsh-plugin.com/badge.svg)](https://github.com/awesome-dsh-plugin/awesome-dsh-plugin)
+The official DSH bundle plugin for DSH Remote. It adds a DSH sidebar entry, a compact status panel, a full admin console, and a gateway managed alongside DSH.
 
-**English** · [中文](README.md)
-
-The DSH bundle plugin for DSH Remote: registers a native entry in DSH's left sidebar and opens an admin drawer from the right. The plugin **bundles the gateway and auto-starts/stops it with DSH** (standalone systemd unit); the drawer shows the token, host IP and device monitor. Works with the [dsh-Remote](https://github.com/Blank-not-black/dsh-Remote) Android app for remote control and file transfer (`/fs/list`, `/fs/file`, `/fs/upload`). The panel ships four themes (Deep Space / Sunset / Elbphilharmonie / Prairie Tower) — light / dark / neutral, following the system preference automatically.
+[English](README.en.md) · [中文](README.md)
 
 ## Install
 
 ```sh
 dsh plugin --profile web add dsh-remote-plugin
-# or pin a version
-dsh plugin --profile web add dsh-remote-plugin@0.5.0
+
+# Optional version pin
+dsh plugin --profile web add dsh-remote-plugin@0.6.8
 ```
 
-Restart DSH Web and hard-refresh (Ctrl+F5); the app icon entry appears at the bottom of the left sidebar.
+Restart DSH Web and refresh the browser. The DSH Remote entry will appear in the sidebar.
 
-git source install (equivalent):
+## What the plugin provides
 
-```sh
-dsh plugin --profile web add "github:Blank-not-black/dsh-Remote#main&path:/packages/plugin"
-```
+- Compact panel: gateway state, connected devices, token usage, and quick actions.
+- Admin console: port, upstream, devices, requests, token statistics, QR pairing, and token rotation.
+- Bundled `gateway.cjs`: Bearer-token gateway listening on `0.0.0.0:8787` by default.
+- Self-healing lifecycle: relaunches the gateway after a DSH restart or unexpected exit; start and stop it from the panel.
+- `/fs/*` file endpoints: list, download, chunked upload, resume, pause/continue/cancel, and SHA-256 verification.
+- Mobile, desktop, and admin WebUI assets, plus the Android APK distributed with the plugin.
+
+## Mobile capabilities
+
+The Android app / mobile WebUI has five main destinations: Sessions, Files, Home, Stats, and Settings. Session detail supports goals, subagent interruption, model selection, fullscreen input, slash commands, and image attachments. Images can come from the camera or gallery and are sent as image content in `session.prompt`.
 
-## Gateway
+Notification settings include approval / question notifications, background polling, peak reminders, task completion notices, and announcement history. Four themes are retained: Default Deep Space, Sunset, Elbphilharmonie, and Prairie Tower.
 
-- Auto-start by default: on DSH startup or drawer refresh, the plugin launches the built-in `gateway.cjs` (`0.0.0.0:8787`), independent of the DSH process; Linux uses a standalone systemd unit, and environments without systemd (e.g. macOS) automatically fall back to a resident child process.
-- On/off intent persists in `~/.dsh-remote/gateway.enabled`; it can be stopped/started from the drawer.
-- Token lives in `~/.dsh-remote/token` (auto-generated on first run, reused and never overwritten), shown in the drawer and copyable; supports **QR pairing** and **one-click rotation**.
-- Env var `DSH_REMOTE_AUTOSTART=0` disables auto management.
-- File endpoints: `/fs/list` (list directory), `/fs/file` (download with Range support), `/fs/upload` (chunked resume with pause/cancel, SHA-256 verified before writing to disk); default root is `~`, and `DSH_REMOTE_FS_ROOT` opens multiple roots (`:` on Linux/macOS, `;` on Windows).
-- Feedback endpoint: `POST /feedback` (the app / desktop "Write feedback" dialog), forwarded by the gateway to the feedback collector; default `http://100.84.128.29/submit` (Tailscale internal network), overridable via `DSH_REMOTE_FEEDBACK_URL` — no tokens to configure.
+## Gateway configuration
 
-## Mobile App
+- Port priority: `DSH_REMOTE_GATEWAY_PORT` → `~/.dsh-remote/gateway-port` → `8787`.
+- Token: `~/.dsh-remote/token`, generated on first run.
+- Self-healing: `~/.dsh-remote/gateway.enabled`; use `DSH_REMOTE_AUTOSTART=0` to disable automatic management.
+- File roots: `DSH_REMOTE_FS_ROOT`, separated by `:` on Linux/macOS and `;` on Windows.
+- Upload limit: `DSH_REMOTE_FS_MAX_UPLOAD`, 2 GB by default.
+- DSH upstream: `http://127.0.0.1:3080` by default.
 
-The app is embedded in the plugin package (`apk/dsh-remote.apk`) — install the plugin and you have it, no GitHub needed:
+The token grants remote control of DSH. Keep it private. For cross-network access, prefer Tailscale or another authenticated secure tunnel.
 
-- Tap **QR code** in the desktop drawer → scan it with the phone to open the admin page → download the app from that page
-- Or open `http://<gateway-IP>:8787` in a browser to download
-- App updates are pushed by the gateway too (`update.json` relative path), never touching GitHub
-- A desktop browser opening `http://<gateway-IP>:8787` auto-enters the desktop WebUI (sidebar sessions + files + settings + stats + approval notification stack)
+## Links
 
-The app has built-in multi-server latency switching and offline chat history caching; downloaded files are stored in the system `Download/dsh-remote` folder.
+- Admin page: `http://<gateway-ip>:8787/admin`
+- Desktop WebUI: `http://<gateway-ip>:8787`
+- Main project: [dsh-Remote](https://github.com/Blank-not-black/dsh-Remote)
+- Stable releases: [GitHub Releases](https://github.com/Blank-not-black/dsh-Remote/releases/latest)
 
 ## License
 

package/README.md

@@ -1,46 +1,52 @@
 # dsh-remote-plugin
 
-[![Awesome DSH Plugin](https://awesome-dsh-plugin.com/badge.svg)](https://github.com/awesome-dsh-plugin/awesome-dsh-plugin)
+DSH Remote 的官方 bundle 插件：在 DSH 侧边栏提供入口，打开快速状态面板和完整管理控制台，并内置随 DSH 自动启停的远程网关。
 
 **中文** · [English](README.en.md)
 
-DSH Remote 的 DSH bundle 插件：在 DSH 左侧原生边栏注册入口，点击从右侧滑出管理抽屉；插件**内置网关程序并随 DSH 自动启停**（独立 systemd 单元），抽屉直显令牌、主机 IP 与设备监控，配合 [dsh-Remote](https://github.com/Blank-not-black/dsh-Remote) 的 Android App 实现手机远程操控与文件互传（`/fs/list`、`/fs/file`、`/fs/upload`）。面板内置四套皮肤（深空 / 落日 / 易北爱乐厅 / 草原孤塔），亮暗中性三档随系统偏好自动切换。
-
 ## 安装
 
 ```sh
 dsh plugin --profile web add dsh-remote-plugin
-# 或 pin 版本
-dsh plugin --profile web add dsh-remote-plugin@0.5.0
+
+# 也可以安装指定版本
+dsh plugin --profile web add dsh-remote-plugin@0.6.8
 ```
 
-重启 DSH Web 后 Ctrl+F5，左侧边栏底部出现 App 图标入口。
+重启 DSH Web 后刷新浏览器，左侧边栏会出现 DSH Remote 入口。
 
-git 源安装（等价）：
+## 插件提供什么
 
-```sh
-dsh plugin --profile web add "github:Blank-not-black/dsh-Remote#main&path:/packages/plugin"
-```
+- 快速面板：网关状态、在线设备、Token 用量和快捷操作；
+- 管理控制台：端口、上游、设备、请求、Token 统计、二维码和令牌轮换；
+- 内置 `gateway.cjs`：默认监听 `0.0.0.0:8787`，带 Bearer token 鉴权；
+- 网关自愈：DSH 重启或网关意外退出后自动拉起，可在面板中停止或启动；
+- `/fs/*` 文件端点：列表、下载、分块上传、断点续传、暂停/继续/取消和 SHA-256 校验；
+- 手机端、桌面端和管理页 WebUI，以及随插件分发的 Android APK。
+
+## 手机端能力
+
+Android 应用 / 手机 WebUI 采用五个主要页面：会话、文件、主页、统计、设置。会话详情支持目标控制、子代理中断、模型切换、全屏输入、斜杠命令和图片附件。图片附件可从相机或相册选择，并以 `session.prompt` 图片内容发送到当前会话。
 
-## 网关
+通知设置支持审批 / 提问通知、后台轮询、峰谷提醒、任务完成提醒和历史公告。当前保留四套主题：默认深空、落日、易北爱乐厅、草原孤塔。
 
-- 默认**自动启动**：DSH 启动或抽屉刷新时，插件会拉起内置 `gateway.cjs`（`0.0.0.0:8787`），独立于 DSH 进程；Linux 使用独立 systemd 单元，macOS 等无 systemd 环境自动回退为常驻子进程。
-- 开关持久化在 `~/.dsh-remote/gateway.enabled`；抽屉内可停止/启动。
-- 令牌在 `~/.dsh-remote/token`（首次自动生成，重复使用不覆盖），抽屉里显示并可复制；支持**二维码扫码配对**与**一键轮换**。
-- 环境变量 `DSH_REMOTE_AUTOSTART=0` 可关闭自动管理。
-- 文件端点：`/fs/list`（列目录）、`/fs/file`（下载，支持 Range）、`/fs/upload`（分块续传，支持暂停/取消，落盘前 SHA-256 校验）；默认根目录 `~`，`DSH_REMOTE_FS_ROOT` 可开多根（Linux/macOS 用 `:`，Windows 用 `;` 分隔）。
-- 反馈端点：`POST /feedback`（App / 桌面端「写反馈」），网关转发到反馈收集器；默认 `http://100.84.128.29/submit`（Tailscale 内网），可用 `DSH_REMOTE_FEEDBACK_URL` 覆盖，无需配置任何 token。
+## 网关配置
 
-## 手机 App
+- 网关端口优先级：`DSH_REMOTE_GATEWAY_PORT` 环境变量 → `~/.dsh-remote/gateway-port` → `8787`；
+- 令牌：`~/.dsh-remote/token`，首次运行自动生成；
+- 自愈开关：`~/.dsh-remote/gateway.enabled`，或使用 `DSH_REMOTE_AUTOSTART=0` 禁用自动管理；
+- 文件根目录：`DSH_REMOTE_FS_ROOT`，Linux/macOS 使用 `:`，Windows 使用 `;`；
+- 文件上限：`DSH_REMOTE_FS_MAX_UPLOAD`，默认 2GB；
+- DSH 上游：默认 `http://127.0.0.1:3080`。
 
-App 已随插件包内嵌（`apk/dsh-remote.apk`），装好插件即可获取，无需上 GitHub：
+令牌等同于 DSH 远程操作凭证，请不要公开或提交到仓库。局域网访问建议配合防火墙；跨网络访问建议使用 Tailscale 或其他带认证的安全隧道。
 
-- 桌面抽屉点「二维码」→ 手机扫码打开管理页 → 页面提供 App 下载
-- 或浏览器直接访问 `http://<网关IP>:8787` 下载
-- App 更新同样走网关自动推送（`update.json` 相对路径），全程不绕 GitHub
-- 电脑浏览器打开 `http://<网关IP>:8787` 自动进入桌面端 WebUI（侧栏会话 + 文件 + 设置 + 统计 + 审批通知卡片栈）
+## 相关地址
 
-App 内置多服务器测速切换与聊天记录离线缓存，下载文件统一放系统「下载/dsh-remote」。
+- 管理页：`http://<网关IP>:8787/admin`
+- 桌面 WebUI：`http://<网关IP>:8787`
+- 主项目：[dsh-Remote](https://github.com/Blank-not-black/dsh-Remote)
+- 正式版本：[GitHub Releases](https://github.com/Blank-not-black/dsh-Remote/releases/latest)
 
 ## License
 

package/client.js

@@ -1,6 +1,6 @@
 /* dsh-remote 插件 client half
  * 注册进 DSH 原生左侧边栏 footer(与 OpenBiliClaw 上下并列) + 右侧 shell.overlay 抽屉。
- * 抽屉内 iframe 懒加载 /remote/admin/ —— 即本地网关管理控制台的桌面 UI。
+ * 抽屉内 iframe 懒加载 /remote/plugin.html —— 插件端快速状态面板；深入管理再打开控制台。
  * 产物入库, 无构建步骤; 参考 @openbiliclaw/dsh-plugin 的官方 slot 注册模式。
  */
 window.__ModuleLoader__.load({
@@ -13,9 +13,10 @@ window.__ModuleLoader__.load({
     var runtime = require('@deepseek-ai/dsh-client-runtime/client')
 
     var DRAWER_STYLE = {
-      position: 'fixed', top: 0, right: 0, bottom: 0, zIndex: 2147483000,
-      width: 'min(460px, 96vw)', background: '#0b0e1a',
-      boxShadow: '-10px 0 32px rgba(0,0,0,.5)',
+      position: 'fixed', top: 12, right: 12, bottom: 12, zIndex: 2147483000,
+      width: 'min(520px, calc(100vw - 24px))', background: '#0b0e1a',
+      border: '1px solid rgba(125, 207, 255, .22)', borderRadius: 24, overflow: 'hidden',
+      boxShadow: '-16px 18px 48px rgba(0,0,0,.46), 0 0 0 1px rgba(91,140,255,.08)',
       transform: 'translateX(102%)', transition: 'transform .22s ease',
       display: 'flex', flexDirection: 'column',
     }
@@ -51,8 +52,9 @@ window.__ModuleLoader__.load({
         style: {
           display: 'flex', alignItems: 'center', gap: 7, width: '100%',
           padding: '6px 10px', border: 'none', borderRadius: 8,
-          background: hover ? 'rgba(125, 207, 255, .14)' : 'transparent',
-          transition: 'background .15s ease',
+          background: open ? 'rgba(125, 207, 255, .14)' : hover ? 'rgba(125, 207, 255, .10)' : 'transparent',
+          border: open ? '1px solid rgba(125, 207, 255, .24)' : '1px solid transparent',
+          transition: 'background .15s ease, border-color .15s ease',
           cursor: 'pointer', color: open ? '#5df2d6' : 'inherit',
           font: '500 13px/1.3 system-ui, sans-serif', textAlign: 'left',
         },
@@ -73,7 +75,7 @@ window.__ModuleLoader__.load({
         function onMsg(e) {
           if (e.origin !== location.origin) return
           var d = e.data
-          if (d && d.source === 'dsh-remote-admin' && d.type === 'close') props.actions.close()
+          if (d && (d.source === 'dsh-remote-admin' || d.source === 'dsh-remote-plugin') && d.type === 'close') props.actions.close()
         }
         window.addEventListener('message', onMsg)
         return function () { window.removeEventListener('message', onMsg) }
@@ -83,8 +85,8 @@ window.__ModuleLoader__.load({
         style: Object.assign({}, DRAWER_STYLE, { transform: open ? 'translateX(0)' : 'translateX(102%)' }),
       },
         loaded.current ? React.createElement('iframe', {
-          src: '/remote/admin/?embedded=1',
-          title: 'DSH Remote',
+          src: '/remote/plugin.html',
+          title: 'DSH Remote 快速状态面板',
           sandbox: 'allow-scripts allow-same-origin allow-forms allow-modals allow-popups',
           style: { flex: 1, width: '100%', border: 'none', background: '#0b0e1a' },
         }) : null)

package/gateway.cjs

@@ -20,6 +20,7 @@
  *   TOKEN_FILE  令牌文件, 默认 ~/.dsh-remote/token
  *   DSH_REMOTE_FS_ROOT       文件传输允许根, 默认 ~, 使用系统路径分隔符配置多根
  *   DSH_REMOTE_FS_MAX_UPLOAD 上传字节上限, 默认 2147483648 (2GB)
+ *   DSH_REMOTE_WORKBENCH     工作台绑定文件, 默认 ~/.dsh-remote/workbench.json
  */
 'use strict'
 
@@ -48,6 +49,7 @@ const WS_IDLE_MS = Number(process.env.GATEWAY_WS_IDLE_MS) || 60000
 const UPSTREAM = new URL(process.env.DSH_UPSTREAM || 'http://127.0.0.1:3080')
 const TOKEN_FILE = process.env.TOKEN_FILE || path.join(os.homedir(), '.dsh-remote', 'token')
 const NOTES_FILE = process.env.DSH_REMOTE_NOTES || path.join(os.homedir(), '.dsh-remote', 'device-notes.json')
+const WORKBENCH_FILE = process.env.DSH_REMOTE_WORKBENCH || path.join(os.homedir(), '.dsh-remote', 'workbench.json')
 const STARTED_AT = Date.now()
 const DSH_SERVICE = String(process.env.DSH_REMOTE_DSH_SERVICE || 'dsh-web').trim()
 
@@ -914,11 +916,20 @@ function serveStatic(req, res, url) {
       return
     }
     const ext = path.extname(filePath).toLowerCase()
+    const lastModified = st.mtime.toUTCString()
+    const mtimeSec = Math.floor(st.mtime.getTime() / 1000) * 1000
     cors(res)
+    const ims = req.headers['if-modified-since']
+    if (ims && new Date(ims).getTime() >= mtimeSec) {
+      res.writeHead(304, { 'last-modified': lastModified })
+      res.end()
+      return
+    }
     res.writeHead(200, {
       'content-type': MIME[ext] || 'application/octet-stream',
       'cache-control': ext === '.html' || ext === '.js' || ext === '.css' ? 'no-cache' : 'public, max-age=300',
-      'content-length': st.size
+      'content-length': st.size,
+      'last-modified': lastModified
     })
     if (req.method === 'HEAD') res.end()
     else fs.createReadStream(filePath).pipe(res)
@@ -1753,6 +1764,112 @@ function serveFs(req, res, url) {
   fsJson(res, 404, { error: 'not-found' })
 }
 
+// ---------- /workbench 工作台绑定 ----------
+// 工作台绑定一个文件夹；其下的子文件夹由客户端映射为 DSH 项目工作区。
+function workbenchPathInfo(rawPath) {
+  if (typeof rawPath !== 'string' || !path.isAbsolute(rawPath)) return { error: 'bad-path' }
+  const abs = path.resolve(rawPath)
+  let st
+  try { st = fs.statSync(abs) } catch (err) {
+    return { error: err.code === 'ENOENT' ? 'not-found' : 'permission-denied' }
+  }
+  if (!st.isDirectory()) return { error: 'not-a-directory' }
+  const checked = fsRealChecked(abs)
+  if (checked.error) return { error: checked.error === 'forbidden' ? 'outside-roots' : checked.error }
+  return { path: checked.abs }
+}
+
+function loadWorkbench() {
+  try {
+    const raw = JSON.parse(fs.readFileSync(WORKBENCH_FILE, 'utf8'))
+    if (!raw || typeof raw.path !== 'string' || !raw.path) return null
+    const checked = workbenchPathInfo(raw.path)
+    return checked.path ? { path: checked.path } : null
+  } catch {
+    return null
+  }
+}
+
+function saveWorkbench(binding) {
+  try {
+    fs.mkdirSync(path.dirname(WORKBENCH_FILE), { recursive: true })
+    fs.writeFileSync(WORKBENCH_FILE, JSON.stringify(binding, null, 2) + '\n')
+    return true
+  } catch {
+    return false
+  }
+}
+
+function serveWorkbench(req, res, url) {
+  const sub = url.pathname.slice('/workbench'.length)
+  if (req.method === 'OPTIONS') {
+    cors(res)
+    res.writeHead(204)
+    res.end()
+    return
+  }
+  if (!fsAuthorized(req, url, res)) return
+
+  if (sub === '' && req.method === 'GET') {
+    const binding = loadWorkbench()
+    fsJson(res, 200, {
+      bound: !!binding,
+      path: binding?.path || null,
+      title: binding ? path.basename(binding.path) : null
+    })
+    return
+  }
+
+  if (sub === '/bind' && req.method === 'POST') {
+    let body = ''
+    let done = false
+    const fail = (status, payload) => {
+      if (done || res.headersSent) return
+      done = true
+      fsJson(res, status, payload)
+    }
+    req.on('data', chunk => {
+      if (done) return
+      body += chunk
+      if (Buffer.byteLength(body) > 4096) {
+        req.destroy()
+        fail(413, { error: 'too-large' })
+      }
+    })
+    req.on('error', () => { if (!done) done = true })
+    req.on('end', () => {
+      if (done) return
+      try {
+        const rawPath = JSON.parse(body || '{}')?.path
+        const checked = workbenchPathInfo(rawPath)
+        if (checked.error) {
+          const status = checked.error === 'forbidden' ? 403 : 400
+          fail(status, { error: checked.error, detail: checked.error === 'outside-roots' ? '绑定目录必须在文件传输允许根目录内' : undefined })
+          return
+        }
+        if (!saveWorkbench({ path: checked.path })) {
+          fail(500, { error: 'save-failed' })
+          return
+        }
+        done = true
+        fsJson(res, 200, { bound: true, path: checked.path, title: path.basename(checked.path) })
+      } catch {
+        fail(400, { error: 'bad-request' })
+      }
+    })
+    return
+  }
+
+  if (sub === '/unbind' && req.method === 'POST') {
+    try { fs.rmSync(WORKBENCH_FILE, { force: true }) } catch {}
+    fsJson(res, 200, { bound: false })
+    return
+  }
+
+  res.writeHead(405, { allow: 'GET, POST' })
+  res.end()
+}
+
 // ---------- /api 代理 ----------
 function proxyApi(req, res, url) {
   if (req.method === 'OPTIONS') {
@@ -1851,6 +1968,7 @@ const server = http.createServer((req, res) => {
   try {
     const url = new URL(req.url, 'http://dsh-remote.local')
     if (url.pathname === '/fs' || url.pathname.startsWith('/fs/')) return serveFs(req, res, url)
+    if (url.pathname === '/workbench' || url.pathname.startsWith('/workbench/')) return serveWorkbench(req, res, url)
     if (url.pathname === '/feedback') return serveFeedback(req, res, url)
     if (url.pathname.startsWith('/admin/api')) return serveAdminApi(req, res, url)
     if (url.pathname.startsWith('/stats')) return serveStats(req, res, url)

package/index.mjs

@@ -150,7 +150,7 @@ function runExit(cmd, args) {
 
 const GATEWAY_ENV_KEYS = [
   'TOKEN', 'TOKEN_FILE', 'DSH_REMOTE_TOKEN', 'DSH_REMOTE_FS_ROOT', 'DSH_REMOTE_FS_MAX_UPLOAD',
-  'DSH_REMOTE_NOTES', 'DSH_REMOTE_DSH_SERVICE', 'DSH_REMOTE_FEEDBACK_URL',
+  'DSH_REMOTE_NOTES', 'DSH_REMOTE_WORKBENCH', 'DSH_REMOTE_DSH_SERVICE', 'DSH_REMOTE_FEEDBACK_URL',
   'UPDATE_CHECK_URL', 'UPDATE_INTERVAL_MS', 'UPDATE_PROXY', 'GATEWAY_WS_IDLE_MS',
   'HTTP_PROXY', 'HTTPS_PROXY', 'ALL_PROXY', 'NO_PROXY',
   'http_proxy', 'https_proxy', 'all_proxy', 'no_proxy'
@@ -704,10 +704,19 @@ async function serveStatic(req, res, ctx) {
     return
   }
   const { abs, info } = found
+  const lastModified = info.mtime.toUTCString()
+  const mtimeSec = Math.floor(info.mtime.getTime() / 1000) * 1000
+  const ims = req.headers['if-modified-since']
+  if (ims && new Date(ims).getTime() >= mtimeSec) {
+    res.writeHead(304, { 'last-modified': lastModified })
+    res.end()
+    return
+  }
   res.writeHead(200, {
     'content-type': MIME[extname(abs)] ?? 'application/octet-stream',
     'content-length': info.size,
     'cache-control': 'no-cache',
+    'last-modified': lastModified,
   })
   if (req.method === 'HEAD') {
     res.end()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-remote-plugin",
-  "version": "0.6.6",
+  "version": "0.6.8",
   "description": "DSH Remote 官方 bundle 插件：DSH 左侧原生边栏入口 + 右侧抽屉内嵌管理控制台；内置网关随 DSH 自动启停(systemd 独立单元)，抽屉直显令牌与设备监控；网关提供 /fs/* 文件传输端点(列表/断点下载/上传)，配合 Android App 远程操控会话/审批/提问/goal 与文件互传(多服务器测速切换、聊天记录离线缓存)。",
   "type": "module",
   "main": "./index.mjs",

package/public/admin.html

@@ -145,7 +145,7 @@
       padding: 7px 8px; border-radius: 10px; border: none; background: transparent; color: var(--dsr-text);
       font: inherit; font-size: 13px; text-align: left; cursor: pointer; text-decoration: none;
     }
-    .fb-item:hover, .fb-item:focus-visible { background: var(--dsr-bg); outline: none; }
+    .fb-item:hover, .fb-item:focus-visible { background: var(--dsr-bg); }
     .fb-item.primary { background: var(--dsr-accent-soft); border: 1px solid var(--dsr-accent-line); }
     .fb-ico {
       width: 32px; height: 32px; border-radius: 9px; flex-shrink: 0;
@@ -174,6 +174,86 @@
       .admin-title .right { gap: 4px; }
       .tb-btn { padding: 0 8px; }
     }
+    .login-card input:focus-visible, .gateway-port-row input:focus-visible {
+      outline: 2px solid var(--dsr-accent);
+      outline-offset: 2px;
+    }
+    @media (prefers-reduced-motion: reduce) {
+      *, *::before, *::after {
+        animation-duration: .01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: .01ms !important;
+      }
+    }
+
+    /* 控制台面板：减少整面纯色，建立“工具台”层次 */
+    html, body { font-family: system-ui, -apple-system, "PingFang SC", "Noto Sans CJK SC", sans-serif; text-rendering: optimizeLegibility; }
+    body { background: radial-gradient(900px 520px at 92% -12%, var(--dsr-accent-soft), transparent 68%), linear-gradient(180deg, var(--dsr-bg), var(--dsr-bg-2)); }
+    .admin-wrap { max-width: 1320px; padding: calc(env(safe-area-inset-top, 0px) + 18px) clamp(14px, 3vw, 30px) 48px; }
+    .admin-title { margin-bottom: 18px; padding: 12px 14px; border: 1px solid var(--dsr-line); border-radius: 18px; background: linear-gradient(135deg, var(--dsr-panel), var(--dsr-bg-2)); box-shadow: 0 14px 36px var(--dsr-shadow); backdrop-filter: blur(16px); }
+    .admin-title h1 { font-size: 21px; letter-spacing: -.2px; }
+    .admin-title .left, .admin-title .right { gap: 7px; }
+    .tb-btn { border-radius: 11px; background: linear-gradient(135deg, var(--dsr-panel-2), var(--dsr-bg-2)); border-color: var(--dsr-line); transition: transform .18s ease, border-color .18s ease, background .18s ease; }
+    .tb-btn:hover { transform: translateY(-1px); border-color: var(--dsr-accent-line); background: var(--dsr-accent-soft); }
+    .tb-btn svg { width: 17px; height: 17px; }
+    .login-card, .stat-card, .stats-chart, .table-wrap, .gateway-port-row, .pair-box { background: linear-gradient(145deg, var(--dsr-panel), var(--dsr-bg-2)); border-color: var(--dsr-line); border-radius: 18px; box-shadow: 0 12px 30px var(--dsr-shadow); }
+    .login-card { padding: 18px; }
+    .stat-grid { gap: 12px; }
+    .stat-card { padding: 15px 16px; box-shadow: inset 0 1px var(--dsr-divider), 0 10px 26px var(--dsr-shadow); }
+    .stat-card .v { font-size: 24px; font-variant-numeric: tabular-nums; }
+    .stats-dash { margin-top: 4px; }
+    .stats-chart { height: 210px; padding: 16px 18px 12px; }
+    .stats-bar .bars { border-radius: 9px 9px 3px 3px; box-shadow: 0 0 16px var(--dsr-glow); }
+    .section-head { margin: 18px 2px 9px; font-weight: 750; letter-spacing: .2px; }
+    .token-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 13px; margin: 0 0 14px; border: 1px solid var(--dsr-line); border-radius: 18px; background: linear-gradient(145deg, var(--dsr-panel), var(--dsr-bg-2)); box-shadow: 0 10px 28px var(--dsr-shadow); }
+    .token-row code { width: auto; min-width: 0; padding: 10px 12px; border-radius: 11px; background: var(--dsr-bg); border-color: var(--dsr-line); }
+    .token-actions { justify-content: flex-end; }
+    .token-actions .mini-btn { flex: 0 0 auto; border-radius: 10px; }
+    .gateway-port-row { padding: 12px 14px; }
+    .table-wrap { overflow: hidden; }
+    th, td { border-bottom-color: var(--dsr-divider); }
+    tbody tr { transition: background .18s ease; }
+    .pair-box { padding: 18px; }
+    .admin-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding:20px; margin:0 0 16px; border:1px solid var(--dsr-accent-line); border-radius:20px; background:linear-gradient(135deg, var(--dsr-panel-2), var(--dsr-bg-2)); box-shadow:0 16px 34px var(--dsr-shadow); }
+    .admin-hero-copy { min-width:0; }
+    .admin-eyebrow { color:var(--dsr-accent-strong); font-size:10px; font-weight:800; letter-spacing:1.6px; }
+    .admin-hero h2 { margin:7px 0 4px; font-size:26px; line-height:1.15; letter-spacing:-.5px; }
+    .admin-hero p { margin:0; color:var(--dsr-muted); font-size:12px; }
+    .admin-hero-side { display:flex; flex-direction:column; align-items:flex-end; gap:10px; flex:none; }
+    .admin-hero-status { color:var(--dsr-success); font-size:12px; font-weight:700; }
+    .admin-hero.attention { border-color:var(--dsr-warning-line); }
+    .admin-hero.attention .admin-hero-status { color:var(--dsr-warning); }
+    .admin-hero.plugin, .admin-hero.offline { border-color:var(--dsr-line); }
+    .admin-hero.plugin .admin-hero-status, .admin-hero.offline .admin-hero-status { color:var(--dsr-muted); }
+    .admin-hero-action { min-height:36px; padding:7px 13px; border-color:var(--dsr-accent-strong); background:var(--dsr-accent-strong); color:var(--dsr-on-accent); font-weight:700; }
+    .admin-hero.plugin .admin-hero-action { border-color:var(--dsr-accent-strong); background:var(--dsr-accent-strong); }
+    .admin-hero.offline .admin-hero-action { border-color:var(--dsr-accent-line); background:var(--dsr-accent-soft); color:var(--dsr-accent-strong); }
+    #stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
+    #stats .stat-card:nth-child(n+5) { background:transparent; box-shadow:none; }
+    #stats .stat-card:nth-child(n+5) .v { font-size:20px; }
+    @media (max-width: 760px) {
+      .admin-hero { align-items:stretch; flex-direction:column; gap:14px; padding:16px; }
+      .admin-hero h2 { font-size:23px; }
+      .admin-hero-side { align-items:stretch; flex-direction:row; justify-content:space-between; }
+      .admin-hero-action { flex:0 0 auto; }
+      #stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
+      #stats .stat-card:nth-child(n+5) { background:linear-gradient(145deg, var(--dsr-panel), var(--dsr-bg-2)); box-shadow:inset 0 1px var(--dsr-divider), 0 10px 26px var(--dsr-shadow); }
+    }
+    @media (max-width: 720px) {
+      .token-row { display: flex; flex-direction: column; align-items: stretch; }
+      .token-actions { justify-content: stretch; }
+      .token-actions .mini-btn { flex: 1 1 auto; }
+    }
+    @media (max-width: 900px) {
+      .admin-title { display: grid; grid-template-columns: minmax(0, 1fr) auto; row-gap: 10px; }
+      .admin-title .left { min-width: 0; }
+      .admin-title .right { grid-column: 1 / -1; justify-content: flex-start; min-width: 0; overflow-x: auto; scrollbar-width: none; }
+      .admin-title .right::-webkit-scrollbar { display: none; }
+    }
+    @media (max-width: 440px) {
+      .admin-title h1 { display: block; min-width: 0; overflow: visible; font-size: 18px; }
+      .admin-title .left { gap: 7px; }
+    }
   </style>
 </head>
 <body>
@@ -185,11 +265,11 @@
         <h1>DSH Remote <span data-i18n="admin">管理</span></h1>
       </div>
       <div class="right">
-        <a class="mini-btn gh-btn tb-btn" href="https://github.com/Blank-not-black/dsh-Remote" target="_blank" rel="noopener" title="GitHub">
+        <a class="mini-btn gh-btn tb-btn" href="https://github.com/Blank-not-black/dsh-Remote" target="_blank" rel="noopener" title="GitHub" data-i18n-aria="repo">
           <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8a8.01 8.01 0 0 0 5.47 7.59c.4.08.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8Z"/></svg>
           <span class="gh-label" data-i18n="repo">仓库</span>
         </a>
-        <button id="btn-donate" class="mini-btn tb-btn" data-i18n-title="donateTitle">🎁</button>
+        <button id="btn-donate" class="mini-btn tb-btn" data-i18n-title="donateTitle" data-i18n-aria="donateTitle"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 8h11v6a4 4 0 0 1-4 4H10a4 4 0 0 1-4-4Z"/><path d="M17 10h1.5a2.5 2.5 0 0 1 0 5H17M9 4c0 1 1 1.2 1 2M13 4c0 1 1 1.2 1 2M5 20h13"/></svg></button>
         <div class="fb-wrap">
           <button id="btn-feedback" class="mini-btn fb-btn tb-btn" data-i18n-title="feedbackTitle" data-i18n-aria="feedbackTitle" aria-haspopup="menu" aria-expanded="false">
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 12a8 8 0 0 1-8 8H5l-1.5 2L4 20a8 8 0 0 1-1-4 8 8 0 0 1 18-4Z"/></svg>
@@ -223,6 +303,18 @@
     </div>
 
     <div id="main-view" class="hidden">
+      <section id="admin-hero" class="admin-hero" aria-live="polite">
+        <div class="admin-hero-copy">
+          <div class="admin-eyebrow" data-i18n="hero.eyebrow">GATEWAY CONTROL</div>
+          <h2 id="admin-hero-title">正在检查网关</h2>
+          <p id="admin-hero-desc">读取运行状态与上游连接</p>
+        </div>
+        <div class="admin-hero-side">
+          <span id="admin-hero-status" class="admin-hero-status">—</span>
+          <button id="admin-hero-action" class="mini-btn admin-hero-action" type="button" data-i18n="hero.openDevices">查看设备</button>
+        </div>
+      </section>
+
       <div class="token-row">
         <code id="token-full">—</code>
         <div class="token-actions">
@@ -274,7 +366,7 @@
   </div>
 
   <!-- 皮肤选择模态 -->
-  <div id="modal-theme" class="modal hidden">
+  <div id="modal-theme" class="modal hidden" role="dialog" aria-modal="true">
     <div class="modal-card">
       <div class="modal-title" data-i18n="theme.panelTitle">选择配色</div>
       <div id="theme-options" class="theme-panel-list"></div>
@@ -285,11 +377,11 @@
   </div>
 
   <!-- 赞赏支持模态 -->
-  <div id="modal-donate" class="modal hidden">
+  <div id="modal-donate" class="modal hidden" role="dialog" aria-modal="true">
     <div class="modal-card">
       <div class="modal-title" data-i18n="donateTitle">赞赏支持</div>
       <div class="modal-body donate-body">
-        <img src="donate.png" alt="" class="donate-img" style="display:block;margin:0 auto;max-width:100%;max-height:60vh;border-radius:8px">
+        <img src="../donate.png" alt="赞赏二维码" width="1152" height="1152" class="donate-img" style="display:block;margin:0 auto;max-width:100%;height:auto;max-height:60vh;border-radius:12px">
         <p class="donate-thanks" data-i18n="donateThanks" style="text-align:center;margin-top:12px">感谢你的支持 ☕</p>
       </div>
       <div class="modal-actions">
@@ -298,7 +390,7 @@
     </div>
   </div>
 
-  <div id="toast" class="toast hidden"></div>
+  <div id="toast" class="toast hidden" role="status" aria-live="polite"></div>
   <script>
     window.ADMIN_STR = {
       zh: {
@@ -306,6 +398,8 @@
         'consoleTitle': '返回控制台',
         'collapse': '收起面板',
         'admin': '管理',
+        'hero.eyebrow': 'GATEWAY CONTROL', 'hero.running': '网关运行正常', 'hero.attention': '网关需要关注', 'hero.plugin': 'DSH 插件已连接', 'hero.offline': '网关未运行', 'hero.checking': '正在检查网关',
+        'hero.runningDesc': '{online} 台设备在线 · {requests} 次请求', 'hero.attentionDesc': 'DSH 上游暂时不可达，请打开诊断', 'hero.pluginDesc': '插件已连接 DSH，网关可按需启动', 'hero.offlineDesc': '启动网关后即可接受 App 和桌面端连接', 'hero.openDevices': '查看设备', 'hero.startGateway': '启动网关', 'hero.copyToken': '复制令牌',
         'theme.default': '默认深空', 'theme.dark': '落日', 'theme.light': '易北爱乐厅', 'theme.neutral': '草原孤塔',
         'theme.panelTitle': '选择配色', 'theme.close': '关闭',
         'repo': '仓库',
@@ -389,6 +483,8 @@
         'consoleTitle': 'Back to console',
         'collapse': 'Collapse panel',
         'admin': 'Admin',
+        'hero.eyebrow': 'GATEWAY CONTROL', 'hero.running': 'Gateway is healthy', 'hero.attention': 'Gateway needs attention', 'hero.plugin': 'DSH plugin connected', 'hero.offline': 'Gateway is not running', 'hero.checking': 'Checking gateway',
+        'hero.runningDesc': '{online} devices online · {requests} requests', 'hero.attentionDesc': 'DSH upstream is unreachable; open diagnostics', 'hero.pluginDesc': 'The plugin is connected to DSH; start the gateway when needed', 'hero.offlineDesc': 'Start the gateway to accept App and desktop connections', 'hero.openDevices': 'View devices', 'hero.startGateway': 'Start gateway', 'hero.copyToken': 'Copy token',
         'theme.default': 'Default', 'theme.dark': 'Sunset', 'theme.light': 'Elbphilharmonie', 'theme.neutral': 'Prairie Tower',
         'theme.panelTitle': 'Choose theme', 'theme.close': 'Close',
         'repo': 'Repo',

package/public/admin.js

@@ -220,6 +220,24 @@ function render(st) {
     if (cur) cur.textContent = t('gatewayPort.current', { port: gatewayPort })
   }
   const upOk = st.upstream.reachable
+  const hero = $('admin-hero')
+  if (hero) {
+    const heroState = isGateway ? (upOk ? 'running' : 'attention') : isPlugin ? 'plugin' : 'offline'
+    hero.className = 'admin-hero ' + heroState
+    const titleKey = heroState === 'running' ? 'hero.running' : heroState === 'attention' ? 'hero.attention' : heroState === 'plugin' ? 'hero.plugin' : 'hero.offline'
+    const descKey = heroState === 'running' ? 'hero.runningDesc' : heroState === 'attention' ? 'hero.attentionDesc' : heroState === 'plugin' ? 'hero.pluginDesc' : 'hero.offlineDesc'
+    $('admin-hero-title').textContent = t(titleKey)
+    $('admin-hero-desc').textContent = heroState === 'running'
+      ? t(descKey, { online: st.onlineCount || 0, requests: st.totalRequests || 0 })
+      : t(descKey)
+    $('admin-hero-status').textContent = isGateway ? (upOk ? t('stat.reachable') : t('stat.unreachable')) : t(isPlugin ? 'badge.embedded' : 'badge.gatewayDown')
+    const action = $('admin-hero-action')
+    if (action) {
+      const actionKey = heroState === 'plugin' ? 'hero.startGateway' : heroState === 'offline' ? 'hero.copyToken' : 'hero.openDevices'
+      action.textContent = t(actionKey)
+      action.dataset.heroAction = heroState === 'plugin' ? 'start' : heroState === 'offline' ? 'copy' : 'devices'
+    }
+  }
   const hostIPs = (st.lanIPs || []).join(t('stat.ipSep')) || '127.0.0.1'
   const latestHtml = st.latest?.newer
     ? `<div class="v">${t('stat.updateAvailable', { version: st.latest.version })}</div><div class="k">${t('stat.currentV', { version: st.version })} · <a href="${st.latest.url || '#'}" target="_blank" rel="noopener" style="color:var(--dsr-accent-strong)">${t('stat.download')}</a></div>`
@@ -388,6 +406,12 @@ $('btn-logout').addEventListener('click', logout)
 $('btn-close-drawer').addEventListener('click', () => {
   window.parent.postMessage({ source: 'dsh-remote-admin', type: 'close' }, location.origin)
 })
+$('admin-hero-action').addEventListener('click', () => {
+  const action = $('admin-hero-action').dataset.heroAction
+  if (action === 'start') return $('btn-gateway').click()
+  if (action === 'copy') return $('btn-copy').click()
+  $('device-rows').closest('.table-wrap')?.scrollIntoView({ behavior: 'smooth', block: 'start' })
+})
 $('btn-copy').addEventListener('click', async () => {
   try {
     await navigator.clipboard.writeText(shownToken || token)