混合支付

pages/pay/pay.vue

@@ -39,6 +39,26 @@
 				</label>
 			</radio-group>
 		</view>
+		<view class="deduction" v-if="(payMethod == 'wx' || payMethod == 'ali') && payType != 'free'">
+			<view class="deduction-item">
+				<view class="deduction-label">
+					<view class="title">使用火力值抵扣</view>
+					<view class="balance">余额:{{balance}}</view>
+				</view>
+				<u-switch
+					activeColor="#446EFE"
+					size="20"
+					v-model="isDeduction"
+					@change="onDeductionSwitch"
+				></u-switch>
+			</view>
+			<view class="deduction-item" v-if="isDeduction">
+				<view class="deduction-label">
+					<view class="title">使用数量</view>
+				</view>
+				<input class="deduction-input" type="number" placeholder="输入火力值" v-model="deductionVal" @blur="blurDeductionVal">
+			</view>
+		</view>
 		<!-- 确认支付 -->
 		<view class="payBtn">
 			<button size="default" @click="onPay">支付</button>
@@ -49,17 +69,21 @@
 <script>
 	import { info } from '@/apis/interfaces/order.js'
 	import { coinPay, diffCoinPay, umsPay, umsState, diffUmsPay, umsFree, umsFreeInfo } from '@/apis/interfaces/pay.js'
+import mixin from 'uview-ui/libs/mixin/mixin';
 	export default {
 		data() {
 			return {
-				getState  : false,
-				trade_id  : '',
-				orderId	  : '',
-				diffId	  : '',
-				payMethod : 'coin',
-				payType   : 'price',
-				total  	  : '0.00',
-				orderNo	  : '',
+				getState  	: false,
+				trade_id  	: '',
+				orderId	  	: '',
+				diffId	  	: '',
+				payMethod 	: 'coin',
+				payType   	: 'price',
+				total  	  	: '0.00',
+				orderNo	  	: '',
+				balance		: 0,
+				isDeduction	: false,
+				deductionVal: ''
 			};
 		},
 		onShow() {
@@ -109,6 +133,7 @@
 				title: '获取订单信息...',
 				mask : true
 			})
+			// 自由服务包订单信息
 			if(this.$Route.query.paytype === 'free'){
 				this.payMethod = "wx"
 				umsFreeInfo(this.$Route.query.serviceId).then(res => {
@@ -126,13 +151,15 @@
 				})
 				return
 			}
+			// 其他支付方式订单信息
 			info(this.$Route.query.orderId).then(res => {
-				let { total, order_no, business_order_id, diff_prices, diff } = res
+				let { total, order_no, business_order_id, diff_prices, diff, score } = res
 				this.orderId 	= business_order_id
 				this.diffId		= diff.business_order_diff_price_id
 				this.payType 	= this.$Route.query.paytype
 				this.total 		= this.payType === 'diff' ? diff_prices: total
 				this.orderNo 	= order_no
+				this.balance	= score
 				uni.hideLoading()
 			}).catch(err => {
 				uni.showToast({
@@ -142,6 +169,18 @@
 			})
 		},
 		methods: {
+			// 抵扣金额
+			onDeductionSwitch(e){
+				this.deductionVal = ''
+			},
+			// 抵扣金额
+			blurDeductionVal(e){
+				let { value } = e.target
+				let maxVal = Math.min(this.balance, this.total)
+				if(value > maxVal){
+					this.deductionVal = maxVal
+				}
+			},
 			// 支付方式
 			onPay(){
 				switch(this.payMethod){
@@ -156,32 +195,38 @@
 						})
 						break;
 					case 'wx':
-						if(this.payType == 'price') this.onUmsPay('mp')
-						if(this.payType == 'diff') this.onDiffUmsPay('mp')
+						if(this.payType == 'price') this.onUmsPay('app')
+						if(this.payType == 'diff') this.onDiffUmsPay('app')
 						if(this.payType == 'free') this.onFreePay('mp')
 						break;
 					case 'ali':
-						if(this.payType == 'price') this.onUmsPay('mp_alipay')
-						if(this.payType == 'diff') this.onDiffUmsPay('mp_alipay')
+						if(this.payType == 'price') this.onUmsPay('app_alipay')
+						if(this.payType == 'diff') this.onDiffUmsPay('app_alipay')
 						if(this.payType == 'free') this.onFreePay('mp_alipay')
 						break;
 				}
 			},
+			// 混合支付
+			
 			// 银联三方支付
 			onUmsPay(type){
 				uni.showLoading({
 					title: '加载中...',
 					mask : true
 				})
-				umsPay(this.orderId, { type }).then(res => {
+				umsPay(this.orderId, {
+					type,
+					use_fire: this.isDeduction ? 1 : 0,
+					fire	: this.deductionVal || 0,
+				}).then(res => {
 					uni.hideLoading()
 					this.getState = true
 					this.trade_id = res.trade_id
 					switch (type){
-						case 'mp':
+						case 'app':
 							this.onMiniWx()
 							break;
-						case 'mp_alipay':
+						case 'app_alipay':
 							plus.runtime.openURL(res.alipay)
 							break;
 					}
@@ -198,15 +243,19 @@
 					title: '加载中...',
 					mask : true
 				})
-				diffUmsPay(this.diffId, {type}).then(res => {
+				diffUmsPay(this.diffId, {
+					type,
+					use_fire: this.isDeduction ? 1 : 0,
+					fire	: this.deductionVal || 0
+				}).then(res => {
 					uni.hideLoading()
 					this.getState = true
 					this.trade_id = res.trade_id
 					switch (type){
-						case 'mp':
+						case 'app':
 							this.onMiniWx()
 							break;
-						case 'mp_alipay':
+						case 'app_alipay':
 							plus.runtime.openURL(res.alipay)
 							break;
 					}
@@ -228,10 +277,10 @@
 					this.getState = true
 					this.trade_id = res.trade_id
 					switch (type){
-						case 'mp':
+						case 'app':
 							this.onMiniWx()
 							break;
-						case 'mp_alipay':
+						case 'app_alipay':
 							plus.runtime.openURL(res.alipay)
 							break;
 					}
@@ -340,6 +389,33 @@
 				color: gray;
 			}
 		}
+		// 支付抵扣
+		.deduction{
+			background: white;
+			border-radius: 20rpx;
+			padding: 10rpx 30rpx;
+			margin-top: 30rpx;
+			.deduction-item{
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 20rpx 0;
+				.deduction-label{
+					display: flex;
+					flex-direction: column;
+					justify-content: center;
+					width: 300rpx;
+					.title{ font-size: 32rpx; line-height: 40rpx; }
+					.balance{ font-size: 26rpx; color: gray; line-height: 30rpx; margin-top: 5rpx; }
+				}
+				.deduction-input{
+					height: 85rpx;
+					width: calc(100% - 300rpx);
+					text-align: right;
+					font-size: 32rpx;
+				}
+			}
+		}
 		// 选择支付方式
 		.choose{
 			background-color: white;