Files
nice-app-web/src/pages/payment/info/info-page.tsx
2025-09-19 12:04:27 +09:00

96 lines
3.0 KiB
TypeScript

import { useEffect, useState } from 'react';
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { PaymentTab } from '@/entities/payment/ui/payment-tab';
import { InfoWrap } from '@/entities/payment/ui/info-wrap';
import { PaymentCardResponse, PaymentInstallmentResponse, PaymentNonCardResponse, PaymentTabKeys } from '@/entities/payment/model/types';
import { usePaymentCardMutation } from '@/entities/payment/api/use-payment-card-mutation';
import { usePaymentNonCardMutation } from '@/entities/payment/api/use-payment-non-card-mutation';
import { HeaderType } from '@/entities/common/model/types';
import {
useSetHeaderTitle,
useSetHeaderType,
useSetFooterMode,
useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout';
import { usePaymentInstallmentMutation } from '@/entities/payment/api/use-payment-installment-mutation';
export const InfoPage = () => {
const { navigate } = useNavigate();
const { mutateAsync: paymentCard } = usePaymentCardMutation();
const { mutateAsync: paymentNonCard } = usePaymentNonCardMutation();
const { mutateAsync: paymentInstallment } = usePaymentInstallmentMutation();
const [activeTab, setActiveTab] = useState<PaymentTabKeys>(PaymentTabKeys.Info);
const [mid, setMid] = useState<string>('nictest00g');
const [paymentCardResult, setPaymentCardResult] = useState<PaymentCardResponse>();
const [paymentNonCardResult, setPaymentNonCardResult] = useState<PaymentNonCardResponse>();
const [paymentInstallmentResult, setPaymentInstallResult] = useState<PaymentInstallmentResponse>();
useSetHeaderTitle('결제 관리');
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(true);
useSetOnBack(() => {
navigate(PATHS.home);
});
const callPaymentCard = () => {
let params = {
mid: mid,
paymentMethod: 'CREDIT_CARD'
};
paymentCard(params).then((rs) => {
console.log(rs);
setPaymentCardResult(rs);
});
};
const callPaymentNonCard = () => {
let params = {
mid: mid,
paymentMethod: 'ACCOUNT_TRANSFER'
};
paymentNonCard(params).then((rs) => {
console.log(rs);
setPaymentNonCardResult(rs);
});
};
const callPaymentIntallment = () => {
let params = {
mid: mid,
paymentMethod: 'CREDIT_CARD'
};
paymentInstallment(params).then((rs) => {
console.log(rs);
setPaymentInstallResult(rs);
});
};
useEffect(() => {
callPaymentCard();
callPaymentNonCard();
callPaymentIntallment();
}, []);
return (
<>
<main>
<div className="tab-content pb-70">
<div className="tab-pane pt-46 active">
<PaymentTab activeTab={ activeTab }></PaymentTab>
<InfoWrap
mid={ mid }
paymentCard={ paymentCardResult }
paymentNonCard={ paymentNonCardResult }
paymentInstallment={ paymentInstallmentResult }
></InfoWrap>
</div>
</div>
</main>
</>
);
};