Files
Kdm-Product-Mobile/src/components/common/StatusBadge.vue

29 lines
570 B
Vue

<template>
<span
class="text-xs font-medium px-3 py-1 rounded-full"
:class="badgeClass"
>
{{ status }}
</span>
</template>
<script setup>
import { computed } from 'vue'
const props = defineProps({
status: String
})
const badgeClass = computed(() => {
switch (props.status) {
case 'Digunakan':
return 'bg-green-100 text-green-600'
case 'Maintenance':
return 'bg-yellow-100 text-yellow-700'
case 'Ready to use':
return 'bg-blue-100 text-blue-600'
default:
return 'bg-gray-100 text-gray-600'
}
})
</script>