270 lines
6.4 KiB
Vue
270 lines
6.4 KiB
Vue
<template>
|
||
<up-navbar
|
||
title="充值"
|
||
bgColor="#00aa7f"
|
||
:autoBack="true"
|
||
leftIconColor="#fff"
|
||
titleStyle="color:#fff"
|
||
:placeholder="true"
|
||
/>
|
||
<view class="contet">
|
||
<view class="tit">充值金额</view>
|
||
<view class="jenr">
|
||
<view class="jrnum">
|
||
<view @tap="setje(1,50)" :class="{actv:actv == 1}">¥<text>50</text></view>
|
||
<view @tap="setje(2,100)" :class="{actv:actv == 2}">¥<text>100</text></view>
|
||
<view @tap="setje(3,200)" :class="{actv:actv == 3}">¥<text>200</text></view>
|
||
</view>
|
||
<view class="jrnum">
|
||
<view @tap="setje(4,500)" :class="{actv:actv == 4}">¥<text>500</text></view>
|
||
<view @tap="setje(5,1000)" :class="{actv:actv == 5}">¥<text>1000</text></view>
|
||
<view @tap="setje(6,1000)">自定义</view>
|
||
</view>
|
||
</view>
|
||
|
||
<up-button style="margin-top: 100rpx;" type="success" @tap="save">确认充值</up-button>
|
||
</view>
|
||
<up-popup
|
||
:show="show"
|
||
mode="center"
|
||
round="10"
|
||
closeable
|
||
@close="close"
|
||
>
|
||
<view style="box-sizing: border-box;width: 80vw;padding: 100rpx 50rpx 50rpx;">
|
||
<!-- <up-input
|
||
type="number"
|
||
maxlength="10"
|
||
v-model="zdyjr"
|
||
@focus="focus"
|
||
placeholder="请输入金额"
|
||
/> -->
|
||
<view style="box-sizing: border-box;padding:0 5vw;">
|
||
<view style="padding: 15rpx;border-radius: 10rpx;font-size: 32rpx;border: 1px solid #ccc;">
|
||
<input
|
||
v-model="zdyjr"
|
||
type="digit"
|
||
@input="handleInput"
|
||
placeholder="请输入金额"
|
||
/>
|
||
</view>
|
||
|
||
<view style="box-sizing: border-box;height: 100rpx;padding-top: 5rpx;font-size: 28rpx;color: #f00;">
|
||
<view v-if="errtip">请输入金额</view>
|
||
</view>
|
||
<view>
|
||
<up-button type="success" @tap="zdysave">确认充值</up-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</up-popup>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref,reactive,watch,nextTick } from 'vue'
|
||
import { payment,getip,getInfo,getaccou,openaccou,isktbal } from '@/utils/service'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
|
||
import { setNum } from '@/utils/commen'
|
||
|
||
// onLoad((opt:any) => {
|
||
// payqs.attach.walletCode = opt.walletCode
|
||
// })
|
||
|
||
isktbal(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||
if(!rps.data){
|
||
|
||
//开通余额
|
||
openaccou(uni.getStorageSync('wxuid'))
|
||
}
|
||
})
|
||
|
||
let phoneNumber = ref('')
|
||
getInfo({
|
||
wuid:uni.getStorageSync('wxuid')
|
||
}).then((rps:any) => {
|
||
let nickName = rps.data.nickName?rps.data.nickName:''
|
||
let name = rps.data.name?rps.data.name:''
|
||
phoneNumber.value = rps.data.phoneNumber?rps.data.phoneNumber:''
|
||
payqs.attach.trader = name?name:nickName
|
||
payqs.description = `${phoneNumber.value}余额充值`
|
||
})
|
||
|
||
let actv = ref(0)
|
||
let jiner = ref<any>('')
|
||
|
||
let show = ref(false)
|
||
function setje(n:number,v:number|string){
|
||
actv.value = n
|
||
jiner.value = v
|
||
if(n == 6){
|
||
show.value = true
|
||
jiner.value = ''
|
||
zdyjr.value = ''
|
||
}
|
||
}
|
||
|
||
function close() {
|
||
show.value = false
|
||
}
|
||
|
||
function save() {
|
||
if(jiner.value == ''){
|
||
uni.showToast({
|
||
title:'请选择金额',
|
||
icon:'none'
|
||
})
|
||
}else{
|
||
payqs.total = jiner.value*1*100
|
||
payqs.goodsDetail[0].unitPrice = jiner.value*1*100
|
||
payhand()
|
||
}
|
||
}
|
||
|
||
//自定义
|
||
let zdyjr = ref<any>('')
|
||
let errtip = ref(false)
|
||
|
||
function handleInput(e:any) {
|
||
nextTick(() => {
|
||
zdyjr.value = setNum(e.target.value)
|
||
})
|
||
}
|
||
|
||
// watch(() => zdyjr.value, v => {
|
||
// zdyjr.value = setNum(v)
|
||
// })
|
||
let tipmsg = ref('')
|
||
function zdysave() {
|
||
if(zdyjr.value === ''){
|
||
errtip.value = true
|
||
tipmsg.value = '请输入金额'
|
||
}else if(zdyjr.value*1 == 0){
|
||
errtip.value = true
|
||
tipmsg.value = '输入金额不能为0'
|
||
}else{
|
||
errtip.value = false
|
||
tipmsg.value = ''
|
||
payqs.total = zdyjr.value*1*100
|
||
payqs.goodsDetail[0].unitPrice = zdyjr.value*1*100
|
||
payhand()
|
||
}
|
||
}
|
||
|
||
function focus() {
|
||
errtip.value = false
|
||
tipmsg.value = ''
|
||
}
|
||
|
||
//充值
|
||
let payqs = reactive<any>({
|
||
wuid:uni.getStorageSync('wxuid'),
|
||
description:'余额充值', //订单总描述
|
||
total:0, //支付金额，单位：分
|
||
//timeExp:'', //支付结束时间
|
||
|
||
//订单附加信息
|
||
attach:{
|
||
type: 1, //"1-充值,2-订单。类型 number"
|
||
//orderNo:'', //"订单号",
|
||
trader:'', //交易发起人
|
||
traderCode:uni.getStorageSync('wxuid'), //交易人编码 个人wuid，企业为公司编码
|
||
walletCode:uni.getStorageSync('walletCode') //钱包编码
|
||
// ownerId:'', //"户主ID，个人wuid，企业为公司编码",
|
||
// walletCode:'' //"钱包编码"
|
||
},
|
||
goodsDetail:[
|
||
{
|
||
merchantGoodsId:new Date().getTime(), //商户侧商品编码
|
||
wechatpayGoodsId:'', //微信支付定义的统一商品编号（没有可不传）
|
||
goodsName:'', //商品的实际名称
|
||
quantity:1, //商品数量
|
||
unitPrice:0 //商品价格
|
||
}
|
||
],
|
||
payerClientIp:'', //用户IP
|
||
deviceId:'', //用户设备型号
|
||
stationCode:''
|
||
})
|
||
|
||
//获取ip
|
||
getip().then((rps:any) => {
|
||
payqs.payerClientIp = rps.data
|
||
})
|
||
|
||
function payhand() {
|
||
//'{"type":1,"trader":"cijiangbo","tradercode":"8d4638c713e9391baa60395385932fb3","walletCode":"YTWAP1863511124008374272NARVLW"}'
|
||
|
||
//payqs.attach = JSON.stringify(payqs.attach)
|
||
//payqs.total = payqs.total*100
|
||
|
||
let objpay = Object.assign({},payqs,{
|
||
attach:JSON.stringify(payqs.attach),
|
||
//total:payqs.total*100
|
||
})
|
||
payment(objpay).then((rps:any) => {
|
||
|
||
//#ifdef MP-WEIXIN
|
||
wx.requestPayment({
|
||
timeStamp:rps.data.timeStamp,
|
||
nonceStr: rps.data.nonceStr,
|
||
package: rps.data.packageVal,
|
||
signType: rps.data.signType,
|
||
paySign: rps.data.paySign,
|
||
success(){
|
||
uni.navigateBack()
|
||
},
|
||
fail(){
|
||
|
||
}
|
||
})
|
||
//#endif
|
||
|
||
})
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page{
|
||
background: #f4f4f4;
|
||
}
|
||
.contet{
|
||
padding: 25rpx;
|
||
.tit{
|
||
margin-bottom: 25rpx;
|
||
padding-left: 16rpx;
|
||
border-left: 4px solid #00aa00;
|
||
}
|
||
.jenr{
|
||
box-sizing: border-box;
|
||
margin-top: 30rpx;
|
||
padding: 30rpx 5% 0;
|
||
border-radius: 20rpx;
|
||
background: #fff;
|
||
.jrnum{
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
>view{
|
||
box-sizing: border-box;
|
||
width: 25%;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
text-align: center;
|
||
margin-bottom: 30rpx;
|
||
border-radius: 20rpx;
|
||
border: 1px solid #ccc;
|
||
text{
|
||
font-size: 40rpx;
|
||
}
|
||
}
|
||
.actv{
|
||
color: #fff;
|
||
background: #5ac725;
|
||
border: none;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |