feat(governance): 新增服務健康缺口矩陣

apps/web/src/app/[locale]/governance/tabs/automation-inventory-tab.tsx

@@ -43,6 +43,7 @@ import {
   type ObservabilityContractMatrixSnapshot,
   type OffsiteEscrowReadinessStatusSnapshot,
   type RuntimeSurfaceInventorySnapshot,
+  type ServiceHealthGapMatrixSnapshot,
 } from '@/lib/api-client'
 
 function formatDateTime(value: string): string {
@@ -307,6 +308,7 @@ export function AutomationInventoryTab() {
   const [giteaHealth, setGiteaHealth] = useState<GiteaWorkflowRunnerHealthSnapshot | null>(null)
   const [observabilityMatrix, setObservabilityMatrix] = useState<ObservabilityContractMatrixSnapshot | null>(null)
   const [providerRouteMatrix, setProviderRouteMatrix] = useState<AiProviderRouteMatrixSnapshot | null>(null)
+  const [serviceHealthGapMatrix, setServiceHealthGapMatrix] = useState<ServiceHealthGapMatrixSnapshot | null>(null)
   const [loading, setLoading] = useState(true)
   const [error, setError] = useState(false)
 
@@ -323,6 +325,7 @@ export function AutomationInventoryTab() {
       apiClient.getGiteaWorkflowRunnerHealth(),
       apiClient.getObservabilityContractMatrix(),
       apiClient.getAiProviderRouteMatrix(),
+      apiClient.getServiceHealthGapMatrix(),
     ] as const
 
     Promise.allSettled(requests)
@@ -338,6 +341,7 @@ export function AutomationInventoryTab() {
           giteaHealthResult,
           observabilityMatrixResult,
           providerRouteMatrixResult,
+          serviceHealthGapMatrixResult,
         ] = results
 
         setSnapshot(inventoryResult.status === 'fulfilled' ? inventoryResult.value : null)
@@ -350,6 +354,7 @@ export function AutomationInventoryTab() {
         setGiteaHealth(giteaHealthResult.status === 'fulfilled' ? giteaHealthResult.value : null)
         setObservabilityMatrix(observabilityMatrixResult.status === 'fulfilled' ? observabilityMatrixResult.value : null)
         setProviderRouteMatrix(providerRouteMatrixResult.status === 'fulfilled' ? providerRouteMatrixResult.value : null)
+        setServiceHealthGapMatrix(serviceHealthGapMatrixResult.status === 'fulfilled' ? serviceHealthGapMatrixResult.value : null)
         setError([
           inventoryResult,
           backlogResult,
@@ -360,6 +365,7 @@ export function AutomationInventoryTab() {
           giteaHealthResult,
           observabilityMatrixResult,
           providerRouteMatrixResult,
+          serviceHealthGapMatrixResult,
         ].some(result => result.status === 'rejected'))
       })
       .catch(() => setError(true))
@@ -506,6 +512,17 @@ export function AutomationInventoryTab() {
     })
   }, [providerRouteMatrix])
 
