feat: unify sentinel monitor checks

scripts/assets/web-probe-sentinel-monitor-web/monitor-web.css

@@ -27,14 +27,14 @@
 html,
 body,
 #monitor-web-root {
-  height: 100%;
+  min-height: 100%;
   margin: 0;
 }
 
 body {
   background: var(--bg);
   color: var(--text);
-  overflow: hidden;
+  overflow: auto;
 }
 
 button,
@@ -45,11 +45,10 @@ input {
 
 .monitor-shell {
   display: flex;
-  height: 100dvh;
-  min-height: 0;
+  min-height: 100dvh;
   flex-direction: column;
   gap: 10px;
-  overflow: hidden;
+  overflow: visible;
   padding: 12px;
 }
 
@@ -462,7 +461,7 @@ select {
 
 .timeline-list {
   display: grid;
-  max-height: 150px;
+  max-height: 300px;
   gap: 7px;
   overflow: auto;
   padding-right: 2px;
@@ -549,9 +548,9 @@ select {
   display: grid;
   grid-template-columns: minmax(260px, 0.82fr) minmax(420px, 1.34fr) minmax(300px, 1fr);
   gap: 10px;
-  flex: 1 1 auto;
-  min-height: 0;
-  overflow: hidden;
+  flex: 0 0 auto;
+  min-height: clamp(680px, calc(100dvh - 220px), 980px);
+  overflow: visible;
 }
 
 .pane {
@@ -615,6 +614,7 @@ select {
 .finding-list,
 .detail-stack {
   display: grid;
+  align-content: start;
   gap: 8px;
 }
 
@@ -658,6 +658,18 @@ select {
   background: var(--green);
 }
 
+.check-code {
+  flex: 0 0 auto;
+  border: 1px solid var(--line-strong);
+  border-radius: 6px;
+  background: #ffffff;
+  color: var(--ink);
+  padding: 2px 6px;
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
+  font-size: 11px;
+  line-height: 1.2;
+}
+
 .tag {
   display: inline-flex;
   align-items: center;
@@ -702,6 +714,40 @@ select {
   background: #ffffff;
 }
 
+.summary-list {
+  display: grid;
+  overflow: hidden;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: #ffffff;
+}
+
+.summary-row {
+  display: grid;
+  grid-template-columns: minmax(86px, 0.35fr) minmax(0, 1fr);
+  gap: 10px;
+  align-items: center;
+  min-height: 34px;
+  padding: 7px 10px;
+  border-bottom: 1px solid var(--line);
+  font-size: 12px;
+}
+
+.summary-row:last-child {
+  border-bottom: 0;
+}
+
+.summary-row span {
+  color: var(--muted);
+}
+
+.summary-row strong {
+  min-width: 0;
+  overflow-wrap: anywhere;
+  font-size: 12px;
+  font-weight: 600;
+}
+
 pre {
   max-height: 240px;
   margin: 0;

scripts/assets/web-probe-sentinel-monitor-web/monitor-web.js

@@ -71,13 +71,18 @@ createApp({
         timeLabel: formatDate(rawTime),
         absoluteTime: formatAbsoluteDate(rawTime),
         reportSha: shortHash(run.reportJsonSha256 || run.report_json_sha256 || run.reportSha256 || ""),
-        title: `${shortId(run.id)} ${formatAbsoluteDate(rawTime)} 红色 ${red} 警告 ${warning} 总量 ${total}`,
+        title: `${shortId(run.id)} ${formatAbsoluteDate(rawTime)} 错误 ${red} 警告 ${warning} 总量 ${total}`,
       };
     }));
     const timelineRuns = computed(() => runs.value.slice(0, 16));
     const rootCauseFindings = computed(() => {
-      const rows = findings.value.filter((item) => item.rootCause || item.nextAction || ["red", "warning"].includes(severityClass(item)));
-      return rows.slice(0, 14);
+      const rows = findings.value.filter((item) => item.checkRegistered !== false || item.rootCause || item.nextAction || ["red", "warning", "info"].includes(severityClass(item)));
+      return rows.slice(0, 32);
+    });
+    const visibleCheckFindings = computed(() => {
+      const needle = findingFilter.value.trim().toLowerCase();
+      const rows = needle.length === 0 ? rootCauseFindings.value : rootCauseFindings.value.filter((item) => findingSearchText(item).includes(needle));
+      return rows.slice(0, 24);
     });
     const cadence = computed(() => {
       const intervalMs = Number(overview.value?.scheduler?.intervalMs || 0);
@@ -220,6 +225,7 @@ createApp({
       trendDots,
       timelineRuns,
       rootCauseFindings,
+      visibleCheckFindings,
       cadence,
       healthChecks,
       loadAll,
@@ -238,7 +244,10 @@ createApp({
       shortId,
       rootCauseText,
       findingTitle,
+      findingCode,
+      levelLabel,
       detailSummaryText,
+      detailSummaryRows,
       commandSummary,
       statusLabel,
     };
@@ -292,13 +301,13 @@ createApp({
         <section class="trend-panel" aria-labelledby="trend-heading">
           <div class="panel-header">
             <div>
-              <h2 id="trend-heading">红色 / 警告数量曲线</h2>
+              <h2 id="trend-heading">错误 / 警告监测项曲线</h2>
               <p>按运行更新时间展示最近 {{ trendRows.length }} 次变化</p>
             </div>
             <span class="pill" :class="cadence.stale ? 'warning' : 'healthy'">{{ cadence.stale ? "非阻塞报警" : "新鲜" }}</span>
           </div>
           <div class="trend-chart-wrap">
-            <svg class="trend-chart" viewBox="0 0 720 142" role="img" aria-label="红色和警告发现数量趋势" data-monitor-trend-curve="true">
+            <svg class="trend-chart" viewBox="0 0 720 142" role="img" aria-label="错误和警告监测项数量趋势" data-monitor-trend-curve="true">
               <line class="trend-grid-line" x1="24" x2="696" y1="24" y2="24"></line>
               <line class="trend-grid-line" x1="24" x2="696" y1="75" y2="75"></line>
               <line class="trend-grid-line" x1="24" x2="696" y1="126" y2="126"></line>
@@ -335,15 +344,15 @@ createApp({
               <strong>{{ shortId(hoveredTrendDot.runId) }}</strong>
               <span>{{ hoveredTrendDot.absoluteTime }}</span>
               <span>状态 {{ hoveredTrendDot.status }}</span>
-              <span>红色 {{ hoveredTrendDot.red }} / 警告 {{ hoveredTrendDot.warning }} / 总量 {{ hoveredTrendDot.total }}</span>
+              <span>错误 {{ hoveredTrendDot.red }} / 警告 {{ hoveredTrendDot.warning }} / 总量 {{ hoveredTrendDot.total }}</span>
               <span v-if="hoveredTrendDot.reportSha">report {{ hoveredTrendDot.reportSha }}</span>
             </div>
             <div v-if="trendRows.length === 0" class="trend-empty">暂无运行数据</div>
           </div>
           <div class="trend-legend">
-            <span class="legend-item"><span class="legend-swatch red"></span>红色 {{ redCount({ severityCounts: severityTotals }) }}</span>
+            <span class="legend-item"><span class="legend-swatch red"></span>错误 {{ redCount({ severityCounts: severityTotals }) }}</span>
             <span class="legend-item"><span class="legend-swatch warning"></span>警告 {{ warningCount({ severityCounts: severityTotals }) }}</span>
-            <span class="legend-item"><span class="legend-swatch total"></span>发现总量 {{ findingCount({ findingCount: overview?.latestRun?.findingCount, severityCounts: severityTotals }) }}</span>
+            <span class="legend-item"><span class="legend-swatch total"></span>监测项总量 {{ findingCount({ findingCount: overview?.latestRun?.findingCount, severityCounts: severityTotals }) }}</span>
             <span class="legend-item">{{ cadence.alert }}</span>
           </div>
         </section>
@@ -384,7 +393,7 @@ createApp({
           <strong>{{ cadence.latestAge >= 0 ? formatDuration(cadence.latestAge) : "-" }}</strong>
         </div>
         <div class="metric">
-          <span>红色</span>
+          <span>错误</span>
           <strong>{{ redCount({ severityCounts: severityTotals }) }}</strong>
         </div>
         <div class="metric">
@@ -412,7 +421,7 @@ createApp({
             <input v-model="runFilter" type="search" placeholder="搜索 run / scenario" aria-label="搜索运行">
             <select v-model="severityFilter" aria-label="严重级别筛选">
               <option value="">全部</option>
-              <option value="red">红色</option>
+              <option value="red">错误</option>
               <option value="warning">警告</option>
               <option value="info">信息</option>
               <option value="healthy">正常</option>
@@ -453,7 +462,7 @@ createApp({
               <h3>摘要</h3>
               <div class="detail-grid">
                 <div class="metric"><span>状态</span><strong>{{ selectedRun.status || "-" }}</strong></div>
-                <div class="metric"><span>发现数</span><strong>{{ findingCount(selectedRun) }}</strong></div>
+                <div class="metric"><span>监测项</span><strong>{{ findingCount(selectedRun) }}</strong></div>
                 <div class="metric"><span>Observer</span><strong>{{ selectedRun.observerId || "-" }}</strong></div>
                 <div class="metric"><span>更新时间</span><strong>{{ formatDate(selectedRun.updatedAt || selectedRun.createdAt) }}</strong></div>
               </div>
@@ -467,7 +476,12 @@ createApp({
             </section>
             <section class="detail-card">
               <h3>报告摘要</h3>
-              <pre>{{ detailSummaryText(selectedDetail) }}</pre>
+              <div class="summary-list">
+                <div v-for="row in detailSummaryRows(selectedDetail)" :key="row.key" class="summary-row">
+                  <span>{{ row.label }}</span>
+                  <strong>{{ row.value }}</strong>
+                </div>
+              </div>
             </section>
             <section class="detail-card">
               <h3>复现命令</h3>
@@ -480,29 +494,29 @@ createApp({
         <aside class="pane pane-findings" aria-labelledby="findings-heading">
           <div class="pane-header">
             <div>
-              <h2 id="findings-heading">根因与发现</h2>
-              <p class="muted">优先展示 OTel/报告中已归因线索</p>
+              <h2 id="findings-heading">监测项</h2>
+              <p class="muted">按 YAML 编号、等级和中文标题展示</p>
             </div>
             <span class="tag">{{ findings.length }} 项</span>
           </div>
           <div class="filter-row">
-            <input v-model="findingFilter" type="search" placeholder="搜索 finding / root cause" aria-label="搜索发现">
+            <input v-model="findingFilter" type="search" placeholder="搜索编号 / 标题 / 根因" aria-label="搜索监测项">
           </div>
           <div class="finding-list">
             <article
-              v-for="item in rootCauseFindings.filter((finding) => !findingFilter || JSON.stringify(finding).toLowerCase().includes(findingFilter.toLowerCase())).slice(0, 24)"
+              v-for="item in visibleCheckFindings"
               :key="item.code || item.findingId || item.latestRunId"
               class="finding-card"
               :class="severityClass(item)"
             >
               <span class="row-line">
-                <span class="severity-line"><span class="severity-dot"></span><strong>{{ findingTitle(item) }}</strong></span>
-                <span class="tag" :class="severityClass(item)">{{ item.runCount || item.count || 1 }}</span>
+                <span class="severity-line"><span class="severity-dot"></span><span class="check-code">{{ findingCode(item) }}</span><strong>{{ findingTitle(item) }}</strong></span>
+                <span class="tag" :class="severityClass(item)">{{ levelLabel(item) }} · {{ item.runCount || item.count || 1 }}</span>
               </span>
               <p class="muted">{{ rootCauseText(item) }}</p>
-              <p v-if="item.nextAction" class="muted">方案: {{ item.nextAction }}</p>
+              <p v-if="item.nextAction" class="muted">处理: {{ item.nextAction }}</p>
             </article>
-            <div v-if="rootCauseFindings.length === 0" class="empty">暂无已归因发现</div>
+            <div v-if="visibleCheckFindings.length === 0" class="empty">暂无匹配监测项</div>
           </div>
         </aside>
       </section>
@@ -565,7 +579,7 @@ function findingCount(item) {
 }
 
 function severityClass(item) {
-  const explicit = String(item?.maxSeverity || item?.severity || "").toLowerCase();
+  const explicit = String(item?.maxSeverity || item?.checkLevel || item?.severity || item?.level || "").toLowerCase();
   if (["red", "critical", "error", "blocked"].includes(explicit)) return "red";
   if (["warning", "warn", "amber"].includes(explicit)) return "warning";
   if (["info", "notice"].includes(explicit)) return "info";
@@ -617,18 +631,73 @@ function clamp(value, min, max) {
 }
 
 function rootCauseText(item) {
-  return item?.rootCause || item?.evidenceSummary || item?.summary || "尚未记录根因，等待下一次 OTel/报告归因。";
+  if (item?.rootCause) return `根因: ${item.rootCause}`;
+  return item?.checkSummaryZh || item?.summary || item?.evidenceSummary || "尚未记录根因，等待下一次 OTel/报告归因。";
 }
 
 function findingTitle(item) {
-  return item?.code || item?.findingId || item?.scenarioId || item?.latestRunId || "finding";
+  return item?.checkTitleZh || item?.check?.titleZh || item?.findingId || item?.code || item?.scenarioId || item?.latestRunId || "未登记监测项";
+}
+
+function findingCode(item) {
+  return item?.checkCode || item?.check?.code || "未登记";
+}
+
+function levelLabel(item) {
+  const value = String(item?.checkLevel || item?.severity || item?.level || "").toLowerCase();
+  if (["critical", "red"].includes(value)) return "严重";
+  if (["error", "blocked", "failed"].includes(value)) return "错误";
+  if (["warning", "warn", "amber"].includes(value)) return "警告";
+  if (["info", "notice"].includes(value)) return "信息";
+  return "未知";
+}
+
+function findingSearchText(item) {
+  return [
+    item?.checkCode,
+    item?.check?.code,
+    item?.checkTitleZh,
+    item?.check?.titleZh,
+    item?.checkLevel,
+    item?.severity,
+    item?.findingId,
+    item?.code,
+    item?.summary,
+    item?.checkSummaryZh,
+    item?.rootCause,
+    item?.evidenceSummary,
+    item?.nextAction,
+    item?.scenarioId,
+    item?.latestRunId,
+  ].filter((value) => value !== null && value !== undefined).join(" ").toLowerCase();
 }
 
 function detailSummaryText(detail) {
-  if (!detail) return "加载详情中";
-  if (detail.ok === false) return detail.error || "详情不可用";
-  const summary = detail.summary && Object.keys(detail.summary).length > 0 ? detail.summary : detail.run;
-  return JSON.stringify(summary || {}, null, 2);
+  return detailSummaryRows(detail).map((row) => `${row.label}: ${row.value}`).join("\n");
+}
+
+function detailSummaryRows(detail) {
+  if (!detail) return [{ key: "loading", label: "状态", value: "加载详情中" }];
+  if (detail.ok === false) return [{ key: "error", label: "状态", value: detail.error || "详情不可用" }];
+  const run = detail.run || {};
+  const summary = detail.summary || {};
+  const artifacts = detail.artifacts || {};
+  const counts = run.severityCounts || {};
+  const rows = [
+    { key: "run", label: "运行", value: shortId(run.id || run.runId || detail.runId) },
+    { key: "scenario", label: "场景", value: run.scenarioId || run.scenario_id || "-" },
+    { key: "status", label: "状态", value: run.status || "-" },
+    { key: "checks", label: "监测项", value: String(run.findingCount ?? run.finding_count ?? 0) },
+    { key: "error", label: "错误", value: String(redCount({ severityCounts: counts })) },
+    { key: "warning", label: "警告", value: String(warningCount({ severityCounts: counts })) },
+    { key: "observer", label: "Observer", value: run.observerId || run.observer_id || "-" },
+    { key: "updated", label: "更新时间", value: formatAbsoluteDate(run.updatedAt || run.updated_at || run.createdAt || run.created_at) },
+    { key: "report", label: "报告", value: shortHash(artifacts.reportJsonSha256 || run.reportJsonSha256 || run.report_json_sha256 || "") || "-" },
+  ];
+  const windowStart = summary.analysisWindow?.start || summary.window?.start;
+  const windowEnd = summary.analysisWindow?.end || summary.window?.end;
+  if (windowStart || windowEnd) rows.push({ key: "window", label: "窗口", value: `${formatDate(windowStart)} - ${formatDate(windowEnd)}` });
+  return rows;
 }
 
 function commandSummary(detail) {