부가 서비스: 링크결제 신청 최종확인 페이지 추가(UI 추가 작업 필요)

src/pages/additional-service/link-payment/link-payment-apply-confirm-page.tsx

@@ -0,0 +1,92 @@
+import { useState } from 'react';
+import { HeaderType } from '@/entities/common/model/types';
+import { useSetFooterMode, useSetHeaderTitle, useSetHeaderType } from '@/widgets/sub-layout/use-sub-layout';
+import { useNavigate } from '@/shared/lib/hooks/use-navigate';
+import { PATHS } from "@/shared/constants/paths";
+import { IMAGE_ROOT } from "@/shared/constants/common";
+
+export const LinkPaymentApplyConfirmPage = () => {
+    const { navigate } = useNavigate();
+
+    useSetHeaderTitle('링크결제 신청');
+    useSetHeaderType(HeaderType.LeftArrow);
+    useSetFooterMode(false);
+
+    const onClickToConfirm = () => {
+    navigate(PATHS.home);
+    };
+
+    const onClickToBack = () => {
+        navigate(-1);
+    };
+
+    return (
+        <>
+            <main>
+                <div className="tab-content">
+                    <div className="tab-pane sub active">
+                        <div className="option-list">
+                            <div className="confirm-section">
+                                <div className="confirm-icon-container">
+                                    <div className="confirm-icon">
+                                        <img
+                                            src={IMAGE_ROOT + '/ico_alert.svg'}
+                                            className="alert-icon"
+                                        />
+                                    </div>
+                                </div>
+                                
+                                <h2 className="confirm-title">
+                                    발송 메시지를 최종 확인하세요
+                                </h2>
+                                
+                                <div className="confirm-details">
+                                    <div className="detail-item">
+                                        <span className="detail-label">결제 방식</span>
+                                        <span className="detail-value">링크 결제</span>
+                                    </div>
+                                    <div className="detail-item">
+                                        <span className="detail-label">결제 금액</span>
+                                        <span className="detail-value">5,254,000원</span>
+                                    </div>
+                                    <div className="detail-item">
+                                        <span className="detail-label">발송 방법</span>
+                                        <span className="detail-value">SMS</span>
+                                    </div>
+                                    <div className="detail-item">
+                                        <span className="detail-label">수신자</span>
+                                        <span className="detail-value">김*환(010-7000-****)</span>
+                                    </div>
+                                    <div className="detail-item">
+                                        <span className="detail-label">신청일</span>
+                                        <span className="detail-value">{new Date().toLocaleDateString('ko-KR', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\./g, '.').replace(/ /g, '')}</span>
+                                    </div>
+                                </div>
+                                
+                                <div className="confirm-notice">
+                                    <p className="notice-text">
+                                        • 결제 링크는 발송 후 24시간 동안 유효합니다.
+                                    </p>
+                                    <p className="notice-text">
+                                        • 결제 완료 후 취소/환불은 별도 문의가 필요합니다.
+                                    </p>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <div className="apply-row two-button">
+                            <button
+                                className="btn-50 btn-darkgray flex-1"
+                                onClick={() => onClickToBack()}
+                            >이전</button>
+                            <button
+                                className="btn-50 btn-blue flex-3"
+                                onClick={() => onClickToConfirm()}
+                            >결제 신청</button>
+                        </div>
+                    </div>
+                </div>
+            </main>
+        </>
+    );
+};

src/pages/additional-service/link-payment/link-payment-apply-page.tsx

@@ -21,8 +21,7 @@ export const LinkPaymentApplyPage = () => {
           setProcessStep(ProcessStep.Two);
       }
       else if(processStep === ProcessStep.Two) {
-          alert('완료')
-          navigate(PATHS.home)
+          navigate(PATHS.additionalService.linkPayment.requestConfirm)
       }
   };
 

src/pages/additional-service/link-payment/link-payment-pending-send-page.tsx

@@ -12,6 +12,7 @@ import {
     useSetFooterMode,
     useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
+import { LinkPaymentFilter } from '@/entities/additional-service/ui/link-payment-filter';
 
 export const LinkPaymentPendingSendPage = () => {
     const { navigate } = useNavigate();