区分优惠券类型

my/coupon/index.vue

@@ -1,276 +1,279 @@
-<template>
-	<view class="pages">
-		<!-- 切换选项 -->
-		<view class="nav">
-			<view @tap="change(0)" :class="{nav_btna:status == 0}">可使用</view>
-			<view @tap="change(1)" :class="{nav_btna:status == 1}">已使用</view>
-			<view @tap="change(2)" :class="{nav_btna:status == 2}">已失效</view>
-		</view>
-		<!-- 全部订单 -->
-		<view class="cont_one">
-			<view class="cont_one_ce" v-for="(item,index) in dataList" :key='index'>
-				<view class="cont_one_top">
-					<view class="cont_one_top_le flex align-center">
-						<image :src="item.shopId==0 || item.shopId==null?imgtype2:imgtype1" style="margin-right: 10rpx;width: 65rpx;height: 35rpx;border-radius: 8rpx;" mode=""></image>
-						{{item.couponName}}
-					</view>
-					<view class="cont_one_top_ri"><text>￥</text>{{item.money}}</view>
-				</view>
-				<view class="cont_one_text" style="font-size: 28upx;">
-					<text>有效期至{{item.expirationTime}}</text>
-					<view v-if="item.minMoney" >满{{item.minMoney}}元可用</view>
-					<view v-if="!item.minMoney" >无门槛优惠券</view>
-				</view>
-				<view class="cont_one_bottom">
-					<view class="cont_one_bottom_le" >
-						优惠券一张
-					</view>
-					<view class="cont_one_bottom_ri flex justify-center align-center" @click="use(item)" v-if="status == 0">立即使用</view>
-				</view>
-				<view class="cont_one_img" v-if="status == 1">
-					<image src="../static/coupon/has.png" mode=""></image>
-				</view>
-				<view class="cont_one_img" v-if="status == 2">
-					<image src="../static/coupon/failure.png" mode=""></image>
-				</view>
-			</view>
-		</view>
-		<empty v-if="!dataList.length" ></empty>
-		<u-popup v-model="popupShow" closeable mode="center" border-radius="20">
-			<view class="margin-tb text-center text-lg text-bold">使用规则</view>
-			<view class="padding-lr padding-bottom">
-				<view style="color: #333333;font-size: 28upx;width: 550rpx;height: 70vh;" v-html="content"></view>
-			</view>
-		</u-popup>
-	</view>
-</template>
-
-<script>
-	import empty from '@/components/empty.vue'
-	export default {
-		components: {
-			empty
-		},
-		data() {
-			return {
-				imgtype1:'https://mxys.chuanghai-tech.com/file/uploadPath/2022/11/23/24b686b872b3001f0342eae67db6d482.png',
-				imgtype2:'https://mxys.chuanghai-tech.com/file/uploadPath/2022/11/23/7716e0595580f34c4778ce5626dae262.png',
-				btnnum: 0,
-				page: 1,
-				limit: 10,
-				status: 0, //0正常 1已使用 2已失效
-				dataList: [],
-				popupShow: false,
-				content: '',
-				totalCount: 0
-			};
-		},
-		onLoad() {
-			this.getData()
-			// this.getGuize()
-		},
-		methods: {
-			change(e) {
-				this.status = e
-				this.page = 1
-				this.dataList = []
-				this.getData()
-			},
-			getData() {
-				let data = {
-					status: this.status,
-					page: this.page,
-					limit: this.limit,
-				}
-				this.$Request.get("/app/coupon/CouponList", data).then(res => {
-					if (res.code == 0) {
-						this.totalCount = res.data.totalCount
-						if (this.page == 1) {
-							this.dataList = res.data.list
-						} else {
-							this.dataList = [...this.dataList, ...res.data.list]
-						}
-					}
-				});
-			},
-			//优惠卷兑换规则
-			getGuize() {
-				this.$Request.getT('/app/common/type/240').then(res => {
-					if (res.code == 0) {
-						this.content = res.data.value;
-					}
-				})
-			},
-			use(item) {
-				if(!item.shopId){
-					uni.switchTab({
-						url: '/pages/index/index'
-					})
-				}else{
-					uni.navigateTo({
-						url: '/pages/index/shop/index?shopId=' + item.shopId
-					});
-				}
-			}
-		},
-		onReachBottom: function() {
-			if(this.dataList.length<this.totalCount) {
-				this.page = this.page + 1;
-				this.getData()
-			} else {
-				uni.showToast({
-					title: '已经到底了',
-					icon: 'none'
-				})
-			}
-		},
-	}
-</script>
-
-<style scoped>
-	/* 切换选项 */
-	.nav {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background-color: #FFFFFF;
-		color: #999999;
-	}
-
-	.nav view {
-		flex-grow: 1;
-		margin: 3% 9% 2%;
-		text-align: center;
-	}
-
-	.nav_btna {
-		font-size: 38rpx;
-		line-height: 34rpx;
-		border-bottom: 14rpx solid #FCD202;
-		color: #000000;
-		font-weight: bold;
-	}
-
-	/* 内容 */
-	/* 全部订单 */
-	.cont_one {
-		/* display: none; */
-		width: 94%;
-		margin: 0 auto;
-	}
-
-	.cont_one_ce {
-		width: 100%;
-		padding: 3% 3% 2%;
-		margin: 3% 0 0;
-		background-color: #FFFFFF;
-		border-radius: 18rpx;
-		position: relative;
-	}
-
-	.cont_one_top {
-		display: flex;
-		width: 100%;
-	}
-
-	.cont_one_top_le {
-		flex: 2;
-		font-size: 35rpx;
-		font-weight: 800;
-		color: #000000;
-		line-height: 32rpx;
-	}
-
-	.cont_one_top_le2 {
-		flex: 2;
-		font-size: 35rpx;
-		font-weight: 800;
-		color: #999999;
-		line-height: 32rpx;
-	}
-
-	.cont_one_top_ri {
-		flex: 1;
-		font-size: 40rpx;
-		text-align: right;
-		font-family: DINPro;
-		font-weight: 500;
-		color: #FF130A;
-		line-height: 32rpx;
-	}
-
-	.cont_one_top_ri text {
-		font-size: 30rpx;
-	}
-
-	.cont_one_text {
-		font-size: 30rpx;
-		margin: 2% 0 1%;
-		font-weight: 400;
-		color: #999999;
-		display: flex;
-		justify-content: space-between;
-	}
-
-	.cont_one_bottom {
-		width: 100%;
-		padding: 3% 0 0;
-		margin-top: 3%;
-		display: flex;
-		border-top: 2rpx dotted #E6E6E6;
-	}
-
-	.cont_one_bottom_le {
-		width: 80%;
-		/* font-size: 30rpx; */
-		font-weight: 500;
-		color: #999999;
-		line-height: 2;
-	}
-
-	.cont_one_bottom_ri {
-		width: 20%;
-		text-align: center;
-		/* line-height: 2; */
-		background: rgba(255, 19, 10, 0.2);
-		font-size: 24rpx;
-		border: 2rpx solid #FF130A;
-		color: #FF130A;
-		opacity: 0.6;
-		border-radius: 50rpx;
-	}
-
-	/* 到店取餐 */
-	/* .cont_two {
-		display: none;width: 94%;margin: 0 auto;
-	}
-	.cont_two_ce{
-		width: 94%;padding: 3% 3% 2%; margin: 3% 0 0 ;background-color: #FFFFFF;
-		border-radius: 18rpx;
-	} */
-	.cont_one_img {}
-
-	.cont_one_img {
-		width: 120upx;
-		height: 117upx;
-		position: absolute;
-		top: 0;
-		left: 83%;
-	}
-
-	.cont_one_img image {
-		width: 120upx;
-		height: 117upx;
-	}
-
-
-
-	.cont {
-		display: none;
-
-	}
-
-	.cont_dis {
-		display: block;
-	}
-</style>
+<template>
+	<view class="pages">
+		<!-- 切换选项 -->
+		<view class="nav">
+			<view @tap="change(0)" :class="{ nav_btna: status == 0 }">可使用</view>
+			<view @tap="change(1)" :class="{ nav_btna: status == 1 }">已使用</view>
+			<view @tap="change(2)" :class="{ nav_btna: status == 2 }">已失效</view>
+		</view>
+		<!-- 全部订单 -->
+		<view class="cont_one">
+			<view class="cont_one_ce" v-for="(item, index) in dataList" :key="index">
+				<view class="cont_one_top">
+					<view class="cont_one_top_le flex align-center">
+						<image
+							:src="item.shopId == 0 || item.shopId == null ? imgtype2 : imgtype1"
+							style="margin-right: 10rpx; width: 65rpx; height: 35rpx; border-radius: 8rpx"
+							mode=""
+						></image>
+						{{ item.couponName }}
+					</view>
+					<view class="cont_one_top_ri">
+						<text>￥</text>
+						{{ item.money }}
+					</view>
+				</view>
+				<view class="cont_one_text" style="font-size: 28upx">
+					<text>有效期至{{ item.expirationTime }}</text>
+					<view v-if="item.minMoney">满{{ item.minMoney }}元可用</view>
+					<view v-if="!item.minMoney">无门槛优惠券</view>
+				</view>
+				<view class="cont_one_bottom">
+					<view class="cont_one_bottom_le">{{ item.shopId == 0 ? '平台优惠券' : item.shopName + '商家优惠券' }}一张</view>
+					<view class="cont_one_bottom_ri flex justify-center align-center" @click="use(item)" v-if="status == 0">立即使用</view>
+				</view>
+				<view class="cont_one_img" v-if="status == 1">
+					<image src="../static/coupon/has.png" mode=""></image>
+				</view>
+				<view class="cont_one_img" v-if="status == 2">
+					<image src="../static/coupon/failure.png" mode=""></image>
+				</view>
+			</view>
+		</view>
+		<empty v-if="!dataList.length"></empty>
+		<u-popup v-model="popupShow" closeable mode="center" border-radius="20">
+			<view class="margin-tb text-center text-lg text-bold">使用规则</view>
+			<view class="padding-lr padding-bottom">
+				<view style="color: #333333; font-size: 28upx; width: 550rpx; height: 70vh" v-html="content"></view>
+			</view>
+		</u-popup>
+	</view>
+</template>
+
+<script>
+import empty from '@/components/empty.vue'
+export default {
+	components: {
+		empty
+	},
+	data() {
+		return {
+			imgtype1: 'https://mxys.chuanghai-tech.com/file/uploadPath/2022/11/23/24b686b872b3001f0342eae67db6d482.png',
+			imgtype2: 'https://mxys.chuanghai-tech.com/file/uploadPath/2022/11/23/7716e0595580f34c4778ce5626dae262.png',
+			btnnum: 0,
+			page: 1,
+			limit: 10,
+			status: 0, //0正常 1已使用 2已失效
+			dataList: [],
+			popupShow: false,
+			content: '',
+			totalCount: 0
+		}
+	},
+	onLoad() {
+		this.getData()
+		// this.getGuize()
+	},
+	methods: {
+		change(e) {
+			this.status = e
+			this.page = 1
+			this.dataList = []
+			this.getData()
+		},
+		getData() {
+			let data = {
+				status: this.status,
+				page: this.page,
+				limit: this.limit
+			}
+			this.$Request.get('/app/coupon/CouponList', data).then((res) => {
+				if (res.code == 0) {
+					this.totalCount = res.data.totalCount
+					if (this.page == 1) {
+						this.dataList = res.data.list
+					} else {
+						this.dataList = [...this.dataList, ...res.data.list]
+					}
+				}
+			})
+		},
+		//优惠卷兑换规则
+		getGuize() {
+			this.$Request.getT('/app/common/type/240').then((res) => {
+				if (res.code == 0) {
+					this.content = res.data.value
+				}
+			})
+		},
+		use(item) {
+			if (!item.shopId) {
+				uni.switchTab({
+					url: '/pages/index/index'
+				})
+			} else {
+				uni.navigateTo({
+					url: '/pages/index/shop/index?shopId=' + item.shopId
+				})
+			}
+		}
+	},
+	onReachBottom: function () {
+		if (this.dataList.length < this.totalCount) {
+			this.page = this.page + 1
+			this.getData()
+		} else {
+			uni.showToast({
+				title: '已经到底了',
+				icon: 'none'
+			})
+		}
+	}
+}
+</script>
+
+<style scoped>
+/* 切换选项 */
+.nav {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background-color: #ffffff;
+	color: #999999;
+}
+
+.nav view {
+	flex-grow: 1;
+	margin: 3% 9% 2%;
+	text-align: center;
+}
+
+.nav_btna {
+	font-size: 38rpx;
+	line-height: 34rpx;
+	border-bottom: 14rpx solid #fcd202;
+	color: #000000;
+	font-weight: bold;
+}
+
+/* 内容 */
+/* 全部订单 */
+.cont_one {
+	/* display: none; */
+	width: 94%;
+	margin: 0 auto;
+}
+
+.cont_one_ce {
+	width: 100%;
+	padding: 3% 3% 2%;
+	margin: 3% 0 0;
+	background-color: #ffffff;
+	border-radius: 18rpx;
+	position: relative;
+}
+
+.cont_one_top {
+	display: flex;
+	width: 100%;
+}
+
+.cont_one_top_le {
+	flex: 2;
+	font-size: 35rpx;
+	font-weight: 800;
+	color: #000000;
+	line-height: 32rpx;
+}
+
+.cont_one_top_le2 {
+	flex: 2;
+	font-size: 35rpx;
+	font-weight: 800;
+	color: #999999;
+	line-height: 32rpx;
+}
+
+.cont_one_top_ri {
+	flex: 1;
+	font-size: 40rpx;
+	text-align: right;
+	font-family: DINPro;
+	font-weight: 500;
+	color: #ff130a;
+	line-height: 32rpx;
+}
+
+.cont_one_top_ri text {
+	font-size: 30rpx;
+}
+
+.cont_one_text {
+	font-size: 30rpx;
+	margin: 2% 0 1%;
+	font-weight: 400;
+	color: #999999;
+	display: flex;
+	justify-content: space-between;
+}
+
+.cont_one_bottom {
+	width: 100%;
+	padding: 3% 0 0;
+	margin-top: 3%;
+	display: flex;
+	border-top: 2rpx dotted #e6e6e6;
+}
+
+.cont_one_bottom_le {
+	width: 80%;
+	/* font-size: 30rpx; */
+	font-weight: 500;
+	color: #999999;
+	line-height: 2;
+}
+
+.cont_one_bottom_ri {
+	width: 20%;
+	text-align: center;
+	/* line-height: 2; */
+	background: rgba(255, 19, 10, 0.2);
+	font-size: 24rpx;
+	border: 2rpx solid #ff130a;
+	color: #ff130a;
+	opacity: 0.6;
+	border-radius: 50rpx;
+}
+
+/* 到店取餐 */
+/* .cont_two {
+		display: none;width: 94%;margin: 0 auto;
+	}
+	.cont_two_ce{
+		width: 94%;padding: 3% 3% 2%; margin: 3% 0 0 ;background-color: #FFFFFF;
+		border-radius: 18rpx;
+	} */
+.cont_one_img {
+}
+
+.cont_one_img {
+	width: 120upx;
+	height: 117upx;
+	position: absolute;
+	top: 0;
+	left: 83%;
+}
+
+.cont_one_img image {
+	width: 120upx;
+	height: 117upx;
+}
+
+.cont {
+	display: none;
+}
+
+.cont_dis {
+	display: block;
+}
+</style>