<template>
  <swiper class="swiper" :style="{ '--banner-height': height }" circular :indicator-dots="true" autoplay
    :interval="4000" :duration="500">
    <block v-for="(v, i) in list" :key="i">
      <swiper-item>
        <image :src="v.imgUrl" mode="aspectFill" />
      </swiper-item>
    </block>
  </swiper>
  <!-- 等待商家付款 -->
	<!-- #ifdef  MP-WEIXIN -->
  <view class="wait-mch">
    <view class="wait-title">请等待商家发起收款</view>
  </view>
	<!-- #endif -->
</template>

<script setup>
const props = defineProps({
  list: { type: Array, default: [] },
  // interval: { type: [String, Number] }, 暂时写死轮播时间
  height: { type: String, default: '88vh' }
})
</script>

<style lang="scss" scoped>
.uni-margin-wrap {
  width: 100%;
}

.swiper {
  height: var(--banner-height) !important;
}

.swiper-item {
  display: block;
  height: calc(100% - 150rpx)
}

image {
  width: 100%;
  height: 100%;
}
.wait-mch{

  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 150rpx;
 
  border-radius:  32rpx 32rpx;
  .wait-title{
    font-size: 45rpx;
    font-weight: 700;
    color:$v-primary;
    letter-spacing: 2px;
  }
}
</style>
