지급 대행

This commit is contained in:
focp212@naver.com
2025-09-09 11:07:45 +09:00
parent 337ac1bf97
commit 3cfc45a244
5 changed files with 274 additions and 4 deletions

View File

@@ -1,8 +1,161 @@
export const SettlementAgencyDetailPage = () => {
import { useState } from 'react';
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { IMAGE_ROOT } from '@/shared/constants/common';
import { SettlementAgencyBottomAgree } from '@/entities/additional-service/ui/settlement-agency-bottom-agree';
import { HeaderType } from '@/entities/common/model/types';
import {
useSetHeaderTitle,
useSetHeaderType,
useSetFooterMode,
useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout';
export const SettlementAgencyDetailPage = () => {
const { navigate } = useNavigate();
const [bottomAgreeOn, setBottomAgreeOn] = useState<boolean>(false);
useSetHeaderTitle('정산대행');
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
useSetOnBack(() => {
navigate(PATHS.additionalService.settlementAgency.manage);
});
const oncClickToOpenBottomAgree = () => {
setBottomAgreeOn(true);
};
return (
<>
<main className="full-height">
<div className="tab-content">
<div className="tab-pane sub active">
<div className="pay-top">
<div className="num-amount">
<span className="amount">100,000,000</span>
</div>
<div className="num-store"></div>
<div className="num-day">2025.08.19</div>
<div className="receipt-row">
<button type="button" className="receipt-btn">
<span className="icon-24 download"></span>
<span></span>
</button>
</div>
</div>
<div className="detail-divider"></div>
<div className="pay-detail">
<div className="detail-title"> </div>
<ul className="kv-list">
<li className="kv-row">
<span className="k">ID</span>
<span className="v">AB25061012</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="v">2025.06.08</span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v"></span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v">105,000,000 </span>
</li>
<li className="kv-row bolder">
<span className="k"></span>
<span className="v">100,000,000</span>
</li>
</ul>
<div className="detail-divider"></div>
<div className="detail-title"> </div>
<ul className="kv-list">
<li className="kv-row">
<span className="k"> ID</span>
<span className="v">BACK01</span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v">3</span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v">123456789</span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v">3%, </span>
</li>
<li className="kv-row">
<span className="k"> </span>
<span className="v">, </span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="v"></span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="v">110-12-12-11111</span>
</li>
</ul>
<div className="detail-divider"></div>
<div className="detail-title summary-amount divTop">
<span className="amount-text states-17"> </span>
<button>
<img
src={ IMAGE_ROOT + '/ico_divTop_arrow.svg' }
alt="화살표"
/>
</button>
</div>
<div className="sd-history">
<div className="sd-history-item">
<div className="left">
<div className="name"></div>
<div className="time">2025/04/15 10:00:00</div>
</div>
<div className="right">
<div className="reason">사유 : 지급 </div>
</div>
</div>
<div className="sd-history-item">
<div className="left">
<div className="name"></div>
<div className="time">2025/04/10 10:00:00</div>
</div>
<div className="right">
<div className="reason">-</div>
</div>
</div>
<div className="sd-history-item">
<div className="left">
<div className="name"> </div>
<div className="time">2025/04/06 10:00:00</div>
</div>
<div className="right">
<div className="reason">-</div>
</div>
</div>
</div>
<div className="apply-row">
<button
className="btn-50 btn-blue flex-1"
onClick={ () => oncClickToOpenBottomAgree() }
> /</button>
</div>
</div>
</div>
</div>
</main>
<SettlementAgencyBottomAgree
bottomAgreeOn={ bottomAgreeOn }
setBottomAgreeOn={ setBottomAgreeOn }
></SettlementAgencyBottomAgree>
</>
);
};

View File

@@ -19,7 +19,7 @@ export const SettlementAgencyManagePage = () => {
useSetHeaderTitle('정산대행');
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(true);
useSetFooterMode(false);
useSetOnBack(() => {
navigate(PATHS.home);
});