多维表格
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

31 lines
821 B

<script lang="ts" setup>
import { computed } from 'vue';
const props = defineProps<{
color: string
}>()
</script>
<template>
<div class="badge-color" :class="{
'border-purple-500': props.color === 'purple',
'bg-purple-100': props.color === 'purple',
'border-blue-500': props.color === 'blue',
'bg-blue-100': props.color === 'blue',
'border-green-500': props.color === 'green',
'bg-green-100': props.color === 'green',
'border-orange-500': props.color === 'orange',
'bg-orange-100': props.color === 'orange',
'border-yellow-500': props.color === 'yellow',
'bg-yellow-100': props.color === 'yellow',
}">
<slot></slot>
</div>
</template>
<style>
.badge-color {
@apply mt-1 border w-23 h-6 rounded-lg;
}
</style>