<template>
  <div class="twoBanner" v-if="list.length > 0">
    <ul>
      <li v-for="(item, index) in list" :key="index">
        <LayoutLink :href="item.url" :report="{PAGE_URL, ...item.reportParams}"> 
          <ImageFormat :lazy="false" :src="item.src" :alt="item.alt" :width="344" :height="160" />
        </LayoutLink>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'twoBanner',
  props: {
    list: {
      type: Array,
      default: [],
    },
    PAGE_URL: {
      type: String,
    }
  },
  methods: {
    // jump(item) {
    //   const { src, url } = item;
    //   console.log(src);
    //   console.log(url);
    // }
  }
};
</script>

<style lang="scss" scoped>
.twoBanner {
  ul {
    display: flex;
    justify-content: space-between;
    li {
      width: 49%;
      img {
        max-width: 100%;
        display: block;
        border-radius: 16px;
      }
    }
  }
}
</style>