From 0ce83476a80c37f60ba36086c7c18ec3a2e08f7d Mon Sep 17 00:00:00 2001
From: shane <88386378@qq.com>
Date: Thu, 16 Dec 2021 01:23:15 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E6=83=A0=E5=88=B8=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/myAccount/myAccount.vue |  19 +-
 pages/myAccount/myCoupons.vue | 356 ++++++++++++++++++++++++++++++++++
 2 files changed, 368 insertions(+), 7 deletions(-)
 create mode 100644 pages/myAccount/myCoupons.vue

diff --git a/pages/myAccount/myAccount.vue b/pages/myAccount/myAccount.vue
index b95e36d..cb815a4 100644
--- a/pages/myAccount/myAccount.vue
+++ b/pages/myAccount/myAccount.vue
@@ -9,16 +9,17 @@
 						<text class="cuIcon-right margin-right-xs"></text>余额: {{item.amount}}</view>
 				</view>
 				<view class="action">
-
 				</view>
 			</view>
-			<view class="cu-item" v-if="accounts.length === 0">
-				<view class="content">
-					<text class="cuIcon-warn text-green"></text>
-					<text class="text-grey">暂无账户信息</text>
+			<view class="cu-item arrow" @click="coupons(item)">
+				<view class="content padding-tb-sm">
+					<view>
+						<text class="cuIcon-ticket text-green margin-right-xs"></text>我的优惠券</view>
+					<view class="text-gray text-sm">
+					</view>
 				</view>
 				<view class="action">
-
+			
 				</view>
 			</view>
 		</view>
