parent
4ae82dd51c
commit
9fccb65e10
@ -1,200 +1,224 @@ |
|||||||
<template> |
<template> |
||||||
<view> |
<view> |
||||||
<view class="width90"> |
<view class="width90"> |
||||||
<view class="flright fotct"> |
<view class="flright fotct"> |
||||||
<image class="coupon-img" :src="imageUrl+couponsDetails.highDiscount.discountImg"></image> |
<image class="coupon-img" :src="imageUrl+couponsDetails.highDiscount.discountImg"></image> |
||||||
</view> |
</view> |
||||||
<view class="coupon-mes mart10" style="margin-right: 90px;"> |
<view class="coupon-mes mart10" style="margin-right: 90px;"> |
||||||
<view class="fcor333 fontwig6 font24 width100 text2">{{couponsDetails.highDiscount.discountName}}</view> |
<view class="fcor333 fontwig6 font24 width100 text2">{{couponsDetails.highDiscount.discountName}}</view> |
||||||
<view class="fcor666 font13 width100 mart5"> |
<view class="fcor666 font13 width100 mart5"> |
||||||
使用截止时间:{{salesEndTime | formatDate('-')}}</view> |
使用截止时间:{{salesEndTime | formatDate('-')}}</view> |
||||||
</view> |
</view> |
||||||
<view class="fcor666 font13 width100 mart5"> |
<view class="fcor666 font13 width100 mart5"> |
||||||
领取有效期:{{couponsDetails.highDiscount.effectiveDay}}天 |
领取有效期:{{couponsDetails.highDiscount.effectiveDay}}天 |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="line1 mart15"></view> |
<view class="line1 mart15"></view> |
||||||
<view class="width90 mart10 fcor666">可购买的商品</view> |
<view class="width90 mart10 fcor666">可购买的商品</view> |
||||||
<view v-if="minecoupones == '' " class="mart60 fotct font14 fcor666"> |
<view v-if="minecoupones == '' " class="mart60 fotct font14 fcor666"> |
||||||
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> |
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> |
||||||
</view> |
</view> |
||||||
<view class="product-list mart20 width90"> |
<view class="product-list mart20 width90"> |
||||||
<view class="product" v-for="product in minecoupones" :key="product.id" |
<view class="product" v-for="product in minecoupones" :key="product.id" |
||||||
@tap="toGoods(product.highCoupon.id)"> |
@tap="toGoods(product.highCoupon.id)"> |
||||||
<image mode="widthFix" :src="imageUrl+product.highCoupon.couponImg"></image> |
<image mode="widthFix" :src="imageUrl+product.highCoupon.couponImg"></image> |
||||||
<view class="name">{{ product.highCoupon.couponName }}</view> |
<view class="name">{{ product.highCoupon.couponName }}</view> |
||||||
<view class="info" v-if="product.highCoupon.payType == 1"> |
<view class="info" v-if="product.highCoupon.payType == 1"> |
||||||
<view class="price"> |
<view class="price"> |
||||||
￥{{ product.highCoupon.discountPrice}} |
￥{{ product.highCoupon.discountPrice}} |
||||||
</view> |
</view> |
||||||
<view class="slogan" v-if="product.highCoupon.discountPrice !== product.highCoupon.salesPrice"> |
<view class="slogan" v-if="product.highCoupon.discountPrice !== product.highCoupon.salesPrice"> |
||||||
￥{{ product.highCoupon.salesPrice}} |
￥{{ product.highCoupon.salesPrice}} |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="info" v-else> |
<view class="info" v-else> |
||||||
<view class="price"> |
<view class="price"> |
||||||
<image style="width: 15px;height: 15px;vertical-align: sub;" |
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png"> |
||||||
src="../../../static/img/jfx.png"> |
</image>{{ product.highCoupon.discountPrice*100}} |
||||||
</image>{{ product.highCoupon.discountPrice*100}} |
</view> |
||||||
</view> |
<view class="slogan" v-if="product.highCoupon.discountPrice !== product.highCoupon.salesPrice"> |
||||||
<view class="slogan" v-if="product.highCoupon.discountPrice !== product.highCoupon.salesPrice"> |
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfh.png"> |
||||||
<image style="width: 15px;height: 15px;vertical-align: sub;" |
</image>{{ product.highCoupon.salesPrice*100}} |
||||||
src="../../../static/img/jfh.png"> |
</view> |
||||||
</image>{{ product.highCoupon.salesPrice*100}} |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
<view class="width90 mart10 fcor666" v-if="videourl != ''">视频教程</view> |
||||||
</view> |
<view class="width80 mart10 marb30" v-if="videourl != ''"> |
||||||
</view> |
<yy-video-player :auto-play="false" :url="imageUrl+imagedess1" :poster="poster" :show-back-btn="true"> |
||||||
</template> |
</yy-video-player> |
||||||
|
</view> |
||||||
<script> |
|
||||||
import { |
</view> |
||||||
getCouponByDiscount, |
</template> |
||||||
getDiscountByUserDiscountId |
|
||||||
} from '../../../Utils/Api.js'; |
<script> |
||||||
let app = getApp(); |
import { |
||||||
export default { |
getCouponByDiscount, |
||||||
data() { |
getDiscountByUserDiscountId, |
||||||
return { |
getCmsContent |
||||||
minecoupones: [], |
} from '../../../Utils/Api.js'; |
||||||
imageUrl: app.globalData.imgUrl, |
import xiaoVideoElement from '../../../components/yy-video-player/yy-video-player.nvue' |
||||||
imagewxUrl: app.globalData.imageWxImg, |
let app = getApp(); |
||||||
imgadres:'noorder.png', |
export default { |
||||||
pageNum: 1, |
components: { |
||||||
pageSize: 10, |
xiaoVideoElement |
||||||
isNoMoreData: false, |
}, |
||||||
couponsDetails: '', |
data() { |
||||||
salesEndTime: '', |
return { |
||||||
couponId: '' |
minecoupones: [], |
||||||
} |
imageUrl: app.globalData.imgUrl, |
||||||
}, |
imagewxUrl: app.globalData.imageWxImg, |
||||||
filters: { |
imgadres: 'noorder.png', |
||||||
//过滤器 用于格式化时间 |
imagedess1: '/CMS/html/11641540903873.mp4', |
||||||
formatDate: function(value, spe = '/') { |
pageNum: 1, |
||||||
let data = new Date(value); |
pageSize: 10, |
||||||
let year = data.getFullYear(); |
isNoMoreData: false, |
||||||
let month = data.getMonth() + 1; |
couponsDetails: '', |
||||||
let day = data.getDate(); |
salesEndTime: '', |
||||||
let h = data.getHours(); |
couponId: '', |
||||||
let mm = data.getMinutes(); |
videourl: '' //视频地址 |
||||||
let s = data.getSeconds(); |
} |
||||||
month = month >= 10 ? month : "0" + month; |
}, |
||||||
day = day >= 10 ? day : "0" + day; |
filters: { |
||||||
h = h >= 10 ? h : "0" + h; |
//过滤器 用于格式化时间 |
||||||
mm = mm >= 10 ? mm : "0" + mm; |
formatDate: function(value, spe = '/') { |
||||||
s = s >= 10 ? s : "0" + s; |
let data = new Date(value); |
||||||
return `${year}${spe}${month}${spe}${day}`; |
let year = data.getFullYear(); |
||||||
} |
let month = data.getMonth() + 1; |
||||||
}, |
let day = data.getDate(); |
||||||
onLoad(option) { |
let h = data.getHours(); |
||||||
this.couponId = option.id; |
let mm = data.getMinutes(); |
||||||
this.getDiscountByUserDiscountId(); |
let s = data.getSeconds(); |
||||||
}, |
month = month >= 10 ? month : "0" + month; |
||||||
methods: { |
day = day >= 10 ? day : "0" + day; |
||||||
//获取卡券详情 |
h = h >= 10 ? h : "0" + h; |
||||||
getDiscountByUserDiscountId() { |
mm = mm >= 10 ? mm : "0" + mm; |
||||||
let params = { |
s = s >= 10 ? s : "0" + s; |
||||||
userDiscountId: this.couponId |
return `${year}${spe}${month}${spe}${day}`; |
||||||
} |
} |
||||||
getDiscountByUserDiscountId(params).then(res => { |
}, |
||||||
if (res.return_code == '000000') { |
onLoad(option) { |
||||||
this.couponsDetails = res.return_data; |
this.couponId = option.id; |
||||||
this.salesEndTime = res.return_data.useEndTime; |
this.getDiscountByUserDiscountId(); |
||||||
this.getCouponByDiscount(res.return_data.highDiscount.id); |
this.getCmsContentvideo(); |
||||||
} |
}, |
||||||
}) |
methods: { |
||||||
}, |
//获取视频资料 |
||||||
//根据优惠券查询卡券列表 |
getCmsContentvideo() { |
||||||
getCouponByDiscount(item) { |
let params = { |
||||||
let params = { |
regionId: app.globalData.cityId, |
||||||
discountId: item |
categoryCode: 'CMS_H5_VIDEO' |
||||||
} |
} |
||||||
getCouponByDiscount(params).then(res => { |
getCmsContent(params).then(res => { |
||||||
if (res.return_code == '000000') { |
if (res.return_code == '000000') { |
||||||
this.minecoupones = res.return_data; |
this.videourl = res.return_data; |
||||||
} |
} |
||||||
}) |
}); |
||||||
}, |
}, |
||||||
//商品跳转 |
//获取卡券详情 |
||||||
toGoods(e) { |
getDiscountByUserDiscountId() { |
||||||
uni.navigateTo({ |
let params = { |
||||||
url: '../../order/confirmation?id=' + e |
userDiscountId: this.couponId |
||||||
}) |
} |
||||||
// uni.navigateTo({ |
getDiscountByUserDiscountId(params).then(res => { |
||||||
// url: '../../goods/goods?id='+e |
if (res.return_code == '000000') { |
||||||
// }); |
this.couponsDetails = res.return_data; |
||||||
} |
this.salesEndTime = res.return_data.useEndTime; |
||||||
} |
this.getCouponByDiscount(res.return_data.highDiscount.id); |
||||||
} |
} |
||||||
</script> |
}) |
||||||
|
}, |
||||||
<style lang="scss"> |
//根据优惠券查询卡券列表 |
||||||
.coupon-mes { |
getCouponByDiscount(item) { |
||||||
// margin-right: 90px; |
let params = { |
||||||
} |
discountId: item |
||||||
|
} |
||||||
.coupon-img { |
getCouponByDiscount(params).then(res => { |
||||||
width: 80px; |
if (res.return_code == '000000') { |
||||||
height: 80px; |
this.minecoupones = res.return_data; |
||||||
} |
} |
||||||
|
}) |
||||||
.product-list { |
}, |
||||||
display: flex; |
//商品跳转 |
||||||
justify-content: space-between; |
toGoods(e) { |
||||||
flex-wrap: wrap; |
uni.navigateTo({ |
||||||
|
url: '../../order/confirmation?id=' + e |
||||||
.product { |
}) |
||||||
width: 48%; |
// uni.navigateTo({ |
||||||
border-radius: 20upx; |
// url: '../../goods/goods?id='+e |
||||||
background-color: #fff; |
// }); |
||||||
margin: 0 0 15upx 0; |
} |
||||||
box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.1); |
} |
||||||
|
} |
||||||
image { |
</script> |
||||||
width: 100%; |
|
||||||
border-radius: 20upx 20upx 0 0; |
<style lang="scss"> |
||||||
} |
.coupon-mes { |
||||||
|
// margin-right: 90px; |
||||||
.name { |
} |
||||||
width: 92%; |
|
||||||
padding: 8upx 4%; |
.coupon-img { |
||||||
display: -webkit-box; |
width: 80px; |
||||||
-webkit-box-orient: vertical; |
height: 80px; |
||||||
-webkit-line-clamp: 1; |
} |
||||||
text-align: justify; |
|
||||||
overflow: hidden; |
.product-list { |
||||||
font-size: 30upx; |
display: flex; |
||||||
} |
justify-content: space-between; |
||||||
|
flex-wrap: wrap; |
||||||
.info { |
|
||||||
display: flex; |
.product { |
||||||
justify-content: space-between; |
width: 48%; |
||||||
align-items: flex-end; |
border-radius: 20upx; |
||||||
width: 92%; |
background-color: #fff; |
||||||
padding: 10upx 4% 10upx 4%; |
margin: 0 0 15upx 0; |
||||||
|
box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.1); |
||||||
.price { |
|
||||||
color: #e65339; |
image { |
||||||
font-size: 30upx; |
width: 100%; |
||||||
font-weight: 600; |
border-radius: 20upx 20upx 0 0; |
||||||
} |
} |
||||||
|
|
||||||
.slogan { |
.name { |
||||||
color: #807c87; |
width: 92%; |
||||||
font-size: 24upx; |
padding: 8upx 4%; |
||||||
text-decoration: line-through; |
display: -webkit-box; |
||||||
margin-right: 10px; |
-webkit-box-orient: vertical; |
||||||
} |
-webkit-line-clamp: 1; |
||||||
} |
text-align: justify; |
||||||
} |
overflow: hidden; |
||||||
} |
font-size: 30upx; |
||||||
|
} |
||||||
.coupne-btn { |
|
||||||
position: fixed; |
.info { |
||||||
bottom: 0px; |
display: flex; |
||||||
background-color: red; |
justify-content: space-between; |
||||||
color: #FFFFFF; |
align-items: flex-end; |
||||||
border-radius: 0px; |
width: 92%; |
||||||
} |
padding: 10upx 4% 10upx 4%; |
||||||
|
|
||||||
|
.price { |
||||||
|
color: #e65339; |
||||||
|
font-size: 30upx; |
||||||
|
font-weight: 600; |
||||||
|
} |
||||||
|
|
||||||
|
.slogan { |
||||||
|
color: #807c87; |
||||||
|
font-size: 24upx; |
||||||
|
text-decoration: line-through; |
||||||
|
margin-right: 10px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.coupne-btn { |
||||||
|
position: fixed; |
||||||
|
bottom: 0px; |
||||||
|
background-color: red; |
||||||
|
color: #FFFFFF; |
||||||
|
border-radius: 0px; |
||||||
|
} |
||||||
</style> |
</style> |
||||||
|
|||||||
Loading…
Reference in new issue