v-sistec-features 1.4.0 → 1.4.1
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.
- package/dist/v-sistec-features.css +1 -1
- package/dist/vDataPage.js +275 -247
- package/package.json +1 -1
- package/src/DataPageVue/components/VDataPage.vue +64 -8
|
@@ -8,4 +8,4 @@
|
|
|
8
8
|
* Copyright 2018-2025 The Tabler Authors
|
|
9
9
|
* Copyright 2018-2025 codecalm.net Paweł Kuna
|
|
10
10
|
* Licensed under MIT (https://github.com/tabler/tabler/blob/master/LICENSE)
|
|
11
|
-
*/[data-bs-theme-base=slate]{--tblr-gray-50:#f8fafc;--tblr-gray-100:#f1f5f9;--tblr-gray-200:#e2e8f0;--tblr-gray-300:#cbd5e1;--tblr-gray-400:#94a3b8;--tblr-gray-500:#64748b;--tblr-gray-600:#475569;--tblr-gray-700:#334155;--tblr-gray-800:#1e293b;--tblr-gray-900:#0f172a;--tblr-gray-950:#020617}[data-bs-theme-base=gray]{--tblr-gray-50:#f9fafb;--tblr-gray-100:#f3f4f6;--tblr-gray-200:#e5e7eb;--tblr-gray-300:#d1d5db;--tblr-gray-400:#9ca3af;--tblr-gray-500:#6b7280;--tblr-gray-600:#4b5563;--tblr-gray-700:#374151;--tblr-gray-800:#1f2937;--tblr-gray-900:#111827;--tblr-gray-950:#030712}[data-bs-theme-base=zinc]{--tblr-gray-50:#fafafa;--tblr-gray-100:#f4f4f5;--tblr-gray-200:#e4e4e7;--tblr-gray-300:#d4d4d8;--tblr-gray-400:#a1a1aa;--tblr-gray-500:#71717a;--tblr-gray-600:#52525b;--tblr-gray-700:#3f3f46;--tblr-gray-800:#27272a;--tblr-gray-900:#18181b;--tblr-gray-950:#09090b}[data-bs-theme-base=neutral]{--tblr-gray-50:#fafafa;--tblr-gray-100:#f5f5f5;--tblr-gray-200:#e5e5e5;--tblr-gray-300:#d4d4d4;--tblr-gray-400:#a3a3a3;--tblr-gray-500:#737373;--tblr-gray-600:#525252;--tblr-gray-700:#404040;--tblr-gray-800:#262626;--tblr-gray-900:#171717;--tblr-gray-950:#0a0a0a}[data-bs-theme-base=stone]{--tblr-gray-50:#fafaf9;--tblr-gray-100:#f5f5f4;--tblr-gray-200:#e7e5e4;--tblr-gray-300:#d6d3d1;--tblr-gray-400:#a8a29e;--tblr-gray-500:#78716c;--tblr-gray-600:#57534e;--tblr-gray-700:#44403c;--tblr-gray-800:#292524;--tblr-gray-900:#1c1917;--tblr-gray-950:#0c0a09}[data-bs-theme-base=pink]{--tblr-gray-50:#fdf2f8;--tblr-gray-100:#fce7f3;--tblr-gray-200:#fbcfe8;--tblr-gray-300:#f9a8d4;--tblr-gray-400:#f472b6;--tblr-gray-500:#ec4899;--tblr-gray-600:#db2777;--tblr-gray-700:#be185d;--tblr-gray-800:#9d174d;--tblr-gray-900:#831843;--tblr-gray-950:#500724}[data-bs-theme-primary=blue]{--tblr-primary:#066fd1;--tblr-primary-rgb:6,111,209}[data-bs-theme-primary=azure]{--tblr-primary:#4299e1;--tblr-primary-rgb:66,153,225}[data-bs-theme-primary=indigo]{--tblr-primary:#4263eb;--tblr-primary-rgb:66,99,235}[data-bs-theme-primary=purple]{--tblr-primary:#ae3ec9;--tblr-primary-rgb:174,62,201}[data-bs-theme-primary=pink]{--tblr-primary:#d6336c;--tblr-primary-rgb:214,51,108}[data-bs-theme-primary=red]{--tblr-primary:#d63939;--tblr-primary-rgb:214,57,57}[data-bs-theme-primary=orange]{--tblr-primary:#f76707;--tblr-primary-rgb:247,103,7}[data-bs-theme-primary=yellow]{--tblr-primary:#f59f00;--tblr-primary-rgb:245,159,0}[data-bs-theme-primary=lime]{--tblr-primary:#74b816;--tblr-primary-rgb:116,184,22}[data-bs-theme-primary=green]{--tblr-primary:#2fb344;--tblr-primary-rgb:47,179,68}[data-bs-theme-primary=teal]{--tblr-primary:#0ca678;--tblr-primary-rgb:12,166,120}[data-bs-theme-primary=cyan]{--tblr-primary:#17a2b8;--tblr-primary-rgb:23,162,184}[data-bs-theme-radius="0"]{--tblr-border-radius-scale:0}[data-bs-theme-radius="0.5"]{--tblr-border-radius-scale:.5}[data-bs-theme-radius="1"]{--tblr-border-radius-scale:1}[data-bs-theme-radius="1.5"]{--tblr-border-radius-scale:1.5}[data-bs-theme-radius="2"]{--tblr-border-radius-scale:2}[data-bs-theme-primary=inverted]{--tblr-primary:var(--tblr-gray-800);--tblr-primary-fg:var(--tblr-light);--tblr-primary-rgb:31,41,55}[data-bs-theme-primary=inverted] [data-bs-theme=dark],[data-bs-theme-primary=inverted][data-bs-theme=dark]{--tblr-primary:#f9fafb;--tblr-primary-fg:var(--tblr-dark);--tblr-primary-rgb:249,250,251}[data-bs-theme-font=monospace]{--tblr-body-font-family:var(--tblr-font-monospace);--tblr-body-font-size:80%}[data-bs-theme-font=sans-serif]{--tblr-body-font-family:var(--tblr-font-sans-serif)}[data-bs-theme-font=serif]{--tblr-body-font-family:var(--tblr-font-serif)}[data-bs-theme-font=comic]{--tblr-body-font-family:var(--tblr-font-comic)}.rotate-180[data-v-df81be49] svg{transform:rotate(180deg)}.page-select[data-v-df81be49]{background-color:var(--tblr-primary)!important;color:#fff!important;border:none!important}.page-estilo[data-v-df81be49]{border:none;--cor-escurecida: color-mix(in srgb, var(--tblr-primary), #000 25%);background:transparent;padding:1px 10px;border-radius:7px;margin:0!important;transition:color .15s ease-in-out,background-color .15s ease-in-out}.page-estilo[data-v-df81be49]:hover{background:var(--cor-escurecida);color:#fff}.btn[data-v-df81be49]{padding:0!important;margin:0!important;background:transparent!important;border:none!important;box-shadow:none!important}[data-v-df81be49] .btn-estilo svg{padding:0!important;margin:0!important}[data-v-df81be49] .btn-estilo:hover svg{stroke:var(--tblr-primary)}.icon-tabler[data-v-df81be49]{margin:0!important;padding:0!important}.scroll-finish-style[data-v-
|
|
11
|
+
*/[data-bs-theme-base=slate]{--tblr-gray-50:#f8fafc;--tblr-gray-100:#f1f5f9;--tblr-gray-200:#e2e8f0;--tblr-gray-300:#cbd5e1;--tblr-gray-400:#94a3b8;--tblr-gray-500:#64748b;--tblr-gray-600:#475569;--tblr-gray-700:#334155;--tblr-gray-800:#1e293b;--tblr-gray-900:#0f172a;--tblr-gray-950:#020617}[data-bs-theme-base=gray]{--tblr-gray-50:#f9fafb;--tblr-gray-100:#f3f4f6;--tblr-gray-200:#e5e7eb;--tblr-gray-300:#d1d5db;--tblr-gray-400:#9ca3af;--tblr-gray-500:#6b7280;--tblr-gray-600:#4b5563;--tblr-gray-700:#374151;--tblr-gray-800:#1f2937;--tblr-gray-900:#111827;--tblr-gray-950:#030712}[data-bs-theme-base=zinc]{--tblr-gray-50:#fafafa;--tblr-gray-100:#f4f4f5;--tblr-gray-200:#e4e4e7;--tblr-gray-300:#d4d4d8;--tblr-gray-400:#a1a1aa;--tblr-gray-500:#71717a;--tblr-gray-600:#52525b;--tblr-gray-700:#3f3f46;--tblr-gray-800:#27272a;--tblr-gray-900:#18181b;--tblr-gray-950:#09090b}[data-bs-theme-base=neutral]{--tblr-gray-50:#fafafa;--tblr-gray-100:#f5f5f5;--tblr-gray-200:#e5e5e5;--tblr-gray-300:#d4d4d4;--tblr-gray-400:#a3a3a3;--tblr-gray-500:#737373;--tblr-gray-600:#525252;--tblr-gray-700:#404040;--tblr-gray-800:#262626;--tblr-gray-900:#171717;--tblr-gray-950:#0a0a0a}[data-bs-theme-base=stone]{--tblr-gray-50:#fafaf9;--tblr-gray-100:#f5f5f4;--tblr-gray-200:#e7e5e4;--tblr-gray-300:#d6d3d1;--tblr-gray-400:#a8a29e;--tblr-gray-500:#78716c;--tblr-gray-600:#57534e;--tblr-gray-700:#44403c;--tblr-gray-800:#292524;--tblr-gray-900:#1c1917;--tblr-gray-950:#0c0a09}[data-bs-theme-base=pink]{--tblr-gray-50:#fdf2f8;--tblr-gray-100:#fce7f3;--tblr-gray-200:#fbcfe8;--tblr-gray-300:#f9a8d4;--tblr-gray-400:#f472b6;--tblr-gray-500:#ec4899;--tblr-gray-600:#db2777;--tblr-gray-700:#be185d;--tblr-gray-800:#9d174d;--tblr-gray-900:#831843;--tblr-gray-950:#500724}[data-bs-theme-primary=blue]{--tblr-primary:#066fd1;--tblr-primary-rgb:6,111,209}[data-bs-theme-primary=azure]{--tblr-primary:#4299e1;--tblr-primary-rgb:66,153,225}[data-bs-theme-primary=indigo]{--tblr-primary:#4263eb;--tblr-primary-rgb:66,99,235}[data-bs-theme-primary=purple]{--tblr-primary:#ae3ec9;--tblr-primary-rgb:174,62,201}[data-bs-theme-primary=pink]{--tblr-primary:#d6336c;--tblr-primary-rgb:214,51,108}[data-bs-theme-primary=red]{--tblr-primary:#d63939;--tblr-primary-rgb:214,57,57}[data-bs-theme-primary=orange]{--tblr-primary:#f76707;--tblr-primary-rgb:247,103,7}[data-bs-theme-primary=yellow]{--tblr-primary:#f59f00;--tblr-primary-rgb:245,159,0}[data-bs-theme-primary=lime]{--tblr-primary:#74b816;--tblr-primary-rgb:116,184,22}[data-bs-theme-primary=green]{--tblr-primary:#2fb344;--tblr-primary-rgb:47,179,68}[data-bs-theme-primary=teal]{--tblr-primary:#0ca678;--tblr-primary-rgb:12,166,120}[data-bs-theme-primary=cyan]{--tblr-primary:#17a2b8;--tblr-primary-rgb:23,162,184}[data-bs-theme-radius="0"]{--tblr-border-radius-scale:0}[data-bs-theme-radius="0.5"]{--tblr-border-radius-scale:.5}[data-bs-theme-radius="1"]{--tblr-border-radius-scale:1}[data-bs-theme-radius="1.5"]{--tblr-border-radius-scale:1.5}[data-bs-theme-radius="2"]{--tblr-border-radius-scale:2}[data-bs-theme-primary=inverted]{--tblr-primary:var(--tblr-gray-800);--tblr-primary-fg:var(--tblr-light);--tblr-primary-rgb:31,41,55}[data-bs-theme-primary=inverted] [data-bs-theme=dark],[data-bs-theme-primary=inverted][data-bs-theme=dark]{--tblr-primary:#f9fafb;--tblr-primary-fg:var(--tblr-dark);--tblr-primary-rgb:249,250,251}[data-bs-theme-font=monospace]{--tblr-body-font-family:var(--tblr-font-monospace);--tblr-body-font-size:80%}[data-bs-theme-font=sans-serif]{--tblr-body-font-family:var(--tblr-font-sans-serif)}[data-bs-theme-font=serif]{--tblr-body-font-family:var(--tblr-font-serif)}[data-bs-theme-font=comic]{--tblr-body-font-family:var(--tblr-font-comic)}.rotate-180[data-v-df81be49] svg{transform:rotate(180deg)}.page-select[data-v-df81be49]{background-color:var(--tblr-primary)!important;color:#fff!important;border:none!important}.page-estilo[data-v-df81be49]{border:none;--cor-escurecida: color-mix(in srgb, var(--tblr-primary), #000 25%);background:transparent;padding:1px 10px;border-radius:7px;margin:0!important;transition:color .15s ease-in-out,background-color .15s ease-in-out}.page-estilo[data-v-df81be49]:hover{background:var(--cor-escurecida);color:#fff}.btn[data-v-df81be49]{padding:0!important;margin:0!important;background:transparent!important;border:none!important;box-shadow:none!important}[data-v-df81be49] .btn-estilo svg{padding:0!important;margin:0!important}[data-v-df81be49] .btn-estilo:hover svg{stroke:var(--tblr-primary)}.icon-tabler[data-v-df81be49]{margin:0!important;padding:0!important}.scroll-finish-style[data-v-9350c793]{color:#6c757d;display:block;text-align:center;margin-top:1rem;margin-bottom:1rem}.rotate-180[data-v-b9735591] svg{transform:rotate(180deg)}.page-select[data-v-b9735591]{background-color:var(--tblr-primary)!important;color:#fff!important;border:none!important}.page-estilo[data-v-b9735591]{border:none;--cor-escurecida: color-mix(in srgb, var(--tblr-primary), #000 25%);background:transparent;padding:1px 10px;border-radius:7px;margin:0!important;transition:color .15s ease-in-out,background-color .15s ease-in-out}.page-estilo[data-v-b9735591]:hover{background:var(--cor-escurecida);color:#fff}.btn[data-v-b9735591]{padding:0!important;margin:0!important;background:transparent!important;border:none!important;box-shadow:none!important}[data-v-b9735591] .btn-estilo svg{padding:0!important;margin:0!important}[data-v-b9735591] .btn-estilo:hover svg{stroke:var(--tblr-primary)}.icon-tabler[data-v-b9735591]{margin:0!important;padding:0!important}.inputClose[data-v-1b6ff54b]{color:var(--tblr-icon-color);z-index:10;position:absolute;top:50%;right:0;transform:translateY(-50%);font-size:1.2em;min-width:2.5rem;display:flex;justify-content:center}.inputClose[data-v-1b6ff54b]:hover{cursor:pointer}.selected[data-v-1b6ff54b]:hover{background-color:#b02a2a!important;color:#fff!important}.table-responsive[data-v-01e87047]{overflow-x:auto}.state-feedback[data-v-01e87047]{padding:1rem;text-align:center}.state-feedback.error[data-v-01e87047]{color:red}.pagination-controls[data-v-01e87047]{margin-top:1rem;display:flex;justify-content:space-between}.placeholder-img[data-v-01e87047]{width:40px;height:40px;border-radius:4px}.container-img[data-v-01e87047]{aspect-ratio:1;display:flex;justify-content:center;overflow:hidden;position:relative;max-width:40px;min-width:40px}.container-img .img-tamanho-cover[data-v-01e87047]{position:absolute;top:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.5;filter:blur(4px)}.container-img .img-tamanho[data-v-01e87047]{object-fit:contain;width:100%;height:100%;z-index:2}.container-img.container-img-preview[data-v-01e87047]{cursor:pointer}.container-img.container-img-preview[data-v-01e87047]:hover{border-style:dashed;border-color:var(--tblr-primary);border-width:2px;transition:border-width .15s ease-in-out}.container-img.container-img-preview:hover .img-tamanho[data-v-01e87047]{opacity:.3}.erro-custom-container[data-v-01e87047]{display:inline-block;padding:.2em .6em;border-radius:4px;background-color:#fff;font-weight:700;text-transform:uppercase}.erro-custom-text[data-v-01e87047]{font-size:.8em;text-transform:uppercase;font-weight:700}.bg-img[data-v-01e87047]{background-color:#0000004d;position:absolute;top:0;width:100%;height:100%;z-index:1}.image-preview-container[data-v-01e87047]{position:fixed;z-index:9999;background-color:#fff;border-radius:8px;box-shadow:0 4px 12px #0003;padding:5px;pointer-events:none;transition:opacity .2s ease-in-out}.image-preview-container .image-preview-large[data-v-01e87047]{display:block;max-width:250px;max-height:250px;border-radius:4px}.form-check-input[data-v-01e87047]{border-width:1px!important;border-color:#00000064!important;width:17px;height:17px}[data-bs-theme=dark] .form-check-input[data-v-01e87047]{border-color:#ffffff5f!important}
|
package/dist/vDataPage.js
CHANGED
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { _ as
|
|
3
|
-
function
|
|
1
|
+
import { defineComponent as G, ref as b, toRefs as de, createElementBlock as f, watch as z, onMounted as ce, onUnmounted as pe, openBlock as g, withDirectives as fe, renderSlot as x, createCommentVNode as T, createElementVNode as c, createVNode as j, vShow as ge, toDisplayString as F, nextTick as H, pushScopeId as _e, popScopeId as ve, computed as S, withModifiers as A, Fragment as C, renderList as $, normalizeClass as U, readonly as me, isRef as he, unref as B, withCtx as W } from "vue";
|
|
2
|
+
import { _ as Z } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
3
|
+
function ye(i, _ = null) {
|
|
4
4
|
if (!i)
|
|
5
5
|
return !1;
|
|
6
|
-
const t = i.getBoundingClientRect(), l =
|
|
6
|
+
const t = i.getBoundingClientRect(), l = _ ? _.getBoundingClientRect() : { top: 0, left: 0, bottom: window.innerHeight, right: window.innerWidth };
|
|
7
7
|
return t.bottom >= l.top && t.top <= l.bottom && t.right >= l.left && t.left <= l.right;
|
|
8
8
|
}
|
|
9
|
-
async function
|
|
10
|
-
return i ? (await
|
|
9
|
+
async function ke(i) {
|
|
10
|
+
return i ? (await H(), i.value instanceof HTMLElement ? i.value : i.value ? document.querySelector(i.value) : null) : null;
|
|
11
11
|
}
|
|
12
12
|
function be(i) {
|
|
13
|
-
let
|
|
14
|
-
i.top && (
|
|
13
|
+
let _ = `0px 0px ${i.distance}px 0px`;
|
|
14
|
+
i.top && (_ = `${i.distance}px 0px 0px 0px`);
|
|
15
15
|
const t = new IntersectionObserver(
|
|
16
16
|
(l) => {
|
|
17
17
|
l[0].isIntersecting && (i.firstload && i.emit(), i.firstload = !0);
|
|
18
18
|
},
|
|
19
|
-
{ root: i.parentEl, rootMargin:
|
|
19
|
+
{ root: i.parentEl, rootMargin: _ }
|
|
20
20
|
);
|
|
21
21
|
return i.infiniteLoading.value && t.observe(i.infiniteLoading.value), t;
|
|
22
22
|
}
|
|
23
|
-
async function
|
|
24
|
-
if (await
|
|
23
|
+
async function K(i, _) {
|
|
24
|
+
if (await H(), !i.top)
|
|
25
25
|
return;
|
|
26
26
|
const t = i.parentEl || document.documentElement;
|
|
27
|
-
t.scrollTop = t.scrollHeight -
|
|
27
|
+
t.scrollTop = t.scrollHeight - _;
|
|
28
28
|
}
|
|
29
|
-
const
|
|
29
|
+
const ee = (i, _) => {
|
|
30
30
|
const t = i.__vccOpts || i;
|
|
31
|
-
for (const [l, e] of
|
|
31
|
+
for (const [l, e] of _)
|
|
32
32
|
t[l] = e;
|
|
33
33
|
return t;
|
|
34
|
-
},
|
|
35
|
-
|
|
34
|
+
}, we = {}, Ie = (i) => (_e("data-v-d3e37633"), i = i(), ve(), i), xe = { class: "container" }, Le = /* @__PURE__ */ Ie(() => /* @__PURE__ */ c("div", { class: "spinner" }, null, -1)), Ee = [
|
|
35
|
+
Le
|
|
36
36
|
];
|
|
37
|
-
function
|
|
38
|
-
return
|
|
37
|
+
function Pe(i, _) {
|
|
38
|
+
return g(), f("div", xe, Ee);
|
|
39
39
|
}
|
|
40
|
-
const Me = /* @__PURE__ */
|
|
40
|
+
const Me = /* @__PURE__ */ ee(we, [["render", Pe], ["__scopeId", "data-v-d3e37633"]]), De = { class: "state-error" }, Ce = /* @__PURE__ */ G({
|
|
41
41
|
__name: "InfiniteLoading",
|
|
42
42
|
props: {
|
|
43
43
|
top: { type: Boolean, default: !1 },
|
|
@@ -48,83 +48,83 @@ const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633
|
|
|
48
48
|
slots: {}
|
|
49
49
|
},
|
|
50
50
|
emits: ["infinite"],
|
|
51
|
-
setup(i, { emit:
|
|
51
|
+
setup(i, { emit: _ }) {
|
|
52
52
|
const t = i;
|
|
53
53
|
let l = null, e = 0;
|
|
54
|
-
const
|
|
55
|
-
infiniteLoading:
|
|
56
|
-
top:
|
|
57
|
-
firstload:
|
|
58
|
-
distance:
|
|
54
|
+
const y = b(null), m = b(""), { top: P, firstload: p, distance: o } = t, { identifier: M, target: D } = de(t), s = {
|
|
55
|
+
infiniteLoading: y,
|
|
56
|
+
top: P,
|
|
57
|
+
firstload: p,
|
|
58
|
+
distance: o,
|
|
59
59
|
parentEl: null,
|
|
60
60
|
emit() {
|
|
61
|
-
e = (
|
|
61
|
+
e = (s.parentEl || document.documentElement).scrollHeight, h.loading(), _("infinite", h);
|
|
62
62
|
}
|
|
63
|
-
},
|
|
63
|
+
}, h = {
|
|
64
64
|
loading() {
|
|
65
|
-
|
|
65
|
+
m.value = "loading";
|
|
66
66
|
},
|
|
67
67
|
async loaded() {
|
|
68
|
-
|
|
68
|
+
m.value = "loaded", await K(s, e), ye(y.value, s.parentEl) && s.emit();
|
|
69
69
|
},
|
|
70
70
|
async complete() {
|
|
71
|
-
|
|
71
|
+
m.value = "complete", await K(s, e), l?.disconnect();
|
|
72
72
|
},
|
|
73
73
|
error() {
|
|
74
|
-
|
|
74
|
+
m.value = "error";
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
|
-
function
|
|
78
|
-
l?.disconnect(), l = be(
|
|
77
|
+
function n() {
|
|
78
|
+
l?.disconnect(), l = be(s);
|
|
79
79
|
}
|
|
80
|
-
return
|
|
81
|
-
|
|
82
|
-
}), pe(() => l?.disconnect()), (
|
|
80
|
+
return z(M, n), ce(async () => {
|
|
81
|
+
s.parentEl = await ke(D), n();
|
|
82
|
+
}), pe(() => l?.disconnect()), (v, E) => (g(), f("div", {
|
|
83
83
|
ref_key: "infiniteLoading",
|
|
84
|
-
ref:
|
|
84
|
+
ref: y,
|
|
85
85
|
class: "v3-infinite-loading"
|
|
86
86
|
}, [
|
|
87
|
-
|
|
88
|
-
x(
|
|
89
|
-
|
|
87
|
+
fe(c("div", null, [
|
|
88
|
+
x(v.$slots, "spinner", {}, () => [
|
|
89
|
+
j(Me)
|
|
90
90
|
], !0)
|
|
91
91
|
], 512), [
|
|
92
|
-
[
|
|
92
|
+
[ge, m.value == "loading"]
|
|
93
93
|
]),
|
|
94
|
-
|
|
95
|
-
var
|
|
94
|
+
m.value == "complete" ? x(v.$slots, "complete", { key: 0 }, () => {
|
|
95
|
+
var u;
|
|
96
96
|
return [
|
|
97
|
-
|
|
97
|
+
c("span", null, F(((u = v.slots) == null ? void 0 : u.complete) || "No more results!"), 1)
|
|
98
98
|
];
|
|
99
|
-
}, !0) :
|
|
100
|
-
|
|
99
|
+
}, !0) : T("", !0),
|
|
100
|
+
m.value == "error" ? x(v.$slots, "error", {
|
|
101
101
|
key: 1,
|
|
102
|
-
retry:
|
|
102
|
+
retry: s.emit
|
|
103
103
|
}, () => {
|
|
104
|
-
var
|
|
104
|
+
var u;
|
|
105
105
|
return [
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
106
|
+
c("span", De, [
|
|
107
|
+
c("span", null, F(((u = v.slots) == null ? void 0 : u.error) || "Oops something went wrong!"), 1),
|
|
108
|
+
c("button", {
|
|
109
109
|
class: "retry",
|
|
110
|
-
onClick:
|
|
111
|
-
(...
|
|
110
|
+
onClick: E[0] || (E[0] = //@ts-ignore
|
|
111
|
+
(...L) => s.emit && s.emit(...L))
|
|
112
112
|
}, "retry")
|
|
113
113
|
])
|
|
114
114
|
];
|
|
115
|
-
}, !0) :
|
|
115
|
+
}, !0) : T("", !0)
|
|
116
116
|
], 512));
|
|
117
117
|
}
|
|
118
|
-
}),
|
|
118
|
+
}), Q = /* @__PURE__ */ ee(Ce, [["__scopeId", "data-v-4bdee133"]]), Te = {
|
|
119
119
|
key: 0,
|
|
120
120
|
class: "d-flex align-items-center justify-content-between w-100"
|
|
121
|
-
},
|
|
121
|
+
}, Be = {
|
|
122
122
|
key: 0,
|
|
123
123
|
class: "d-flex align-items-center gap-2"
|
|
124
|
-
},
|
|
124
|
+
}, ze = { class: "d-flex" }, Fe = ["disabled"], He = ["disabled"], Se = { class: "d-flex gap-2" }, Ae = ["onClick", "disabled"], Ue = {
|
|
125
125
|
key: 1,
|
|
126
126
|
class: "m-0 p-0"
|
|
127
|
-
}, Ne = { class: "d-flex" }, Oe = ["disabled"], Ve = ["disabled"],
|
|
127
|
+
}, Ne = { class: "d-flex" }, Oe = ["disabled"], Ve = ["disabled"], Y = `
|
|
128
128
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
129
129
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
130
130
|
class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-left">
|
|
@@ -132,96 +132,96 @@ const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633
|
|
|
132
132
|
<path d="M11 7l-5 5l5 5" />
|
|
133
133
|
<path d="M17 7l-5 5l5 5" />
|
|
134
134
|
</svg>
|
|
135
|
-
`,
|
|
135
|
+
`, X = `
|
|
136
136
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
137
137
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
138
138
|
class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left">
|
|
139
139
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
|
140
140
|
<path d="M15 6l-6 6l6 6" />
|
|
141
141
|
</svg>
|
|
142
|
-
`, je = /* @__PURE__ */
|
|
142
|
+
`, je = /* @__PURE__ */ G({
|
|
143
143
|
__name: "PaginationDatatable",
|
|
144
144
|
props: {
|
|
145
145
|
pagination: {},
|
|
146
146
|
filtering: { type: Boolean, default: !1 }
|
|
147
147
|
},
|
|
148
148
|
emits: ["tradePage"],
|
|
149
|
-
setup(i, { emit:
|
|
150
|
-
const t = i, l =
|
|
149
|
+
setup(i, { emit: _ }) {
|
|
150
|
+
const t = i, l = _, e = S(() => t.pagination.limit_per_page ? Math.ceil(t.pagination.count / t.pagination.limit_per_page) : 0), y = S(() => t.pagination.current_page + 1 < e.value ? t.pagination.current_page + 1 : null), m = () => {
|
|
151
151
|
t.pagination.current_page++, l("tradePage");
|
|
152
|
-
},
|
|
153
|
-
t.pagination.current_page =
|
|
154
|
-
},
|
|
152
|
+
}, P = (s) => {
|
|
153
|
+
t.pagination.current_page = s - 1, l("tradePage");
|
|
154
|
+
}, p = () => {
|
|
155
155
|
t.pagination.current_page = e.value - 1, l("tradePage");
|
|
156
|
-
},
|
|
156
|
+
}, o = () => {
|
|
157
157
|
t.pagination.current_page = 0, l("tradePage");
|
|
158
|
-
},
|
|
158
|
+
}, M = () => {
|
|
159
159
|
t.pagination.current_page > 0 && (t.pagination.current_page--, l("tradePage"));
|
|
160
|
-
},
|
|
160
|
+
}, D = S(() => {
|
|
161
161
|
if (e.value <= 7)
|
|
162
|
-
return Array.from({ length: e.value }, (
|
|
163
|
-
const
|
|
162
|
+
return Array.from({ length: e.value }, (u, L) => L + 1);
|
|
163
|
+
const s = t.pagination.current_page + 1, h = e.value, n = /* @__PURE__ */ new Set([
|
|
164
164
|
1,
|
|
165
165
|
2,
|
|
166
166
|
// Sempre mostra as 2 primeiras
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
167
|
+
s - 1,
|
|
168
|
+
s,
|
|
169
|
+
s + 1,
|
|
170
170
|
// Mostra a atual e vizinhas
|
|
171
|
-
|
|
172
|
-
|
|
171
|
+
h - 1,
|
|
172
|
+
h
|
|
173
173
|
// Sempre mostra as 2 últimas
|
|
174
|
-
]),
|
|
175
|
-
let
|
|
176
|
-
return Array.from(
|
|
177
|
-
|
|
178
|
-
}),
|
|
174
|
+
]), v = [];
|
|
175
|
+
let E = 0;
|
|
176
|
+
return Array.from(n).sort((u, L) => u - L).forEach((u) => {
|
|
177
|
+
u < 1 || u > h || (u > E + 1 && v.push("..."), v.push(u), E = u);
|
|
178
|
+
}), v;
|
|
179
179
|
});
|
|
180
|
-
return (
|
|
181
|
-
|
|
182
|
-
e.value > 0 ? (
|
|
183
|
-
|
|
184
|
-
|
|
180
|
+
return (s, h) => t.pagination.count > 0 ? (g(), f("div", Te, [
|
|
181
|
+
c("span", null, " Mostrando de " + F(t.pagination.count !== 0 ? t.pagination.limit_per_page * t.pagination.current_page + 1 : 0) + " até " + F(t.pagination.limit_per_page * (t.pagination.current_page + 1) < t.pagination.count ? t.pagination.limit_per_page * (t.pagination.current_page + 1) : t.pagination.count) + " de " + F(t.pagination.count) + " registros ", 1),
|
|
182
|
+
e.value > 0 ? (g(), f("div", Be, [
|
|
183
|
+
c("div", ze, [
|
|
184
|
+
c("button", {
|
|
185
185
|
class: "btn btn-estilo",
|
|
186
|
-
onClick:
|
|
186
|
+
onClick: A(o, ["prevent"]),
|
|
187
187
|
disabled: t.pagination.current_page === 0,
|
|
188
|
-
innerHTML:
|
|
189
|
-
}, null, 8,
|
|
190
|
-
|
|
188
|
+
innerHTML: Y
|
|
189
|
+
}, null, 8, Fe),
|
|
190
|
+
c("button", {
|
|
191
191
|
class: "btn btn-estilo",
|
|
192
|
-
onClick:
|
|
192
|
+
onClick: A(M, ["prevent"]),
|
|
193
193
|
disabled: t.pagination.current_page === 0,
|
|
194
|
-
innerHTML:
|
|
195
|
-
}, null, 8,
|
|
194
|
+
innerHTML: X
|
|
195
|
+
}, null, 8, He)
|
|
196
196
|
]),
|
|
197
|
-
|
|
198
|
-
(
|
|
199
|
-
typeof
|
|
197
|
+
c("div", Se, [
|
|
198
|
+
(g(!0), f(C, null, $(D.value, (n, v) => (g(), f(C, { key: v }, [
|
|
199
|
+
typeof n == "number" ? (g(), f("button", {
|
|
200
200
|
key: 0,
|
|
201
|
-
class:
|
|
202
|
-
onClick:
|
|
203
|
-
disabled: t.pagination.current_page + 1 ==
|
|
204
|
-
},
|
|
201
|
+
class: U([t.pagination.current_page + 1 == n ? "page-select" : "", "page-estilo"]),
|
|
202
|
+
onClick: A((E) => P(n), ["prevent"]),
|
|
203
|
+
disabled: t.pagination.current_page + 1 == n
|
|
204
|
+
}, F(n), 11, Ae)) : (g(), f("span", Ue, "..."))
|
|
205
205
|
], 64))), 128))
|
|
206
206
|
]),
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
onClick:
|
|
207
|
+
c("div", Ne, [
|
|
208
|
+
c("button", {
|
|
209
|
+
onClick: A(m, ["prevent"]),
|
|
210
210
|
class: "btn btn-estilo rotate-180",
|
|
211
|
-
disabled: !
|
|
212
|
-
innerHTML:
|
|
211
|
+
disabled: !y.value,
|
|
212
|
+
innerHTML: X
|
|
213
213
|
}, null, 8, Oe),
|
|
214
|
-
|
|
215
|
-
onClick:
|
|
214
|
+
c("button", {
|
|
215
|
+
onClick: A(p, ["prevent"]),
|
|
216
216
|
class: "btn btn-estilo rotate-180",
|
|
217
|
-
disabled: !
|
|
218
|
-
innerHTML:
|
|
217
|
+
disabled: !y.value,
|
|
218
|
+
innerHTML: Y
|
|
219
219
|
}, null, 8, Ve)
|
|
220
220
|
])
|
|
221
|
-
])) :
|
|
222
|
-
])) :
|
|
221
|
+
])) : T("", !0)
|
|
222
|
+
])) : T("", !0);
|
|
223
223
|
}
|
|
224
|
-
}),
|
|
224
|
+
}), $e = /* @__PURE__ */ Z(je, [["__scopeId", "data-v-df81be49"]]), qe = /* @__PURE__ */ G({
|
|
225
225
|
__name: "VDataPage",
|
|
226
226
|
props: {
|
|
227
227
|
fetch: {},
|
|
@@ -257,8 +257,8 @@ const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633
|
|
|
257
257
|
watch: { default: () => [] }
|
|
258
258
|
},
|
|
259
259
|
emits: ["tradePage", "beforeFetch", "afterFetch"],
|
|
260
|
-
setup(i, { expose:
|
|
261
|
-
const l = t, e = i,
|
|
260
|
+
setup(i, { expose: _, emit: t }) {
|
|
261
|
+
const l = t, e = i, y = b(!0), m = b(Date.now()), P = b(Date.now()), p = b([]), o = b([]), M = b(0), D = b(!1), s = b(null), h = b(!1), n = b({
|
|
262
262
|
current_page: e.page_starts_at,
|
|
263
263
|
// pagina atual
|
|
264
264
|
count: 0,
|
|
@@ -269,7 +269,7 @@ const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633
|
|
|
269
269
|
// termo de busca
|
|
270
270
|
filter: ""
|
|
271
271
|
// filtro selecionado
|
|
272
|
-
}), { data:
|
|
272
|
+
}), { data: v, pending: E, error: u, execute: L, attempt: Re } = e.fetch(e.endpoint, {
|
|
273
273
|
params: () => e.deactivate_default_params ? e.add_params && typeof e.add_params == "function" ? e.add_params() : {
|
|
274
274
|
...e.add_params
|
|
275
275
|
} : e.add_params && typeof e.add_params == "function" ? {
|
|
@@ -283,216 +283,244 @@ const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633
|
|
|
283
283
|
retryDelay: e.retry_delay,
|
|
284
284
|
paramsReactives: !1,
|
|
285
285
|
immediate: !1
|
|
286
|
-
}, e.fetch_name), q =
|
|
287
|
-
[e.page_param_name]:
|
|
288
|
-
[e.page_size_param_name]:
|
|
289
|
-
[e.search_param_name]:
|
|
290
|
-
[e.filter_param_name]:
|
|
291
|
-
})),
|
|
292
|
-
|
|
293
|
-
|
|
286
|
+
}, e.fetch_name), q = S(() => ({
|
|
287
|
+
[e.page_param_name]: n.value.current_page + 1,
|
|
288
|
+
[e.page_size_param_name]: n.value.limit_per_page,
|
|
289
|
+
[e.search_param_name]: n.value.search || "",
|
|
290
|
+
[e.filter_param_name]: n.value.filter || ""
|
|
291
|
+
})), te = S(() => E.value || D.value);
|
|
292
|
+
z(v, (a) => {
|
|
293
|
+
a ? (p.value = a[e.data_key] || [], M.value = a[e.total_key] || 0, n.value.count = M.value) : (p.value = [], M.value = 0);
|
|
294
294
|
}, { immediate: !0 });
|
|
295
|
-
async function
|
|
296
|
-
if (
|
|
297
|
-
|
|
295
|
+
async function w() {
|
|
296
|
+
if (s.value && clearTimeout(s.value), D.value = !0, s.value = setTimeout(() => {
|
|
297
|
+
D.value = !1;
|
|
298
298
|
}, e.min_loading_delay), e.type_fetch === "infinite-scroll")
|
|
299
|
-
return
|
|
300
|
-
e.type_fetch === "pagination" && (l("beforeFetch"), await
|
|
299
|
+
return L();
|
|
300
|
+
e.type_fetch === "pagination" && (l("beforeFetch"), await L(), l("afterFetch"));
|
|
301
301
|
}
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
302
|
+
let N = 0;
|
|
303
|
+
async function R() {
|
|
304
|
+
N++;
|
|
305
|
+
const a = N;
|
|
306
|
+
p.value = [], o.value = [], n.value.current_page = e.page_starts_at, l("beforeFetch"), await w(), l("afterFetch"), a === N && H(() => {
|
|
307
|
+
if (a !== N)
|
|
308
|
+
return;
|
|
309
|
+
let d = crypto.randomUUID();
|
|
310
|
+
p.value.forEach((r) => {
|
|
311
|
+
r.loading = !0, r.idhashInfiniteLoading = d;
|
|
312
|
+
}), o.value.push(...p.value), setTimeout(() => {
|
|
313
|
+
o.value.forEach((r) => {
|
|
314
|
+
r.idhashInfiniteLoading === d && (r.loading = !1, delete r.idhashInfiniteLoading);
|
|
315
|
+
});
|
|
316
|
+
}, e.min_loading_delay), h.value = !0, m.value++, P.value++;
|
|
305
317
|
});
|
|
306
318
|
}
|
|
307
|
-
function
|
|
308
|
-
|
|
319
|
+
function ae(a) {
|
|
320
|
+
a > 0 ? (n.value.limit_per_page = a, n.value.current_page = 0, w()) : console.warn("O limite deve ser um número maior que zero.");
|
|
309
321
|
}
|
|
310
|
-
function
|
|
311
|
-
|
|
322
|
+
function ne(a) {
|
|
323
|
+
n.value.search = a, n.value.current_page = 0, w();
|
|
312
324
|
}
|
|
313
|
-
function
|
|
314
|
-
|
|
325
|
+
function ie(a) {
|
|
326
|
+
n.value.filter = a, n.value.current_page = 0, w();
|
|
315
327
|
}
|
|
316
|
-
function
|
|
317
|
-
|
|
328
|
+
function le(a) {
|
|
329
|
+
a >= 1 && a <= Math.ceil(n.value.count / n.value.limit_per_page) ? (n.value.current_page = a - 1, w()) : console.warn("Número de página inválido.");
|
|
318
330
|
}
|
|
319
|
-
|
|
320
|
-
execute:
|
|
321
|
-
pagination:
|
|
322
|
-
set_limit_per_page:
|
|
323
|
-
set_search:
|
|
324
|
-
set_filter:
|
|
325
|
-
set_page:
|
|
331
|
+
_({
|
|
332
|
+
execute: w,
|
|
333
|
+
pagination: me(n),
|
|
334
|
+
set_limit_per_page: ae,
|
|
335
|
+
set_search: ne,
|
|
336
|
+
set_filter: ie,
|
|
337
|
+
set_page: le,
|
|
326
338
|
default_params: q
|
|
327
339
|
});
|
|
328
|
-
const
|
|
329
|
-
async function
|
|
330
|
-
if (!
|
|
331
|
-
if (!
|
|
332
|
-
|
|
340
|
+
const J = S(() => v.value?.[e.next_page_response_name] || null);
|
|
341
|
+
async function re(a) {
|
|
342
|
+
if (!h.value) return;
|
|
343
|
+
if (!J.value) {
|
|
344
|
+
a.complete();
|
|
333
345
|
return;
|
|
334
346
|
}
|
|
335
|
-
if (
|
|
336
|
-
|
|
347
|
+
if (n.value.current_page += 1, await L(), u.value) {
|
|
348
|
+
a.error();
|
|
337
349
|
return;
|
|
338
350
|
}
|
|
339
|
-
if (!
|
|
340
|
-
|
|
351
|
+
if (!p.value || p.value.length === 0) {
|
|
352
|
+
a.complete();
|
|
341
353
|
return;
|
|
342
354
|
}
|
|
343
|
-
const
|
|
344
|
-
(
|
|
355
|
+
const d = p.value.filter(
|
|
356
|
+
(k) => !o.value.some((V) => V[e.item_key] === k[e.item_key])
|
|
345
357
|
);
|
|
346
|
-
if (
|
|
347
|
-
|
|
358
|
+
if (d.length === 0 && p.value.length > 0) {
|
|
359
|
+
a.loaded();
|
|
348
360
|
return;
|
|
349
361
|
}
|
|
350
|
-
|
|
351
|
-
|
|
362
|
+
const r = crypto.randomUUID();
|
|
363
|
+
d.forEach((k) => {
|
|
364
|
+
k.loading = !0, k.idhashInfiniteLoading = r;
|
|
365
|
+
}), o.value.push(...d), setTimeout(() => {
|
|
366
|
+
o.value.forEach((k) => {
|
|
367
|
+
k.idhashInfiniteLoading === r && (k.loading = !1, delete k.idhashInfiniteLoading);
|
|
368
|
+
});
|
|
369
|
+
}, e.min_loading_delay), H(() => {
|
|
370
|
+
o.value && o.value.length > n.value.limit_per_page * 2 && o.value.splice(0, n.value.limit_per_page), J.value ? a.loaded() : a.complete(), P.value++;
|
|
352
371
|
});
|
|
353
372
|
}
|
|
354
|
-
async function
|
|
355
|
-
if (!
|
|
356
|
-
if (
|
|
357
|
-
|
|
373
|
+
async function oe(a) {
|
|
374
|
+
if (!h.value) return;
|
|
375
|
+
if (n.value.current_page <= e.page_starts_at) {
|
|
376
|
+
a.complete();
|
|
358
377
|
return;
|
|
359
378
|
}
|
|
360
|
-
const
|
|
361
|
-
if (!
|
|
362
|
-
const
|
|
363
|
-
if (!
|
|
364
|
-
|
|
379
|
+
const d = o.value[0];
|
|
380
|
+
if (!d) return;
|
|
381
|
+
const r = d[e.item_key];
|
|
382
|
+
if (!r) {
|
|
383
|
+
a.error();
|
|
365
384
|
return;
|
|
366
385
|
}
|
|
367
|
-
if (
|
|
368
|
-
|
|
386
|
+
if (n.value.current_page -= 1, await L(), u.value) {
|
|
387
|
+
a.error();
|
|
369
388
|
return;
|
|
370
389
|
}
|
|
371
|
-
if (!
|
|
372
|
-
|
|
390
|
+
if (!p.value || p.value.length === 0) {
|
|
391
|
+
a.loaded();
|
|
373
392
|
return;
|
|
374
393
|
}
|
|
375
|
-
const
|
|
376
|
-
(
|
|
377
|
-
);
|
|
378
|
-
if (
|
|
379
|
-
|
|
394
|
+
const k = p.value.filter(
|
|
395
|
+
(I) => !o.value.some((ue) => ue[e.item_key] === I[e.item_key])
|
|
396
|
+
), V = crypto.randomUUID();
|
|
397
|
+
if (k.forEach((I) => {
|
|
398
|
+
I.loading = !0, I.idhashInfiniteLoading = V;
|
|
399
|
+
}), k.length === 0 && p.value.length > 0) {
|
|
400
|
+
a.loaded();
|
|
380
401
|
return;
|
|
381
402
|
}
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
403
|
+
o.value.unshift(...k), o.value && o.value.length > n.value.limit_per_page * 2 && o.value.splice(-n.value.limit_per_page, n.value.limit_per_page), setTimeout(() => {
|
|
404
|
+
o.value.forEach((I) => {
|
|
405
|
+
I.idhashInfiniteLoading === V && (I.loading = !1, delete I.idhashInfiniteLoading);
|
|
406
|
+
});
|
|
407
|
+
}, e.min_loading_delay), H(() => {
|
|
408
|
+
const I = document.getElementById(e.element_id + r);
|
|
409
|
+
I ? I.scrollIntoView({ behavior: "auto", block: "start" }) : console.warn(`
|
|
385
410
|
Elemento não encontrado para scroll verifique se a propriedade 'element_id' está correta ou não foi definida.
|
|
386
|
-
`),
|
|
411
|
+
`), m.value++, a.loaded();
|
|
387
412
|
});
|
|
388
413
|
}
|
|
389
|
-
const
|
|
390
|
-
e.watch && Array.isArray(e.watch) && e.watch.forEach((
|
|
391
|
-
(
|
|
392
|
-
}),
|
|
414
|
+
const O = [];
|
|
415
|
+
e.watch && Array.isArray(e.watch) && e.watch.forEach((a) => {
|
|
416
|
+
(he(a) || typeof a == "function") && O.push(a);
|
|
417
|
+
}), z(() => n.value.current_page, () => {
|
|
393
418
|
l("tradePage");
|
|
394
|
-
}),
|
|
395
|
-
|
|
396
|
-
}, { deep: !0 }) : e.type_fetch === "infinite-scroll" &&
|
|
397
|
-
|
|
419
|
+
}), O.length > 0 && (e.type_fetch === "pagination" ? z(O, () => {
|
|
420
|
+
n.value.current_page = e.page_starts_at, w();
|
|
421
|
+
}, { deep: !0 }) : e.type_fetch === "infinite-scroll" && z(O, () => {
|
|
422
|
+
h.value = !1, R();
|
|
398
423
|
}, { deep: !0 }));
|
|
399
|
-
function
|
|
400
|
-
l("tradePage"),
|
|
424
|
+
function se() {
|
|
425
|
+
l("tradePage"), w();
|
|
401
426
|
}
|
|
402
|
-
|
|
403
|
-
return B(
|
|
427
|
+
return z(
|
|
404
428
|
() => e.add_params,
|
|
405
429
|
() => {
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
}));
|
|
430
|
+
y.value ? H(() => {
|
|
431
|
+
y.value && e.type_fetch === "infinite-scroll" ? (R(), y.value = !1) : y.value && e.type_fetch === "pagination" && (w(), y.value = !1);
|
|
432
|
+
}) : e.type_fetch === "pagination" ? (n.value.current_page = e.page_starts_at, w()) : e.type_fetch === "infinite-scroll" && (h.value = !1, R());
|
|
409
433
|
},
|
|
410
434
|
{ deep: !0, immediate: !0 }
|
|
411
|
-
), (
|
|
412
|
-
i.type_fetch === "pagination" ? (
|
|
413
|
-
|
|
435
|
+
), (a, d) => (g(), f("div", null, [
|
|
436
|
+
i.type_fetch === "pagination" ? (g(), f(C, { key: 0 }, [
|
|
437
|
+
te.value ? (g(), f("div", {
|
|
414
438
|
key: 0,
|
|
415
|
-
class:
|
|
439
|
+
class: U(e.class_loading_container)
|
|
416
440
|
}, [
|
|
417
|
-
(
|
|
418
|
-
key: "placeholder-" +
|
|
419
|
-
n:
|
|
441
|
+
(g(!0), f(C, null, $(n.value.limit_per_page, (r) => x(a.$slots, "loading", {
|
|
442
|
+
key: "placeholder-" + r,
|
|
443
|
+
n: r
|
|
420
444
|
}, void 0, !0)), 128))
|
|
421
|
-
], 2)) :
|
|
445
|
+
], 2)) : B(u) ? x(a.$slots, "error", {
|
|
422
446
|
key: 1,
|
|
423
|
-
error:
|
|
447
|
+
error: B(u)
|
|
424
448
|
}, () => [
|
|
425
|
-
|
|
449
|
+
d[0] || (d[0] = c("div", {
|
|
426
450
|
class: "alert alert-danger",
|
|
427
451
|
role: "alert"
|
|
428
452
|
}, " Ocorreu um erro ao carregar os dados. ", -1))
|
|
429
|
-
], !0) :
|
|
430
|
-
|
|
453
|
+
], !0) : n.value.count === 0 ? x(a.$slots, "empty", { key: 2 }, () => [
|
|
454
|
+
d[1] || (d[1] = c("div", {
|
|
431
455
|
class: "alert alert-info",
|
|
432
456
|
role: "alert"
|
|
433
457
|
}, " Nenhum registro encontrado. ", -1))
|
|
434
|
-
], !0) : (
|
|
458
|
+
], !0) : (g(), f("div", {
|
|
435
459
|
key: 3,
|
|
436
|
-
class:
|
|
460
|
+
class: U(e.class_container)
|
|
437
461
|
}, [
|
|
438
|
-
(
|
|
439
|
-
key:
|
|
440
|
-
item:
|
|
462
|
+
(g(!0), f(C, null, $(p.value, (r) => x(a.$slots, "body", {
|
|
463
|
+
key: r[e.item_key],
|
|
464
|
+
item: r
|
|
441
465
|
}, void 0, !0)), 128))
|
|
442
466
|
], 2))
|
|
443
|
-
], 64)) : i.type_fetch === "infinite-scroll" ? (
|
|
467
|
+
], 64)) : i.type_fetch === "infinite-scroll" ? (g(), f("div", {
|
|
444
468
|
key: 1,
|
|
445
|
-
class:
|
|
469
|
+
class: U(e.class_container)
|
|
446
470
|
}, [
|
|
447
|
-
|
|
448
|
-
identifier:
|
|
471
|
+
j(B(Q), {
|
|
472
|
+
identifier: P.value,
|
|
449
473
|
direction: "top",
|
|
450
|
-
onInfinite:
|
|
474
|
+
onInfinite: oe
|
|
451
475
|
}, {
|
|
452
|
-
complete:
|
|
453
|
-
|
|
476
|
+
complete: W(() => [...d[2] || (d[2] = [
|
|
477
|
+
c("span", null, null, -1)
|
|
454
478
|
])]),
|
|
455
|
-
spinner:
|
|
456
|
-
|
|
479
|
+
spinner: W(() => [...d[3] || (d[3] = [
|
|
480
|
+
c("span", null, null, -1)
|
|
457
481
|
])]),
|
|
458
482
|
_: 1
|
|
459
483
|
}, 8, ["identifier"]),
|
|
460
|
-
(
|
|
461
|
-
key:
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
484
|
+
(g(!0), f(C, null, $(o.value, (r) => (g(), f(C, {
|
|
485
|
+
key: r[e.item_key]
|
|
486
|
+
}, [
|
|
487
|
+
r.loading ? x(a.$slots, "loading", { key: 1 }, void 0, !0) : x(a.$slots, "body", {
|
|
488
|
+
key: 0,
|
|
489
|
+
item: r
|
|
490
|
+
}, void 0, !0)
|
|
491
|
+
], 64))), 128)),
|
|
492
|
+
j(B(Q), {
|
|
493
|
+
identifier: m.value,
|
|
494
|
+
onInfinite: re
|
|
467
495
|
}, {
|
|
468
|
-
complete:
|
|
469
|
-
x(
|
|
470
|
-
|
|
496
|
+
complete: W(() => [
|
|
497
|
+
x(a.$slots, "scroll-finish", {}, () => [
|
|
498
|
+
d[4] || (d[4] = c("span", { class: "scroll-finish-style" }, " Fim dos registros", -1))
|
|
471
499
|
], !0)
|
|
472
500
|
]),
|
|
473
501
|
_: 3
|
|
474
502
|
}, 8, ["identifier"])
|
|
475
|
-
], 2)) :
|
|
476
|
-
i.type_fetch === "pagination" ? x(
|
|
503
|
+
], 2)) : T("", !0),
|
|
504
|
+
i.type_fetch === "pagination" ? x(a.$slots, "pagination", {
|
|
477
505
|
key: 2,
|
|
478
|
-
pagination:
|
|
479
|
-
tradePage:
|
|
480
|
-
error:
|
|
506
|
+
pagination: n.value,
|
|
507
|
+
tradePage: w,
|
|
508
|
+
error: B(u)
|
|
481
509
|
}, () => [
|
|
482
|
-
!
|
|
510
|
+
!B(u) && n.value.count > 0 ? (g(), f("div", {
|
|
483
511
|
key: 0,
|
|
484
|
-
class:
|
|
512
|
+
class: U(["px-3", e.class_pagination])
|
|
485
513
|
}, [
|
|
486
|
-
|
|
514
|
+
j($e, {
|
|
487
515
|
filtering: !0,
|
|
488
|
-
pagination:
|
|
489
|
-
onTradePage:
|
|
516
|
+
pagination: n.value,
|
|
517
|
+
onTradePage: se
|
|
490
518
|
}, null, 8, ["pagination"])
|
|
491
|
-
], 2)) :
|
|
492
|
-
], !0) :
|
|
519
|
+
], 2)) : T("", !0)
|
|
520
|
+
], !0) : T("", !0)
|
|
493
521
|
]));
|
|
494
522
|
}
|
|
495
|
-
}),
|
|
523
|
+
}), Je = /* @__PURE__ */ Z(qe, [["__scopeId", "data-v-9350c793"]]);
|
|
496
524
|
export {
|
|
497
|
-
|
|
525
|
+
Je as VDataPage
|
|
498
526
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
3
|
<template v-if="type_fetch === 'pagination'" class="">
|
|
4
|
-
|
|
4
|
+
|
|
5
5
|
<template v-if="showLoadingState">
|
|
6
6
|
<div :class="props.class_loading_container">
|
|
7
7
|
<template v-for="n in pagination.limit_per_page" :key="'placeholder-' + n">
|
|
@@ -40,7 +40,10 @@
|
|
|
40
40
|
<template #spinner><span></span></template>
|
|
41
41
|
</InfiniteLoading>
|
|
42
42
|
<template v-for="item in items_infinite" :key="item[props.item_key]">
|
|
43
|
-
<slot name="body" :item="item">
|
|
43
|
+
<slot v-if="!item.loading" name="body" :item="item">
|
|
44
|
+
</slot>
|
|
45
|
+
<slot v-else name="loading">
|
|
46
|
+
|
|
44
47
|
</slot>
|
|
45
48
|
</template>
|
|
46
49
|
<InfiniteLoading :identifier="bottomLoaderId" @infinite="carregarPaginaBottom">
|
|
@@ -305,7 +308,12 @@ async function fetchDataWithDelay(): Promise<void> {
|
|
|
305
308
|
}
|
|
306
309
|
|
|
307
310
|
}
|
|
311
|
+
// Função para inicializar dados no infinite scroll e evitar condições de corrida
|
|
312
|
+
let init_id = 0;
|
|
308
313
|
async function initDataInfinite() {
|
|
314
|
+
init_id++;
|
|
315
|
+
const current_init_id = init_id;
|
|
316
|
+
|
|
309
317
|
items.value = [];
|
|
310
318
|
items_infinite.value = [];
|
|
311
319
|
|
|
@@ -314,15 +322,35 @@ async function initDataInfinite() {
|
|
|
314
322
|
await fetchDataWithDelay();
|
|
315
323
|
emit("afterFetch")
|
|
316
324
|
|
|
325
|
+
if (current_init_id !== init_id) {
|
|
326
|
+
return;
|
|
327
|
+
}
|
|
317
328
|
|
|
318
329
|
nextTick(() => {
|
|
330
|
+
if (current_init_id !== init_id) {
|
|
331
|
+
return;
|
|
332
|
+
}
|
|
333
|
+
let idhashInfiniteLoading = crypto.randomUUID();
|
|
334
|
+
items.value.forEach((item: any) => {
|
|
335
|
+
item.loading = true;
|
|
336
|
+
item.idhashInfiniteLoading = idhashInfiniteLoading;
|
|
337
|
+
});
|
|
319
338
|
items_infinite.value.push(...items.value);
|
|
339
|
+
setTimeout(() => {
|
|
340
|
+
items_infinite.value.forEach((item: any) => {
|
|
341
|
+
if (item.idhashInfiniteLoading === idhashInfiniteLoading) {
|
|
342
|
+
item.loading = false;
|
|
343
|
+
delete item.idhashInfiniteLoading;
|
|
344
|
+
}
|
|
345
|
+
});
|
|
346
|
+
}, props.min_loading_delay)
|
|
320
347
|
dadosInicializados.value = true;
|
|
321
348
|
bottomLoaderId.value++;
|
|
322
349
|
topLoaderId.value++;
|
|
323
350
|
});
|
|
324
351
|
}
|
|
325
352
|
|
|
353
|
+
|
|
326
354
|
// =======================================================
|
|
327
355
|
// 7. EXPOSE E CICLO DE VIDA
|
|
328
356
|
// =======================================================
|
|
@@ -400,8 +428,20 @@ async function carregarPaginaBottom($state: any) {
|
|
|
400
428
|
$state.loaded();
|
|
401
429
|
return;
|
|
402
430
|
}
|
|
403
|
-
|
|
431
|
+
const idhashInfiniteLoading = crypto.randomUUID();
|
|
432
|
+
novosItens.forEach((item: any) => {
|
|
433
|
+
item.loading = true;
|
|
434
|
+
item.idhashInfiniteLoading = idhashInfiniteLoading;
|
|
435
|
+
});
|
|
404
436
|
items_infinite.value.push(...novosItens);
|
|
437
|
+
setTimeout(() => {
|
|
438
|
+
items_infinite.value.forEach((item: any) => {
|
|
439
|
+
if (item.idhashInfiniteLoading === idhashInfiniteLoading) {
|
|
440
|
+
item.loading = false;
|
|
441
|
+
delete item.idhashInfiniteLoading;
|
|
442
|
+
}
|
|
443
|
+
});
|
|
444
|
+
}, props.min_loading_delay)
|
|
405
445
|
|
|
406
446
|
nextTick(() => {
|
|
407
447
|
if (items_infinite.value && items_infinite.value.length > pagination.value.limit_per_page * 2) {
|
|
@@ -431,7 +471,6 @@ async function carregarPaginaTop($state: any) {
|
|
|
431
471
|
$state.error();
|
|
432
472
|
return
|
|
433
473
|
};
|
|
434
|
-
|
|
435
474
|
pagination.value.current_page -= 1;
|
|
436
475
|
await execute();
|
|
437
476
|
|
|
@@ -444,11 +483,17 @@ async function carregarPaginaTop($state: any) {
|
|
|
444
483
|
$state.loaded();
|
|
445
484
|
return;
|
|
446
485
|
}
|
|
447
|
-
|
|
486
|
+
|
|
448
487
|
// --- FILTRAR DUPLICATAS ---
|
|
449
488
|
const novosItens = items.value.filter(
|
|
450
489
|
(novoItem: any) => !items_infinite.value.some(itemExistente => itemExistente[props.item_key] === novoItem[props.item_key])
|
|
451
490
|
);
|
|
491
|
+
const idhashInfiniteLoading = crypto.randomUUID();
|
|
492
|
+
novosItens.forEach((item: any) => {
|
|
493
|
+
item.loading = true;
|
|
494
|
+
item.idhashInfiniteLoading = idhashInfiniteLoading;
|
|
495
|
+
});
|
|
496
|
+
|
|
452
497
|
if (novosItens.length === 0 && items.value.length > 0) {
|
|
453
498
|
$state.loaded();
|
|
454
499
|
return; // Evita adicionar duplicatas
|
|
@@ -459,6 +504,14 @@ async function carregarPaginaTop($state: any) {
|
|
|
459
504
|
if (items_infinite.value && items_infinite.value.length > pagination.value.limit_per_page * 2) {
|
|
460
505
|
items_infinite.value.splice(-pagination.value.limit_per_page, pagination.value.limit_per_page);
|
|
461
506
|
}
|
|
507
|
+
setTimeout(() => {
|
|
508
|
+
items_infinite.value.forEach((item: any) => {
|
|
509
|
+
if (item.idhashInfiniteLoading === idhashInfiniteLoading) {
|
|
510
|
+
item.loading = false;
|
|
511
|
+
delete item.idhashInfiniteLoading;
|
|
512
|
+
}
|
|
513
|
+
});
|
|
514
|
+
}, props.min_loading_delay)
|
|
462
515
|
nextTick(() => {
|
|
463
516
|
|
|
464
517
|
const elementoAlvo = document.getElementById(props.element_id + id_primeiro_artigo);
|
|
@@ -505,12 +558,15 @@ function tradePageEmit() {
|
|
|
505
558
|
emit("tradePage");
|
|
506
559
|
fetchDataWithDelay();
|
|
507
560
|
}
|
|
508
|
-
|
|
561
|
+
// watch(() => showLoadingState.value, (newVal) => {
|
|
562
|
+
|
|
563
|
+
// });
|
|
564
|
+
|
|
509
565
|
watch(
|
|
510
566
|
() => props.add_params,
|
|
511
567
|
() => {
|
|
512
|
-
if (
|
|
513
|
-
|
|
568
|
+
if (first_fetch.value) {
|
|
569
|
+
|
|
514
570
|
nextTick(() => {
|
|
515
571
|
/*
|
|
516
572
|
* executar dentro do nextTick para garantir que o pai já tem acesso ao
|