(김준회) 벤더풀&AVL 구매 추가요청사항 반영

1 files changed, 37 insertions, 21 deletions

diff --git a/components/data-table/editable-cell.tsx b/components/data-table/editable-cell.tsx
index 05f5c4cb..aa43606e 100644
--- a/components/data-table/editable-cell.tsx
+++ b/components/data-table/editable-cell.tsx
@@ -59,13 +59,6 @@ export function EditableCell<T = any>({
   const [isEditing, setIsEditing] = React.useState(initialEditMode)
   const [editValue, setEditValue] = React.useState<T>(value)
   const [error, setError] = React.useState<string | null>(null)
-  const handleStartEdit = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation()
-    if (disabled) return
-    setIsEditing(true)
-    setEditValue(value)
-    setError(null)
-  }, [disabled, value])
 
   const handleFinishEdit = useCallback((overrideValue?: T) => {
     const currentValue = overrideValue !== undefined ? overrideValue : editValue
@@ -88,6 +81,35 @@ export function EditableCell<T = any>({
     setError(null)
   }, [editValue, validation, value, onSave])
 
+  const handleCheckboxChange = useCallback((checked: boolean) => {
+    const convertedValue = checked as T
+    setEditValue(convertedValue)
+    if (autoSave) {
+      // 체크박스 변경 시 자동 저장 - 값 직접 전달
+      handleFinishEdit(convertedValue)
+    } else {
+      // 일괄 저장 모드에서는 실시간 표시를 위해 즉시 onSave 호출
+      onSave(convertedValue)
+    }
+  }, [autoSave, handleFinishEdit, onSave])
+
+  const handleStartEdit = useCallback((e: React.MouseEvent) => {
+    e.stopPropagation()
+    if (disabled) return
+
+    // 체크박스의 경우 즉시 토글
+    if (type === "checkbox") {
+      // T가 boolean이라고 가정
+      const newValue = !value
+      handleCheckboxChange(!!newValue)
+      return
+    }
+
+    setIsEditing(true)
+    setEditValue(value)
+    setError(null)
+  }, [disabled, value, type, handleCheckboxChange])
+
   const handleCancelEdit = useCallback(() => {
     // 취소 시 원래 값으로 복원하되, pendingChanges에서도 제거
     onCancel?.()
@@ -165,18 +187,6 @@ export function EditableCell<T = any>({
     }
   }, [type, value, autoSave, onSave, onChange])
 
-  const handleCheckboxChange = useCallback((checked: boolean) => {
-    const convertedValue = checked as T
-    setEditValue(convertedValue)
-    if (autoSave) {
-      // 체크박스 변경 시 자동 저장 - 값 직접 전달
-      handleFinishEdit(convertedValue)
-    } else {
-      // 일괄 저장 모드에서는 실시간 표시를 위해 즉시 onSave 호출
-      onSave(convertedValue)
-    }
-  }, [autoSave, handleFinishEdit, onSave])
-
   // 읽기 전용 모드
   if (!isEditing) {
     return (
@@ -192,7 +202,13 @@ export function EditableCell<T = any>({
       >
         <div className="flex-1 truncate">
           {type === "checkbox" ? (
-            <Checkbox checked={!!value} disabled />
+            <div onClick={(e) => e.stopPropagation()}>
+              <Checkbox
+                checked={!!value}
+                onCheckedChange={handleCheckboxChange}
+                disabled={disabled}
+              />
+            </div>
           ) : (
             <span className={cn(
               "block truncate",
@@ -207,7 +223,7 @@ export function EditableCell<T = any>({
             </span>
           )}
         </div>
-        {!disabled && (
+        {!disabled && type !== "checkbox" && (
           <Edit2 className="w-4 h-4 opacity-0 group-hover:opacity-50 transition-opacity flex-shrink-0 ml-2" />
         )}
       </div>