@fy-/fws-vue 2.2.87 → 2.2.89
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.
|
@@ -76,7 +76,18 @@ const hasData = computed(() => data.value && data.value.length > 0)
|
|
|
76
76
|
const hasExportableColumns = computed(() => props.exportableColumns.length > 0)
|
|
77
77
|
const hasPaging = computed(() => paging.value && paging.value.page_max > 1 && paging.value.page_no)
|
|
78
78
|
|
|
79
|
+
// Request controller for cancellation
|
|
80
|
+
let currentRequest: AbortController | null = null
|
|
81
|
+
|
|
79
82
|
async function getData(page: number = 1) {
|
|
83
|
+
// Cancel any ongoing request
|
|
84
|
+
if (currentRequest) {
|
|
85
|
+
currentRequest.abort()
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
// Create new abort controller for this request
|
|
89
|
+
currentRequest = new AbortController()
|
|
90
|
+
|
|
80
91
|
isLoading.value = true
|
|
81
92
|
eventBus.emit('main-loading', true)
|
|
82
93
|
if (route.query.page) page = Number.parseInt(route.query.page.toString())
|
|
@@ -91,6 +102,7 @@ async function getData(page: number = 1) {
|
|
|
91
102
|
try {
|
|
92
103
|
const r = await restFunction(props.apiPath, 'GET', requestParams, {
|
|
93
104
|
getBody: true,
|
|
105
|
+
signal: currentRequest.signal,
|
|
94
106
|
})
|
|
95
107
|
currentPage.value = page
|
|
96
108
|
data.value = []
|
|
@@ -102,9 +114,15 @@ async function getData(page: number = 1) {
|
|
|
102
114
|
}
|
|
103
115
|
}
|
|
104
116
|
catch (error) {
|
|
105
|
-
|
|
117
|
+
// Only log error if it's not an abort error
|
|
118
|
+
if (!(error instanceof DOMException && error.name === 'AbortError')) {
|
|
119
|
+
console.error('Error fetching data:', error)
|
|
120
|
+
}
|
|
106
121
|
}
|
|
107
122
|
finally {
|
|
123
|
+
if (currentRequest) {
|
|
124
|
+
currentRequest = null
|
|
125
|
+
}
|
|
108
126
|
isLoading.value = false
|
|
109
127
|
eventBus.emit('main-loading', false)
|
|
110
128
|
}
|
|
@@ -131,11 +131,10 @@ onUnmounted(() => {
|
|
|
131
131
|
<div class="flex items-center justify-between mb-4 border-b border-fv-neutral-200 dark:border-fv-neutral-800 pb-3">
|
|
132
132
|
<h3 class="text-lg font-medium text-fv-neutral-900 dark:text-white flex items-center">
|
|
133
133
|
<FunnelIcon class="w-5 h-5 mr-2 text-fv-primary-600 dark:text-fv-primary-400" aria-hidden="true" />
|
|
134
|
-
{{ $t("filters_title") }}
|
|
135
134
|
</h3>
|
|
136
135
|
</div>
|
|
137
136
|
|
|
138
|
-
<div :class="`${css} grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4`">
|
|
137
|
+
<div :class="`${css} grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 gap-y-2`">
|
|
139
138
|
<div v-for="(g, i) in data" :key="`index_${i}`" class="relative">
|
|
140
139
|
<template v-for="f in g" :key="f.uid">
|
|
141
140
|
<template v-if="!f.isHidden">
|
|
@@ -162,7 +162,7 @@ onMounted(() => {
|
|
|
162
162
|
<li v-if="items.page_no >= 2">
|
|
163
163
|
<button
|
|
164
164
|
type="button"
|
|
165
|
-
class="flex items-center justify-center w-
|
|
165
|
+
class="flex items-center justify-center w-6 md:w-8 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
166
166
|
aria-label="Previous page"
|
|
167
167
|
@click="prev()"
|
|
168
168
|
>
|
|
@@ -172,7 +172,7 @@ onMounted(() => {
|
|
|
172
172
|
</li>
|
|
173
173
|
<li v-if="items.page_no - 1 > 1">
|
|
174
174
|
<router-link
|
|
175
|
-
class="flex items-center justify-center
|
|
175
|
+
class="flex items-center justify-center px-1.5 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
176
176
|
:to="page(1)"
|
|
177
177
|
aria-label="Go to page 1"
|
|
178
178
|
>
|
|
@@ -191,7 +191,7 @@ onMounted(() => {
|
|
|
191
191
|
:key="`page-${items.page_no - 1}`"
|
|
192
192
|
>
|
|
193
193
|
<router-link
|
|
194
|
-
class="flex items-center justify-center
|
|
194
|
+
class="flex items-center justify-center px-1.5 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
195
195
|
:to="page(items.page_no - 1)"
|
|
196
196
|
:aria-label="`Go to page ${items.page_no - 1}`"
|
|
197
197
|
>
|
|
@@ -201,7 +201,7 @@ onMounted(() => {
|
|
|
201
201
|
<li>
|
|
202
202
|
<div
|
|
203
203
|
aria-current="page"
|
|
204
|
-
class="flex items-center justify-center
|
|
204
|
+
class="flex items-center justify-center px-1.5 h-7 md:h-8 text-white rounded-md shadow-sm bg-primary-600 font-medium dark:bg-primary-500 transition-all"
|
|
205
205
|
:aria-label="`Current page, page ${items.page_no}`"
|
|
206
206
|
>
|
|
207
207
|
{{ items.page_no }}
|
|
@@ -212,7 +212,7 @@ onMounted(() => {
|
|
|
212
212
|
:key="`page-x-${items.page_no + 1}`"
|
|
213
213
|
>
|
|
214
214
|
<router-link
|
|
215
|
-
class="flex items-center justify-center
|
|
215
|
+
class="flex items-center justify-center px-1.5 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
216
216
|
:to="page(items.page_no + 1)"
|
|
217
217
|
:aria-label="`Go to page ${items.page_no + 1}`"
|
|
218
218
|
>
|
|
@@ -228,7 +228,7 @@ onMounted(() => {
|
|
|
228
228
|
</li>
|
|
229
229
|
<li v-if="items.page_no + 1 < items.page_max">
|
|
230
230
|
<router-link
|
|
231
|
-
class="flex items-center justify-center
|
|
231
|
+
class="flex items-center justify-center px-1.5 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
232
232
|
:to="page(items.page_max)"
|
|
233
233
|
:aria-label="`Go to page ${items.page_max}`"
|
|
234
234
|
>
|
|
@@ -238,7 +238,7 @@ onMounted(() => {
|
|
|
238
238
|
<li v-if="items.page_no < items.page_max">
|
|
239
239
|
<button
|
|
240
240
|
type="button"
|
|
241
|
-
class="flex items-center justify-center w-
|
|
241
|
+
class="flex items-center justify-center w-6 md:w-8 h-7 md:h-8 text-fv-neutral-700 bg-white/80 rounded-md shadow-sm hover:bg-fv-neutral-100 hover:text-primary-600 focus:ring-2 focus:ring-primary-400/40 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:hover:bg-fv-neutral-700/70 dark:hover:text-white dark:focus:ring-primary-500/40 transition-all"
|
|
242
242
|
aria-label="Next page"
|
|
243
243
|
@click="next()"
|
|
244
244
|
>
|