에스크로 필터

src/pages/transaction/escrow/list-page.tsx

@@ -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>
 									))
 								}