Explorar o código

feat:购买优惠券页面

zhanghui %!s(int64=2) %!d(string=hai) anos
pai
achega
160078c74e

+ 8 - 0
common/js/service.js

@@ -98,5 +98,13 @@ export default {
 
     },
 
+    // post请求,微信支付(根据订单ID)
+    wechatPay(data) {
+        return request({
+            url: '/business/wxPay/jsapiPay?orderNo=' + data.orderNo,
+            method: 'POST',
+            data: data
+        })
+    },
 
 }

+ 8 - 0
pages.json

@@ -130,6 +130,14 @@
 				"navigationStyle": "custom",
 				"enablePullDownRefresh" : false
 			}
+		},
+		{
+			"path" : "pages/purchaseCoupon/purchaseCoupon",
+			"style" :
+			{
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
 		}
 	],
 	"tabBar": {

+ 3 - 1
pages/addGroup/addGroup.vue

@@ -104,12 +104,14 @@
 			</view>
 		</uni-popup>
 
-
 	</view>
 </template>
 
 <script>
 	export default {
+		components: {
+
+		},
 		data() {
 			return {
 				height: '',

+ 33 - 1
pages/index/index.vue

@@ -3,6 +3,8 @@
 		<uni-nav-bar  :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true"   title="首页"  />
 		<manager :height="height" v-if="userInfo.isManager === 1"></manager>
 		<attach :height="height" v-else></attach>
+<!--		<button @click="wechatPay">调起支付测试按钮</button>-->
+
 	</view>
 </template>
 
@@ -31,7 +33,37 @@
 			this.userInfo = uni.getStorageSync('spreadUserInfo')
 		},
 		methods: {
-
+			// 微信支付
+			wechatPay(){
+				const that = this;
+				// 用户信息
+				this.$api.service.wechatPay({
+					orderNo:'CZ20240223125943175'
+				}).then((res)=>{
+					var param = res.data.data;
+					uni.requestPayment({
+						appId: param.appid,
+						timeStamp: param.timestamp+"",
+						nonceStr: param.noncestr,
+						package: "prepay_id="+param.prepayid,
+						signType: "RSA",
+						paySign: param.sign,
+						success: res => {
+							uni.showToast({
+								title: '支付成功!'
+							});
+							// 刷新用户信息
+							that.getUserInfo()
+						},
+						fail: res => {
+							uni.showModal({
+								content: '支付失败',
+								showCancel: false
+							});
+						}
+					});
+				})
+			},
 
 		}
 	}

+ 1 - 0
pages/my/my.vue

@@ -62,6 +62,7 @@
 		<view class="flex-col justify-start list">
 			<uni-list :border="false">
 				<uni-list-item v-if="userInfo.isManager == 1"  :clickable="true" title="我的分组" to="/pages/myGroup/myGroup" showArrow thumb="/static/my/fenzu.png" thumb-size="sm" rightText=""/>
+				<uni-list-item v-if="userInfo.isManager == 1"  :clickable="true" title="购买优惠券" to="/pages/purchaseCoupon/purchaseCoupon" showArrow thumb="/static/my/coupon.png" thumb-size="sm" rightText=""/>
 			</uni-list>
 		</view>
 	</view>

+ 158 - 0
pages/purchaseCoupon/index.rpx.css

@@ -0,0 +1,158 @@
+.page {
+	/*background-image: url('/static/my/bg1.png');*/
+	/*background-repeat: no-repeat;*/
+	/*background-size: 100% 30%;*/
+	background-color: #F9F9F9;
+	padding: 0 32rpx;
+	min-height: 100vh;
+}
+.coupon{
+	width: 686rpx;
+	height: 188rpx;
+	background-image: url('/static/my/couponBg.png');
+	background-repeat: no-repeat;
+	background-size: cover;
+	margin-top: 24rpx;
+}
+.couponLeft{
+	width: 195rpx;
+	height: 188rpx;
+	text-align: center;
+}
+.couponRight{
+	width: 490rpx;
+	height: 188rpx;
+}
+.couponRight1{
+	width: 450rpx;
+	height: 188rpx;
+	margin-left: 20rpx;
+}
+.discounts{
+	height: 52rpx;
+	font-weight: bold;
+	font-size: 36rpx;
+	color: #333333;
+	line-height: 52rpx;
+	text-align: center;
+	margin-top: 46rpx;
+}
+.condition{
+	height: 36rpx;
+	font-weight: 400;
+	font-size: 20rpx;
+	color: #333333;
+	line-height: 36rpx;
+	text-align: center;
+	margin-top: 8rpx;
+}
+.couponMsg{
+    width: 294rpx;
+}
+.purchaseBtn{
+	width: 156rpx;
+	height: 64rpx;
+	background: #FFE05C;
+	border-radius: 32rpx;
+
+	font-weight: 400;
+	font-size: 24rpx;
+	color: #333333;
+	line-height: 64rpx;
+	text-align: center;
+}
+.couponName{
+	height: 44rpx;
+	font-weight: bold;
+	font-size: 28rpx;
+	color: #333333;
+	line-height: 44rpx;
+	text-align: left;
+	margin-top: 16rpx;
+}
+.couponValue{
+	height: 36rpx;
+	font-weight: 400;
+	font-size: 20rpx;
+	color: #999999;
+	line-height: 36rpx;
+	text-align: left;
+}
+.price{
+	margin-top: 16rpx;
+}
+.couponPrice{
+	height: 44rpx;
+	font-weight: bold;
+	font-size: 28rpx;
+	color: #ED569F;
+	line-height: 44rpx;
+	text-align: right;
+	font-style: normal;
+}
+.purchasePopup{
+	height: 672rpx;
+	background: #F9F9F9;
+	border-radius: 24rpx 24rpx 0rpx 0rpx;
+	padding: 26rpx 32rpx 0rpx 32rpx;
+}
+.popupTitle{
+	height: 48rpx;
+	font-weight: bold;
+	font-size: 32rpx;
+	color: #111111;
+	line-height: 48rpx;
+}
+.conView{
+	width: 686rpx;
+	height: 108rpx;
+	background: #FFF6CE;
+	border-radius: 54rpx;
+	overflow: hidden;
+}
+.conPriceValue{
+	font-weight: 400;
+	font-size: 24rpx;
+	color: #333333;
+	line-height: 108rpx;
+	margin-left: 32rpx;
+}
+.conPrice{
+	font-weight: bold;
+	font-size: 36rpx;
+	color: #111111;
+	line-height: 52rpx;
+	margin-left: 8rpx;
+}
+.conBtn{
+	width: 220rpx;
+	height: 108rpx;
+	background: #FFE05C;
+	border-radius: 0rpx 60rpx 60rpx 0rpx;
+	text-align: center;
+
+	font-weight: bold;
+	font-size: 32rpx;
+	color: #111111;
+	line-height: 108rpx;
+}
+.title{
+	height: 44rpx;
+	font-weight: 500;
+	font-size: 28rpx;
+	color: #333333;
+	line-height: 44rpx;
+}
+.couponPrice1{
+	height: 48rpx;
+	font-weight: 500;
+	font-size: 32rpx;
+	color: #ED569F;
+	line-height: 48rpx;
+}
+.titleView{
+	padding: 32rpx 0;
+}
+.bordBottom{
+	border-bottom: 2rpx solid #EEEEEE;
+}

+ 139 - 0
pages/purchaseCoupon/purchaseCoupon.vue

@@ -0,0 +1,139 @@
+<template>
+	<view class="page">
+		<uni-nav-bar :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true" left-icon="left" title="购买优惠券" @clickLeft="back" />
+		<view class="flex-row coupon" v-for="i in 10">
+			<view class="flex-col couponLeft">
+				<text class="discounts">¥50</text>
+				<text class="condition">满300可用</text>
+			</view>
+			<view class="couponRight">
+				<view class="flex-col couponRight1">
+					<view class="flex-row justify-between">
+						<text class="couponName">门店通用</text>
+						<view class="price">
+							<text class="couponValue">单价:</text>
+							<text class="couponPrice">¥50</text>
+						</view>
+					</view>
+					<view class="flex-row">
+						<view class="couponMsg">
+							<view class="couponValue">
+								<text>使用平台:</text>
+								<text>全平台</text>
+							</view>
+							<view class="couponValue">
+								<text>使用次数:</text>
+								<text>1次</text>
+							</view>
+							<view class="couponValue">
+								<text>到期时间:</text>
+								<text>2024-01-01</text>
+							</view>
+						</view>
+						<view class="flex-col justify-end">
+							<view class="purchaseBtn" @click="openPurchase">
+								<text>立即购买</text>
+							</view>
+						</view>
+					</view>
+
+				</view>
+			</view>
+		</view>
+
+		<uni-popup ref="purchasePopup" type="bottom">
+			<view class="purchasePopup">
+				<view class="flex-row justify-between">
+					<text class="popupTitle">价格明显</text>
+					<u-icon name="close-circle" color="#000000" size="28"></u-icon>
+				</view>
+
+				<view class="flex-row coupon">
+					<view class="flex-col couponLeft">
+						<text class="discounts">¥50</text>
+						<text class="condition">满300可用</text>
+					</view>
+					<view class="couponRight">
+						<view class="flex-col couponRight1">
+							<view class="flex-row justify-between">
+								<text class="couponName">门店通用</text>
+							</view>
+							<view class="flex-row">
+								<view class="couponMsg">
+									<view class="couponValue">
+										<text>使用平台:</text>
+										<text>全平台</text>
+									</view>
+									<view class="couponValue">
+										<text>使用次数:</text>
+										<text>1次</text>
+									</view>
+									<view class="couponValue">
+										<text>到期时间:</text>
+										<text>2024-01-01</text>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+
+				<view class="flex-row justify-between titleView bordBottom">
+					<text class="title">优惠券单价</text>
+					<text class="couponPrice1">¥50.00</text>
+				</view>
+
+				<view class="flex-row justify-between titleView">
+					<text class="title">数量</text>
+					<u-number-box
+							min="1"
+							step="1"
+							inputWidth="50"
+							integer
+							button-size="30"
+							color="#666666"
+							bgColor="#ffffff"
+							iconStyle="color: #999999"
+					></u-number-box>
+				</view>
+
+				<view class="flex-row justify-between conView">
+					<view>
+						<text class="conPriceValue">待支付</text>
+						<text class="conPrice">¥500</text>
+					</view>
+					<view class="conBtn">
+						<text>提交</text>
+					</view>
+				</view>
+
+			</view>
+		</uni-popup>
+
+	</view>
+</template>
+
+<script>
+	export default {
+		components: {},
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+			back() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			openPurchase(){
+				this.$refs.purchasePopup.open()
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import './index.rpx.css';
+</style>

BIN=BIN
static/my/coupon.png


BIN=BIN
static/my/couponBg.png