great_mobileui/center/couponselect.vue

<template>
	<view class="pages">
		<u-navbar
			title="选择优惠券"
			:placeholder="true"
			:autoBack="false"
			 @leftClick="leftClick"
			 :safeAreaInsetTop="true"
		>
		</u-navbar>
		<view class="page-wrap">
			<view class="coupon-list" v-if="dataList.length>0">
				<view class="item"
					:class="{disable:item.status==2}" 
					:style="{backgroundImage:`url(${staticUrl}/img/coupon-active-bg-v2.png)`,filter:item.status!=1?'grayscale(100%)':''}" v-for="item in dataList" :key="item.id">
					<view class="content u-flex">
						<view class="left">
							<view class="quota">
								<text v-if="item.type == 1">￥</text>
								<text class="number" :class="{'small': String(item.quota).length>=3}">{{item.type==1?item.quota:item.quota/10}}</text>
								<text v-if="item.type == 2">折</text>
							</view>
							<view class="condition" v-if="item.useThresholdType == 2">
								消费满{{item.useThresholdAmount}}可用
							</view>
						</view>
						<view class="center">
							<view class="name" :class="{'small': String(item.couponName).length>=9}">{{item.couponName}}</view>
							<view class="condition" v-if="item.useThresholdType == 2">
								消费满{{item.useThresholdAmount}}可用
							</view>
							<!-- <view class="tip">
								有效期至 {{item.endTime||''}}
							</view> -->
						</view>
						<view class="right">
							<text class="btn" @click="couponClick(item)">去使用</text>
							<!-- <view class="time">
								<view class="">{{item.startTime}}</view>
								<view class="">{{item.endTime}}</view>
							</view> -->
						</view>
					</view>
					<view class="bottom-time">
						有效期 {{item.startTime||''}} - {{item.endTime||''}}
					</view>
					<view class="type" v-if="item.type == 1">满减券</view>
					<view class="type" v-else-if="item.type == 2">折扣卷</view>
					<image class="status-img" :src="staticUrl+'/img/coupon-status-shiyong.png'" v-if="item.status == 2"></image>
					<image class="status-img" :src="staticUrl+'/img/coupon-status-guoqi.png'" v-if="item.status == 3"></image>
					<image class="status-img" :src="staticUrl+'/img/coupon-status-guoqi.png'" v-if="item.status == 4"></image>
				</view>
			</view>
			<u-empty mode="list" text="暂无可用优惠券" v-else></u-empty>
		</view>
	</view>
</template>

<script>
	export default{
		name:'',
		components:{
			
		},
		props:{
			
		},
		data(){
			return{
				staticUrl:this.$commonConfig.staticUrl,
				param:{
					salePrice:undefined,
					performId:undefined,
					goodsId:[]
				},
				dataList:[],
			}
		},
		onLoad(page){
			console.log('page',page);
			this.param.salePrice = page.salePrice;
			this.param.performId = page.performId;
			this.param.goodsId =  page.goodsId;
		},
		onShow() {
			this.findOrderCoupons()
		},
		methods:{
			leftClick(e){
				let pages = getCurrentPages();
				if(pages.length==1){
					uni.$u.route('/pages/index/index')
				}else{
					// uni.$u.route('/scenic/bookticket',{performId:this.performId})
					uni.navigateBack()
				};
			},
			findOrderCoupons(){
				this.$u.api.findOrderCoupons(this.param).then(res=>{
					this.dataList = res.data.list;
					}).catch(err=>{
					// console.log('findOrderCoupons',err.data);
				})
			},
			couponClick(item){
				let allPages = getCurrentPages(); //获取当前页面栈的实例；
				console.log('allPages',allPages);
				let prePages = allPages[allPages.length - 2].route;
				console.log('prePages',prePages);
				
				if(prePages=='pages/bookticket'){
					this.$u.vuex('coupon', item);
					uni.navigateBack();
				}else{
					uni.$u.route('/pages/index/index');
				}
			}
		}
	}
</script>

<style>
page{
	background-color: #f5f5f5;
}
</style>
<style lang="scss" scoped>
</style>