diff --git a/admin_ui/src/components/Pagination.vue b/admin_ui/src/components/Pagination.vue index dc665738..555be948 100644 --- a/admin_ui/src/components/Pagination.vue +++ b/admin_ui/src/components/Pagination.vue @@ -1,23 +1,33 @@ @@ -30,7 +40,7 @@ export default defineComponent({ }, data() { return { - pageDropdownValue: 0 + pageInput: 1 } }, computed: { @@ -44,32 +54,56 @@ export default defineComponent({ const count = Math.ceil(this.rowCount / this.pageSize) return count < 1 ? 1 : count }, - currentTableName() { - return this.$store.state.currentTableName + currentPageNumber() { + return this.$store.state.currentPageNumber || 1 }, - filterParams() { - return this.$store.state.filterParams + + prevPages(): number[] { + const start = Math.max(1, this.currentPageNumber - 1) + const end = this.currentPageNumber - 1 + return this.range(start, end) }, - currentPageNumber() { - return this.$store.state.currentPageNumber + + nextPages(): number[] { + const start = this.currentPageNumber + 1 + const end = Math.min(this.pageCount, this.currentPageNumber + 1) + return this.range(start, end) } }, methods: { - async changePage(pageNumber: number) { - if (this.currentPageNumber != pageNumber) { - console.log("Navigating to " + pageNumber) - this.$store.commit("updateCurrentPageNumber", pageNumber) - await this.$store.dispatch("fetchRows") - } + range(start: number, end: number): number[] { + if (start > end) return [] + // return rows for correct page + return Array.from({ length: end - start + 1 }, (_, i) => start + i) + }, + + async changePage(page: number) { + // return first or last page + if (page < 1 || page > this.pageCount) return + // return current page + if (page === this.currentPageNumber) return + + this.$store.commit("updateCurrentPageNumber", page) + await this.$store.dispatch("fetchRows") + }, + + async goToPage() { + let page = this.pageInput + + if (!page || page < 1) page = 1 + if (page > this.pageCount) page = this.pageCount + + this.pageInput = page + await this.changePage(page) } }, watch: { - pageDropdownValue(value) { - this.changePage(value) + currentPageNumber(value: number) { + this.pageInput = value } }, mounted() { - this.pageDropdownValue = this.currentPageNumber + this.pageInput = this.currentPageNumber } }) @@ -80,11 +114,10 @@ export default defineComponent({ div#pagination { ul.pages { list-style: none; - margin: 0.5rem 0; + margin: 0.3rem 0; padding: 0; li { - border: 1px solid rgba(255, 255, 255, 0.2); display: inline-block; font-size: 0.8rem; margin-bottom: 0.5rem; @@ -109,21 +142,20 @@ div#pagination { } } } + span.count { + padding-right: 0.5rem; + } + input { + text-align: center; + } +} - div.page_select { - select, - label { - display: inline-block; - } - - label { - font-size: 0.9rem; - margin-right: 1rem; - } - - select { - width: auto; - padding-right: 1.5rem; +@media (max-width: 480px) { + div#pagination { + ul.pages { + li { + font-size: 0.6rem; + } } } } diff --git a/admin_ui/src/views/RowListing.vue b/admin_ui/src/views/RowListing.vue index 8550fb57..13ede35a 100644 --- a/admin_ui/src/views/RowListing.vue +++ b/admin_ui/src/views/RowListing.vue @@ -982,4 +982,4 @@ div.wrapper { } } } - + \ No newline at end of file diff --git a/piccolo_admin/translations/data.py b/piccolo_admin/translations/data.py index 0730214c..e11d832b 100644 --- a/piccolo_admin/translations/data.py +++ b/piccolo_admin/translations/data.py @@ -52,7 +52,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "For timestamps which are timezone aware, they will be displayed in this timezone by default.", "Form submitted": "Form submitted", "Forms": "Forms", - "Go to page": "Go to page", "Hide Filters": "Hide Filters", "Hide referencing tables": "Hide referencing tables", "Home": "Home", @@ -134,7 +133,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Ar gyfer stampiau amser sy'n ymwybodol o gylchfa amser, byddant yn cael eu harddangos yn y gylchfa amser hon yn ddiofyn.", "Form submitted": "Ffurflen wedi'i chyflwyno", "Forms": "Ffurflenni", - "Go to page": "Ewch i'r dudalen", "Hide Filters": "Cuddio hidlwyr", "Hide referencing tables": "Cuddio tablau cyfeirio", "Home": "Cartref", @@ -216,7 +214,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Za vremenske oznake koje su svjesne vremenske zone, one će prema zadanim postavkama biti prikazane u ovoj vremenskoj zoni.", "Form submitted": "Obrazac poslan", "Forms": "Forme", - "Go to page": "Idi na stranicu", "Hide Filters": "Sakrij filtre", "Hide referencing tables": "Sakrij referentne tablice", "Home": "Početna", @@ -298,7 +295,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Para carimbos de data/hora que reconhecem o fuso horário, eles serão exibidos nesse fuso horário por padrão.", "Form submitted": "Formulário enviado", "Forms": "Formulários", - "Go to page": "Ir para página", "Hide Filters": "Ocultar filtros", "Hide referencing tables": "Ocultar tabelas de referência", "Home": "Página inicial", @@ -380,7 +376,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Zeitstempel, die die Zeitzone berücksichtigen, werden standardmäßig in dieser Zeitzone angezeigt.", "Form submitted": "Formular eingereicht", "Forms": "Formulare", - "Go to page": "Gehen Sie zur Seite", "Hide Filters": "Filter ausblenden", "Hide referencing tables": "Referenzierungstabellen ausblenden", "Home": "Startseite", @@ -462,7 +457,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Pour les horodatages prenant en compte le fuseau horaire, ils seront affichés par défaut dans ce fuseau horaire.", "Form submitted": "Formulaire soumis", "Forms": "Formulaires", - "Go to page": "Aller à la page", "Hide Filters": "Masquer les filtres", "Hide referencing tables": "Masquer les tables de référence", "Home": "Accueil", @@ -544,7 +538,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Para las marcas de tiempo que tienen en cuenta la zona horaria, se mostrarán en esta zona horaria de forma predeterminada.", "Form submitted": "Formulario enviado", "Forms": "Formularios", - "Go to page": "Ir a la página", "Hide Filters": "Ocultar filtros", "Hide referencing tables": "Ocultar tablas de referencia", "Home": "Hogar", @@ -626,7 +619,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Aikavyöhyketietoiset aikaleimat näytetään oletusarvoisesti tällä aikavyöhykkeellä.", "Form submitted": "Lomake lähetetty", "Forms": "Lomakkeet", - "Go to page": "Mene sivulle", "Hide Filters": "Piilota suodattimet", "Hide referencing tables": "Piilota viitetaulukot", "Home": "Koti", @@ -708,7 +700,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Временные метки, которые учитывают часовой пояс, по умолчанию будут отображаться в этом часовом поясе.", "Form submitted": "Форма отправлена", "Forms": "Формы", - "Go to page": "Перейти к странице", "Hide Filters": "Скрыть фильтры", "Hide referencing tables": "Скрыть связаные таблицы", "Home": "Главная", @@ -790,7 +781,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Для часових позначок, які враховують часовий пояс, вони відображатимуться в цьому часовому поясі за умовчанням.", "Form submitted": "Форму відправлено", "Forms": "Форми", - "Go to page": "Перейти на сторінку", "Hide Filters": "Приховати фільтри", "Hide referencing tables": "Приховати пов'язані таблиці", "Home": "Головна", @@ -872,7 +862,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "对于时区感知的时间戳,默认情况下它们将显示在该时区中。", "Form submitted": "已提交的表单", "Forms": "表单", - "Go to page": "转到页面", "Hide Filters": "隐藏过滤器", "Hide referencing tables": "隐藏引用的表", "Home": "主页", @@ -954,7 +943,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "對於具有時區的時間戳記,將會顯示於此時區所對應的時間。", "Form submitted": "表單已提交", "Forms": "表單", - "Go to page": "跳轉頁面", "Hide Filters": "隱藏篩選器", "Hide referencing tables": "隱藏引用的表格", "Home": "首頁", @@ -1036,7 +1024,6 @@ "Form submitted": "Form gönderildi", "Forms": "Formlar", "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Zaman dilimine duyarlı zaman damgaları varsayılan olarak bu zaman diliminde görüntülenecektir.", - "Go to page": "Sayfaya git", "Hide Filters": "Filtreleri Gizle", "Hide referencing tables": "Referans tablolarını gizle", "Home": "Ana Sayfa", @@ -1118,7 +1105,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "برای مهرهای زمانی دارای اطلاعات منطقه زمانی، به‌طور پیش‌فرض در این منطقه زمانی نمایش داده می‌شوند.", "Form submitted": "فرم ارسال شد", "Forms": "فرم‌ها", - "Go to page": "رفتن به صفحه", "Hide Filters": "پنهان کردن فیلترها", "Hide referencing tables": "پنهان کردن جدول‌های مرتبط", "Home": "خانه", @@ -1200,7 +1186,6 @@ "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "I timestamp che tengono conto del fuso orario verranno visualizzati in questo fuso orario di default.", "Form submitted": "Modulo inviato", "Forms": "Moduli", - "Go to page": "Vai alla pagina", "Hide Filters": "Nascondi filtri", "Hide referencing tables": "Nascondi tabelle di riferimento", "Home": "Home", @@ -1279,11 +1264,9 @@ "Edit": "Szerkesztés", "Export CSV": "CSV exportálása", "Filter": "Szűrés", - "For timestamps which are timezone aware, they will be displayed in this timezone by default.": - "Az időzóna-érzékeny időbélyegek alapértelmezés szerint ebben az időzónában jelennek meg.", + "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Az időzóna-érzékeny időbélyegek alapértelmezés szerint ebben az időzónában jelennek meg.", "Form submitted": "Űrlap elküldve", "Forms": "Űrlapok", - "Go to page": "Ugrás az oldalra", "Hide Filters": "Szűrők elrejtése", "Hide referencing tables": "Hivatkozó táblák elrejtése", "Home": "Főoldal", @@ -1300,10 +1283,8 @@ "New password": "Új jelszó", "New value": "Új érték", "No results found": "Nincs találat", - "Note: Large data sets may take a while.": - "Megjegyzés: Nagy adathalmazok feldolgozása eltarthat egy ideig.", - "Note: They are converted to UTC when stored in the database.": - "Megjegyzés: Az adatbázisban UTC időzónára vannak konvertálva.", + "Note: Large data sets may take a while.": "Megjegyzés: Nagy adathalmazok feldolgozása eltarthat egy ideig.", + "Note: They are converted to UTC when stored in the database.": "Megjegyzés: Az adatbázisban UTC időzónára vannak konvertálva.", "of": "/", "page": "oldal", "Password": "Jelszó", @@ -1313,8 +1294,7 @@ "Seconds": "Másodpercek", "Select a column to update": "Válasszon egy frissítendő oszlopot", "Select a Column": "Oszlop kiválasztása", - "Select a table in the sidebar to get started.": - "A kezdéshez válasszon egy táblát az oldalsávban.", + "Select a table in the sidebar to get started.": "A kezdéshez válasszon egy táblát az oldalsávban.", "selected result(s) on": "kiválasztott találat itt:", "Semicolon": "Pontosvessző", "Set Timezone": "Időzóna beállítása", @@ -1334,7 +1314,7 @@ "Weeks": "Hetek", "Welcome to": "Üdvözöljük itt:", "with a matching": "egyező értékkel", - } + }, ) SLOVAK = Translation( @@ -1365,11 +1345,9 @@ "Edit": "Upraviť", "Export CSV": "Exportovať CSV", "Filter": "Filter", - "For timestamps which are timezone aware, they will be displayed in this timezone by default.": - "Časové značky s informáciou o časovom pásme sa predvolene zobrazujú v tomto časovom pásme.", + "For timestamps which are timezone aware, they will be displayed in this timezone by default.": "Časové značky s informáciou o časovom pásme sa predvolene zobrazujú v tomto časovom pásme.", "Form submitted": "Formulár odoslaný", "Forms": "Formuláre", - "Go to page": "Prejsť na stránku", "Hide Filters": "Skryť filtre", "Hide referencing tables": "Skryť odkazujúce tabuľky", "Home": "Domov", @@ -1386,10 +1364,8 @@ "New password": "Nové heslo", "New value": "Nová hodnota", "No results found": "Neboli nájdené žiadne výsledky", - "Note: Large data sets may take a while.": - "Poznámka: Spracovanie veľkých dátových súborov môže chvíľu trvať.", - "Note: They are converted to UTC when stored in the database.": - "Poznámka: Pri ukladaní do databázy sa konvertujú na UTC.", + "Note: Large data sets may take a while.": "Poznámka: Spracovanie veľkých dátových súborov môže chvíľu trvať.", + "Note: They are converted to UTC when stored in the database.": "Poznámka: Pri ukladaní do databázy sa konvertujú na UTC.", "of": "z", "page": "strana", "Password": "Heslo", @@ -1399,8 +1375,7 @@ "Seconds": "Sekundy", "Select a column to update": "Vyberte stĺpec na aktualizáciu", "Select a Column": "Vybrať stĺpec", - "Select a table in the sidebar to get started.": - "Ak chcete začať, vyberte tabuľku na bočnom paneli.", + "Select a table in the sidebar to get started.": "Ak chcete začať, vyberte tabuľku na bočnom paneli.", "selected result(s) on": "vybrané výsledky na", "Semicolon": "Bodkočiarka", "Set Timezone": "Nastaviť časové pásmo", @@ -1420,7 +1395,7 @@ "Weeks": "Týždne", "Welcome to": "Vitajte v", "with a matching": "so zhodou", - } + }, ) TRANSLATIONS: list[Translation] = [