jp-charge/pages/user/rechargeIndex.vue

<template>
	<view>
		<ujp-navbar title="帮人充值"  :isBack="isBack" :customBack="customBack">
		
		</ujp-navbar>
		<view class="item1 item" @click="gotoUrl('pages/user/rechargeSubmit')">
			<img src="@/assets/img/byphone/iconPark-copy-link.svg">
			绑定充电卡
		</view>
		<view class="item2 item"  @click="gotoUrl('pages/user/rechargeByPhone')" >
			<img src="@/assets/img/byphone/iconPark-wallet.svg">
			充电卡充值
		</view>
		
	</view>
</template>

<script>
	import * as Pay from '@/apis/weixin.js'
	 import {
	 	checkPhone
	 } from '@/utils'
	import {
		wxPayJs
	} from '@/utils/wxpay'
	import * as API from '@/apis/index.js'
	
	
	export default {
		data() {
			return {
				isReady:false,
				customStyle: {
					background: '#1677ff'
				},
				detail:{},
				isBack:false,
				chargingMarketingId:'',
				selectItem:{},
				list:[5,10,20,50,100,200],
				amount:5,
				phone:"",
			}
		},
		onLoad(op){
			if(op.site){
				this.isBack=true;
			}
			
		},
		onReady() {
		
		},
		methods: {
			customBack(){
				uni.reLaunch({
						url: '/pages/user/index'
				})
			},
			toRefundList() {
				uni.navigateTo({
					url: '/pages/user/rechargeListByPhone'
				})
			},
			submit(){
				var checkPhoneResult = checkPhone(this.phone);
				
				if ( checkPhoneResult !== true) {
					uni.showToast({
						title: checkPhoneResult,
				
					})
					return;
				}
				
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				Pay.wxJsapiPayByPhone({
					openId:this.carhelp.getOpenId(),
					phone:this.phone,
					amount:this.amount
				}).then((response) => {
					if(!response.result){		
						uni.showToast({
							title:  response.message
						})
						return
					}
					var data = response.data
					uni.hideLoading()
					console.log("Pay+"+new Date().getTime())		
					wxPayJs(data);
						
				}).catch(error => {
					uni.showToast({
						title: error
					})	
				})
			},
			
			
		},onShow(){
			if(this.isReady){
				
			}
		}
	}
</script>
<style>
	page{
		background-color: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	.item{
		margin: 32rpx;
		border-radius: 8px;
		font-size: 80rpx;
		color: rgba(255, 255, 255, 1);
		padding:  88rpx 0;
		    display: flex;
		    align-items: center;
		    justify-content: center;
		img{
			width: 104rpx;
			height:104rpx;
		}

	}
	.item1{
		background: linear-gradient(180deg, rgba(31,85,255,1) 0%,rgba(39,171,255,1) 100%);
	}
	.item2{
		background: linear-gradient(-0.11deg, rgba(79,226,157,1) 0.3%,rgba(0,173,222,1) 101.1%);
	}
	
</style>