| 1 | <template> |
| 2 | <div v-if="alert.assets?.length" class="flex flex-col gap-2"> |
| 3 | <CardEntity v-for="asset in alert.assets" :key="asset.id" size="small" embedded> |
| 4 | <template #header-main>#{{ asset.id }} - {{ asset.asset_name }}</template> |
| 5 | <template #header-extra>{{ asset.index_name }}</template> |
| 6 | <template #default> |
| 7 | <div class="flex flex-wrap gap-2"> |
| 8 | <Chip size="small" :value="asset.agent_id" label="Agent ID" /> |
| 9 | <Chip |
| 10 | v-if="asset.velociraptor_id" |
| 11 | size="small" |
| 12 | :value="asset.velociraptor_id" |
| 13 | label="Velociraptor ID" |
| 14 | /> |
| 15 | </div> |
| 16 | </template> |
| 17 | </CardEntity> |
| 18 | </div> |
| 19 | |
| 20 | <n-card v-else-if="alert.asset_name" size="small"> |
| 21 | <template #header> |
| 22 | <div class="text-secondary text-sm">Asset name</div> |
| 23 | </template> |
| 24 | {{ alert.asset_name }} |
| 25 | </n-card> |
| 26 | |
| 27 | <n-empty v-else description="No assets found" class="min-h-50 justify-center" /> |
| 28 | </template> |
| 29 | |
| 30 | <script setup lang="ts"> |
| 31 | import type { Alert } from "@/types/alerts" |
| 32 | import { NCard, NEmpty } from "naive-ui" |
| 33 | import CardEntity from "@/components/common/cards/CardEntity.vue" |
| 34 | import Chip from "@/components/common/Chip.vue" |
| 35 | |
| 36 | defineProps<{ |
| 37 | alert: Alert |
| 38 | }>() |
| 39 | </script> |