Bladeren bron

[我的订单订单详情][增加]:我的订单的订单详情页面二维码点开,跳转到新的二维码页面

tags/2.2.4
meo 6 jaren geleden
bovenliggende
commit
d83453be64
8 gewijzigde bestanden met toevoegingen van 280 en 49 verwijderingen
  1. +2
    -1
      app.json
  2. BIN
      assets/img/yhqbg.PNG
  3. +48
    -45
      pages/order/detail/index.js
  4. +3
    -3
      pages/order/detail/index.wxml
  5. +77
    -0
      pages/youhuiquanma/index.js
  6. +3
    -0
      pages/youhuiquanma/index.json
  7. +18
    -0
      pages/youhuiquanma/index.wxml
  8. +129
    -0
      pages/youhuiquanma/index.wxss

+ 2
- 1
app.json Bestand weergeven

@@ -19,7 +19,8 @@
"pages/login/index", "pages/login/index",
"pages/park/park", "pages/park/park",
"pages/passCar/passCar", "pages/passCar/passCar",
"pages/addPark/addPark"
"pages/addPark/addPark",
"pages/youhuiquanma/index"
], ],
"tabBar": { "tabBar": {
"color": "#9F9F9F", "color": "#9F9F9F",


BIN
assets/img/yhqbg.PNG Bestand weergeven

Voor Na
Breedte: 1152  |  Hoogte: 1980  |  Grootte: 129 KiB

+ 48
- 45
pages/order/detail/index.js Bestand weergeven

@@ -19,54 +19,57 @@ Page({
*/ */


powerDrawer: function(e) { powerDrawer: function(e) {
var currentStatu = e.currentTarget.dataset.statu;
console.log(e.currentTarget.dataset.statu);
// var currentStatu = e.currentTarget.dataset.statu;
wx.navigateTo({
url: `/pages/youhuiquanma/index?quancode=${e.currentTarget.dataset.quancode}&title=${e.currentTarget.dataset.title}&subtitle=${e.currentTarget.dataset.subtitle}&remark=${e.currentTarget.dataset.remark}`,
})
// console.log(e.currentTarget.dataset.statu);
console.log(e.currentTarget.dataset.quancode); console.log(e.currentTarget.dataset.quancode);
this.utils(currentStatu, e.currentTarget.dataset.quancode);
// this.utils(currentStatu, e.currentTarget.dataset.quancode);
}, },
utils: function(currentStatu, quancode) {
/* 动画部分 */
// 第1步:创建动画实例
var animation = wx.createAnimation({
duration: 200, //动画时长
timingFunction: "linear", //线性
delay: 0 //0则不延迟
}); // 第2步:这个动画实例赋给当前的动画实例
this.animation = animation; // 第3步:执行第一组动画
animation.opacity(0).step(); // 第4步:导出动画对象赋给数据对象储存
this.setData({
animationData: animation.export()
}); // 第5步:设置定时器到指定时候后,执行第二组动画
setTimeout(
function() {
// 执行第二组动画
animation.opacity(1).step(); // 给数据对象储存的第一组动画,更替为执行完第二组动画的动画对象
this.setData({
animationData: animation
}); //关闭
if (currentStatu == "close") {
this.setData({
showModalStatus: false
});
}
}.bind(this),
20
);
// 显示
if (currentStatu == "open") {
this.setData({
showModalStatus: true
});
this.data.flag++;
// utils: function(currentStatu, quancode) {
// /* 动画部分 */
// // 第1步:创建动画实例
// var animation = wx.createAnimation({
// duration: 200, //动画时长
// timingFunction: "linear", //线性
// delay: 0 //0则不延迟
// }); // 第2步:这个动画实例赋给当前的动画实例
// this.animation = animation; // 第3步:执行第一组动画
// animation.opacity(0).step(); // 第4步:导出动画对象赋给数据对象储存
// this.setData({
// animationData: animation.export()
// }); // 第5步:设置定时器到指定时候后,执行第二组动画
// setTimeout(
// function() {
// // 执行第二组动画
// animation.opacity(1).step(); // 给数据对象储存的第一组动画,更替为执行完第二组动画的动画对象
// this.setData({
// animationData: animation
// }); //关闭
// if (currentStatu == "close") {
// this.setData({
// showModalStatus: false
// });
// }
// }.bind(this),
// 20
// );
// // 显示
// if (currentStatu == "open") {
// this.setData({
// showModalStatus: true
// });
// this.data.flag++;


console.log(this.data.flag);
util.barcode("barcode" + this.data.flag, quancode, 500, 100);
util.qrcode("qrcode" + this.data.flag, quancode, 350, 350);
this.setData({
flag: this.data.flag
});
}
},
// console.log(this.data.flag);
// util.barcode("barcode" + this.data.flag, quancode, 500, 100);
// util.qrcode("qrcode" + this.data.flag, quancode, 350, 350);
// this.setData({
// flag: this.data.flag
// });
// }
// },
/** /**
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */


+ 3
- 3
pages/order/detail/index.wxml Bestand weergeven

@@ -29,7 +29,7 @@
<text>适用门店</text> <text>适用门店</text>
<text class="fr">{{order.merchantName}}</text> <text class="fr">{{order.merchantName}}</text>
</view> </view>
<view wx:if="{{order.orderStatus==1}}" data-quancode="{{order.id}}" bindtap="powerDrawer" data-statu="open">
<view wx:if="{{order.orderStatus==1}}" data-title="{{order.title}}" data-subtitle="{{order.subTitle}}" data-remark="{{order.remark}}" data-quancode="{{order.id}}" bindtap="powerDrawer" data-statu="open">
<view> <view>
<text>兑换码:</text> <text>兑换码:</text>
<text>{{order.id}}</text> <text>{{order.id}}</text>
@@ -53,13 +53,13 @@
</view> </view>
<!-- 待付款 显示立即购买的按钮 --> <!-- 待付款 显示立即购买的按钮 -->
<view wx:if="{{order.orderStatus==0}}" class="buy-view app-border-top"> <view wx:if="{{order.orderStatus==0}}" class="buy-view app-border-top">
<button bindtap='orderFunc' data-couponChannelId="{{order.id}}" class='buy'>立即支付</button>
<button bindtap='orderFunc' data-couponChannelId="{{order.id}}" class='buy'>立即支付</button>
</view> </view>
</view> </view>




<!--mask--> <!--mask-->
<view class="drawer_screen" data-quancode="{{order.id}}" wx:if="{{showModalStatus}}" bindtap="powerDrawer" data-statu="close"></view>
<view class="drawer_screen" data-title="{{order.title}}" data-subtitle="{{order.subTile}}}" data-remark="{{order.remark}}" data-quancode="{{order.id}}" wx:if="{{showModalStatus}}" bindtap="powerDrawer" data-statu="close"></view>
<view animation="{{animationData}}" class="drawer_box" wx:if="{{showModalStatus}}"> <view animation="{{animationData}}" class="drawer_box" wx:if="{{showModalStatus}}">
<view class="panel"> <view class="panel">
<view class="barcode"> <view class="barcode">


+ 77
- 0
pages/youhuiquanma/index.js Bestand weergeven

@@ -0,0 +1,77 @@
let util = require("../../utils/util");
Page({

/**
* 页面的初始数据
*/
data: {
code:''
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
console.log(options.quancode);
console.log(options);
console.log(options.subtitle);

util.barcode("barcode", options.quancode, 500, 100);
util.qrcode("qrcode", options.quancode, 350, 350);
this.setData({
code:options.quancode,
title:options.title,
subtitle:options.subtitle,
remark:options.remark
})
},

/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},

/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},

/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},

/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},

/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},

/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},

