<template> <view> <view class="width90"> <view class="flright fotct"> <image class="coupon-img" :src="imageUrl+couponsDetails.highDiscount.discountImg"></image> </view> <view class="coupon-mes mart10" style="margin-right: 90px;"> <view class="fcor333 fontwig6 font24 width100 text2">{{couponsDetails.highDiscount.discountName}}</view> <view class="fcor666 font13 width100 mart5"> 活动截止时间:{{salesEndTime | formatDate('-')}}</view> </view> <view class="fcor666 font13 width100 mart5"> 领取有效期:{{couponsDetails.highDiscount.effectiveDay}}天 </view> </view> <view class="line1 mart15"></view> <button class="coupne-btn width60w mart20 marb20" v-if="userInfo == 1" lang="zh_CN" @click="getuserinfo" withCredentials="true">点击领取</button> <button class="coupne-btn width60w mart20 marb20" v-else @click="receiveDiscount">点击领取</button> <view class="width90 mart10 fcor666">去使用</view> <view v-if="minecoupones == '' " class="mart60 fotct font14 fcor666"> <image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> </view> <view class="product-list mart20 width90"> <view class="product" v-for="product in minecoupones" :key="product.id" @tap="toGoods(product.highCoupon.id)"> <image mode="widthFix" :src="imageUrl+product.highCoupon.couponImg"></image> <view class="name">{{ product.highCoupon.couponName }}</view> <view class="info" v-if="product.highCoupon.payType == 1"> <view class="price"> ¥{{ product.highCoupon.discountPrice}} </view> <view class="slogan" v-if="product.highCoupon.discountPrice !== product.highCoupon.salesPrice"> ¥{{ product.highCoupon.salesPrice}} </view> </view> <view class="info" v-else> <view class="price"> <image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png"> </image>{{ product.highCoupon.discountPrice*100}} </view> <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>{{ product.highCoupon.salesPrice*100}} </view> </view> </view> </view> <view class="width100 height60"></view> <!-- <button class="coupne-btn width100" v-if="userInfo == 1" open-type="getUserInfo" lang="zh_CN" @getuserinfo="getuserinfo" withCredentials="true">点击领取</button> <button class="coupne-btn width100" v-else @click="receiveDiscount">点击领取</button> --> <!-- <authorize></authorize> --> </view> </template> <script> import { getCouponByDiscount, getDiscountByQrCode, receiveDiscount, HandleCode, getUserInfo } from '../../../Utils/Api.js'; // import authorize from '../../../components/Authorize'; let app = getApp(); export default { // components: { // authorize // }, data() { return { minecoupones: [], imageUrl: app.globalData.imgUrl, imagewxUrl: app.globalData.imageWxImg, imgadres:'noorder.png', pageNum: 1, pageSize: 10, isNoMoreData: false, couponsDetails: '', salesEndTime: '', codes: '', userInfo: '' } }, filters: { //过滤器 用于格式化时间 formatDate: function(value, spe = '/') { let data = new Date(value); let year = data.getFullYear(); let month = data.getMonth() + 1; let day = data.getDate(); let h = data.getHours(); let mm = data.getMinutes(); let s = data.getSeconds(); month = month >= 10 ? month : "0" + month; day = day >= 10 ? day : "0" + day; h = h >= 10 ? h : "0" + h; mm = mm >= 10 ? mm : "0" + mm; s = s >= 10 ? s : "0" + s; return `${year}${spe}${month}${spe}${day}`; } }, onLoad(options) { if (app.globalData.userInfo) { this.userInfo = 2; } else { this.userInfo = 1; } uni.login({ provider: 'weixin', success: function(loginRes) { app.globalData.code = loginRes.code; // 请求接口 let params = { code: app.globalData.code } HandleCode(params).then(res => { if (res.return_code == '000000') { app.globalData.openId = res.return_data.openId; } }) } }) var arr1 = decodeURIComponent(options.q); var arr2 = arr1.split('='); this.codes = arr2[2]; this.getDiscountByQrCode(); }, methods: { //获取卡券详情 getDiscountByQrCode() { let params = { code: this.codes } getDiscountByQrCode(params).then(res => { if (res.return_code == '000000') { this.couponsDetails = res.return_data; this.salesEndTime = res.return_data.highDiscount.salesEndTime; this.getCouponByDiscount(res.return_data.highDiscount.id); } }) }, //根据优惠券查询卡券列表 getCouponByDiscount(item) { let params = { discountId: item } getCouponByDiscount(params).then(res => { if (res.return_code == '000000') { this.minecoupones = res.return_data; } }) }, //领取 receiveDiscount() { uni.showLoading({ title: '领取中...' }) let params = { codeId: this.couponsDetails.highDiscountAgentCode.id } receiveDiscount(params).then(res => { if (res.return_code == '000000') { uni.hideLoading(); uni.showToast({ icon: 'none', title: res.return_data, duration: 2000 }) } else { uni.hideLoading(); uni.showToast({ icon: 'none', title: res.return_msg, duration: 2000 }) } }) }, //获取登陆信息 getuserinfo() { let that = this; // wx.login({ // success(res) { // if (res.code) { // 发起网络请求 // var code = res.code; // 获取微信用户信息 uni.getUserProfile({ desc: '登录中...', success: function(res) { let params = { openId: app.globalData.openId, iv: res.iv, encryptedData: res.encryptedData } getUserInfo(params).then(res => { if (res.return_code == '000000') { uni.hideLoading(); app.globalData.userInfo = res .return_data .object .highUser; app.globalData.token = res .return_data.uniqueCode; uni.setStorage({ key: "user", data: res.return_data .object .highUser }) uni.setStorage({ key: "token", data: res.return_data .uniqueCode }) that.receiveDiscount(); that.userInfo = 2; } else { uni.hideLoading(); uni.showToast({ title: res.return_msg, icon: 'none', duration: 2000 }) } }); }, fail: res => { uni.showToast({ title: "微信登录授权失败", icon: "none" }); } }) // } else { // uni.showToast({ // title: "微信登录授权失败", // icon: "none" // }); // } // } // }) }, //商品跳转 toGoods(e) { if (app.globalData.userInfo) { uni.navigateTo({ url: '../../order/confirmation?id=' + e }) } else { uni.showToast({ icon: 'none', title: '请点击领取后再使用', duration: 2000 }) } } } } </script> <style lang="scss"> .coupon-mes { // margin-right: 90px; } .coupon-img { width: 80px; height: 80px; } .product-list { display: flex; justify-content: space-between; flex-wrap: wrap; .product { width: 48%; border-radius: 20upx; background-color: #fff; margin: 0 0 15upx 0; box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.1); image { width: 100%; border-radius: 20upx 20upx 0 0; } .name { width: 92%; padding: 8upx 4%; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; text-align: justify; overflow: hidden; font-size: 30upx; } .info { display: flex; justify-content: space-between; align-items: flex-end; 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 { background-color: red; color: #FFFFFF; } </style>