<script setup lang="ts">

import type {CmsAd} from "~/api/cms/cmsAd/model";
import {getCmsAd} from "~/api/cms/cmsAd";

const ad422 = ref<CmsAd>();
const isMobile = useIsMobile();

// 请求数据
const reload = async () => {
  getCmsAd(422).then(res => {
    if (isMobile.value) {
      res.height = '123';
    }
    ad422.value = res;
  });
}

onMounted(() => {
  reload();
});

</script>

<template>
  <div v-if="ad422" v-for="(item,index) in ad422.imageList" :key="index">
    <nuxt-link :to="ad422.style" class="flex justify-center items-center relative my-4">
      <el-image class="absolute" :src="item.url" :style="`width: ${ad422.width ? ad422.width + 'px' : 'auto'}; height: ${ad422.height ? ad422.height + 'px' : 'auto'};`" />
    </nuxt-link>
  </div>
</template>

<style scoped lang="scss">

</style>
