Openclaw Control Center
OpenClaw 可视化控制中心。当用户需要查看系统状态、打开控制台、监控 AI 运行指标、管理定时任务/会话/技能,或需要可视化运营面板时触发。触发词:打开控制中心 / 控制中心 / dashboard / 系统总览 / 系统状态。 Skill: Openclaw Control Center Owner: qinxiao607 Summary: OpenClaw 可视化控制中心。当用户需要查看系统状态、打开控制台、监控 AI 运行指标、管理定时任务/会话/技能,或需要可视化运营面板时触发。触发词:打开控制中心 / 控制中心 / dashboard / 系统总览 / 系统状态。 Tags: latest:1.0.0 Version history: v1.0.0 | 2026-04-05T02:03:36.931Z | auto openclaw-control-center 1.0.0 - 初始发布:支持 OpenClaw 可视化控制中心,双模式仪表盘(简洁/专业)。 - 简洁模式面向普通用户:实时展示系统状态、AI 资源消耗、会话/任务信息,配通俗解释。 - 专业模式面向技术用户:完整数据表、架构图、API 列表等,详见文档。 - 实时采集系统状态数据,
Rank
62
Safety
84
Downloads
2.6k
Updated
Oct 9, 2026
Version
1.0.0
Source
CLAWHUB
About
What it does, and when to use it.
Capability contract not published. No trust telemetry is available yet. 2.6K downloads reported by the source. Last updated 10/9/2026.
Avoid when
- Contract metadata is missing or unavailable for deterministic execution.
Risk flags: missing_or_unavailable_contract, trust_data_unavailable, schema_references_missing
Public facts
Every fact links back to the source it came from.
- Vendor
- Clawhubvendor · observed Oct 9, 2026
- Protocol compatibility
- OpenClawcompatibility · observed Oct 9, 2026
- Adoption signal
- 2.6K downloadsadoption · observed Oct 9, 2026
- Latest release
- 1.0.0release · observed Apr 5, 2026
- Handshake status
- UNKNOWNsecurity
Install and run
Setup complexity: low.
clawhub skill install s175w2hvexd7jcy3t332dey351849vrt:openclaw-control-center- Setup complexity is LOW. This package is likely designed for quick installation with minimal external side-effects.
- Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.
Contract: missing
curl -s "https://www.xpersona.co/api/v1/agents/clawhub-qinxiao607-openclaw-control-center/snapshot"
Documentation
CLAWHUB
21,666 characters of source documentation, loaded on request.
Extracted files
5 files captured from the source.
SKILL.md
---
name: openclaw-control-center
description: OpenClaw 可视化控制中心。当用户需要查看系统状态、打开控制台、监控 AI 运行指标、管理定时任务/会话/技能,或需要可视化运营面板时触发。触发词:打开控制中心 / 控制中心 / dashboard / 系统总览 / 系统状态。
---
# openclaw-control-center
双模式可视化仪表盘 — 让 AI 的运行状态一目了然。
## 双模式说明
| 模式 | 触发 | 输出 |
|------|------|------|
| 🌿 简洁模式(默认) | 打开控制中心 | 大数字 + 说人话 + 说明提示 |
| 📊 专业模式 | 控制中心 --pro | 完整表格 + 架构图 + API 端点 |
两种模式均为**实时数据**,每次生成都从系统采集最新状态。
## 简洁模式 — 面向普通人
**核心三问,每问配通俗说明:**
- 🌟 **系统是否正常?** → ✓/⚠️/✕ + 状态列表
- 🧠 **AI 用了多少?** → Token 消耗 + 上下文进度条
- 👥 **谁在干活?** → 工作中/待命/空闲 三态
次要信息:定时任务 / 记忆系统 / 插件 / 安全设置(均附带通俗说明栏)
> 📌 Token 通俗解释:AI 的"阅读量",越高 = 响应越慢 + 费用越高
> 📌 工作中=正在处理任务;待命=有任务但还没开始;空闲=没有活动
## 专业模式 — 面向技术人员
完整数据面板,详见 `references/pro-mode.md`:
- Token 7天趋势柱状图
- 会话管理完整表格(含 Session Key / Token / 通道)
- Cron Jobs 详细参数(含 Job ID / Payload / Timeout / Delivery)
- 插件表格(含类型 / 状态 / 说明 / 路径)
- 消息渠道(WebSocket 地址)
- 安全配置完整表格(5项默认安全策略)
- Gateway API 端点一览
## 执行流程
### Step 0 — 读取风格记忆
```
read("references/style-memory.md") → 用户偏好 + 展示规范 + 禁忌
read("references/dashboard-rules.md") → 预警阈值 + 模式规则 + 数据采集规则
```
**必须遵守的风格规则:**
- 简洁 > 详细,说人话 > 术语(详见 `references/style-memory.md`)
- 上下文 >70% 黄色预警,>90% 红色闪烁(详见 `references/dashboard-rules.md`)
- 每个技术术语必须配通俗解释
### Step 1 — 采集实时数据(并行)
```
session_status() → 系统 / 模型 / Token / 上下文
sessions_list() → 全部会话
cron(action="list") → 定时任务详情
gateway(action="config.get") → Gateway / 插件 / 渠道
```
### Step 2 — 生成 HTML 仪表盘
生成 `~/.qclaw/workspace/control-center.html`,包含:
- 实时时间戳(采集时间)
- 简洁 + 专业两个模式(内置切换按钮)
- 所有数据以卡片/表格形式展示
- **风格记忆应用**:
- 上下文压力根据阈值自动变色(绿/黄/红)
- >90% 时进度条脉冲动画 + 红色警告块
- 深色主题、圆角卡片、微光效果
- 通俗解释提示框(hint)
- 模式偏好 localStorage 持久化
- 深夜时段(23:00-07:00)降低动画频率
### Step 3 — 浏览器打开
```
Start-Process control-center.html
```
默认显示简洁模式,用户可随时点击按钮切换。
## 参考文件
| 文件 | 用途 |
|------|------|
| `references/style-memory.md` | 用户偏好 + 写作风格 + 视觉规范 + 禁忌 |
| `references/dashboard-rules.md` | 展示规则 + 预警阈值 + 模式切换逻辑 |
| `references/pro-mode.md` | 专业模式完整数据定义 |
| `references/deployment.md` | 全功能版部署指南 |
## 全功能版(进阶用户)
如需 React + WebSocket 实时推送版,参看 `references/deployment.md`。
## 依赖
- OpenClaw 2026.3+(内置 session_status / sessions_list / cron / gateway / browser / exec)
- 浏览器(Chrome / Edge / Firefox)
- 无需 npm / Node.js / git(纯静态)
## 错误处理
- 工具调用失败:记录错误,继续生成其余部分
- 缺失数据:显示 "—" 而非报错
- 超时(>5s):标记 "⚠️ 获取超时"
- 无浏览器权限:提示用户手动打开 HTML 文件README.md
# 🦞 openclaw-control-center > **OpenClaw 可视化控制中心** — 让你对 AI 的运行状态一目了然 一个专为 OpenClaw 用户设计的双模式可视化仪表盘,内置**简洁模式**(普通人也能看懂)和**专业模式**(完整技术数据),无需安装额外软件,浏览器直接打开。 --- ## ✨ 功能特色 | 特性 | 说明 | |------|------| | 🌿 简洁模式 | 大数字 + 通俗语言 + 说明提示,非技术人员也能快速看懂 | | 📊 专业模式 | 完整表格 + 架构图 + API 端点,适合技术人员深度排查 | | 🔄 一键切换 | 页面顶部按钮,实时切换两个模式 | | 📐 原创设计 | 来自 github.com/TianyiDataScience/openclaw-control-center 理念,但独立实现的静态版 | --- ## 📸 界面预览 ### 简洁模式(日常查看) - 🟢 **系统是否正常** — 一句话回答 - 🧠 **AI 用了多少** — Token 消耗 + 上下文压力 - 👥 **谁在干活** — 工作中/待命/空闲 三态 - 🧩 插件状态 · 🔐 安全设置 · 🧠 记忆系统 · ⏰ 定时任务 - 每个模块附带通俗语言说明 ### 专业模式(技术详情) - 🚀 系统核心指标(Agent / Node.js / Shell / Build) - 🧠 模型与 Token 详细数据(7天趋势柱状图) - 💻 会话管理(全部活跃会话 Key / 通道 / 消息数) - ⏰ Cron Jobs 表格(含 Job ID / Payload / Timeout) - 🧩 插件表格(含类型 / 状态 / 说明) - 🔗 OpenClaw 三层架构图(Tools → Skills → Plugins) - 🔐 安全配置表格(含当前值 + 说明) - 🔌 Gateway API 端点一览 - ⚡ Lobster 工作流引擎图 --- ## 🚀 快速使用 ### 方式一:AI 自动生成(推荐) 告诉你的 OpenClaw: ``` 打开控制中心 ``` AI 会自动采集实时数据,生成 HTML 仪表盘并打开浏览器。 ### 方式二:手动打开 直接在浏览器地址栏输入: ``` file:///C:/Users/你的用户名/.qclaw/workspace/control-center.html ``` ### 方式三:部署全功能版(推荐进阶用户) 真实 Control Center(React + WebSocket 实时推送): ```bash git clone https://github.com/TianyiDataScience/openclaw-control-center.git cd openclaw-control-center npm install cp .env.example .env npm run build npm run dev:ui # 访问 http://127.0.0.1:4310/?section=overview&lang=zh ``` --- ## 🛠️ 技能触发方式 | 触发词 | 行为 | |--------|------| | `打开控制中心` | 生成简洁模式仪表盘 | | `控制中心 --pro` | 生成专业模式仪表盘 | | `控制中心 --html` | 生成 HTML 并打开浏览器 | | `系统状态` | 简洁模式系统状态 | | `dashboard` | 同"打开控制中心" | --- ## 📁 文件结构 ``` ~/.qclaw/workspace/ ├── skills/ │ └── openclaw-control-center/ │ ├── SKILL.md ← 技能定义文件 │ └── README.md ← 本说明文件 └── control-center.html ← 生成的仪表盘 ``` --- ## 🔧 依赖 - OpenClaw 2026.3+(内置 browser / session_status / cron / gateway 等工具) - 浏览器(Chrome / Edge / Firefox 均支持) - 无需额外 npm / Node.js(静态版) --- ## 🌟 与真实 Control Center 的关系 本技能灵感来源: - **GitHub**: https://github.com/TianyiDataScience/openclaw-control-center - **Stars**: ~1.1k ⭐ - **技术栈**: TypeScript + React + WebSocket 本技能为**静态实现版**,优势: - ✅ 无需安装,打开即用 - ✅ 无需 npm / Node.js / git - ✅ 数据实时采集(每次打开都是最新状态) - ✅ 简洁/专业双模式按需切换 --- ## 📝 发布说明 - **版本**: v1.0 - **日期**: 2026-03-22 - **适用**: OpenClaw 用户,尤其是需要可视化监控的非技术用户 - **协议**: OpenClaw AgentSkills 规范 - **作者**: QClaw 自主创建(基于开源社区灵感)
_meta.json
{
"ownerId": "kn7eafhdenjdcpvj477q6qma0983f2t1",
"slug": "openclaw-control-center",
"version": "1.0.0",
"publishedAt": 1775354616931
}references/dashboard-rules.md
# 仪表盘展示规则 — Dashboard Rules
> 定义简洁模式和专业模式的具体展示规则、预警阈值和自适应逻辑。
## 简洁模式规范
### 展示优先级
**第一屏(必须看到):**
1. 🌟 系统健康大字(OK / ⚠️ / ✕)
2. 🧠 Token 大数字 + 进度条 + 通俗解释
3. 👥 活跃任务数 + 状态列表
**第二屏(向下滚动):**
4. ⚠️ 失败任务 / 预警信息
5. ⏰ 定时任务(仅名称 + 下次执行时间)
6. 🧠 记忆系统状态
7. 🧩 插件(仅图标 + 名称 + 状态标签)
8. 📋 技能(标签云)
9. 🔒 安全设置(图标 + 开/关)
10. ⚡ 快捷操作按钮
### 说人话规范
- 每个技术指标右侧或下方配 `hint` 框
- 格式:`💡 提示:[术语] 就是 [通俗解释]`
- 不超过 1 行,超过则精简
### 简洁模式禁止
- ❌ 禁止展示 Job ID、Session Key、Build Hash
- ❌ 禁止展示原始 Cron 表达式(转换为"每天 08:00"格式)
- ❌ 禁止展示 API 端点、WebSocket 地址
- ❌ 禁止展示完整配置表格(只显示状态标签)
## 专业模式规范
### 何时展示完整数据
| 数据 | 简洁模式 | 专业模式 |
|------|---------|---------|
| 系统核心指标 | 仅 OK/⚠️/✕ | 完整 8 项参数表格 |
| Token | 大数字 + 百分比 | 趋势图 + 详细参数 + 历史数据 |
| 会话列表 | 仅活跃数 | 完整表格含 Session Key |
| Cron 详情 | 名称 + 时间 | 完整参数含 Job ID + Payload |
| 插件 | 图标 + 状态 | 完整表格含类型 + 说明 + 路径 |
| 安全配置 | 开/关标签 | 完整对比表格(默认值 vs 当前) |
| 架构图 | 不展示 | 三层架构图 + 工作流引擎 |
| API 端点 | 不展示 | 完整 REST + WebSocket 列表 |
### 专业模式格式
- 表格必须有 hover 高亮
- 表头 10px 大写 + 字间距
- KV 键值对用于展示非结构化参数
- 架构图使用 flexbox 布局 + 箭头连接
## 上下文预警阈值
### 颜色判定规则
| 使用率 | 状态 | 颜色 | 进度条样式 | 建议文案 |
|--------|------|------|-----------|---------|
| < 50% | 健康 | 绿色 `--green` | 绿色渐变 | 正常运行 |
| 50% - 70% | 注意 | 黄色 `--yellow` | 黄色渐变 | 开始偏高,可考虑重置 |
| 70% - 90% | 预警 | 橙色(黄色) | 黄色渐变 + 闪烁 | ⚠️ 偏高,建议尽快重置 |
| > 90% | 危险 | 红色 `--red` | 红色渐变 + 闪烁 | 🔴 即将爆满,必须重置会话 |
### HTML 实现规则
```css
/* >90% 时添加脉冲动画 */
.prog-fill.r.pulse {
animation: pulse-red 1s infinite;
}
@keyframes pulse-red {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
```
### 预警行为
- **> 70%**:在 Token 卡片下方显示黄色警告块
- **> 90%**:在 Token 卡片下方显示红色警告块 + 自动弹出重置按钮
- **失败任务**:任何连续失败 >1 次的任务显示红色警告
- **安全项关闭**:危险操作审批关闭时显示黄色提示
## 模式切换规则
### 默认行为
- 首次打开 → 简洁模式
- 用户上次用了专业模式 → 记住,下次默认专业模式
- 切换后保存到 `localStorage`
### 自适应逻辑
```
if (user_last_mode === 'pro') → 默认专业模式
if (context > 85%) → 自动提示"建议重置会话"
if (failed_jobs > 0) → 简洁模式突出显示失败警告
if (hour >= 23 || hour < 7) → 降低动画频率(减少视觉刺激)
```
## 数据采集规则
### 并行采集(Step 1)
```
session_status() → 系统 / 模型 / Token / 上下文
sessions_list() → 全部会话
cron(action="list") → 定时任务
gateway(action="config.get") → Gateway / 插件 / 渠道
```
### 容错规则
- 单个工具失败 → 记录错误,继续生成其余部分
- 超时 >5s → 标记 "⚠️ 获取超时",不阻塞
- 缺失数据 → 显示 "—" 而非报错
- 全部失败 → 生成"系统离线"静态页面
## 生成规则
### HTML 结构
```
控制台
├── 头部(标题 + 实时时间 + 运行状态灯)
├── 模式切换按钮
├── 简洁模式 #mode-s
│ ├── 三大主卡(系统 / Token / 任务)
│ ├── 次要信息 2x2 网格
│ ├── 技能标签云
│ └── 快捷操作
└── 专业模式 #mode-p
├── 引导条(模式说明)
├── 系统核心指标(8项网格)
├── 模型与 Token(趋势图)
├── Gateway 配置
├── Cron 表格 + 详情
├── 会话管理表格
├── 插件表格
├── 记忆系统
├── 架构图
├── 安全配置
├── API 端点
└── 快捷操作
```
### CSS 变量约定
```css
:root {
--bg: #0a0f1a; /* 页面背景 */
--card: #111827; /* 卡片背景 */
--border: #1c2e44; /* 边框 */
--text: #c8d8e8; /* 主文本 */
--muted: #5a7a94; /* 次要文本 */
--accent: #00d4aa; /* 品牌色 */
--green: #22c55e; /* 健康 */
--yellow: #f5c518; /* 注意 */
--red: #f87171; /* 危险 */
--purple: #a78bfa; /* AI/认知 */
--cyan: #00c9ff; references/deployment.md
# 全功能版 Control Center 部署指南 > 真实 Control Center 项目(React + TypeScript + WebSocket),适合需要团队协作、多人查看、实时推送的高级用户。 ## 项目信息 | 项目 | 信息 | |------|------| | GitHub | github.com/TianyiDataScience/openclaw-control-center | | 技术栈 | TypeScript + React + WebSocket | | 端口 | 4310 | | 语言 | 双语(中/英) | ## 环境要求 - Node.js 22+ - npm 或 yarn - git(用于 clone) - OpenClaw Gateway 可连接 ## 部署步骤(5分钟) ### 方式一:手动部署 ```bash # 1. 克隆项目 git clone https://github.com/TianyiDataScience/openclaw-control-center.git cd openclaw-control-center # 2. 安装依赖 npm install # 3. 配置环境 cp .env.example .env # 4. 构建 npm run build npm run test npm run smoke:ui # 5. 启动 npm run dev:ui ``` Windows 推荐: ```bash npm run dev:ui ``` ### 方式二:让 AI 自动部署(推荐) 将以下指令粘贴给 OpenClaw: ``` 帮我 clone 并启动 OpenClaw Control Center 仓库:https://github.com/TianyiDataScience/openclaw-control-center 端口:4310 / 中文界面 ``` AI 会自动完成:环境探测 → 依赖安装 → 构建 → 启动 ## 访问地址 | 语言 | 地址 | |------|------| | 中文 | `http://127.0.0.1:4310/?section=overview&lang=zh` | | 英文 | `http://127.0.0.1:4310/?section=overview&lang=en` | ## 主要功能模块 ### 1. 总览 Overview 一句话回答"OpenClaw 现在正常吗",包含: - 系统状态 / 活跃会话 / 异常任务 / 预算风险 ### 2. 用量 Usage - 今日/7天/30天平铺 - Token 消耗归因 - 上下文压力预警 ### 3. 员工 Staff - 真正在工作 vs 只是在排队中 - 区分:忙 / 闲 / 卡住 ### 4. 协作 Collaboration - 父子会话接力可视化 - Main ⇄ 子智能体通信追踪 ### 5. 任务 Tasks - 计划 vs 真实执行证据 - 审批链 / 卡点提示 ### 6. 记忆 Memory - 源文件驱动的记忆工作台 - 健康状态监测 ### 7. 文档 Documents - 源文件驱动的文档工作台 - 直接读写生效 ### 8. 设置 Settings - 接线状态 - 安全风险摘要 - 更新状态 ## 安全默认值 | 安全项 | 默认值 | 说明 | |--------|--------|------| | READONLY_MODE | true | 只读模式 | | APPROVAL_ACTIONS_ENABLED | false | 审批默认关闭 | | APPROVAL_ACTIONS_DRY_RUN | true | 模拟运行 | | IMPORT_MUTATION_ENABLED | false | 导入修改关闭 | ## 上下文压力监测 展示哪些会话接近上下文上限: | 压力 | 颜色 | 建议 | |------|------|------| | > 70% | 🟡 黄色 | 预警 | | > 90% | 🔴 红色 | 必须处理 | ## 团队使用建议 1. **个人使用**:用本技能(静态 HTML 版)即可,无需额外安装 2. **团队使用**:部署全功能版,多人共享同一控制台 3. **安全要求高**:保持 READONLY_MODE=true,仅允许查看 ## 故障排查 | 问题 | 解决方案 | |------|---------| | 页面空白 | 检查 Gateway 是否运行在 28789 端口 | | 数据不更新 | 刷新页面,WebSocket 会重连 | | 401 Unauthorized | 检查 .env 中的 token 配置 | | 端口被占用 | 改用其他端口:`PORT=4311 npm run dev:ui` |
AionUi
Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!
activepieces
AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents
cherry-studio
AI productivity studio with smart chat, autonomous agents, and 300+ assistants.
CopilotKit
The Frontend for Agents & Generative UI. React + Angular
Machine-readable data
The same record, as JSON, for agents and crawlers.
{
"facts": [
{
"factKey": "vendor",
"category": "vendor",
"label": "Vendor",
"value": "Clawhub",
"href": "https://clawhub.ai/qinxiao607/skills/openclaw-control-center",
"sourceUrl": "https://clawhub.ai/qinxiao607/skills/openclaw-control-center",
"sourceType": "profile",
"confidence": "medium",
"observedAt": "2026-10-09T12:59:00.660Z",
"isPublic": true
},
{
"factKey": "protocols",
"category": "compatibility",
"label": "Protocol compatibility",
"value": "OpenClaw",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-qinxiao607-openclaw-control-center/contract",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-qinxiao607-openclaw-control-center/contract",
"sourceType": "contract",
"confidence": "medium",
"observedAt": "2026-10-09T12:59:00.660Z",
"isPublic": true
},
{
"factKey": "traction",
"category": "adoption",
"label": "Adoption signal",
"value": "2.6K downloads",
"href": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceUrl": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceType": "profile",
"confidence": "medium",
"observedAt": "2026-10-09T12:59:00.660Z",
"isPublic": true
},
{
"factKey": "latest_release",
"category": "release",
"label": "Latest release",
"value": "1.0.0",
"href": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceUrl": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceType": "release",
"confidence": "medium",
"observedAt": "2026-04-05T02:03:36.931Z",
"isPublic": true
},
{
"factKey": "handshake_status",
"category": "security",
"label": "Handshake status",
"value": "UNKNOWN",
"href": "https://www.xpersona.co/api/v1/agents/clawhub-qinxiao607-openclaw-control-center/trust",
"sourceUrl": "https://www.xpersona.co/api/v1/agents/clawhub-qinxiao607-openclaw-control-center/trust",
"sourceType": "trust",
"confidence": "medium",
"observedAt": null,
"isPublic": true
}
],
"events": [
{
"eventType": "release",
"title": "Release 1.0.0",
"description": "openclaw-control-center 1.0.0 - 初始发布:支持 OpenClaw 可视化控制中心,双模式仪表盘(简洁/专业)。 - 简洁模式面向普通用户:实时展示系统状态、AI 资源消耗、会话/任务信息,配通俗解释。 - 专业模式面向技术用户:完整数据表、架构图、API 列表等,详见文档。 - 实时采集系统状态数据,前端支持深色模式、动画效果、模式切换与本地偏好保存。 - 兼容 OpenClaw 2026.3+,无需安装额外依赖,浏览器自动打开仪表盘。",
"href": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceUrl": "https://clawhub.ai/qinxiao607/openclaw-control-center",
"sourceType": "release",
"confidence": "medium",
"observedAt": "2026-04-05T02:03:36.931Z",
"isPublic": true
}
]
}Record generated Oct 9, 2026.
