From 2cf241236e938b39ee6124989d5f79252f4af573 Mon Sep 17 00:00:00 2001
From: bicochan <chanii8@naver.com>
Date: Tue, 17 Mar 2026 09:29:01 +0900
Subject: [PATCH] =?UTF-8?q?[st]=20design:=20=EA=B2=80=EC=A6=9D=20=ED=95=AD?=
 =?UTF-8?q?=EB=AA=A9=20=EB=93=B1=EB=A1=9D=20=EB=8B=A4=EC=9D=B4=EC=96=BC?=
 =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20ui=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../verification/VerificationTargetDialog.tsx | 34 +++++++++++--------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/apps/st/src/components/statistics/verification/VerificationTargetDialog.tsx b/apps/st/src/components/statistics/verification/VerificationTargetDialog.tsx
index c6898e8a0..ce9b1d26e 100644
--- a/apps/st/src/components/statistics/verification/VerificationTargetDialog.tsx
+++ b/apps/st/src/components/statistics/verification/VerificationTargetDialog.tsx
@@ -7,11 +7,11 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { Search } from "lucide-react";
 
 import { CodeSelect } from "@/entities/code/ui/code-select";
+import { verificationTargetManagementApi } from "@/entities/statistics/api/verification-target-management-service";
 import type {
     NumericColumnDto,
     VerificationTargetManagementResponse,
 } from "@/entities/statistics/model/verification-target-management-interface";
-import { verificationTargetManagementApi } from "@/entities/statistics/api/verification-target-management-service";
 import {
     type VerificationTargetManagementFormData,
     verificationTargetManagementSchema,
@@ -51,7 +51,7 @@ export function VerificationTargetDialog({
     onSave,
     onDelete,
 }: VerificationTargetDialogProps) {
-    const { control, handleSubmit, reset, getValues, setValue } =
+    const { control, handleSubmit, reset, watch, getValues, setValue } =
         useForm<VerificationTargetManagementFormData>({
             resolver: zodResolver(verificationTargetManagementSchema),
             defaultValues: data || {
@@ -65,6 +65,7 @@ export function VerificationTargetDialog({
                 useYn: "Y",
             },
         });
+    const watchStatsCd = watch("statsCd");
 
     const [isColumnDialogOpen, setIsColumnDialogOpen] = useState(false);
     const [numericColumns, setNumericColumns] = useState<NumericColumnDto[]>(
@@ -103,7 +104,8 @@ export function VerificationTargetDialog({
         }
     }
 
-    async function handleSearchTableMetadata() {
+    async function handleSearchTableMetadata(e?: React.MouseEvent) {
+        e?.preventDefault();
         const statsCd = getValues("statsCd");
         if (!statsCd) {
             alert("통계항목을 선택해주세요.");
@@ -131,7 +133,8 @@ export function VerificationTargetDialog({
         }
     }
 
-    function handleOpenColumnDialog() {
+    function handleOpenColumnDialog(e?: React.MouseEvent) {
+        e?.preventDefault();
         if (numericColumns.length === 0) {
             handleSearchTableMetadata();
         } else {
@@ -156,6 +159,12 @@ export function VerificationTargetDialog({
 
                     <form onSubmit={handleSubmit(onSubmit)}>
                         <Table variant="secondary">
+                            <colgroup>
+                                <col style={{ width: "20%" }} />
+                                <col style={{ width: "30%" }} />
+                                <col style={{ width: "20%" }} />
+                                <col style={{ width: "30%" }} />
+                            </colgroup>
                             <TableBody>
                                 <TableRow>
                                     <TableHead
@@ -182,15 +191,12 @@ export function VerificationTargetDialog({
                                                 )}
                                             />
                                             <Button
-                                                type="button"
-                                                color="gray"
-                                                variant="outline"
+                                                className="px-4"
                                                 onClick={
                                                     handleSearchTableMetadata
                                                 }
-                                                className="px-3"
+                                                disabled={!watchStatsCd}
                                             >
-                                                <Search className="mr-1 h-4 w-4" />
                                                 조회
                                             </Button>
                                         </div>
@@ -280,10 +286,10 @@ export function VerificationTargetDialog({
                                                 )}
                                             />
                                             <Button
-                                                type="button"
-                                                variant="outline"
-                                                className="whitespace-nowrap px-3"
+                                                color="white"
+                                                className="whitespace-nowrap px-4"
                                                 onClick={handleOpenColumnDialog}
+                                                disabled={!watchStatsCd}
                                             >
                                                 목록보기
                                             </Button>
@@ -542,16 +548,14 @@ export function VerificationTargetDialog({
                                             </TableCell>
                                             <TableCell className="text-center">
                                                 <Button
-                                                    type="button"
                                                     size="sm"
-                                                    variant="outline"
                                                     onClick={() =>
                                                         handleSelectColumn(
                                                             col.columnName,
                                                         )
                                                     }
                                                 >
-                                                    입력
+                                                    입력하기
                                                 </Button>
                                             </TableCell>
                                         </TableRow>