147 lines
4.5 KiB
Vue
147 lines
4.5 KiB
Vue
|
<template>
|
|||
|
<view class="waper">
|
|||
|
<u-navbar :autoBack="true" :placeholder="true" bgColor="#FFF">
|
|||
|
<view slot='center' style="font-size: 36rpx; font-weight: bold;">
|
|||
|
核销记录
|
|||
|
</view>
|
|||
|
</u-navbar>
|
|||
|
<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback">
|
|||
|
<view class="list-box">
|
|||
|
<view class="list-item" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
|
|||
|
<view class="orderNum">核销码:{{item.verificationCode || '-'}}</view>
|
|||
|
<view class="con-box">
|
|||
|
<image class="img" :src="$utils.getJointImg(item.image11)" mode=""></image>
|
|||
|
<view class="con-right">
|
|||
|
<view class="title">{{item.ticketName}}</view>
|
|||
|
<view class="num">游客姓名:{{item.userName ? item.userName : '窗口售票'}}</view>
|
|||
|
<view class="price" v-if="item.mobile">手机号:{{item.mobile}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="time">核销时间:{{item.updateTime}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</mescroll-body>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
|||
|
export default {
|
|||
|
mixins: [MescrollMixin],
|
|||
|
data() {
|
|||
|
return {
|
|||
|
paddingTop: 0,
|
|||
|
list: []
|
|||
|
}
|
|||
|
},
|
|||
|
onLoad() {
|
|||
|
this.paddingTop = this.$paddingTop;
|
|||
|
},
|
|||
|
methods: {
|
|||
|
async upCallback (page) {
|
|||
|
let obj = { pageNum: page.num, pageSize: page.size };
|
|||
|
let info = await this.$http.verificationList(obj);
|
|||
|
if(page.num == 1) this.list = [];
|
|||
|
this.list = this.list.concat(info.rows);
|
|||
|
this.mescroll.endBySize(info.rows.length, info.total);
|
|||
|
},
|
|||
|
toDetail (item) {
|
|||
|
uni.navigateTo({
|
|||
|
url: `/pages/detail/detail?id=${item.id}`
|
|||
|
})
|
|||
|
},
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="scss">
|
|||
|
.waper{
|
|||
|
width: 100%;
|
|||
|
min-height: 100vh;
|
|||
|
background-color: #F9F9F9;
|
|||
|
.list-box {
|
|||
|
padding: 32rpx;
|
|||
|
.list-item {
|
|||
|
background: #FFFFFF;
|
|||
|
border-radius: 10rpx;
|
|||
|
padding: 24rpx 32rpx 32rpx;
|
|||
|
margin-bottom: 20rpx;
|
|||
|
&:last-child {
|
|||
|
margin-bottom: 0;
|
|||
|
}
|
|||
|
.orderNum {
|
|||
|
font-weight: 400;
|
|||
|
font-size: 28rpx;
|
|||
|
color: #999999;
|
|||
|
}
|
|||
|
.con-box {
|
|||
|
margin-top: 24rpx;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
flex-direction: row;
|
|||
|
justify-content: space-between;
|
|||
|
padding-bottom: 32rpx;
|
|||
|
border-bottom: 1rpx solid rgba(0,0,0,0.1);
|
|||
|
.img {
|
|||
|
width: 160rpx;
|
|||
|
height: 160rpx;
|
|||
|
margin-right: 20rpx;
|
|||
|
}
|
|||
|
.con-right {
|
|||
|
flex: 1;
|
|||
|
.title {
|
|||
|
font-weight: 500;
|
|||
|
font-size: 32rpx;
|
|||
|
color: #333333;
|
|||
|
}
|
|||
|
.num {
|
|||
|
font-weight: 400;
|
|||
|
font-size: 28rpx;
|
|||
|
color: #666666;
|
|||
|
margin-top: 27rpx;
|
|||
|
}
|
|||
|
.price {
|
|||
|
font-weight: 400;
|
|||
|
font-size: 28rpx;
|
|||
|
color: #666666;
|
|||
|
margin-top: 10rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
.time {
|
|||
|
font-weight: 400;
|
|||
|
font-size: 28rpx;
|
|||
|
color: #999999;
|
|||
|
margin-top: 32rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
.list{
|
|||
|
width: 100%; background: #fff; border-radius: 10rpx; box-sizing: border-box; padding: 32rpx 32rpx 22rpx; margin-bottom: 40rpx;
|
|||
|
&:last-child{ margin-bottom: 0; }
|
|||
|
.title{ line-height: 46rpx; color: #333; font-size: 32rpx; font-weight: bold; height: 46rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|||
|
.info{
|
|||
|
width: 100%; margin-top: 40rpx; box-sizing: border-box; padding-left: 202rpx; position: relative;
|
|||
|
.img{ width: 170rpx; height: 170rpx; position: absolute; left: 0; top: 0; }
|
|||
|
.text{
|
|||
|
width: 100%; height: 170rpx;
|
|||
|
view{
|
|||
|
&:first-child{ width: 100%; height: 78rpx; line-height: 39rpx; color: #333; font-size: 28rpx; font-weight: 500; overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
|
|||
|
&:last-child{
|
|||
|
width: 100%; height: 48rpx; margin-top: 12rpx; display: flex; justify-content: space-between; align-items: center; color: #666; font-size: 24rpx;
|
|||
|
text{
|
|||
|
&:first-child{ padding: 0 20rpx; line-height: 48rpx; background: #F4F4F4; border-radius: 2rpx; }
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
.price{ line-height: 40rpx; text-align: right; color: #333; font-size: 28rpx; font-weight: 500; }
|
|||
|
.bottom{ margin-top: 30rpx; border-top: 2rpx solid #E8E8E8; padding-top: 20rpx; text-align: right; color: #666; font-size: 28rpx; line-height: 38rpx; }
|
|||
|
}
|
|||
|
}
|
|||
|
</style>
|