fix:서브탭 간 체크박스 선택 격리 처리

전체선택 시 현재 서브탭의 체크박스만 선택되도록 수정.
서브탭 전환 시 기존 선택 초기화.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
김보곤
2026-02-19 18:39:14 +09:00
parent a4e7740379
commit eab6f09b5d

View File

@@ -76,12 +76,12 @@ class="border-b-2 py-3 px-4 text-sm font-medium whitespace-nowrap transition-col
{{-- 서브탭 --}}
<div class="flex items-center gap-2 mb-4">
<div class="inline-flex rounded-lg bg-gray-100 p-1">
<button @click="commissionSubTab = 'partner'"
<button @click="commissionSubTab = 'partner'; clearAllCheckboxes()"
:class="commissionSubTab === 'partner' ? 'bg-white text-indigo-600 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
class="px-4 py-1.5 text-sm font-medium rounded-md transition-all">
영업파트너 수당
</button>
<button @click="commissionSubTab = 'manager'"
<button @click="commissionSubTab = 'manager'; clearAllCheckboxes()"
:class="commissionSubTab === 'manager' ? 'bg-white text-indigo-600 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
class="px-4 py-1.5 text-sm font-medium rounded-md transition-all">
매니저 수당
@@ -173,9 +173,25 @@ class="px-4 py-1.5 text-sm font-medium rounded-md transition-all">
<script>
let selectedIds = [];
function clearAllCheckboxes() {
document.querySelectorAll('.commission-checkbox').forEach(cb => { cb.checked = false; });
document.querySelectorAll('thead input[type="checkbox"]').forEach(cb => { cb.checked = false; });
selectedIds = [];
document.getElementById('bulk-actions').style.display = 'none';
}
function getActiveSubtabContainer() {
const subTab = document.querySelector('[x-data]').__x.$data.commissionSubTab;
return subTab === 'manager'
? document.querySelector('[x-show="commissionSubTab === \'manager\'"]')
: document.querySelector('[x-show="commissionSubTab === \'partner\'"]');
}
function updateSelection() {
selectedIds = Array.from(document.querySelectorAll('.commission-checkbox:checked'))
.map(cb => parseInt(cb.value));
const container = getActiveSubtabContainer();
selectedIds = container
? Array.from(container.querySelectorAll('.commission-checkbox:checked')).map(cb => parseInt(cb.value))
: [];
const bulkActions = document.getElementById('bulk-actions');
const selectedCount = document.getElementById('selected-count');
@@ -189,8 +205,8 @@ function updateSelection() {
}
function toggleSelectAll(checkbox) {
const checkboxes = document.querySelectorAll('.commission-checkbox');
checkboxes.forEach(cb => { cb.checked = checkbox.checked; });
const container = checkbox.closest('.bg-white.rounded-lg');
container.querySelectorAll('.commission-checkbox').forEach(cb => { cb.checked = checkbox.checked; });
updateSelection();
}