hjyd-mobile/src/components/detail/Img.vue

<template>
  <div class="card_detail_img" v-if="pic1">
    <div class="double_wrap" v-if="double">
      <img v-lazy="pic1" alt="" />
      <img v-lazy="pic2" alt="" />
    </div>
    <img v-else v-lazy="pic1" class="sing_img" alt="" />
  </div>
</template>

<script setup>
const props = defineProps({
  double: Boolean,
  pic1: {},
  pic2: {},
})
</script>

<style lang="scss" scoped>
.card_detail_img {
  padding: 0 21px;
  .double_wrap {
    display: grid;
    grid-template-rows: repeat(1, 1fr);
    grid-template-columns: repeat((2, 1fr));
    align-items: center;
    justify-content: space-between;
    column-gap: 19px;
    margin-bottom: 10px;
    img {
      width: 100%;
      height: auto;
      border-radius: 4px;
    }
  }
  .sing_img {
    width: 100%;
    height: auto;
    border-radius: 4px;
  }
}
</style>