WebIndex/components/card/ArticleDefaultImage.vue

<script setup lang="ts">
defineProps<{
  id: string
}>()
</script>

<template>
  <img src="~/assets/images/common/1.jpg" alt="" v-if="id === '1'"/>
  <img src="~/assets/images/common/2.jpg" alt="" v-else-if="id === '2'"/>
  <img src="~/assets/images/common/3.jpg" alt="" v-else-if="id === '3'"/>
  <img src="~/assets/images/common/4.jpg" alt="" v-else-if="id === '4'"/>
  <img src="~/assets/images/common/5.jpg" alt="" v-else-if="id === '5'"/>
  <img src="~/assets/images/common/6.jpg" alt="" v-else-if="id === '6'"/>
  <img src="~/assets/images/common/7.jpg" alt="" v-else-if="id === '7'"/>
</template>

<style scoped>
img {
  @apply aspect-[16/10] w-full h-auto object-cover object-center
}
</style>