풋터 관련 수정

2025-10-13 09:51:29 +09:00
parent 005941bc8b
commit 261d17cd30
30 changed files with 67 additions and 43 deletions
--- a/src/entities/payment/ui/card-commission-bottom-sheet.tsx
+++ b/src/entities/payment/ui/card-commission-bottom-sheet.tsx
@@ -1,16 +1,21 @@
 import { motion } from 'framer-motion';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { BottomSheetMotionDuration, BottomSheetMotionVaiants } from '@/entities/common/model/constant';
-import { GeneralTabItems, InstallmentTabItems, MoneyPointTabItems } from '../model/types';
+import { BankFees, CategoryFees, FeeRanges, GeneralTabItems, InstallmentTabItems, MoneyPointTabItems, PaymentFees } from '../model/types';

 export interface CardCommissionBottomSheetProps {
  cardCommissionBottomSheetOn: boolean;
  setCardCommissionBottomSheetOn: (cardCommissionBottomSheetOn: boolean) => void;
  payType: number;
  settlementPeriod?: string;
-  generalTabItems: Array<GeneralTabItems>,
-  installmentTabItems: Array<InstallmentTabItems>,
-  moneyPointTabItems: Array<MoneyPointTabItems>
+  generalTabItems?: Array<GeneralTabItems>,
+  installmentTabItems?: Array<InstallmentTabItems>,
+  moneyPointTabItems?: Array<MoneyPointTabItems>,
+  feeRanges?: Array<FeeRanges>,
+  bankFees?: Array<BankFees>,
+  paymentFees?: Array<PaymentFees>,
+  categoryFees?: Array<CategoryFees>,
+  feeRate?: number
 };

 export const CardCommissionBottomSheet = ({
@@ -20,7 +25,12 @@ export const CardCommissionBottomSheet = ({
  settlementPeriod,
  generalTabItems,
  installmentTabItems,
-  moneyPointTabItems
+  moneyPointTabItems,
+  feeRanges,
+  bankFees,
+  paymentFees,
+  categoryFees,
+  feeRate
 }: CardCommissionBottomSheetProps) => {

  const onClickToClose = () => {
--- a/src/entities/payment/ui/info-wrap.tsx
+++ b/src/entities/payment/ui/info-wrap.tsx
@@ -7,6 +7,9 @@ import { NoInterestInfoBottomSheet } from './no-interest-info-bottom-sheet';
 import { usePaymentInstallmentDetailMutation } from '../api/use-payment-installment-detail-mutation';
 import { 
  AccountTransferData,
+  BankFees,
+  CategoryFees,
+  FeeRanges,
  GeneralTabItems,
  InstallmentData,
  InstallmentDetails,
@@ -16,6 +19,7 @@ import {
  OtherPaymentData,
  PaymentCardParams,
  PaymentCardResponse, 
+  PaymentFees, 
  PaymentInfoItemType, 
  PaymentInstallmentDetailParams, 
  PaymentInstallmentDetailResponse, 
@@ -45,6 +49,12 @@ export const InfoWrap = () => {
  const [generalTabItems, setGeneralTabItems] = useState<Array<GeneralTabItems>>([]);
  const [installmentTabItems, setInstallmentTabItems] = useState<Array<InstallmentTabItems>>([]);
  const [moneyPointTabItems, setMoneyPointTabItems] = useState<Array<MoneyPointTabItems>>([]);
+
+  const [feeRanges, setFeeRanges] = useState<Array<FeeRanges>>([]);
+  const [bankFees, setBankFees] = useState<Array<BankFees>>([]);
+  const [paymentFees, setPaymentFees] = useState<Array<PaymentFees>>([]);
+  const [categoryFees, setCategoryFees] = useState<Array<CategoryFees>>([]);
+  const [feeRate, setFeeRate] = useState<number>(0);
  
  const [accountTransferData, setAccountTransferData] = useState<AccountTransferData>();
  const [mobilePaymentData, setMobilePaymentData] = useState<MobilePaymentData>();
@@ -148,9 +158,11 @@ export const InfoWrap = () => {
    paymentNonCard(params).then((rs: PaymentNonCardResponse) => {
      console.log(rs);
      setSettlementPeriod(rs.settlementPeriod);
-      setAccountTransferData(rs.accountTransferData);
-      setMobilePaymentData(rs.mobilePaymentData);
-      setOtherPaymentData(rs.otherPaymentData);
+      setFeeRanges(rs.accountTransferData.feeRanges);
+      setBankFees(rs.accountTransferData.bankFees);
+      setPaymentFees(rs.mobilePaymentData.paymentFees);
+      setCategoryFees(rs.mobilePaymentData.categoryFees);
+      setFeeRate(rs.otherPaymentData.feeRate);
    });
  };
  const callPaymentIntallment = () => {
@@ -218,6 +230,11 @@ export const InfoWrap = () => {
        generalTabItems={ generalTabItems }
        installmentTabItems={ installmentTabItems }
        moneyPointTabItems= { moneyPointTabItems }
+        feeRanges={ feeRanges }
+        bankFees={ bankFees }
+        paymentFees={ paymentFees  }
+        categoryFees={ categoryFees }
+        feeRate={ feeRate }
      ></CardCommissionBottomSheet>
      <CreditCardListBottomSheet
        creditCardListBottomSheetOn={ creditCardListBottomSheetOn }
--- a/src/pages/account/password/manage-page.tsx
+++ b/src/pages/account/password/manage-page.tsx
@@ -18,7 +18,7 @@ export const PasswordManagePage = () => {
  const [activeTab, setActiveTab] = useState<AccountTabKeys>(AccountTabKeys.PasswordManage);
  useSetHeaderTitle('계정 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/account/user/account-auth-page.tsx
+++ b/src/pages/account/user/account-auth-page.tsx
@@ -21,7 +21,7 @@ export const UserAccountAuthPage = () => {
  const [activeTab, ] = useState<AccountUserTabKeys>(AccountUserTabKeys.AccountAuth);
  useSetHeaderTitle('사용자 설정');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.account.user.manage);
  });
--- a/src/pages/account/user/login-auth-info-page.tsx
+++ b/src/pages/account/user/login-auth-info-page.tsx
@@ -21,7 +21,7 @@ export const UserLoginAuthInfoPage = () => {
  const [activeTab, ] = useState<AccountUserTabKeys>(AccountUserTabKeys.LoginAuthInfo);
  useSetHeaderTitle('사용자 설정');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.account.user.manage);
  });
--- a/src/pages/account/user/manage-page.tsx
+++ b/src/pages/account/user/manage-page.tsx
@@ -10,7 +10,6 @@ import {
 	useSetHeaderTitle,
 	useSetHeaderType,
 	useSetFooterMode,
-  useSetFooterCurrentPage,
  useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';

@@ -20,8 +19,7 @@ export const UserManagePage = () => {
  const [activeTab, ] = useState<AccountTabKeys>(AccountTabKeys.UserManage);
  useSetHeaderTitle('계정 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
-  useSetFooterCurrentPage(FooterItemActiveKey.Account);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/account/user/menu-auth-page.tsx
+++ b/src/pages/account/user/menu-auth-page.tsx
@@ -52,7 +52,7 @@ export const UserMenuAuthPage = () => {

  useSetHeaderTitle(menuName);
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.account.user.accountAuth, {
      state: {
--- a/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx
+++ b/src/pages/additional-service/account-holder-auth/account-holder-auth-page.tsx
@@ -36,7 +36,7 @@ export const AccountHolderAuthPage = () => {

  useSetHeaderTitle('계좌점유인증');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/fund-account/result-list-page.tsx
+++ b/src/pages/additional-service/fund-account/result-list-page.tsx
@@ -19,7 +19,7 @@ export const FundAccountResultListPage = () => {

  useSetHeaderTitle('자금이체');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/fund-account/transfer-list-page.tsx
+++ b/src/pages/additional-service/fund-account/transfer-list-page.tsx
@@ -19,7 +19,7 @@ export const FundAccountTransferListPage = () => {

  useSetHeaderTitle('자금이체');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/list-page.tsx
+++ b/src/pages/additional-service/list-page.tsx
@@ -24,7 +24,7 @@ export const ListPage = () => {

  useSetHeaderTitle('부가서비스 소개');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/settlement-agency/deposit-page.tsx
+++ b/src/pages/additional-service/settlement-agency/deposit-page.tsx
@@ -19,7 +19,7 @@ export const SettlementAgencyDepositPage = () => {

  useSetHeaderTitle('정산대행');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/settlement-agency/member-page.tsx
+++ b/src/pages/additional-service/settlement-agency/member-page.tsx
@@ -19,7 +19,7 @@ export const SettlementAgencyMemberPage = () => {

  useSetHeaderTitle('정산대행');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/additional-service/sms-payment/sms-payment-page.tsx
+++ b/src/pages/additional-service/sms-payment/sms-payment-page.tsx
@@ -45,7 +45,7 @@ export const SmsPaymentPage = () => {

  useSetHeaderTitle('SMS 결제 통보');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);

  const callList = (option?: {
    sortBy?: string,
--- a/src/pages/home/home-page.tsx
+++ b/src/pages/home/home-page.tsx
@@ -88,7 +88,7 @@ export const HomePage = () => {
  // useRefreshUserInfo();
  return (
    <>
-      <main>
+      <main className="home-main">
        {/*<!-- 탭 컨텐츠 영역 -->*/}
        <div className="tab-content blue">
          <div className="tab-pane dashboard active">
--- a/src/pages/merchant/info/info-page.tsx
+++ b/src/pages/merchant/info/info-page.tsx
@@ -19,7 +19,7 @@ export const InfoPage = () => {

  useSetHeaderTitle('가맹점 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/merchant/registration-status/registration-status-page.tsx
+++ b/src/pages/merchant/registration-status/registration-status-page.tsx
@@ -19,7 +19,7 @@ export const RegistrationStatusPage = () => {

  useSetHeaderTitle('가맹점 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/payment/info/info-page.tsx
+++ b/src/pages/payment/info/info-page.tsx
@@ -19,7 +19,7 @@ export const InfoPage = () => {
  
  useSetHeaderTitle('결제 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/payment/notification-data/notification-data-page.tsx
+++ b/src/pages/payment/notification-data/notification-data-page.tsx
@@ -18,7 +18,7 @@ export const NotificationDataPage = () => {

  useSetHeaderTitle('결제 관리');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/settlement/list/list-page.tsx
+++ b/src/pages/settlement/list/list-page.tsx
@@ -11,7 +11,6 @@ import {
 	useSetHeaderTitle,
 	useSetHeaderType,
 	useSetFooterMode,
-  useSetFooterCurrentPage,
  useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';

@@ -26,8 +25,7 @@ export const ListPage = () => {

  useSetHeaderTitle('정산조회');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
-  useSetFooterCurrentPage(FooterItemActiveKey.Settlement);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/support/faq/list-page.tsx
+++ b/src/pages/support/faq/list-page.tsx
@@ -25,7 +25,7 @@ export const FaqListPage = () => {

  useSetHeaderTitle(t('support.faq.title'));
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/support/notice/list-page.tsx
+++ b/src/pages/support/notice/list-page.tsx
@@ -25,7 +25,7 @@ export const NoticeListPage = () => {

  useSetHeaderTitle(t('support.notice.title'));
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/support/qna/list-page.tsx
+++ b/src/pages/support/qna/list-page.tsx
@@ -24,7 +24,7 @@ export const QnaListPage = () => {

  useSetHeaderTitle(t('support.qna.title'));
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/transaction/all-transaction/list-page.tsx
+++ b/src/pages/transaction/all-transaction/list-page.tsx
@@ -18,8 +18,7 @@ import {
 	useSetOnBack,
 	useSetHeaderTitle,
 	useSetHeaderType,
-	useSetFooterMode,
-  useSetFooterCurrentPage
+	useSetFooterMode
 } from '@/widgets/sub-layout/use-sub-layout';
 import { useStore } from '@/shared/model/store';

@@ -58,9 +57,8 @@ export const AllTransactionListPage = () => {
 	useSetOnBack(() => {
 		navigate(PATHS.home);
 	});
-	useSetFooterMode(true);
-  useSetFooterCurrentPage(FooterItemActiveKey.Transaction);
-
+	useSetFooterMode(false);
+  
  const { mutateAsync: allTransactionList } = useAllTransactionListMutation();
  const { mutateAsync: allTransactionListSummary } = useAllTransactionListSummaryMutation();
  const { mutateAsync: downloadExcel } = useDownloadExcelMutation();
--- a/src/pages/transaction/billing/list-page.tsx
+++ b/src/pages/transaction/billing/list-page.tsx
@@ -46,7 +46,7 @@ export const BillingListPage = () => {
 	useSetOnBack(() => {
 		navigate(PATHS.home);
 	});
-  useSetFooterMode(true);
+  useSetFooterMode(false);

 	const { mutateAsync: billingList } = useBillingListMutation();
 	const { mutateAsync: downloadExcel } = useDownloadExcelMutation();
--- a/src/pages/transaction/cash-receipt/list-page.tsx
+++ b/src/pages/transaction/cash-receipt/list-page.tsx
@@ -41,7 +41,7 @@ export const CashReceiptListPage = () => {
 	useSetOnBack(() => {
 		navigate(PATHS.home);
 	});
-	useSetFooterMode(true);
+	useSetFooterMode(false);

 	const { mutateAsync: cashReceiptList } = useCashReceiptListMutation();
 	const { mutateAsync: downloadExcel } = useDownloadExcelMutation();
--- a/src/pages/transaction/escrow/list-page.tsx
+++ b/src/pages/transaction/escrow/list-page.tsx
@@ -45,7 +45,7 @@ export const EscrowListPage = () => {
 	useSetOnBack(() => {
 		navigate(PATHS.home);
 	});
-  useSetFooterMode(true);
+  useSetFooterMode(false);

 	const { mutateAsync: escrowList } = useEscrowListMutation();
 	const { mutateAsync: downloadExcel } = useDownloadExcelMutation();
--- a/src/pages/vat-return/list-page.tsx
+++ b/src/pages/vat-return/list-page.tsx
@@ -19,7 +19,7 @@ export const ListPage = () => {
  
  useSetHeaderTitle('부가세 신고 자료');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/pages/vat-return/reference-page.tsx
+++ b/src/pages/vat-return/reference-page.tsx
@@ -19,7 +19,7 @@ export const ReferencePage = () => {
  
  useSetHeaderTitle('부가세 신고 자료');
  useSetHeaderType(HeaderType.LeftArrow);
-  useSetFooterMode(true);
+  useSetFooterMode(false);
  useSetOnBack(() => {
    navigate(PATHS.home);
  });
--- a/src/shared/ui/assets/css/style-fix.css
+++ b/src/shared/ui/assets/css/style-fix.css
@@ -45,6 +45,9 @@ header{
 }
 main {
  padding-top: calc(50px + env(safe-area-inset-top)) !important;
+  padding-bottom: env(safe-area-inset-bottom); 
+}
+main.home-main{
  padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important; 
 }
 .bottom-tabbar{