부가서비스

- 링크결제 발송내역/발송대기 엑셀다운로드 API 연결
- 링크결제 발송대기 상세 페이지 목업 API 연결
- 링크결제 발송대기 삭제 API 연결

src/entities/additional-service/ui/info-wrap/detail-info-wrap.tsx

@@ -16,7 +16,7 @@ export const DetailInfoWrap = ({
             <div className="txn-section">
                 <div className="section-title">상세 정보</div>
                 <ul className="kv-list">
-                    {(additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) &&
+                    {(additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory) &&
                         <>
                             < li className="kv-row">
                                 <span className="k">이메일</span>
@@ -28,7 +28,7 @@ export const DetailInfoWrap = ({
                             </li>
                             <li className="kv-row">
                                 <span className="k">상품명</span>
-                                <span className="v">상품명 respone 추가 필요</span>
+                                <span className="v">{detailInfo?.goodsName && detailInfo?.goodsName}</span>
                             </li>
                             <li className="kv-row">
                                 <span className="k">주문번호</span>

src/entities/additional-service/ui/info-wrap/payment-info-wrap.tsx

@@ -8,9 +8,6 @@ export const PaymentInfoWrap = ({
     paymentInfo
 }: DetailInfoSectionProps) => {
 
-    const checkValue = (val: any) => {
-        return (!!val || val === 0);
-    };
     console.log("PaymentInfo Check: ", paymentInfo)
 
     return (
@@ -18,7 +15,7 @@ export const PaymentInfoWrap = ({
             <div className="txn-section">
                 <div className="section-title">결제 정보</div>
                 <ul className="kv-list">
-                    {(additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) &&
+                    {(additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory) &&
                         <>
                             <li className="kv-row">
                                 <span className="k">구매자명</span>
@@ -38,12 +35,6 @@ export const PaymentInfoWrap = ({
                                 <span className="k">결제상태(실패횟수)</span>
                                 <span className="v">  {`${getPaymentStatusText(paymentInfo?.paymentStatus)}(${paymentInfo?.failCount})`}</span>
                             </li>
-                            {checkValue(paymentInfo?.failCount) && (
-                                <li className="kv-row">
-                                    <span className="k">실패횟수</span>
-                                    <span className="v">{paymentInfo?.failCount}회</span>
-                                </li>
-                            )}
                             <li className="kv-row">
                                 <span className="k">결제수단</span>
                                 <span className="v">{paymentInfo?.paymentMethod}</span>
@@ -51,7 +42,7 @@ export const PaymentInfoWrap = ({
                             <li className="kv-row">
                                 <span className="k">결제일자</span>
                                 <span className="v">
-                                    {paymentInfo?.paymentDate && paymentInfo.paymentDate}
+                                    {paymentInfo?.paymentDate && moment(paymentInfo.paymentDate,'YYYYMMDDHHmmss').format('YYYY.MM.DD')}
                                 </span>
                             </li>
                             <li className="kv-row">
@@ -61,6 +52,55 @@ export const PaymentInfoWrap = ({
                                 </span>
                             </li>
                         </>
+                    }{(additionalServiceCategory === AdditionalServiceCategory.LinkPaymentPending) &&
+                        <>
+                            <li className="kv-row">
+                                <span className="k">진행상태</span>
+                                <span className="v">{paymentInfo?.processStatus}</span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">요청일자</span>
+                                <span className="v">{paymentInfo?.requestDate && moment(paymentInfo.requestDate,'YYYYMMDDHHmmss').format('YYYY.MM.DD')}</span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">결제유효일자</span>
+                                <span className="v">
+                                    {paymentInfo?.paymentLimitDate && moment(paymentInfo.paymentLimitDate).format('YYYY.MM.DD')}
+                                </span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">발송수단</span>
+                                <span className="v">{paymentInfo?.sendMethod}</span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">구매자명</span>
+                                <span className="v">{paymentInfo?.buyerName}</span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">이메일</span>
+                                <span className="v">
+                                    {paymentInfo?.email && paymentInfo.email}
+                                </span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">휴대폰번호</span>
+                                <span className="v">
+                                    {paymentInfo?.phoneNumber && paymentInfo.phoneNumber}
+                                </span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">상품명</span>
+                                <span className="v">
+                                    {paymentInfo?.goodsName && paymentInfo.goodsName}
+                                </span>
+                            </li>
+                            <li className="kv-row">
+                                <span className="k">주문번호</span>
+                                <span className="v">
+                                    {paymentInfo?.moid && paymentInfo?.moid}
+                                </span>
+                            </li>
+                        </>
                     }
                 </ul>
             </div>

src/entities/additional-service/ui/info-wrap/title-info-wrap.tsx

@@ -36,7 +36,7 @@ export const TitleInfoWrap = ({
           <div className="num-day">{titleInfo?.requestDate}</div>
         </>
       )}
-      {additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping && (
+      {additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory && (
         <>
           <div className="num-amount">
             <span className="amount-text">
@@ -44,16 +44,30 @@ export const TitleInfoWrap = ({
                 value={titleInfo?.amount}
                 thousandSeparator
                 displayType="text"
-                suffix={ '원' }
+                suffix={'원'}
               ></NumericFormat>
             </span>
           </div>
           <div className="num-store">{titleInfo?.corpName}</div>
-          <div className="num-day">{titleInfo?.requestDate}</div>
+          <div className="num-day">{titleInfo?.sendDate}</div>
         </>
       )}
       {additionalServiceCategory === AdditionalServiceCategory.LinkPaymentPending && (
         <>
+          <>
+            <div className="num-amount">
+              <span className="amount-text">
+                <NumericFormat
+                  value={titleInfo?.amount}
+                  thousandSeparator
+                  displayType="text"
+                  suffix={'원'}
+                ></NumericFormat>
+              </span>
+            </div>
+            <div className="num-store">{titleInfo?.corpName}</div>
+            <div className="num-day">{titleInfo?.scheduledSendDate}</div>
+          </>
         </>
       )}
     </>

src/entities/additional-service/ui/link-payment/filter/link-payment-history-filter.tsx

@@ -6,7 +6,7 @@ import { ChangeEvent, useState } from 'react';
 import {
     LinkPaymentSearchType,
     LinkPaymentSendMethod,
-    LinkPaymentShippingHistoryFilterProps,
+    LinkPaymentHistoryFilterProps,
     LinkPaymentTransactionStatus,
     ProcessResult
 } from "../../../model/types";
@@ -16,7 +16,7 @@ import { FilterDateOptions } from '@/entities/common/model/types';
 import { FilterCalendar } from '@/shared/ui/filter/calendar';
 import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
 
-export const LinkPaymentShippingHistoryFilter = ({
+export const LinkPaymentHistoryFilter = ({
     filterOn,
     setFilterOn,
     mid,
@@ -35,7 +35,7 @@ export const LinkPaymentShippingHistoryFilter = ({
     setTransactionStatus,
     setProcessResult,
     setSendMethod
-}: LinkPaymentShippingHistoryFilterProps) => {
+}: LinkPaymentHistoryFilterProps) => {
 
 
     const [filterMid, setFilterMid] = useState<string>(mid);

src/entities/additional-service/ui/link-payment/link-payment-history-list.tsx

@@ -1,10 +1,10 @@
-import { LinkPaymentShippingListProps } from '../../model/types';
+import { LinkPaymentHistoryListProps } from '../../model/types';
 import { ListDateGroup } from '../list-date-group';
 
-export const LinkPaymentShippingHistoryList = ({
+export const LinkPaymentHistoryList = ({
   additionalServiceCategory,
   listItems
-}: LinkPaymentShippingListProps) => {
+}: LinkPaymentHistoryListProps) => {
 
   const getListDateGroup = () => {
     let rs = [];

src/entities/additional-service/ui/link-payment/link-payment-history-wrap.tsx

@@ -1,16 +1,16 @@
 import moment from 'moment';
 import { IMAGE_ROOT } from "@/shared/constants/common";
 import { useState, useEffect } from "react";
-import { LinkPaymentShippingHistoryFilter } from "./filter/link-payment-shipping-history-filter";
+import { LinkPaymentHistoryFilter } from "./filter/link-payment-history-filter";
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { PATHS } from "@/shared/constants/paths";
-import { LinkPaymentShippingHistoryList } from "./link-payment-shipping-history-list";
+import { LinkPaymentHistoryList } from "./link-payment-history-list";
 import { SortOptionsBox } from "../sort-options-box";
-import { AdditionalServiceCategory, LinkPaymentSendMethod, LinkPaymentShippingListItem, LinkPaymentTransactionStatus, ProcessResult, SortByKeys } from "../../model/types";
+import { AdditionalServiceCategory, LinkPaymentSendMethod, LinkPaymentHistoryListItem, LinkPaymentTransactionStatus, ProcessResult, SortByKeys } from "../../model/types";
 import { LinkPaymentSearchType, } from "../../model/types";
 import { useExtensionLinkPayHistoryListMutation } from '../../api/link-payment/use-extension-link-pay-history-list-mutation';
 import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
-import { todo } from 'node:test';
+import { useExtensionLinkPayHistoryDownloadExcelMutation } from '../../api/link-payment/use-extension-link-pay-history-download-excel-mutation';
 
 const processResultBtnGroup = [
     { name: '전체', value: ProcessResult.ALL },
@@ -18,7 +18,7 @@ const processResultBtnGroup = [
     { name: '실패', value: ProcessResult.FAIL }
 ]
 
-export const LinkPaymentShippingHistoryWrap = () => {
+export const LinkPaymentHistoryWrap = () => {
     const { navigate } = useNavigate();
 
     const [filterOn, setFilterOn] = useState<boolean>(false);
@@ -35,7 +35,7 @@ export const LinkPaymentShippingHistoryWrap = () => {
     const [sendMethod, setSendMethod] = useState<LinkPaymentSendMethod>(LinkPaymentSendMethod.ALL)
 
     const { mutateAsync: linkPayHistoryList } = useExtensionLinkPayHistoryListMutation();
-
+    const { mutateAsync: downloadExcel } = useExtensionLinkPayHistoryDownloadExcelMutation();
 
     const onClickToNavigate = () => {
         navigate(PATHS.additionalService.linkPayment.request)
@@ -66,7 +66,7 @@ export const LinkPaymentShippingHistoryWrap = () => {
         })
     };
 
-    const assembleData = (content: Array<LinkPaymentShippingListItem>) => {
+    const assembleData = (content: Array<LinkPaymentHistoryListItem>) => {
         let data: any = {};
         if (content && content.length > 0) {
             for (let i = 0; i < content?.length; i++) {
@@ -85,8 +85,20 @@ export const LinkPaymentShippingHistoryWrap = () => {
     };
 
     const onClickToDownloadExcel = () => {
-
-    }
+        downloadExcel({
+            mid: mid,
+            searchCl: searchType === LinkPaymentSearchType.ALL ? '' : searchType,
+            searchValue: searchKeyword,
+            paymentMethod: 'st', // 추후 변경 필요 빼야함
+            fromDate: startDate,
+            toDate: endDate,
+            paymentStatus: transactionStatus === LinkPaymentTransactionStatus.ALL ? '' : transactionStatus,
+            sendStatus: processResult === ProcessResult.ALL ? '' : processResult,
+            sendMethod: sendMethod === LinkPaymentSendMethod.ALL ? '' : sendMethod,
+        }).then((rs) => {
+            console.log('Excel Dowload Status : ' + rs.status)
+        });
+    };
 
     const onClickProcessResult = (val: ProcessResult) => {
         setProcessResult(val);
@@ -159,17 +171,17 @@ export const LinkPaymentShippingHistoryWrap = () => {
                 </div>
             </div>
 
-            <LinkPaymentShippingHistoryList
+            <LinkPaymentHistoryList
                 listItems={listItems}
-                additionalServiceCategory={AdditionalServiceCategory.LinkPaymentShipping}
-            ></LinkPaymentShippingHistoryList>
+                additionalServiceCategory={AdditionalServiceCategory.LinkPaymentHistory}
+            ></LinkPaymentHistoryList>
             <div className="apply-row">
                 <button
                     className="btn-50 btn-blue flex-1"
                     onClick={() => onClickToNavigate()}
                 >결제 신청</button>
             </div>
-            <LinkPaymentShippingHistoryFilter
+            <LinkPaymentHistoryFilter
                 filterOn={filterOn}
                 setFilterOn={setFilterOn}
                 mid={mid}
@@ -188,7 +200,7 @@ export const LinkPaymentShippingHistoryWrap = () => {
                 setTransactionStatus={setTransactionStatus}
                 setProcessResult={setProcessResult}
                 setSendMethod={setSendMethod}
-            ></LinkPaymentShippingHistoryFilter>
+            ></LinkPaymentHistoryFilter>
         </>
     )
 }

src/entities/additional-service/ui/link-payment/link-payment-wait-send-wrap.tsx

@@ -9,6 +9,7 @@ import { AdditionalServiceCategory, LinkPaymentWaitListItem, LinkPaymentSearchTy
 import { SortOptionsBox } from '../sort-options-box';
 import { useExtensionLinkPayWaitListMutation } from '../../api/link-payment/use-extension-link-pay-wait-list-mutation';
 import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constant';
+import { useExtensionLinkPayWaitDownloadExcelMutation } from '../../api/link-payment/use-extension-link-pay-wait-download-excel-mutation';
 const sendingStatusBtnGrouup = [
     { name: '전체', value: LinkPaymentSendingStatus.ALL },
     { name: '발송요청', value: LinkPaymentSendingStatus.SEND_REQUEST },
@@ -31,6 +32,7 @@ export const LinkPaymentWaitSendWrap = () => {
     const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
 
     const { mutateAsync: pendingSendList } = useExtensionLinkPayWaitListMutation();
+    const { mutateAsync: downloadExcel } = useExtensionLinkPayWaitDownloadExcelMutation();
 
     const onClickToOpenFilter = () => {
         setFilterOn(!filterOn);
@@ -82,7 +84,18 @@ export const LinkPaymentWaitSendWrap = () => {
     };
 
     const onClickToDownloadExcel = () => {
-
+        downloadExcel({
+            mid: mid,
+            searchCl: searchType === LinkPaymentSearchType.ALL ? '' : searchType,
+            searchValue: searchKeyword,
+            fromDate: startDate,
+            toDate: endDate,
+            sendStatus: sendingStatus === LinkPaymentSendingStatus.ALL ? '' : sendingStatus, // 추후 삭제 필요
+            sendMethod: sendMethod === LinkPaymentSendMethod.ALL ? '' : sendMethod,
+            processStatus: sendingStatus === LinkPaymentSendingStatus.ALL ? '' : sendingStatus,
+        }).then((rs) => {
+            console.log('Excel Dowload Status : ' + rs.status)
+        });
     };
 
     const onClickToSort = (sort: SortByKeys) => {

src/entities/additional-service/ui/list-item.tsx

@@ -59,7 +59,7 @@ export const ListItem = ({
         rs = 'gray';
       }
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory) {
       if (paymentStatus === "PAYMENT_COMPLETE") {
         rs = 'blue';
       }
@@ -101,7 +101,7 @@ export const ListItem = ({
         }
       });
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory) {
       navigate(PATHS.additionalService.linkPayment.detail, {
         state: {
           additionalServiceCategory: additionalServiceCategory,
@@ -163,7 +163,7 @@ export const ListItem = ({
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderSearch) {
       str = `${accountNo}`
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping ||
+    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory ||
        additionalServiceCategory === AdditionalServiceCategory.LinkPaymentPending
     ) {
       if (sendMethod === "SMS") {
@@ -199,7 +199,7 @@ export const ListItem = ({
         </div>
       );
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory) {
       if (paymentStatus === "PAYMENT_FAIL" || paymentStatus === "INACTIVE") {
         rs.push(
           <div className="transaction-details">
@@ -262,7 +262,7 @@ export const ListItem = ({
         </div>
       );
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentShipping ||
+    else if (additionalServiceCategory === AdditionalServiceCategory.LinkPaymentHistory ||
       additionalServiceCategory === AdditionalServiceCategory.LinkPaymentPending
     ) {
       rs.push(