前言¶
DeepSeek Harness（DSH）的设置面板默认固定在 800×800，永远居中显示。对于需要频繁调试配置、查看日志或切换参数的开发者来说，这种固定布局会占据大量屏幕空间，拖动或调整窗口大小时也难以把面板拖到视野外或留出更多操作区。插件 dsh-settings-drag 为设置面板增加了普通窗口一样的拖拽与缩放能力，让配置过程更灵活。
插件定位¶
这是一个纯前端 UI 扩展，为 DSH Web 界面的设置面板提供拖动与缩放功能。由维护者 yangzhenyu0817 开发，版本 0.4.0，采用 MIT 许可证。
核心功能¶
拖动¶
- 按住左侧导航栏空白处或顶部标题条，即可把面板拖到窗口内任意位置。
- 允许面板部分探出屏幕边缘（右侧、底部、顶部可大幅探出），但左侧至少保留 160px（导航栏）、顶部至少 96px（标题带），右侧和底部至少保留 96px 在屏内，防止面板被拖出屏幕无法找回。
- 面板上的按钮、输入框等交互元素正常响应点击，不会因拖动被拦截。
缩放¶
- 右下角三角握角支持双轴缩放（宽度和高度同时调整）。
- 右边缘中段控制宽度。
- 底边缘中段控制高度。
- 最小尺寸 480×360，最大尺寸为视口尺寸减 48px，左上角锚定不漂移。
其他交互¶
- 双击导航栏或标题条，面板会动画归中并恢复默认尺寸，同时清空之前的位置与尺寸记忆。
- 位置与尺寸记忆保存在浏览器的
localStorage中，刷新页面或重新打开面板不丢失；窗口尺寸变化时会自动重新约束。
安装与启用¶
安装命令：
dsh plugin --profile desktop add dsh-settings-drag
执行后重启桌面端（或重启 dsh web 服务），刷新页面即可生效。
兼容性与注意事项¶
- 要求 DSH 版本
>=0.2.0-rc.2 <0.3.0-0，已在 0.2.1-rc.2 上验证。 - 插件不读取文件、不联网、不涉及凭据，属于纯前端 UI 调整，市场能力扫描应为空。
- 插件依赖设置面板的稳定结构属性
data-shortcut-modal="settings"；若 DSH 前端结构发生重大变更，插件会静默退化为“不生效”，不会破坏应用。 - 卸载命令：
dsh plugin --profile desktop remove dsh-settings-drag
浏览器侧残留的 localStorage 键可手动清理，键名为 dsh-settings-drag-offset-v1 和 dsh-settings-drag-size-v1。
适用场景¶
- 需要同时查看 DSH 设置面板与外部日志、文档或代码编辑器的开发者。
- 屏幕空间有限、希望把设置面板拖到屏幕边缘或角落以最大化工作区的场景。
- 经常调整配置参数、需要反复切换面板位置与尺寸的用户。
技术实现简述¶
- 服务端半区（
lib/index.js）向webserver/index-inject注入一行内联<script>，并在GET /dsh-settings-drag/settings-drag.js路由上按 mtime 缓存读取客户端脚本。 - 客户端半区（
assets/settings-drag.js）纯 DOM 脚本，无依赖。通过div[role=dialog][data-shortcut-modal="settings"]定位面板，<nav>直接子元素和内容第一个子元素作为抓取区。缩放抓手作为position:fixed元素挂在body上，跟随面板边缘移动，不进入 React 管辖的容器，避免冲突。
总结¶
dsh-settings-drag 通过简单的 UI 交互增强，让 DSH 设置面板摆脱固定居中的限制，支持拖动与缩放，并保留位置与尺寸记忆。适合需要在复杂工作流中频繁调整配置的开发者使用。插件目录：https://www.skillhub.cn/plugins/yangzhenyu0817/dsh-settings-drag，源码仓库：https://github.com/yangzhenyu0817/dsh-settings-drag。
