From da9b16f012136e9309370a8eaff7753df5eccfc3 Mon Sep 17 00:00:00 2001
From: chpark <chpark@wace.me>
Date: Fri, 8 May 2026 01:07:34 +0900
Subject: [PATCH] =?UTF-8?q?fix(=ED=92=88=EB=AA=A9=20=EC=B6=94=EA=B0=80=20?=
 =?UTF-8?q?=EB=AA=A8=EB=8B=AC):=20=EC=B2=B4=ED=81=AC=EB=B0=95=EC=8A=A4=20?=
 =?UTF-8?q?=EC=84=A0=ED=83=9D=20=EC=95=88=EB=90=98=EB=8D=98=20=EB=AC=B8?=
 =?UTF-8?q?=EC=A0=9C=20+=20=EC=86=90=EB=AA=A8=EC=96=91=20=EC=BB=A4?=
 =?UTF-8?q?=EC=84=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

증상: 품목 추가 모달에서 행 클릭과 체크박스 클릭 둘 다 toggle 호출 →
       두 번 발생해서 체크 상태가 변하지 않음.
수정:
- 체크박스 td 에 stopPropagation 추가 (행 onClick 으로 버블되지 않게)
- 행 클릭은 그대로 행 전체 토글로 동작
- 체크박스 명시 cursor:pointer + 크기 18px + 색상 accent-emerald-600
- select-none 추가 (드래그 시 글자 선택 방지)
- 헤더 전체선택 체크박스도 동일 처리

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/app/(main)/m/admin/procurements/page.tsx | 21 +++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/app/(main)/m/admin/procurements/page.tsx b/src/app/(main)/m/admin/procurements/page.tsx
index 2618825..7c709c2 100644
--- a/src/app/(main)/m/admin/procurements/page.tsx
+++ b/src/app/(main)/m/admin/procurements/page.tsx
@@ -561,9 +561,13 @@ function ItemPicker({ vendorObjid, existingItemIds, onClose, onAddItems }: {
             <thead className="bg-slate-50 sticky top-0">
               <tr>
                 <th className="px-2 py-2 w-10">
-                  <input type="checkbox" onChange={toggleAll}
+                  <input
+                    type="checkbox"
+                    onChange={toggleAll}
                     checked={filtered.length > 0 && filtered.every((it) => selected.has(it.OBJID))}
-                    className="cursor-pointer" />
+                    style={{ cursor: "pointer", width: 18, height: 18 }}
+                    className="accent-emerald-600"
+                  />
                 </th>
                 <th className="text-left px-2 py-2">품목명</th>
                 <th className="text-left px-2 py-2">공급업체</th>
@@ -579,9 +583,16 @@ function ItemPicker({ vendorObjid, existingItemIds, onClose, onAddItems }: {
               ) : filtered.map((it) => (
                 <tr key={it.OBJID}
                     onClick={() => toggle(it.OBJID)}
-                    className={`border-t border-slate-100 cursor-pointer ${selected.has(it.OBJID) ? "bg-emerald-50" : "hover:bg-slate-50"}`}>
-                  <td className="px-2 py-1.5 text-center">
-                    <input type="checkbox" checked={selected.has(it.OBJID)} onChange={() => toggle(it.OBJID)} />
+                    style={{ cursor: "pointer" }}
+                    className={`border-t border-slate-100 select-none ${selected.has(it.OBJID) ? "bg-emerald-50" : "hover:bg-slate-50"}`}>
+                  <td className="px-2 py-1.5 text-center" onClick={(e) => e.stopPropagation()}>
+                    <input
+                      type="checkbox"
+                      checked={selected.has(it.OBJID)}
+                      onChange={() => toggle(it.OBJID)}
+                      style={{ cursor: "pointer", width: 18, height: 18 }}
+                      className="accent-emerald-600"
+                    />
                   </td>
                   <td className="px-2 py-1.5">
                     <div className="font-semibold">{it.ITEM_NAME}</div>