2021-07-13 12:16:11 +08:00

40 lines
752 B
Vue

<template>
<span class="badge rounded-pill" :class=" 'bg-' + color ">{{ text }}</span>
</template>
<script>
export default {
props: {
status: Number
},
computed: {
color() {
if (this.status === 0) {
return "danger"
} else if (this.status === 1) {
return "primary"
} else {
return "secondary"
}
},
text() {
if (this.status === 0) {
return "Down"
} else if (this.status === 1) {
return "Up"
} else {
return "Unknown"
}
},
}
}
</script>
<style scoped>
span {
width: 45px;
}
</style>