통합 거래내역 필터

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

@@ -5,12 +5,12 @@ import { IMAGE_ROOT } from '@/shared/constants/common';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { AllTransactionList } from '@/entities/transaction/ui/all-transaction-list';
-import { AllTransactionListItem, TransactionCategory, SortByKeys } from '@/entities/transaction/model/types';
+import { AllTransactionListItem, TransactionCategory, SortByKeys, AllTransactionStateCode, AllTransactionServiceCode, AllTransactionSearchCl } from '@/entities/transaction/model/types';
 import { useAllTransactionListMutation } from '@/entities/transaction/api/use-all-transaction-list-mutation';
 import { useAllTransactionListSummaryMutation } from '@/entities/transaction/api/use-all-transaction-list-summary-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 { AllTransactionFilter } from '@/entities/transaction/ui/filter/all-transaction-filter';
 import { SortOptionsBox } from '@/entities/transaction/ui/sort-options-box';
 import { FooterItemActiveKey } from '@/entities/common/model/types';
 import { HeaderType } from '@/entities/common/model/types';
@@ -27,14 +27,30 @@ export const AllTransactionListPage = () => {
 
   const [serviceCodeOptions, setServiceCodeOptions] = useState<Array<Record<string, any>>>();
   const [selectedServiceCode, setSelectedServiceCode] = useState<string>('st');
+  
   const [sortBy, setSortBy] = useState<SortByKeys>(SortByKeys.New);
   const [listItems, setListItems] = useState({});
-  const [totalTransactionCount, setTotalTransactionCount] = useState<number>(0);
-  const [totalTransactionAmount, setTotalTransactionAmount] = useState<number>(0);
   const [filterOn, setFilterOn] = useState<boolean>(false);
   const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
-  const [fromDate, setFromDate] = useState(moment().subtract(1, 'month').format('YYYYMMDD'));
+  const [mid, setMid] = useState<string>('nictest001m');
+  const [moid, setMoid] = useState<string>('');
+  const [tid, setTid] = useState<string>('');
+  // const [fromDate, setFromDate] = useState(moment().subtract(1, 'month').format('YYYYMMDD'));
+  const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD'));
   const [toDate, setToDate] = useState(moment().format('YYYYMMDD'));
+  const [stateCode, setStateCode] = useState<AllTransactionStateCode>(AllTransactionStateCode.ALL);
+  const [serviceCode, setServiceCode] = useState<AllTransactionServiceCode>(AllTransactionServiceCode.ALL);
+  const [minAmount, setMinAmount] = useState<number | string>();
+	const [maxAmount, setMaxAmount] = useState<number | string>();
+  const [cardCode, setCardCode] = useState<string | undefined>();
+  const [bankCode, setBankCode] = useState<string | undefined>();
+  const [searchCl, setSearchCl] = useState<AllTransactionSearchCl | undefined>();
+  const [searchValue, setSearchValue] = useState<string | undefined>();
+
+  const [totalTransactionCount, setTotalTransactionCount] = useState<number>(0);
+  const [totalTransactionAmount, setTotalTransactionAmount] = useState<number>(0);
+  
+  
   
 	useSetHeaderTitle('거래내역 조회');
 	useSetHeaderType(HeaderType.LeftArrow);
@@ -53,20 +69,20 @@ export const AllTransactionListPage = () => {
     val?: string
   }) => {
     let listSummaryParams = {
-      moid: 'string',
-      tid: 'string',
+      moid: moid,
+      tid: tid,
       fromDate: fromDate,
       toDate: toDate,
-      stateCode: '0',
-      serviceCode: (option?.val)? option.val: selectedServiceCode,
-      minAmount: 0,
-      maxAmount: 0,
+      stateCode: stateCode,
+      serviceCode: serviceCode,
+      minAmount: minAmount,
+      maxAmount: maxAmount,
       dateCl: 'TRANS',
       goodsName: 'string',
-      cardCode: 'st',
-      bankCode: 'str',
-      searchCl: 'CARD_NO',
-      searchValue: 'string',
+      cardCode: cardCode,
+      bankCode: bankCode,
+      searchCl: searchCl,
+      searchValue: searchValue,
     };
     pageParam.sortBy = (option?.sortBy)? option.sortBy: sortBy;
     setPageParam(pageParam);
@@ -226,10 +242,34 @@ export const AllTransactionListPage = () => {
 					</div>
 				</div>
 			</main>
-      <Filter
+      <AllTransactionFilter
         filterOn={ filterOn }
         setFilterOn={ setFilterOn }
-      ></Filter>
+        mid={ mid }
+        fromDate={ fromDate }
+        toDate={ toDate }
+        stateCode={ stateCode }
+        serviceCode={ serviceCode }
+        minAmount={ minAmount }
+        maxAmount={ maxAmount }
+        cardCode={ cardCode }
+        bankCode={ bankCode }
+        searchCl={ searchCl }
+        searchValue={ searchValue }
+        setMid={ setMid }
+        setMoid={ setMoid }
+        setTid={ setTid }
+        setFromDate={ setFromDate }
+        setToDate={ setToDate }
+        setStateCode={ setStateCode }
+        setServiceCode={ setServiceCode }
+        setMinAmount={ setMinAmount }
+        setMaxAmount={ setMaxAmount }
+        setCardCode={ setCardCode }
+        setBankCode={ setBankCode }
+        setSearchCl={ setSearchCl }
+        setSearchValue={ setSearchValue }
+      ></AllTransactionFilter>
     </>
 	);
 };