提交 9eb17436 编写于 作者: M mahaifeng

修改支付示例

上级 ac4b8a54
<template>
<page-head title="发起支付"></page-head>
<page-head title="发起支付"></page-head>
<template v-if="providerList.length > 0">
<button style="margin-top: 20px;" type="primary" v-for="(item,index) in providerList" :key="index"
@click="requestPayment(item)">{{item.name}}支付</button>
</template>
<template v-if="providerList.length > 0">
<button style="margin-top: 20px;" type="primary" v-for="(item,index) in providerList" :key="index"
@click="requestPayment(item)">{{item.name}}支付</button>
</template>
</template>
<script>
export type PayItem = { id : string, name : string }
export default {
data() {
return {
btnText: "支付宝支付",
btnType: "primary",
orderInfo: "",
errorCode: 0,
errorMsg: "",
complete: false,
providerList: [] as PayItem[]
}
},
onLoad: function () {
uni.getProvider({
service: "payment",
success: (e) => {
console.log("payment success:" + JSON.stringify(e));
let array = e.provider as string[]
array.forEach((value : string) => {
switch (value) {
case 'alipay':
this.providerList.push({
name: '支付宝',
id: "alipay",
} as PayItem);
break;
case 'wxpay':
this.providerList.push({
name: '微信',
id: "wxpay",
} as PayItem);
break;
default:
break;
}
})
},
fail: (e) => {
console.log("获取支付通道失败:", e);
}
});
},
methods: {
requestPayment(e : PayItem) {
const provider = e.id
if (provider == "alipay") {
this.payAli()
} else if (provider == "wxpay") {
this.payWX()
}
},
payAli() {
uni.showLoading({
title: "请求中..."
})
uni.request({
url: 'https://demo.dcloud.net.cn/payment/alipay/?total=0.01',
method: 'GET',
timeout: 6000,
success: (res) => {
this.orderInfo = JSON.stringify(res.data);
console.log("====" + this.orderInfo)
uni.hideLoading()
uni.requestPayment({
provider: "alipay",
orderInfo: res.data as string,
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
icon: 'error',
title: 'errorCode:' + this.errorCode
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (e) => {
console.log(e)
uni.hideLoading()
},
});
},
payWX() {
uni.showLoading({
title: "请求中..."
})
let url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__uniappx/?total=1'
const res = uni.getAppBaseInfo();
if (res.packageName == 'io.dcloud.hellouniappx') {//hello uniappx
url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__HelloUniAppX/?total=1'
}
uni.request({
url: url,
method: 'GET',
timeout: 6000,
header: {
"Content-Type": "application/json"
} as UTSJSONObject,
success: (res) => {
console.log(res.data)
uni.hideLoading()
uni.requestPayment({
provider: "wxpay",
orderInfo: JSON.stringify(res.data),
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
duration: 5000,
icon: 'error',
title: 'errorCode:' + this.errorCode,
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
duration: 5000,
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (res) => {
uni.hideLoading()
console.log(res)
},
});
},
export type PayItem = { id : string, name : string, provider ?: UniProvider }
export default {
data() {
return {
btnText: "支付宝支付",
btnType: "primary",
orderInfo: "",
errorCode: 0,
errorMsg: "",
complete: false,
providerList: [] as PayItem[]
}
},
onLoad: function () {
uni.getProvider({
service: "payment",
success: (e) => {
console.log("payment success:" + JSON.stringify(e));
let array = e.provider as string[]
array.forEach((value : string) => {
switch (value) {
case 'alipay':
this.providerList.push({
name: '支付宝',
id: "alipay",
provider: e.providers.find((item) : boolean => {
return item?.id == 'alipay'
})
} as PayItem);
break;
case 'wxpay':
this.providerList.push({
name: '微信',
id: "wxpay",
provider: e.providers.find((item) : boolean => {
return item?.id == 'wxpay'
})
} as PayItem);
break;
default:
break;
}
})
},
fail: (e) => {
console.log("获取支付通道失败:", e);
}
});
},
methods: {
requestPayment(e : PayItem) {
const provider = e.id
if (provider == "alipay") {
this.payAli()
} else if (provider == "wxpay") {
//自动化测试使用
jest_pay() {
uni.requestPayment({
provider: "alipay",
orderInfo: this.orderInfo,
fail: (res : RequestPaymentFail) => {
this.errorCode = res.errCode
this.complete = true
},
success: (res : RequestPaymentSuccess) => {
console.log(JSON.stringify(res))
this.complete = true
}
} as RequestPaymentOptions)
}
}
}
if (e.provider != null && e.provider?.isAppExist==false) {
uni.showToast({
title: "微信没有安装",
icon:'error'
})
} else {
this.payWX()
}
}
},
payAli() {
uni.showLoading({
title: "请求中..."
})
uni.request({
url: 'https://demo.dcloud.net.cn/payment/alipay/?total=0.01',
method: 'GET',
timeout: 6000,
success: (res) => {
this.orderInfo = JSON.stringify(res.data);
console.log("====" + this.orderInfo)
uni.hideLoading()
uni.requestPayment({
provider: "alipay",
orderInfo: res.data as string,
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
icon: 'error',
title: 'errorCode:' + this.errorCode
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (e) => {
console.log(e)
uni.hideLoading()
},
});
},
payWX() {
uni.showLoading({
title: "请求中..."
})
let url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__uniappx/?total=1'
const res = uni.getAppBaseInfo();
if (res.packageName == 'io.dcloud.hellouniappx') {//hello uniappx
url = 'https://demo.dcloud.net.cn/payment/wxpayv3.__UNI__HelloUniAppX/?total=1'
}
uni.request({
url: url,
method: 'GET',
timeout: 6000,
header: {
"Content-Type": "application/json"
} as UTSJSONObject,
success: (res) => {
console.log(res.data)
uni.hideLoading()
uni.requestPayment({
provider: "wxpay",
orderInfo: JSON.stringify(res.data),
fail: (res) => {
console.log(JSON.stringify(res))
this.errorCode = res.errCode
uni.showToast({
duration: 5000,
icon: 'error',
title: 'errorCode:' + this.errorCode,
});
},
success: (res) => {
console.log(JSON.stringify(res))
uni.showToast({
duration: 5000,
icon: 'success',
title: '支付成功'
});
}
})
},
fail: (res) => {
uni.hideLoading()
console.log(res)
},
});
},
//自动化测试使用
jest_pay() {
uni.requestPayment({
provider: "alipay",
orderInfo: this.orderInfo,
fail: (res : RequestPaymentFail) => {
this.errorCode = res.errCode
this.complete = true
},
success: (res : RequestPaymentSuccess) => {
console.log(JSON.stringify(res))
this.complete = true
}
} as RequestPaymentOptions)
}
}
}
</script>
<style>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册