renshou/template/coupons/index.vue

<template>
	<view class="coupon-box">
		<template name="coupons">
			<view class="mt30 bgfff copons-view">
				<navigator class="head" hover-class="none" url="/product/coupon/coupon">
					<view class="titleNav pdlr20 dflex">
						<view><text class="quan-tits">领券</text>更优惠</view>
						<image src="/static/pages/images/more.png" class="more"></image>
					</view>
					<!-- <image lazy-load="true" :src="hotTemplate.titleCon" mode="widthFix" class="imgtit"></image> -->
				</navigator>
				<view class="coupons-list ddflex">
					<scroll-view scroll-x="true" class="coupons-lists">
						<view :class="'li'+(item.userCount >= item.userReceive&&item.userCount!=0&&item.userReceive!=-1?' yi-li':'')" v-for="(item,index) in couponList" :key="index">
							<view class="li-c">
								<view class="coupons-top">
									<view class="coupons-money"><text>￥</text>{{item.couponAmount}}</view>
									<!-- <view class="coupons-type" v-if="item.couponType == 1">通用券</view> v-else -->
									<view class="coupons-man tover">{{item.couponTitle}}</view>
								</view>
								<view class="coupons-btn" @click="recieveCoupon(item,index)">{{item.userCount >= item.userReceive&&item.userCount!=0&&item.userReceive!=-1 ? '已领取' : '立即领取'}}</view>
								<image :src="picUrlss+'quan_bg.png'" class="coupons-bg"></image>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	const req = require("../../utils/request");
	const utils = require("../../utils/util");
	const app = getApp();
	export default {
		data() {
			return {
				picUrlss: req.public.picUrls,
			};
		},

		components: {},
		props: {
			couponList: Array,
		},
		options: {
		},

		mounted() {
		},

		methods: {
			recieveCoupon(item,index){
				if (item.userReceive > -1 && item.userCount >= item.userReceive) {
					return req.msg('超出优惠券领取限制，无法领取');
				}
				req.postRequest('/api/coupon/receive', {
					id: item.id
				}, res => {
					req.msg('领取成功');
				});
			}
		}
	};
</script>
<style>
	@import "./index.css";
</style>