kyu/ga-commission-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(frontend): 09_UI_DESIGN 디자인 시스템 전체 적용

Browse Source 
테마 / 폰트 / 아이콘:
- ConfigProvider theme 토큰 30+ 추가 (브랜드 컬러, 폰트, 라운딩, 메뉴/테이블/버튼)
- Pretendard 폰트 link + index.css fontFamily 적용
- @tabler/icons-react 추가, MainLayout 에 적용

레이아웃:
- styles/variables.css 신규 (--ga-* 변수 30+)
- MainLayout: Header 48px 흰색 + bottom border, Sider 220px + 토글,
  Content 1400px 중앙 정렬, 정산월 MonthPicker, 햄버거 토글

공통 컴포넌트:
- CodeBadge: 4단계 색상 매핑 (success/info/warning/danger), 누락 코드 보강
- MoneyText: 양수 #0F6E56, 음수 #E24B4A, 0 #888 (CSS 변수 사용)
- SearchForm: 배경 #fafafa, borderRadius 8, padding 12px 16px
- DataGrid: rowHeight 36, headerHeight 38, AG_GRID_LOCALE_KO,
  합계행 getRowStyle 회색 배경 + 굵게

페이지 페이지네이션 통일:
- utils/tablePagination.ts 신규 (showTotal '총 N건', pageSizeOptions [20/50/100])
- 7개 페이지 (Agent/Contract/Recruit/Exception/Settle/Payment/User) 적용

검증: tsc -b 통과 / vite build 성공 (10s) / 백엔드 단위테스트 76건 영향 없음

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
GA Pro
2026-05-10 21:34:17 +09:00
parent 5b024d9b9c
commit 24fc187e2e
20 changed files with 330 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ga-frontend/src/pages/ledger/ExceptionLedger.tsx
+2 -1
View File
@@ -6,6 +6,7 @@ import SearchForm from '@/components/common/SearchForm';
import CodeBadge from '@/components/common/CodeBadge';
import MoneyText from '@/components/common/MoneyText';
import PermissionButton from '@/components/common/PermissionButton';
import { defaultPagination } from '@/utils/tablePagination';
import { exceptionApi, ExceptionLedgerResp } from '@/api/exceptionLedger';
export default function ExceptionLedger() {
@@ -49,8 +50,8 @@ export default function ExceptionLedger() {
size="small"
scroll={{ x: 1400 }}
pagination={{
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
showSizeChanger: true,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[
ga-frontend/src/pages/ledger/RecruitLedger.tsx
+3 -1
View File
@@ -6,6 +6,7 @@ import SearchForm from '@/components/common/SearchForm';
import MoneyText from '@/components/common/MoneyText';
import CodeBadge from '@/components/common/CodeBadge';
import ExcelExportButton from '@/components/common/ExcelExportButton';
import { defaultPagination } from '@/utils/tablePagination';
import { ledgerApi, LedgerResp, LedgerSearchParam } from '@/api/ledger';
export default function RecruitLedger() {
@@ -41,7 +42,8 @@ export default function RecruitLedger() {
size="small"
scroll={{ x: 1500 }}
pagination={{
current: param.pageNum, pageSize: param.pageSize, total: data?.total, showSizeChanger: true,
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[
ga-frontend/src/pages/org/AgentList.tsx
+2 -1
View File
@@ -8,6 +8,7 @@ import CodeBadge from '@/components/common/CodeBadge';
import MoneyText from '@/components/common/MoneyText';
import PermissionButton from '@/components/common/PermissionButton';
import ExcelExportButton from '@/components/common/ExcelExportButton';
import { defaultPagination } from '@/utils/tablePagination';
import { agentApi, AgentResp, AgentSearchParam } from '@/api/agent';
export default function AgentList() {
@@ -46,10 +47,10 @@ export default function AgentList() {
loading={isLoading}
dataSource={data?.list}
pagination={{
...defaultPagination,
current: param.pageNum,
pageSize: param.pageSize,
total: data?.total,
showSizeChanger: true,
onChange: (page, size) => setParam({ ...param, pageNum: page, pageSize: size }),
}}
onRow={(r) => ({ onClick: () => navigate(`/org/agents/${r.agentId}`) })}
ga-frontend/src/pages/product/ContractList.tsx
+3 -1
View File
@@ -5,6 +5,7 @@ import PageContainer from '@/components/common/PageContainer';
import SearchForm from '@/components/common/SearchForm';
import CodeBadge from '@/components/common/CodeBadge';
import MoneyText from '@/components/common/MoneyText';
import { defaultPagination } from '@/utils/tablePagination';
import { contractApi, ContractResp, ContractSearchParam } from '@/api/contract';
export default function ContractList() {
@@ -33,7 +34,8 @@ export default function ContractList() {
loading={isLoading}
dataSource={data?.list}
pagination={{
current: param.pageNum, pageSize: param.pageSize, total: data?.total, showSizeChanger: true,
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[
ga-frontend/src/pages/settle/PaymentList.tsx
+2 -1
View File
@@ -5,6 +5,7 @@ import PageContainer from '@/components/common/PageContainer';
import SearchForm from '@/components/common/SearchForm';
import CodeBadge from '@/components/common/CodeBadge';
import MoneyText from '@/components/common/MoneyText';
import { defaultPagination } from '@/utils/tablePagination';
import { paymentApi, PaymentResp } from '@/api/payment';
export default function PaymentList() {
@@ -34,8 +35,8 @@ export default function PaymentList() {
dataSource={data?.list}
size="small"
pagination={{
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
showSizeChanger: true,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[
ga-frontend/src/pages/settle/SettleList.tsx
+3 -1
View File
@@ -6,6 +6,7 @@ import SearchForm from '@/components/common/SearchForm';
import CodeBadge from '@/components/common/CodeBadge';
import MoneyText from '@/components/common/MoneyText';
import PermissionButton from '@/components/common/PermissionButton';
import { defaultPagination } from '@/utils/tablePagination';
import { settleApi, SettleResp, SettleSearchParam } from '@/api/settle';
export default function SettleList() {
@@ -67,7 +68,8 @@ export default function SettleList() {
size="small"
scroll={{ x: 1600 }}
pagination={{
current: param.pageNum, pageSize: param.pageSize, total: data?.total, showSizeChanger: true,
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[
ga-frontend/src/pages/system/UserList.tsx
+3 -1
View File
@@ -5,6 +5,7 @@ import PageContainer from '@/components/common/PageContainer';
import SearchForm from '@/components/common/SearchForm';
import CodeBadge from '@/components/common/CodeBadge';
import PermissionButton from '@/components/common/PermissionButton';
import { defaultPagination } from '@/utils/tablePagination';
import { userApi, UserResp } from '@/api/user';
export default function UserList() {
@@ -49,7 +50,8 @@ export default function UserList() {
loading={isLoading}
dataSource={data?.list}
pagination={{
current: param.pageNum, pageSize: param.pageSize, total: data?.total, showSizeChanger: true,
...defaultPagination,
current: param.pageNum, pageSize: param.pageSize, total: data?.total,
onChange: (p, s) => setParam({ ...param, pageNum: p, pageSize: s }),
}}
columns={[