优惠券，分解，个人中心

api/coupon.js

@@ -2,7 +2,7 @@ import { request } from "@/api/config.js"
 
 
 // 我的优惠卷列表
-export function mylistApi(data) {
+export function couponListApi(data) {
   return request({
     url: '/wx/coupon/mylist',
     method: 'get',

api/knapsack.js

@@ -33,3 +33,11 @@ export function packageOrderListApi(data) {
     data: data
   })
 }
+// 卡牌分解
+export function prizerRecoverApi(data) {
+  return request({
+    url: '/wx/bkm/package/prize/recover',
+    method: 'post',
+    data: data
+  })
+}

api/user.js

@@ -19,3 +19,12 @@ export function userInfoApi(data) {
     data: data
   })
 }
+// 注销账号
+export function logOffApi(data) {
+  return request({
+    url: '/wx/account/logOff',
+    method: 'post',
+    data: data
+  })
+}
+

component/paymentPopup.vue

@@ -9,7 +9,7 @@
 				<view class="row">
 					<view class="label">单价</view>
 					<view class="value price">
-						￥9.9
+						￥{{ info.price || 0}}
 					</view>
 				</view>
 
@@ -23,9 +23,18 @@
 				</view>
 
 				<view class="row">
-					<view class="label">可用优惠卷</view>
+					<view class="label">优惠卷</view>
 					<view class="value">
-
+						<view v-if="!selestCouponId && couponList.length > 0" class="hasCoupon" @click="showPopup3">
+							选择优惠券
+							<uni-icons type="right" color="#FF2C43" size="20"></uni-icons>
+						</view>
+						<view v-if="!selestCouponId && couponList.length == 0" class="noCoupon">
+							暂无可用优惠券
+						</view>
+						<view class="coupon price" v-if="selestCouponId">
+							-￥{{selestCoupon.discount}}
+						</view>
 					</view>
 				</view>
 
@@ -39,7 +48,7 @@
 				<view class="row">
 					<view class="label"></view>
 					<view class="value">
-						小计： <span class="price">￥9.9</span>
+						小计： <span class="price">￥{{ priceAll }}</span>
 					</view>
 				</view>
 
@@ -77,6 +86,34 @@
 				<Mloading text="抽奖中..." v-else />
 			</view>
 		</uni-popup>
+		<!-- 选则优惠券 -->
+		<uni-popup class="popup" ref="popup3" type="bottom" background-color="#F8F8F8">
+			<view class="popupContent">
+				<view class="title">
+					<!-- 选择优惠券 -->
+					<uni-icons class="close" @click="close3()" type="closeempty" size="20"></uni-icons>
+				</view>
+			</view>
+			<view class="popupList">
+				<view class="card" v-for="(item, index) in couponList" @click="clickSelestCoupon(item)">
+					<view class="leftIcon"></view>
+					<view class="left">
+						￥<span style="font-size: 18px;">{{item.discount}}</span>
+					</view>
+					<view class="right">
+						<view class="row title">
+							{{item.name}}
+						</view>
+						<view class="row endTime">
+							{{item.endTime}}到期
+						</view>
+						<view class="row desc">
+							{{item.desc}}
+						</view>
+					</view>
+				</view>
+			</view>
+		</uni-popup>
 	</view>
 
 </template>
@@ -85,23 +122,38 @@
 	import {
 		rewardType
 	} from "@/utils/commonConfig.js"
+	import {
+		couponListApi
+	} from "@/api/coupon.js"
 	import {
 		drawCardSubmitApi,
 		submittResultApi
 	} from "@/api/drawCard.js"
-	
+
 	import Mloading from "@/component/Mloading.vue"
 	export default {
 		components: {
 			Mloading
 		},
-		emits:['callBack'],
+		emits: ['callBack'],
 		props: {
 			value: {
 				type: Object,
 				default: {}
 			},
 		},
+		computed: {
+			priceAll() {
+				let num = this.params.raffleNumList.length * this.info.price
+				if (this.selestCoupon.discount) {
+					num = num - this.selestCoupon.discount
+				}
+				if (num <= 0) {
+					num = 0
+				}
+				return num
+			}
+		},
 		data() {
 			return {
 				rewardType: rewardType,
@@ -114,20 +166,27 @@
 				orderId: null,
 				prizes: [],
 				getApiNum: 0,
+				info: {},
+				// 优惠券
+				couponList: [],
+				// 选中的优惠券
+				selestCouponId: null,
+				selestCoupon: {}
 			}
 		},
 		mounted() {
 			// this.$refs.popup2.open('center')
 			// this.getLotteryResults()
-			
 		},
 		methods: {
-			show(id, list) {
+			show(id, list, info) {
 				console.log(list, 'list')
 				this.params.raffleId = id
 				this.params.raffleNumList = list
+				this.info = info
 				this.$refs.popup.open('bottom')
-				
+				// 获取优惠券列表
+				this.getCoupon()
 			},
 			close() {
 				this.$refs.popup.close()
@@ -135,10 +194,39 @@
 			close2() {
 				this.$refs.popup2.close()
 			},
+			showPopup3() {
+				// if (this.couponList.length > 0) {
+					this.$refs.popup3.open()
+				// }
+			},
+			close3() {
+				this.$refs.popup3.close()
+			},
+			// 获取优惠券
+			getCoupon() {
+				let params = {
+					limit: 999,
+					page: 1,
+					status: 0,
+					raffleId: this.params.raffleId
+				}
+				couponListApi(params).then(res => {
+					this.couponList = res.data.list
+				})
+			},
+			// 选择优惠券
+			clickSelestCoupon(item) {
+				this.selestCoupon = item
+				this.selestCouponId = item.id
+				this.close3()
+			},
 			submit() {
 				let _this = this
+				if (this.selestCouponId) {
+					this.params.couponId = this.selestCouponId
+				}
 				drawCardSubmitApi(this.params).then(res => {
-					console.log(res, '提交购买卡牌')	
+					console.log(res, '提交购买卡牌')
 					this.orderId = res.data.orderId
 					// 如果不需要付钱，直接进入抽卡结果
 					if (res.data.orderStatus == 201) {
@@ -194,63 +282,80 @@
 	.popupContent {
 		background-color: #F8F8F8;
 		border-radius: 10px 10px 0 0;
-	}
-
-	.title {
-		text-align: center;
-		padding: 15px;
-		font-weight: 600;
-
-		.close {
-			position: absolute;
-			right: 15px;
-			top: 15px;
-		}
-	}
 
-	.row {
-		margin: 10px 20px 0 20px;
-		display: flex;
-		justify-content: space-between;
-		padding: 12px;
-		background: #fff;
-		border-radius: 6px;
-		font-size: 14px;
-		color: #666666;
+		>.row {
+			margin: 10px 20px 0 20px;
+			display: flex;
+			justify-content: space-between;
+			padding: 12px;
+			background: #fff;
+			border-radius: 6px;
+			font-size: 14px;
+			color: #666666;
 
-		.price {
-			color: #FF2C43;
-			font-weight: 600;
-		}
+			.price {
+				color: #FF2C43;
+				font-weight: 600;
+			}
 
-		.label {
-			margin-right: 10px;
-		}
+			.label {
+				margin-right: 10px;
+			}
 
-		.number {
-			display: flex;
-			flex: 1;
-			overflow: auto;
-			max-width: 60%;
+			.number {
+				display: flex;
+				flex: 1;
+				overflow: auto;
+				max-width: 60%;
 
-			// justify-content: flex-end;
-			.item {
-				width: 48px;
-				height: 24px;
-				background: #DDDDDD;
-				border-radius: 51px;
-				color: #000000;
-				line-height: 24px;
-				text-align: center;
-				font-size: 12px;
-				margin-right: 5px;
+				// justify-content: flex-end;
+				.item {
+					width: 48px;
+					height: 24px;
+					background: #DDDDDD;
+					border-radius: 51px;
+					color: #000000;
+					line-height: 24px;
+					text-align: center;
+					font-size: 12px;
+					margin-right: 5px;
 
-				flex-grow: 0;
-				flex-shrink: 0;
+					flex-grow: 0;
+					flex-shrink: 0;
+				}
+			}
+			.value {
+				.hasCoupon {
+					display: flex;
+					align-items: center;
+					color: #FF2C43;
+					font-size: 12px;
+				}
+				.noCoupon {
+					display: flex;
+					align-items: center;
+					color: #8c8c8c;
+					font-size: 12px;
+				}
+			}
+		}
+		> .title {
+			text-align: center;
+			padding: 15px;
+			font-weight: 600;
+		
+			.close {
+				position: absolute;
+				right: 15px;
+				top: 15px;
 			}
 		}
 	}
 
+	
+
+
+
 	.tip {
 		margin: 10px 20px 0 20px;
 		color: #000000;
@@ -272,7 +377,17 @@
 		width: 90vw;
 		background: #fff;
 		border-radius: 10px;
-
+		> .title {
+			text-align: center;
+			padding: 15px;
+			font-weight: 600;
+		
+			.close {
+				position: absolute;
+				right: 15px;
+				top: 15px;
+			}
+		}
 		.prizes {
 			padding: 10px;
 
@@ -291,8 +406,61 @@
 			}
 		}
 	}
-	
+
+	.popupList {
+		max-height: 50vh;
+		min-height: 30vh;
+		overflow: auto;
+		background: #F8F8F8;
+		padding: 10px;
+
+
+		.card {
+			background: #fff;
+			border-radius: 8px;
+			overflow: hidden;
+			display: flex;
+
+			.leftIcon {
+				height: auto;
+				width: 8px;
+				background: #FF2C43;
+			}
+
+			.left {
+				width: 80px;
+				display: inline-flex;
+				justify-content: center;
+				align-items: center;
+				color: #FF2C43;
+				font-weight: 600;
+			}
+
+			.right {
+				padding: 10px;
+
+				.row {
+					margin-bottom: 4px;
+					font-size: 12px;
+				}
+
+				.title {
+					font-size: 14px;
+					font-weight: 600;
+				}
+
+				.endTime {
+					color: #FF2C43;
+				}
+
+				.desc {
+					margin-top: 5px;
+					color: #8c8c8c;
+				}
+			}
+		}
+	}
 </style>
 <style scoped>
-	
+
 </style>

pages.json

@@ -107,7 +107,7 @@
             "path" : "pages/coupon/coupon",
             "style" :                                                                                    
             {
-                "navigationBarTitleText": "我的优惠卷",
+                "navigationBarTitleText": "我的优惠券",
                 "enablePullDownRefresh": false
             }
             
@@ -121,6 +121,15 @@
             }
             
         }
+        ,{
+            "path" : "pages/user/user",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "编辑个人资料",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",

pages/coupon/coupon.vue

@@ -22,7 +22,7 @@
 
 <script>
 	import {
-		mylistApi
+		couponListApi
 	} from "@/api/coupon.js"
 	export default {
 		onLoad() {
@@ -34,14 +34,14 @@
 				params: {
 					limit: 999,
 					page: 1,
-					// status: 0
+					status: 0
 				}
 			}
 		},
 		methods: {
 			getList() {
-				mylistApi(this.params).then(res => {
-					console.log(res, '我的优惠卷')
+				couponListApi(this.params).then(res => {
+					console.log(res, '我的优惠券')
 					this.list = res.data.list
 				})
 			}

pages/drawCard_first/drawCard_first.vue

@@ -174,7 +174,7 @@
 					})
 					return
 				}
-				this.$refs.paymentPopup.show(this.params.raffleId, this.selectIndex)
+				this.$refs.paymentPopup.show(this.params.raffleId, this.selectIndex, this.detail)
 			},
 			// 支付成功后回调
 			paymentSuccess() {

pages/knapsack/knapsack.vue

@@ -49,7 +49,7 @@
 									<view class="row button">
 										<span></span>
 										<span>
-											<image style="width: 44px;" src="@/static/img/knapsack/button5.png"
+											<image @click="decompose(item)" style="width: 44px;" src="@/static/img/knapsack/button5.png"
 												mode="widthFix"></image>
 										</span>
 									</view>
@@ -159,7 +159,8 @@
 <script>
 	import {
 		packagePrizeListApi,
-		packageOrderListApi
+		packageOrderListApi,
+		prizerRecoverApi
 	} from "@/api/knapsack.js"
 	export default {
 		data() {
@@ -329,6 +330,41 @@
 						console.log('动画支持完毕')
 					})
 				}
+			},
+			decompose(value) {
+				// 分解卡牌
+				let _this = this
+				let prizeIdList = []
+				if (value.prizeName) {
+					prizeIdList = [value.id]
+				} else if (this.selectIndex.length > 0) {
+					prizeIdList = this.selectIndex
+				} else {
+					wx.showToast({
+						title: '请选则要分解卡牌。',
+						icon: 'none',
+					})
+					return
+				}
+				wx.showModal({
+					title: '确认分解卡牌？',
+					content: '卡牌分解后将无法找回。',
+					success: (res) => {
+						if (res.confirm) {
+							prizerRecoverApi(prizeIdList).then(res => {
+								console.log(res, 'res')
+								wx.showToast({
+									title: '分解成功。',
+									icon: 'none',
+								})
+								_this.getList()
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消')
+						}
+					}
+				})
+				
 			}
 		}
 	}

pages/mine/mine.vue

@@ -2,26 +2,23 @@
 	<view class="container">
 		<view class="user">
 			<view class="userInfo">
-				<image class="userPhoto" :src="userInfo.avatarUrl"></image>
+				<image @click="$navigateTo('/pages/user/user')" class="userPhoto" :src="userInfo.avatarUrl"></image>
 				<view class="info">
 					<view class="name" v-if="hasLogin">
-						{{userInfo.nickName}}
+						{{userInfo.nickName || ''}}
 					</view>
 					<view class="loginText" @click="toLogin" v-else>
 						点击登录
 					</view>
 					<view class="id">
-						ID: {{userId}}
+						ID: <span v-if="hasLogin">{{userId || ''}}</span>
 					</view>
 				</view>
-				<view class="" @click="loginOut">
-					退出登录
-				</view>
 			</view>
 			<view class="row">
 				<view class="box">
 					<view class="value" style="color: #FF2C43;">
-						1000
+						{{ userInfoDetail.integral || 0}}
 					</view>
 					<view class="label">
 						积分
@@ -29,7 +26,7 @@
 				</view>
 				<view class="box" @click="$redirectTo('/pages/coupon/coupon')">
 					<view class="value">
-						2
+						{{ userInfoDetail.couponNum || 0}}
 					</view>
 					<view class="label">
 						优惠卷
@@ -82,6 +79,7 @@
 				userInfo: null,
 				userId: '-',
 				hasLogin: false,
+				userInfoDetail: {},
 			}
 		},
 		onShow() {
@@ -90,23 +88,23 @@
 				this.userInfo = wx.getStorageSync('userInfo');
 				this.userId = wx.getStorageSync('userId');
 				this.hasLogin = true
+				// 获取用户信息详情
+				this.getUserInfo()
 			}
 		},
 		methods: {
+			getUserInfo() {
+				userInfoApi().then(res => {
+					console.log(res, '详细用户信息')
+					this.userInfoDetail = res.data
+				})
+			},
 			toLogin() {
 				wx.navigateTo({url: '/pages/login/login'})
 			},
 			pageTo(url) {
 				wx.navigateTo({url: url})
 			},
-			loginOut() {
-				wx.removeStorageSync('userInfo')
-				wx.removeStorageSync('userId')
-				wx.removeStorageSync('token')
-				getApp().globalData.hasLogin = false;
-				this.hasLogin = false
-			}
-			
 		}
 	}
 </script>

pages/user/user.vue

@@ -0,0 +1,52 @@
+<template>
+	<view>
+		<button @click="loginOut">退出登录</button>
+		<button @click="logOff">注销</button>
+	</view>
+</template>
+
+<script>
+	import {
+		logOffApi
+	} from "@/api/user.js"
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+			loginOut() {
+				wx.removeStorageSync('userInfo')
+				wx.removeStorageSync('userId')
+				wx.removeStorageSync('token')
+				getApp().globalData.hasLogin = false;
+				this.hasLogin = false
+			},
+			logOff() {
+				wx.showModal({
+					title: '确认注销账号？',
+					content: '注销账号后xxxxx',
+					success: (res) => {
+						if (res.confirm) {
+							console.log('用户点击确定')
+							logOffApi().then(res => {
+								wx.removeStorageSync('userInfo')
+								wx.removeStorageSync('userId')
+								wx.removeStorageSync('token')
+								getApp().globalData.hasLogin = false;
+								this.hasLogin = false
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消')
+						}
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+
+</style>