Browse Source

Added pagination to aliases table

Will Browning 5 năm trước cách đây
mục cha
commit
62b4eea27d

+ 3 - 3
resources/css/app.css

@@ -221,12 +221,12 @@ table.vgt-table tr.clickable:hover {
 }
 }
 
 
 .vgt-wrap__footer {
 .vgt-wrap__footer {
-  @apply p-4 text-grey-400 bg-white border border-grey-200;
+  @apply p-4 text-grey-400 bg-white;
 }
 }
 
 
 .vgt-wrap__footer .footer__row-count__label,
 .vgt-wrap__footer .footer__row-count__label,
 .vgt-wrap__footer .footer__row-count__select {
 .vgt-wrap__footer .footer__row-count__select {
-  @apply inline-block align-middle;
+  @apply inline-block align-middle bg-white;
 }
 }
 
 
 .vgt-wrap__footer .footer__row-count__label {
 .vgt-wrap__footer .footer__row-count__label {
@@ -305,7 +305,7 @@ table.vgt-table tr.clickable:hover {
 }
 }
 
 
 .vgt-wrap__footer .footer__navigation__page-info__current-entry {
 .vgt-wrap__footer .footer__navigation__page-info__current-entry {
-  @apply text-center w-6 inline-block my-0 mx-2 font-bold;
+  @apply text-center w-6 inline-block my-0 mx-2 font-bold border border-grey-200;
 }
 }
 
 
 @media only screen and (max-width: 750px) {
 @media only screen and (max-width: 750px) {

+ 7 - 0
resources/js/pages/Aliases.vue

@@ -142,6 +142,13 @@
         enabled: true,
         enabled: true,
         initialSortBy: { field: 'created_at', type: 'desc' },
         initialSortBy: { field: 'created_at', type: 'desc' },
       }"
       }"
+      :pagination-options="{
+        enabled: true,
+        mode: 'pages',
+        perPage: 25,
+        perPageDropdown: [25, 50, 100],
+        rowsPerPageLabel: 'Aliases per page',
+      }"
       styleClass="vgt-table"
       styleClass="vgt-table"
     >
     >
       <div slot="emptystate" class="flex items-center justify-center h-24 text-lg text-grey-700">
       <div slot="emptystate" class="flex items-center justify-center h-24 text-lg text-grey-700">