/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})

+ 3
- 0
pages/youhuiquanma/index.json Bestand weergeven

@@ -0,0 +1,3 @@
{
"navigationBarTitleText": "优惠券"
}

+ 18
- 0
pages/youhuiquanma/index.wxml Bestand weergeven

@@ -0,0 +1,18 @@
<view class="couponbg">
<image src="./../../assets/img/yhqbg.png"></image>
<view class="title">{{title}}</view>
<view class="subtitle">{{subtitle}}</view>
<view class="panel">
<view class="barcode">
<canvas canvas-id="barcode" />
</view>
<view class="qrcode">
<canvas canvas-id="qrcode" />
</view>
<view class="barnum buy"><text>兑换码:</text>{{code}}</view>
</view>
<view class="gou">
<view class="mai">购买须知:</view>
<view class="remark">{{remark}}</view>
</view>
</view>

+ 129
- 0
pages/youhuiquanma/index.wxss Bestand weergeven

@@ -0,0 +1,129 @@
page {
background: #4e99f8;
}
.couponbg {
position: relative;
height: 100%;
width: 100%;
}
.couponbg image {
display: block;
position: absolute;
width: 95%;
height: 95%;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
z-index: -19999;
border-radius: 20rpx;
}
.title {
font-size: 33rpx;
color: #0c1829;
line-height: 36rpx;
text-align: center;
padding-top: 106rpx;
}
.subtitle {
color: #7f8b9e;
font-size: 26rpx;
line-height: 30rpx;
margin-top: 16rpx;
text-align: center;
}
.panel {
width: 600rpx;
border-radius: 10rpx;
background-color: #fff;
margin: 30rpx auto 0;
padding: 30rpx 0;
position: relative;
z-index: 10000000000;
}
.pane2 {
background: #fff;
opacity: 0.6;
}
.pane2 image {
width: 500rpx;
display: block;
margin: 40rpx auto 0;
}

.barcode {
height: 100rpx;
width: 500rpx;
margin: 0 auto;
}

.barnum {
height: 46rpx;
line-height: 46rpx;
font-size: 24rpx;
text-align: center;
letter-spacing: 2rpx;
white-space: nowrap;
color: #7f7f7f;
}

.barnum text {
color: #767676;
}

.barcode > canvas {
width: 500rpx;
height: 100rpx;
}

.qrcode {
height: 380rpx;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
}

.qrcode > canvas {
width: 350rpx;
height: 350rpx;
}
.jine {
color: #f96563 !important;
font-size: 36rpx !important;
}

.buy-view {
background: #fff;
position: fixed;
padding-top: 10rpx;
height: 98rpx;
bottom: 0rpx;
left: 0;
right: 0;
}

.buy {
background: #fff;
height: 88rpx;
width: 98%;
margin: 0 auto;
color: #7e7e7e;
line-height: 88rpx;
border-radius: 16rpx;
border: 1px solid #eee;
margin-top:40rpx;
}
.gou{
padding-left: 80rpx;
color: #878d95;
padding-top:30rpx;
font-size: 30rpx;
}
.mai{
color: #666;
}
.remark{
padding-top: 37rpx;
}

Laden…
Annuleren
Opslaan