109 lines
3.1 KiB
Vue
109 lines
3.1 KiB
Vue
<template>
|
|
<div class="px-60 py-6">
|
|
<div class="grid grid-cols-1 gap-5 sm:grid-cols-2">
|
|
<!-- 添加 Mpesa 详情 -->
|
|
<div
|
|
v-if="$team.pg.country === 'Kenya'"
|
|
class="flex flex-col gap-2 rounded-md border p-4 shadow"
|
|
>
|
|
<div class="flex justify-between items-center text-sm text-gray-700">
|
|
<div>M-Pesa 快速凭证</div>
|
|
<Button @click="showAddMpesaDialog = true">编辑</Button>
|
|
</div>
|
|
<div class="overflow-hidden text-ellipsis text-base font-medium">
|
|
<span class="font-normal text-gray-600">{{
|
|
mpesaSetupId || '未设置'
|
|
}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<AddMpesaCredentials
|
|
v-model="showAddMpesaDialog"
|
|
@closeDialog="showAddMpesaDialog = false"
|
|
/>
|
|
<!-- M-Pesa 添加结束 -->
|
|
|
|
<!-- 添加支付网关 -->
|
|
<div class="flex flex-col gap-2 rounded-md border p-4 shadow">
|
|
<div class="flex justify-between items-center text-sm text-gray-700">
|
|
<div>支付网关</div>
|
|
<Button
|
|
@click="showAddPaymentGatewayDialog = true"
|
|
:disabled="!Boolean(mpesaSetupId)"
|
|
>编辑</Button
|
|
>
|
|
</div>
|
|
<div class="overflow-hidden text-ellipsis text-base font-medium">
|
|
<span class="font-normal text-gray-600">{{
|
|
paymentGatewayID || '未设置'
|
|
}}</span>
|
|
</div>
|
|
</div>
|
|
<!-- 支付网关添加结束 -->
|
|
|
|
<AddPaymentGateway
|
|
v-model="showAddPaymentGatewayDialog"
|
|
@closeDialog="showAddPaymentGatewayDialog = false"
|
|
/>
|
|
|
|
<!--提交支付交易到 Jingrow-->
|
|
<div class="flex flex-col gap-2 rounded-md border p-4 shadow">
|
|
<div class="flex justify-between items-center text-sm text-gray-700">
|
|
<div>合作伙伴支付结算</div>
|
|
<Button @click="showPartnerPaymentPayout = true">编辑</Button>
|
|
</div>
|
|
<div class="overflow-hidden text-ellipsis text-base font-medium">
|
|
<span class="font-normal text-gray-600">未设置</span>
|
|
</div>
|
|
</div>
|
|
<!--支付交易结束-->
|
|
|
|
<!-- 父组件 -->
|
|
<PartnerPaymentPayout
|
|
v-model="showPartnerPaymentPayout"
|
|
@closeDialog="showPartnerPaymentPayout = false"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { defineAsyncComponent } from 'vue';
|
|
|
|
export default {
|
|
name: 'LocalPaymentSetup',
|
|
components: {
|
|
AddMpesaCredentials: defineAsyncComponent(
|
|
() => import('../billing/mpesa/AddMpesaCredentials.vue'),
|
|
),
|
|
AddPaymentGateway: defineAsyncComponent(
|
|
() => import('../billing/mpesa/AddPaymentGateway.vue'),
|
|
),
|
|
PartnerPaymentPayout: defineAsyncComponent(
|
|
() => import('../billing/mpesa/PartnerPaymentPayout.vue'),
|
|
),
|
|
},
|
|
data() {
|
|
return {
|
|
showAddMpesaDialog: false,
|
|
showAddPaymobDialog: false,
|
|
showAddPaymentGatewayDialog: false,
|
|
showPartnerPaymentPayout: false,
|
|
mpesaSetupId: '',
|
|
paymentGatewayID: '',
|
|
};
|
|
},
|
|
resources: {
|
|
fetchLocalPaymentSetupDetails() {
|
|
return {
|
|
url: 'jcloud.api.partner.get_local_payment_setup',
|
|
onSuccess(data) {
|
|
this.mpesaSetupId = data.mpesa_setup;
|
|
this.paymentGatewayID = data.payment_gateway;
|
|
},
|
|
auto: true,
|
|
};
|
|
},
|
|
},
|
|
};
|
|
</script> |