fix(cupang): 센터 분배 드래그 실패 지점 제거·센터 목록 가나다 정렬
드래그가 브라우저에서 먹지 않던 문제를 추정 대신 실패 가능 지점별로 전부 막았다. - dragstart 리스너를 카드 요소에 직접 바인딩(위임으로는 잡히지 않는 환경 대비). 렌더할 때마다 다시 바인딩한다. - dragenter/dragover 를 모두 preventDefault — 하나만 막으면 드롭을 거부하는 브라우저가 있다. - 드롭 대상 범위를 ③ 카드 전체로 확대하고, 대상 패널은 closest → elementFromPoint → (센터가 하나면) 그 센터 순으로 찾는다. 패널 사이 여백에 놓아도 담긴다. - dataTransfer.setData/getData 가 막힌 환경 대비로 dragKey 를 따로 보관해 드롭 시 사용한다. 그래도 못 읽으면 클릭으로 담으라는 안내를 띄운다. - 드래그 중에는 ③ 영역에 점선 강조를 준다. - 드래그 직후 발생하는 click 은 무시해 대화상자가 두 번 뜨지 않게 한다. 센터 선택 목록은 이름 가나다순 정렬(한글 음절은 코드포인트 순). tests/js: 여백 드롭·dragenter·setData 차단 환경 시나리오 추가. 전체 통과. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -675,3 +675,7 @@
|
||||
.cpg-dlg-item { margin: 0; font-weight: 600; }
|
||||
.cpg-dlg-actions { margin: 4px 0 0; flex-wrap: wrap; }
|
||||
.cpg-modal-box .erp-input, .cpg-modal-box .erp-select { width: 100%; min-width: 0; }
|
||||
|
||||
/* 드래그 중일 때 ③ 영역을 강조 — 어디에 놓아야 하는지 보이게 */
|
||||
.cpg-dist-card.is-drop-ready { outline: 2px dashed var(--color-rich-black); outline-offset: 2px; }
|
||||
.cpg-dist-card.is-drop-ready .cpg-dist-center { border-color: var(--color-midtone-gray); }
|
||||
|
||||
Reference in New Issue
Block a user