fix:모달 닫기 버튼에 이벤트 델리게이션 적용

- data-close-modal 속성으로 닫기 버튼 식별
- 부모 요소에서 클릭 이벤트 감지하여 모달 닫기

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
pro
2026-01-29 21:38:54 +09:00
parent 27b4295224
commit d4a6b042ef
3 changed files with 11 additions and 4 deletions

View File

@@ -305,5 +305,12 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none foc
closePartnerModal();
}
});
// 이벤트 델리게이션: data-close-modal 속성을 가진 요소 클릭 시 모달 닫기
document.getElementById('partnerModal').addEventListener('click', function(e) {
if (e.target.closest('[data-close-modal]')) {
closePartnerModal();
}
});
</script>
@endpush

View File

@@ -6,7 +6,7 @@
<h2 class="text-xl font-bold text-gray-800">영업파트너 수정</h2>
<p class="text-sm text-gray-500 mt-1">{{ $partner->name }} ({{ $partner->email }})</p>
</div>
<button type="button" onclick="closePartnerModal()" class="text-gray-400 hover:text-gray-600">
<button type="button" data-close-modal class="text-gray-400 hover:text-gray-600">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
@@ -135,7 +135,7 @@ class="mt-3 text-sm text-blue-600 hover:text-blue-800 flex items-center gap-1">
<!-- 푸터 버튼 -->
<div class="flex justify-end gap-3">
<button type="button" onclick="closePartnerModal()"
<button type="button" data-close-modal
class="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition text-sm">
취소
</button>

View File

@@ -30,7 +30,7 @@
</span>
</div>
</div>
<button type="button" onclick="closePartnerModal()" class="text-gray-400 hover:text-gray-600">
<button type="button" data-close-modal class="text-gray-400 hover:text-gray-600">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
@@ -269,7 +269,7 @@ class="text-xs text-blue-600 hover:underline">다운로드</a>
<!-- 푸터 버튼 -->
<div class="mt-6 flex justify-end gap-3">
<button type="button" onclick="closePartnerModal()"
<button type="button" data-close-modal
class="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition text-sm">
닫기
</button>