eduepos_ui_store/pages/tools/hexiao_coupon.vue

<template>
	<view class="index-page">
		<view class="content-wrap color-white">
		    <view class="scan-code" @click="saoma">
		        <view class="label">扫码核销霸王餐券</view>
		        <u-icon name="scan" size="24" color="#666"></u-icon>
		    </view>
			<!-- <swiper-item class="swiper-box1"> -->
			    <scroll-view scroll-y class="scroll-order-list" @scrolltolower="scrolltolower">
					<view class="order-list">
					    <view class="item" v-for="item in couponList" :key="item.raffleRecordId">
					        <view class="goods-wrap">
					            <image class="goods-cover" :src="item.pictureUrl" />
					            <view class="cont">
									<view class="row">
										<view class="label">霸王餐标题:{{item.title}}</view>
									</view>
									<view class="row">
										<view class="label">奖品:{{item.goodsName}}</view>
									</view>
									<view class="row">
										<view class="label">兑奖人:{{item.memberName ? item.memberName : ''}}</view>
									</view>
					                <view class="row create-time">
					                    <view class="label">核销时间:</view>
					                    <view class="value">{{ item.useDate }}</view>
					                </view>
					               <!-- 
									<view class="row">
										<view class="label" v-if="item.takeupCode">取餐码:{{item.takeupCode}}</view>
									</view> -->
					            </view>
					        </view>
					    </view>
						
					</view>
					<view v-if="isShow" class="zanwu column">
						<image src="../../static/empty2x.png" style="width: 280upx;height: auto" mode="widthFix">
						</image>
						暂无数据
					</view>
					<uni-load-more :status="loadingType_status" v-if="ismore"></uni-load-more>
				</scroll-view>
			<!-- </swiper-item> -->
		</view>
	</view>
</template>

<script>
	import uniPopup from "@/components/uni-popup/uni-popup.vue"
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import {mapState} from 'vuex';
	export default {
		components: {
			uniPopup,
			uniLoadMore
		},
		data() {
			return {
				listUrl: '/storeHeXiaoApi/getCouponList', 
				checkUrl: '/storeHeXiaoApi/hxCheck', 
				cancelurl: '/storeHeXiaoApi/surePassStoreGoods',
				flag: false,
				isDisable1: false,
				page: 1,
				couponList: [],
				loadingType: 0,
				isShow: false,
				ismore: false,
				loadingType_status: 'more',
				errorMsg: ''
			};
		},
		onLoad() {
			
		},
		onShow() {
			this.loadData(this.errorMsg);
		},
		computed: {
			...mapState(['storeInfo'])
		},
		methods: {
			navTo(url){
				uni.navigateTo({
					url:url
				})
			},
			loadData(msg) {
				uni.showLoading({
					title: '加载中'
				});
				this.isShow = false
				this.ismore = false;
				var dateStr = (new Date()).getTime();
				var sign = this.getSign('' + this.storeInfo.storeUserId + dateStr);
				this.requst({
					url: this.listUrl,
					data: {
						storeId: this.storeInfo.storeId,
						storeUserId: this.storeInfo.storeUserId,
						timestamp: dateStr,
						sign: sign,
						currentPage: 1
					},
					success: res => {
						if (res.data.rtnBean.rtnCode == 0) {

							if (res.data.list != null && res.data.list.length > 0) {
								if (res.data.list != null && res.data.list.length > 0 && res.data.list
									.length <= 20) {
									this.couponList = res.data.list;
									if (res.data.page.pageCount == 1) {
										this.isShow = false
										this.loadingType = 2;
										this.loadingType_status = 'nomore';
										this.ismore = true;
									} else {
										this.isShow = true
										this.loadingType = 0;
										this.loadingType_status = 'more';
										this.ismore = true;
									}
								} else {
									this.ismore = false;
									this.isShow = true
									this.loadingType = 2;
								}
							} else {
								this.isShow = true
								this.couponList = [];
							}
						} else {
							this.isShow = true
							this.orderList = [];
						}
						uni.stopPullDownRefresh()
						uni.hideLoading();
						if (msg != '' && msg != undefined && msg != null) {
							uni.showToast({
								icon: 'none',
								title: msg,
								duration: 1500
							})
						}
						this.errorMsg = '';
					},
					fail: (e) => {
						console.log("接口调用失败:" + JSON.stringify(e));
						uni.stopPullDownRefresh()
						uni.hideLoading();
					},
				})
			},
			scrolltolower() {
				if (this.loadingType != 0) { // loadingType!=0;直接返回
					return false
				}
				this.loadingType_status = 'loading';
				this.page = this.page + 1;
				this.loadingType = 1;
				uni.showLoading({
					title: '加载中'
				});
				var dateStr = (new Date()).getTime();
				var sign = this.getSign('' + this.storeInfo.storeUserId + dateStr);
				this.requst({
					url: this.listUrl,
					data: {
						storeId: this.storeInfo.storeId,
						storeUserId: this.storeInfo.storeUserId,
						timestamp: dateStr,
						sign: signUser,
						currentPage: this.page
					},
					success: res => {
						if (res.data.rtnBean.rtnCode == 0) {
							if (res.data.list != "" && res.data.list != null && res.data.list.length > 0) {
								
								for (var i = 0; i < res.data.list.length; i++) {
									this.couponList.push(res.data.list[i]);
								}
								
								if (res.data.page.currentPage == res.data.page.pageCount) {
									this.loadingType = 2;
									this.loadingType_status = 'more'
									this.ismore = false;
								}else {
									this.isShow = false
									this.loadingType = 0;
									this.loadingType_status = 'more';
									this.ismore = true;
								}
							} else {
								this.loadingType_status = 'nomore'
								this.loadingType = 2;
								this.ismore = false;
							}
						} else {
							if (res.data.rtnBean.rtnMsg != '') {
								this.$api.msg(res.data.rtnBean.rtnMsg);
							}
						}
						uni.hideLoading();
					},
					fail: (e) => {
						console.log("接口调用失败:" + JSON.stringify(e));
						uni.hideLoading();
					},
				});
			},
			
			saoma() {
				uni.showLoading({
					title: '加载中'
				})
				var that = this;
				// 只允许从相机扫码
				wx.scanCode({
					onlyFromCamera: true,
					scanType: 'qrCode',
					success(res) {
						uni.hideLoading()
						that.isCouponCode(encodeURIComponent(res.result));
					},fail(res) {
						uni.hideLoading()
					}
				})
			},
			// 判断是不是核销码类型
			isCouponCode(secreyKey) {
				var dateStr = (new Date()).getTime();
				var sign = this.getSign(decodeURIComponent(secreyKey) + this.storeInfo.storeUserId + dateStr);
				let that = this
				this.requst({
					url: this.checkUrl,
					data: {
						secreyKey: decodeURIComponent(secreyKey),
						storeId: this.storeInfo.storeId,
						storeUserId: this.storeInfo.storeUserId,
						timestamp: dateStr,
						sign: sign
					},
					success: res => {
						if (res.data.rtnBean.rtnCode == 0) {
							uni.showModal({
								title: '提示',
								content: '是否确认核销？',
								success: function (r) {
									if (r.confirm) {
										that.cancelCoupon(res.data.obj)
									} else if (r.cancel) {
										console.log('用户点击取消');
									}
								}
							});
						}else {
							this.$api.msg(res.data.rtnBean.rtnMsg);
							this.errorMsg = res.data.rtnBean.rtnMsg;
							return;
						}
					},
					fail: (e) => {
						console.log("接口调用失败:" + JSON.stringify(e));
					},
				})
			},

			cancelCoupon (e) {
				uni.showLoading({
					title: '核销中'
				})
				var dateStr = (new Date()).getTime();
				var sign = this.getSign('' + this.storeInfo.storeUserId + dateStr);
				this.requst({
					url: this.cancelurl,
					data: {
						timestamp: dateStr,
						sign: sign,
						id: e.raffleRecordId,
						storeId: this.storeInfo.storeId,
						storeUserId: this.storeInfo.storeUserId
					},
					success: res => {
						
						if (res.data.rtnBean.rtnCode == 0) {
							uni.showToast({
								title: '核销成功',
								icon: 'none'
							})
							this.loadData()
						} else {
							if (res.data.rtnBean.rtnMsg != '') {
								this.$api.msg(res.data.rtnBean.rtnMsg);
								// return;
							}
						}
						uni.hideLoading()
					},
					fail: (e) => {
						uni.hideLoading()
						console.log("接口调用失败:" + JSON.stringify(e));
						this.handle = false;
					},
				});
			},
			onPullDownRefresh() {
				this.loadData();
			},
		},
	}
</script>

