v-sistec-features 1.3.3 → 1.4.0
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 +251 -224
- package/package.json +1 -1
- package/src/DataPageVue/components/VDataPage.vue +42 -10
|
@@ -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-2f622d4b]{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
|
|
1
|
+
import { defineComponent as W, ref as y, toRefs as ue, createElementBlock as p, watch as B, onMounted as ce, onUnmounted as pe, openBlock as d, withDirectives as de, renderSlot as x, createCommentVNode as C, createElementVNode as s, createVNode as V, vShow as fe, toDisplayString as D, nextTick as T, pushScopeId as _e, popScopeId as ge, computed as F, withModifiers as H, Fragment as z, renderList as j, normalizeClass as S, readonly as ve, isRef as me, unref as L, withCtx as R } from "vue";
|
|
2
2
|
import { _ as X } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
3
|
-
function
|
|
4
|
-
if (!
|
|
3
|
+
function he(i, f = null) {
|
|
4
|
+
if (!i)
|
|
5
5
|
return !1;
|
|
6
|
-
const t =
|
|
6
|
+
const t = i.getBoundingClientRect(), l = f ? f.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
|
|
9
|
+
async function ye(i) {
|
|
10
|
+
return i ? (await T(), i.value instanceof HTMLElement ? i.value : i.value ? document.querySelector(i.value) : null) : null;
|
|
11
11
|
}
|
|
12
|
-
function
|
|
13
|
-
let
|
|
14
|
-
|
|
12
|
+
function be(i) {
|
|
13
|
+
let f = `0px 0px ${i.distance}px 0px`;
|
|
14
|
+
i.top && (f = `${i.distance}px 0px 0px 0px`);
|
|
15
15
|
const t = new IntersectionObserver(
|
|
16
16
|
(l) => {
|
|
17
|
-
l[0].isIntersecting && (
|
|
17
|
+
l[0].isIntersecting && (i.firstload && i.emit(), i.firstload = !0);
|
|
18
18
|
},
|
|
19
|
-
{ root:
|
|
19
|
+
{ root: i.parentEl, rootMargin: f }
|
|
20
20
|
);
|
|
21
|
-
return
|
|
21
|
+
return i.infiniteLoading.value && t.observe(i.infiniteLoading.value), t;
|
|
22
22
|
}
|
|
23
|
-
async function
|
|
24
|
-
if (await
|
|
23
|
+
async function J(i, f) {
|
|
24
|
+
if (await T(), !i.top)
|
|
25
25
|
return;
|
|
26
|
-
const t =
|
|
27
|
-
t.scrollTop = t.scrollHeight -
|
|
26
|
+
const t = i.parentEl || document.documentElement;
|
|
27
|
+
t.scrollTop = t.scrollHeight - f;
|
|
28
28
|
}
|
|
29
|
-
const Z = (
|
|
30
|
-
const t =
|
|
31
|
-
for (const [l, e] of
|
|
29
|
+
const Z = (i, f) => {
|
|
30
|
+
const t = i.__vccOpts || i;
|
|
31
|
+
for (const [l, e] of f)
|
|
32
32
|
t[l] = e;
|
|
33
33
|
return t;
|
|
34
|
-
},
|
|
35
|
-
|
|
34
|
+
}, ke = {}, we = (i) => (_e("data-v-d3e37633"), i = i(), ge(), i), xe = { class: "container" }, Pe = /* @__PURE__ */ we(() => /* @__PURE__ */ s("div", { class: "spinner" }, null, -1)), Ie = [
|
|
35
|
+
Pe
|
|
36
36
|
];
|
|
37
|
-
function
|
|
38
|
-
return
|
|
37
|
+
function Ee(i, f) {
|
|
38
|
+
return d(), p("div", xe, Ie);
|
|
39
39
|
}
|
|
40
|
-
const
|
|
40
|
+
const Me = /* @__PURE__ */ Z(ke, [["render", Ee], ["__scopeId", "data-v-d3e37633"]]), Ce = { class: "state-error" }, Le = /* @__PURE__ */ W({
|
|
41
41
|
__name: "InfiniteLoading",
|
|
42
42
|
props: {
|
|
43
43
|
top: { type: Boolean, default: !1 },
|
|
@@ -48,83 +48,83 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__scopeId", "data-v-d3e37633
|
|
|
48
48
|
slots: {}
|
|
49
49
|
},
|
|
50
50
|
emits: ["infinite"],
|
|
51
|
-
setup(
|
|
52
|
-
const t =
|
|
51
|
+
setup(i, { emit: f }) {
|
|
52
|
+
const t = i;
|
|
53
53
|
let l = null, e = 0;
|
|
54
|
-
const
|
|
55
|
-
infiniteLoading:
|
|
56
|
-
top:
|
|
57
|
-
firstload:
|
|
58
|
-
distance:
|
|
54
|
+
const b = y(null), v = y(""), { top: I, firstload: c, distance: u } = t, { identifier: E, target: M } = ue(t), r = {
|
|
55
|
+
infiniteLoading: b,
|
|
56
|
+
top: I,
|
|
57
|
+
firstload: c,
|
|
58
|
+
distance: u,
|
|
59
59
|
parentEl: null,
|
|
60
60
|
emit() {
|
|
61
|
-
e = (r.parentEl || document.documentElement).scrollHeight,
|
|
61
|
+
e = (r.parentEl || document.documentElement).scrollHeight, m.loading(), f("infinite", m);
|
|
62
62
|
}
|
|
63
|
-
},
|
|
63
|
+
}, m = {
|
|
64
64
|
loading() {
|
|
65
|
-
|
|
65
|
+
v.value = "loading";
|
|
66
66
|
},
|
|
67
67
|
async loaded() {
|
|
68
|
-
|
|
68
|
+
v.value = "loaded", await J(r, e), he(b.value, r.parentEl) && r.emit();
|
|
69
69
|
},
|
|
70
70
|
async complete() {
|
|
71
|
-
|
|
71
|
+
v.value = "complete", await J(r, e), l?.disconnect();
|
|
72
72
|
},
|
|
73
73
|
error() {
|
|
74
|
-
|
|
74
|
+
v.value = "error";
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
77
|
function a() {
|
|
78
|
-
l?.disconnect(), l =
|
|
78
|
+
l?.disconnect(), l = be(r);
|
|
79
79
|
}
|
|
80
|
-
return B(
|
|
81
|
-
r.parentEl = await
|
|
82
|
-
}),
|
|
80
|
+
return B(E, a), ce(async () => {
|
|
81
|
+
r.parentEl = await ye(M), a();
|
|
82
|
+
}), pe(() => l?.disconnect()), (g, P) => (d(), p("div", {
|
|
83
83
|
ref_key: "infiniteLoading",
|
|
84
|
-
ref:
|
|
84
|
+
ref: b,
|
|
85
85
|
class: "v3-infinite-loading"
|
|
86
86
|
}, [
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
87
|
+
de(s("div", null, [
|
|
88
|
+
x(g.$slots, "spinner", {}, () => [
|
|
89
|
+
V(Me)
|
|
90
90
|
], !0)
|
|
91
91
|
], 512), [
|
|
92
|
-
[
|
|
92
|
+
[fe, v.value == "loading"]
|
|
93
93
|
]),
|
|
94
|
-
|
|
94
|
+
v.value == "complete" ? x(g.$slots, "complete", { key: 0 }, () => {
|
|
95
95
|
var o;
|
|
96
96
|
return [
|
|
97
|
-
|
|
97
|
+
s("span", null, D(((o = g.slots) == null ? void 0 : o.complete) || "No more results!"), 1)
|
|
98
98
|
];
|
|
99
|
-
}, !0) :
|
|
100
|
-
|
|
99
|
+
}, !0) : C("", !0),
|
|
100
|
+
v.value == "error" ? x(g.$slots, "error", {
|
|
101
101
|
key: 1,
|
|
102
102
|
retry: r.emit
|
|
103
103
|
}, () => {
|
|
104
104
|
var o;
|
|
105
105
|
return [
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
106
|
+
s("span", Ce, [
|
|
107
|
+
s("span", null, D(((o = g.slots) == null ? void 0 : o.error) || "Oops something went wrong!"), 1),
|
|
108
|
+
s("button", {
|
|
109
109
|
class: "retry",
|
|
110
110
|
onClick: P[0] || (P[0] = //@ts-ignore
|
|
111
|
-
(...
|
|
111
|
+
(...w) => r.emit && r.emit(...w))
|
|
112
112
|
}, "retry")
|
|
113
113
|
])
|
|
114
114
|
];
|
|
115
|
-
}, !0) :
|
|
115
|
+
}, !0) : C("", !0)
|
|
116
116
|
], 512));
|
|
117
117
|
}
|
|
118
|
-
}),
|
|
118
|
+
}), K = /* @__PURE__ */ Z(Le, [["__scopeId", "data-v-4bdee133"]]), Be = {
|
|
119
119
|
key: 0,
|
|
120
120
|
class: "d-flex align-items-center justify-content-between w-100"
|
|
121
|
-
},
|
|
121
|
+
}, De = {
|
|
122
122
|
key: 0,
|
|
123
123
|
class: "d-flex align-items-center gap-2"
|
|
124
|
-
},
|
|
124
|
+
}, Te = { class: "d-flex" }, ze = ["disabled"], Fe = ["disabled"], He = { class: "d-flex gap-2" }, Se = ["onClick", "disabled"], Ae = {
|
|
125
125
|
key: 1,
|
|
126
126
|
class: "m-0 p-0"
|
|
127
|
-
},
|
|
127
|
+
}, Ne = { class: "d-flex" }, Oe = ["disabled"], Ve = ["disabled"], Q = `
|
|
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,35 +132,35 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__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
|
+
`, Y = `
|
|
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
|
-
`,
|
|
142
|
+
`, je = /* @__PURE__ */ W({
|
|
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(
|
|
150
|
-
const t =
|
|
149
|
+
setup(i, { emit: f }) {
|
|
150
|
+
const t = i, l = f, e = F(() => t.pagination.limit_per_page ? Math.ceil(t.pagination.count / t.pagination.limit_per_page) : 0), b = F(() => t.pagination.current_page + 1 < e.value ? t.pagination.current_page + 1 : null), v = () => {
|
|
151
151
|
t.pagination.current_page++, l("tradePage");
|
|
152
|
-
},
|
|
152
|
+
}, I = (r) => {
|
|
153
153
|
t.pagination.current_page = r - 1, l("tradePage");
|
|
154
|
-
},
|
|
154
|
+
}, c = () => {
|
|
155
155
|
t.pagination.current_page = e.value - 1, l("tradePage");
|
|
156
|
-
},
|
|
156
|
+
}, u = () => {
|
|
157
157
|
t.pagination.current_page = 0, l("tradePage");
|
|
158
|
-
},
|
|
158
|
+
}, E = () => {
|
|
159
159
|
t.pagination.current_page > 0 && (t.pagination.current_page--, l("tradePage"));
|
|
160
|
-
},
|
|
160
|
+
}, M = F(() => {
|
|
161
161
|
if (e.value <= 7)
|
|
162
|
-
return Array.from({ length: e.value }, (o,
|
|
163
|
-
const r = t.pagination.current_page + 1,
|
|
162
|
+
return Array.from({ length: e.value }, (o, w) => w + 1);
|
|
163
|
+
const r = t.pagination.current_page + 1, m = e.value, a = /* @__PURE__ */ new Set([
|
|
164
164
|
1,
|
|
165
165
|
2,
|
|
166
166
|
// Sempre mostra as 2 primeiras
|
|
@@ -168,60 +168,60 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__scopeId", "data-v-d3e37633
|
|
|
168
168
|
r,
|
|
169
169
|
r + 1,
|
|
170
170
|
// Mostra a atual e vizinhas
|
|
171
|
-
|
|
172
|
-
|
|
171
|
+
m - 1,
|
|
172
|
+
m
|
|
173
173
|
// Sempre mostra as 2 últimas
|
|
174
|
-
]),
|
|
174
|
+
]), g = [];
|
|
175
175
|
let P = 0;
|
|
176
|
-
return Array.from(a).sort((o,
|
|
177
|
-
o < 1 || o >
|
|
178
|
-
}),
|
|
176
|
+
return Array.from(a).sort((o, w) => o - w).forEach((o) => {
|
|
177
|
+
o < 1 || o > m || (o > P + 1 && g.push("..."), g.push(o), P = o);
|
|
178
|
+
}), g;
|
|
179
179
|
});
|
|
180
|
-
return (r,
|
|
181
|
-
|
|
182
|
-
e.value > 0 ? (
|
|
183
|
-
|
|
184
|
-
|
|
180
|
+
return (r, m) => t.pagination.count > 0 ? (d(), p("div", Be, [
|
|
181
|
+
s("span", null, " Mostrando de " + D(t.pagination.count !== 0 ? t.pagination.limit_per_page * t.pagination.current_page + 1 : 0) + " até " + D(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 " + D(t.pagination.count) + " registros ", 1),
|
|
182
|
+
e.value > 0 ? (d(), p("div", De, [
|
|
183
|
+
s("div", Te, [
|
|
184
|
+
s("button", {
|
|
185
185
|
class: "btn btn-estilo",
|
|
186
|
-
onClick:
|
|
186
|
+
onClick: H(u, ["prevent"]),
|
|
187
187
|
disabled: t.pagination.current_page === 0,
|
|
188
|
-
innerHTML:
|
|
189
|
-
}, null, 8,
|
|
190
|
-
|
|
188
|
+
innerHTML: Q
|
|
189
|
+
}, null, 8, ze),
|
|
190
|
+
s("button", {
|
|
191
191
|
class: "btn btn-estilo",
|
|
192
|
-
onClick:
|
|
192
|
+
onClick: H(E, ["prevent"]),
|
|
193
193
|
disabled: t.pagination.current_page === 0,
|
|
194
|
-
innerHTML:
|
|
195
|
-
}, null, 8,
|
|
194
|
+
innerHTML: Y
|
|
195
|
+
}, null, 8, Fe)
|
|
196
196
|
]),
|
|
197
|
-
|
|
198
|
-
(
|
|
199
|
-
typeof a == "number" ? (
|
|
197
|
+
s("div", He, [
|
|
198
|
+
(d(!0), p(z, null, j(M.value, (a, g) => (d(), p(z, { key: g }, [
|
|
199
|
+
typeof a == "number" ? (d(), p("button", {
|
|
200
200
|
key: 0,
|
|
201
|
-
class:
|
|
202
|
-
onClick:
|
|
201
|
+
class: S([t.pagination.current_page + 1 == a ? "page-select" : "", "page-estilo"]),
|
|
202
|
+
onClick: H((P) => I(a), ["prevent"]),
|
|
203
203
|
disabled: t.pagination.current_page + 1 == a
|
|
204
|
-
}, D(a), 11,
|
|
204
|
+
}, D(a), 11, Se)) : (d(), p("span", Ae, "..."))
|
|
205
205
|
], 64))), 128))
|
|
206
206
|
]),
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
onClick:
|
|
207
|
+
s("div", Ne, [
|
|
208
|
+
s("button", {
|
|
209
|
+
onClick: H(v, ["prevent"]),
|
|
210
210
|
class: "btn btn-estilo rotate-180",
|
|
211
|
-
disabled: !
|
|
212
|
-
innerHTML: $
|
|
213
|
-
}, null, 8, Ae),
|
|
214
|
-
c("button", {
|
|
215
|
-
onClick: T(u, ["prevent"]),
|
|
216
|
-
class: "btn btn-estilo rotate-180",
|
|
217
|
-
disabled: !y.value,
|
|
211
|
+
disabled: !b.value,
|
|
218
212
|
innerHTML: Y
|
|
219
|
-
}, null, 8,
|
|
213
|
+
}, null, 8, Oe),
|
|
214
|
+
s("button", {
|
|
215
|
+
onClick: H(c, ["prevent"]),
|
|
216
|
+
class: "btn btn-estilo rotate-180",
|
|
217
|
+
disabled: !b.value,
|
|
218
|
+
innerHTML: Q
|
|
219
|
+
}, null, 8, Ve)
|
|
220
220
|
])
|
|
221
|
-
])) :
|
|
222
|
-
])) :
|
|
221
|
+
])) : C("", !0)
|
|
222
|
+
])) : C("", !0);
|
|
223
223
|
}
|
|
224
|
-
}),
|
|
224
|
+
}), qe = /* @__PURE__ */ X(je, [["__scopeId", "data-v-df81be49"]]), $e = /* @__PURE__ */ W({
|
|
225
225
|
__name: "VDataPage",
|
|
226
226
|
props: {
|
|
227
227
|
fetch: {},
|
|
@@ -242,6 +242,7 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__scopeId", "data-v-d3e37633
|
|
|
242
242
|
first_text_page_size: { default: "Mostrar" },
|
|
243
243
|
second_text_page_size: { default: "registros" },
|
|
244
244
|
class_container: { default: "" },
|
|
245
|
+
class_loading_container: { default: "" },
|
|
245
246
|
class_pagination: { default: "" },
|
|
246
247
|
class_filters: { default: "" },
|
|
247
248
|
min_loading_delay: { default: 600 },
|
|
@@ -256,8 +257,8 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__scopeId", "data-v-d3e37633
|
|
|
256
257
|
watch: { default: () => [] }
|
|
257
258
|
},
|
|
258
259
|
emits: ["tradePage", "beforeFetch", "afterFetch"],
|
|
259
|
-
setup(
|
|
260
|
-
const l = t, e =
|
|
260
|
+
setup(i, { expose: f, emit: t }) {
|
|
261
|
+
const l = t, e = i, b = y(!0), v = y(Date.now()), I = y(Date.now()), c = y([]), u = y([]), E = y(0), M = y(!1), r = y(null), m = y(!1), a = y({
|
|
261
262
|
current_page: e.page_starts_at,
|
|
262
263
|
// pagina atual
|
|
263
264
|
count: 0,
|
|
@@ -268,204 +269,230 @@ const Pe = /* @__PURE__ */ Z(ye, [["render", Ie], ["__scopeId", "data-v-d3e37633
|
|
|
268
269
|
// termo de busca
|
|
269
270
|
filter: ""
|
|
270
271
|
// filtro selecionado
|
|
271
|
-
}), { data:
|
|
272
|
+
}), { data: g, pending: P, error: o, execute: w, attempt: Re } = e.fetch(e.endpoint, {
|
|
272
273
|
params: () => e.deactivate_default_params ? e.add_params && typeof e.add_params == "function" ? e.add_params() : {
|
|
273
274
|
...e.add_params
|
|
274
275
|
} : e.add_params && typeof e.add_params == "function" ? {
|
|
275
|
-
...
|
|
276
|
+
...q.value,
|
|
276
277
|
...e.add_params()
|
|
277
278
|
} : {
|
|
278
|
-
...
|
|
279
|
+
...q.value,
|
|
279
280
|
...e.add_params
|
|
280
281
|
},
|
|
281
282
|
retry: e.retry_attempts,
|
|
282
283
|
retryDelay: e.retry_delay,
|
|
283
284
|
paramsReactives: !1,
|
|
284
285
|
immediate: !1
|
|
285
|
-
}, e.fetch_name),
|
|
286
|
+
}, e.fetch_name), q = F(() => ({
|
|
286
287
|
[e.page_param_name]: a.value.current_page + 1,
|
|
287
288
|
[e.page_size_param_name]: a.value.limit_per_page,
|
|
288
289
|
[e.search_param_name]: a.value.search || "",
|
|
289
290
|
[e.filter_param_name]: a.value.filter || ""
|
|
290
|
-
}));
|
|
291
|
-
B(
|
|
292
|
-
|
|
291
|
+
})), ee = F(() => P.value || M.value);
|
|
292
|
+
B(g, (n) => {
|
|
293
|
+
n ? (c.value = n[e.data_key] || [], E.value = n[e.total_key] || 0, a.value.count = E.value) : (c.value = [], E.value = 0);
|
|
293
294
|
}, { immediate: !0 });
|
|
294
|
-
async function
|
|
295
|
-
if (r.value && clearTimeout(r.value),
|
|
296
|
-
|
|
295
|
+
async function k() {
|
|
296
|
+
if (r.value && clearTimeout(r.value), M.value = !0, r.value = setTimeout(() => {
|
|
297
|
+
M.value = !1;
|
|
297
298
|
}, e.min_loading_delay), e.type_fetch === "infinite-scroll")
|
|
298
|
-
return
|
|
299
|
-
e.type_fetch === "pagination" && (l("beforeFetch"), await
|
|
299
|
+
return w();
|
|
300
|
+
e.type_fetch === "pagination" && (l("beforeFetch"), await w(), l("afterFetch"));
|
|
300
301
|
}
|
|
301
|
-
async function
|
|
302
|
-
|
|
303
|
-
|
|
302
|
+
async function $() {
|
|
303
|
+
c.value = [], u.value = [], a.value.current_page = e.page_starts_at, l("beforeFetch"), await k(), l("afterFetch"), T(() => {
|
|
304
|
+
u.value.push(...c.value), m.value = !0, v.value++, I.value++;
|
|
304
305
|
});
|
|
305
306
|
}
|
|
306
|
-
function
|
|
307
|
-
|
|
307
|
+
function te(n) {
|
|
308
|
+
n > 0 ? (a.value.limit_per_page = n, a.value.current_page = 0, k()) : console.warn("O limite deve ser um número maior que zero.");
|
|
308
309
|
}
|
|
309
|
-
function
|
|
310
|
-
a.value.search =
|
|
310
|
+
function ae(n) {
|
|
311
|
+
a.value.search = n, a.value.current_page = 0, k();
|
|
311
312
|
}
|
|
312
|
-
function
|
|
313
|
-
a.value.filter =
|
|
313
|
+
function ne(n) {
|
|
314
|
+
a.value.filter = n, a.value.current_page = 0, k();
|
|
314
315
|
}
|
|
315
|
-
function
|
|
316
|
-
|
|
316
|
+
function ie(n) {
|
|
317
|
+
n >= 1 && n <= Math.ceil(a.value.count / a.value.limit_per_page) ? (a.value.current_page = n - 1, k()) : console.warn("Número de página inválido.");
|
|
317
318
|
}
|
|
318
|
-
|
|
319
|
-
execute:
|
|
320
|
-
pagination:
|
|
321
|
-
set_limit_per_page:
|
|
322
|
-
set_search:
|
|
323
|
-
set_filter:
|
|
324
|
-
set_page:
|
|
325
|
-
default_params:
|
|
319
|
+
f({
|
|
320
|
+
execute: k,
|
|
321
|
+
pagination: ve(a),
|
|
322
|
+
set_limit_per_page: te,
|
|
323
|
+
set_search: ae,
|
|
324
|
+
set_filter: ne,
|
|
325
|
+
set_page: ie,
|
|
326
|
+
default_params: q
|
|
326
327
|
});
|
|
327
|
-
const
|
|
328
|
-
async function
|
|
329
|
-
if (!
|
|
330
|
-
if (!
|
|
331
|
-
|
|
328
|
+
const U = F(() => g.value?.[e.next_page_response_name] || null);
|
|
329
|
+
async function le(n) {
|
|
330
|
+
if (!m.value) return;
|
|
331
|
+
if (!U.value) {
|
|
332
|
+
n.complete();
|
|
332
333
|
return;
|
|
333
334
|
}
|
|
334
|
-
if (a.value.current_page += 1, await
|
|
335
|
-
|
|
335
|
+
if (a.value.current_page += 1, await w(), o.value) {
|
|
336
|
+
n.error();
|
|
336
337
|
return;
|
|
337
338
|
}
|
|
338
|
-
if (!
|
|
339
|
-
|
|
339
|
+
if (!c.value || c.value.length === 0) {
|
|
340
|
+
n.complete();
|
|
340
341
|
return;
|
|
341
342
|
}
|
|
342
|
-
const
|
|
343
|
-
(
|
|
343
|
+
const _ = c.value.filter(
|
|
344
|
+
(h) => !u.value.some((N) => N[e.item_key] === h[e.item_key])
|
|
344
345
|
);
|
|
345
|
-
if (
|
|
346
|
-
|
|
346
|
+
if (_.length === 0 && c.value.length > 0) {
|
|
347
|
+
n.loaded();
|
|
347
348
|
return;
|
|
348
349
|
}
|
|
349
|
-
|
|
350
|
-
|
|
350
|
+
u.value.push(..._), T(() => {
|
|
351
|
+
u.value && u.value.length > a.value.limit_per_page * 2 && u.value.splice(0, a.value.limit_per_page), U.value ? n.loaded() : n.complete(), I.value++;
|
|
351
352
|
});
|
|
352
353
|
}
|
|
353
|
-
async function
|
|
354
|
-
if (!
|
|
354
|
+
async function re(n) {
|
|
355
|
+
if (!m.value) return;
|
|
355
356
|
if (a.value.current_page <= e.page_starts_at) {
|
|
356
|
-
|
|
357
|
+
n.complete();
|
|
357
358
|
return;
|
|
358
359
|
}
|
|
359
|
-
const
|
|
360
|
-
if (!
|
|
361
|
-
const
|
|
362
|
-
if (!
|
|
363
|
-
|
|
360
|
+
const _ = u.value[0];
|
|
361
|
+
if (!_) return;
|
|
362
|
+
const h = _[e.item_key];
|
|
363
|
+
if (!h) {
|
|
364
|
+
n.error();
|
|
364
365
|
return;
|
|
365
366
|
}
|
|
366
|
-
if (a.value.current_page -= 1, await
|
|
367
|
-
|
|
367
|
+
if (a.value.current_page -= 1, await w(), o.value) {
|
|
368
|
+
n.error();
|
|
368
369
|
return;
|
|
369
370
|
}
|
|
370
|
-
if (!
|
|
371
|
-
|
|
371
|
+
if (!c.value || c.value.length === 0) {
|
|
372
|
+
n.loaded();
|
|
372
373
|
return;
|
|
373
374
|
}
|
|
374
|
-
const
|
|
375
|
-
(
|
|
375
|
+
const N = c.value.filter(
|
|
376
|
+
(O) => !u.value.some((se) => se[e.item_key] === O[e.item_key])
|
|
376
377
|
);
|
|
377
|
-
if (
|
|
378
|
-
|
|
378
|
+
if (N.length === 0 && c.value.length > 0) {
|
|
379
|
+
n.loaded();
|
|
379
380
|
return;
|
|
380
381
|
}
|
|
381
|
-
|
|
382
|
-
const
|
|
383
|
-
|
|
382
|
+
u.value.unshift(...N), u.value && u.value.length > a.value.limit_per_page * 2 && u.value.splice(-a.value.limit_per_page, a.value.limit_per_page), T(() => {
|
|
383
|
+
const O = document.getElementById(e.element_id + h);
|
|
384
|
+
O ? O.scrollIntoView({ behavior: "auto", block: "start" }) : console.warn(`
|
|
384
385
|
Elemento não encontrado para scroll verifique se a propriedade 'element_id' está correta ou não foi definida.
|
|
385
|
-
`),
|
|
386
|
+
`), v.value++, n.loaded();
|
|
386
387
|
});
|
|
387
388
|
}
|
|
388
|
-
const
|
|
389
|
-
e.watch && Array.isArray(e.watch) && e.watch.forEach((
|
|
390
|
-
(
|
|
389
|
+
const A = [];
|
|
390
|
+
e.watch && Array.isArray(e.watch) && e.watch.forEach((n) => {
|
|
391
|
+
(me(n) || typeof n == "function") && A.push(n);
|
|
391
392
|
}), B(() => a.value.current_page, () => {
|
|
392
393
|
l("tradePage");
|
|
393
|
-
}),
|
|
394
|
-
a.value.current_page = e.page_starts_at,
|
|
395
|
-
}, { deep: !0 }) : e.type_fetch === "infinite-scroll" && B(
|
|
396
|
-
|
|
394
|
+
}), A.length > 0 && (e.type_fetch === "pagination" ? B(A, () => {
|
|
395
|
+
a.value.current_page = e.page_starts_at, k();
|
|
396
|
+
}, { deep: !0 }) : e.type_fetch === "infinite-scroll" && B(A, () => {
|
|
397
|
+
m.value = !1, $();
|
|
397
398
|
}, { deep: !0 }));
|
|
398
|
-
|
|
399
|
+
function oe() {
|
|
400
|
+
l("tradePage"), k();
|
|
401
|
+
}
|
|
402
|
+
const G = y(!1);
|
|
399
403
|
return B(
|
|
400
404
|
() => e.add_params,
|
|
401
405
|
() => {
|
|
402
|
-
|
|
403
|
-
|
|
406
|
+
G.value ? e.type_fetch === "pagination" ? (a.value.current_page = e.page_starts_at, k()) : e.type_fetch === "infinite-scroll" && (m.value = !1, $()) : (G.value = !0, T(() => {
|
|
407
|
+
b.value && e.type_fetch === "infinite-scroll" ? ($(), b.value = !1) : b.value && e.type_fetch === "pagination" && (k(), b.value = !1);
|
|
404
408
|
}));
|
|
405
409
|
},
|
|
406
410
|
{ deep: !0, immediate: !0 }
|
|
407
|
-
), (
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
411
|
+
), (n, _) => (d(), p("div", null, [
|
|
412
|
+
i.type_fetch === "pagination" ? (d(), p(z, { key: 0 }, [
|
|
413
|
+
ee.value ? (d(), p("div", {
|
|
414
|
+
key: 0,
|
|
415
|
+
class: S(e.class_loading_container)
|
|
416
|
+
}, [
|
|
417
|
+
(d(!0), p(z, null, j(a.value.limit_per_page, (h) => x(n.$slots, "loading", {
|
|
418
|
+
key: "placeholder-" + h,
|
|
419
|
+
n: h
|
|
420
|
+
}, void 0, !0)), 128))
|
|
421
|
+
], 2)) : L(o) ? x(n.$slots, "error", {
|
|
422
|
+
key: 1,
|
|
423
|
+
error: L(o)
|
|
424
|
+
}, () => [
|
|
425
|
+
_[0] || (_[0] = s("div", {
|
|
426
|
+
class: "alert alert-danger",
|
|
427
|
+
role: "alert"
|
|
428
|
+
}, " Ocorreu um erro ao carregar os dados. ", -1))
|
|
429
|
+
], !0) : a.value.count === 0 ? x(n.$slots, "empty", { key: 2 }, () => [
|
|
430
|
+
_[1] || (_[1] = s("div", {
|
|
431
|
+
class: "alert alert-info",
|
|
432
|
+
role: "alert"
|
|
433
|
+
}, " Nenhum registro encontrado. ", -1))
|
|
434
|
+
], !0) : (d(), p("div", {
|
|
435
|
+
key: 3,
|
|
436
|
+
class: S(e.class_container)
|
|
437
|
+
}, [
|
|
438
|
+
(d(!0), p(z, null, j(c.value, (h) => x(n.$slots, "body", {
|
|
439
|
+
key: h[e.item_key],
|
|
440
|
+
item: h
|
|
441
|
+
}, void 0, !0)), 128))
|
|
442
|
+
], 2))
|
|
443
|
+
], 64)) : i.type_fetch === "infinite-scroll" ? (d(), p("div", {
|
|
417
444
|
key: 1,
|
|
418
|
-
class:
|
|
445
|
+
class: S(e.class_container)
|
|
419
446
|
}, [
|
|
420
|
-
|
|
421
|
-
identifier:
|
|
447
|
+
V(L(K), {
|
|
448
|
+
identifier: I.value,
|
|
422
449
|
direction: "top",
|
|
423
|
-
onInfinite:
|
|
450
|
+
onInfinite: re
|
|
424
451
|
}, {
|
|
425
|
-
complete: R(() => [...
|
|
426
|
-
|
|
452
|
+
complete: R(() => [..._[2] || (_[2] = [
|
|
453
|
+
s("span", null, null, -1)
|
|
427
454
|
])]),
|
|
428
|
-
spinner: R(() => [...
|
|
429
|
-
|
|
455
|
+
spinner: R(() => [..._[3] || (_[3] = [
|
|
456
|
+
s("span", null, null, -1)
|
|
430
457
|
])]),
|
|
431
458
|
_: 1
|
|
432
459
|
}, 8, ["identifier"]),
|
|
433
|
-
(
|
|
434
|
-
key:
|
|
435
|
-
item:
|
|
460
|
+
(d(!0), p(z, null, j(u.value, (h) => x(n.$slots, "body", {
|
|
461
|
+
key: h[e.item_key],
|
|
462
|
+
item: h
|
|
436
463
|
}, void 0, !0)), 128)),
|
|
437
|
-
|
|
438
|
-
identifier:
|
|
439
|
-
onInfinite:
|
|
464
|
+
V(L(K), {
|
|
465
|
+
identifier: v.value,
|
|
466
|
+
onInfinite: le
|
|
440
467
|
}, {
|
|
441
468
|
complete: R(() => [
|
|
442
|
-
|
|
443
|
-
|
|
469
|
+
x(n.$slots, "scroll-finish", {}, () => [
|
|
470
|
+
_[4] || (_[4] = s("span", { class: "scroll-finish-style" }, " Fim dos registros", -1))
|
|
444
471
|
], !0)
|
|
445
472
|
]),
|
|
446
473
|
_: 3
|
|
447
474
|
}, 8, ["identifier"])
|
|
448
|
-
], 2)) :
|
|
449
|
-
|
|
475
|
+
], 2)) : C("", !0),
|
|
476
|
+
i.type_fetch === "pagination" ? x(n.$slots, "pagination", {
|
|
450
477
|
key: 2,
|
|
451
478
|
pagination: a.value,
|
|
452
|
-
tradePage:
|
|
453
|
-
error:
|
|
479
|
+
tradePage: k,
|
|
480
|
+
error: L(o)
|
|
454
481
|
}, () => [
|
|
455
|
-
!
|
|
482
|
+
!L(o) && a.value.count > 0 ? (d(), p("div", {
|
|
456
483
|
key: 0,
|
|
457
|
-
class:
|
|
484
|
+
class: S(["px-3", e.class_pagination])
|
|
458
485
|
}, [
|
|
459
|
-
|
|
486
|
+
V(qe, {
|
|
460
487
|
filtering: !0,
|
|
461
488
|
pagination: a.value,
|
|
462
|
-
onTradePage:
|
|
489
|
+
onTradePage: oe
|
|
463
490
|
}, null, 8, ["pagination"])
|
|
464
|
-
], 2)) :
|
|
465
|
-
], !0) :
|
|
491
|
+
], 2)) : C("", !0)
|
|
492
|
+
], !0) : C("", !0)
|
|
466
493
|
]));
|
|
467
494
|
}
|
|
468
|
-
}),
|
|
495
|
+
}), Ge = /* @__PURE__ */ X($e, [["__scopeId", "data-v-2f622d4b"]]);
|
|
469
496
|
export {
|
|
470
|
-
|
|
497
|
+
Ge as VDataPage
|
|
471
498
|
};
|
package/package.json
CHANGED
|
@@ -1,12 +1,38 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
|
-
<
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
<template v-if="type_fetch === 'pagination'" class="">
|
|
4
|
+
|
|
5
|
+
<template v-if="showLoadingState">
|
|
6
|
+
<div :class="props.class_loading_container">
|
|
7
|
+
<template v-for="n in pagination.limit_per_page" :key="'placeholder-' + n">
|
|
8
|
+
<slot name="loading" :n="n">
|
|
9
|
+
|
|
10
|
+
</slot>
|
|
11
|
+
</template>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
<template v-else-if="error">
|
|
15
|
+
<slot name="error" :error="error">
|
|
16
|
+
<div class="alert alert-danger" role="alert">
|
|
17
|
+
Ocorreu um erro ao carregar os dados.
|
|
18
|
+
</div>
|
|
7
19
|
</slot>
|
|
8
20
|
</template>
|
|
9
|
-
|
|
21
|
+
<template v-else-if="pagination.count === 0">
|
|
22
|
+
<slot name="empty">
|
|
23
|
+
<div class="alert alert-info" role="alert">
|
|
24
|
+
Nenhum registro encontrado.
|
|
25
|
+
</div>
|
|
26
|
+
</slot>
|
|
27
|
+
</template>
|
|
28
|
+
<div v-else :class="props.class_container">
|
|
29
|
+
<template v-for="item in items" :key="item[props.item_key]">
|
|
30
|
+
<slot name="body" :item="item">
|
|
31
|
+
|
|
32
|
+
</slot>
|
|
33
|
+
</template>
|
|
34
|
+
</div>
|
|
35
|
+
</template>
|
|
10
36
|
<div v-else-if="type_fetch === 'infinite-scroll'" :class="props.class_container">
|
|
11
37
|
|
|
12
38
|
<InfiniteLoading :identifier="topLoaderId" direction="top" @infinite="carregarPaginaTop">
|
|
@@ -29,7 +55,7 @@
|
|
|
29
55
|
<slot v-if="type_fetch === 'pagination'" name="pagination" :pagination="pagination"
|
|
30
56
|
:tradePage="fetchDataWithDelay" :error="error">
|
|
31
57
|
<div v-if="!error && pagination.count > 0" class="px-3" :class="props.class_pagination">
|
|
32
|
-
<PaginationDatatable :filtering="true" :pagination="pagination" @tradePage="
|
|
58
|
+
<PaginationDatatable :filtering="true" :pagination="pagination" @tradePage="tradePageEmit" />
|
|
33
59
|
</div>
|
|
34
60
|
</slot>
|
|
35
61
|
</div>
|
|
@@ -75,6 +101,7 @@ interface VDataPageProps {
|
|
|
75
101
|
|
|
76
102
|
/* props para estilizar o vdatatable */
|
|
77
103
|
class_container?: string;
|
|
104
|
+
class_loading_container?: string;
|
|
78
105
|
class_pagination?: string;
|
|
79
106
|
class_filters?: string;
|
|
80
107
|
|
|
@@ -150,6 +177,7 @@ const props = withDefaults(defineProps<VDataPageProps>(), {
|
|
|
150
177
|
type_fetch: 'pagination',
|
|
151
178
|
page_starts_at: 0,
|
|
152
179
|
element_id: '',
|
|
180
|
+
class_loading_container: '',
|
|
153
181
|
watch: () => []
|
|
154
182
|
});
|
|
155
183
|
|
|
@@ -190,7 +218,7 @@ const pagination = ref<PaginationObject>({
|
|
|
190
218
|
// =======================================================
|
|
191
219
|
// 3. LÓGICA DA API (useFetch)
|
|
192
220
|
// =======================================================
|
|
193
|
-
const { data: response, pending:
|
|
221
|
+
const { data: response, pending: pending, error, execute, attempt: _attempt } = props.fetch(props.endpoint, {
|
|
194
222
|
params: () => {
|
|
195
223
|
|
|
196
224
|
if (props.deactivate_default_params) {
|
|
@@ -230,9 +258,9 @@ const default_params = computed<Record<string, any>>(() => ({
|
|
|
230
258
|
}));
|
|
231
259
|
|
|
232
260
|
// para controlar a exibição do loading
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
261
|
+
const showLoadingState = computed<boolean>(() => {
|
|
262
|
+
return (pending.value || isDelaying.value)
|
|
263
|
+
});
|
|
236
264
|
|
|
237
265
|
|
|
238
266
|
|
|
@@ -473,6 +501,10 @@ if (watchSources.length > 0) {
|
|
|
473
501
|
}
|
|
474
502
|
|
|
475
503
|
}
|
|
504
|
+
function tradePageEmit() {
|
|
505
|
+
emit("tradePage");
|
|
506
|
+
fetchDataWithDelay();
|
|
507
|
+
}
|
|
476
508
|
const on_mounted_called = ref<boolean>(false);
|
|
477
509
|
watch(
|
|
478
510
|
() => props.add_params,
|