Add dynamic scrolling to consultant linked clients

This commit is contained in:
A R R R Associates
2026-07-31 13:48:28 +05:30
parent a40f9af975
commit db23d28346
@@ -49,9 +49,9 @@
</div> </div>
</div> </div>
<div class="mt-5 overflow-x-auto rounded-2xl border border-slate-200"> <div id="linked-client-scroll-container" class="mt-5 max-h-[540px] overflow-auto rounded-2xl border border-slate-200">
<table class="min-w-full divide-y divide-slate-200 text-left"> <table class="min-w-full divide-y divide-slate-200 text-left">
<thead class="bg-slate-50"> <thead class="sticky top-0 z-10 bg-slate-50 shadow-sm">
<tr class="text-xs font-semibold uppercase tracking-wide text-slate-500"> <tr class="text-xs font-semibold uppercase tracking-wide text-slate-500">
<th class="whitespace-nowrap px-4 py-3">Code</th> <th class="whitespace-nowrap px-4 py-3">Code</th>
<th class="min-w-[300px] px-4 py-3">Client Name</th> <th class="min-w-[300px] px-4 py-3">Client Name</th>
@@ -136,6 +136,7 @@
const body = document.getElementById('linked-client-table-body'); const body = document.getElementById('linked-client-table-body');
const count = document.getElementById('linked-client-count'); const count = document.getElementById('linked-client-count');
const empty = document.getElementById('linked-client-empty-row'); const empty = document.getElementById('linked-client-empty-row');
const scrollContainer = document.getElementById('linked-client-scroll-container');
const rows = Array.from(body.querySelectorAll('.linked-client-row')); const rows = Array.from(body.querySelectorAll('.linked-client-row'));
let timer = null; let timer = null;
@@ -185,6 +186,7 @@
empty.classList.toggle('hidden', visible.length !== 0); empty.classList.toggle('hidden', visible.length !== 0);
count.textContent = `${visible.length} client${visible.length === 1 ? '' : 's'}`; count.textContent = `${visible.length} client${visible.length === 1 ? '' : 's'}`;
if (scrollContainer) scrollContainer.scrollTop = 0;
} }
search.addEventListener('input', () => { search.addEventListener('input', () => {