26 lines
788 B
Vue
26 lines
788 B
Vue
<script setup>
|
|
defineProps({ card: Object });
|
|
import { twMerge } from "tailwind-merge";
|
|
</script>
|
|
<template>
|
|
<div class="stats justify-start shadow bg-slate-200">
|
|
<div class="stat w-24 p-2">
|
|
<div class="bg-gray-600 rounded-lg p-2 shadow-lg shadow-slate-400">
|
|
<div class="text-sm text-slate-100">{{ card.title }}</div>
|
|
</div>
|
|
</div>
|
|
<div v-for="item in card.groups" :key="item.code" class="stat w-12 p-2">
|
|
<FontAwesomeIcon
|
|
:icon="['fas', 'circle']"
|
|
:class="
|
|
twMerge(
|
|
'text-2xl border-2 border-slate-400 rounded-full',
|
|
item.status ? item.status.trim() : 'text-slate-400'
|
|
)
|
|
"
|
|
/>
|
|
<span class="text-sm text-slate-800">{{ item.code }}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|