Merge branch 'main' of https://gitea.bpsoft.co.kr/nicepayments/nice-app-web
This commit is contained in:
@@ -6,7 +6,7 @@ import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { HeaderType } from '@/entities/common/model/types';
|
||||
import { useDownloadExcelMutation } from '@/entities/transaction/api/use-download-excel-mutation';
|
||||
import { AccountHolderSearchFilter } from '@/entities/additional-service/ui/account-holder-search/account-holder-search-filter';
|
||||
import { AccountHolderSearchProcessResult, AccountHolderSearchType } from '@/entities/additional-service/model/types';
|
||||
import { ProcessResult, AccountHolderSearchType } from '@/entities/additional-service/model/types';
|
||||
import {
|
||||
useSetHeaderTitle,
|
||||
useSetHeaderType,
|
||||
@@ -24,7 +24,7 @@ export const AccountHolderSearchPage = () => {
|
||||
const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [bank, setBank] = useState<string>('');
|
||||
const [processResult, setProcessResult] = useState<AccountHolderSearchProcessResult>(AccountHolderSearchProcessResult.ALL);
|
||||
const [processResult, setProcessResult] = useState<ProcessResult>(ProcessResult.ALL);
|
||||
|
||||
useSetHeaderTitle('계좌성명조회');
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
|
||||
@@ -9,7 +9,7 @@ import { KeyInPaymentPage } from './key-in-payment/key-in-payment-page';
|
||||
import { SmsPaymentNotificationPage } from './sms-payment-notification/sms-payment-notification-page';
|
||||
import { AccountHolderSearchPage } from './account-holder-search/account-holder-search-page';
|
||||
import { AccountHolderAuthPage } from './account-holder-auth/account-holder-auth-page';
|
||||
import { LinkPaymentDispatchListPage } from './link-payment/link-payment-dispatch-list-page';
|
||||
import { LinkPaymentShippingHistoryPage } from './link-payment/link-payment-shipping-history-page';
|
||||
import { LinkPaymentPendingSendPage } from './link-payment/link-payment-pending-send-page';
|
||||
import { KakaoPaymentNotificationListPage } from './kakao-payment-notification/list-page';
|
||||
import { KakaoPaymentNotificationSettingPage } from './kakao-payment-notification/setting-page';
|
||||
@@ -58,7 +58,7 @@ export const AdditionalServicePages = () => {
|
||||
</Route>
|
||||
<Route path={ROUTE_NAMES.additionalService.accountHolderAuth} element={<AccountHolderAuthPage />} />
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.base}>
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.dispatchList} element={<LinkPaymentDispatchListPage />} />
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.shippingHistory} element={<LinkPaymentShippingHistoryPage />} />
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.pendingSend} element={<LinkPaymentPendingSendPage />} />
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.request} element={<LinkPaymentApplyPage />} />
|
||||
<Route path={ROUTE_NAMES.additionalService.linkPayment.requestConfirm} element={<LinkPaymentApplyConfirmPage />} />
|
||||
|
||||
@@ -49,7 +49,7 @@ export const IntroPage = () => {
|
||||
},
|
||||
{
|
||||
className: 'list-wrap02', serviceName: '링크 결제', serviceDesc: '결제 링크 전송만으로 어디서든 결제 가능 서비스',
|
||||
icon: IMAGE_ROOT + '/icon_ing07.svg', path: PATHS.additionalService.linkPayment.dispatchList
|
||||
icon: IMAGE_ROOT + '/icon_ing07.svg', path: PATHS.additionalService.linkPayment.shippingHistory
|
||||
},
|
||||
{
|
||||
className: 'list-wrap02', serviceName: '자금이체', serviceDesc: '예치금으로 즉시 송금, 파일 등록만으로 다중 송금 가능',
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { useState } from 'react';
|
||||
import moment from 'moment';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
|
||||
import { HeaderType } from '@/entities/common/model/types';
|
||||
@@ -8,24 +9,84 @@ import {
|
||||
useSetFooterMode
|
||||
} from '@/widgets/sub-layout/use-sub-layout';
|
||||
import { PATHS } from '@/shared/constants/paths';
|
||||
import { useExtensionKeyinDownloadExcelMutation } from '@/entities/additional-service/api/use-extension-keyin-download-excel-mutation';
|
||||
import { KeyInPaymentFilter } from '@/entities/additional-service/ui/key-in-payment/key-in-payment-filter';
|
||||
import { KeyInPaymentTransactionStatus, SortByKeys } from '@/entities/additional-service/model/types';
|
||||
import { SortOptionsBox } from '@/entities/additional-service/ui/link-payment/sort-options-box';
|
||||
import { useExtensionKeyinListMutation } from '@/entities/additional-service/api/use-extension-keyin-list-mutation';
|
||||
import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constants';
|
||||
|
||||
const requestStatusBtnGroup = [
|
||||
{ name: '전체', value: KeyInPaymentTransactionStatus.ALL },
|
||||
{ name: '승인', value: KeyInPaymentTransactionStatus.APPROVE },
|
||||
{ name: '전취소', value: KeyInPaymentTransactionStatus.BF_CANCEL },
|
||||
{ name: '후취소', value: KeyInPaymentTransactionStatus.AF_CANCEL }
|
||||
];
|
||||
|
||||
export const KeyInPaymentPage = () => {
|
||||
const { navigate } = useNavigate();
|
||||
|
||||
|
||||
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
|
||||
const [listItems, setListItems] = useState({});
|
||||
const [filterOn, setFilterOn] = useState<boolean>(false);
|
||||
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
|
||||
const [mid, setMid] = useState<string>('nictest001m');
|
||||
const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [transactionStatus, setTransactionStatus] = useState<KeyInPaymentTransactionStatus>(KeyInPaymentTransactionStatus.ALL)
|
||||
const [minAmount, setMinAmount] = useState<number | string>();
|
||||
const [maxAmount, setMaxAmount] = useState<number | string>();
|
||||
|
||||
|
||||
useSetHeaderTitle('KEY-IN 결제');
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
useSetFooterMode(false);
|
||||
|
||||
const { mutateAsync: keyinList } = useExtensionKeyinListMutation();
|
||||
const { mutateAsync: downloadExcel } = useExtensionKeyinDownloadExcelMutation();
|
||||
|
||||
const onClickToOpenFilter = () => {
|
||||
setFilterOn(!filterOn);
|
||||
};
|
||||
|
||||
const onClickToDownloadExcel = () => {
|
||||
// downloadExcel({
|
||||
// mid,
|
||||
// fromDate: '',
|
||||
// toDate: '',
|
||||
// paymentStatus: '',
|
||||
// minAmount: 0,
|
||||
// maxAmount: 0
|
||||
// }).then((rs) => {
|
||||
|
||||
// });
|
||||
};
|
||||
|
||||
const onClickToSort = (sort: SortByKeys) => {
|
||||
setSortBy(sort);
|
||||
// TODO : callList 구현
|
||||
};
|
||||
|
||||
const onClickToTransactionStatus = (val: KeyInPaymentTransactionStatus) => {
|
||||
setTransactionStatus(val);
|
||||
// TODO : callList 구현
|
||||
};
|
||||
|
||||
const onClickToNavigation = () => {
|
||||
navigate(PATHS.additionalService.keyInPayment.request)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
// TODO : callList();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<main>
|
||||
<div className="tab-content">
|
||||
<div className="tab-pane sub active">
|
||||
<section className="summary-section no-border">
|
||||
<section className="summary-section">
|
||||
<div className="credit-controls">
|
||||
<div>
|
||||
<input
|
||||
@@ -41,6 +102,7 @@ export const KeyInPaymentPage = () => {
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_setting.svg'}
|
||||
alt="검색옵션"
|
||||
onClick={() => onClickToOpenFilter()}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
@@ -51,26 +113,31 @@ export const KeyInPaymentPage = () => {
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_download.svg'}
|
||||
alt="다운로드"
|
||||
onClick={() => onClickToDownloadExcel()}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="filter-section">
|
||||
<div className="sort-options">
|
||||
<button className="sort-btn active">최신순</button>
|
||||
<span className="sort-divider">|</span>
|
||||
<button className="sort-btn">고액순</button>
|
||||
</div>
|
||||
<div className="filter-section">
|
||||
<SortOptionsBox
|
||||
sortBy={sortBy}
|
||||
onClickToSort={onClickToSort}
|
||||
></SortOptionsBox>
|
||||
<div className="excrow">
|
||||
<div className="full-menu-keywords no-padding">
|
||||
<span className="keyword-tag active">전체</span>
|
||||
<span className="keyword-tag">승인</span>
|
||||
<span className="keyword-tag">전취소</span>
|
||||
<span className="keyword-tag">후취소</span>
|
||||
{
|
||||
requestStatusBtnGroup.map((value, index) => (
|
||||
<span
|
||||
key={`key-service-code=${index}`}
|
||||
className={`keyword-tag ${(transactionStatus === value.value) ? 'active' : ''}`}
|
||||
onClick={() => onClickToTransactionStatus(value.value)}
|
||||
>{value.name}</span>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<section className="transaction-list">
|
||||
<div className="date-group">
|
||||
@@ -148,6 +215,22 @@ export const KeyInPaymentPage = () => {
|
||||
onClick={() => onClickToNavigation()}
|
||||
>결제 신청</button>
|
||||
</div>
|
||||
<KeyInPaymentFilter
|
||||
filterOn={filterOn}
|
||||
setFilterOn={setFilterOn}
|
||||
mid={mid}
|
||||
startDate={startDate}
|
||||
endDate={endDate}
|
||||
transactionStatus={transactionStatus}
|
||||
minAmount={minAmount}
|
||||
maxAmount={maxAmount}
|
||||
setMid={setMid}
|
||||
setStartDate={setStartDate}
|
||||
setEndDate={setEndDate}
|
||||
setTransactionStatus={setTransactionStatus}
|
||||
setMinAmount={setMinAmount}
|
||||
setMaxAmount={setMaxAmount}
|
||||
></KeyInPaymentFilter>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -31,14 +31,14 @@ export const LinkPaymentDetailPage = () => {
|
||||
useSetHeaderTitle('링크결제 상세');
|
||||
useSetHeaderType(HeaderType.RightClose);
|
||||
useSetOnBack(() => {
|
||||
navigate(PATHS.additionalService.linkPayment.dispatchList);
|
||||
navigate(PATHS.additionalService.linkPayment.shippingHistory);
|
||||
});
|
||||
useSetFooterMode(false);
|
||||
|
||||
const onClickToNavigate = (path: string) => {
|
||||
let timeout = setTimeout(() => {
|
||||
clearTimeout(timeout);
|
||||
navigate(PATHS.additionalService.linkPayment.dispatchList, {
|
||||
navigate(PATHS.additionalService.linkPayment.shippingHistory, {
|
||||
});
|
||||
}, 10)
|
||||
};
|
||||
@@ -60,7 +60,7 @@ export const LinkPaymentDetailPage = () => {
|
||||
afterLeave={ unmount }
|
||||
open={ isOpen }
|
||||
onClose={ close }
|
||||
onConfirmClick={ () => onClickToNavigate(PATHS.additionalService.linkPayment.dispatchList) }
|
||||
onConfirmClick={ () => onClickToNavigate(PATHS.additionalService.linkPayment.shippingHistory) }
|
||||
message={ msg }
|
||||
buttonLabel={['취소', '확인']}
|
||||
/>
|
||||
|
||||
@@ -12,7 +12,6 @@ import {
|
||||
useSetFooterMode,
|
||||
useSetOnBack
|
||||
} from '@/widgets/sub-layout/use-sub-layout';
|
||||
import { LinkPaymentFilter } from '@/entities/additional-service/ui/link-payment/link-payment-filter';
|
||||
|
||||
/**
|
||||
* 발송대기 탭 화면
|
||||
|
||||
@@ -5,7 +5,7 @@ import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { HeaderType } from '@/entities/common/model/types';
|
||||
import { LinkPaymentTab } from '@/entities/additional-service/ui/link-payment/link-payment-tab';
|
||||
import { LinkPaymentTabKeys } from '@/entities/additional-service/model/types';
|
||||
import { LinkPaymentDispatchListWrap } from '../../../entities/additional-service/ui/link-payment/link-payment-dispatch-list-wrap';
|
||||
import { LinkPaymentShippingHistoryWrap } from '../../../entities/additional-service/ui/link-payment/link-payment-shipping-history-wrap';
|
||||
import {
|
||||
useSetHeaderTitle,
|
||||
useSetHeaderType,
|
||||
@@ -17,10 +17,10 @@ import {
|
||||
* 발송내역 탭 화면
|
||||
*/
|
||||
|
||||
export const LinkPaymentDispatchListPage = () => {
|
||||
export const LinkPaymentShippingHistoryPage = () => {
|
||||
const { navigate } = useNavigate();
|
||||
|
||||
const [activeTab, setActiveTab] = useState<LinkPaymentTabKeys>(LinkPaymentTabKeys.DispatchList)
|
||||
const [activeTab, setActiveTab] = useState<LinkPaymentTabKeys>(LinkPaymentTabKeys.ShippingHistory)
|
||||
|
||||
useSetHeaderTitle('링크결제')
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
@@ -35,7 +35,7 @@ export const LinkPaymentDispatchListPage = () => {
|
||||
<div className="tab-content">
|
||||
<div className="tab-pane pt-46 active">
|
||||
<LinkPaymentTab activeTab={activeTab}></LinkPaymentTab>
|
||||
<LinkPaymentDispatchListWrap></LinkPaymentDispatchListWrap>
|
||||
<LinkPaymentShippingHistoryWrap></LinkPaymentShippingHistoryWrap>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -5,11 +5,12 @@ import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { PATHS } from '@/shared/constants/paths';
|
||||
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
|
||||
import { EscrowList } from '@/entities/transaction/ui/escrow-list';
|
||||
import { EscrowListItem, TransactionCategory, SortByKeys } from '@/entities/transaction/model/types';
|
||||
import { EscrowListItem, TransactionCategory, SortByKeys, EscrowDeliveryStatus, EscrowSearchType, EscrowSettlementStatus } from '@/entities/transaction/model/types';
|
||||
import { useEscrowListMutation } from '@/entities/transaction/api/use-escrow-list-mutation';
|
||||
import { useDownloadExcelMutation } from '@/entities/transaction/api/use-download-excel-mutation';
|
||||
import { DEFAULT_PAGE_PARAM } from '@/entities/common/model/constants';
|
||||
import { Filter } from '@/entities/transaction/ui/filter';
|
||||
import { deliveryStatusBtnGroup } from '@/entities/additional-service/model/contant';
|
||||
import { SortOptionsBox } from '@/entities/transaction/ui/sort-options-box';
|
||||
import { HeaderType } from '@/entities/common/model/types';
|
||||
import {
|
||||
@@ -19,23 +20,24 @@ import {
|
||||
useSetFooterMode
|
||||
} from '@/widgets/sub-layout/use-sub-layout';
|
||||
|
||||
const serviceCodes = [
|
||||
{name: '전체', key: 'all'},
|
||||
{name: '결제완료', key: 'paid'},
|
||||
{name: '배송등록', key: 'register'},
|
||||
];
|
||||
|
||||
export const EscrowListPage = () => {
|
||||
const { navigate } = useNavigate();
|
||||
const userInfo = useStore((state) => state.UserStore.UserInfo);
|
||||
|
||||
const [selectedServiceCode, setSelectedServiceCode] = useState<string>('all');
|
||||
const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
|
||||
const [listItems, setListItems] = useState({});
|
||||
const [filterOn, setFilterOn] = useState<boolean>(false);
|
||||
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
|
||||
const [startDate, setStartDate] = useState(moment().subtract(1, 'month').format('YYYY-MM-DD'));
|
||||
const [mid, setMid] = useState<string>('nictest001m');
|
||||
const [searchType, setSearchType] = useState<EscrowSearchType>(EscrowSearchType.ALL);
|
||||
const [searchKeyword, setSearchKeyword] = useState<string>('');
|
||||
//const [startDate, setStartDate] = useState(moment().subtract(1, 'month').format('YYYY-MM-DD'));
|
||||
const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [endDate, setEndDate] = useState(moment().format('YYYY-MM-DD'));
|
||||
const [deliveryStatus, setDeliveryStatus] = useState<EscrowDeliveryStatus>(EscrowDeliveryStatus.ALL);
|
||||
const [settlementStatus, setSettlementStatus] = useState<EscrowSettlementStatus>(EscrowSettlementStatus.ALL);
|
||||
const [minAmount, setMinAmount] = useState<number | string>();
|
||||
const [maxAmount, setMaxAmount] = useState<number | string>();
|
||||
|
||||
useSetHeaderTitle('에스크로');
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
@@ -51,24 +53,30 @@ export const EscrowListPage = () => {
|
||||
sortBy?: string,
|
||||
val?: string
|
||||
}) => {
|
||||
// pageParam.sortBy = (option?.sortBy)? option.sortBy: sortBy;
|
||||
pageParam.sortBy = (option?.sortBy)? option.sortBy: sortBy;
|
||||
setPageParam(pageParam);
|
||||
let newMinAmount = minAmount;
|
||||
if(!!minAmount && typeof(minAmount) === 'string'){
|
||||
newMinAmount = parseInt(minAmount);
|
||||
}
|
||||
let newMaxAmount = maxAmount;
|
||||
if(!!maxAmount && typeof(maxAmount) === 'string'){
|
||||
newMaxAmount = parseInt(maxAmount);
|
||||
}
|
||||
let listParams = {
|
||||
mid: 'nictest001m',
|
||||
searchType: 'ORDER_NUMBER',
|
||||
searchKeyword: '',
|
||||
mid: mid,
|
||||
searchType: searchType,
|
||||
searchKeyword: searchKeyword,
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
deliveryStatus: 'ALL',
|
||||
settlementStatus: 'ALL',
|
||||
minAmount: 0,
|
||||
maxAmount: 999999999,
|
||||
deliveryStatus: deliveryStatus,
|
||||
settlementStatus: settlementStatus,
|
||||
minAmount: newMinAmount,
|
||||
maxAmount: newMaxAmount,
|
||||
pagination: pageParam
|
||||
};
|
||||
|
||||
console.log(listParams)
|
||||
|
||||
escrowList(listParams).then((rs) => {
|
||||
escrowList(listParams).then((rs) => {
|
||||
setListItems(assembleData(rs.content));
|
||||
});
|
||||
};
|
||||
@@ -105,8 +113,8 @@ export const EscrowListPage = () => {
|
||||
callList({sortBy: sort});
|
||||
};
|
||||
|
||||
const onClickToServiceCode = (val: string) => {
|
||||
setSelectedServiceCode(val);
|
||||
const onClickToDeliveryStatus = (val: EscrowDeliveryStatus) => {
|
||||
setDeliveryStatus(val);
|
||||
callList({val: val});
|
||||
};
|
||||
|
||||
@@ -154,11 +162,11 @@ export const EscrowListPage = () => {
|
||||
<div className="excrow">
|
||||
<div className="full-menu-keywords no-padding">
|
||||
{
|
||||
serviceCodes.map((value, index) => (
|
||||
deliveryStatusBtnGroup.map((value, index) => (
|
||||
<span
|
||||
key={ `key-service-code=${ index }` }
|
||||
className={ `keyword-tag ${(selectedServiceCode === value.key)? 'active': ''}` }
|
||||
onClick={ () => onClickToServiceCode(value.key) }
|
||||
className={ `keyword-tag ${(deliveryStatus === value.value)? 'active': ''}` }
|
||||
onClick={ () => onClickToDeliveryStatus(value.value) }
|
||||
>{ value.name }</span>
|
||||
))
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user