menduner-mall-uniapp/pages/pay/prizePage.vue

<!--  -->
<template>
  <view class="box">
    <p v-for="(k, i) in prizeData" :key="i" class="color-primary ss-m-t-20">
      {{ k.prize.prompt }}
    </p>
    <view class="tip ss-m-t-10">凭此房券在规定有效期内可享受免费住宿一晚。</view>
    <view class="tip ss-m-t-2">请提供收货地址，以便安排房券派送。</view>
    <view class="color-999 ss-m-t-15">(注：10天内未领取的，则视为主动放弃当前奖品)</view>
    <!-- 收货地址 -->
    <AddressSelection v-model="addressState" class="addressBox" />
  </view>
</template>
<script setup>
import AddressSelection from '@/view/mall/components/confirm_order/addressSelection.vue'
const props = defineProps({
  prizeData: {
    type: Array,
    default: () => []
  }
})

const addressState = ref({
  addressInfo: {}, // 选择的收货地址
  deliveryType: undefined, // 收货方式：1-快递配送，2-门店自提
  isPickUp: true, // 门店自提是否开启
  pickUpInfo: {}, // 选择的自提门店信息
  receiverName: '', // 收件人名称
  receiverMobile: '', // 收件人手机
});
</script>
<style lang="scss" scoped>
.color-primary {
  color: #00B760;
  font-size: 40rpx;
}
.color-999 {
  color: #999;
  font-size: 26rpx;
}
.box {
  .tip {
    font-size: 28rpx;
    font-weight: bold;
  }
  .addressBox {
    margin-bottom: 20px;
  }
}
</style>