Commit ccd11ae1 by zqm

MM-订单详情

parent 538f3685
......@@ -4,7 +4,7 @@ const App = getApp()
Page({
data: {
imageBase: App.globalData.appImageBase,
passListType: 0, // 0为单张卡 1为多张卡
passListType: 1, // 0为单张卡 1为多张卡
privateStatus: true,
swiperCurrent: 0,
passList: [
......
......@@ -77,7 +77,8 @@ Page({
img: '',
title: '日落观光游船体验活动之船行碧波共赏美景',
num: 3
}]
}],
orderListBackup: []
},
close() {
......@@ -109,7 +110,59 @@ Page({
// 去核销
goCouponInput(event) {
wx.navigateTo({
url: '/pages/pay/coupon-input/coupon-input',
url: '/pages/pay/coupon-input/coupon-input',
})
},
//获取待使用订单
getWillUseOrders() {
let that = this
App.wxRequest({
url: '/api/v1/order/getOrderList',
data: {
goodType: "", //数据字典(good_type) 商品分类(全部为"")
status: 2, //状态(-1已取消0未付款1未发货2待使用3已使用4已过期)
pageNo: 1,
pageSize: -1
},
success: function (res) {
let tmpArr = []
console.log('daishiyongdingdan', res);
let list = res.data
let listBackUp = JSON.parse(JSON.stringify(list)) //备份数据
let orderList = `myOrder.artOrder.orderList`
list.length = 1
that.setData({
[orderList]: list,
orderListBackup: listBackUp
})
}
})
},
//获取卡数据
getCardList() {
let that = this
App.wxRequest({
url: '/api/v1/volume/getVolumeList',
data: {
status: "", //0已过期1待使用2已使用(""全部)
pageNo: 1,
pageSize: -1
},
success: function (res) {
let tmpArr = []
console.log('卡片数据', res);
let list = res.data.map(item => {
return item
})
let passOrder = `myOrder.passOrder`
that.setData({
[passOrder]: list
})
}
})
},
......@@ -145,6 +198,8 @@ Page({
userInfo: funcUserInfo
})
this.getMyActivityList()
this.getCardList()
this.getWillUseOrders()
} else {
this.setData({
isRegister: false,
......@@ -328,9 +383,30 @@ Page({
//查看更多
onShowMoreOrder: function () {
let showMoreOrder = !this.data.showMoreOrder
let orderList = `myOrder.artOrder.orderList`
console.log(JSON.parse(JSON.stringify(this.data.orderListBackup)));
if (showMoreOrder) {
// 展开
this.setData({
[orderList]: JSON.parse(JSON.stringify(this.data.orderListBackup)),
})
} else {
// 收起
let list = JSON.parse(JSON.stringify(this.data.orderListBackup))
list.length = 1
this.setData({
[orderList]: list,
})
}
this.setData({
showMoreOrder
showMoreOrder,
})
},
onShowMoreActivity: function () {
let showMoreActivity = !this.data.showMoreActivity
......
......@@ -128,41 +128,40 @@
<view class="pass-bg-two" wx:if="{{myOrder.passOrder.length > 1}}"></view>
<view class="pass-logo-wrapper row align-c">
<image src="{{myOrder.passOrder[0].logo}}"></image>
<text>{{myOrder.passOrder[0].store}}</text>
<text>{{myOrder.passOrder[0].officeName}}</text>
</view>
<view class="pass-title">
<text>{{myOrder.passOrder[0].title}}</text>
<text>精灵鸟理想国{{myOrder.passOrder[0].name}}</text>
</view>
<view class="pass-time">
<text>{{myOrder.passOrder[0].time}}</text>
<text>有效期至{{myOrder.passOrder[0].expireTime}}</text>
</view>
<view class="pass-name">
<text>{{myOrder.passOrder[0].name}}</text>
<text>{{myOrder.passOrder[0].personName}}</text>
</view>
<view class="pass-idNum">
<text>{{myOrder.passOrder[0].idNum}}</text>
<text>{{myOrder.passOrder[0].identityCard}}</text>
</view>
</view>
<!-- 商品 -->
<view class="goods-wrapper">
<view class="goods-wrapper" wx:for="{{myOrder.artOrder.orderList}}" wx:key="*this">
<view class="goods-logo-wrapper row align-c">
<view class="art-logo">
<image src="{{myOrder.artOrder.logo}}"></image>
</view>
<text>{{myOrder.artOrder.orderList[0].store}}</text>
<text>{{item.officeName}}</text>
</view>
<view class="goods-content row align-c">
<image src="{{item.cover}}" wx:for="{{myOrder.artOrder.orderList}}" wx:key="id"></image>
<text wx:if="{{myOrder.artOrder.orderList.length === 1}}">{{myOrder.artOrder.orderList[0].title}}</text>
<image src="{{k.imgUrl}}" wx:for="{{item.smOrderDetails}}" wx:for-item="k" wx:key="*this"></image>
<text wx:if="{{item.smOrderDetails.length == 1}}">{{item.smOrderDetails[0].name}}</text>
</view>
<view class="goods-footer row align-c con-b">
<text>{{myOrder.artOrder.orderList[0].time}}</text>
<text>{{myOrder.artOrder.orderList[0].quantity}}</text>
<text>有效期至{{item.time}}</text>
<text>共{{item.smOrderDetails.length}}</text>
</view>
</view>
<!-- more -->
<view class="more row align-c con-c" bindtap="onShowMoreOrder">
<text wx:if="{{!showMoreOrder}}">展开更多</text>
......
.container {
background: linear-gradient(180deg, #FFFFFF 0%, #F3F4F6 100%);
background: linear-gradient(180deg, #fff 10%, #F3F4F6 20%);
/* background: #F3F4F6 */
}
.navigation {
z-index: 2;
}
......@@ -13,6 +15,7 @@
width: 100%;
height: 100%;
}
.mine {
position: relative;
width: 750rpx;
......@@ -25,7 +28,7 @@
margin-right: 32rpx;
}
.mine-avatar > image {
.mine-avatar>image {
width: 128rpx;
height: 128rpx;
border-radius: 50%;
......@@ -61,10 +64,13 @@
padding: 41rpx 32rpx;
background-color: #fff;
border-radius: 4rpx;
margin-top:48rpx;
}
.cpopon-info {
flex: 1;
}
.cpopon-info text:nth-child(1) {
font-size: 34rpx;
font-weight: 600;
......@@ -76,6 +82,7 @@
font-size: 26rpx;
color: #161A1F;
}
.coupon image {
width: 32rpx;
height: 32rpx;
......@@ -127,7 +134,7 @@
.menu {
width: 750rpx;
margin-top: 16rpx;
/* margin-top: 16rpx; */
margin-bottom: 30rpx;
padding: 0 48rpx;
overflow-x: hidden;
......@@ -328,24 +335,30 @@
background-color: #fff;
border-radius: 4rpx;
}
.order-activity image {
width: 32rpx;
height: 32rpx;
}
.order-activity-title-wrapper {
height: 48rpx;
}
.order-activity-title {
font-size: 34rpx;
color: #15191F;
font-weight: 600;
}
.order-activity-icon-list {
margin-top: 56rpx;
}
.order-activity-icon-wrapper {
flex: 1;
}
.order-activity-icon {
position: relative;
width: 80rpx;
......@@ -353,10 +366,12 @@
background-color: #F5F6F8;
border-radius: 50%;
}
.order-activity-icon image{
.order-activity-icon image {
width: 48rpx;
height: 48rpx;
}
.order-activity-badge {
position: absolute;
top: -10rpx;
......@@ -370,9 +385,11 @@
background-color: #E66060;
border-radius: 16rpx;
}
.badge-widen {
width: 48rpx;
}
.order-activity-icon-wrapper text {
margin-top: 16rpx;
font-size: 22rpx;
......@@ -394,6 +411,7 @@
border-radius: 4rpx;
opacity: 0.81;
}
.pass-bg-one {
position: absolute;
left: 0;
......@@ -405,6 +423,7 @@
background: rgba(247, 179, 197, 0.5);
border-radius: 4rpx 4rpx 0 0;
}
.pass-bg-two {
position: absolute;
left: 0;
......@@ -417,33 +436,40 @@
background: rgba(247, 179, 197, 0.3);
border-radius: 4rpx 4rpx 0 0;
}
.pass-logo-wrapper {
height: 50rpx;
}
.pass-logo-wrapper image {
width: 64rpx;
height: 50rpx;
background-color: #ccc;
background-color: #ccc;
}
.pass-logo-wrapper text {
height: 50rpx;
margin-left: 20rpx;
font-size: 26rpx;
line-height: 50rpx;
}
.pass-title {
margin-top: 24rpx;
font-size: 42rpx;
font-weight: 600;
}
.pass-time {
margin-top: 8rpx;
font-size: 26rpx;
}
.pass-name {
margin-top: 32rpx;
font-size: 22rpx;
}
.pass-idNum {
margin-top: 8rpx;
font-size: 22rpx;
......@@ -456,10 +482,12 @@
background-color: #F5F6F8;
border-radius: 4rpx;
}
.goods-logo-wrapper {
height: 100rpx;
margin-top: 40rpx;
}
.goods-logo-wrapper text {
height: 100rpx;
margin-left: 20rpx;
......@@ -467,24 +495,29 @@
color: #15191F;
line-height: 100rpx;
}
.goods-content {
height: 136rpx;
}
.goods-content image{
.goods-content image {
width: 140rpx;
height: 136rpx;
margin-right: 32rpx;
background-color: #ccc;
}
.goods-content text {
font-size: 30rpx;
color: #15191F;
font-weight: 600;
line-height: 42rpx;
}
.goods-footer {
height: 84rpx;
}
.goods-footer text {
font-size: 26rpx;
color: #959DA9;
......@@ -509,6 +542,7 @@
background-color: #F5F6F8;
border-radius: 4rpx;
}
.appointment-time {
position: absolute;
left: 0;
......@@ -523,23 +557,26 @@
border-radius: 4rpx;
}
.appointment-activity-content {
}
.appointment-activity-content {}
.appointment-activity-img {
width: 140rpx;
height: 136rpx;
background-color: #ccc;
}
.appointment-activity-info {
flex: 1;
margin-left: 32rpx;
}
.appointment-activity-title {
color: #15191F;
font-size: 30rpx;
font-weight: 600;
line-height: 42rpx;
}
.appointment-activity-num {
margin-top: 16rpx;
color: #959DA9;
......@@ -550,6 +587,7 @@
width: 305rpx;
height: 110rpx;
}
.border-right {
width: 1rpx;
height: 75rpx;
......@@ -571,10 +609,12 @@
.more {
margin-top: 32rpx;
}
.more text {
font-size: 26rpx;
color: #15191F;
}
.more image {
margin-left: 8rpx;
}
......@@ -587,16 +627,19 @@
background-color: #fff;
border-radius: 4rpx;
}
.service text {
font-size: 34rpx;
color: #15191F;
font-weight: 600;
}
.service image {
width: 32rpx;
height: 32rpx;
}
image {
width: 100%;
height: 100%;
}
}
\ No newline at end of file
......@@ -18,7 +18,7 @@ Page({
'name': '待付款'
},
{
'value': '1',
'value': '2',
'name': '待使用'
},
{
......@@ -34,7 +34,14 @@ Page({
isFinished: false
},
onLoad: function (options) {
this.setOrderType()
App.login({
timeout: 0,
success: (result) => {
this.setOrderType()
},
})
},
/**
......@@ -414,7 +421,7 @@ Page({
onOrderEvaluate: function (event) {
console.log(event.currentTarget.dataset, '----------------event.currentTarget.dataset');
let item = JSON.stringify(event.currentTarget.dataset.item)
let item = JSON.stringify(event.currentTarget.dataset.item)
wx.navigateTo({
url: `/pages/pay/order-comment/order-comment?orderItem=${item}`,
})
......
......@@ -2,6 +2,8 @@ let App = getApp()
Page({
data: {
swiperCurrent: 0,
showCodePopup: false,
imageBase: App.globalData.appImageBase,
resourcesBase: App.globalData.appResourcesBase,
......@@ -15,6 +17,45 @@ Page({
isFromUse: false,
winCode: false,
residuePayTime: "", //剩余支付时间
sealImgs: [{
type: 1,
url: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png'
}],
sealTest: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
sealBig: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-1.png',
seals: {
seal1: {
passSrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
willPaySrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
},
seal1: {
passSrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
willPaySrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
},
seal1: {
passSrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
willPaySrc: App.globalData.appResourcesBase + 'sealOfOrder/ertongyingdi-2.png',
},
},
codeList: [{
id: 0,
title: '《 阿凡达 》电影票',
img: './image/QRcode.png',
num: '2179 7092 0925'
},
{
id: 1,
title: '《 阿凡达 》电影票',
img: './image/QRcode.png',
num: '2179 7092 0925'
},
{
id: 2,
title: '《 阿凡达 》电影票',
img: './image/QRcode.png',
num: '2179 7092 0925'
}
]
},
......@@ -27,11 +68,58 @@ Page({
fromPage: options.fromPage === 'order' ? 'order' : '',
isFromUse: options.showCode === 'true' ? true : false,
})
App.login({
timeout: 0,
success: (result) => {
this.queryOrderDetail()
},
})
console.log(this.data.shopInfo)
this.queryOrderDetail()
},
// /api/v1/order/getVolumesByOrderId
// 一键扫码
onFastScan: function (event) {
App.wxRequest({
url: '/api/v1/order/getVolumesByOrderId',
data: {
'orderId': this.data.orderInfo.id
},
success: (response) => {
let funcResponse = response.data
console.log(response, '一键扫码');
let list = response.data
// let funcCodeInfo = {
// 'codeNo': funcResponse.serialNumber,
// 'codeName': funcResponse.name,
// 'codeBase64': funcResponse.qrcode,
// }
this.setData({
showCodePopup: true,
codeList: list
})
}
})
},
swiperChange(e) {
let swiperCurrent = e.detail.current
this.setData({
swiperCurrent
})
},
closeQRcode() {
let showCodePopup = false
this.setData({
showCodePopup,
// swiperCurrent:0
})
},
/**
* 订单详情
* @function
......@@ -59,7 +147,8 @@ Page({
'tipOrderNo': funcResponse.orderSerialNumber, // 订单编号
'tipTimeSubmit': funcResponse.createDate,
'tipTimePay': App.modular.miment(funcResponse.paymentTime).format('YYYY-MM-DD hh:mm:ss'),
'tipIntegral': funcResponse.integral
'tipIntegral': funcResponse.integral,
'officeName': funcResponse.officeName
}
// 添加订单商品列表
......@@ -119,7 +208,7 @@ Page({
},
// 弹出单张二维码
onCouponCode: function (event) {
let funcOrderInfo = event.currentTarget.dataset.item
App.wxRequest({
......
<navigation class="navigation" titleText="订单详情" color="#000000" background="#FFFFFF" backIcon="/image/back.png" bind:navBack="navBack"></navigation>
<view class="container">
<!-- 订单状态 -->
<view class="state row con-c">
<view class="state-content col con-c" wx:if="{{orderInfo.state === 0}}">
<view class="state-content-title row">
<text>订单待付款</text>
</view>
<view class="state-content-tip row">
<text>请在 {{residuePayTime}} 内付款,否则将自动取消订单</text>
</view>
</view>
<!-- 订单状态 -->
<view class="state row con-c">
<view class="state-content col con-c" wx:if="{{orderInfo.state === 0}}">
<view class="state-content-title row">
<text>订单待付款</text>
</view>
<view class="state-content-tip row">
<text>请在 {{residuePayTime}} 内付款,否则将自动取消订单</text>
</view>
</view>
<view class="state-content col con-c" wx:if="{{orderInfo.state === 3}}">
<view class="state-content-title row">
<text>订单待评价</text>
</view>
</view>
<view class="state-content col con-c" wx:if="{{orderInfo.state === 3}}">
<view class="state-content-title row">
<text>订单待评价</text>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === 4}}">
<view class="state-content-title row">
<text>订单已过期</text>
</view>
<view class="state-content-tip row">
<text>有效期xxx-xxx</text>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === 4}}">
<view class="state-content-title row">
<text>订单已过期</text>
</view>
<view class="state-content-tip row">
<text>有效期xxx-xxx</text>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === -1}}">
<view class="state-content-title row">
<text>订单已取消</text>
</view>
<view class="state-content-tip row">
<text>下单后15分钟内未付款,自动取消订单</text>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === -1}}">
<view class="state-content-title row">
<text>订单已取消</text>
</view>
<view class="state-content-tip row">
<text>下单后15分钟内未付款,自动取消订单</text>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === 3}}">
<view class="state-content-title row">
<text>订单已评价</text>
</view>
</view>
</view>
<view class="state-content state-content-invalid col con-c" wx:if="{{orderInfo.state === 6}}">
<view class="state-content-title row">
<text>订单已评价</text>
</view>
</view>
</view>
<!-- 订单信息 -->
<view class="info">
<!-- 年卡月卡 -->
<block wx:if="{{orderInfo.commodityType === 1}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{shopInfo.name}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
</view>
</block>
<!-- 订单信息 -->
<view class="info">
<!-- 年卡月卡 -->
<block wx:if="{{orderInfo.commodityType === 1}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{shopInfo.name}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<image class="seal-shot" src="{{sealTest}}"></image>
</view>
</block>
<!-- 普通商品 -->
<block wx:if="{{orderInfo.commodityType === 2}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{shopInfo.name}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
</view>
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
</view>
<view class="info-code col con-c align-c">
<text>{{'件餐品可用'}}</text>
<button class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
<!-- 普通商品 -->
<!-- 餐品 -->
<block wx:if="{{orderInfo.commodityType === 5}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{shopInfo.name}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
</view>
<block wx:if="{{orderInfo.commodityType === 2}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{shopInfo.name}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
</view>
<block wx:if="{{orderInfo.state===2}}">
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
<image class="seal-long" src="{{sealBig}}"></image>
</view>
<view class="info-code col con-c align-c">
<text>{{'件餐品可用'}}</text>
<button bindtap="onFastScan" class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
</block>
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
</view>
<view class="info-code col con-c align-c">
<text>{{'件餐品可用'}}</text>
<button class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
<!-- 餐品 -->
<!-- 活动 -->
<block wx:if="{{orderInfo.commodityType === -1}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">报名活动</text>
<text class="info-content-item-title">儿童营地儿童营地儿童营地儿童营地儿童营地儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">活动时间</text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">活动地点</text>
<text class="info-content-item-describe">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">姓名</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
<block wx:if="{{orderInfo.commodityType === 5}}">
<view class="info-content col con-c {{ orderInfo.state!==2?'p-relative':'' }}">
<view class="info-content-item row">
<text class="info-content-item-label">使用门店</text>
<text class="info-content-item-title">{{orderInfo.officeName}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">{{orderInfo.contactName}}</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">{{orderInfo.contactPhone}}</text>
</view>
<image wx:if="{{orderInfo.state!==2}}" class="seal-shot" src="{{sealTest}}"></image>
</view>
<block wx:if="{{orderInfo.state===2}}">
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
<image class="seal-long" src="{{sealBig}}"></image>
</view>
<view class="info-code col con-c align-c">
<text>{{'件餐品可用'}}</text>
<button bindtap="onFastScan" class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
</block>
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
</view>
<view class="info-code col con-c align-c">
<text>{{'张门票可用'}}</text>
<button class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</view>
</block>
<!-- 活动 -->
<!-- 观影 -->
<block wx:if="{{orderInfo.commodityType === -2}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">电影</text>
<text class="info-content-item-title">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">场次</text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">姓名</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
</view>
<block wx:if="{{orderInfo.commodityType === -1}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">报名活动</text>
<text class="info-content-item-title">儿童营地儿童营地儿童营地儿童营地儿童营地儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">活动时间</text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">活动地点</text>
<text class="info-content-item-describe">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">姓名</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
<block wx:if="{{orderInfo.state===2}}">
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
<image class="seal-long" src="{{sealBig}}"></image>
</view>
<view class="info-code col con-c align-c">
<text>{{'张门票可用'}}</text>
<button bindtap="onFastScan" class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
</view>
</block>
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
</view>
<view class="info-code col con-c align-c">
<text>{{'张电影票可用'}}</text>
<button class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
</view>
<!-- 观影 -->
<!-- 商品信息 -->
<view class="commodity col">
<view class="commodity-title">
<text>购买商品</text>
</view>
<view class="commodity-list">
<view class="commodity-shop-info row align-c">
<image src="{{resourcesBase + shopInfo.logo}}"></image>
<text>{{shopInfo.name}}</text>
</view>
<block wx:for="{{orderInfo.commodity}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<view class="commodity-item row align-c">
<image src="{{item.cover}}"></image>
<view class="commodity-item-info col">
<view>
<text>{{item.name}}</text>
</view>
<view class="row">
<text>¥</text>
<text>{{item.amount}}</text>
</view>
</view>
<view class="commodity-item-operation" wx:if="{{item.codeId}}">
<button class="row con-c align-c" data-item="{{item}}" bindtap="onCouponCode">查看券码</button>
</view>
</view>
</block>
</view>
</view>
<block wx:if="{{orderInfo.commodityType === -2}}">
<view class="info-content col con-c">
<view class="info-content-item row">
<text class="info-content-item-label">电影</text>
<text class="info-content-item-title">儿童营地</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">场次</text>
<text class="info-content-item-describe">周一至周日 10:00 - 20:00</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label">订单信息</text>
<text class="info-content-item-tip">姓名</text>
</view>
<view class="info-content-item row">
<text class="info-content-item-label"></text>
<text class="info-content-item-tip">18030303030</text>
</view>
</view>
<block wx:if="{{orderInfo.state===2}}">
<view class="info-line row con-b align-c">
<view class="info-line-point-left"></view>
<view class="info-line-line"></view>
<view class="info-line-point-right"></view>
<image class="seal-long" src="{{sealBig}}"></image>
</view>
<view class="info-code col con-c align-c">
<text>{{'张电影票可用'}}</text>
<button bindtap="onFastScan" class="row con-c align-c">一键扫码</button>
<text>{{'2019.09.30 - 2020.12.30'}}</text>
</view>
</block>
<!-- 订单提示 -->
<view class="tip">
<view class="tip-pay row con-b align-c">
<view class="tip-pay-title">
<text>实付金额</text>
</view>
<view class="tip-pay-amount">
<text>¥</text>
<text>{{orderInfo.amount}}</text>
</view>
</view>
<view class="tip-describe col">
<text>{{'订单编号:' + orderInfo.tipOrderNo}}</text>
<text>{{'下单时间:' + orderInfo.tipTimeSubmit}}</text>
<text wx:if="{{orderInfo.state !== 0 && orderInfo.state !== -1}}">{{'付款时间:' + orderInfo.tipTimePay}}</text>
<text wx:if="{{orderInfo.state !== 0 && orderInfo.state !== -1}}">{{'获得积分:' + orderInfo.tipIntegral}}</text>
</view>
</view>
</block>
</view>
<!-- 商品信息 -->
<view class="commodity col">
<view class="commodity-title">
<text>购买商品</text>
</view>
<view class="commodity-list">
<view class="commodity-shop-info row align-c">
<image src="{{resourcesBase + shopInfo.logo}}"></image>
<text>{{orderInfo.officeName}}</text>
</view>
<block wx:for="{{orderInfo.commodity}}" wx:for-index="index" wx:for-item="item" wx:key="index">
<view class="commodity-item row align-c">
<image src="{{item.cover}}"></image>
<view class="commodity-item-info col">
<view>
<text>{{item.name}}</text>
</view>
<view class="row">
<text>¥</text>
<text>{{item.amount}}</text>
</view>
</view>
<view class="commodity-item-operation" wx:if="{{item.codeId}}">
<!-- 状态(0已过期1带使用2已使用) -->
<button wx:if="{{item.state==1}}" class="row con-c align-c" data-item="{{item}}" bindtap="onCouponCode">查看券码</button>
<button wx:if="{{item.state==0}}" disabled class="row con-c align-c btn-disabled">已过期</button>
<button wx:if="{{item.state==2}}" disabled class="row con-c align-c btn-disabled">已使用</button>
</view>
</view>
</block>
</view>
</view>
<!-- 订单提示 -->
<view class="tip">
<view class="tip-pay row con-b align-c">
<view class="tip-pay-title">
<text>实付金额</text>
</view>
<view class="tip-pay-amount">
<text>¥</text>
<text>{{orderInfo.amount}}</text>
</view>
</view>
<view class="tip-describe col">
<text>{{'订单编号:' +( orderInfo.tipOrderNo?orderInfo.tipOrderNo:"")}}</text>
<text>{{'下单时间:' + (orderInfo.tipTimeSubmit?orderInfo.tipTimeSubmit:'')}}</text>
<text wx:if="{{orderInfo.state !== 0 && orderInfo.state !== -1}}">{{'付款时间:' + (orderInfo.tipTimePay?orderInfo.tipTimePay:'')}}</text>
<text wx:if="{{orderInfo.state !== 0 && orderInfo.state !== -1}}">{{'获得积分:' + (orderInfo.tipIntegral?orderInfo.tipIntegral:'')}}</text>
</view>
</view>
</view>
<!-- 多张 扫码弹窗 -->
<l-popup show="{{showCodePopup}}" l-class="l-popup-bg">
<view class="scan-code-wrapper col align-c">
<view class="code-header">{{codeList.length}}件商品可用</view>
<view class="code-tips">请将券码出示给门店核销人员</view>
<swiper class="code-main" next-margin="64rpx" bindchange="swiperChange">
<swiper-item wx:for="{{codeList}}" wx:key="id">
<view class="code-item col con-c align-c {{index === swiperCurrent ? 'item-center' : ''}}">
<view class="code-item-title">{{item.name}}</view>
<view class="code-img">
<image mode="widthFix" src="{{'data:image/jpg;base64,'+item.qrcode}}"></image>
</view>
<view class="code-num-wrapper row align-c con-a">
<view class="code-num-title {{codeUsed ? 'code-used' : ''}}">券码{{index+1}}:</view>
<view class="code-num {{codeUsed ? 'code-used' : ''}}">{{item.serialNumber}}</view>
<view class="num-copy" wx:if="{{!codeUsed}}" bindtap="setClipboard" data-index="{{index}}">复制</view>
</view>
<view class="code-used-seal" wx:if="{{codeUsed}}">
<image mode="widthFix" src="./image/used.png"></image>
</view>
</view>
</swiper-item>
</swiper>
<view class="img-num row align-c">
<text class="current-img-num">{{swiperCurrent+1}}</text>
<text class="symbol-img-num"> / </text>
<text class="total-img-num">{{codeList.length}}</text>
</view>
<view class="code-close-btn row con-c align-c" bindtap="closeQRcode">
<image mode="widthFix" src="/image/icon_close.png"></image>
</view>
</view>
</l-popup>
<!-- 二维码弹窗 -->
<view class="code-mask row con-c align-c" wx:if="{{winCode}}">
<view class="code col con-c align-c">
<view class="code-tip row con-c align-c">
<text>{{'请将券码出示给门店核销人员'}}</text>
</view>
<view class="code-info col con-c align-c">
<view class="code-info-title">
<text>{{codeInfo.codeName}}</text>
</view>
<view class="code-info-qrcode">
<image src="{{'data:image/png;base64,' + codeInfo.codeBase64}}"></image>
</view>
<view class="code-info-copy row con-b align-c">
<text>券码</text>
<text>{{codeInfo.codeNo}}</text>
<text bindtap="onCodeCopy">复制</text>
</view>
</view>
<view class="code-close row con-c align-c" bindtap="onCodeClose">
<image src="{{imageBase + 'icon/close-1.png'}}"></image>
</view>
</view>
<view class="code col con-c align-c">
<view class="code-tip row con-c align-c">
<text>{{'请将券码出示给门店核销人员'}}</text>
</view>
<view class="code-info col con-c align-c">
<view class="code-info-title">
<text>{{codeInfo.codeName}}</text>
</view>
<view class="code-info-qrcode">
<image src="{{'data:image/png;base64,' + codeInfo.codeBase64}}"></image>
</view>
<view class="code-info-copy row con-b align-c">
<text>券码</text>
<text>{{codeInfo.codeNo}}</text>
<text bindtap="onCodeCopy">复制</text>
</view>
</view>
<view class="code-close row con-c align-c" bindtap="onCodeClose">
<image src="{{imageBase + 'icon/close-1.png'}}"></image>
</view>
</view>
</view>
\ No newline at end of file
/* 订单状态 */
.state {
width: 750rpx;
width: 750rpx;
}
.container {
margin-top: 160rpx;
margin-top: 160rpx;
}
.state-content {
width: 670rpx;
height: 240rpx;
padding: 0 32rpx;
border-radius: 4px;
background: #F3E1E1;
width: 670rpx;
height: 240rpx;
padding: 0 32rpx;
border-radius: 4px;
background: #F3E1E1;
}
.state-content-invalid {
background: #ECF4F8;
background: #ECF4F8;
}
.state-content-title text {
height: 76rpx;
font-size: 54rpx;
font-weight: 500;
line-height: 76rpx;
color: #15191F;
height: 76rpx;
font-size: 54rpx;
font-weight: 500;
line-height: 76rpx;
color: #15191F;
}
.state-content-tip {
margin-top: 24rpx;
margin-top: 24rpx;
}
.state-content-tip text {
height: 36rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #15191F;
height: 36rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #15191F;
}
/* 订单信息 */
.info {
margin-top: 50rpx;
margin-top: 50rpx;
}
.info-content {
width: 670rpx;
min-height: 206rpx;
padding: 48rpx 32rpx;
background: #F3F4F6;
border-radius: 4px;
overflow: hidden;
position: relative;
width: 670rpx;
min-height: 206rpx;
padding: 48rpx 32rpx;
background: #F3F4F6;
border-radius: 4px;
overflow: hidden;
}
.info-content-item {
position: relative;
margin-top: 16rpx;
position: relative;
margin-top: 16rpx;
}
.info-content-item-label {
width: 104rpx;
height: 36rpx;
margin-right: 48rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #959DA9;
width: 104rpx;
height: 36rpx;
margin-right: 48rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #959DA9;
}
.info-content-item-title {
position: relative;
top: -8rpx;
width: 454rpx;
min-height: 52rpx;
position: relative;
top: -8rpx;
width: 454rpx;
min-height: 52rpx;
word-wrap: break-word;
font-size: 38rpx;
font-weight: 500;
line-height: 52rpx;
color: #15191F;
word-wrap: break-word;
font-size: 38rpx;
font-weight: 500;
line-height: 52rpx;
color: #15191F;
}
.info-content-item-describe {
height: 42rpx;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
height: 42rpx;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #15191F;
}
.info-content-item-tip {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #15191F;
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #15191F;
}
.info-line {
position: relative;
background: #F3F4F6;
position: relative;
background: #F3F4F6;
}
.info-line-line {
width: 670rpx;
height: 1px;
border: 1px #E2E7EF dashed;
width: 670rpx;
height: 1px;
border: 1px #E2E7EF dashed;
}
.info-line-point-left {
position: absolute;
left: -18rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background: #FFFFFF;
position: absolute;
left: -18rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background: #FFFFFF;
}
.info-line-point-right {
position: absolute;
right: -18rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background: #FFFFFF;
position: absolute;
right: -18rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background: #FFFFFF;
}
.info-code {
width: 670rpx;
min-height: 330rpx;
background: #F3F4F6;
width: 670rpx;
min-height: 330rpx;
background: #F3F4F6;
}
.info-code text:nth-child(1) {
height: 48rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #15191F;
height: 48rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #15191F;
}
.info-code button {
width: 606rpx;
height: 96rpx;
margin-top: 40rpx;
border-radius: 4px;
background: #86C5E1;
width: 606rpx;
height: 96rpx;
margin-top: 40rpx;
border-radius: 4px;
background: #86C5E1;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #FFFFFF;
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
color: #FFFFFF;
}
.info-code text:nth-child(3) {
height: 36rpx;
margin-top: 40rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #959DAA;
height: 36rpx;
margin-top: 40rpx;
font-size: 26rpx;
font-weight: 400;
line-height: 36rpx;
color: #959DAA;
}
/* 商品信息 */
.commodity {
margin: 64rpx 40rpx 0 40rpx;
margin: 64rpx 40rpx 0 40rpx;
}
.commodity-title {
height: 48rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #15191F;
height: 48rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #15191F;
}
.commodity-list {
width: 670rpx;
margin-top: 40rpx;
padding: 40rpx 32rpx 0 32rpx;
border-radius: 4px;
background: #F3F4F6;
width: 670rpx;
margin-top: 40rpx;
padding: 40rpx 32rpx 0 32rpx;
border-radius: 4px;
background: #F3F4F6;
}
.commodity-shop-info > image {
max-width: 62rpx;
max-height: 62rpx;
margin-right: 16rpx;
.commodity-shop-info>image {
max-width: 62rpx;
max-height: 62rpx;
margin-right: 16rpx;
}
.commodity-item {
width: 606rpx;
height: 184rpx;
border-bottom: 1px #E2E7EF solid;
width: 606rpx;
height: 184rpx;
border-bottom: 1px #E2E7EF solid;
}
.commodity-item > image {
width: 140rpx;
height: 136rpx;
margin-right: 24rpx;
.commodity-item>image {
width: 140rpx;
height: 136rpx;
margin-right: 24rpx;
}
.commodity-item-info {
width: 290rpx;
margin-right: 32rpx;
width: 290rpx;
margin-right: 32rpx;
}
.commodity-item-operation > button {
width: 120rpx;
height: 56rpx;
border-radius: 4px;
background: #86C5E1;
.commodity-item-operation>button {
width: 120rpx;
height: 56rpx;
border-radius: 4px;
background: #86C5E1;
font-size: 22rpx;
font-weight: 500;
line-height: 32rpx;
color: #FFFFFF;
font-size: 22rpx;
font-weight: 500;
line-height: 32rpx;
color: #FFFFFF;
}
.commodity-item-operation>button.btn-disabled {
background: #C8E1EC;
color: #FFFFFF;
}
.commodity-list .commodity-item:last-child {
border: none;
border: none;
}
/* 订单提示 */
.tip {
margin: 74rpx 40rpx 70rpx 40rpx;
margin: 74rpx 40rpx 70rpx 40rpx;
}
.tip-pay {
width: 670rpx;
width: 670rpx;
}
.tip-pay-title text {
height: 48rpx;
font-size: 34rpx;
font-weight: 800;
line-height: 48rpx;
color: #15191F;
height: 48rpx;
font-size: 34rpx;
font-weight: 800;
line-height: 48rpx;
color: #15191F;
}
.tip-pay-amount text:nth-child(1) {
height: 58rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #5DB5DD;
height: 58rpx;
font-size: 34rpx;
font-weight: 500;
line-height: 48rpx;
color: #5DB5DD;
}
.tip-pay-amount text:nth-child(2) {
height: 58rpx;
font-size: 42rpx;
font-weight: 500;
line-height: 48rpx;
color: #5DB5DD;
height: 58rpx;
font-size: 42rpx;
font-weight: 500;
line-height: 48rpx;
color: #5DB5DD;
}
.tip-describe {
width: 670rpx;
height: 168rpx;
margin-top: 32rpx;
font-size: 22rpx;
font-weight: 400;
line-height: 42rpx;
color: #959DA9;
width: 670rpx;
height: 168rpx;
margin-top: 32rpx;
font-size: 22rpx;
font-weight: 400;
line-height: 42rpx;
color: #959DA9;
}
/* 券码 */
.code-mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .6);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .6);
}
.code {
padding: 56rpx 40rpx 64rpx 40rpx;
padding: 56rpx 40rpx 64rpx 40rpx;
}
.code-tip text:nth-child(1) {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #FFFFFF;
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #FFFFFF;
}
.code-tip text:nth-child(2) {
height: 42rpx;
margin-top: 28rpx;
font-size: 30rpx;
font-weight: 400;
line-height: 42rpx;
color: #FFFFFF;
height: 42rpx;
margin-top: 28rpx;
font-size: 30rpx;
font-weight: 400;
line-height: 42rpx;
color: #FFFFFF;
}
.code-info-qrcode {
margin-top: 56rpx;
margin-top: 56rpx;
}
.code-info-qrcode > image {
display: block;
width: 296rpx;
height: 296rpx;
.code-info-qrcode>image {
display: block;
width: 296rpx;
height: 296rpx;
}
.code-info {
width: 526rpx;
height: 666rpx;
margin-top: 56rpx;
border-radius: 4px;
background: #FFFFFF;
width: 526rpx;
height: 666rpx;
margin-top: 56rpx;
border-radius: 4px;
background: #FFFFFF;
}
.code-info-copy {
width: 446rpx;
height: 96rpx;
margin-top: 56rpx;
padding: 0 24rpx;
border-radius: 4px;
background: #F2F3F5;
width: 446rpx;
height: 96rpx;
margin-top: 56rpx;
padding: 0 24rpx;
border-radius: 4px;
background: #F2F3F5;
}
.code-info-copy text:nth-child(1) {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #959DA9;
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #959DA9;
}
.code-info-copy text:nth-child(2) {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #15191F;
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #15191F;
}
.code-info-copy text:nth-child(3) {
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #5DB5DD;
height: 36rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 36rpx;
color: #5DB5DD;
}
.code-close {
width: 80rpx;
height: 80rpx;
margin-top: 48rpx;
border-radius: 50%;
background: #A9A8A7;
width: 80rpx;
height: 80rpx;
margin-top: 48rpx;
border-radius: 50%;
background: #A9A8A7;
}
.code-close>image {
width: 48rpx;
height: 48rpx;
}
/* 印章图 */
.seal-shot {
width: 166rpx;
height: 166rpx;
position: absolute;
right: -30rpx;
bottom: -30rpx;
}
.seal-long {
width: 166rpx;
height: 200rpx;
position: absolute;
right: 0;
bottom: -30rpx;
}
.p-relative {
position: relative;
}
/* 扫码弹窗 */
.order-status {
width: 670rpx;
height: 240rpx;
margin: 64rpx auto 0;
padding-left: 32rpx;
color: #15191F;
background-color: #ECF4F8;
}
.status-text {
font-size: 54rpx;
font-weight: 600;
}
.status-tips {
margin-top: 24rpx;
}
.bgPink {
background-color: #F3E1E1;
}
.ticket-wrapper {
width: 670rpx;
margin: 64rpx auto 0;
}
.ticket-main {
position: relative;
width: 100%;
padding: 48rpx 32rpx 46rpx;
background-color: #F3F4F6;
border-bottom: 1px dashed #E2E7EF;
}
.ticket-left {
width: 152rpx;
display: table-cell;
vertical-align: bottom;
font-size: 26rpx;
color: #959DA9;
}
.ticket-right {
flex: 1;
font-size: 26rpx;
}
.ticket-store {
font-size: 38rpx;
color: #15191F;
font-weight: 600;
}
.ticket-row-time,
.ticket-row-phone {
margin-top: 16rpx;
}
.ticket-time,
.ticket-address,
.ticket-date {
font-size: 30rpx;
line-height: 42rpx;
}
.ticket-info {
margin-top: 48rpx;
}
.seal-wrapper {
position: absolute;
right: 0;
bottom: -32rpx;
width: 166rpx;
height: 200rpx;
}
.seal {
width: 100%;
height: 100%;
}
.circle {
position: absolute;
left: -18rpx;
bottom: -18rpx;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
background-color: #fff;
}
.ticket-footer {
padding: 50rpx 32rpx 24rpx;
background-color: #F3F4F6;
}
.ticket-footer-top {
font-size: 34rpx;
color: #15191F;
}
.ticket-footer-middle {
width: 606rpx;
height: 96rpx;
line-height: 96rpx;
margin: 40rpx 0;
color: #fff;
text-align: center;
background-color: #86C5E1;
border-radius: 4rpx;
}
.ticket-footer-bottom {
font-size: 26rpx;
color: #959DAA;
}
/* 扫码弹窗 */
.scan-code-wrapper {}
.code-header {
height: 70rpx;
color: #fff;
font-size: 30rpx;
text-align: center;
}
.code-tips {
height: 92rpx;
color: #fff;
font-size: 26rpx;
text-align: center;
}
.code-main {
width: 750rpx;
height: 666rpx;
}
.code-item {
position: relative;
width: 526rpx;
height: 666rpx;
background-color: #fff;
border-radius: 4rpx;
}
.item-center {
margin-left: 112rpx;
}
.code-item-title {
color: #15191F;
font-size: 30rpx;
font-weight: 600;
}
.code-img {
width: 296rpx;
height: 296rpx;
margin: 56rpx 0;
}
.code-num-wrapper {
width: 446rpx;
height: 96rpx;
padding: 0 24rpx;
background-color: #F2F3F5;
border-radius: 4rpx;
line-height: 96rpx;
}
.code-num-title {
color: #959DA9;
text-decoration: none !important;
font-size: 26rpx;
}
.code-num {
color: #15191F;
font-size: 30rpx;
}
.code-used {
color: #C2C7CF;
text-decoration: line-through;
}
.num-copy {
color: #5DB5DD;
font-size: 26rpx;
}
.code-used-seal {
position: absolute;
right: -68rpx;
transform: translateY(56rpx);
width: 254rpx;
height: 254rpx;
}
.img-num {
margin-top: 54rpx;
}
.current-img-num {
color: #fff;
font-size: 34rpx;
}
.symbol-img-num,
.total-img-num {
color: #979797;
font-size: 26rpx;
}
.code-close-btn {
width: 80rpx;
height: 80rpx;
margin-top: 35rpx;
background: rgba(254, 252, 249, 0.5);
border-radius: 50%;
}
.code-close-btn image {
width: 60%;
}
.l-popup-bg {
background: rgba(0, 0, 0, .4);
}
.tips-wrapper {
margin: 40rpx 40rpx 0;
}
.notice-wrapper {
width: 100%;
height: 100rpx;
padding: 0 40rpx;
line-height: 100rpx;
}
.notice {
margin-right: 8rpx;
color: #15191F;
font-size: 26rpx;
}
.notice-popup-wrapper {
padding: 56rpx 40rpx 68rpx;
background-color: #fff;
border-radius: 24rpx 24rpx 0 0;
}
.notice-popup-title {
width: 100%;
height: 90rpx;
}
.notice-content {
max-height: 896rpx;
}
.goods-wrapper {
padding: 32rpx 40rpx 0;
}
.goods-title {
color: #15191F;
font-size: 34rpx;
font-weight: 600;
}
.goods-list {
margin-top: 40rpx;
padding: 0 32rpx 14rpx;
background-color: #F5F6F8;
}
.goods-list-title-wrapper {
width: 100%;
height: 132rpx;
}
.goods-list-title-img {
min-width: 40rpx;
min-height: 54rpx;
max-width: 74rpx;
max-height: 74rpx;
}
.goods-list-title {
margin-left: 16rpx;
color: #15191F;
font-size: 26rpx;
font-weight: 600;
}
.goods-item {
margin-bottom: 22rpx;
padding-bottom: 22rpx;
border-bottom: 1px solid #E2E7EF;
}
.goods-item:last-child {
margin-bottom: 0rpx;
border-bottom: none;
}
.goods-item-img {
width: 140rpx;
height: 136rpx;
}
.goods-item-info {
flex: 1;
padding-left: 24rpx;
}
.goods-item-info-text {
color: #15191F;
font-size: 26rpx;
font-weight: 600;
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.goods-item-info-price {
color: #15191F;
font-weight: 600;
}
.price-symbol {
font-size: 22rpx;
}
.price {
font-size: 26rpx;
}
.goods-item-btn {
width: 120rpx;
height: 56rpx;
margin-top: 40rpx;
margin-left: 32rpx;
color: #fff;
font-size: 22rpx;
text-align: center;
line-height: 56rpx;
background-color: #86C5E1;
border-radius: 4rpx;
}
.disabled {
background-color: #C8E1EC;
}
.order-info-wrapper {
position: relative;
width: 670rpx;
margin: 64rpx 40rpx 64rpx;
}
.order-price {
position: absolute;
top: 0;
right: 0;
width: 134rpx;
height: 58rpx;
color: #5DB5DD;
font-size: 34rpx;
font-weight: 600;
}
.order-price-symbol {
font-size: 30rpx;
}
.order-title {
width: 100%;
line-height: 68rpx;
font-size: 34rpx;
font-weight: 600;
}
.order-info {
margin-top: 22rpx;
}
.order-item {
width: 100%;
color: #959DA9;
font-size: 22rpx;
line-height: 42rpx;
}
.footer-btn {
padding: 32rpx 20rpx 0;
border-top: 1px solid #E2E7EF;
}
.delete-btn,
.order-btn {
width: 200rpx;
line-height: 96rpx;
margin-right: 24rpx;
border-radius: 4rpx;
font-size: 30rpx;
font-weight: 600;
text-align: center;
}
.delete-btn {
color: #656E7B;
background-color: #fff;
border: 1px solid #C2C7CF;
}
.order-btn {
color: #fff;
background-color: #86C5E1;
}
.code-close > image {
width: 48rpx;
height: 48rpx;
image {
width: 100%;
height: 100%;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment