Jelajahi Sumber

完善我的奖品

hwb0 3 tahun lalu
induk
melakukan
029bf6bcd5
5 mengubah file dengan 264 tambahan dan 185 penghapusan
  1. 16 3
      pages/core/index.vue
  2. 46 6
      pages/lucky/index.vue
  3. 90 96
      pages/order/settlement.vue
  4. 50 25
      pages/prize/detail.vue
  5. 62 55
      pages/prize/index.vue

+ 16 - 3
pages/core/index.vue

@@ -13,7 +13,10 @@
 						<image :src="item.picUrl" mode="aspectFill"></image>
 					</view>
 					<view class="title">{{ item.title }}</view>
-					<view class="bean">{{ item.exchangePrice }}</view>
+					<view class="bean">
+						<image src="../../static/logo.png" mode=""></image>
+						<view>x{{ item.exchangePrice }}</view>
+					</view>
 				</navigator>
 				<view class="core-list-item"></view>
 			</view>
@@ -120,8 +123,18 @@
 				}
 
 				.bean {
-					font-size: 24rpx;
-					color: #EB7009;
+					display: flex;
+					align-items: center;
+					font-size: 32rpx;
+					line-height: 44rpx;
+					color: rgba(235, 112, 9, 100);
+					margin-top: 12rpx;
+					
+					image {
+						width: 42rpx;
+						height: 42rpx;
+						margin-right: 16rpx;
+					}
 				}
 			}
 

+ 46 - 6
pages/lucky/index.vue

@@ -21,6 +21,13 @@
 		</view>
 
 		<pay-popup :pay-show="payShow" :pay-info="payInfo" @close="close" @success="getDetailInfo" />
+
+		<u-popup :show="showNull" :round="10" mode="center">
+			<view class="null-prize">
+				<view class="title">该盲票已兑奖</view>
+				<view class="btn" @click="toIndex">确认</view>
+			</view>
+		</u-popup>
 	</view>
 </template>
 
@@ -37,7 +44,8 @@
 				serialNo: '',
 				info: '',
 				payInfo: {},
-				payShow: false
+				payShow: false,
+				showNull: false
 			};
 		},
 
@@ -57,19 +65,27 @@
 				}).then(res => {
 					uni.hideLoading();
 					if (res.code == 0) {
-						if(res.data.status == 1){
+						if (res.data.status == 1) {
 							this.info = res.data
-						}else{
+						} else if (res.data.status == 2) {
 							uni.redirectTo({
 								url: `/pages/choice/index?id=${ res.data.ticketId }`
 							})
+						} else {
+							this.showNull = true
 						}
+					} else {
+						setTimeout(() => {
+							uni.switchTab({
+								url: '/pages/index/index'
+							})
+						}, 500)
 					}
 				}).catch(() => {
 					uni.hideLoading();
 				})
 			},
-			
+
 			getDetailInfo() {
 				this.payShow = false
 				uni.showLoading({
@@ -102,6 +118,7 @@
 					if (res.code == 0) {
 						let info = {
 							...res.data,
+							...this.info,
 							picUrl: env.filePublic + res.data.picUrl,
 						}
 						this.payInfo = info
@@ -185,12 +202,35 @@
 				text-align: center;
 			}
 		}
-		
-		.index{
+
+		.index {
 			margin: 60rpx 0;
 			text-align: center;
 			font-weight: bold;
 			color: $uni-color-primary;
 		}
 	}
+
+	.null-prize {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		width: 70vw;
+		height: 260rpx;
+		background-color: #FFFFFF;
+		border: 1px solid rgba(187, 187, 187, 100);
+
+		.btn {
+			margin-top: 50rpx;
+			width: 160rpx;
+			height: 60rpx;
+			line-height: 60rpx;
+			border-radius: 8rpx;
+			background-color: rgba(235, 112, 9, 100);
+			color: rgba(255, 255, 255, 100);
+			font-size: 28rpx;
+			text-align: center;
+		}
+	}
 </style>

+ 90 - 96
pages/order/settlement.vue

@@ -1,7 +1,6 @@
 <template>
 	<view>
-		<u-navbar title="结算" :border="true" :placeholder="true" :autoBack="true" leftIconColor="#fff"
-			bgColor="#E96737" />
+		<u-navbar title="提交订单" :border="true" :placeholder="true" :autoBack="true" bgColor="#fff" />
 		<view class="settlement">
 			<view class="settlement-address">
 				<view class="flex settlement-address-top">
@@ -50,15 +49,10 @@
 							<image class="img" :src="item.picUrl" mode="aspectFill">
 							</image>
 						</view>
-						<view class="info">
-							<text>{{ item.title }}</text>
-							<text>面值:{{ $numberFormat(item.facePrice) }}元</text>
-							<text>规格:{{ item.pkgUnit }}张/包 </text>
-						</view>
 					</view>
 					<view class="settlement-goods__detail__right">
-						<text>¥{{ $numberFormat(item.pkgSalePrice) }}</text>
-						<text>x {{ item.orderNum }}</text>
+						<view class="title">{{ item.title }}</view>
+						<view class="num">x {{ item.goodsNum }}</view>
 					</view>
 				</view>
 			</view>
@@ -70,12 +64,13 @@
 		</view>
 		<view class="footer-fixed">
 			<view class="flex btn">
-				<view class="btn-left">共计 {{ info.pkgNum }} 包</view>
-				<view class="btn-right">
+				<view class="btn-left">
 					<view class="money">
-						<text>计:</text>
-						<text>¥{{ $numberFormat(info.payAmt) }}</text>
+						<text>计:</text>
+						<text class="value">¥{{ $numberFormat(info.payAmt) }}</text>
 					</view>
+				</view>
+				<view class="btn-right">
 					<text class="save" @click="save">提交</text>
 				</view>
 			</view>
@@ -90,7 +85,7 @@
 	import $http from '@/utils/request.js'
 	import AreaPicker from '../../components/area-picker/area-picker.vue'
 	export default {
-		components:{
+		components: {
 			AreaPicker
 		},
 		data() {
@@ -123,10 +118,6 @@
 				this.ids = JSON.parse(opthios.ids)
 				this.getDetail()
 			}
-			if(opthios.boxId) {
-				this.boxId = opthios.boxId
-				this.getDetail()
-			}
 		},
 		onShow() {
 			if (this.toAddressShow) {
@@ -135,70 +126,96 @@
 		},
 		methods: {
 			save() {
-				$http.post('/api/v1/mp/channel/mall/order/submit', {
-					memo: ""
-				}).then(res => {
+				let _this = this
+				let payIng = false
+				if (payIng) return
+				$http.post('/api/v1/mp/user/deliver/order/submit', {}).then(res => {
+					payIng = true
 					if (res.code == 0) {
-						uni.navigateTo({
-							url:`/pages/order/index?back=1`
-						})
-					}
-					if (res.code == 1016) {
-						uni.showModal({
-							title: '提示',
-							content: '您还未通过经销商认证,请先提交认证。',
-							success(res) {
-								if (res.confirm) {
-									uni.navigateTo({
-										url: "/pages/attestation/index"
+						if (res.data.needPay == 1) {
+							$http.post('/api/v1/mp/user/deliver/order/pay', {
+								orderId: res.data.orderId,
+								payType: 2
+							}).then(ele => {
+								if (ele.code == 0) {
+									uni.requestPayment({
+										timeStamp: ele.data.timeStamp,
+										nonceStr: ele.data.nonceStr,
+										package: ele.data.package,
+										signType: ele.data.signType,
+										paySign: ele.data.paySign,
+										success() {
+											uni.showToast({
+												title: '支付成功',
+												icon: 'success',
+												duration: 2000
+											})
+											setTimeout(()=>{
+												uni.redirectTo({
+													url: `/pages/order/index`
+												})
+											},500)
+										},
+										fail() {
+											payIng = false
+										}
 									})
+								} else {
+									payIng = false
+									uni.$u.toast('支付失败!');
 								}
-							}
-						})
+							}).catch(() => {
+								payIng = false
+								uni.$u.toast('支付失败!');
+							})
+						} else {
+							uni.showToast({
+								title: '提交成功',
+								icon: 'success',
+								duration: 2000
+							})
+							setTimeout(()=>{
+								uni.redirectTo({
+									url: `/pages/order/index?back=1`
+								})
+							},500)
+						}
+					}else{
+						payIng = false
+						uni.$u.toast('提交失败!');
 					}
+				}).catch(() => {
+					payIng = false
+					uni.$u.toast('提交失败!');
 				})
 			},
 
 			getDetail() {
-				let data = this.ids.length ? {
-					cartIds: this.ids
-				} : {
-					boxId: this.boxId,
-					orderNum: 1
-				}
-				
-				$http.post('/api/v1/mp/channel/mall/order/settle', data).then(res => {
+				uni.showLoading({
+					title: '加载中'
+				});
+				$http.post('/api/v1/mp/user/deliver/order/settle', {
+					ids: this.ids
+				}).then(res => {
+					uni.hideLoading();
 					if (res.code == 0) {
 						this.info = res.data
 						this.addr = res.data.addr
-						res.data.items.forEach(item => {
-							let picUrlArr = item.picUrl.split(',')
-							item.picUrl = env.filePublic + picUrlArr[0]
+						res.data.prizeList.forEach(item => {
+							item.picUrl = env.filePublic + item.picUrl
 						})
-						this.list = res.data.items
+						this.list = res.data.prizeList
 					}
+				}).catch(() => {
+					uni.hideLoading();
 				})
 			},
 
-			getAddrDetail() {
-				$http.post('/api/v1/mp/channel/mall/addr/query', {
-					addrId: this.addrId
-				}).then(res => {
-					if (res.code == 0) {
-						let item = res.data
-						this.form = {
-							...item,
-							cityShow: `${ item.province }-${ item.city }-${ item.area }`
-						}
-					}
-				})
-			},
-			
 			selectArea() {
 				this.areaShow = true
 			},
-			
-			confirmArea(obj){
+
+			confirmArea(obj) {
 				// console.log(obj);
 				this.form.province = obj.province
 				this.form.provinceId = obj.provinceId
@@ -209,7 +226,7 @@
 				this.form.cityShow = obj.cityShow
 				this.areaShow = false
 			},
-			
+
 			cancel() {
 				this.areaShow = false
 			},
@@ -243,7 +260,7 @@
 					uni.$u.toast('请输入详细地址');
 					return
 				}
-				let url = '/api/v1/mp/channel/mall/addr/create'
+				let url = '/api/v1/mp/user/addr/create'
 				$http.post(url, this.form).then(res => {
 					if (res.code == 0) {
 						uni.$u.toast('保存成功');
@@ -255,11 +272,6 @@
 	}
 </script>
 
-<style lang="scss" scoped>
-	/deep/ .u-navbar__content__title.u-navbar__content__title {
-		color: #FFFFFF;
-	}
-</style>
 <style lang="scss" scoped>
 	.settlement {
 		margin: 10rpx;
@@ -311,7 +323,7 @@
 
 		&-goods {
 			background-color: #fff;
-			padding: 0 16rpx;
+			padding: 0 40rpx;
 			margin-bottom: 20rpx;
 
 			&__detail {
@@ -331,35 +343,15 @@
 							margin-right: 20rpx;
 						}
 					}
-
-					.info {
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-
-						text {
-							font-size: 24rpx;
-							color: #9D9D9D;
-						}
-
-						text:first-child {
-							color: rgba(16, 16, 16, 100);
-							font-size: 28rpx;
-						}
-					}
 				}
 
 				&__right {
+					flex: 1;
 					display: flex;
 					height: 170rpx;
 					flex-direction: column;
 					justify-content: space-between;
 					align-items: flex-end;
-
-					text:first-child {
-						font-size: 32rpx;
-						color: $uni-text-color;
-					}
 				}
 
 			}
@@ -395,15 +387,17 @@
 			justify-content: space-between;
 			padding: 10rpx 40rpx;
 
+			&-left {
+				.value {
+					color: $uni-text-color;
+				}
+			}
+
 			&-right {
 				display: flex;
 				align-items: center;
 				justify-content: flex-end;
 
-				.value {
-					color: $uni-text-color;
-				}
-
 				.save {
 					width: 190rpx;
 					height: 60rpx;

+ 50 - 25
pages/prize/detail.vue

@@ -3,62 +3,87 @@
 		<u-navbar :placeholder="true" bgColor="#fff" :autoBack="true" :border="true" title="卡券详情"></u-navbar>
 		<view class="detail">
 			<view class="flex detail-item">
-				<image src="../../static/logo.png" mode=""></image>
+				<image :src="info.picUrl" mode="aspectFill"></image>
 				<view class="flex info">
 					<view class="flex desc">
-						<view class="title">200元代金券</view>
-						<view class="txt">使用期限:2022.03.02-2022.04.01</view>
-						<view class="txt">适用范围:星巴克xxx店</view>
+						<view class="title">{{ info.title }}</view>
+						<view class="txt">使用期限:{{ $parseTime(info.validStart, '{y}.{m}.{d}') }}-{{ $parseTime(info.validEnd, '{y}.{m}.{d}') }}</view>
+						<view class="txt">适用范围:{{ info.useAreaDesc }}</view>
 					</view>
 					<view class="flex btn">
-						<view class="amt"><text>¥</text>100</view>
+						<view class="amt"><text>¥</text>{{ info.discount / 100 }}</view>
 					</view>
 				</view>
 			</view>
 			<view class="flex detail-code">
-				<image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fhbimg.b0.upaiyun.com%2F211e185f4b9df58bfe5dd69803b1df006b6cffd8b1b2-RtehJE_fw658&refer=http%3A%2F%2Fhbimg.b0.upaiyun.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1649408501&t=2dcfddb70458864d1c284b0020a3977d" mode=""></image>
+				<canvas style="width: 426rpx;height: 426rpx;" canvas-id="couponQrcode"></canvas>
 			</view>
 			<view class="detail-explain">
 				<view class="txt">使用说明:</view>
-				<view class="txt">1. 仅限星巴克杭州地区门店可使用</view>
+				<view class="txt">{{ info.description }}</view>
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
+	const qrCode = require('@/common/weapp-qrcode.js')
 	export default {
 		data() {
 			return {
-				
+				info: {}
 			};
+		},
+		onLoad(options) {
+			uni.showLoading({
+				title: '加载中'
+			});
+			this.info = JSON.parse(options.info)
+			console.log(this.info);
+			setTimeout(() => {
+				uni.hideLoading();
+				this.couponQrCode()
+			}, 50)
+		},
+		methods: {
+			// 二维码生成工具
+			couponQrCode() {
+				new qrCode('couponQrcode', {
+					text: this.info.verifyCode,
+					width: 213,
+					height: 213,
+					colorDark: "#333333",
+					colorLight: "#FFFFFF",
+					correctLevel: qrCode.CorrectLevel.H
+				})
+			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-	.detail{
+	.detail {
 		margin: 20rpx;
 		padding: 26rpx 24rpx;
 		background-color: #FFFFFF;
 		border-radius: 10rpx;
-		
+
 		&-item {
 			justify-content: space-between;
 			padding-bottom: 26rpx;
 			border-bottom: 1px dashed rgba(236, 236, 236, 100);
-			
+
 			image {
 				width: 94rpx;
 				height: 132rpx;
 			}
-		
+
 			.info {
 				position: relative;
 				justify-content: space-between;
 				flex: 1;
 			}
-		
+
 			.desc {
 				height: 132rpx;
 				flex-direction: column;
@@ -66,39 +91,39 @@
 				align-items: flex-start;
 				padding-left: 20rpx;
 			}
-		
+
 			.txt {
 				font-size: 24rpx;
 			}
-		
+
 			.btn {
 				flex-direction: column;
 			}
-		
+
 			.amt {
 				font-size: 48rpx;
 				font-weight: bold;
 				line-height: 72rpx;
 			}
-		
+
 			text {
 				font-size: 24rpx;
 			}
 		}
-		
-		&-code{
+
+		&-code {
 			padding: 60rpx 0;
-			
-			image{
+
+			image {
 				width: 426rpx;
 				height: 426rpx;
 			}
 		}
-		
-		&-explain{
+
+		&-explain {
 			font-size: 24rpx;
-			
-			.txt{
+
+			.txt {
 				line-height: 50rpx;
 			}
 		}

+ 62 - 55
pages/prize/index.vue

@@ -16,70 +16,47 @@
 		<!-- 实物商品 -->
 		<view class="prize-goods" v-if="state == 0">
 			<view class="prize-goods-list">
-				<view class="flex prize-goods-list-item">
+				<view class="flex prize-goods-list-item" v-for="(item, index) in list" :key="index">
 					<view class="flex checkbox">
 						<u-checkbox-group>
-							<u-checkbox :value="checked" shape="circle" :checked="checked" activeColor="#E96737"
+							<u-checkbox :value="item.checked" shape="circle" :checked="item.checked" activeColor="#E96737"
 								@change="changeChecked($event, item)"></u-checkbox>
 						</u-checkbox-group>
 					</view>
 					<view class="flex info">
-						<image src="../../static/logo.png" mode=""></image>
+						<image :src="item.picUrl" mode="aspectFill"></image>
 						<view class="flex desc">
-							<view class="content">Apple iPhone 13 (A2634) 128GB 星光色 支持移动联通电信5G 双卡双待手机</view>
-							<view class="num">数量:2</view>
-						</view>
-					</view>
-				</view>
-				<view class="flex prize-goods-list-item">
-					<view class="flex checkbox">
-						<u-checkbox-group>
-							<u-checkbox :value="checked" shape="circle" :checked="checked" activeColor="#E96737"
-								@change="changeChecked($event, item)"></u-checkbox>
-						</u-checkbox-group>
-					</view>
-					<view class="flex info">
-						<image src="../../static/logo.png" mode=""></image>
-						<view class="flex desc">
-							<view class="content">Apple iPhone 13 (A2634) 128GB 星光色 支持移动联通电信5G 双卡双待手机</view>
-							<view class="num">数量:2</view>
+							<view class="content">{{ item.title }}</view>
+							<view class="num">数量:{{ item.goodsNum }}</view>
 						</view>
 					</view>
 				</view>
 			</view>
+			<view class="flex empty" v-if="!list.length">
+				<u-empty text="数据为空" mode="order" />
+			</view>
 		</view>
 		<!-- 卡券 -->
 		<view class="prize-coupon" v-else>
 			<view class="prize-coupon-list">
-				<navigator url="/pages/prize/detail" class="flex prize-coupon-list-item" hover-class="navigator-hover">
-					<image src="../../static/logo.png" mode=""></image>
-					<view class="flex info">
-						<view class="flex desc">
-							<view class="title">200元代金券</view>
-							<view class="txt">使用期限:2022.03.02-2022.04.01</view>
-							<view class="txt">适用范围:星巴克xxx店</view>
-						</view>
-						<view class="flex btn">
-							<view class="amt"><text>¥</text>100</view>
-							<view class="action">立即使用</view>
-						</view>
-					</view>
-				</navigator>
-				<navigator url="/pages/prize/detail" class="flex prize-coupon-list-item" hover-class="navigator-hover">
-					<image src="../../static/logo.png" mode=""></image>
+				<navigator :url="`/pages/prize/detail?info=${ JSON.stringify(item) }`" class="flex prize-coupon-list-item" hover-class="navigator-hover" v-for="(item, index) in list" :key="index">
+					<image :src="item.picUrl" mode="aspectFill"></image>
 					<view class="flex info">
 						<view class="flex desc">
-							<view class="title">200元代金券</view>
-							<view class="txt">使用期限:2022.03.02-2022.04.01</view>
-							<view class="txt">适用范围:星巴克xxx店</view>
+							<view class="title">{{ item.title }}</view>
+							<view class="txt">使用期限:{{ $parseTime(item.validStart, '{y}.{m}.{d}') }}-{{ $parseTime(item.validEnd, '{y}.{m}.{d}') }}</view>
+							<view class="txt">适用范围:{{ item.useAreaDesc }}</view>
 						</view>
 						<view class="flex btn">
-							<view class="amt"><text>¥</text>100</view>
+							<view class="amt"><text>¥</text>{{ item.discount / 100 }}</view>
 							<view class="action">立即使用</view>
 						</view>
 					</view>
 				</navigator>
 			</view>
+			<view class="flex empty" v-if="!list.length">
+				<u-empty text="数据为空" mode="order" />
+			</view>
 		</view>
 
 		<view class="prize-action">
@@ -87,8 +64,8 @@
 			<view class="flex prize-action-goods" v-if="state == 0">
 				<view class="flex checkbox">
 					<u-checkbox-group>
-						<u-checkbox :value="checked" shape="circle" :checked="checked" activeColor="#E96737"
-							@change="changeChecked($event, item)"></u-checkbox>
+						<u-checkbox :value="checkedAll" shape="circle" :checked="checkedAll" activeColor="#E96737"
+							@change="changeCheckedAll($event)"></u-checkbox>
 					</u-checkbox-group>
 				</view>
 				<view class="btn" @click="toSettlement">立即提货</view>
@@ -114,35 +91,38 @@
 					name: '卡券',
 				}],
 				state: 0,
-				checked: false,
+				checkedAll: false,
 
 				pageNum: 1,
 				total: 0,
 				list: [],
 			};
 		},
-		onLoad() {
-			this.getList()
+		onShow() {
+			this.pageList()
 		},
 		methods: {
 			getList() {
-				let url = this.state == 0 ? '/api/v1/mp/user/mine/prize/list' : '/api/v1/mp/user/mine/coupon/list'
-				let data = this.state == 0 ? {} : {
+				let _this = this
+				let url = _this.state == 0 ? '/api/v1/mp/user/mine/prize/list' : '/api/v1/mp/user/mine/coupon/list'
+				let data = _this.state == 0 ? {} : {
 					status: 1
 				}
 				uni.showLoading({
 					title: '加载中'
 				});
-				$http.post(`${ url }?pageNum=${this.pageNum}&pageSize=20`, data).then(res => {
+				$http.post(`${ url }?pageNum=${_this.pageNum}&pageSize=20`, data).then(res => {
 					uni.hideLoading();
-					console.log(res);
-					return
 					if (res.code == 0) {
 						res.rows.forEach(item => {
 							item.picUrl = env.filePublic + item.picUrl
+							if (_this.state == 0) {
+								item.checked = false
+							}
 						})
-						this.total = res.total
-						this.list = this.list.concat(res.rows)
+						_this.total = res.total
+						_this.list = _this.list.concat(res.rows)
+						console.log(_this.list);
 					}
 				}).catch(() => {
 					uni.hideLoading();
@@ -165,9 +145,20 @@
 				this.pageList()
 			},
 
-			changeChecked() {
-
+			changeChecked(e, item) {
+				this.$set(item, 'checked', e)
+				let flag = this.list.every(item => item.checked == true)
+				this.checkedAll = flag
+				this.$forceUpdate()
 			},
+			
+			changeCheckedAll(e) {
+				this.list.forEach(item => {
+					item.checked = e
+				})
+				this.$forceUpdate()
+			},
+			
 
 			// 查看卡券使用记录
 			toCoupon() {
@@ -176,9 +167,21 @@
 				})
 			},
 
+			// 立即提货
 			toSettlement() {
+				let arr = []
+				this.list.forEach(item => {
+					if (item.checked) {
+						arr.push(item)
+					}
+				})
+				if (!arr.length) {
+					uni.$u.toast('请选择商品');
+					return
+				}
+				let ids = JSON.stringify(arr.map(item => item.storageId))
 				uni.navigateTo({
-					url: "/pages/order/settlement"
+					url: `/pages/order/settlement?ids=${ ids }`
 				})
 			},
 		}
@@ -186,6 +189,10 @@
 </script>
 
 <style lang="scss" scoped>
+	.empty {
+		height: 60vh;
+	}
+
 	.prize-state {
 		position: fixed;
 		background-color: #FFFFFF;