spark-student/pagesMain/couponList.vue

<template>
	<view class="content">
		<u-tabs-swiper ref="uTabs" :active-color="mainColor" :list="tabList" :current="current" @change="tabsChange"
		 :is-scroll="false"></u-tabs-swiper>
		<swiper :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish" class="swiper-box">
			<swiper-item class="swiper-item" v-for="(item, index1) in tabList" :key="index1">
				<scroll-view scroll-y class="scroll-box" @scrolltolower="handleLoadMore" :refresher-enabled="true"
				 :refresher-triggered="triggered" :refresher-threshold="100" refresher-background="white" @refresherrefresh="onRefresh"
				 @refresherrestore="onRestore">
				 <template v-if="current != 3">
					 <u-card :show-head="false" :show-foot="false" padding="0px" margin="10px" borderRadius="40" v-for="(site, index2) in item.tableList"
					  :key="index2" class="class-card">
					 	<view class="class-content" slot="body">
					 		<view class="class-info-img">
					 			<u-image width="60px" height="60px" :src="site.url" shape="circle"></u-image>
					 		</view>
					 		<view class="class-info-content">
					 			<view class="class-info-label" v-if="site.discountType==3">{{site.name}}&nbsp;&nbsp;课时{{site.discountNum}}</view>
								<view class="class-info-label" v-else>{{site.name}}￥{{site.money}}</view>
					 			<view class="class-info-text">{{site.content}}</view>
					 			<view class="class-info-text">{{site.endDate}}&nbsp;&nbsp;到期</view>
					 		</view>
							<view style="width:40px;">
								<view class="card-mask" v-if="index1 == 1"></view>
								<template v-if="index1 == 0">
									<u-button v-if="site.commonFlag == 2" type="warning" :custom-style="{background: mainColor}" size="mini" shape="circle" :ripple="true"  @click="handleShowClick(site)">查看</u-button>
									<view class="out-date">{{ site.commonFlag == 1 ? '通用券' : '专用券' }}</view>
								</template>
								<view class="out-date" v-if="index1 == 2">已用</view>
							</view>

					 	</view>
					 </u-card>
					 <u-divider v-if="item.isOver" bg-color="transparent">没有更多了</u-divider>
				 </template>
					<template v-else>
						<view class="content-info">
							<view style="background: #fff;">
								<u-form ref="form" label-width="80">
									<u-form-item label="学员:" right-icon="arrow-right" required @click.native="studentShow = true">
										<u-input v-model="studentName" placeholder="请选择学员" disabled  @click="studentShow = true" />
									</u-form-item>
								</u-form>
							</view>
							<view class="share-img">
								<u-image width="60vw" height="60vw" :src="qrcodeUrl" ></u-image>
								<view class="qr-box">
									<canvas canvas-id="qrcode" style="width: 60vw;height:60vw;margin: 0 auto;"/>
								</view>
								<view class="share-class">共{{ classes }}节课</view>
							</view>
						</view>
					</template>
				</scroll-view>
			</swiper-item>
		</swiper>
		<!-- 可用场馆 -->
		<u-popup v-model="couponShow" mode="center" border-radius="30" width="600rpx">
			<view class="common-title">可用场馆</view>
			<view class="menber-box" style="overflow-y: auto;min-height: 200px;">
				<template v-if="Object.keys(venueInfo).length">
					<view style="font-size: 16px;font-weight: bold;margin-bottom: 5px;">卡种</view>
					<view style="margin-bottom: 8px;">{{ venueInfo.cardType }}</view>
					<view style="font-size: 16px;font-weight: bold;margin-bottom: 5px;">场馆</view>
					<view style="margin-bottom: 8px;">{{ venueInfo.venue }}</view>
				</template>
				<template v-else>
					<u-empty mode="data"></u-empty>
				</template>
			</view>
			<view class="button-box">
				<u-button type="warning" shape="circle" :ripple="true" :custom-style="customStyle" @click="couponShow = false">确定</u-button>
			</view>
		</u-popup>
		<u-picker mode="selector" v-model="studentShow" :range="studentList" range-key="childName" @confirm="handleStudentClick"></u-picker>
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	const NET = require('@/utils/request')
	const API = require('@/config/api')
	import uQRCode from '@/common/uqrcode.js'
	export default {
		computed: {
			...mapGetters([
				'mainColor',
				'handleCustomStyle',
				'handleDefaultCustomStyle',
			])
		},
		data() {
			return {
				triggered: false,
				tabList: [{
					name: '可用',
					isOver: false,
					pageIndex: 1,
					tableList: [],
				}, {
					name: '过期',
					isOver: false,
					pageIndex: 1,
					tableList: [],
				}, {
					name: '使用记录',
					isOver: false,
					pageIndex: 1,
					tableList: [],
				},{
					name: '赠送课时券',
					isOver: false,
					pageIndex: 1,
					tableList: [],
				}],
				current: 0,
				swiperCurrent: 0,
				//  学生id
				studentId: '',
				// 学生姓名
				studentName: '',
				studentShow: '',
				studentList: [],
				// 二维码
				qrcodeUrl: '',
				// 课时
				classes: 0,
				couponShow: false,
				venueInfo: {}
			}
		},
		onLoad() {0
			this.getTableList(0)
			this.getTableList(1)
			this.getTableList(2)
			this.getCouponList()
		},
		onReady() {},
		methods: {
			//  获取可用优惠券列表
			getCouponList() {
				NET.request(API.getUserStudent, {
					userId: uni.getStorageSync('userData').userId }, 'POST').then( res => {
						if(res.status == 10000) {
							this.studentList = res.data
							if(this.studentList.length) {
								this.handleStudentClick(0)
							}
						}
					})
			},
			//  优惠券可用场馆
			handleShowClick(site) {
				NET.request(API.getCouponExInfo, 
					{id: site.discountCouponId}, 'POST').then( res => {
						this.venueInfo = res.data
						this.couponShow = true
				})
			},
			//  选择学生
			handleStudentClick(args) {
				this.studentId = this.studentList[args].studentId
				this.studentName = this.studentList[args].childName
				this.getInfo()
			},
			//  根据学员获取二维码和剩余课时
			getInfo() {
				this.qrFun(this.studentId)
				
				/*NET.request(API.studentQRcode, { studentId: this.studentId },'POST').then(res => {
					if(res.status == 10000) {
						this.qrcodeUrl = 'data:image/png;base64,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'
					} 
				})*/
				NET.request(API.getGiveLessons, { studentId: this.studentId },'POST').then(res => {
					console.log(res);
					if(res.status == 10000) {
						console.log(res.data);
						this.classes = res.data.length
					} 
				})
			},
			qrFun: function(text) {
				let that=this
				uQRCode.make({
					canvasId: 'qrcode',
					componentInstance: this,
					text: "xinghuoclass66889955224477"+text,
					size: 150,
					margin: 0,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					errorCorrectLevel: uQRCode.errorCorrectLevel.H,
					success: res => {
						that.qrcodeUrl=res
						//console.log(res)
					}
				})
			},
			//  tab页面切换
			tabsChange(index) {
				this.swiperCurrent = index;
				let that=this
				console.log(index)
				if(index==3){
					setTimeout(function(){
						that.qrFun(that.studentId)
					},1000)
				}
			},
			//  swiper-item左右移动，通知tabs的滑块跟随移动
			transition(e) {
				let dx = e.detail.dx;
				this.$refs.uTabs.setDx(dx);
			},
			//  swiper滑动结束，分别设置tabs和swiper的状态
			animationfinish(e) {
				let current = e.detail.current;
				this.$refs.uTabs.setFinishCurrent(current);
				this.swiperCurrent = current;
				this.current = current;
				this.qrFun(this.studentId)
			},
			//  下拉刷新
			onRefresh() {
				if (!this.triggered) {
					this.triggered = true
					this.tabList[this.current].isOver = false
					this.tabList[this.current].pageIndex = 1
					this.tabList[this.current].tableList = []
					this.getTableList(this.current, 'refresh')
				}
			},
			//  重置下拉刷新状态
			onRestore() {
				this.triggered = 'restore'
				this.triggered = false
			},
			//  懒加载
			handleLoadMore() {
				if (!this.tabList[this.current].isOver) {
					this.tabList[this.current].pageIndex++
					this.getTableList(this.current)
				}
			},
			//  获取列表数据
			getTableList(index, refresh) {
				NET.request(API.getCouponList, {
					status: index,
					page: this.tabList[index].pageIndex,
					size: 10,
				}, 'POST').then(res => {
					this.triggered = false
					this.tabList[index].tableList = this.tabList[index].tableList.concat(res.data.row)
					this.tabList[index].isOver = res.data.row.length != 10
				}).catch(error => {
					this.triggered = false
					this.$refs.uTips.show({
						title: error.message,
						type: 'warning',
					})
				})
			}
		},
	}
