跳转正文

YStatusBadge ​

适用范围:Legacy Admin Kit / Schema 与旧 admin-vue。新 admin-nuxtui 的开发入口见管理端 Nuxt UI 指南。

定位 / Owner ​

YStatusBadge 是紧凑静态状态标识,使用批准的 tone 和可见文本,不拥有状态转换逻辑。

什么时候使用 ​

用于列表、详情和 header 中显示启用、警告、失败等短状态。

不什么时候使用 ​

需要用户立即注意的错误使用 YAlert;可点击筛选器不要伪装成 badge。

Public API ​

prop:tone(neutral/brand/info/success/warning/danger);default slot 为状态文本。

Composition ​

业务或 Data Workbench renderer 计算 tone 与文本,Badge 只呈现结果。

Anti-pattern ​

不要只渲染无文本圆点,也不要在组件内映射业务 enum。

Production Example ​

LegacyYDataTable cell renderer、Member Detail、Dashboard 与 Chatwoot Tester 直接消费它。

Live Workbench ​

/frontend-module-demo/component-workbench/status-badge

Verification / Source ​

  • packages/yoyo-admin/admin-kit/src/ui/components/status-badge/YStatusBadge.vue
  • Data Workbench renderer 与 runtime fixture tests

YoyoBoot · 从真实项目走向可复用能力