dsh-long-plugins 1.3.9 → 2.0.0

package/README.md

@@ -5,7 +5,7 @@ upload manager, workspace **输出文件** section, top-bar **文件** browser w
 **技能文档** (skill docs) browser, DeepSeek account balance, and **turn ruler (session navigation)** — all in one installable plugin.
 Also ships an auto-repair install that relinks DSH core patches (reverse-proxy WebSocket heartbeat, upgrade relink).
 
-一个插件整合 DSH Web 的常用增强：上传管理、顶栏「📂文件」工作区浏览 + 文件预览（Word、PPT 格式渲染）、工作区「输出文件」面板、技能文档浏览、账户余额显示。并自带修复安装，自动重连 DSH 核心补丁（反代 WebSocket 心跳、升级重连）。会话记录导航。
+一个插件整合 DSH Web 的常用增强：上传管理、顶栏「📂文件」工作区浏览 + 文件预览（Word、PPT、Excel 格式渲染）、工作区「输出文件」面板、技能文档浏览、账户余额显示。并自带修复安装，自动重连 DSH 核心补丁（反代 WebSocket 心跳、升级重连）。会话记录导航。
 
 ## Features / 功能
 
@@ -95,6 +95,8 @@ Agent 可直接调用 `md2docx` 工具，把 Markdown 转成带页码页脚的 W
 /api/dsh-uploads/workspace-file/save     save edited content (POST)
 /api/dsh-uploads/docx-preview            Word (.docx) real render page (browser-side docx-preview)
 /api/dsh-uploads/docx-preview-asset       serve docx-preview / jszip vendor libs
+/api/dsh-uploads/xlsx-preview             Excel (.xlsx) static render page (browser-side SheetJS → table)
+/api/dsh-uploads/xlsx-preview-asset        serve SheetJS (xlsx) vendor lib
 /dsh-skill-docs/skill-docs               skill docs list (grouped by skill)
 /dsh-skill-docs/skill-doc                preview / download
 /dsh-skill-docs/skill-doc/save           save (POST)
@@ -115,7 +117,26 @@ MIT
 - `JSZip` — 解压 Office 包 — **MIT**（或 GPLv3，本项目按 MIT 使用）
 - `Chart.js` — PPT 内图表 — **MIT**
 - `PptxViewJS` — PowerPoint 真实预览 — **MIT**
+- `SheetJS`(xlsx.full.min.js) — Excel 真实预览 — **Apache-2.0**
 - npm 依赖：`mammoth`（BSD-2-Clause）、`exceljs`（MIT）
 
 完整的版权声明与来源见 [`THIRD_PARTY_NOTICES.md`](THIRD_PARTY_NOTICES.md)。
 
+## Changelog / 更新记录
+
+### v2.0.0
+- 新增：毛玻璃界面（玻璃拟态）。为 DSH 网页叠加自定义毛玻璃效果，将界面打磨成"玻璃"质感。
+- **自定义背景图**：上传一张背景图铺满整个页面（含左边栏、顶部、会话区），实现桌面壁纸式的背景；左边栏 / 顶部半透明透出背景图，界面更通透。
+- **分区独立磨砂与罩色**：会话区、输入区各自独立设置「罩色 + 罩强度」，互不影响，实现"玻璃卡片"的分区质感；会话窗口磨砂玻璃悬浮卡片效果。
+- **磨砂模糊**：全局磨砂模糊强度可调（0–80px），文字清晰可读。
+- **跟随系统主题**：界面文字/内容颜色跟随系统深色/浅色主题，不强制改色，保证任意主题下可读。
+- **设置面板「毛玻璃界面」**：总开关、背景图上传、磨砂模糊、会话区/输入区各自的罩色与罩强度，实时保存生效。
+
+### v1.3.10
+- 新增 `.xlsx` 浏览器端预览：用 SheetJS 解析并显示为表格（行列标头、合并单元格、多工作表切换），预览支持 − / ＋ / 适合宽度缩放，默认整表适配；浏览器端处理，不占用 NAS 本地资源。
+- 工作区浏览、工作区文件、上传文件列表中的 `.xlsx` 均接入该预览页。
+- `.csv` / `.tsv` 保留表格预览（首行作表头）。
+- 文件列表按钮顺序调整：工作区浏览页为 复制路径、重命名、下载、预览；上传/输出文件面板为 复制路径、删除、下载、预览。
+- 「上传文件」「输出文件」新增「开启删除」开关：关闭时删除按钮置灰禁用，开启后可删除；上传文件的「复制路径」不再使用删除红色。
+- 手机端（≤640px）文件列表顶部操作行保持单行：搜索/日期等宽、刷新/开关靠右。
+

