You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
high-mini/subPages/shareCounpon/shareCounpon.vue

91 lines
2.1 KiB

<template>
<view>
<view class="imgshead"></view>
<view class="imgscontent">
<view class="conts paddtop13">
<view v-for="(item,index) in couponList" :key="index" class="conpon border-r height90 flleft marb10 ">
<view class="width94 font15 fontwig6 fotlt fcorfff mart5">
96折星巴克优惠券
</view>
<view class="width80 fotct backcor99 mart5 linec6" style="opacity: 0.2;"></view>
<view class="width90 font10 fotlt fcorfff mart3">
满30-5
</view>
<view class="width90 font10 fotlt fcorfff mart3">
有效时间: 30
</view>
<view class="width90 font10 fotlt fcorfff mart3">
截止时间:2023年2月31日
</view>
</view>
</view>
</view>
<view class="imgsfoot">
<view class="width100 height50"></view>
<view class="couponBtn fontlet font24 fotct fontwig6 width60w height45l">一键领取</view>
</view>
</view>
</template>
<script>
let app = getApp();
export default {
data() {
return {
imagewxUrl: app.globalData.imageWxImg,
imgadres: 'share1.png',
imgadres1: 'share2.png',
couponList: [1, 2, 3, 4, 5, 6]
}
},
methods: {
}
}
</script>
<style lang="scss">
.imgshead {
background-image: url(https://hsgcs.dctpay.com/filesystem/wxApplets/share1.png);
background-size: 100% 230px;
height: 230px;
background-repeat: no-repeat;
}
.imgscontent {
background-image: url(https://hsgcs.dctpay.com/filesystem/wxApplets/share2.png);
background-size: 100% 320px;
height: 320px;
background-repeat: no-repeat;
.conts {
width: 74%;
margin-left: 13%;
}
}
.imgsfoot {
background-image: url(https://hsgcs.dctpay.com/filesystem/wxApplets/share3.png);
background-size: 100% 250px;
height: 250px;
background-repeat: no-repeat;
}
.conpon {
background: linear-gradient(to bottom, #fe8e3f, #f14f21);
width: 48%;
margin-right: 1%;
margin-left: 1%;
}
.couponBtn {
letter-spacing: 3px;
color: #ff482d;
border-radius: 25px;
background: linear-gradient(to right, #fea03c, #f7dd6a);
}
</style>