+  const visibleServiceHealthTargets = useMemo(() => {
+    if (!serviceHealthGapMatrix) return []
+    const priority = { action_required: 0, blocked: 1, verified: 2 } as Record<string, number>
+    return [...serviceHealthGapMatrix.service_health_targets].sort((a, b) => {
+      const left = priority[a.status] ?? 3
+      const right = priority[b.status] ?? 3
+      if (left !== right) return left - right
+      return a.target_id.localeCompare(b.target_id)
+    })
+  }, [serviceHealthGapMatrix])
+
   if (loading) {
     return (
       <div style={{ padding: 20, display: 'grid', gridTemplateColumns: 'repeat(4, minmax(0, 1fr))', gap: 12 }} className="automation-inventory-kpi-grid">
@@ -519,7 +536,7 @@ export function AutomationInventoryTab() {
     )
   }
 
-  if (error || !snapshot || !backlog || !backupTargets || !backupReadiness || !backupPolicy || !offsiteEscrow || !giteaHealth || !observabilityMatrix || !providerRouteMatrix) {
+  if (error || !snapshot || !backlog || !backupTargets || !backupReadiness || !backupPolicy || !offsiteEscrow || !giteaHealth || !observabilityMatrix || !providerRouteMatrix || !serviceHealthGapMatrix) {
     return (
       <div style={{ padding: 20 }}>
         <GlassCard variant="subtle" padding="lg">
@@ -586,6 +603,16 @@ export function AutomationInventoryTab() {
     + providerRouteMatrix.rollups.shadow_or_canary_allowed_count
     + providerRouteMatrix.rollups.runtime_route_change_allowed_count
   )
+  const serviceHealthActions = serviceHealthGapMatrix.rollups.target_ids_requiring_action.length
+  const serviceHealthStaleGaps = serviceHealthGapMatrix.rollups.stale_endpoint_ids.length
+  const serviceHealthOperatorReviews = serviceHealthGapMatrix.rollups.health_gap_ids.length
+  const serviceHealthDeniedCount = (
+    serviceHealthGapMatrix.rollups.active_probe_allowed_count
+    + serviceHealthGapMatrix.rollups.service_restart_allowed_count
+    + serviceHealthGapMatrix.rollups.endpoint_change_allowed_count
+    + serviceHealthGapMatrix.rollups.notification_send_allowed_count
+    + serviceHealthGapMatrix.rollups.runtime_execution_allowed_count
+  )
   const backlogProgressPercent = backlog.progress_summary.overall_percent
   const explicitApprovalItemCount = backlog.item_approval_boundary_rollup.items_requiring_explicit_approval.length
   const taskBoundaryCount = snapshot.task_approval_boundary_rollup.total_tasks
@@ -718,6 +745,14 @@ export function AutomationInventoryTab() {
     }
   }
 
+  const serviceHealthValueLabel = (value: string) => {
+    try {
+      return t(`serviceHealth.values.${value}` as never)
+    } catch {
+      return value
+    }
+  }
+
   return (
     <div className="automation-inventory-tab-root" style={{ padding: 20, display: 'flex', flexDirection: 'column', gap: 16, minWidth: 0 }}>
       <GlassCard variant="subtle" padding="md">
@@ -1854,6 +1889,170 @@ export function AutomationInventoryTab() {
         </div>
       </GlassCard>
 
+      <GlassCard variant="subtle" padding="md">
+        <div style={{ display: 'flex', flexDirection: 'column', gap: 13, minWidth: 0 }}>
+          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12, flexWrap: 'wrap' }}>
+            <div style={{ display: 'flex', alignItems: 'center', gap: 7, minWidth: 0 }}>
+              <Server size={14} style={{ color: '#d97757' }} />
+              <span style={{ fontFamily: 'Syne, sans-serif', fontSize: 13, fontWeight: 700, color: '#141413' }}>
+                {t('serviceHealth.title')}
+              </span>
+            </div>
+            <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f' }}>
+              {t('serviceHealth.source', {
+                generated: formatDateTime(serviceHealthGapMatrix.generated_at),
+                current: serviceHealthGapMatrix.program_status.current_task_id,
+                next: serviceHealthGapMatrix.program_status.next_task_id,
+              })}
+            </div>
+          </div>
+
+          <div style={{ display: 'grid', gridTemplateColumns: 'repeat(5, minmax(0, 1fr))', gap: 12 }} className="automation-inventory-service-health-kpi-grid">
+            <MetricCard label={t('serviceHealth.metrics.targets')} value={serviceHealthGapMatrix.rollups.total_targets} icon={<Server size={16} />} />
+            <MetricCard label={t('serviceHealth.metrics.actions')} value={serviceHealthActions} tone={serviceHealthActions > 0 ? 'warn' : 'ok'} icon={<AlertTriangle size={16} />} />
+            <MetricCard label={t('serviceHealth.metrics.stale')} value={serviceHealthStaleGaps} tone={serviceHealthStaleGaps > 0 ? 'warn' : 'ok'} icon={<Target size={16} />} />
+            <MetricCard label={t('serviceHealth.metrics.gaps')} value={serviceHealthOperatorReviews} tone={serviceHealthOperatorReviews > 0 ? 'warn' : 'ok'} icon={<Lock size={16} />} />
+            <MetricCard label={t('serviceHealth.metrics.denied')} value={serviceHealthDeniedCount} tone="ok" icon={<BellOff size={16} />} />
+          </div>
+
+          <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, minmax(0, 1fr))', gap: 10 }} className="automation-inventory-service-health-map-grid">
+            <SummaryTile
+              label={t('serviceHealth.map.coverage')}
+              value={`${serviceHealthGapMatrix.rollups.total_targets}`}
+              detail={t('serviceHealth.map.coverageDetail')}
+              tone="ok"
+              icon={<Database size={16} />}
+            />
+            <SummaryTile
+              label={t('serviceHealth.map.stale')}
+              value={`${serviceHealthStaleGaps}`}
+              detail={t('serviceHealth.map.staleDetail')}
+              tone="warn"
+              icon={<Target size={16} />}
+            />
+            <SummaryTile
+              label={t('serviceHealth.map.review')}
+              value={`${serviceHealthOperatorReviews}`}
+              detail={t('serviceHealth.map.reviewDetail')}
+              tone="warn"
+              icon={<Gauge size={16} />}
+            />
+            <SummaryTile
+              label={t('serviceHealth.map.safeBoundary')}
+              value="0"
+              detail={t('serviceHealth.map.safeBoundaryDetail')}
+              tone="ok"
+              icon={<ShieldCheck size={16} />}
+            />
+          </div>
+
+          <div style={{ display: 'grid', gridTemplateColumns: 'minmax(0, 1.35fr) minmax(0, 0.65fr)', gap: 12 }} className="automation-inventory-service-health-grid">
+            <div style={{ display: 'grid', gridTemplateColumns: 'repeat(2, minmax(0, 1fr))', gap: 10 }} className="automation-inventory-service-health-target-grid">
+              {visibleServiceHealthTargets.map(targetItem => (
+                <div key={targetItem.target_id} style={{ padding: 11, border: '0.5px solid #e0ddd4', borderRadius: 7, background: '#fff', minWidth: 0 }}>
+                  <div style={{ display: 'flex', flexDirection: 'column', gap: 8, minWidth: 0 }}>
+                    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8, minWidth: 0 }}>
+                      <span style={{
+                        fontFamily: 'Syne, sans-serif',
+                        fontSize: 12,
+                        fontWeight: 700,
+                        color: '#141413',
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                      }}>
+                        {targetItem.display_name}
+                      </span>
+                      <Chip value={serviceHealthValueLabel(targetItem.status)} muted={targetItem.status === 'verified'} />
+                    </div>
+                    <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6, minWidth: 0 }}>
+                      <Chip value={serviceHealthValueLabel(targetItem.kind)} />
+                      <Chip value={`${t('serviceHealth.labels.freshness')}: ${serviceHealthValueLabel(targetItem.freshness_status)}`} muted />
+                      <Chip value={`${t('serviceHealth.labels.risk')}: ${serviceHealthValueLabel(targetItem.risk_level)}`} muted={targetItem.risk_level !== 'critical'} />
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {targetItem.health_contract}
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {targetItem.endpoint_contract}
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#141413', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {targetItem.next_action}
+                    </div>
+                    <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6, minWidth: 0 }}>
+                      <Chip value={targetItem.evidence_refs[0] ?? t('backupEvidence.noEvidence')} muted />
+                    </div>
+                  </div>
+                </div>
+              ))}
+            </div>
+
+            <div style={{ display: 'flex', flexDirection: 'column', gap: 12, minWidth: 0 }}>
+              <div style={{ padding: 12, border: '0.5px solid #e0ddd4', borderRadius: 7, background: '#fff', display: 'flex', flexDirection: 'column', gap: 10, minWidth: 0 }}>
+                <span style={{ fontFamily: 'Syne, sans-serif', fontSize: 13, fontWeight: 700, color: '#141413' }}>
+                  {t('serviceHealth.staleTitle', { count: serviceHealthStaleGaps })}
+                </span>
+                {serviceHealthGapMatrix.stale_endpoints.map(endpoint => (
+                  <div key={endpoint.endpoint_id} style={{ display: 'flex', flexDirection: 'column', gap: 6, minWidth: 0 }}>
+                    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
+                      <span style={{ fontFamily: "'DM Mono', monospace", fontSize: 11, fontWeight: 700, color: '#141413', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                        {endpoint.display_name}
+                      </span>
+                      <Chip value={serviceHealthValueLabel(endpoint.status)} />
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {endpoint.stale_ref}
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#141413', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {endpoint.current_truth}
+                    </div>
+                  </div>
+                ))}
+              </div>
+
+              <div style={{ padding: 12, border: '0.5px solid #e0ddd4', borderRadius: 7, background: '#fff', display: 'flex', flexDirection: 'column', gap: 10, minWidth: 0 }}>
+                <span style={{ fontFamily: 'Syne, sans-serif', fontSize: 13, fontWeight: 700, color: '#141413' }}>
+                  {t('serviceHealth.gapsTitle', { count: serviceHealthOperatorReviews })}
+                </span>
+                {serviceHealthGapMatrix.health_gaps.slice(0, 4).map(gap => (
+                  <div key={gap.gap_id} style={{ display: 'flex', flexDirection: 'column', gap: 6, minWidth: 0 }}>
+                    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
+                      <span style={{ fontFamily: "'DM Mono', monospace", fontSize: 11, fontWeight: 700, color: '#141413', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                        {gap.display_name}
+                      </span>
+                      <Chip value={serviceHealthValueLabel(gap.status)} muted={gap.status === 'proposal_required'} />
+                    </div>
+                    <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.45, overflowWrap: 'anywhere' }}>
+                      {gap.summary}
+                    </div>
+                  </div>
+                ))}
+              </div>
+
+              <div style={{ padding: 12, border: '0.5px solid #e0ddd4', borderRadius: 7, background: '#fff', display: 'flex', flexDirection: 'column', gap: 10, minWidth: 0 }}>
+                <span style={{ fontFamily: 'Syne, sans-serif', fontSize: 13, fontWeight: 700, color: '#141413' }}>
+                  {t('serviceHealth.contractTitle')}
+                </span>
+                <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.5, overflowWrap: 'anywhere' }}>
+                  {serviceHealthGapMatrix.operator_contract.restart_policy}
+                </div>
+                <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.5, overflowWrap: 'anywhere' }}>
+                  {serviceHealthGapMatrix.operator_contract.endpoint_policy}
+                </div>
+                <div style={{ fontFamily: "'DM Mono', monospace", fontSize: 10, color: '#87867f', lineHeight: 1.5, overflowWrap: 'anywhere' }}>
+                  {serviceHealthGapMatrix.operator_contract.notification_policy}
+                </div>
+                <div style={{ display: 'flex', flexWrap: 'wrap', gap: 6, minWidth: 0 }}>
+                  {serviceHealthGapMatrix.operator_contract.must_not_interpret_as.slice(0, 6).map(item => (
+                    <Chip key={item} value={item} />
+                  ))}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </GlassCard>
+
       <div style={{ display: 'grid', gridTemplateColumns: 'minmax(0, 1.2fr) minmax(0, 0.8fr)', gap: 12 }} className="automation-inventory-bottom-grid">
         <GlassCard variant="subtle" padding="md">
           <div style={{ display: 'flex', flexDirection: 'column', gap: 13, minWidth: 0 }}>
