<template>
|
<div class="select-pay-type-view">
|
<div class="select-pay-type-view-item" @click="handleAliPay">
|
<img class="select-pay-type-view-item-icon" :src="IconAliPay" />
|
<div class="select-pay-type-view-item-text">支付宝支付</div>
|
</div>
|
<div class="select-pay-type-view-item" @click="handleWeixinPay">
|
<img class="select-pay-type-view-item-icon" :src="IconWeixin" />
|
<div class="select-pay-type-view-item-text">微信支付</div>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import IconWeixin from '../../../assets/icon-weixin-pay.png';
|
import IconAliPay from '../../../assets/icon-alipay.png';
|
import {
|
useLifeRechargeContext,
|
SetLifePayOrderPayTypeInput,
|
LifeRechargeConstants,
|
} from '@life-payment/core-vue';
|
import { useQuery } from '@tanstack/vue-query';
|
|
defineOptions({
|
name: 'SelectPayTypeView',
|
});
|
|
type Props = {
|
orderNo?: string;
|
lifePayOrderType?: LifeRechargeConstants.LifePayOrderTypeEnum;
|
};
|
|
const props = withDefaults(defineProps<Props>(), {});
|
|
const emit = defineEmits<{
|
(
|
e: 'paySuccess',
|
orderNo: string,
|
lifePayOrderType: LifeRechargeConstants.LifePayOrderTypeEnum
|
): void;
|
}>();
|
|
const { blLifeRecharge } = useLifeRechargeContext();
|
|
async function handleAliPay() {
|
try {
|
let res = await setLifePayOrderPayType(blLifeRecharge.constants.LifePayTypeEnum.AliPay);
|
if (res) {
|
location.href = res;
|
}
|
} catch (error) {}
|
}
|
|
async function handleWeixinPay() {
|
try {
|
let res = await setLifePayOrderPayType(blLifeRecharge.constants.LifePayTypeEnum.WxPay);
|
if (res) {
|
location.href = res;
|
}
|
} catch (error) {}
|
}
|
|
async function setLifePayOrderPayType(lifePayType: LifeRechargeConstants.LifePayTypeEnum) {
|
try {
|
let params: SetLifePayOrderPayTypeInput = {
|
orderNo: props.orderNo,
|
lifePayType: lifePayType,
|
};
|
return await blLifeRecharge.services.setLifePayOrderPayType(params);
|
} catch (error) {}
|
}
|
|
useQuery({
|
queryKey: ['platformServicePayServices/getPayStatusByOrderNo', props.orderNo],
|
queryFn: async () => {
|
return await blLifeRecharge.services.getPayStatusByOrderNo(
|
{
|
orderNo: props.orderNo,
|
},
|
{
|
showLoading: false,
|
}
|
);
|
},
|
onSuccess(data) {
|
if (data === blLifeRecharge.constants.LifePayStatusEnum.已支付) {
|
emit('paySuccess', props.orderNo, props.lifePayOrderType);
|
}
|
},
|
refetchInterval: 1000 * 3,
|
});
|
</script>
|