diff --git a/src/app/[name]/(Dialogs)/verify/[id]/page.tsx b/src/app/[name]/(Dialogs)/verify/[id]/page.tsx index 5962ff0..11fd65f 100644 --- a/src/app/[name]/(Dialogs)/verify/[id]/page.tsx +++ b/src/app/[name]/(Dialogs)/verify/[id]/page.tsx @@ -2,68 +2,155 @@ import Button from '@/components/button/PrimaryButton'; import { ef } from '@/lib/helpers/utfNumbers'; -import { CardTick } from 'iconsax-react'; +import { CardTick, CloseCircle } from 'iconsax-react'; import { useParams, useRouter } from 'next/navigation'; -import React from 'react' +import React, { useEffect, useState } from 'react' +import { useVerify } from '../hooks/useVerifyData'; +import { toast } from '@/components/Toast'; +import { VerifyData } from '../types/Types'; type Props = object +const formatDate = (dateString: string): string => { + const date = new Date(dateString); + return date.toLocaleDateString('fa-IR', { + year: 'numeric', + month: '2-digit', + day: '2-digit' + }); +}; + +const formatTime = (dateString: string): string => { + const date = new Date(dateString); + return date.toLocaleTimeString('fa-IR', { + hour: '2-digit', + minute: '2-digit' + }); +}; + +const formatPrice = (value: number): string => { + return value.toLocaleString('fa-IR'); +}; + export default function VerifyIndex({ }: Props) { - // const { t } = useTranslation('notifications') const router = useRouter(); const params = useParams(); const name = params.name as string; + const urlparams = new URLSearchParams(window.location.search); + const authority = urlparams.get('Authority'); + const id = params.id + + const [verifyData, setVerifyData] = useState(null); + const [isError, setIsError] = useState(false); + + const { mutate: verify } = useVerify(); + + useEffect(() => { + if (authority && id) { + verify({ authority: authority as string, orderId: id as string }, { + onSuccess: (data) => { + toast('پرداخت موفقیت آمیز بود', 'success'); + setVerifyData(data.data); + setIsError(false); + }, + onError: () => { + toast('پرداخت ناموفق بوده', 'error'); + setIsError(true); + } + }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [authority, id]); + + const amount = verifyData?.amount || verifyData?.order?.total || 0; + const paidAt = verifyData?.paidAt || ''; + const cardPan = verifyData?.verifyResponse?.data?.card_pan || ''; + const gateway = verifyData?.order?.paymentMethod?.description || verifyData?.gateway || ''; + const referenceId = verifyData?.referenceId || ''; + + const formattedCardPan = cardPan || ''; + return (
-
- -
پرداخت موفق
-

- {ef('مبلغ: 560,000 تومان')} -

+
+ {isError ? ( + + ) : ( + + )} +
+ {isError ? 'پرداخت ناموفق' : 'پرداخت موفق'} +
+ {!isError && verifyData && ( +

+ {ef(`مبلغ: ${formatPrice(amount)} تومان`)} +

+ )}
-
-
-
تاریخ:
-
{ef('1401/05/08')}
-
-
+ {!isError && ( +
+ {paidAt && ( + <> +
+
تاریخ:
+
{ef(formatDate(paidAt))}
+
+
+ + )} -
-
ساعت:
-
{ef('21:45')}
-
-
+ {paidAt && ( + <> +
+
ساعت:
+
{ef(formatTime(paidAt))}
+
+
+ + )} -
-
از کارت:
-
{ef('6104 6647 **** 1147')}
-
-
+ {cardPan && ( + <> +
+
از کارت:
+
{ef(formattedCardPan)}
+
+
+ + )} -
-
درگاه پرداخت:
-
{ef('درگاه پرداخت')}
-
-
+ {gateway && ( + <> +
+
درگاه پرداخت:
+
{gateway}
+
+
+ + )} -
-
شماره پیگیری:
-
{ef('556284526')}
+ {referenceId && ( + <> +
+
شماره پیگیری:
+
{ef(referenceId)}
+
+
+ + )}
-
+ )} - -
+
diff --git a/src/app/[name]/(Dialogs)/verify/hooks/useVerifyData.ts b/src/app/[name]/(Dialogs)/verify/hooks/useVerifyData.ts new file mode 100644 index 0000000..a693dbe --- /dev/null +++ b/src/app/[name]/(Dialogs)/verify/hooks/useVerifyData.ts @@ -0,0 +1,8 @@ +import { useMutation } from "@tanstack/react-query"; +import * as api from "../service/VerifyService"; + +export const useVerify = () => { + return useMutation({ + mutationFn: api.verify, + }); +}; diff --git a/src/app/[name]/(Dialogs)/verify/service/VerifyService.ts b/src/app/[name]/(Dialogs)/verify/service/VerifyService.ts new file mode 100644 index 0000000..675503e --- /dev/null +++ b/src/app/[name]/(Dialogs)/verify/service/VerifyService.ts @@ -0,0 +1,10 @@ +import { api } from "@/config/axios"; +import { VerifyType, VerifyResponse } from "../types/Types"; + +export const verify = async (params: VerifyType): Promise => { + const { data } = await api.post( + "/public/payments/verify", + params + ); + return data; +}; diff --git a/src/app/[name]/(Dialogs)/verify/types/Types.ts b/src/app/[name]/(Dialogs)/verify/types/Types.ts new file mode 100644 index 0000000..278d553 --- /dev/null +++ b/src/app/[name]/(Dialogs)/verify/types/Types.ts @@ -0,0 +1,89 @@ +import { BaseResponse } from "@/app/[name]/(Main)/types/Types"; + +export interface VerifyType { + authority: string; + orderId: string; +} + +export interface VerifyOrderHistory { + status: string; + changedAt: string; +} + +export interface VerifyPaymentMethod { + id: string; + createdAt: string; + updatedAt: string; + deletedAt: string | null; + restaurant: string; + method: string; + gateway: string; + description: string; + enabled: boolean; + order: number; + merchantId: string; +} + +export interface VerifyOrder { + id: string; + createdAt: string; + updatedAt: string; + deletedAt: string | null; + user: string; + restaurant: string; + deliveryMethod: string; + userAddress: string | null; + carAddress: string | null; + paymentMethod: VerifyPaymentMethod; + orderNumber: number; + couponDiscount: number; + couponDetail: unknown | null; + itemsDiscount: number; + totalDiscount: number; + subTotal: number; + tax: number; + deliveryFee: number; + total: number; + totalItems: number; + description: string; + tableNumber: string; + status: string; + history: VerifyOrderHistory[]; +} + +export interface VerifyResponseData { + data: { + fee: number; + code: number; + wages: unknown | null; + ref_id: number; + message: string; + card_pan: string; + fee_type: string; + order_id: string; + card_hash: string; + shaparak_fee: number; + }; + errors: unknown[]; +} + +export interface VerifyData { + id: string; + createdAt: string; + updatedAt: string; + deletedAt: string | null; + order: VerifyOrder; + amount: number; + referenceId: string; + method: string; + gateway: string; + transactionId: string; + status: string; + cardPan: string | null; + verifyResponse: VerifyResponseData; + paidAt: string; + failedAt: string | null; + description: string | null; +} + +export type VerifyResponse = BaseResponse;