refactor: 리스트 페이지 UI 레이아웃 통일

- 헤더 버튼 우측 정렬 (ml-auto 적용)
  - ItemListClient, StockStatusList, ShipmentList
  - WorkOrderList, InspectionList
- 헤더 버튼 위치 변경 (타이틀 아래 별도 행으로 이동)
  - LeavePolicyManagement (휴가관리)
  - CompanyInfoManagement (회사정보)
  - SubscriptionManagement (구독관리)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
byeongcheolryu
2025-12-24 11:30:40 +09:00
parent 402499718b
commit d5f758f1eb
8 changed files with 42 additions and 43 deletions

View File

@@ -451,7 +451,7 @@ export default function ItemListClient() {
// 헤더 액션 (검색 중 로딩 + 품목 등록 버튼)
const headerActions = (
<div className="flex items-center gap-2">
<div className="flex items-center gap-2 ml-auto">
{isSearching && (
<div className="flex items-center gap-2 text-muted-foreground">
<Loader2 className="h-4 w-4 animate-spin" />

View File

@@ -296,7 +296,7 @@ export function StockStatusList() {
// 헤더 액션
const headerActions = (
<Button variant="outline" onClick={handleExcelDownload}>
<Button variant="outline" className="ml-auto" onClick={handleExcelDownload}>
<Download className="w-4 h-4 mr-1.5" />
</Button>

View File

@@ -294,7 +294,7 @@ export function ShipmentList() {
// 헤더 액션
const headerActions = (
<Button onClick={handleCreate}>
<Button className="ml-auto" onClick={handleCreate}>
<Plus className="w-4 h-4 mr-2" />
</Button>

View File

@@ -275,7 +275,7 @@ export function WorkOrderList() {
// 헤더 액션
const headerActions = (
<Button onClick={handleCreate}>
<Button className="ml-auto" onClick={handleCreate}>
<Plus className="w-4 h-4 mr-1.5" />
</Button>

View File

@@ -251,7 +251,7 @@ export function InspectionList() {
// 헤더 액션
const headerActions = (
<Button onClick={handleCreate}>
<Button className="ml-auto" onClick={handleCreate}>
<Plus className="w-4 h-4 mr-1.5" />
</Button>

View File

@@ -129,30 +129,27 @@ export function CompanyInfoManagement() {
setIsEditMode(false);
};
// 헤더 액션 버튼
const headerActions = (
<div className="flex items-center gap-2">
<Button onClick={() => setShowAddDialog(true)}>
<Plus className="w-4 h-4 mr-2" />
</Button>
{!isEditMode && (
<Button variant="outline" onClick={() => setIsEditMode(true)}>
</Button>
)}
</div>
);
return (
<PageLayout>
<PageHeader
title="회사정보"
description="회사 정보를 관리합니다"
icon={Building2}
actions={headerActions}
/>
{/* 헤더 액션 버튼 */}
<div className="flex justify-end gap-2 mb-4">
<Button onClick={() => setShowAddDialog(true)}>
<Plus className="w-4 h-4 mr-2" />
</Button>
{!isEditMode && (
<Button variant="outline" onClick={() => setIsEditMode(true)}>
</Button>
)}
</div>
<div className="space-y-6">
{/* 회사 정보 섹션 */}
<Card>

View File

@@ -51,13 +51,15 @@ export function LeavePolicyManagement() {
return (
<PageLayout>
{/* 헤더 + 저장 버튼 */}
<div className="flex items-start justify-between">
<PageHeader
title="휴가관리"
description="휴가 항목을 관리합니다"
icon={CalendarDays}
/>
{/* 헤더 */}
<PageHeader
title="휴가관리"
description="휴가 항목을 관리합니다"
icon={CalendarDays}
/>
{/* 저장 버튼 */}
<div className="flex justify-end mb-4">
<Button onClick={handleSave}>
</Button>

View File

@@ -77,23 +77,23 @@ export function SubscriptionManagement() {
title="구독관리"
description="구독 정보를 관리합니다"
icon={CreditCard}
actions={
<div className="flex items-center gap-2">
<Button variant="outline" onClick={handleExportData}>
<Download className="w-4 h-4 mr-2" />
</Button>
<Button
variant="outline"
className="border-red-200 text-red-600 hover:bg-red-50 hover:border-red-300"
onClick={() => setShowCancelDialog(true)}
>
</Button>
</div>
}
/>
{/* ===== 헤더 액션 버튼 ===== */}
<div className="flex justify-end gap-2 mb-4">
<Button variant="outline" onClick={handleExportData}>
<Download className="w-4 h-4 mr-2" />
</Button>
<Button
variant="outline"
className="border-red-200 text-red-600 hover:bg-red-50 hover:border-red-300"
onClick={() => setShowCancelDialog(true)}
>
</Button>
</div>
<div className="space-y-6">
{/* ===== 구독 정보 카드 영역 ===== */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">