project/project1/pages/list/list.vue

<template>
	<view class="">
		<van-tabs :active="active" sticky animated @change="onChange">
			<van-tab title="待付款">
				<view v-for="(item,index) in order.records" :key="index">
					<view v-for="(item1,index1) in item.orderItemDtos" :key="index1">
						<van-card :num="item1.prodCount" :price="item1.price" :desc="item1.skuName"
							:title="item1.prodName" :thumb="item1.pic">
							<view slot="footer">
								<van-button size="mini" type="danger" @click="goPay(item)">去付款</van-button>
							</view>
						</van-card>
						<van-cell :border="false" title="总价" :value="item.actualTotal" />
						<van-cell :border="false" title="单号" :value="item.orderNumber" />
					</view>
				</view>
				<van-empty v-if="order.records.length == 0" description="当前内容为空" />
			</van-tab>
			<van-tab title="待发货">
				<view v-for="(item,index) in order.records" :key="index">
					<view v-for="(item1,index1) in item.orderItemDtos" :key="index1">
						<van-card :num="item1.prodCount" :price="item1.price" :desc="item1.skuName"
							:title="item1.prodName" :thumb="item1.pic" />
						<van-cell :border="false" title="总价" :value="item.actualTotal" />
						<van-cell :border="false" title="单号" :value="item.orderNumber" />
					</view>
				</view>
				<van-empty v-if="order.records.length == 0" description="当前内容为空" />
			</van-tab>
			<van-tab title="待收货">
				<view v-for="(item,index) in order.records" :key="index">
					<view v-for="(item1,index1) in item.orderItemDtos" :key="index1">
						<van-card :num="item1.prodCount" :price="item1.price" :desc="item1.skuName"
							:title="item1.prodName" :thumb="item1.pic" />
						<van-cell :border="false" title="总价" :value="item.actualTotal" />
						<van-cell :border="false" title="单号" :value="item.orderNumber" />
					</view>
				</view>
				<van-empty v-if="order.records.length == 0" description="当前内容为空" />
			</van-tab>
			<van-tab title="待评价">
				<view v-for="(item,index) in order.records" :key="index">
					<view v-for="(item1,index1) in item.orderItemDtos" :key="index1">
						<van-card :num="item1.prodCount" :price="item1.price" :desc="item1.skuName"
							:title="item1.prodName" :thumb="item1.pic" />
						<van-cell :border="false" title="总价" :value="item.actualTotal" />
						<van-cell :border="false" title="单号" :value="item.orderNumber" />
					</view>
				</view>
				<van-empty v-if="order.records.length == 0" description="当前内容为空" />
			</van-tab>
		</van-tabs>
	</view>
</template>

<script>
	import {
		myOrder,
		pay
	} from '@/api/order.js'
	export default {
		data() {
			return {
				active: 1,
				obj: {
					status: '',
					current: 1,
				},
				order: {
					records: []
				}
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			onChange(event) {
				this.active = event.detail.name;
				this.init();
			},
			init() {
				this.obj.status = this.active + 1;
				myOrder(this.obj).then(res => {
					let list = res;
					this.order.records = [];
					if (list.records.length > 0) {
						this.order.records = [...list.records];
					}
				})
			},
			goPay(item) {
				let _this = this;
				pay({
					orderNumbers: item.orderNumber,
					payType: 1
				}).then(res => {
					uni.showModal({
						title: "支付成功",
						content: "恭喜您完成支付!",
						success: function(res) {
							_this.init()
						}
					})
				})
			}
		}
	}
</script>

<style>
</style>