carwin_activity_applet/dome/pages/order/index.vue

<template>
	<view class="order">
		<!-- header -->
		<cu-custom bgColor="bg-gradual-blue" isBack><view slot="content">拼团订单</view></cu-custom>
		<!-- section -->
		<cu-nav :active="active" @onChange="onChange" :value="value" />
		<view v-for="(item, index) in value" :key="index" class="box">
			<view v-show="index == active">
				<view style="overflow: hidden;" v-for="(itemB, indexB) of item.value" :key="indexB" class="bg-white  padding-top-sm radius margin-lr margin-top">
					<view class="padding-sm">
						<view class="padding-bottom-sm text-black text-bold ">{{ itemB.activity_name }}</view>
						<view v-if="itemB.show_amount && itemB.order_status" class="flex justify-between">
							<view class="padding-bottom-sm text-sm text-black">金额： {{ itemB.show_amount }}元</view>
							<view class="padding-bottom-sm text-sm text-black">状态： {{ itemB.order_status }}</view>
						</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.show_amount && !itemB.order_status">金额： {{ itemB.show_amount }}元</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.order_status && !itemB.show_amount">状态： {{ itemB.order_status }}</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.name">{{ itemB.name }}：{{ itemB.tel }}</view>
						<view class="padding-bottom-sm text-sm text-black" v-else>电话：{{ itemB.tel }}</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.number">车牌号： {{ itemB.number }}</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.model">车型： {{ itemB.model }}</view>
						<view class="padding-bottom-sm text-sm text-black" v-if="itemB.create_time">创建时间： {{ itemB.create_time }}</view>
					</view>
					<view v-if="active == '0'" class="flex">
						<view style="flex: 1;" @click="onPay(itemB.id, indexB)" class="padding text-center bg-green">支付</view>
						<view style="flex: 1;" @click="onClick(itemB.id, indexB)" class="padding text-center bg-red">删除</view>
					</view>
					<view v-else @click="onClick(itemB.id, indexB)" class="padding text-center bg-red">删除</view>
				</view>
				<van-empty v-if="item.value.length == 0 && item.no_more" description="暂无订单" />
				<view v-else :class="!item.no_more && item.pageCount <= item.totalPage ? 'cu-load bg-grey loading margin-top' : 'cu-load bg-grey over margin-top'"></view>
			</view>
		</view>
		<!-- footer -->
		<!-- 微信快捷登录 -->
		<van-dialog id="van-dialog" />
	</view>
</template>

<script>
import Dialog from '@/wxcomponents/vant/dist/dialog/dialog';
export default {
	data() {
		return {
			active: 0,
			value: [
				{
					id: 1,
					name: '进行中',
					no_more: false, //没有更多
					pageCount: 1,
					totalPage: 1,
					value: []
				},
				{
					id: 2,
					name: '拼团成功',
					no_more: false, //没有更多
					pageCount: 1,
					totalPage: 1,
					value: []
				},
				{
					id: 3,
					name: '拼团失败',
					no_more: false, //没有更多
					pageCount: 1,
					totalPage: 1,
					value: []
				}
			]
		};
	},
	onLoad(options) {
		this.active = options.active || 0;
		this.request();
	},
	methods: {
		// 报错
		showErr(content) {
			content = JSON.stringify(content) === '{}' ? '未知错误' : content;
			uni.showModal({
				content,
				showCancel: false,
				success: res => console.log(res)
			});
		},
		// 支付
		async onPay(id, index) {
			try {
				var res = await this.$global.request({
					url: `/customer/order/${id}/pay_order/ `,
					method: 'post',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded',
						Authorization: uni.getStorageSync('token')
					},
					data: {
						openid: this.$store.state.userInfo.openid,
						appid: this.$store.state.userInfo.appid,
						activity_id: this.$store.state.userInfo.activity_id
					}
				});
				this.signature(res.data, index);
			} catch (err) {
				this.showErr(err);
			}
		},
		// 支付签名
		signature(data, index) {
			uni.requestPayment({
				timeStamp: data.timeStamp,
				nonceStr: data.nonceStr,
				package: data.package,
				signType: data.signType,
				paySign: data.paySign,
				success: () => {
					var value = JSON.parse(JSON.stringify(this.value));
					var no_a = value[this.active].value.splice(index, 1);
					value[1].value.unshift(no_a[0]);
					this.value = value;
					uni.showToast({
						icon: 'none',
						title: '支付成功'
					});
				},
				fail: () => {
					uni.showToast({
						icon: 'none',
						title: '支付失败'
					});
				}
			});
		},
		// 删除
		 onClick(id, index) {
			Dialog.confirm({
			  title: '提示',
			  message: '确定要删除该订单？',
			})
			  .then(() => {
				  this.deleteIndex(id,index)
			  })
			  .catch(() => {
			    // on cancel
			  });
		},
		async deleteIndex(id, index) {
			try {
				var res = await this.$global.request({
					url: `/customer/order/${id}/del_order/ `,
					method: 'post',
					header: {
						'Content-Type': 'application/x-www-form-urlencoded',
						Authorization: uni.getStorageSync('token')
					},
					data: {
						appid: this.$store.state.userInfo.appid,
						activity_id: this.$store.state.userInfo.activity_id
					}
				});
				var value = JSON.parse(JSON.stringify(this.value));
				value[this.active].value.splice(index, 1);
				this.value = value;
			} catch (err) {
				this.showErr(err);
			}
		},
		// 不同状态
		onChange(index) {
			this.active = index;
			this.request();
		},
		// 请求
		async request() {
			var $value = JSON.parse(JSON.stringify(this.value));
			var { name, pageCount, no_more, totalPage, value, id } = $value[this.active];
			if (pageCount > totalPage) return false;
			var res = await this.$global.request({
				url: '/customer/order/',
				header: {
					'Content-Type': 'application/x-www-form-urlencoded',
					Authorization: uni.getStorageSync('token')
				},
				method: 'get',
				data: {
					page: pageCount,
					limit: 20,
					order_status: id,
					appid: this.$store.state.userInfo.appid,
					activity_id: this.$store.state.userInfo.activity_id
				}
			});
			pageCount++;
			totalPage = res.totalPage;
			if (pageCount > totalPage) no_more = true;
			value = value.concat(res.data);
			$value[this.active] = { name, pageCount, no_more, totalPage, value, id };
			this.value = $value;
		}
	}
};
</script>

<style></style>