diff --git a/frontend/components/report/designer/ReportDesignerToolbar.tsx b/frontend/components/report/designer/ReportDesignerToolbar.tsx
index ebb7c7cb..1ec55145 100644
--- a/frontend/components/report/designer/ReportDesignerToolbar.tsx
+++ b/frontend/components/report/designer/ReportDesignerToolbar.tsx
@@ -1,10 +1,38 @@
"use client";
import { Button } from "@/components/ui/button";
-import { Save, Eye, RotateCcw, ArrowLeft, Loader2, BookTemplate, Grid3x3, Undo2, Redo2 } from "lucide-react";
+import {
+ Save,
+ Eye,
+ RotateCcw,
+ ArrowLeft,
+ Loader2,
+ BookTemplate,
+ Grid3x3,
+ Undo2,
+ Redo2,
+ AlignLeft,
+ AlignRight,
+ AlignVerticalJustifyStart,
+ AlignVerticalJustifyEnd,
+ AlignCenterHorizontal,
+ AlignCenterVertical,
+ AlignHorizontalDistributeCenter,
+ AlignVerticalDistributeCenter,
+ RectangleHorizontal,
+ RectangleVertical,
+ Square,
+} from "lucide-react";
import { useRouter } from "next/navigation";
import { useReportDesigner } from "@/contexts/ReportDesignerContext";
import { useState } from "react";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
import { SaveAsTemplateModal } from "./SaveAsTemplateModal";
import { reportApi } from "@/lib/api/reportApi";
@@ -30,11 +58,27 @@ export function ReportDesignerToolbar() {
redo,
canUndo,
canRedo,
+ selectedComponentIds,
+ alignLeft,
+ alignRight,
+ alignTop,
+ alignBottom,
+ alignCenterHorizontal,
+ alignCenterVertical,
+ distributeHorizontal,
+ distributeVertical,
+ makeSameWidth,
+ makeSameHeight,
+ makeSameSize,
} = useReportDesigner();
const [showPreview, setShowPreview] = useState(false);
const [showSaveAsTemplate, setShowSaveAsTemplate] = useState(false);
const { toast } = useToast();
+ // 정렬 버튼 활성화 조건
+ const canAlign = selectedComponentIds && selectedComponentIds.length >= 2;
+ const canDistribute = selectedComponentIds && selectedComponentIds.length >= 3;
+
// 템플릿 저장 가능 여부: 컴포넌트가 있어야 함
const canSaveAsTemplate = components.length > 0;
@@ -173,6 +217,105 @@ export function ReportDesignerToolbar() {
>
+
+ {/* 정렬 드롭다운 */}
+
+
+
+
+
+
+
+ 왼쪽 정렬
+
+
+
+ 오른쪽 정렬
+
+
+
+ 위쪽 정렬
+
+
+
+ 아래쪽 정렬
+
+
+
+
+ 가로 중앙 정렬
+
+
+
+ 세로 중앙 정렬
+
+
+
+
+ {/* 배치 드롭다운 */}
+
+
+
+
+
+
+
+ 가로 균등 배치
+
+
+
+ 세로 균등 배치
+
+
+
+
+ {/* 크기 조정 드롭다운 */}
+
+
+
+
+
+
+
+ 같은 너비로
+
+
+
+ 같은 높이로
+
+
+
+ 같은 크기로
+
+
+