Appearance
useOrderPayment
Definition
Composable for managing an existing order.
Basic usage
ts
const {
isAsynchronous,
activeTransaction,
state,
paymentUrl,
paymentMethod,
handlePayment,
changePaymentMethod
} = useOrderPayment(order);
Signature
ts
export function useOrderPayment(
order: ComputedRef<Order | null | undefined>,
): UseOrderPaymentReturn
Parameters
Name | Type | Description |
---|---|---|
order | ComputedRef<Order | | undefined> |
Return type
See UseOrderPaymentReturn
ts
export type UseOrderPaymentReturn = {
/**
* If the payment can be done after the order is placed
*/
isAsynchronous: ComputedRef<boolean | undefined>;
/**
* Active payment transaction
*/
activeTransaction: ComputedRef<OrderTransaction | undefined>;
/**
* Payment status
*/
state: ComputedRef<StateMachineState | null | undefined>;
paymentUrl: Ref<null | string>;
/**
* Payment method set for the order
*/
paymentMethod: ComputedRef<PaymentMethod | undefined | null>;
/**
* Invokes the payment process for the order in the backend
*/
handlePayment(
/**
* URL to redirect after successful payment
*/
successUrl?: string,
/**
* URL to redirect after failed payment
*/
errorUrl?: string,
/**
* additional payment details to provide
*/
paymentDetails?: unknown,
): Promise<void | unknown>;
/**
* Change a payment method for the order
*/
changePaymentMethod(paymentMethodId: string): Promise<void>;
};
Properties
Name | Type | Description |
---|---|---|
isAsynchronous | ComputedRef<boolean | undefined> | If the payment can be done after the order is placed |
activeTransaction | ComputedRef<OrderTransaction | undefined> | Active payment transaction |
state | ComputedRef<StateMachineState | | undefined> | Payment status |
paymentUrl | Ref< | string> | |
paymentMethod | ComputedRef<PaymentMethod | undefined | null> | Payment method set for the order |
Methods
Name | Type | Description |
---|---|---|
handlePayment | Promise<void | null> | Invokes the payment process for the order in the backend |
changePaymentMethod | Promise<void> | Change a payment method for the order |
Usage
vue
<script setup lang="ts">
// TODO: add example
</script>