@@ -1976,6 +2175,10 @@ export function AutomationInventoryTab() {
           .automation-inventory-provider-map-grid,
           .automation-inventory-provider-grid,
           .automation-inventory-provider-route-grid,
+          .automation-inventory-service-health-kpi-grid,
+          .automation-inventory-service-health-map-grid,
+          .automation-inventory-service-health-grid,
+          .automation-inventory-service-health-target-grid,
           .automation-inventory-bottom-grid,
           .automation-inventory-task-grid {
             grid-template-columns: 1fr !important;

apps/web/src/lib/api-client.ts

@@ -282,6 +282,11 @@ export const apiClient = {
     return handleResponse<AiProviderRouteMatrixSnapshot>(res)
   },
 
+  async getServiceHealthGapMatrix() {
+    const res = await fetch(`${API_BASE_URL}/agents/service-health-gap-matrix`)
+    return handleResponse<ServiceHealthGapMatrixSnapshot>(res)
+  },
+
   async getBackupDrTargetInventory() {
     const res = await fetch(`${API_BASE_URL}/agents/backup-dr-target-inventory`)
     return handleResponse<BackupDrTargetInventorySnapshot>(res)
@@ -1105,6 +1110,83 @@ export interface AiProviderRouteMatrixSnapshot {
   approval_boundaries: Record<string, false>
 }
 
+export interface ServiceHealthGapMatrixSnapshot {
+  schema_version: 'service_health_gap_matrix_v1'
+  generated_at: string
+  program_status: {
+    overall_completion_percent: number
+    current_priority: 'P0' | 'P1' | 'P2' | 'P3'
+    current_task_id: string
+    next_task_id: string
+    read_only_mode: true
+  }
+  source_refs: string[]
+  rollups: {
+    total_targets: number
+    by_kind: Record<string, number>
+    by_status: Record<string, number>
+    by_freshness_status: Record<string, number>
+    target_ids_requiring_action: string[]
+    health_gap_ids: string[]
+    stale_endpoint_ids: string[]
+    critical_target_ids: string[]
+    read_only_denials_total: number
+    service_restart_allowed_count: number
+    endpoint_change_allowed_count: number
+    active_probe_allowed_count: number
+    notification_send_allowed_count: number
+    runtime_execution_allowed_count: number
+  }
+  service_health_targets: Array<{
+    target_id: string
+    display_name: string
+    kind: string
+    status: 'verified' | 'action_required' | 'blocked'
+    risk_level: 'low' | 'medium' | 'high' | 'critical'
+    freshness_status: string
+    health_contract: string
+    endpoint_contract: string
+    evidence_refs: string[]
+    next_action: string
+  }>
+  health_gaps: Array<{
+    gap_id: string
+    display_name: string
+    status: string
+    severity: 'low' | 'medium' | 'high' | 'critical'
+    summary: string
+    target_ids: string[]
+    evidence_refs: string[]
+    next_action: string
+  }>
+  stale_endpoints: Array<{
+    endpoint_id: string
+    display_name: string
+    status: string
+    severity: 'low' | 'medium' | 'high' | 'critical'
+    stale_ref: string
+    current_truth: string
+    evidence_refs: string[]
+    next_action: string
+  }>
+  latest_observations: Array<{
+    observation_id: string
+    status: string
+    summary: string
+    evidence_refs: string[]
+  }>
+  operator_contract: {
+    display_mode: 'read_only_service_health_gap_matrix'
+    must_not_interpret_as: string[]
+    secret_display_policy: string
+    restart_policy: string
+    endpoint_policy: string
+    notification_policy: string
+  }
+  operation_boundaries: Record<string, boolean>
+  approval_boundaries: Record<string, false>
+}
+
 export interface BackupDrTargetInventorySnapshot {
   schema_version: 'backup_dr_target_inventory_v1'
   generated_at: string