에스크로 빌링 현금영수증 세금계산서 필터 뱃지

src/pages/transaction/cash-receipt/list-page.tsx

@@ -45,6 +45,15 @@ import { useCashReceiptExcelDownloadMutation } from '@/entities/transaction/api/
 
 /* 현금영수증 32 */
 const menuId = 32;
+const defaultParams = {
+	startDate: moment().format('YYYYMMDD'),
+	endDate: moment().format('YYYYMMDD'),
+	purposeType: CashReceiptPurposeType.ALL,
+	transactionType: CashReceiptTransactionType.ALL,
+	processResult: CashReceiptProcessResult.ALL,
+	searchNumberType: CashReceiptSearchNumberType.APPROVAL_NUMBER,
+	searchNumber: '',
+};
 export const CashReceiptListPage = () => {
 	const { navigate } = useNavigate();
 	const { t, i18n } = useTranslation();
@@ -56,8 +65,8 @@ export const CashReceiptListPage = () => {
 	const [filterOn, setFilterOn] = useState<boolean>(false);
 	const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
 	const [mid, setMid] = useState<string>(userMid);
-	const [startDate, setStartDate] = useState(moment().format('YYYYMMDD'));
-	const [endDate, setEndDate] = useState(moment().format('YYYYMMDD'));
+	const [startDate, setStartDate] = useState<string>(moment().format('YYYYMMDD'));
+	const [endDate, setEndDate] = useState<string>(moment().format('YYYYMMDD'));
 	const [purposeType, setPurposeType] = useState<CashReceiptPurposeType>(CashReceiptPurposeType.ALL);
 	const [transactionType, setTransactionType] = useState<CashReceiptTransactionType>(CashReceiptTransactionType.ALL);
 	const [processResult, setProcessResult] = useState<CashReceiptProcessResult>(CashReceiptProcessResult.ALL);
@@ -74,6 +83,8 @@ export const CashReceiptListPage = () => {
 	const [detailOn, setDetailOn] = useState<boolean>(false);
   const [detailTid, setDetailTid] = useState<string>('');
   const [detailServiceCode, setDetailServiceCode] = useState<string>('');
+
+	const [filterUsed, setFilterUsed] = useState<boolean>(false);
 	
 	useSetHeaderTitle(t('cashReceipt.title'));
 	useSetHeaderType(HeaderType.LeftArrow);
@@ -244,8 +255,24 @@ export const CashReceiptListPage = () => {
 		}
   };
 
+	const checkUsedFilter = () => {
+    let rs: boolean = true;
+    if(startDate === defaultParams.startDate
+      && endDate === defaultParams.endDate
+      && purposeType === defaultParams.purposeType
+      && transactionType === defaultParams.transactionType
+      && processResult === defaultParams.processResult
+      && searchNumberType === defaultParams.searchNumberType
+      && searchNumber === defaultParams.searchNumber
+    ){
+      rs =  false;
+    }
+    setFilterUsed(rs);
+	};
+
 	useEffect(() => {
     callList();
+		checkUsedFilter();
   }, [
     mid, startDate, endDate, sortType,
     purposeType, transactionType, processResult,
@@ -272,6 +299,9 @@ export const CashReceiptListPage = () => {
 											alt={ t('transaction.searchOptions') }
 											onClick={ onClickToOpenFilter }
 										/>
+										{ filterUsed &&
+                      <span className="notification-badge2"></span>
+                    }
 									</button>
 								</div>
 								<button className="download-btn">