瀏覽代碼

[添加折扣卡的功能][增加]:[首页添加折扣卡的入口,添加折扣卡的列表和详情]

tags/广东版3.2.1
meo 6 年之前
父節點
當前提交
a5b621798c
共有 16 個檔案被更改,包括 1526 行新增2 行删除
  1. +3
    -1
      app.json
  2. 二進制
      assets/img/discountcard.png
  3. +31
    -0
      components/discountCard/index.js
  4. +6
    -0
      components/discountCard/index.json
  5. +5
    -0
      components/discountCard/index.wxml
  6. +5
    -0
      components/discountCard/index.wxss
  7. +540
    -0
      pages/cardListDetail/CardListDetail.js
  8. +3
    -0
      pages/cardListDetail/CardListDetail.json
  9. +83
    -0
      pages/cardListDetail/CardListDetail.wxml
  10. +435
    -0
      pages/cardListDetail/CardListDetail.wxss
  11. +142
    -0
      pages/discountCardList/discountCardList.js
  12. +7
    -0
      pages/discountCardList/discountCardList.json
  13. +36
    -0
      pages/discountCardList/discountCardList.wxml
  14. +226
    -0
      pages/discountCardList/discountCardList.wxss
  15. +1
    -0
      pages/index/index.json
  16. +3
    -1
      pages/index/index.wxml

+ 3
- 1
app.json 查看文件