</script>

<style>
	page {
		width: 100%;
		height: 100%;
		background-color: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	@import "@/static/css/themes.scss";

	.content {
		width: 100%;
		float: left;

		.swiper-box {
			height: calc(100vh - 34px);

			.swiper-item {
				height: calc(100vh - 34px);

				.scroll-box {
					width: 100%;
					height: calc(100vh - 34px);
					padding-bottom: 10px;
					box-sizing: border-box;

					.class-card {
						.class-content {
							padding: 10px 15px;
							display: flex;
							align-items: center;
							position: relative;
						}

						.class-info-img {
							width: 60px;
							height: 60px;
							margin-right: 10px;
						}

						.class-info-content {
							flex: 1;
						}

						.class-info-label {
							font-size: 16px;
							color: #000000;
							word-break: break-all;
							margin-bottom: 5px;
						}

						.class-info-text {
							color: #999999;
							margin-bottom: 5px;
						}

						.card-mask {
							width: 100%;
							height: 100%;
							position: absolute;
							left: 0;
							top: 0;
							background-color: rgba(0, 0, 0, 0.3);
						}

						.out-date {
							font-size: 14px;
							color: #ff9900;
							margin-bottom: 5px;
							position: absolute;
							right: 8px;
							bottom: 3px;
						}
					}
				}
			}
		}
	}
	.content-info {
		width: 100%;
		height: 100%;
		float: left;
		position: relative;
		border-top: 1px solid #eee;
		
		.share-img {
			top: 40%;
			left: 50%;
			transform: translate(-50%, -50%);
			position: absolute;
			
			.share-class {
				margin-top: 20rpx;
				text-align: center;
			}
		}
	}
	.qr-box {
		position: absolute;
		margin: 0 auto;
	}
	.menber-box {
		width: 100%;
		// float: left;
		padding: 10px 15px;
		// margin-bottom: 10px;
		
		.menber-col {
			width: 100%;
			padding: 15px;
			margin-bottom: 10px;
			display: inline-block;
			background-color: #FFFFFF;
			border-radius: 15px;
			box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
			position: relative;
			overflow: hidden;
			box-sizing: border-box;
			
			.menber-label {
				width: 100%;
				margin-bottom: 5px;
				float: left;
				font-size: 14px;
				// line-height: 20px;
			}
	
			.menber-num {
				width: 100%;
				float: left;
				font-size: 26px;
				line-height: 28px;
				color: $mainColor;
			}
	
			.menber-icon {
				font-size: 100px;
				color: $mainColor;
				position: absolute;
				right: -5px;
				bottom: -30px;
				opacity: 0.5;
			}
		}
	}
	.common-title {
		width:100%;
		text-align: center;
		font-size: 20px;
		margin: 10px 0;
	}
	.fix-add-icon {
		position: fixed;
		bottom: 15px;
		right: 15px;
	}
	.button-box {
		// width: 100%;
		padding: 10px 15px;
		box-sizing: border-box;
	}
</style>