adminforth 2.4.0-next.40 → 2.4.0-next.42
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
|
|
3
|
-
<div class="relative overflow-x-auto shadow-md sm:rounded-lg">
|
|
4
|
-
<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
|
|
5
|
-
<thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
|
|
3
|
+
<div class="afcl-table-container relative overflow-x-auto shadow-md sm:rounded-lg">
|
|
4
|
+
<table class="afcl-table w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
|
|
5
|
+
<thead class="afcl-table-thread text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
|
|
6
6
|
<tr>
|
|
7
7
|
<th scope="col" class="px-6 py-3"
|
|
8
8
|
v-for="column in columns"
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
<tr
|
|
20
20
|
v-for="(item, index) in dataPage"
|
|
21
21
|
:class="{
|
|
22
|
-
'odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800': evenHighlights,
|
|
22
|
+
'afcl-table-body odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800': evenHighlights,
|
|
23
23
|
'border-b dark:border-gray-700': index !== dataPage.length - 1 || totalPages > 1,
|
|
24
24
|
}"
|
|
25
25
|
>
|
|
@@ -38,24 +38,24 @@
|
|
|
38
38
|
</tr>
|
|
39
39
|
</tbody>
|
|
40
40
|
</table>
|
|
41
|
-
<nav class="flex items-center flex-column flex-wrap md:flex-row justify-between p-4"
|
|
41
|
+
<nav class="afcl-table-pagination-container flex items-center flex-column flex-wrap md:flex-row justify-between p-4"
|
|
42
42
|
v-if="totalPages > 1"
|
|
43
43
|
:aria-label="$t('Table navigation')">
|
|
44
44
|
<i18n-t
|
|
45
|
-
keypath="Showing {from} to {to} of {total}" tag="span" class="text-sm font-normal text-gray-500 dark:text-gray-400 mb-4 md:mb-0 block w-full md:inline md:w-auto"
|
|
45
|
+
keypath="Showing {from} to {to} of {total}" tag="span" class="afcl-table-pagination-text text-sm font-normal text-gray-500 dark:text-gray-400 mb-4 md:mb-0 block w-full md:inline md:w-auto"
|
|
46
46
|
>
|
|
47
47
|
<template #from><span class="font-semibold text-gray-900 dark:text-white">{{ Math.min((currentPage - 1) * props.pageSize + 1, props.data.length) }}</span></template>
|
|
48
48
|
<template #to><span class="font-semibold text-gray-900 dark:text-white">{{ Math.min(currentPage * props.pageSize, props.data.length) }}</span></template>
|
|
49
49
|
<template #total><span class="font-semibold text-gray-900 dark:text-white">{{ props.data.length }}</span></template>
|
|
50
50
|
</i18n-t>
|
|
51
51
|
|
|
52
|
-
<ul class="inline-flex -space-x-px rtl:space-x-reverse text-sm h-8">
|
|
52
|
+
<ul class="afcl-table-pagination-list inline-flex -space-x-px rtl:space-x-reverse text-sm h-8">
|
|
53
53
|
<li v-for="page in totalPages" :key="page">
|
|
54
54
|
<a href="#"
|
|
55
55
|
@click.prevent="switchPage(page)"
|
|
56
56
|
:aria-current="page === page ? 'page' : undefined"
|
|
57
57
|
:class='{
|
|
58
|
-
"text-blue-600 bg-lightPrimary text-lightPrimaryContrast dark:bg-darkPrimary dark:text-darkPrimaryContrast hover:opacity-90": page === currentPage,
|
|
58
|
+
"afcl-table-pagination-button text-blue-600 bg-lightPrimary text-lightPrimaryContrast dark:bg-darkPrimary dark:text-darkPrimaryContrast hover:opacity-90": page === currentPage,
|
|
59
59
|
"text-gray-500 border bg-white border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white": page !== currentPage,
|
|
60
60
|
"rounded-s-lg ms-0": page === 1,
|
|
61
61
|
"rounded-e-lg": page === totalPages,
|