WebIndex/components/card/ArticleDefaultImage.vue

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

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

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