계좌점유인증 필터 뱃지

src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx

@@ -30,6 +30,11 @@ import { showAlert } from '@/widgets/show-alert';
 import { checkGrant } from '@/shared/lib/check-grant';
 import { snackBar } from '@/shared/lib';
 
+const defaultParams = {
+  fromDate: moment().format('YYYYMMDD'),
+  toDate: moment().format('YYYYMMDD'),
+  authStatus: AccountHolderAuthStatus.ALL
+};
 export const AccountHolderAuthPage = () => {
   const { navigate } = useNavigate();
   const { t } = useTranslation();
@@ -47,14 +52,15 @@ export const AccountHolderAuthPage = () => {
   const [filterOn, setFilterOn] = useState<boolean>(false);
   const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
   const [mid, setMid] = useState<string>(userMid);
-  const [fromDate, setFromDate] = useState(moment().format('YYYYMMDD'));
-  const [toDate, setToDate] = useState(moment().format('YYYYMMDD'));
-  const [authStatus, setAuthStatus] = useState<AccountHolderAuthStatus>(AccountHolderAuthStatus.ALL)
+  const [fromDate, setFromDate] = useState<string>(defaultParams.fromDate);
+  const [toDate, setToDate] = useState<string>(defaultParams.toDate);
+  const [authStatus, setAuthStatus] = useState<AccountHolderAuthStatus>(defaultParams.authStatus);
   const [detailOn, setDetailOn] = useState<boolean>(false);
   const [detailMid, setDetailMid] = useState<string>('');
   const [detailTid, setDetailTid] = useState<string>('');
 
   const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState<boolean>(false);
+  const [filterUsed, setFilterUsed] = useState<boolean>(false);
 
   useSetHeaderTitle(t('additionalService.accountHolderAuth.title'));
   useSetHeaderType(HeaderType.LeftArrow);
@@ -190,8 +196,20 @@ export const AccountHolderAuthPage = () => {
     }
   };
 
+  const checkUsedFilter = () => {
+    let rs: boolean = true;
+    if(fromDate === defaultParams.fromDate
+      && toDate === defaultParams.toDate
+      && authStatus === defaultParams.authStatus
+    ){
+      rs =  false;
+    }
+    setFilterUsed(rs);
+	};
+
   useEffect(() => {
     callList();
+    checkUsedFilter();
   }, [
     mid,
     fromDate,
@@ -227,6 +245,9 @@ export const AccountHolderAuthPage = () => {
                       alt={t('common.searchOptions')}
                       onClick={ onClickToOpenFilter }
                     />
+                    { filterUsed &&
+                      <span className="notification-badge2"></span>
+                    }
                   </button>
                 </div>
                 <button