@@ -33,7 +33,9 @@
"pages/grade/grade",
"pages/game/index",
"pages/index/gameentry/gentry",
"pages/specialcourtesy/specialcourtesy"
"pages/specialcourtesy/specialcourtesy",
"pages/discountCardList/discountCardList",
"pages/cardListDetail/cardListDetail"
],
"navigateToMiniProgramAppIdList": [
"wx192b7d2e8dcbefd0",


二進制
assets/img/discountcard.png 查看文件

Before After
Width: 391  |  Height: 205  |  Size: 104 KiB

+ 31
- 0
components/discountCard/index.js 查看文件

@@ -0,0 +1,31 @@
// pages/index/sw/index.js
Component({
/**
* 组件的属性列表
*/
properties: {
list: {
value: [],
type: Array
}
},

/**
* 组件的初始数据
*/
data: {
swiperCurrent: 0
},

/**
* 组件的方法列表
*/
ready() {},
methods: {
gotoDiscountCardList:function(){
wx.navigateTo({
url: '/pages/discountCardList/discountCardList',
})
}
}
});

+ 6
- 0
components/discountCard/index.json 查看文件

@@ -0,0 +1,6 @@
{
"component": true,
"usingComponents": {
}
}

+ 5
- 0
components/discountCard/index.wxml 查看文件

@@ -0,0 +1,5 @@
<view class='content' >
<view bindtap='gotoDiscountCardList'>
<image src='./../../assets/img/discountcard.png' mode='widthFix'></image>
</view>
</view>

+ 5
- 0
components/discountCard/index.wxss 查看文件

@@ -0,0 +1,5 @@
.content image{
display: block;
margin: 30rpx auto 0;
border: 1px solid red;
}

+ 540
- 0
pages/cardListDetail/CardListDetail.js 查看文件

@@ -0,0 +1,540 @@
var config = require("../../../config/config.js");
var app = getApp();
const Http = require("../../../utils/HttpBasics");
const util = require("../../../utils/util");

Page({
data: {
data: {
title: null
},
showPage: false,
questions1: null,
questions2: null,
carList: [],
couponChannelId: null,
couponId: null,
orderId: "",
hour: null,
minute: "",
tempFilePaths: null,
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
id: null,
result: [],
end_time: null,
checked: false,
clock: "已经截止",
questionnaire: {},
questionId: null,
widthScreen: null,
moveData: null,
rotateData: null,
alphaData: null,
scaleData: null,
skewData: null,
matrixData: null,
opacity: 0,
queueData: null,
zIndex: 11,
display: "none",
showbutton: false
},
phone: function (e) {
let that = this;
wx.makePhoneCall({
phoneNumber: e.target.dataset.merchantlinkphone
});
},
/**
* 点击提交问题单选
*/
formSubmit: function (e) {
console.log(e);
let that = this;
/**
* 多选
*/
if (e.currentTarget.dataset.flags == 'multi') {
if (that.data.anwserId.length == 0) {
var answserIs = null
} else {
var answserIs = that.data.anwserId.join(",");
}
}
else if (e.currentTarget.dataset.flags == 'single') {
var answserIs = e.detail.value;
}
console.log(answserIs)
console.log(e.currentTarget.dataset.questionid)
Http.post({
url: config.api.answerQuestion,
data: {
answer: answserIs,
questionId: e.currentTarget.dataset.questionid
}
})
.then(res => {
that.closeQuestion();
})
.catch(err => {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
})
},
/**
* 多选
*/
checkboxChange: function (e) {
console.log(e)
this.setData({
anwserId: e.detail.value
})
},

closeQuestion: function () {
let that = this;
that.setData({
display: "none",
zIndex: 11,
opacity: 0
})
setTimeout(function () {
that.orderFunc();
}, 500)
},
/**
* gotopay
*/
gotopay: function () {
let that = this;
that.setData({
queueData: null,
showbutton: true
})
Http.get({
url: config.api.getQuestion,
data: {
couponType: JSON.stringify(that.data.data.type)
}
})
.then(res => {
console.log(res);
if (res.data == undefined) {
that.orderFunc();
that.setData({
flag: false
})
} else if (res.data) {
var animation = wx.createAnimation({});
animation.translate((that.data.widthScreen - that.data.widthScreen), 0).scale(1).opacity(1).step({
duration: 500
})
that.setData({
queueData: animation.export(),
zIndex: 9,
opacity: 1,
display: "block",
questionnaire: JSON.parse(res.data.content),
questionId: res.data.id
});
}
})
.catch(err => {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
})
},

countdown(end_time) {
let that = this;
var EndTime = end_time;
var NowTime = new Date().getTime();
var total_micro_second = EndTime - NowTime || [];
// 渲染倒计时时钟
let obj = that.dateformat(total_micro_second);
if (total_micro_second > 0) {
that.setData({
clock: obj,
day: obj.a1,
hour: obj.b1,
min: obj.c1,
sec: obj.d1,
})
} else {
that.setData({
clock: "00",
day: "00",
hour: "00",
min: "00",
sec: "00",
})
}
setTimeout(function () {
total_micro_second -= 1000;
that.countdown(end_time);
}, 1000)
},

// 时间格式化输出,如11:03 25:19 每1s都会调用一次
dateformat(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 天数
var day = Math.floor(second / 3600 / 24) < 10 ? "0" + Math.floor(second / 3600 / 24) : Math.floor(second / 3600 / 24);
// 小时
var hr = Math.floor(second / 3600 % 24) < 10 ? "0" + Math.floor(second / 3600 % 24) : Math.floor(second / 3600 % 24);
// 分钟
var min = Math.floor(second / 60 % 60) < 10 ? "0" + Math.floor(second / 60 % 60) : Math.floor(second / 60 % 60);
// 秒
var sec = Math.floor(second % 60) < 10 ? "0" + Math.floor(second % 60) : Math.floor(second % 60);

// return day + "天" + hr + "小时" + min + "分钟" + sec + "秒";
return {
a1: day,
b1: hr,
c1: min,
d1: sec
}
},
onLoad(options) {
let that = this;
wx.showLoading({
title: "加载中..."
});
that.setData({
couponChannelId: options.couponChannelId,
couponId: options.couponId,
title: that.data.data.title ? that.data.data.title : '',
});
var parmer = {
url: config.api.couponDetail,
data: {
couponChannelId: options.couponChannelId
}
};
Http.get(parmer)
.then(res => {
if (res.code == 200) {
that.setData({
showPage: true
})
}
if (res.data.endTime) {
that.countdown(res.data.endTime);
//当前时间与优惠券下架时间做计算
var endTime = util.formatTime(res.data.endTime, "yyyy-MM-dd hh:mm:ss");
if (util.timechuo(endTime).indexOf('-') == 0) {
that.setData({
endtime: "活动已结束",
});
} else {
that.setData({
endtime: util.timechuo(endTime)
});
}
}
wx.hideLoading();
that.setData({
data: res.data
});

if (res.data.validType == 1) {
that.setData({
validStartDate: util.formatTime(res.data.validStartDate, "yyyy-MM-dd"),
validEndDate: util.formatTime(res.data.validEndDate, "yyyy-MM-dd"),
});
} else {
that.setData({
validDays: res.data.validDays
});
}
}).catch(err => {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
})
},
/**
* 支付订单更新
*/
payOrderUpdate: (orderId, payOrderId, status, reason, type, _this) => {
let that = this;
// 支付成功
Http.post({
url: config.api.payOrderUpdate,
data: {
payOrderId: payOrderId,
orderId: orderId,
status: status,
reason: reason
}
})
.then(res => {
wx.hideLoading()
// 有价券
if (!type && type != 'free') {
wx.navigateTo({
url: `/pages/order/detail/index?orderId=${
orderId
}`
});
} else if (type == 'free') {
wx.navigateTo({
url: `/pages/order/detail/index?orderId=${
orderId
}`
});
}
})
.catch(err => {
console.log(err);
if (!type) {
setTimeout(function () {
_this.payOrderUpdate(orderId, payOrderId, status, reason, type, _this);
}, 2000)
}
})
},
/**
* 发起支付
*/
orderFunc(flag) {
var that = this;
// wx.showLoading({
// title: "加载中..."
// });
Http.post({
url: config.api.checkPhoneStatus,
data: {}
})
.then(res => {
var data = {
couponChannelId: "" + that.data.couponChannelId,
couponId: "" + that.data.couponId
};
if (that.data.couponChannelId == null) {
var data = {
couponId: "" + that.data.couponId
};
}
/**
* orderSave 下单
*/
return Http.post({
url: config.api.orderSave,
data: data
});
})
.catch(err => {
if (err.code == "2011") {
wx.showToast({
title: "商户信息没找到",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "2013") {
wx.showToast({
title: "商户信息禁用",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "3000") {
wx.showToast({
title: "库存不足",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "3001") {
wx.showToast({
title: "领取达到上限",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "3002") {
wx.showToast({
title: "订单失败",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "3003") {
wx.showToast({
title: "订单不存在",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "3004") {
wx.showToast({
title: "订单不存在",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == "4003") {
wx.showToast({
title: "卡券已作废",
image: "./../../../assets/img/fail.png",
duration: 2000,
mask: false
});
} else if (err.code == 11005) {
/**
* 将值传到用户手机号授权的页面
*
*/
wx.redirectTo({
url: "/pages/getphoneInfo/index?couponChannelId=" +
that.data.couponChannelId +
"&couponId=" +
that.data.couponId
});
} else if (err.code == 11006) {
// 用户手机已加密
wx.redirectTo({
url: "/pages/phoneinput/phoneinput?couponChannelId=" +
that.data.couponChannelId +
"&couponId=" +
that.data.couponId
});
} else {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
}
})
.then(res => {
if (typeof (res) != "undefined") {
let orderId = "" + res.data.id;
that.setData({
orderId: orderId
});
if (res.data.payment > 0) {
// 支付金额不为0
/**
* 支付订单创建
*/
Http.post({
url: config.api.payOrderCreate,
data: {
orderId: orderId
}
}).then(res => {
var payOrderId = "" + res.data.payOrderId;
wx.hideLoading();
wx.requestPayment({
timeStamp: res.data.timeStamp,
nonceStr: res.data.nonceStr,
package: res.data.package,
signType: (res.data.signType) ? res.data.signType : "MD5",
paySign: res.data.paySign,
success: res => {
wx.showLoading({
title: '订单正在处理中...',
})
setTimeout(function () {
wx.hideLoading()
}, 5000)
that.payOrderUpdate(that.data.orderId, payOrderId, 1, '', '', that);
if (res.errMsg == "requestPayment:ok") {
setTimeout(function () {
wx.hideLoading();
}, 2000);
/**
* 用户支付成功以后跳转到券包列表
*/
wx.setStorage({
key: 'couponNum',
data: "couponNum",
})
}
},
fail: res => {
/**
* 支付失败,需要更新订单的状态
*/
that.payOrderUpdate(that.data.orderId, payOrderId, 2, '', 'fail', that);
that.setData({
showbutton: false
})
return;
},
complete: res => { }
});
/// End payment --------
})
.catch(err => {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
})
} else {
// 免费券
that.payOrderUpdate(orderId, "0", 1, '', 'free');
wx.setStorage({
key: 'couponNum',
data: "couponNum"
})
}
}
})
.catch(err => {
wx.showToast({
title: err.message,
icon: 'none',
duration: 2000,
mask: false
});
})
},
onShow() {
this.setData({
showbutton: false
})
},
onShareAppMessage: function (options) {
var that = this;
var shareObj = {
title: that.data.data.title,
path: `/pages/index/index?couponChannelId=${that.data.couponChannelId}&couponId=${that.data.couponId}`,
success: function (res) {
if (res.errMsg == 'shareAppMessage:ok') { }
},
fail: function (error) {
if (res.errMsg == 'shareAppMessage:fail cancel') { } else if (res.errMsg == 'shareAppMessage:fail') { }
}
};
// 来自页面内的按钮的转发
if (options.from == 'button') {
var eData = options.target.dataset.id;
var couponId = options.target.dataset.couponid;
shareObj.path = `/pages/index/index?couponChannelId=${eData}&couponId=${couponId}`;
}
// 返回shareObj
return shareObj;
},

});

+ 3
- 0
pages/cardListDetail/CardListDetail.json 查看文件

@@ -0,0 +1,3 @@
{
"navigationBarTitleText": "卡详情"
}

+ 83
- 0
pages/cardListDetail/CardListDetail.wxml 查看文件

@@ -0,0 +1,83 @@
<view wx:if="{{showPage}}">
<!-- 券的详情页面 -->
<view class='coupons'>
<view class="coupons-body">
<view class='banner'>
<image src='{{data.coverImg}}'></image>
</view>
<view class='coupons_info' style='position:relative;z-index:9'>
<view class='fenxiang'>
<image class="fenxiang" src='./../../../assets/img/fenxiang.png' mode="widthFix"></image>
<button class='share user-motto' data-id='{{data.id}}' data-couponId='{{data.couponId}}' data-title='{{data.title}}' id="shareBtn" open-type="share" hover-class="other-button-hover"></button>
</view>
<view>
<view class='distance' wx:if="{{data.targetAd==2&&data.endTime!=undefined&&data.type!=5}}">
<view style='text-align:center;display:inline-block;'>
<image class='clock' src='./../../../assets/img/clock.png' mode='widthFix'></image>
<text class="qiang">距结束还剩 :</text>
</view>
<view wx:if="{{clock=='已经截止'||data.remainInventory==0||data.status==1}}" class='times'>
<text>{{day}}</text>天
<text>{{hour}}</text>:
<text>{{min}}</text>:
<text>{{sec}}</text>
</view>
<view wx:if="{{clock!='已经截止'&&data.remainInventory!=0}}" class='times'>
<text>{{day}}</text>天
<text>{{hour}}</text>:
<text>{{min}}</text>:
<text>{{sec}}</text>
</view>
</view>
<text class='title'>{{data.title}}</text>
<text class="subTitle">{{data.subTitle}}</text>
<view class='salePriceStr clearfix'>
<view class="fl">售价:
<text class="pri01">{{data.salePriceStr}}</text>
<text class="yuan">元</text>
<text class='throgh' wx:if="{{data.unit==0}}">{{data.priceStr}}元</text>
<text wx:if="{{data.unit==1}}">{{data.priceStr}}小时</text>
</view>
<text class="restNum fr">剩余<text>{{data.remainInventory}}件</text></text>
</view>
<view class='rest' wx:if="{{data.validType==2}}">有效期:自领取之日起
<text class='time'>{{validDays}}</text>天内有效</view>
<view class='rest' wx:if="{{data.validType==1}}">有效期:
<text class='time'>{{validStartDate}}至{{validEndDate}}</text>
</view>
<view class='rest' wx:if="{{data.type==5}}">
<text class='time'>当次有效</text>
</view>
<view class='rest' wx:if="{{data.type==1}}">
<text class='txt01'>使用条件:</text>
<text class='time'>满{{data.usePriceStr}}元可用</text>
</view>
<view class='rest'>
<text class='txt01'>限购条件:</text>
<text class='time'>每人{{data.useLimitQuantity}}张</text>
</view>
</view>
</view>
<view class='posi'>
<view class='posi_logo' wx:for="{{data.merchantVoList}}" wx:key="index">
<view>
<image src='{{item.merchantImgUrl}}'></image>
</view>
<view>
<text>{{item.merchantName}}</text>
<text>{{item.addr}}{{item.buildingName}}{{item.floorName}}</text>
</view>
<image bindtap='phone' data-merchantLinkPhone='{{item.merchantLinkPhone}}' class="tel" src="./../../../assets/img/tel.jpg" mode="widthFix" />
</view>
</view>
<view class='notes'>
<view>
<text>购买须知</text>
</view>
<view>
<text><text class='spot'></text>{{data.remark}}</text>
</view>
</view>
</view>
</view>
</view>

+ 435
- 0
pages/cardListDetail/CardListDetail.wxss 查看文件

@@ -0,0 +1,435 @@
@import "../../app.wxss";
page {
background: #fff;
}

.coupons {
width: 100%;
position: relative;
overflow: hidden;
padding-bottom: 170rpx;
}

.banner {
position: relative;
width: 750rpx;
height: 534.5rpx;
}

.banner image {
width: 100%;
height: 100%;
}

.coupons_info {
width: 92%;
padding: 0 4%;
background: #fff;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
margin-top: -25rpx;
}

.fenxiang {
position: absolute;
right: 36rpx;
top: 27rpx;
width: 77rpx;
}

.fenxiang image {
width: 50rpx;
position: absolute;
top: 0;
right: 0;
}

.user-motto {
width: 100rpx;
border: 0;
background: none;
height: 60rpx;
color: #fff;
}

.user-motto::after {
border: none;
}

.title {
display: block;
font-size: 32rpx;
color: #000;
letter-spacing: 1.09rpx;
line-height: 45rpx;
width: 542rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-top: 30rpx;
}

.subTitle {
display: block;
width: 588rpx;
/* height: 37rpx; */
font-size: 26rpx;
color: #999;
letter-spacing: 1.16rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 6rpx 0;
}

.rest {
font-size: 24rpx;
color: #919191;
letter-spacing: 0;
height: 70rpx;
line-height: 70rpx;
/* border-bottom: 1px solid #eee; */
border-bottom: 1px solid #f9f9f9;
}

.restNum {
font-size: 24rpx;
color: #999;
letter-spacing: 1.16rpx;
text-align: right;
}

.time {
font-size: 24rpx;
color: #333;
letter-spacing: 0;
line-height: 33rpx;
display: inline-block;
}

.txt01 {
font-size: 24rpx;
color: #919191;
letter-spacing: 0;
}

.price {
font-size: 24rpx;
color: #999;
letter-spacing: 0;
}

.salePriceStr {
font-size: 24rpx;
color: #999;
letter-spacing: 0;
}

.salePriceStr .pri01 {
font-size: 40rpx;
color: #ff4949;
letter-spacing: 0;
margin-left: 10rpx;
}

.salePriceStr .yuan {
font-size: 24rpx;
color: #ff4949;
letter-spacing: 0;
}

.price text {
font-size: 24rpx;
color: #333;
letter-spacing: 0;
}

.throgh {
text-decoration: line-through;
margin-left: 10rpx;
}

.posi {
position: relative;
width: 92%;
margin: 0 auto;
}

.fl {
float: left;
}

.fr {
float: right;
}

.posi>view:nth-child(2) {
width: 100%;
height: 87rpx;
display: flex;
justify-content: space-between;
border-top: 1px solid #f6f6f6;
line-height: 87rpx;
}

.posi>view:nth-child(2) text:nth-child(1) {
font-size: 30rpx;
color: #a9a9a9;
}

.posi>view:nth-child(2) text:nth-child(2) {
font-size: 30rpx;
color: #a9a9a9;
}

.posi_logo {
width: 100%;
display: flex;
padding: 20rpx 0;
background: #fff;
height: 100rpx;
margin-bottom: 20rpx;
}

.posi_logo view:nth-child(1) {
width: 100rpx;
height: 100rpx;
border-radius: 16rpx;
}

.posi_logo view:nth-child(1) image {
display: block;
width: 100rpx;
height: 100rpx;
border-radius: 16rpx;
border: 1px solid #e5e5e5;
}

.posi_logo view:nth-child(2) {
display: flex;
flex-direction: column;
flex: 8;
padding-left: 30rpx;
}

.posi_logo view:nth-child(2) text:nth-child(1) {
font-size: 32rpx;
color: #333;
letter-spacing: 0;
}

.posi_logo view:nth-child(2) text:nth-child(2) {
font-size: 24rpx;
color: #b8b8b8;
padding-top: 3rpx;
width: 450rpx;
height: 36rpx;
overflow: hidden;
}

.notes view:nth-child(1) {
width: 92%;
height: 87rpx;
padding: 0 4%;
line-height: 87rpx;
background: #fff;
}

.active {
opacity: 0.6;
}

.notes view:nth-child(1) text {
font-size: 24rpx;
color: #333;
letter-spacing: 0;
}

.notes view:nth-child(2) {
width: 92%;
padding: 0 4%;
background: #fff;
display: flex;
flex-direction: column;
}

.notes view:nth-child(2)>text {
font-size: 24rpx;
color: #919191;
letter-spacing: 0;
line-height: 42rpx;
}

.buy-view {
background: #fff;
height: 96rpx;
bottom: 0;
left: 0;
right: 0;
padding-bottom: 22rpx;
padding-top: 22rpx;
}

.buy {
position: relative;
background: #00c0ff;
height: 94rpx;
width: 670rpx;
margin: 0 auto 30rpx;
color: #fff;
font-size: 36rpx;
line-height: 94rpx;
border-radius: 61rpx;
}

.tel {
right: 0;
top: 0;
bottom: 0;
margin: auto;
width: 50rpx;
height: 50rpx;
}

.txt {
margin-right: 30rpx;
}
.distance{
border: none;
border-radius:16rpx;
width: 600rpx;
padding: 16rpx 6rpx 0 0;
}
.distance .txt01{
display: block;
font-size: 26rpx;
color: #ff4949;
}
.clock{
width: 116rpx!important;
vertical-align: middle;
margin-right: 10rpx;
margin-top: -4rpx;
}
.qiang{
position: inline-block;
width: 60rpx;
height: 40rpx;
line-height: 40rpx;
color: #ff4949;
text-align: center;
font-size: 28rpx;
margin-right: 10rpx;
}
.times{
display: inline-block;
color: #ff4949;
font-weight:bold;
font-size: 26rpx;
text-align:center;
}
.times text{
display: inline-block;
margin: 6rpx;
width: 46rpx;
height: 56rpx;
text-align: center;
font-size: 28rpx;
line-height: 60rpx;
border-radius:12rpx;
color: #fff;
font-weight:bold;
background: #ff4949;
}

.b1 {
position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
background: rgba(0, 0, 0, 0.8);
overflow: hidden;
z-index: 10;
}

.con {
position: absolute;
top: 35rpx;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width: 587rpx;
}

.con .image{
display: block;
width: 100%;
}

.img {
margin-top: -50rpx;
}
.question {
display: block;
width: 587rpx;
background: #fff;
border-bottom-left-radius: 22rpx;
border-bottom-right-radius: 22rpx;
overflow: hidden;
}

.ques {
display: block;
width: 511rpx;
margin: 0 auto;
height: 95rpx;
line-height: 95rpx;
font-size: 30rpx;
color: #333;
border-bottom: 1rpx solid #eee;
}

.titles {
width: 511rpx;
display: block;
text-align: center;
height: 50rpx;
margin: 0 auto;
padding-top:10rpx;
padding-bottom:20rpx;
font-size: 32rpx;
font-weight: bold;
line-height: 41rpx;
border-bottom: 1rpx solid #eee;
}
.quessss >view:last-child{
border-bottom:0;
}
.close{
position: relative;
z-index: 10000;
display: block;
width: 70rpx;
}
.ques_gou{
position: absolute;
width: 20rpx;
top: 160rpx;
left: 23rpx;
}
.btns{
color: #f8755b;
font-weight: bold;
font-size: 30rpx!important;
text-align: center!important;
}
.radios{
display: block;
font-size:28rpx;
height: 95rpx;
line-height: 95rpx;
color: #333;
text-indent: .5em;
}

+ 142
- 0
pages/discountCardList/discountCardList.js 查看文件

@@ -0,0 +1,142 @@
const util = require("../../utils/util.js");
const config = require("../../config/config.js");
const Http = require("../../utils/HttpBasics");
let app = getApp();
Page({
data: {
tabs: [{
key: 0,
name: "A卡"
},
{
key: 1,
name: "礼品卡"
},
{
key: 2,
name: "折扣卡"
},
{
key: 3,
name: "D卡"
}
],
list: [],
current: "0",
current_scroll: "0",
page: 1,
allow_load: true,
loading: true, //"上拉加载"的变量,默认false,隐藏
content: "",
mystatus: '',
showPage: false
},
onLoad() {
this.getList(0, 1);
},
onShow: function () {
let that = this;
wx.setStorage({
key: 'couponNum',
data: "couponNum1",
})
wx.hideTabBarRedDot({
index: 2
})
},
//点击跳转到券详情页面
gotouse: function (e) {
if (this.data.mystatus == '' || this.data.mystatus == 'undefined') {
var mystatus = e.currentTarget.dataset.couponorderstatus;
} else {
var mystatus = this.data.mystatus;
}
wx.navigateTo({
url: `/pages/couponorder/detail/index?quancode=${
e.currentTarget.dataset.quancode}&couponorderstatus=${mystatus}`
});
},
getList(key, pageNum) {
var that = this;
if (that.data.allow_load) {
that.setData({
loading: true,
content: "小主,我在玩命加载中...",
});
Http.get({
url: config.api.couponOrderList,
data: {
pageNum: pageNum,
pageSize: 6,
couponOrderStatus: key
}
})
.then(res => {
if (res.code == 200) {
that.setData({
showPage: true
})
}
res.data.list.map(file => {
file.expiredTime = util.fmtDate(file.expiredTime);
});
setTimeout(function () {
that.setData({
loading: false
});
}, 1400);
if (pageNum >= res.data.pages) {
that.setData({
allow_load: false
});
}
if (pageNum == 1) {
that.setData({
list: []
})
}
var tmpArr = that.data.list;
tmpArr.push.apply(tmpArr, res.data.list);
that.setData({
list: tmpArr
})
})
.catch(err => {
wx.showModal({
title: '提示',
content: err.errMsg,
showCancel: false
})
})
} else {
that.setData({
loading: true,
content: "——— 再拉裤子就掉了啦 ———"
});
setTimeout(function () {
that.setData({
loading: false
});
}, 1400);
}
},
handleChangeScroll({
detail
}) {
this.setData({
list: [],
allow_load: true,
current_scroll: detail.key,
page: 1,
});
this.getList(detail.key, 1);
},
onReachBottom: function () {
var that = this;
that.data.page++;
that.setData({
page: that.data.page
});
that.getList(that.data.current_scroll, that.data.page);
}
});

+ 7
- 0
pages/discountCardList/discountCardList.json 查看文件

@@ -0,0 +1,7 @@
{
"usingComponents": {
"i-tab": "../../../dist/tab/index",
"i-tabs": "../../../dist/tabs/index"
},
"navigationBarTitleText": "折扣卡列表"
}

+ 36
- 0
pages/discountCardList/discountCardList.wxml 查看文件

@@ -0,0 +1,36 @@
<!-- 折扣卡list页面 -->
<view class='content'>
<view class='header'>
<image src="./../../assets/img/growthbg.png" mode="widthFix"></image>
</view>
<view class="market">
<i-tabs class='tabs' current="{{ current_scroll }}" scroll bindchange="handleChangeScroll">
<i-tab class='i-tab' wx:for="{{tabs}}" wx:key="unique" key="{{item.key}}" title="{{item.name}}"></i-tab>
</i-tabs>
<view class='cards'>
<view class="nocoupon" wx:if="{{list.length==0}}">
<image src="./../../assets/img/coupon.png" mode="widthFix" />
<text class="txt001">请您敬请期待</text>
<text class='txt002'>我们正在筹备一大波优惠活动</text>
<navigator class='nav' url="/pages/index/index" open-type="switchTab" hover-class="other-navigator-hover">
<button hover-class='active'>前往首页看看</button>
</navigator>
</view>

<view class='section' wx:for='{{list}}' wx:key='{{index}}' bindtap="gotouse" data-quancode="{{item.id}}" data-couponorderstatus="{{item.couponOrderStatus}}">
<view class='mms'>
<view class='detail_msg'>
<image mode="aspectFill" src='{{item.coverImg}}' mode='widthFix'></image>
<text>{{item.title}}</text>
</view>
<view class='buycardbtn'>
<button>{{item.salePrice}}元 <text>购买</text></button>
</view>
</view>
</view>
<view class="loading" wx:if="{{loading}}">
<image src="./../../assets/img/loading.gif" mode="widthFix"></image>{{content}}
</view>
</view>
</view>
</view>

+ 226
- 0
pages/discountCardList/discountCardList.wxss 查看文件

@@ -0,0 +1,226 @@
.header image{
width: 100%;
}
.market {
width: 100%;
height: 100%;
/* background: #f5f5f5; */
}

.tabs {
width: 100% !important;
height: 88rpx;
text-align: center;
margin-bottom: 30rpx;
}

.i-tab {
width: 25% !important;
display: inline-block;
}

.section {
position: relative;
width: 48%;
}
.cards >view:nth-of-type(2n){
float: right;
}
.cards>view:nth-of-type(2n+1){
float: left;
}
.cards>view{
margin-bottom: 30rpx;
}
.mms {
background: #fff;
padding: 0;
border-radius: 16rpx;
border-top: 8rpx solid #02b7ff;
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10);
}

.expiretime {
display: block;
width: 100%;
text-align: left;
text-indent: 1em;
font-size: 22rpx;
color: #333;
letter-spacing: 0;
}

.liness {
display: block;
width: 100%;
}

.detail_msg {
width: 100%;
display: block;
}

.detail_msg image {
display: block;
width: 100%;
height: 200rpx!important;
}
.detail_msg text{
display: block;
font-size:28rpx;
height: 80rpx;
line-height: 40rpx;
color: #666;
padding:16rpx 20rpx 0;
}
.info view:nth-child(1) {
display: flex;
justify-content: space-between;
padding: 0 2%;
}

.info {
width: 100%;
}

.info view:nth-child(1) text {
font-size: 32rpx;
line-height: 32rpx;
height: 32rpx;
color: #333;
letter-spacing: 0;
width: 400rpx;
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}

.info view:nth-child(2) {
padding-left: 2%;
font-size: 22rpx;
color: #333;
letter-spacing: 0;
margin-top: 6rpx;
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 400rpx;
}

.info view:nth-child(3) {
margin-left: 20rpx;
}

.btns {
position: absolute;
right: 57rpx;
top: 38rpx;
width: 120rpx;
height: 48rpx;
line-height: 48rpx;
text-align: center;
border: 2rpx solid #02c0ff;
border-radius: 60rpx;
color: #02c0ff;
font-size: 28rpx;
}
.buycardbtn{
display: flex;
flex: 2;
}
.buycardbtn button{
flex: 1;
font-size: 28rpx;
height: 70rpx;
line-height: 70rpx;
background:#02c0ff!important;
border:0;
color:#fff!important;
margin-top: 20rpx;
}
.buycardbtn button text{
margin-left: 10rpx;
}
.active {
color: #fff;
background: #02c0ff;
}

.txt1 {
font-size: 34rpx;
color: #666;
letter-spacing: 0;
}

.nocoupon image {
width: 300rpx;
display: block;
margin: 3% auto 0;
}

.txt001 {
display: block;
line-height: 48rpx;
font-size: 34rpx;
color: #333;
letter-spacing: 0;
text-align: center;
}

.txt002 {
display: block;
margin-top: 1%;
font-size: 28rpx;
color: #999;
letter-spacing: 0;
line-height: 40rpx;
text-align: center;
}

.nocoupon button {
background: #00c0ff;
color: #fff;
font-style: 30rpx;
width: 100%;
border-radius: 60rpx;
}

.loading {
text-align: center;
height: 80rpx;
line-height: 80rpx;
font-size: 26rpx;
color: #999;
}

.loading image {
width: 60rpx;
height: 60rpx;
vertical-align: middle;
margin-right: 10rpx;
}

.active {
opacity: 0.6;
}

.nav {
position: absolute;
bottom: 3.3%;
left: 0;
right: 0;
margin: auto;
width: 670rpx;
border-radius: 60rpx;
background: #02c0ff;
font-size: 32px;
color: #fff;
text-align: center;
line-height: 32px;
}
.cards{
margin-top: 30rpx;
padding: 0 30rpx;
}

+ 1
- 0
pages/index/index.json 查看文件

@@ -1,6 +1,7 @@
{
"usingComponents": {
"c-banner": "../../components/banner/index",
"discount-card": "../../components/discountCard/index",
"c-rushToBuy": "./rushToBuy/index",
"c-coupons": "./coupons/index",
"g-entry": "../../components/gameentry/gentry"


+ 3
- 1
pages/index/index.wxml 查看文件

@@ -1,6 +1,8 @@

<view class="container">
<c-banner wx:key="unique" list="{{list}}" />
<!-- 折扣卡 -->
<discount-card wx:key="unique" />
<c-rushToBuy />
<!-- 小游戏暂时注释 -->
<view class='game' bindtap="gotogame" wx-if="{{showIf}}">
@@ -8,6 +10,6 @@
<image src="./../../assets/img/new.png" class='gameimg' mode='widthFix'></image>
</view>
</view>
<c-coupons id="lists" bind:myevent="onGetCode" loadingtext="{{loadingtext}}" loading="{{loading}}" />
<c-coupons id="lists" bind:myevent="onGetCode" loadingtext="{{loadingtext}}" loading="{{loading}}" />
<g-entry id="listss" wx:if="{{showGame&&!played&&!havePlayEd}}" gamedata="{{gamedata}}" bind:myevent="" />
</view>

Loading…
取消
儲存