golden-logic-ui 1.2.348 → 1.2.350
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { ref as x, watch as C, computed as y, createElementBlock as
|
|
1
|
+
import { ref as x, watch as C, computed as y, createElementBlock as i, openBlock as u, Fragment as N, createCommentVNode as g, normalizeClass as v, createElementVNode as m, toDisplayString as r, createVNode as D } from "vue";
|
|
2
2
|
import M from "./GlDatePicker.vue.js";
|
|
3
3
|
const B = {
|
|
4
4
|
key: 0,
|
|
5
5
|
class: "gl-label-form"
|
|
6
|
-
}, j = { class: "mt-1 text-gray-900 dark:text-white" }, A = ["for"], U = { class: "flex justify-between gap-2 flex-col md:flex-row items-center" }, z = { class: "w-full md:flex-1" }, F = { class: "text-gray-500 dark:text-gray-400 font-medium shrink-0 py-2 md:py-0" }, G = { class: "w-full md:flex-1" }, O = {
|
|
6
|
+
}, j = { class: "mt-1 text-gray-900 dark:text-white" }, A = ["for"], U = { class: "flex justify-between gap-2 flex-col md:flex-row items-center" }, z = { class: "w-full md:flex-1" }, F = { class: "text-gray-500 dark:text-gray-400 font-medium shrink-0 py-2 md:py-0 md:mt-20" }, G = { class: "w-full md:flex-1" }, O = {
|
|
7
7
|
key: 1,
|
|
8
8
|
class: "text-center mt-1"
|
|
9
9
|
}, P = { class: "gl-span-form-error" }, R = {
|
|
@@ -36,6 +36,15 @@ const B = {
|
|
|
36
36
|
type: String,
|
|
37
37
|
default: ""
|
|
38
38
|
},
|
|
39
|
+
// Optional per-picker labels shown above the start / end fields
|
|
40
|
+
label_name_start: {
|
|
41
|
+
type: String,
|
|
42
|
+
default: ""
|
|
43
|
+
},
|
|
44
|
+
label_name_end: {
|
|
45
|
+
type: String,
|
|
46
|
+
default: ""
|
|
47
|
+
},
|
|
39
48
|
description: {
|
|
40
49
|
type: String,
|
|
41
50
|
default: ""
|
|
@@ -98,13 +107,13 @@ const B = {
|
|
|
98
107
|
}
|
|
99
108
|
},
|
|
100
109
|
emits: ["update:modelValue", "change"],
|
|
101
|
-
setup(e, { emit:
|
|
102
|
-
const
|
|
103
|
-
start:
|
|
104
|
-
end:
|
|
110
|
+
setup(e, { emit: S }) {
|
|
111
|
+
const o = e, b = S, c = x(""), a = x({
|
|
112
|
+
start: o.modelValue.start,
|
|
113
|
+
end: o.modelValue.end
|
|
105
114
|
});
|
|
106
115
|
C(
|
|
107
|
-
() =>
|
|
116
|
+
() => o.modelValue,
|
|
108
117
|
(t) => {
|
|
109
118
|
t && (a.value.start = t.start, a.value.end = t.end);
|
|
110
119
|
},
|
|
@@ -112,28 +121,28 @@ const B = {
|
|
|
112
121
|
);
|
|
113
122
|
const f = (t) => {
|
|
114
123
|
if (!t) return null;
|
|
115
|
-
let l, d,
|
|
124
|
+
let l, d, s;
|
|
116
125
|
const n = t.split(/[-/]/);
|
|
117
126
|
if (n.length !== 3) return new Date(t);
|
|
118
|
-
switch (
|
|
127
|
+
switch (o.date_format) {
|
|
119
128
|
case "DD-MM-YYYY":
|
|
120
129
|
case "DD/MM/YYYY":
|
|
121
|
-
|
|
130
|
+
s = parseInt(n[0]), d = parseInt(n[1]) - 1, l = parseInt(n[2]);
|
|
122
131
|
break;
|
|
123
132
|
case "MM-DD-YYYY":
|
|
124
133
|
case "MM/DD/YYYY":
|
|
125
|
-
d = parseInt(n[0]) - 1,
|
|
134
|
+
d = parseInt(n[0]) - 1, s = parseInt(n[1]), l = parseInt(n[2]);
|
|
126
135
|
break;
|
|
127
136
|
default:
|
|
128
|
-
l = parseInt(n[0]), d = parseInt(n[1]) - 1,
|
|
137
|
+
l = parseInt(n[0]), d = parseInt(n[1]) - 1, s = parseInt(n[2]);
|
|
129
138
|
break;
|
|
130
139
|
}
|
|
131
|
-
const Y = new Date(l, d,
|
|
140
|
+
const Y = new Date(l, d, s);
|
|
132
141
|
return isNaN(Y.getTime()) ? null : Y;
|
|
133
|
-
},
|
|
142
|
+
}, k = y(() => a.value.start ? a.value.start : o.min_date_end), V = y(() => a.value.end ? a.value.end : o.max_date_start), _ = (t, l) => {
|
|
134
143
|
if (t && l) {
|
|
135
|
-
const d = f(t),
|
|
136
|
-
if (d &&
|
|
144
|
+
const d = f(t), s = f(l);
|
|
145
|
+
if (d && s && d > s)
|
|
137
146
|
return c.value = "Start date cannot be after end date.", !1;
|
|
138
147
|
}
|
|
139
148
|
return c.value = "", !0;
|
|
@@ -152,24 +161,24 @@ const B = {
|
|
|
152
161
|
}, h = () => {
|
|
153
162
|
const t = { start: a.value.start, end: a.value.end };
|
|
154
163
|
b("update:modelValue", t), b("change", t);
|
|
155
|
-
}, w = y(() =>
|
|
156
|
-
return (t, l) => (
|
|
157
|
-
e.show ? (
|
|
164
|
+
}, w = y(() => ""), E = y(() => "");
|
|
165
|
+
return (t, l) => (u(), i(N, null, [
|
|
166
|
+
e.show ? (u(), i("div", {
|
|
158
167
|
key: 0,
|
|
159
168
|
class: v(["md:col-span-2", e.field_name])
|
|
160
169
|
}, [
|
|
161
|
-
e.label_name ? (
|
|
162
|
-
m("p", j,
|
|
170
|
+
e.label_name ? (u(), i("label", B, r(e.label_name), 1)) : g("", !0),
|
|
171
|
+
m("p", j, r(e.modelValue.start) + " " + r(e.separator) + " " + r(e.modelValue.end), 1),
|
|
163
172
|
l[2] || (l[2] = m("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
|
|
164
173
|
], 2)) : g("", !0),
|
|
165
|
-
e.show ? g("", !0) : (
|
|
174
|
+
e.show ? g("", !0) : (u(), i("div", {
|
|
166
175
|
key: 1,
|
|
167
176
|
class: v(["md:col-span-2", {
|
|
168
177
|
[e.field_name]: e.field_name && e.field_name !== "",
|
|
169
178
|
[e.container_class]: e.container_class && e.container_class !== ""
|
|
170
179
|
}])
|
|
171
180
|
}, [
|
|
172
|
-
e.label_name ? (
|
|
181
|
+
e.label_name ? (u(), i("label", {
|
|
173
182
|
key: 0,
|
|
174
183
|
class: v({
|
|
175
184
|
"gl-label-form": e.error_message == "" && c.value == "",
|
|
@@ -177,13 +186,14 @@ const B = {
|
|
|
177
186
|
required: e.is_required
|
|
178
187
|
}),
|
|
179
188
|
for: e.field_name
|
|
180
|
-
},
|
|
189
|
+
}, r(e.label_name), 11, A)) : g("", !0),
|
|
181
190
|
m("div", U, [
|
|
182
191
|
m("div", z, [
|
|
183
192
|
D(M, {
|
|
184
193
|
modelValue: a.value.start,
|
|
185
194
|
"onUpdate:modelValue": l[0] || (l[0] = (d) => a.value.start = d),
|
|
186
195
|
field_name: e.field_name + "_start",
|
|
196
|
+
label_name: e.label_name_start,
|
|
187
197
|
is_required: e.is_required,
|
|
188
198
|
placeholder: e.placeholder_start,
|
|
189
199
|
date_format: e.date_format,
|
|
@@ -194,31 +204,32 @@ const B = {
|
|
|
194
204
|
locale: e.locale,
|
|
195
205
|
error_message: w.value,
|
|
196
206
|
onChange: q
|
|
197
|
-
}, null, 8, ["modelValue", "field_name", "is_required", "placeholder", "date_format", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
207
|
+
}, null, 8, ["modelValue", "field_name", "label_name", "is_required", "placeholder", "date_format", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
198
208
|
]),
|
|
199
|
-
m("span", F,
|
|
209
|
+
m("span", F, r(e.separator), 1),
|
|
200
210
|
m("div", G, [
|
|
201
211
|
D(M, {
|
|
202
212
|
modelValue: a.value.end,
|
|
203
213
|
"onUpdate:modelValue": l[1] || (l[1] = (d) => a.value.end = d),
|
|
204
214
|
field_name: e.field_name + "_end",
|
|
215
|
+
label_name: e.label_name_end,
|
|
205
216
|
is_required: e.is_required,
|
|
206
217
|
placeholder: e.placeholder_end,
|
|
207
218
|
date_format: e.date_format,
|
|
208
|
-
min_date:
|
|
219
|
+
min_date: k.value,
|
|
209
220
|
max_date: e.max_date_end,
|
|
210
221
|
disabled_days: e.disabled_days,
|
|
211
222
|
disabled_dates: e.disabled_dates,
|
|
212
223
|
locale: e.locale,
|
|
213
224
|
error_message: E.value,
|
|
214
225
|
onChange: I
|
|
215
|
-
}, null, 8, ["modelValue", "field_name", "is_required", "placeholder", "date_format", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
226
|
+
}, null, 8, ["modelValue", "field_name", "label_name", "is_required", "placeholder", "date_format", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
216
227
|
])
|
|
217
228
|
]),
|
|
218
|
-
c.value || e.error_message ? (
|
|
219
|
-
m("span", P,
|
|
229
|
+
c.value || e.error_message ? (u(), i("div", O, [
|
|
230
|
+
m("span", P, r(e.error_message || c.value), 1)
|
|
220
231
|
])) : g("", !0),
|
|
221
|
-
e.description ? (
|
|
232
|
+
e.description ? (u(), i("small", R, r(e.description), 1)) : g("", !0)
|
|
222
233
|
], 2))
|
|
223
234
|
], 64));
|
|
224
235
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { ref as w, watch as
|
|
1
|
+
import { ref as w, watch as R, computed as g, createElementBlock as m, openBlock as u, Fragment as J, createCommentVNode as y, normalizeClass as _, createElementVNode as o, toDisplayString as i, createVNode as q } from "vue";
|
|
2
2
|
import N from "./GlDateTimePicker.vue.js";
|
|
3
|
-
const
|
|
3
|
+
const K = {
|
|
4
4
|
key: 0,
|
|
5
5
|
class: "gl-label-form"
|
|
6
|
-
},
|
|
6
|
+
}, L = { class: "mt-1 text-gray-900 dark:text-white" }, Q = ["for"], W = { class: "flex justify-between gap-2 flex-col md:flex-row items-center" }, X = { class: "w-full md:flex-1" }, Z = { class: "text-gray-500 dark:text-gray-400 font-medium shrink-0 py-2 md:py-0 md:mt-20" }, p = { class: "w-full md:flex-1" }, ee = {
|
|
7
7
|
key: 1,
|
|
8
8
|
class: "text-center mt-1"
|
|
9
9
|
}, te = { class: "gl-span-form-error" }, ae = {
|
|
@@ -36,6 +36,15 @@ const J = {
|
|
|
36
36
|
type: String,
|
|
37
37
|
default: ""
|
|
38
38
|
},
|
|
39
|
+
// Optional per-picker labels shown above the start / end fields
|
|
40
|
+
label_name_start: {
|
|
41
|
+
type: String,
|
|
42
|
+
default: ""
|
|
43
|
+
},
|
|
44
|
+
label_name_end: {
|
|
45
|
+
type: String,
|
|
46
|
+
default: ""
|
|
47
|
+
},
|
|
39
48
|
description: {
|
|
40
49
|
type: String,
|
|
41
50
|
default: ""
|
|
@@ -104,12 +113,12 @@ const J = {
|
|
|
104
113
|
},
|
|
105
114
|
emits: ["update:modelValue", "change"],
|
|
106
115
|
setup(e, { emit: P }) {
|
|
107
|
-
const
|
|
108
|
-
start:
|
|
109
|
-
end:
|
|
116
|
+
const c = e, b = P, f = w(""), l = w({
|
|
117
|
+
start: c.modelValue.start,
|
|
118
|
+
end: c.modelValue.end
|
|
110
119
|
});
|
|
111
|
-
|
|
112
|
-
() =>
|
|
120
|
+
R(
|
|
121
|
+
() => c.modelValue,
|
|
113
122
|
(t) => {
|
|
114
123
|
t && (l.value.start = t.start, l.value.end = t.end);
|
|
115
124
|
},
|
|
@@ -123,7 +132,7 @@ const J = {
|
|
|
123
132
|
let a, n, r;
|
|
124
133
|
const d = t.split(/[-/]/);
|
|
125
134
|
if (d.length !== 3) return null;
|
|
126
|
-
switch (
|
|
135
|
+
switch (c.date_format) {
|
|
127
136
|
case "DD-MM-YYYY":
|
|
128
137
|
case "DD/MM/YYYY":
|
|
129
138
|
r = parseInt(d[0]), n = parseInt(d[1]) - 1, a = parseInt(d[2]);
|
|
@@ -137,75 +146,76 @@ const J = {
|
|
|
137
146
|
break;
|
|
138
147
|
}
|
|
139
148
|
return { year: a, month: n, day: r };
|
|
140
|
-
},
|
|
149
|
+
}, v = (t) => {
|
|
141
150
|
if (!t) return null;
|
|
142
151
|
const a = String(t).trim(), n = a.indexOf(" "), r = n === -1 ? a : a.slice(0, n), d = n === -1 ? "" : a.slice(n + 1).trim(), M = E(r);
|
|
143
152
|
if (!M) {
|
|
144
|
-
const
|
|
145
|
-
return isNaN(
|
|
153
|
+
const s = new Date(a);
|
|
154
|
+
return isNaN(s.getTime()) ? null : s;
|
|
146
155
|
}
|
|
147
|
-
let
|
|
156
|
+
let S = 0, D = 0;
|
|
148
157
|
if (d) {
|
|
149
|
-
const
|
|
150
|
-
if (
|
|
151
|
-
const V = parseInt(
|
|
152
|
-
|
|
153
|
-
const I =
|
|
154
|
-
|
|
158
|
+
const s = d.match(/^(\d{1,2}):(\d{2})\s*(AM|PM)?$/i);
|
|
159
|
+
if (s) {
|
|
160
|
+
const V = parseInt(s[1]);
|
|
161
|
+
D = parseInt(s[2]);
|
|
162
|
+
const I = s[3] ? s[3].toUpperCase() : null;
|
|
163
|
+
S = I ? C(V, I) : V;
|
|
155
164
|
}
|
|
156
165
|
}
|
|
157
|
-
const { year:
|
|
166
|
+
const { year: F, month: G, day: H } = M, k = new Date(F, G, H, S, D);
|
|
158
167
|
return isNaN(k.getTime()) ? null : k;
|
|
159
|
-
}, T = g(() => l.value.start ? l.value.start :
|
|
168
|
+
}, T = g(() => l.value.start ? l.value.start : c.min_date_end), B = g(() => l.value.end ? l.value.end : c.max_date_start), h = (t, a) => {
|
|
160
169
|
if (t && a) {
|
|
161
|
-
const n =
|
|
170
|
+
const n = v(t), r = v(a);
|
|
162
171
|
if (n && r && n > r)
|
|
163
172
|
return f.value = "Start date/time cannot be after end date/time.", !1;
|
|
164
173
|
}
|
|
165
174
|
return f.value = "", !0;
|
|
166
175
|
}, A = (t) => {
|
|
167
|
-
l.value.start = t,
|
|
176
|
+
l.value.start = t, h(l.value.start, l.value.end), x();
|
|
168
177
|
}, O = (t) => {
|
|
169
|
-
l.value.end = t,
|
|
178
|
+
l.value.end = t, h(l.value.start, l.value.end), x();
|
|
170
179
|
}, Y = (t) => {
|
|
171
180
|
if (!t) return null;
|
|
172
181
|
const a = t.indexOf(" ");
|
|
173
182
|
return a === -1 ? null : t.slice(a + 1).trim();
|
|
174
183
|
}, U = g(() => Y(l.value.start)), j = g(() => Y(l.value.end)), x = () => {
|
|
175
184
|
const t = { start: l.value.start, end: l.value.end };
|
|
176
|
-
|
|
177
|
-
}, $ = g(() =>
|
|
178
|
-
return (t, a) => (
|
|
179
|
-
e.show ? (
|
|
185
|
+
b("update:modelValue", t), b("change", t);
|
|
186
|
+
}, $ = g(() => ""), z = g(() => "");
|
|
187
|
+
return (t, a) => (u(), m(J, null, [
|
|
188
|
+
e.show ? (u(), m("div", {
|
|
180
189
|
key: 0,
|
|
181
|
-
class:
|
|
190
|
+
class: _(["md:col-span-2", e.field_name])
|
|
182
191
|
}, [
|
|
183
|
-
e.label_name ? (
|
|
184
|
-
|
|
185
|
-
a[2] || (a[2] =
|
|
192
|
+
e.label_name ? (u(), m("label", K, i(e.label_name), 1)) : y("", !0),
|
|
193
|
+
o("p", L, i(e.modelValue.start) + " " + i(e.separator) + " " + i(e.modelValue.end), 1),
|
|
194
|
+
a[2] || (a[2] = o("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
|
|
186
195
|
], 2)) : y("", !0),
|
|
187
|
-
e.show ? y("", !0) : (
|
|
196
|
+
e.show ? y("", !0) : (u(), m("div", {
|
|
188
197
|
key: 1,
|
|
189
|
-
class:
|
|
198
|
+
class: _(["md:col-span-2", {
|
|
190
199
|
[e.field_name]: e.field_name && e.field_name !== "",
|
|
191
200
|
[e.container_class]: e.container_class && e.container_class !== ""
|
|
192
201
|
}])
|
|
193
202
|
}, [
|
|
194
|
-
e.label_name ? (
|
|
203
|
+
e.label_name ? (u(), m("label", {
|
|
195
204
|
key: 0,
|
|
196
|
-
class:
|
|
205
|
+
class: _({
|
|
197
206
|
"gl-label-form": e.error_message == "" && f.value == "",
|
|
198
207
|
"gl-label-form-invalid": e.error_message !== "" || f.value !== "",
|
|
199
208
|
required: e.is_required
|
|
200
209
|
}),
|
|
201
210
|
for: e.field_name
|
|
202
|
-
},
|
|
203
|
-
|
|
204
|
-
|
|
211
|
+
}, i(e.label_name), 11, Q)) : y("", !0),
|
|
212
|
+
o("div", W, [
|
|
213
|
+
o("div", X, [
|
|
205
214
|
q(N, {
|
|
206
215
|
modelValue: l.value.start,
|
|
207
216
|
"onUpdate:modelValue": a[0] || (a[0] = (n) => l.value.start = n),
|
|
208
217
|
field_name: e.field_name + "_start",
|
|
218
|
+
label_name: e.label_name_start,
|
|
209
219
|
is_required: e.is_required,
|
|
210
220
|
placeholder: e.placeholder_start,
|
|
211
221
|
date_format: e.date_format,
|
|
@@ -218,14 +228,15 @@ const J = {
|
|
|
218
228
|
locale: e.locale,
|
|
219
229
|
error_message: $.value,
|
|
220
230
|
onChange: A
|
|
221
|
-
}, null, 8, ["modelValue", "field_name", "is_required", "placeholder", "date_format", "minute_step", "default_time", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
231
|
+
}, null, 8, ["modelValue", "field_name", "label_name", "is_required", "placeholder", "date_format", "minute_step", "default_time", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
222
232
|
]),
|
|
223
|
-
|
|
224
|
-
|
|
233
|
+
o("span", Z, i(e.separator), 1),
|
|
234
|
+
o("div", p, [
|
|
225
235
|
q(N, {
|
|
226
236
|
modelValue: l.value.end,
|
|
227
237
|
"onUpdate:modelValue": a[1] || (a[1] = (n) => l.value.end = n),
|
|
228
238
|
field_name: e.field_name + "_end",
|
|
239
|
+
label_name: e.label_name_end,
|
|
229
240
|
is_required: e.is_required,
|
|
230
241
|
placeholder: e.placeholder_end,
|
|
231
242
|
date_format: e.date_format,
|
|
@@ -236,15 +247,15 @@ const J = {
|
|
|
236
247
|
disabled_days: e.disabled_days,
|
|
237
248
|
disabled_dates: e.disabled_dates,
|
|
238
249
|
locale: e.locale,
|
|
239
|
-
error_message:
|
|
250
|
+
error_message: z.value,
|
|
240
251
|
onChange: O
|
|
241
|
-
}, null, 8, ["modelValue", "field_name", "is_required", "placeholder", "date_format", "minute_step", "default_time", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
252
|
+
}, null, 8, ["modelValue", "field_name", "label_name", "is_required", "placeholder", "date_format", "minute_step", "default_time", "min_date", "max_date", "disabled_days", "disabled_dates", "locale", "error_message"])
|
|
242
253
|
])
|
|
243
254
|
]),
|
|
244
|
-
f.value || e.error_message ? (
|
|
245
|
-
|
|
255
|
+
f.value || e.error_message ? (u(), m("div", ee, [
|
|
256
|
+
o("span", te, i(e.error_message || f.value), 1)
|
|
246
257
|
])) : y("", !0),
|
|
247
|
-
e.description ? (
|
|
258
|
+
e.description ? (u(), m("small", ae, i(e.description), 1)) : y("", !0)
|
|
248
259
|
], 2))
|
|
249
260
|
], 64));
|
|
250
261
|
}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "The most popular library of interactive components built with Vuejs && Tailwind CSS",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"private": false,
|
|
6
|
-
"version": "1.2.
|
|
6
|
+
"version": "1.2.350",
|
|
7
7
|
"repository": {
|
|
8
8
|
"type": "git",
|
|
9
9
|
"url": "git+https://github.com/mrgiant/GoldenLogicUi.git"
|