qzw_xcx/pages/myOrder/paymoment.vue

<template>
	<view>
		<van-radio-group>
		   <van-cell-group  v-for="(item, index) in list"  :key="index">
			 <van-cell   title-class="changtitle"   :title="item.title"  @click="onChange(index)">
			 <template slot="icon" style="padding-right: 10upx;">
			    <van-radio-group :value="radio" >
			      <van-radio checked-color="#D9332E" :name="index" >
				  </van-radio>
			    </van-radio-group>
			 </template>
		     </van-cell>
		   </van-cell-group>
		 </van-radio-group>
		 <view class="payMoney" @click="payMoney" v-if="radio ==  1">支付(圈币{{parseFloat}})</view>
		 <view class="payMoney" @click="payMoney"  v-if="radio == 0">支付(￥{{prices}})</view>
		 <Dialog  :orderCancel="orderCancel"
		     :titles="titles"
			 :values="values"
		     @colseDialog="cancelDialog" 
		     @confirmPay="confirmOrder"
		  />
	</view>
</template>

<script>
	import Dialog from '@/component/Dialog.vue'
	export default {
		components: {
			Dialog
		},
		data() {
			return {
				values:'',
				orderCancel:　false,
				titles:'',
				list:[
					{title:'微信支付'},
					{title:'圈币支付'}
				],
				radio: 0,
				prices: '',
				order_id:'',
				isform: 0,
				ratio_points: 2,
				store_id: '',
			}
		},
		onLoad(e) {
			this.prices = e.prices;
			this.order_id = e.order_id;
			this.store_id = e.store_id;
			this.getuserInfo();
			this.isform = e.isform;
		},
		methods: {
			//获取用户信息
			getuserInfo() {
				this.request({
					url: '/v2/member/info',
					method:'post',
					success: (res) => {
						this.ratio_points = res.data.data.ratio_points;
						if(this.ratio_points > 0) {
							this.list = [
								{title:'微信支付'},
								{title:'圈币支付'}
							];
						}else {
							this.list = [
								{title:'微信支付'}
								
							];
						}
					}
				})
			},
			// 圈币取消支付
			cancelDialog() {
				this.orderCancel = false;
			},
			// 圈币确定支付
			confirmOrder() {
				this.orderCancel = false;
				uni.showLoading({
					title: '支付中'  
				}); 
				this.request({
					url:'/v1/payment/pay',
					method:'POST',
					data: {
						pay_code: 'point',
						order_id: this.order_id
					},
					success: (res) => {
						if(res.data.code == 1000) {
							uni.hideLoading();  
								let isform = this.isform;
								let store_id = this.store_id;
								uni.redirectTo({
									url: `/pages/myOrder/finsh?isform=${isform}&order_id=${this.order_id}&store_id=${store_id}`
								})
						}
						
					}
				})
			},
			onChange(index) {
				this.radio = index;
			},
			payMoney() {
				if(this.radio == 0) {
					this.request({
						url:'/v1/payment/pay',
						method: 'post',
						data: {
							pay_code: 'wx',
							type: 1,
							order_id: this.order_id
						},
						success:(res) => {
							let { wx } = res.data.data;
							
							uni.requestPayment({
								    provider: 'wxpay',
								    timeStamp: wx.timeStamp,
								    nonceStr: wx.nonceStr,
								    package:  wx.package,
								    signType: 'MD5',
								    paySign: wx.paySign,
								    success:  (res) => {
										let isform = this.isform;
										let order_id = this.order_id;
										let store_id =  this.store_id;
										uni.redirectTo({
											url: `/pages/myOrder/finsh?isform=${isform}&order_id=${order_id}&store_id=${store_id}`
										})
								    },
								    fail: (err) => {
										let order_id = this.order_id ;
										uni.redirectTo({
										        url: `/pages/myOrder/order?id=${order_id}`
										});
								    }
							})
						},
						fail:(res) => {
							let order_id = this.order_id ;
							uni.redirectTo({
							        url: `/pages/myOrder/order?id=${order_id}`
							});
						}
					})
				}else {
					this.titles = "圈币支付";
					this.values = "使用圈币支付"+this.prices*this.ratio_points;
					this.orderCancel = true;
				}
			}
		},
		computed:{
			parseFloat(){
				return parseInt(this.prices*this.ratio_points)
			}
		}
	}
</script>

<style>
  .payMoney {
	  width: 90%;
	  color: #fff;
	  background-color: #D9332E;
	  position: fixed;
	  text-align: center;
	  padding: 20upx 0;
	  bottom: 5%;
	  left: 5%;
  }
  .changtitle {
	  padding-left: 10upx;
  }
</style>