@@ -83,12 +84,16 @@
 		 */
 		onShareAppMessage: function() {},
 		methods: {
+			coupons: function(_item) {
+				this.vc.navigateTo({
+					url: '/pages/myAccount/myCoupons',
+				})
+			},
 			myAccountDetail: function(_item) {
 				this.vc.navigateTo({
 					url: '/pages/myAccount/myAccountDetail?acctId=' + _item.acctId
 				});
 			},
-
 			/**
 			 * 加载业主房屋信息
 			 */
diff --git a/pages/myAccount/myCoupons.vue b/pages/myAccount/myCoupons.vue
new file mode 100644
index 0000000..38ecee6
--- /dev/null
+++ b/pages/myAccount/myCoupons.vue
@@ -0,0 +1,356 @@
+<template>
+	<view>
+		<view class="page">
+			<view class="tab">
+				<view class="tabItem" v-for="(item,index) in tab" :key="index" :class="{active:active==index}"
+					@click="changeTab(index)">
+					<view class="title">{{item}}</view>
+					<view class="underLine" :class="{active:active==index}"></view>
+				</view>
+			</view>
+			<view class="content">
+				<!-- 未使用 -->
+				<view >
+					<view class="list"  v-if="active==0">
+						<view class="listItem"  v-for="(item, index) in couponList" :key="index">
+							<image src="../../static/images/coupon.png" class="coupon"></image>
+							<view class="box">
+								<view class="price">
+									<view class="icon">¥</view>
+									<view class="volum">{{ item.actualPrice }}</view>
+								</view>
+								<view class="descripe">
+									<view class="shop-name">{{ item.couponName }}</view>
+									<view class="text">无门槛</view>
+									<view class="expire">{{ item.createTime }}-{{ item.endTime+'00：00' }}</view>
+								</view>
+								<view class="usestate" >
+									您可以在缴物业费、停车费等地方直接抵扣。
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+		
+				<!-- 已使用 -->
+				<view v-for="(itemsData, i) in list">
+					<view class="list expired" v-if="active==1">
+						<view class="listItem"  v-for="(item, index) in couponList" :key="index">
+							<image src="../../static/images/coupon.png" class="coupon"></image>
+							<view class="box">
+								<view class="price">
+									<view class="icon">¥</view>
+									<view class="volum">{{ item.actualPrice }}</view>
+								</view>
+								<view class="descripe">
+									<view class="shop-name">{{ item.couponName }}</view>
+									<view class="text">无门槛</view>
+									<view class="expire">{{ item.createTime }}-{{ item.endTime+'00：00' }}</view>
+								</view>
+								<view class="usestate" >
+									您已使用过此优惠券。
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				<!-- 已过期 -->
+				<view class="list expired" v-if="active==2">
+					<view >
+						<view class="listItem"  v-for="(item, index) in tmpCouponList" :key="index">
+							<image src="../../static/images/coupon.png" class="coupon"></image>
+							<view class="box">
+								<view class="price">
+									<view class="icon">¥</view>
+									<view class="volum">{{ item.actualPrice }}</view>
+								</view>
+								<view class="descripe">
+									<view class="shop-name">{{ item.couponName }}</view>
+									<view class="text">无门槛</view>
+									<view class="expire">{{ item.createTime }}-{{ item.endTime+'00：00' }}</view>
+								</view>
+								<view class="usestate" >
+									已过期，无法使用。
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	// pages/payParkingFee/payParkingFee.js
+	const context = require("../../context/Java110Context.js");
+	const constant = context.constant;
+	
+	import vcDiscount from '@/components/vc-discount/vc-discount.vue'
+	import vcUserAccount from '@/components/vc-user-account/vc-user-account.vue'
+	
+	// import mapping from '../../constant/MappingConstant.js'
+	// #ifdef H5
+	
+	const WexinPayFactory = require('../../factory/WexinPayFactory.js');
+	
+	// #endif
+	
+	// #ifdef APP-PLUS
+	import {getPayInfo} from '../../factory/WexinAppPayFactory.js'
+	// #endif
+	
+	import {addMonth,formatDate,date2String,dateSubOneDay} from '../../utils/DateUtil.js'
+	import {
+		getCouponUsers
+	} from '../../api/fee/feeApi.js'
+	
+	export default {
+		data() {
+			return {
+				couponList: [],
+				tmpCouponList:[],
+				userLink: '',
+				couponAmount: 0.0,
+				imgStaticUrl: this.STATICURL,
+				tab: ['未使用', '已使用', '已过期'],
+				active: 0, //当前选中项
+				isHas: true,
+				pageShow: false
+			}
+		},
+		onLoad: function(options){
+			context.onLoad(options);
+			this._loadCouponUsers();
+		},
+		methods: {
+			checkboxChange(e) {
+				this.couponAmount = '0'
+				var items = this.couponList
+				var values = e.detail.value;
+				for (var i = 0, lenI = items.length; i < lenI; ++i) {
+					items[i].checked = false;
+					for (var j = 0, lenJ = values.length; j < lenJ; ++j) {
+						if (items[i].couponId == values[j]) {
+							items[i].checked = true;
+							break
+						}
+					}
+					if (items[i].checked == true) {
+						this.couponAmount = parseFloat(this.couponAmount) + parseFloat(items[i].actualPrice)
+						}
+					}
+					console.log(this.couponList);
+				},
+			_loadCouponUsers: function() {
+				let _that = this;
+				let _objData = {
+					page: 1,
+					row: 30,
+					tel: context.getUserInfo().link,
+					state: '1001'
+				}
+				_that.couponList = [];
+				let _couponUsers= [];
+				getCouponUsers(_objData, _couponUsers)
+					.then((_couponList) => {
+						_couponList.data.forEach(items => {
+							items['checked'] = false;
+							if(items.isExpire == 'Y'){
+								_that.couponList.push(items);
+							}else{
+								_that.tmpCouponList.push(items);
+							}
+						})
+						console.log(_that.couponList);
+						//_that.noData = false;
+					}, () => {
+						//_that.noData = true;
+					})
+			
+			},
+			changeTab(index) {
+				this.list = []
+				this.active = index;
+				this.isHas = false
+				// this.$nextTick(() => {
+				// 	this._loadCouponUsers();
+				// })
+			},
+			_navigateBack: function(){
+				let _that = this;
+				let newCouponList = [];
+				_that.couponList.forEach(items => {
+					if(items.checked == true){
+						newCouponList.push(items);
+					}
+				})
+				
+				let outCouponList={
+					couponList: newCouponList,
+					couponAmount: _that.couponAmount
+				};
+				uni.setStorageSync(constant.mapping.COUPON_USER_KEY,outCouponList);
+				uni.navigateBack();
+			}
+		}
+	}
+</script>
+
+<style lang="less">
+
+	.fee-last {
+		margin-bottom: 200upx;
+	}
+
+	.cu-btn.lgplus {
+		padding: 0 20px;
+		font-size: 18px;
+		height: 100upx;
+
+	}
+
+	.cu-btn.sharp {
+		border-radius: 0upx;
+	}
+
+	.line-height {
+		line-height: 100upx;
+	}
+	.page {
+		.button {
+		    position: fixed;
+			bottom: 80rpx;
+			width: 500rpx;
+		    height: 44px;
+			left: 125rpx;
+		    font-size: 16px;
+		    background-image: -webkit-linear-gradient(left, #8bbefd, #e0e0e0);
+		    background-image: linear-gradient(to right, #8bbefd, #e0e0e0);
+			box-shadow: 4rpx 4rpx 4rpx #ccc;
+			border-radius: 50rpx;
+		}
+		
+		.tab {
+			top: 0;
+			position: fixed;
+			/* #ifdef H5 */
+			top: 88rpx;
+			/* #endif */
+			left: 0;
+			width: 100%;
+			display: flex;
+			align-items: center;
+			justify-content: space-around;
+			height: 88rpx;
+			background: #fff;
+			z-index: 2;
+			border-bottom: 1rpx solid #fbfbfb;
+	
+			.tabItem {
+				font-size: 28rpx;
+				line-height: 48rpx;
+				color: #999;
+				font-weight: 400;
+	
+				&.active {
+					color: #FA3E3F;
+					font-weight: 600;
+				}
+			}
+		}
+	
+		.content {
+			padding-top: 88rpx;
+	
+			.list {
+				.listItem {
+					padding: 11rpx 22rpx;
+					background: #fff;
+					position: relative;
+					border-bottom: 1rpx solid #fbfbfb;
+	
+					&:last-child {
+						border-bottom: none;
+					}
+	
+					.coupon {
+						width: 100%;
+						height: 188rpx;
+					}
+	
+					.box {
+						color: #fff;
+						position: absolute;
+						left: 32rpx;
+						top: 32rpx;
+						right: 32rpx;
+						bottom: 32rpx;
+						padding: 42rpx 23rpx 42rpx 31rpx;
+						display: flex;
+						justify-content: space-around;
+						align-items: center;
+	
+						.price {
+							display: flex;
+							justify-content: center;
+							align-items: center;
+							width: 120rpx;
+	
+							.icon {
+								font-size: 36rpx;
+							}
+	
+							.volum {
+								font-size: 60rpx;
+							}
+						}
+	
+						.descripe {
+							margin-left: 22rpx;
+							flex: 1;
+							
+							.shop-name{
+								background-color: #fff;
+								color: #79b2fb;
+								border-radius: 50rpx;
+								padding: 2rpx 10rpx;
+								width: fit-content;
+								font-size: 24rpx;
+							}
+	
+							.text {
+								font-size: 24rpx;
+								line-height: 33rpx;
+								margin-top: 15rpx;
+							}
+	
+							.expire {
+								font-size: 18rpx;
+								line-height: 25rpx;
+								margin-top: 15rpx;
+	
+							}
+						}
+						.usestate {
+							font-size: 24rpx;
+							width: 120rpx;
+							text-align: center;
+							image {
+								width: 121rpx;
+								height: 121rpx;
+							}
+						}
+					}
+				}
+	
+			}
+			
+			.expired{
+				.shop-name{
+					color: #adacac!important;
+				}
+			}
+		}
+	}
+</style>