digitalMen/pages/user/orderrecord/orderrecord.vue

<template>
	<view>
		<view style="color: #fff;">
			<tn-nav-bar backgroundColor="#26B3A0" :bottomShadow="false">订单记录</tn-nav-bar>
			<view :style="{height: tobheight+'px'}"></view>
		</view>
		<z-paging ref="paging" refresher-complete-delay="200" v-model="jobList" @query="queryList">
			<view slot="top" class="z_tabs" :style="{marginTop: tobheight+'px'}"></view>
			
				<block v-for="(item,index) in jobList" :key="index">
					<view class="record-list flxe justify-between">
						<view>
							<view class="record-title">微信支付</view>
							<view class="cart" style="margin-bottom: 10rpx;">{{'订单名称：'+item.title}}</view>
							<view class="cart" style="margin-bottom: 10rpx;">{{'订单类型：'+(item.type==2?'会员时长':(appInfo.number_alias?appInfo.number_alias:'点数'))}}</view>
							<view class="cart" style="margin-bottom: 10rpx;">{{'订单编号：'+item.order_number}}</view>
							<view class="cart" >{{'支付时间：'+item.create_time}}</view>
							
						</view>
						<view>
							<view class="quantity">￥{{item.pay_price}}</view>
						</view>
						
					</view>
				</block>
		</z-paging>
		
		<!-- <u-loading-page :loading="loading" loading-text="正在加载" icon-size="35" color="#9e9e9e" loadingColor="#9e9e9e"></u-loading-page> -->
		<wike-loading-page :isLoading="isLoading"></wike-loading-page>
	</view>
</template>

<script>
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
export default {
	data() {
		return {
			loading:true,
			jobList: [],
			tobheight:45,
			platform: this.$platform.get(),
			isLoading:true
		};
	},
	computed: {
		...mapGetters(['appInfo','userInfo'])
	},
	onLoad() {
		if(this.platform == 'wxMiniProgram'){
		var menumtop = uni.getMenuButtonBoundingClientRect().top - uni.getSystemInfoSync().statusBarHeight
		var paddingtop = uni.getSystemInfoSync().statusBarHeight + menumtop
		this.tobheight = (menumtop+paddingtop+uni.getMenuButtonBoundingClientRect().height)
		}
		
	},
	onShow() {
		if(!this.userInfo.nickname){
			uni.navigateTo({
				url:'/pages/user/signin'
			})
		}
	},
	methods: {
		queryList(pageNo, pageSize) {
			//这里的pageNo和pageSize会自动计算好，直接传给服务器即可
			const params = {
				page: pageNo,
				limit: pageSize,
			};
			this.$http('order.my', params).then(res => {
				if (res.code == 0) {
					uni.setNavigationBarTitle({
						title: this.appInfo.site_name
					});
					this.$refs.paging.complete(res.data.data);
					this.isLoading = false
				}
			});
		},
	}
};
</script>

<style lang="scss">
page {
	background: #f6f7fb;
}
// view,
// scroll-view,
// swiper,
// button,
// input,
// textarea,
// label,
// navigator,
// image {
// 	box-sizing: border-box;
// }
.record-list {
	background: #ffffff;
	margin: 30rpx;
	padding: 30rpx;
	border-radius: 20rpx;
	.record-title{
		font-size: 32rpx;
		margin-bottom: 30rpx;
		font-weight: bold;
	}
	.cart{
		color: #9e9e9e;
	}
	.quantity{
		font-weight: bold;
		font-size: 34rpx;
		color: red;
	}
}
</style>