close 버튼 공통화
This commit is contained in:
@@ -11,6 +11,7 @@ import { useStore } from '@/shared/model/store';
|
||||
import { AccountHolderAuthFilterProps, AccountHolderAuthStatus } from '@/entities/additional-service/model/account-holder-auth/types';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const AccountHolderAuthFilter = ({
|
||||
filterOn,
|
||||
@@ -60,16 +61,10 @@ export const AccountHolderAuthFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -12,6 +12,7 @@ import { AccountHolderSearchFilterProps, AccountHolderSearchCl, AccountHolderRes
|
||||
import { getResultStatusBtnGroup, getSearchTypeOption } from '@/entities/additional-service/model/account-holder-search/constant';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const AccountHolderSearchFilter = ({
|
||||
filterOn,
|
||||
@@ -82,16 +83,10 @@ export const AccountHolderSearchFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FaceAuthFilterProps, FaceAuthResult, FaceAuthTransType } from '@/entiti
|
||||
import { getAuthResultBtnGroup, getTransactionTypeBtnGroup } from '@/entities/additional-service/model/face-auth/constant';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const FaceAuthFilter = ({
|
||||
filterOn,
|
||||
@@ -70,16 +71,10 @@ export const FaceAuthFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -17,6 +17,7 @@ import { FilterSelectInput } from '@/shared/ui/filter/select-input';
|
||||
import { getAlimtalkAlimClBtnGroupForGeneral, getAlimtalkAlimClBtnGroupForVBank, getAlimtalkSearchClOptionGroup, getAlimtalkSendClBtnGroup, getAlimtalkSendTypeBtnGroup, getAlimtalkServiceCodeOptionGroup } from '../../model/alimtalk/constant';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface AlimtalkFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -123,16 +124,10 @@ export const AlimtalkFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -17,6 +17,7 @@ import { OrderStatus, PaymentStatus } from '../../model/ars/types';
|
||||
import { getArsOrderStatusBtnGroup, getArsPaymentStatusBtnGroup } from '../../model/ars/constant';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface ArsFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -105,16 +106,10 @@ export const ArsFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('filter.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FilterSelectInput } from '@/shared/ui/filter/select-input';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface FundAccountResultFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -112,16 +113,10 @@ export const FundAccountResultFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FilterSelectInput } from '@/shared/ui/filter/select-input';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface FundAccountTransactionFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -106,16 +107,10 @@ export const FundAccountTransactionFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -22,6 +22,7 @@ import moment from 'moment';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface PayoutFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -103,16 +104,10 @@ export const PayoutFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -12,6 +12,7 @@ import { KeyInPaymentFilterProps, KeyInPaymentTansactionType } from '@/entities/
|
||||
import { getKeyInPaymentPaymentStatusBtnGroup } from '@/entities/additional-service/model/key-in/constant';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const KeyInPaymentFilter = ({
|
||||
filterOn,
|
||||
@@ -66,16 +67,10 @@ export const KeyInPaymentFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('filter.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -16,6 +16,7 @@ import { useStore } from '@/shared/model/store';
|
||||
import { LinkPaymentHistoryFilterProps, LinkPaymentPaymentStatus, LinkPaymentSearchCl, LinkPaymentSendMethod, LinkPaymentSendStatus } from '@/entities/additional-service/model/link-pay/types';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const LinkPaymentHistoryFilter = ({
|
||||
filterOn,
|
||||
@@ -108,16 +109,10 @@ export const LinkPaymentHistoryFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('common.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt={t('common.close')}
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { LinkPaymentProcessStatus, LinkPaymentSearchCl, LinkPaymentSendMethod, LinkPaymentSendStatus, LinkPaymentWaitFilterProps } from '@/entities/additional-service/model/link-pay/types';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const LinkPaymentWaitSendFilter = ({
|
||||
filterOn,
|
||||
@@ -91,16 +92,10 @@ export const LinkPaymentWaitSendFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">필터</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt="닫기"
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -11,6 +11,7 @@ import { SmsPaymentFilterProps, SmsPaymentSearchCl, SmsCl } from '../../model/sm
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@/entities/common/model/constant';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
export const SmsPaymentFilter = ({
|
||||
filterOn,
|
||||
setFilterOn,
|
||||
@@ -79,16 +80,10 @@ export const SmsPaymentFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">필터</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_close.svg'}
|
||||
alt="닫기"
|
||||
onClick={() => onClickToClose()}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
26
src/entities/common/ui/full-menu-close.tsx
Normal file
26
src/entities/common/ui/full-menu-close.tsx
Normal file
@@ -0,0 +1,26 @@
|
||||
import { IMAGE_ROOT } from "@/shared/constants/common";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
export interface FullMenuCloseProps {
|
||||
addClass?: string;
|
||||
onClickToCallback: () => void;
|
||||
};
|
||||
|
||||
export const FullMenuClose = ({
|
||||
addClass = 'full-menu-close',
|
||||
onClickToCallback
|
||||
}: FullMenuCloseProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<>
|
||||
<button className={ addClass }>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={ t('filter.close') }
|
||||
onClick={ onClickToCallback }
|
||||
/>
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
@@ -17,6 +17,7 @@ import { FilterCalendar } from '@/shared/ui/filter/calendar';
|
||||
import { getSettlementPaymentMethodOptionsGroup, getSettlementPeriodTypeBtnGroup } from '../../model/constant';
|
||||
import { FilterButtonGroups } from '@/shared/ui/filter/button-groups';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface ListFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -88,16 +89,10 @@ export const ListFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('common.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list pt-16 pb-86">
|
||||
|
||||
@@ -8,6 +8,7 @@ import { FilterMotionDuration, FilterMotionStyle, FilterMotionVariants } from '@
|
||||
import { useNavigate } from '@/shared/lib/hooks';
|
||||
import { PATHS } from '@/shared/constants/paths';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
export interface AllTransactionCancelPreventBondProps {
|
||||
cancelPreventBondOn: boolean;
|
||||
setCancelPreventBondOn: (cancelPreventBondOn: boolean) => void;
|
||||
@@ -52,16 +53,10 @@ export const AllTransactionCancelPreventBond = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('transaction.cancel.afterDeposit.title')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('common.close')}
|
||||
onClick={ onClickToClose }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="option-list-nopadding pw-26">
|
||||
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
} from '@/entities/common/model/constant';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const AllTransactionFilter = ({
|
||||
filterOn,
|
||||
@@ -219,16 +220,10 @@ export const AllTransactionFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('filter.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -28,6 +28,7 @@ import {
|
||||
} from '@/entities/common/model/constant';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const BillingFilter = ({
|
||||
filterOn,
|
||||
@@ -113,16 +114,10 @@ export const BillingFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('filter.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -26,6 +26,7 @@ import {
|
||||
} from '@/entities/common/model/constant';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const CashReceiptFilter = ({
|
||||
filterOn,
|
||||
@@ -104,16 +105,10 @@ export const CashReceiptFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('filter.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -26,6 +26,7 @@ import {
|
||||
} from '@/entities/common/model/constant';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export const EscrowFilter = ({
|
||||
filterOn,
|
||||
@@ -106,16 +107,10 @@ export const EscrowFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
id="closeFullMenu"
|
||||
className="full-menu-close"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('filter.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -10,6 +10,7 @@ import { getVatReturnReceiptTypeBtnGroup, getVatReturnTargetTypeBtnGroup } from
|
||||
import { FilterCalendarMonth } from '@/shared/ui/filter/calendar-month';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { FilterSelectMid } from '@/shared/ui/filter/select-mid';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
export interface ListFilterProps {
|
||||
filterOn: boolean;
|
||||
@@ -75,15 +76,10 @@ export const ListFilter = ({
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<button
|
||||
className="full-menu-close"
|
||||
onClick={ () => onClickToClose() }
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt={t('common.close')}
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -19,10 +19,6 @@
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.calendar-style .react-calendar .react-calendar__navigation {
|
||||
/* background-color: white;*/
|
||||
}
|
||||
|
||||
.calendar-style .react-calendar .react-calendar__navigation button {
|
||||
color: #2D3436;
|
||||
padding: 0;
|
||||
@@ -101,6 +97,11 @@ abbr[title] {
|
||||
.tile-sunday{
|
||||
color: #FF0000 !important;
|
||||
}
|
||||
.filter-calendar-close{
|
||||
position: absolute;
|
||||
right: 0.4rem;
|
||||
top: 0.6rem;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
@@ -6,6 +6,7 @@ import 'react-calendar/dist/Calendar.css';
|
||||
import { useEffect } from 'react';
|
||||
import { CalendarType } from '@/entities/common/model/types';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
interface NiceCalendarProps {
|
||||
calendarOpen: boolean;
|
||||
@@ -131,6 +132,10 @@ const NiceCalendarMonth = ({
|
||||
<>
|
||||
<div className="bg-dim"></div>
|
||||
<CalendarWrapper onClick={ () => onClickToClose() }>
|
||||
<FullMenuClose
|
||||
addClass='filter-calendar-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
<Calendar
|
||||
locale={currentLocale}
|
||||
minDate={ minMonth }
|
||||
|
||||
@@ -6,6 +6,8 @@ import 'react-calendar/dist/Calendar.css';
|
||||
import { useEffect } from 'react';
|
||||
import { CalendarType } from '@/entities/common/model/types';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
interface NiceCalendarProps {
|
||||
calendarOpen: boolean;
|
||||
@@ -36,7 +38,7 @@ const NiceCalendar = ({
|
||||
minDate: propMinDate,
|
||||
maxDate: propMaxDate
|
||||
}: NiceCalendarProps) => {
|
||||
const { i18n } = useTranslation();
|
||||
const { i18n, t } = useTranslation();
|
||||
const currentLocale = i18n.language || 'en';
|
||||
|
||||
const [valueDate, setValueDate] = useState<Date | undefined>();
|
||||
@@ -48,7 +50,7 @@ const NiceCalendar = ({
|
||||
};
|
||||
|
||||
const onClickToClose = () => {
|
||||
// setCalendarOpen(false);
|
||||
setCalendarOpen(false);
|
||||
};
|
||||
const setMinMaxValueDate = () => {
|
||||
if(calendarType === CalendarType.Start){
|
||||
@@ -136,10 +138,11 @@ const NiceCalendar = ({
|
||||
{ (calendarOpen) &&
|
||||
<>
|
||||
<div className="bg-dim"></div>
|
||||
<CalendarWrapper
|
||||
className="calendar-container calendar-style"
|
||||
onClick={ () => onClickToClose() }
|
||||
>
|
||||
<CalendarWrapper className="calendar-container calendar-style">
|
||||
<FullMenuClose
|
||||
addClass='filter-calendar-close'
|
||||
onClickToCallback={ onClickToClose }
|
||||
></FullMenuClose>
|
||||
<Calendar
|
||||
locale={currentLocale}
|
||||
minDate={ minDate }
|
||||
|
||||
@@ -12,6 +12,7 @@ import { setHomeReloadKey } from '@/pages/home/home-page';
|
||||
import { useShortcutSaveMutation } from '@/entities/user/api/use-shortcut-save-mutation';
|
||||
import { ShortcutSaveParams, ShortcutSaveResponse } from '@/entities/user/model/types';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
|
||||
|
||||
// 상수 정의
|
||||
const SCROLL_ANIMATION_DURATION = 800;
|
||||
@@ -281,15 +282,10 @@ export const Menu = ({
|
||||
/>
|
||||
</button>
|
||||
}
|
||||
<button
|
||||
className="full-menu-close"
|
||||
onClick={ () => onClickToMenuClose() }
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt="닫기"
|
||||
/>
|
||||
</button>
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
onClickToCallback={ onClickToMenuClose }
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user