mirror of
https://github.com/hansjone/dsh-im-ops.git
synced 2026-10-09 10:23:17 +08:00
feat(ui): compact bot connection metadata
This commit is contained in:
parent
59ed364856
commit
2803bbcbab
22 changed files with 632 additions and 556 deletions
|
|
@ -23,6 +23,7 @@ import {
|
|||
EMPTY_AGENT_PRESET_CATALOG,
|
||||
} from "../../agent-preset.js";
|
||||
import { useWorkspaceSnapshotFence } from "../../workspace-snapshot-fence.js";
|
||||
import { BotStatusMeta, ChannelListHeading } from "../../channel-card-meta.js";
|
||||
import { installFeishuStyles } from "./styles.js";
|
||||
|
||||
export const name = "feishu-settings";
|
||||
|
|
@ -591,15 +592,15 @@ export function BotCard({
|
|||
h("h3", { id: titleId, title: bot.name }, bot.name),
|
||||
h("p", { title: bot.appIdMasked }, bot.appIdMasked ?? "应用标识已安全保存")),
|
||||
),
|
||||
h("div", { className: "bxf-healthPill dim-botHealth", "data-health": stateForDisplay },
|
||||
h("span", { className: "bxf-dot dim-healthDot", "data-tone": tone }),
|
||||
h("span", null, HEALTH_LABELS[stateForDisplay] ?? "状态未知")),
|
||||
),
|
||||
h("dl", { className: "bxf-statusGrid dim-botMetrics" },
|
||||
h("div", { className: "bxf-metric dim-botMetric" }, h("dt", null, "消息通道"),
|
||||
h("dd", null, connected ? "长连接" : stateForDisplay === "connecting" ? "连接中" : "已断开")),
|
||||
h("div", { className: "bxf-metric dim-botMetric" }, h("dt", null, "最近检查"),
|
||||
h("dd", null, formatCheckedTime(health.lastCheckedAt))),
|
||||
h(BotStatusMeta, {
|
||||
className: "bxf-healthPill",
|
||||
dotClassName: "bxf-dot",
|
||||
tone,
|
||||
stateLabel: HEALTH_LABELS[stateForDisplay] ?? "状态未知",
|
||||
lastCheckedAt: health.lastCheckedAt,
|
||||
formatCheckedTime,
|
||||
healthState: stateForDisplay,
|
||||
}),
|
||||
),
|
||||
h(WorkspaceEditor, {
|
||||
workspace: connection.workspace,
|
||||
|
|
@ -669,8 +670,12 @@ export function BotCard({
|
|||
|
||||
function BotList(props) {
|
||||
return h("section", { className: "bxf-listSection dim-listSection", "aria-labelledby": "bxf-bot-list-title" },
|
||||
h("div", { className: "bxf-listHeading dim-listHeading" },
|
||||
h("h3", { id: "bxf-bot-list-title" }, "已接入的机器人")),
|
||||
h(ChannelListHeading, {
|
||||
className: "bxf-listHeading",
|
||||
id: "bxf-bot-list-title",
|
||||
title: "已接入的机器人",
|
||||
connectionLabel: "长连接",
|
||||
}),
|
||||
h("ul", { className: "bxf-botList dim-botList", role: "list" },
|
||||
props.bots.map((bot) => h("li", { key: bot.botId },
|
||||
h(BotCard, {
|
||||
|
|
|
|||
|
|
@ -402,10 +402,6 @@ const CSS = String.raw`
|
|||
.bxf-healthPill[data-health="degraded"], .bxf-healthPill[data-health="checking"], .bxf-healthPill[data-health="connecting"] { color: var(--bxf-warning); background: color-mix(in srgb, var(--bxf-warning) 10%, transparent); }
|
||||
.bxf-healthPill[data-health="offline"], .bxf-healthPill[data-health="error"] { color: var(--bxf-error); background: color-mix(in srgb, var(--bxf-error) 10%, transparent); }
|
||||
|
||||
.bxf-statusGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
|
||||
.bxf-metric { min-width: 0; border: 1px solid var(--dsw-alias-border-l2, #dee0e3); border-radius: 9px; padding: 12px 13px; background: var(--dsw-alias-bg-module-platform, #f7f8fa); }
|
||||
.bxf-metric dt { color: var(--dsw-alias-label-tertiary, #8f959e); font-size: 11px; line-height: 17px; }
|
||||
.bxf-metric dd { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-primary, #1f2329); font-size: 12px; line-height: 18px; font-weight: 550; margin: 3px 0 0; }
|
||||
|
||||
.bxf-responseMode { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) max-content; align-items: center; column-gap: 10px; row-gap: 5px; margin-top: 6px; padding: 8px 10px; border: 1px solid var(--dsw-alias-border-l1, #eef0f3); border-radius: 9px; background: var(--dsw-alias-bg-module-platform, #f7f8fa); }
|
||||
.bxf-responseModeHeader { display: contents; color: var(--dsw-alias-label-secondary, #646a73); font-size: 12px; line-height: normal; }
|
||||
|
|
@ -517,7 +513,6 @@ const CSS = String.raw`
|
|||
.bxf-qrLayout { grid-template-columns: minmax(0, 1fr); justify-items: center; }
|
||||
.bxf-botProvision .bxf-qrLayout { grid-template-columns: minmax(0, 1fr); }
|
||||
.bxf-qrCopy { width: 100%; }
|
||||
.bxf-statusGrid { grid-template-columns: minmax(0, 1fr); }
|
||||
.bxf-connectedTop { align-items: flex-start; flex-direction: column; }
|
||||
.bxf-inlineError { grid-template-columns: minmax(0, 1fr); padding: 20px; }
|
||||
.bxf-statusNotice { align-items: flex-start; flex-wrap: wrap; }
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue