SystemStatus

List of services with a colored state dot and a value.

Jump to API reference

Import

Vue
import { UiSystemStatus } from '@ziyarago/ui/vue'

Services

Booking API99.98%
Payments97.2%
SMS gatewayDown
Vue
<UiSystemStatus
  :items="[{ name: 'Booking API', value: '99.98%', state: 'ok' }, { name: 'Payments', value: '97.2%', state: 'warn' }, { name: 'SMS gateway', value: 'Down', state: 'down' }]"
 />

API reference

List of services with a status dot and a value such as uptime or latency.

Props

PropType and valuesDefaultDescription
itemsrequired{ name: string; value: string; state?: 'ok' | 'warn' | 'down' }[][]Services. state sets the color: ok green (default), warn amber, down red.