diff --git a/adminforth/spa/src/components/ResourceListTable.vue b/adminforth/spa/src/components/ResourceListTable.vue index 793205720..2217efe86 100644 --- a/adminforth/spa/src/components/ResourceListTable.vue +++ b/adminforth/spa/src/components/ResourceListTable.vue @@ -227,7 +227,8 @@ contenteditable="true" class="min-w-10 outline-none inline-block w-auto min-w-10 py-1.5 px-3 text-sm text-center text-gray-700 border border-gray-300 dark:border-gray-700 dark:text-gray-400 dark:bg-gray-800 z-10" @keydown="onPageKeydown($event)" - @input="page = parseInt($event.target.innerText) || ''" + @input="onPageInput($event)" + @blur="validatePageInput()" > {{ pageInput }} @@ -355,6 +356,10 @@ async function onPageKeydown(event) { (!['Backspace', 'ArrowRight', 'ArrowLeft'].includes(event.code) && isNaN(String.fromCharCode(event.keyCode)))) { event.preventDefault(); + if (event.code === 'Enter') { + validatePageInput(); + event.target.blur(); + } } } @@ -575,6 +580,16 @@ async function startCustomAction(actionId, row) { } } +function onPageInput(event) { + pageInput.value = event.target.innerText; +} + +function validatePageInput() { + const newPage = parseInt(pageInput.value) || 1; + const validPage = Math.max(1, Math.min(newPage, totalPages.value)); + page.value = validPage; + pageInput.value = validPage.toString(); +}