<style lang="scss" scoped>
	.fs14 {
	    font-size: $font-base;
	}
	.pd24 {
	    padding: 0 24rpx;
	    box-sizing: border-box;
	}
	.mlr24 {
	    margin: 0 24rpx;
	}
	.ptb10 {
	    padding: 10rpx 0;
	    box-sizing: border-box;
	}
	.mt10 {
	    margin-top: 10rpx;
	}
	.mt20 {
	    margin-top: 20rpx;
	}
	.mb10 {
	    margin-bottom: 10rpx;
	}
	.w100 {
	    width: 100%;
	}
	.borbtm {
	    border-bottom: 2rpx solid #ececec;
	}
	.text {
	    color: $text-color;
	}
	.desc {
	    color: $desc-color;
	}
	.index-page {
	    width: 100vw;
	    height: 100vh;
	    background-color: #f5f5f5;
	    ::-webkit-scrollbar {
	        display: none;
	    }
	}
	/deep/ .input-placeholder {
		color: #666666
	}
	.tabs-wrap {
	    padding-left: 5vw;
	    box-sizing: border-box;
	    background-color: #fff;
		position: fixed;
	    .tabs {
	        margin-bottom: 20rpx;
	    }
	}
	.content-wrap {
	    height: calc(100vh - 80rpx);
	    .take-food-wrap {
	        background-color: #f5f5f5;
	    }
	
	    .scan-code {
	        @include between;
	        height: 60rpx;
	        margin: 0 20rpx 20rpx;
	        padding: 0 20rpx;
	        box-sizing: border-box;
	        background-color: #f5f5f5;
	        .label {
	            font-size: $font-base;
	            color: $icon-color;
	        }
	    }
	    .item-date {
	        height: 60rpx;
	        background-color: #f5f5f5;
	        @include flexStart;
	        font-size: $font-base;
	        padding: 0 20rpx;
	        box-sizing: border-box;
	    }
	    .take-food-wrap {
	        background-color: #fff;
	    }
	    .item-food-no {
	        padding: 0 20rpx;
	        box-sizing: border-box;
	        border-bottom: 2rpx solid #ececec;
	        height: 100rpx;
	        @include between;
	        font-size: $font-base;
	        color: $title-color;
	        font-weight: bold;
	        .btn {
	            font-weight: normal;
	            width: 140rpx;
	            height: 52rpx;
	            background-color: $base-color;
	            color: #fff;
	            border-radius: 26rpx;
	            @include flexCenter;
	            font-size: $font-sm;
	        }
	    }
	    .btm {
	        font-size: $font-sm;
	        color: #6c6c6c;
	    }
	}
	.auto-taking-order {
	    width: 100vw;
	    height: 80rpx;
	    @include between;
	    padding: 0 20rpx;
	    box-sizing: border-box;
	    /deep/ .u-switch {
	        transform: scale(.75) translateX(12rpx);
	    }
	}
	.list-scroll-wrap {
	    width: calc(100vw - 40rpx);
	    margin-left: 20rpx;
	    padding-bottom: 20rpx;
	}
	.color-white {
	    background-color: #fff;
	    padding-top: 20rpx;
	    box-sizing: border-box;
	}
	.h70 {
	    .item-food-no {
	        height: 140rpx;
	    }
	    .top {
	        margin-bottom: 10rpx;
	    }
	}
	.swiper-wrap, .swiper-box1, .scroll-order-list {
	    height: calc(100vh - 120rpx);
	}
	.order-list {
	    padding: 20rpx;
	    box-sizing: border-box;
	    .item {
	        background-color: #fff;
	        border-radius: 20rpx;
	        overflow: hidden;
	        margin-bottom: 20rpx;
	    }
	    .store-wrap {
	        border-bottom: 2rpx solid #ececec;
	        @include between;
	        height: 100rpx;
	        padding: 0 20rpx;
	        box-sizing: border-box;
	    }
	    .store-icon {
	        min-width: 50rpx;
	        width: 50rpx;
	        height: 50rpx;
	        border-radius: 10rpx;
	        overflow: hidden;
	        .img {
	            width: 100%;
	            height: 100%;
	        }
	    }
	    .pay-state {
	        width: 140rpx;
	        min-width: 140rpx;
	        color: $desc-color;
	        text-align: right;
	        font-size: $font-base;
	    }
	    .store-name {
	        margin: 0 10rpx;
	        @include textOverflow;
	    }
	    .goods-wrap {
	        @include flexStart;
	        padding: 20rpx 20rpx 0;
	        box-sizing: border-box;
	        margin-bottom: 20rpx;
	    }
	    .goods-cover {
	        width: 96rpx;
	        min-width: 96rpx;
	        height: 96rpx;
	        margin-right: 20rpx;
	        border-radius: 10rpx;
	        overflow: hidden;
	    }
	    .cont {
	        width: calc(100% - 120rpx);
	    }
	    .row {
	        @include flexStart;
	        font-size: $font-base;
	        color: $text-color;
	    }
	    .label {
	        margin-right: 20rpx;
	    }
	    .btn-wrap {
	        display: flex;
	        justify-content: flex-end;
	        align-items: center;
	        margin: 0 20rpx 20rpx 0;
	    }
	    .btn {
	        background-color: $theme-color;
	        color: #fff;
	        height: 60rpx;
	        width: 180rpx;
	        border-radius: 30rpx;
			margin-left: 16rpx;
	        @include flexCenter;
	        font-size: $font-base;
	    }
		.btn1 {
	        // background-color: $theme-color;
	        color: black;
	        height: 60rpx;
	        width: 180rpx;
			border: 1px solid #ccc;
	        border-radius: 30rpx;
			margin-left: 16rpx;
	        @include flexCenter;
	        font-size: $font-base;
	    }
	}
</style>