<template>
  <NuxtLink
    :to="`/yj/${itemData.id}`"
    class="relative block box-border rounded-xl pb-15 shrink-0 overflow-hidden bg-white border border-[#DFE0E4]"
  >
    <van-image
      :src="formatImgSrc(itemData.homeHotPicturesAfterConvert)"
      width="100%"
      fit="cover"
      class="w-full object-cover aspect-[267/150] relative"
    >
      <div
        v-if="itemData.isOriginal === 1"
        class="absolute top-0 right-0 h-28 w-60 bg-[#ffffff80] rounded-bl-xl flex items-center justify-center"
      >
        <img
          src="~/assets/img/home/original_label.png"
          class="inline-block h-20 object-cover"
        />
      </div>
    </van-image>
    <div class="px-10">
      <div class="truncate w-full mt-8 font-semibold text-black text-base">
        {{ itemData.projectTitle }}
      </div>
      <div class="truncate w-full mt-8 text-black-3 text-sm">
        {{ itemData.remarks }}
      </div>
    </div>
  </NuxtLink>
</template>

<script setup>
defineProps({
  itemData: {
    type: Object,
    default: () => ({}),
  },
});
</script>

<style lang="scss" scoped></style>
