This is an automated email from the ASF dual-hosted git repository.
lizhimins pushed a commit to branch rocketmq-studio
in repository https://gitbox.apache.org/repos/asf/rocketmq-dashboard.git
The following commit(s) were added to refs/heads/rocketmq-studio by this push:
new 44c2fc059 docs: add screenshots of the dashboard, group list and
message query (#2505)
44c2fc059 is described below
commit 44c2fc0599627573003002771efaebd7069dde61
Author: lizhimins <[email protected]>
AuthorDate: Fri Aug 21 16:11:06 2026 +0800
docs: add screenshots of the dashboard, group list and message query (#2505)
The README described the features in prose only, so a reader had to deploy
Studio to see what the console looks like. Add three screenshots under
docs/pics with a one-line note each.
---
README.md | 15 +++++++++++++++
README_zh.md | 15 +++++++++++++++
docs/pics/group-list.png | Bin 0 -> 292607 bytes
docs/pics/home-ai-chat.png | Bin 0 -> 1133042 bytes
docs/pics/message-query.png | Bin 0 -> 398167 bytes
5 files changed, 30 insertions(+)
diff --git a/README.md b/README.md
index 285b829b0..635ac4991 100644
--- a/README.md
+++ b/README.md
@@ -36,6 +36,20 @@ user-management page; browsers authenticate with an
`HttpOnly` session cookie, a
request a bearer token explicitly. Disabling login protection only skips API
interception for local
development.
+## Screenshots
+
+**Dashboard · AI chat** — a single entry point that switches between AI chat,
cluster diagnosis, resource management, and message query, with model selection
and MCP tool calls.
+
+
+
+**Consumer group management** — the group list shows subscription mode, online
clients, total lag, and consumption delay; expanding a row reveals per-Topic
subscription consistency and filter expressions, alongside offset reset and
config import/export.
+
+
+
+**Message query** — search messages by Topic / Message Key / Message ID within
a time range, then inspect details, trace, verification, or download a single
message.
+
+
+
## Features
| Module | Capabilities |
@@ -68,6 +82,7 @@ development.
- **Commit Format** — Conventional Commits (`feat:` / `fix:` / `refactor:` /
`chore:` / `docs:` / `perf:`)
- **Architecture Tests** — `mvn test` runs ArchUnit hexagonal architecture
constraint checks
- **i18n** — New frontend text must include both Chinese and English
translations (`web/src/i18n/`)
+- **Table Width** — Tables must not show a horizontal scrollbar by default
(only allowed when the window/container is manually narrowed); use
`tableScrollX(columns)` from `web/src/utils/table.ts` to compute `scroll.x`
from declared column widths instead of hardcoded magic numbers; when a modal
contains a wide table, adjust the modal `width` dynamically per active tab
(e.g., Group detail: Overview 800 / Progress 1080) so that container width ≥
table width; long-text columns (e.g., long To [...]
## License
diff --git a/README_zh.md b/README_zh.md
index 2929f2e22..fcf461372 100644
--- a/README_zh.md
+++ b/README_zh.md
@@ -28,6 +28,20 @@ cd .. && docker compose up -d --build
`STUDIO_AUTH_ADMIN_PASSWORD` 开启登录保护。登录接口仅接受已配置用户；
关闭登录保护只会跳过本地开发场景下的 API 拦截。
+## 界面预览
+
+**首页 · AI 对话** — 统一入口，可切换 AI 对话 / 集群诊断 / 资源管理 / 消息查询四类场景，支持多模型选择与 MCP 工具调用。
+
+
+
+**Group 管理** — 消费组列表展示订阅模式、在线客户端数、总堆积量与消费延迟，展开行可查看订阅 Topic
的订阅一致性与过滤表达式，并支持重置位点、导入导出。
+
+
+
+**消息查询** — 按 Topic / Message Key / Message ID 结合时间范围检索消息，单条消息可查看详情、轨迹、校验与下载。
+
+
+
## 功能概览
| 模块 | 能力 |
@@ -60,6 +74,7 @@ cd .. && docker compose up -d --build
- **Commit 格式** — 遵循 Conventional Commits（`feat:` / `fix:` / `refactor:` /
`chore:` / `docs:` / `perf:`）
- **架构测试** — 后端 `mvn test` 自动运行 ArchUnit 六边形架构约束检查
- **国际化** — 新增前端文案需同时提供中英文翻译（`web/src/i18n/`）
+- **表格宽度** — 表格默认不出横向滚动条（仅窗口/容器被人为缩窄时才出现）；列宽用 `web/src/utils/table.ts` 的
`tableScrollX(columns)` 按声明列宽自动累加算出 `scroll.x`，禁止写死魔术数字；弹窗内表格列多或内容长时，按当前 Tab
动态调整弹窗 `width`（如 Group 详情弹窗：概览 800、消费进度 1080）使容器宽 ≥ 表宽；长文本列（如长 Topic 名）用列
`ellipsis: true` + `title` 悬停显示全名截断，允许显示不全、不换行
## License
diff --git a/docs/pics/group-list.png b/docs/pics/group-list.png
new file mode 100644
index 000000000..a161a8846
Binary files /dev/null and b/docs/pics/group-list.png differ
diff --git a/docs/pics/home-ai-chat.png b/docs/pics/home-ai-chat.png
new file mode 100644
index 000000000..1af6e8ca1
Binary files /dev/null and b/docs/pics/home-ai-chat.png differ
diff --git a/docs/pics/message-query.png b/docs/pics/message-query.png
new file mode 100644
index 000000000..b5d1637d3
Binary files /dev/null and b/docs/pics/message-query.png differ