package/THIRD_PARTY_NOTICES.md

@@ -34,6 +34,13 @@ copyright notices and sources are listed here.
 - npm: <https://www.npmjs.com/package/pptxviewjs>
 - CDN / source build: <https://cdn.jsdelivr.net/npm/pptxviewjs@1.1.9>
 
+### SheetJS (`xlsx.full.min.js`)
+- Used for: real browser-side Excel (`.xlsx`) preview
+- License: **Apache-2.0**
+- Copyright: SheetJS Community Edition
+- npm: <https://www.npmjs.com/package/xlsx>
+- CDN / source build: <https://cdn.jsdelivr.net/npm/xlsx@0.18.5>
+
 ## Runtime npm dependencies (not vendored into the package)
 
 These are declared as `dependencies` and resolved on the host at install time;

package/client/client.js

@@ -718,6 +718,7 @@ window.__ModuleLoader__.load({
       const [previewMaximized, setPreviewMaximized] = React.useState(false)
       const [dayFilter, setDayFilter] = React.useState('')
       const [search, setSearch] = React.useState('')
+      const [deleteEnabled, setDeleteEnabled] = React.useState(false)
 
       async function refresh() {
         setState((current) => ({ ...current, loading: true, error: '' }))
@@ -852,6 +853,12 @@ window.__ModuleLoader__.load({
               { type: 'button', className: 'dsh-upload-refresh', disabled: state.loading, onClick: refresh },
               state.loading ? '刷新中…' : '刷新',
             ),
+            React.createElement(
+              'label',
+              { className: 'dsh-upload-del-toggle' },
+              React.createElement('input', { type: 'checkbox', checked: deleteEnabled, onChange: (e) => setDeleteEnabled(e.target.checked) }),
+              '开启删除',
+            ),
           ),
         ),
         React.createElement(
@@ -941,11 +948,9 @@ window.__ModuleLoader__.load({
               React.createElement(
                 'div',
                 { className: 'dsh-upload-actions' },
-                React.createElement('button', { type: 'button', className: 'dsh-upload-preview', onClick: () => previewFile(file.name) }, '预览'),
-                React.createElement('a', { href: downloadUrl(file.name), download: file.name }, '下载'),
                 React.createElement(
                   'button',
-                  { type: 'button', onClick: () => {
+                  { type: 'button', className: 'dsh-upload-copy', onClick: () => {
                     const s = String(file.path || file.name)
                     const base = state.root ? String(state.root).replace(/\/[^/]*$/, '') : ''
                     copyText(base && s.indexOf(base) === 0 ? s.slice(base.length).replace(/^\/+/, '') : s)
@@ -954,9 +959,11 @@ window.__ModuleLoader__.load({
                 ),
                 React.createElement(
                   'button',
-                  { type: 'button', disabled: deleting === file.name, onClick: () => remove(file.name) },
+                  { type: 'button', disabled: !deleteEnabled || deleting === file.name, onClick: () => remove(file.name) },
                   deleting === file.name ? '删除中…' : '删除',
                 ),
+                React.createElement('a', { href: downloadUrl(file.name), download: file.name }, '下载'),
+                React.createElement('button', { type: 'button', className: 'dsh-upload-preview', onClick: () => previewFile(file.name) }, '预览'),
               ),
             )),
           )),
@@ -1024,8 +1031,13 @@ window.__ModuleLoader__.load({
       .dsh-upload-file-meta{flex:none;color:var(--dsw-alias-label-tertiary);font-size:12px}
       .dsh-upload-actions{display:flex;flex:none;gap:7px}
       .dsh-upload-actions button{color:var(--dsw-alias-state-error-primary)}
+      .dsh-upload-actions button.dsh-upload-copy{color:var(--dsw-alias-label-primary)}
+      .dsh-upload-actions button:disabled{opacity:.5;cursor:not-allowed;color:var(--dsw-alias-label-tertiary)}
+      .dsh-upload-del-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;user-select:none}
+      .dsh-upload-del-toggle input{accent-color:var(--dsw-alias-state-business-primary);cursor:pointer}
+      .dsh-ws-del:disabled{opacity:.5;cursor:not-allowed;color:var(--dsw-alias-label-tertiary)!important}
       .dsh-upload-actions a,.dsh-upload-actions button{white-space:nowrap}
-      @media (max-width:640px){.dsh-upload-row{align-items:stretch;flex-direction:column;gap:4px}.dsh-upload-file-name{white-space:normal;word-break:break-all}.dsh-upload-actions{width:100%;display:flex;gap:6px}.dsh-upload-actions a,.dsh-upload-actions button{flex:1;text-align:center;white-space:nowrap;padding:6px 4px}.dsh-upload-chip{min-width:160px}.dsh-upload-settings-head{flex-direction:column;align-items:stretch;gap:10px}.dsh-upload-head-actions{width:100%;justify-content:flex-end}.dsh-upload-head-actions .dsh-upload-refresh{flex:1;text-align:center;padding:7px 8px;max-width:none}}
+      @media (max-width:640px){.dsh-upload-row{align-items:stretch;flex-direction:column;gap:4px}.dsh-upload-file-name{white-space:normal;word-break:break-all}.dsh-upload-actions{width:100%;display:flex;gap:6px}.dsh-upload-actions a,.dsh-upload-actions button{flex:1;text-align:center;white-space:nowrap;padding:6px 4px}.dsh-upload-chip{min-width:160px}.dsh-upload-settings-head{flex-direction:column;align-items:stretch;gap:10px}.dsh-upload-head-actions{width:100%;flex-wrap:nowrap;justify-content:flex-start}.dsh-upload-head-actions .dsh-searchpop,.dsh-upload-head-actions .dsh-datefilter{flex:1 1 0;min-width:0}.dsh-upload-head-actions .dsh-upload-refresh{flex:none;text-align:center;padding:7px 8px;max-width:none}.dsh-upload-head-actions .dsh-upload-del-toggle{flex:none;white-space:nowrap;padding:0 4px}}
       .dsh-ws-folder:hover{background:var(--dsw-alias-interactive-bg-hover)}
       .dsh-ws-file-type{flex:none;font-size:10px;line-height:14px;padding:1px 6px;border-radius:5px;border:1px solid var(--dsw-alias-border-l2);color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-interactive-bg-hover);white-space:nowrap}
       .dsh-upload-preview-del{color:var(--dsw-alias-state-error-primary)!important}
@@ -1068,6 +1080,7 @@ window.__ModuleLoader__.load({
       const [collapsed, setCollapsed] = React.useState({})
       const [dayFilter, setDayFilter] = React.useState('')
       const [search, setSearch] = React.useState('')
+      const [deleteEnabled, setDeleteEnabled] = React.useState(false)
       const [copied, setCopied] = React.useState(false)
       const [editing, setEditing] = React.useState(false)
       const [edited, setEdited] = React.useState('')
@@ -1129,6 +1142,9 @@ window.__ModuleLoader__.load({
             } else if (/\.pptx$/i.test(path)) {
               // pptx：走 PptxViewJS 真实渲染页（浏览器端 Canvas 渲染，所见即所得）。
               setPreview({ path, name: data.name, url: '/api/dsh-uploads/pptx-preview?path=' + encodeURIComponent(path) })
+            } else if (/\.xlsx$/i.test(path)) {
+              // xlsx：走 x-spreadsheet 真实渲染页（浏览器端解析 xlsx，所见即所得）。
+              setPreview({ path, name: data.name, url: '/api/dsh-uploads/xlsx-preview?path=' + encodeURIComponent(path) })
             } else {
               setPreview(data)
             }
@@ -1267,6 +1283,10 @@ window.__ModuleLoader__.load({
         React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap', minWidth: 0 } },
           React.createElement(SearchPopup, { value: search, onChange: setSearch, placeholder: '搜索文件名…' }),
           React.createElement(DateFilter, { value: dayFilter, onChange: setDayFilter, placeholder: '选择日期' }),
+          React.createElement('label', { className: 'dsh-upload-del-toggle' },
+            React.createElement('input', { type: 'checkbox', checked: deleteEnabled, onChange: (e) => setDeleteEnabled(e.target.checked) }),
+            '开启删除',
+          ),
         ),
         error !== null && React.createElement('div', { style: { fontSize: 12, color: 'var(--dsw-alias-state-error-primary)' } }, error),
         groups === null && error === null && React.createElement('div', { style: metaStyle }, '加载中…'),
@@ -1299,10 +1319,10 @@ window.__ModuleLoader__.load({
             React.createElement(
               'div',
               { className: 'dsh-ws-actions', style: { display: 'flex', gap: 6, flex: 'none' } },
-              React.createElement('button', { type: 'button', style: btnStyle, disabled: busy, onClick: () => openPreview(f.path) }, '预览'),
-              React.createElement('a', { href: '/api/dsh-uploads/workspace-file?path=' + encodeURIComponent(f.path) + '&download=1', download: f.name, style: btnStyle }, '下载'),
               React.createElement('button', { type: 'button', style: btnStyle, disabled: busy, onClick: () => copyText(f.path) }, '复制路径'),
-              React.createElement('button', { type: 'button', style: delStyle, disabled: busy, onClick: () => doDelete(f.path) }, '删除'),
+              React.createElement('button', { type: 'button', className: 'dsh-ws-del', style: delStyle, disabled: !deleteEnabled || busy, onClick: () => doDelete(f.path) }, '删除'),
+              React.createElement('a', { href: '/api/dsh-uploads/workspace-file?path=' + encodeURIComponent(f.path) + '&download=1', download: f.name, style: btnStyle }, '下载'),
+              React.createElement('button', { type: 'button', style: btnStyle, disabled: busy, onClick: () => openPreview(f.path) }, '预览'),
             ),
           )),
         )),
@@ -1320,7 +1340,7 @@ window.__ModuleLoader__.load({
               editing && React.createElement('button', { type: 'button', style: btnStyle, disabled: busy, onClick: doSave }, savedFlash ? '已保存' : '保存'),
               React.createElement('button', { type: 'button', style: btnStyle, onClick: copyContent }, copied ? '已复制' : '复制全部'),
               (preview.url !== void 0 || preview.officeHtml !== void 0 || preview.mdHtml !== void 0) && preview.loading !== true && React.createElement('a', { href: '/api/dsh-uploads/workspace-file?path=' + encodeURIComponent(preview.path) + '&download=1', download: preview.name, style: { ...btnStyle, color: 'var(--dsw-alias-state-business-primary)' } }, '下载'),
-              (preview.url !== void 0 || preview.officeHtml !== void 0 || preview.mdHtml !== void 0) && preview.loading !== true && React.createElement('a', { href: '/api/dsh-uploads/workspace-preview?path=' + encodeURIComponent(preview.path), target: '_blank', rel: 'noopener noreferrer', style: { ...btnStyle, color: 'var(--dsw-alias-state-business-primary)' } }, '打开'),
+              (preview.url !== void 0 || preview.officeHtml !== void 0 || preview.mdHtml !== void 0) && preview.loading !== true && React.createElement('a', { href: preview.url !== void 0 ? preview.url : '/api/dsh-uploads/workspace-preview?path=' + encodeURIComponent(preview.path), target: '_blank', rel: 'noopener noreferrer', style: { ...btnStyle, color: 'var(--dsw-alias-state-business-primary)' } }, '打开'),
               React.createElement('button', { type: 'button', style: delStyle, disabled: busy, onClick: () => doDelete(preview.path) }, '删除'),
               React.createElement('button', { type: 'button', style: btnStyle, onClick: () => setMaximized((m) => !m) }, maximized ? '还原' : '放大'),
               React.createElement('button', { type: 'button', style: btnStyle, onClick: () => setPreview(null) }, '关闭'),
@@ -3014,6 +3034,259 @@ window.__ModuleLoader__.load({
       },
     }
 
+    // ===== dsh-long-plugins: 毛玻璃界面 (glass UI) =====
+    // 简洁方案：共用一张背景图铺满 body；左边栏 + 顶部各加一层半透明"罩"；
+    // 会话窗口(centerCol)做成磨砂玻璃悬浮卡片(backdrop-filter blur + 半透明背景)。
+    const GLASS_CSS = `
+      html[data-dsh-glass="on"] body { position: relative; }
+      /* 方案A：背景图铺满整页(含左栏/顶栏/底部，全透明透出)；仅会话滚动区做磨砂玻璃卡片。 */
+      /* 左栏内部容器(或其它用此变量的)也透明，让背景图透到左栏。只覆盖左栏专用变量，避免影响设置面板。 */
+      html[data-dsh-glass="on"] body {
+        --dsw-specific-sidebar-fill: transparent !important;
+      }
+      /* 左栏 / 顶栏 / 底部：完全透明，让 frame 背景图连成一张透出（不做罩/不做磨砂） */
+      html[data-dsh-glass="on"] #root [class*="sidebarCol"],
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_header"],
+      html[data-dsh-glass="on"] #root [class*="centerCol"],
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_root"] {
+        background-color: transparent !important;
+        backdrop-filter: none;
+        -webkit-backdrop-filter: none;
+      }
+      /* 左栏内部根 / 底部容器也用透明（这些是 DSH 当前版本哈希类名；背景图要透到左栏与底部） */
+      html[data-dsh-glass="on"] #root [class*="hHd-Xa_root"],
+      html[data-dsh-glass="on"] #root [class*="FJxK0a_root"] {
+        background-color: transparent !important;
+      }
+      /* 会话滚动区：磨砂玻璃悬浮卡片（居中收窄，不占满宽度，四周透背景图） */
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_scrollBody"] {
+        background-color: var(--dsh-glass-session-bg, rgba(26,35,50,0.45)) !important;
+        backdrop-filter: blur(var(--dsh-glass-blur, 16px));
+        -webkit-backdrop-filter: blur(var(--dsh-glass-blur, 16px));
+        border-radius: 16px;
+        overflow: auto;
+        margin: 0 auto !important;
+        /* 柔和阴影 + 边缘渐隐，让磨砂卡片边缘过渡自然（悬浮玻璃质感） */
+        box-shadow: 0 8px 40px rgba(0,0,0,0.28), 0 2px 12px rgba(0,0,0,0.18);
+      }
+      /* 滚动条：细、半透明、圆角，且左移贴在内容区（不占卡片最右边缘），让右边缘过渡柔和 */
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_scrollBody"]::-webkit-scrollbar { width: 8px; }
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_scrollBody"]::-webkit-scrollbar-track { background: transparent; }
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_scrollBody"]::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.35); border-radius: 8px; }
+      html[data-dsh-glass="on"] #root [class*="wSkVaW_scrollBody"]::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.5); }
+      /* 底部输入卡片：深色半透明磨砂（参考图：深色玻璃卡片 + 白字，与背景区分开） */
+      html[data-dsh-glass="on"] #root [class*="uV2eYG_card"] {
+        background-color: var(--dsh-glass-input-bg, rgba(26,35,50,0.6)) !important;
+        backdrop-filter: blur(var(--dsh-glass-blur, 16px));
+        -webkit-backdrop-filter: blur(var(--dsh-glass-blur, 16px));
+      }
+      
+      html[data-dsh-glass="off"] #root [class*="sidebarCol"],
+      html[data-dsh-glass="off"] #root [class*="header"],
+      html[data-dsh-glass="off"] #root [class*="centerCol"],
+      html[data-dsh-glass="off"] #root [class*="wSkVaW_root"],
+      html[data-dsh-glass="off"] #root [class*="wSkVaW_scrollBody"],
+      html[data-dsh-glass="off"] #root [class*="uV2eYG_card"] { background-color: transparent !important; backdrop-filter: none; }
+      .dsh-glass-section{display:flex;flex-direction:column;gap:16px;min-width:0;padding:4px 2px 24px;color:var(--dsw-alias-label-primary)}
+      .dsh-glass-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
+      .dsh-glass-head h2{margin:0;font-size:20px;line-height:28px}
+      .dsh-glass-head p{margin:4px 0 0;color:var(--dsw-alias-label-secondary);font-size:13px;line-height:20px}
+      .dsh-glass-switch{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--dsw-alias-label-secondary);cursor:pointer;white-space:nowrap;user-select:none}
+      .dsh-glass-switch input{width:34px;height:20px;accent-color:var(--dsw-alias-state-business-primary);cursor:pointer}
+      .dsh-glass-card{display:grid;gap:12px;padding:14px 16px;border:1px solid var(--dsw-alias-border-l2);border-radius:10px;background:var(--dsw-specific-input-major)}
+      .dsh-glass-zone-title{font-size:14px;font-weight:600;color:var(--dsw-alias-label-primary)}
+      .dsh-glass-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
+      .dsh-glass-row label{font-size:13px;color:var(--dsw-alias-label-primary);flex:none}
+      .dsh-glass-range{flex:1;min-width:160px;max-width:320px;accent-color:var(--dsw-alias-state-business-primary)}
+      .dsh-glass-val{flex:none;font-size:12px;color:var(--dsw-alias-label-secondary);min-width:56px;text-align:right;font-variant-numeric:tabular-nums}
+      .dsh-glass-swatches{display:flex;gap:8px;flex-wrap:wrap}
+      .dsh-glass-swatch{width:26px;height:26px;border-radius:8px;border:1px solid var(--dsw-alias-border-l2);cursor:pointer;padding:0;transition:transform .12s}
+      .dsh-glass-swatch:hover{transform:scale(1.12)}
+      .dsh-glass-swatch.on{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:2px}
+      .dsh-glass-colorpicker{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;background:transparent;cursor:pointer}
+      .dsh-glass-colorpicker input[type=color]{width:30px;height:24px;border:none;background:none;padding:0;cursor:pointer}
+      .dsh-glass-bg{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
+      .dsh-glass-file{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px;cursor:pointer}
+      .dsh-glass-file input{display:none}
+      .dsh-glass-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end}
+      .dsh-glass-actions button{padding:7px 16px;border:1px solid var(--dsw-alias-border-l2);border-radius:8px;background:transparent;color:var(--dsw-alias-label-primary);font:inherit;font-size:13px;cursor:pointer}
+      .dsh-glass-actions .primary{background:var(--dsw-alias-state-business-primary);border-color:var(--dsw-alias-state-business-primary);color:#fff}
+      .dsh-glass-actions button:disabled{opacity:.55;cursor:not-allowed}
+      .dsh-glass-error{padding:10px 12px;border-radius:8px;background:var(--dsw-alias-interactive-bg-hover-danger);color:var(--dsw-alias-state-error-primary);font-size:12px}
+      .dsh-glass-note{margin:0;font-size:12px;color:var(--dsw-alias-label-tertiary)}
+    `
+    const GLASS_SWATCHES = ['#0f1420', '#14161a', '#1a2530', '#26324d', '#153a3a', '#3b2a4a', '#4a1f1f', '#2d3748']
+    const glassText = (e) => (e && e.message) ? e.message : String(e)
+    function glassImageInput(value, onChange) {
+      return React.createElement('label', { className: 'dsh-glass-file' },
+        React.createElement('span', null, '上传背景图'),
+        React.createElement('input', { type: 'file', accept: 'image/png,image/jpeg,image/webp,image/gif', onChange: (e) => {
+          const f = e.target.files && e.target.files[0]
+          if (!f) return
+          const reader = new FileReader()
+          reader.onload = () => onChange(String(reader.result || ''))
+          reader.readAsDataURL(f)
+        } }),
+        value ? React.createElement('span', { style: { width: 22, height: 22, borderRadius: 4, backgroundImage: 'url(' + value + ')', backgroundSize: 'cover', display: 'inline-block' } }) : null,
+      )
+    }
+    // 会话区/输入区共用设置卡：罩色 + 罩强度
+    const GlassZoneCard = ({ title, zone, onChange }) => {
+      const z = zone || { color: '#1a2332', mask: 0.45 }
+      const setPatch = (p) => onChange({ ...z, ...p })
+      return React.createElement('div', { className: 'dsh-glass-card' },
+        React.createElement('div', { className: 'dsh-glass-zone-title' }, title),
+        React.createElement('div', { className: 'dsh-glass-row' },
+          React.createElement('label', null, title + ' 罩色'),
+          React.createElement('div', { className: 'dsh-glass-swatches' },
+            GLASS_SWATCHES.map((c) => React.createElement('button', { key: c, type: 'button', className: 'dsh-glass-swatch' + ((z.color || '#1a2332') === c ? ' on' : ''), style: { background: c }, 'aria-label': '颜色 ' + c, onClick: () => setPatch({ color: c }) })),
+          ),
+          React.createElement('label', { className: 'dsh-glass-colorpicker' }, '色盘', React.createElement('input', { type: 'color', value: z.color || '#1a2332', onChange: (e) => setPatch({ color: e.target.value }) })),
+        ),
+        React.createElement('div', { className: 'dsh-glass-row' },
+          React.createElement('label', null, title + ' 罩强度'),
+          React.createElement('input', { type: 'range', className: 'dsh-glass-range', min: 0, max: 0.95, step: 0.01, value: z.mask ?? 0.45, onChange: (e) => setPatch({ mask: Number(e.target.value) }) }),
+          React.createElement('span', { className: 'dsh-glass-val' }, `${Math.round((Number(z.mask ?? 0.45)) * 100)}%`),
+        ),
+      )
+    }
+    const GlassSettingsSection = () => {
+      const [state, setState] = React.useState({ loading: true, saving: false, error: '', cfg: null, bgImage: '' })
+      const load = React.useCallback(async () => {
+        setState((s) => ({ ...s, loading: true, error: '' }))
+        try {
+          const r = await fetch('/api/dsh-uploads/glass-config', { cache: 'no-store' })
+          const b = await r.json()
+          if (!r.ok) throw new Error(b.error || ('HTTP ' + r.status))
+          setState((s) => ({ ...s, loading: false, cfg: b.cfg, bgImage: b.bgImage || '' }))
+        } catch (e) { setState((s) => ({ ...s, loading: false, error: glassText(e) })) }
+      }, [])
+      React.useEffect(() => { load(); }, [load])
+      const patch = React.useCallback((p) => setState((s) => ({ ...s, cfg: { ...(s.cfg || {}), ...p } })), [])
+      const patchZone = React.useCallback((key, p) => setState((s) => ({ ...s, cfg: { ...(s.cfg || {}), [key]: p } })), [])
+      const save = React.useCallback(async () => {
+        setState((s) => ({ ...s, saving: true, error: '' }))
+        try {
+          const cfg = state.cfg || {}
+          const payload = {
+            enabled: !!cfg.enabled, blur: Number(cfg.blur) || 0,
+            bgImage: state.bgImage || cfg.bgImage || '',
+            zone: {
+              session: { color: (cfg.session && cfg.session.color) || '#1a2332', mask: Number((cfg.session && cfg.session.mask)) || 0.45 },
+              input: { color: (cfg.input && cfg.input.color) || '#1a2332', mask: Number((cfg.input && cfg.input.mask)) || 0.6 },
+            },
+          }
+          const r = await fetch('/api/dsh-uploads/glass-config', { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(payload) })
+          const b = await r.json()
+          if (!r.ok) throw new Error(b.error || ('HTTP ' + r.status))
+          window.__dshGlassApply && window.__dshGlassApply(payload)
+          setState((s) => ({ ...s, saving: false, cfg: { ...(s.cfg || {}), ...payload }, bgImage: payload.bgImage, error: '' }))
+        } catch (e) { setState((s) => ({ ...s, saving: false, error: glassText(e) })) }
+      }, [state])
+      const cfg = state.cfg || {}
+      if (state.loading) return React.createElement('div', { className: 'dsh-glass-section' }, '加载中…')
+      return React.createElement('div', { className: 'dsh-glass-section' },
+        React.createElement('div', { className: 'dsh-glass-head' },
+          React.createElement('div', null, React.createElement('h2', null, '毛玻璃界面'), React.createElement('p', null, '共用一张背景图铺满整页，仅消息滚动区做居中磨砂玻璃卡片，其余区域透出背景图。')),
+          React.createElement('label', { className: 'dsh-glass-switch' }, React.createElement('input', { type: 'checkbox', checked: !!cfg.enabled, onChange: (e) => patch({ enabled: e.target.checked }) }), cfg.enabled ? '已开启' : '已关闭'),
+        ),
+        state.error ? React.createElement('div', { className: 'dsh-glass-error' }, state.error) : null,
+        React.createElement('div', { className: 'dsh-glass-card' },
+          React.createElement('div', { className: 'dsh-glass-row' },
+            React.createElement('label', null, '磨砂模糊强度'),
+            React.createElement('input', { type: 'range', className: 'dsh-glass-range', min: 0, max: 80, value: cfg.blur ?? 20, onChange: (e) => patch({ blur: Number(e.target.value) }) }),
+            React.createElement('span', { className: 'dsh-glass-val' }, `${Number(cfg.blur ?? 20)} px`),
+          ),
+          React.createElement(GlassZoneCard, { title: '会话区', zone: cfg.session, onChange: (p) => patchZone('session', p) }),
+          React.createElement(GlassZoneCard, { title: '输入区', zone: cfg.input, onChange: (p) => patchZone('input', p) }),
+          React.createElement('div', { className: 'dsh-glass-row' },
+            React.createElement('label', null, '共用背景图'),
+            React.createElement('div', { className: 'dsh-glass-bg' }, glassImageInput(state.bgImage, (v) => setState((s) => ({ ...s, bgImage: v })))),
+          ),
+          React.createElement('p', { className: 'dsh-glass-note' }, '提示：背景图铺满整页；仅消息滚动区做磨砂玻璃卡片；输入卡片与其余区域透出背景。'),
+          React.createElement('div', { className: 'dsh-glass-actions' },
+            React.createElement('button', { type: 'button', onClick: load }, '重置'),
+            React.createElement('button', { type: 'button', className: 'primary', disabled: state.saving, onClick: save }, state.saving ? '保存中…' : '保存生效'),
+          ),
+        ),
+      )
+    }
+    const glassPlugin = {
+      inject: ['slots'],
+      apply(ctx) {
+        const hexToRgb = (hex) => { const m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(String(hex || '')); return m ? `${parseInt(m[1],16)},${parseInt(m[2],16)},${parseInt(m[3],16)}` : '15,20,32' }
+        ctx.effect(() => {
+          const style = document.createElement('style')
+          style.dataset.plugin = 'dsh-long-plugins'
+          style.dataset.pluginCss = 'dsh-long-plugins/glass'
+          style.textContent = GLASS_CSS
+          document.head.appendChild(style)
+          return () => style.remove()
+        }, 'dsh-long-plugins: glass styles')
+        ctx.effect(() => {
+          const root = document.documentElement
+          
+          // 磨砂卡片与底部输入卡片对齐：宽度取输入卡片宽度，translateX 补偿使左右边界对齐输入卡。
+          const centerScroll = () => {
+            const el = document.querySelector('#root [class*="wSkVaW_scrollBody"]')
+            if (!el) return
+            const card = document.querySelector('#root [class*="uV2eYG_card"]')
+            const r = el.getBoundingClientRect()
+            const target = card ? card.getBoundingClientRect() : null
+            // 不改磨砂卡片宽度（保留默认 width:min() 原始宽度），仅水平居中到输入卡片中心。
+            const diff = (target ? (target.left + target.right) / 2 : window.innerWidth / 2) - (r.left + r.right) / 2
+            el.style.transform = 'translateX(' + Math.round(diff) + 'px)'
+          }
+          window.addEventListener('resize', centerScroll)
+          window.__dshGlassCenter = centerScroll
+          // win 风格文字：给左栏/顶栏内的可见文字元素加白色+深色描边；跳过弹窗(modal/overlay/dialog/settings/panel)内元素。
+
+          window.__dshGlassApply = (cfg) => {
+            const c = cfg || {}
+            root.setAttribute('data-dsh-glass', c.enabled ? 'on' : 'off')
+            // ... 后续 applier 逻辑在下方
+            const blur = Number(c.blur) || 16
+            root.style.setProperty('--dsh-glass-blur', blur + 'px')
+            const zs = (c.zone && c.zone.session) || { color: '#1a2332', mask: 0.45 }
+            const zi = (c.zone && c.zone.input) || { color: '#1a2332', mask: 0.6 }
+            root.style.setProperty('--dsh-glass-session-bg', `rgba(${hexToRgb(zs.color)},${Math.min(0.95, Math.max(0, Number(zs.mask) || 0.45))})`)
+            root.style.setProperty('--dsh-glass-input-bg', `rgba(${hexToRgb(zi.color)},${Math.min(0.95, Math.max(0, Number(zi.mask) || 0.6))})`)
+
+            const body = document.body
+            const frame = document.querySelector('#root > div > div') || document.querySelector('#root > div')
+            const applyBg = (el) => {
+              if (!el) return
+              if (c.enabled && c.bgImage) {
+                el.style.backgroundImage = `url('${c.bgImage}')`
+                el.style.backgroundSize = 'cover'
+                el.style.backgroundPosition = 'center'
+                el.style.backgroundRepeat = 'no-repeat'
+              } else {
+                el.style.backgroundImage = 'none'
+                el.style.backgroundSize = ''
+                el.style.backgroundPosition = ''
+                el.style.backgroundRepeat = ''
+              }
+            }
+            applyBg(body)
+            if (frame) { frame.style.backgroundColor = 'transparent'; applyBg(frame) }
+            centerScroll()
+          }
+          return () => {
+            window.__dshGlassApply = undefined
+            window.removeEventListener('resize', centerScroll)
+            window.__dshGlassCenter = undefined
+          }
+        }, 'dsh-long-plugins: glass applier')
+        ctx.slots.inject('settings.section', () => ctx.slots.register({ name: 'settings.section', id: 'glass-ui', order: 40, label: '毛玻璃界面' }, GlassSettingsSection))
+        ctx.effect(() => {
+          fetch('/api/dsh-uploads/glass-config', { cache: 'no-store' }).then((r) => r.json()).then((b) => {
+            if (b && b.cfg) { window.__dshGlassApply && window.__dshGlassApply({ enabled: b.cfg.enabled, blur: b.cfg.blur, mask: b.cfg.mask, color: b.cfg.color, bgImage: b.bgImage }) }
+          }).catch(() => {})
+        }, 'dsh-long-plugins: glass boot')
+      },
+    }
+
     const inject = Array.from(new Set([
       ...uploadPlugin.inject,
       ...skillDocsPlugin.inject,
@@ -3021,6 +3294,7 @@ window.__ModuleLoader__.load({
       ...mobilePlugin.inject,
       ...workspaceFilesPlugin.inject,
       ...turnRulerPlugin.inject,
+      ...glassPlugin.inject,
     ]))
 
     function apply(ctx) {
@@ -3037,6 +3311,7 @@ window.__ModuleLoader__.load({
       safeApply('mobile-hamburger', (c) => mobilePlugin.apply(c))
       safeApply('workspace-files', (c) => workspaceFilesPlugin.apply(c))
       safeApply('turn-ruler', (c) => turnRulerPlugin.apply(c))
+      safeApply('glass', (c) => glassPlugin.apply(c))
     }
 
     exports.apply = apply