@orchidui/dashboard 1.104.0 → 1.106.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/Dashboard/Charts/OverviewMonthlyBarChart/OcOverviewMonthlyBarChart.js +1 -1
- package/dist/Dashboard/Charts/OverviewPieChart/OcOverviewPieChart.js +1 -1
- package/dist/{OcOverviewMonthlyBarChart-phAI5_vv.js → OcOverviewMonthlyBarChart-DtW9I-hC.js} +99 -93
- package/dist/{OcOverviewPieChart-DbnX-BGC.js → OcOverviewPieChart-gBl1MAMg.js} +29 -23
- package/package.json +2 -2
package/dist/{OcOverviewMonthlyBarChart-phAI5_vv.js → OcOverviewMonthlyBarChart-DtW9I-hC.js}
RENAMED
|
@@ -1,48 +1,48 @@
|
|
|
1
|
-
import { computed as
|
|
1
|
+
import { computed as I, ref as tt, watch as et, createElementBlock as rt, openBlock as nt } from "vue";
|
|
2
2
|
import { u as at } from "./useChart-D5nAyTGV.js";
|
|
3
|
-
import { g as
|
|
4
|
-
var P = { exports: {} },
|
|
3
|
+
import { g as it } from "./_commonjsHelpers-B4e78b8K.js";
|
|
4
|
+
var P = { exports: {} }, st = P.exports, X;
|
|
5
5
|
function ot() {
|
|
6
6
|
return X || (X = 1, (function(H, g) {
|
|
7
7
|
(function(w, F) {
|
|
8
8
|
H.exports = F();
|
|
9
|
-
})(
|
|
10
|
-
var w = 1e3, F = 6e4, V = 36e5, j = "millisecond", O = "second", _ = "minute", k = "hour", x = "day", L = "week", d = "month", N = "quarter",
|
|
9
|
+
})(st, (function() {
|
|
10
|
+
var w = 1e3, F = 6e4, V = 36e5, j = "millisecond", O = "second", _ = "minute", k = "hour", x = "day", L = "week", d = "month", N = "quarter", b = "year", o = "date", l = "Invalid Date", D = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, v = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, z = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(a) {
|
|
11
11
|
var r = ["th", "st", "nd", "rd"], t = a % 100;
|
|
12
12
|
return "[" + a + (r[(t - 20) % 10] || r[t] || r[0]) + "]";
|
|
13
|
-
} },
|
|
13
|
+
} }, E = function(a, r, t) {
|
|
14
14
|
var n = String(a);
|
|
15
15
|
return !n || n.length >= r ? a : "" + Array(r + 1 - n.length).join(t) + a;
|
|
16
|
-
}, C = { s:
|
|
16
|
+
}, C = { s: E, z: function(a) {
|
|
17
17
|
var r = -a.utcOffset(), t = Math.abs(r), n = Math.floor(t / 60), e = t % 60;
|
|
18
|
-
return (r <= 0 ? "+" : "-") +
|
|
18
|
+
return (r <= 0 ? "+" : "-") + E(n, 2, "0") + ":" + E(e, 2, "0");
|
|
19
19
|
}, m: function a(r, t) {
|
|
20
20
|
if (r.date() < t.date()) return -a(t, r);
|
|
21
|
-
var n = 12 * (t.year() - r.year()) + (t.month() - r.month()), e = r.clone().add(n, d),
|
|
22
|
-
return +(-(n + (t - e) / (
|
|
21
|
+
var n = 12 * (t.year() - r.year()) + (t.month() - r.month()), e = r.clone().add(n, d), i = t - e < 0, s = r.clone().add(n + (i ? -1 : 1), d);
|
|
22
|
+
return +(-(n + (t - e) / (i ? e - s : s - e)) || 0);
|
|
23
23
|
}, a: function(a) {
|
|
24
24
|
return a < 0 ? Math.ceil(a) || 0 : Math.floor(a);
|
|
25
25
|
}, p: function(a) {
|
|
26
|
-
return { M: d, y:
|
|
26
|
+
return { M: d, y: b, w: L, d: x, D: o, h: k, m: _, s: O, ms: j, Q: N }[a] || String(a || "").toLowerCase().replace(/s$/, "");
|
|
27
27
|
}, u: function(a) {
|
|
28
28
|
return a === void 0;
|
|
29
|
-
} },
|
|
30
|
-
M[
|
|
29
|
+
} }, S = "en", M = {};
|
|
30
|
+
M[S] = z;
|
|
31
31
|
var K = "$isDayjsObject", R = function(a) {
|
|
32
32
|
return a instanceof Z || !(!a || !a[K]);
|
|
33
33
|
}, J = function a(r, t, n) {
|
|
34
34
|
var e;
|
|
35
|
-
if (!r) return
|
|
35
|
+
if (!r) return S;
|
|
36
36
|
if (typeof r == "string") {
|
|
37
|
-
var
|
|
38
|
-
M[
|
|
39
|
-
var
|
|
40
|
-
if (!e &&
|
|
37
|
+
var i = r.toLowerCase();
|
|
38
|
+
M[i] && (e = i), t && (M[i] = t, e = i);
|
|
39
|
+
var s = r.split("-");
|
|
40
|
+
if (!e && s.length > 1) return a(s[0]);
|
|
41
41
|
} else {
|
|
42
42
|
var c = r.name;
|
|
43
43
|
M[c] = r, e = c;
|
|
44
44
|
}
|
|
45
|
-
return !n && e && (
|
|
45
|
+
return !n && e && (S = e), e || !n && S;
|
|
46
46
|
}, h = function(a, r) {
|
|
47
47
|
if (R(a)) return a.clone();
|
|
48
48
|
var t = typeof r == "object" ? r : {};
|
|
@@ -58,15 +58,15 @@ function ot() {
|
|
|
58
58
|
var r = a.prototype;
|
|
59
59
|
return r.parse = function(t) {
|
|
60
60
|
this.$d = (function(n) {
|
|
61
|
-
var e = n.date,
|
|
61
|
+
var e = n.date, i = n.utc;
|
|
62
62
|
if (e === null) return /* @__PURE__ */ new Date(NaN);
|
|
63
63
|
if (u.u(e)) return /* @__PURE__ */ new Date();
|
|
64
64
|
if (e instanceof Date) return new Date(e);
|
|
65
65
|
if (typeof e == "string" && !/Z$/i.test(e)) {
|
|
66
|
-
var
|
|
67
|
-
if (
|
|
68
|
-
var c =
|
|
69
|
-
return
|
|
66
|
+
var s = e.match(D);
|
|
67
|
+
if (s) {
|
|
68
|
+
var c = s[2] - 1 || 0, f = (s[7] || "0").substring(0, 3);
|
|
69
|
+
return i ? new Date(Date.UTC(s[1], c, s[3] || 1, s[4] || 0, s[5] || 0, s[6] || 0, f)) : new Date(s[1], c, s[3] || 1, s[4] || 0, s[5] || 0, s[6] || 0, f);
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
return new Date(e);
|
|
@@ -92,20 +92,20 @@ function ot() {
|
|
|
92
92
|
}, r.valueOf = function() {
|
|
93
93
|
return this.$d.getTime();
|
|
94
94
|
}, r.startOf = function(t, n) {
|
|
95
|
-
var e = this,
|
|
96
|
-
var A = u.w(e.$u ? Date.UTC(e.$y,
|
|
97
|
-
return
|
|
98
|
-
}, f = function(T,
|
|
99
|
-
return u.w(e.toDate()[T].apply(e.toDate("s"), (
|
|
100
|
-
}, m = this.$W,
|
|
101
|
-
switch (
|
|
102
|
-
case
|
|
103
|
-
return
|
|
95
|
+
var e = this, i = !!u.u(n) || n, s = u.p(t), c = function(T, $) {
|
|
96
|
+
var A = u.w(e.$u ? Date.UTC(e.$y, $, T) : new Date(e.$y, $, T), e);
|
|
97
|
+
return i ? A : A.endOf(x);
|
|
98
|
+
}, f = function(T, $) {
|
|
99
|
+
return u.w(e.toDate()[T].apply(e.toDate("s"), (i ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice($)), e);
|
|
100
|
+
}, m = this.$W, p = this.$M, y = this.$D, B = "set" + (this.$u ? "UTC" : "");
|
|
101
|
+
switch (s) {
|
|
102
|
+
case b:
|
|
103
|
+
return i ? c(1, 0) : c(31, 11);
|
|
104
104
|
case d:
|
|
105
|
-
return
|
|
105
|
+
return i ? c(1, p) : c(0, p + 1);
|
|
106
106
|
case L:
|
|
107
|
-
var Y = this.$locale().weekStart || 0,
|
|
108
|
-
return c(
|
|
107
|
+
var Y = this.$locale().weekStart || 0, W = (m < Y ? m + 7 : m) - Y;
|
|
108
|
+
return c(i ? y - W : y + (6 - W), p);
|
|
109
109
|
case x:
|
|
110
110
|
case o:
|
|
111
111
|
return f(B + "Hours", 0);
|
|
@@ -121,8 +121,8 @@ function ot() {
|
|
|
121
121
|
}, r.endOf = function(t) {
|
|
122
122
|
return this.startOf(t, !1);
|
|
123
123
|
}, r.$set = function(t, n) {
|
|
124
|
-
var e,
|
|
125
|
-
if (
|
|
124
|
+
var e, i = u.p(t), s = "set" + (this.$u ? "UTC" : ""), c = (e = {}, e[x] = s + "Date", e[o] = s + "Date", e[d] = s + "Month", e[b] = s + "FullYear", e[k] = s + "Hours", e[_] = s + "Minutes", e[O] = s + "Seconds", e[j] = s + "Milliseconds", e)[i], f = i === x ? this.$D + (n - this.$W) : n;
|
|
125
|
+
if (i === d || i === b) {
|
|
126
126
|
var m = this.clone().set(o, 1);
|
|
127
127
|
m.$d[c](f), m.init(), this.$d = m.set(o, Math.min(this.$D, m.daysInMonth())).$d;
|
|
128
128
|
} else c && this.$d[c](f);
|
|
@@ -132,34 +132,34 @@ function ot() {
|
|
|
132
132
|
}, r.get = function(t) {
|
|
133
133
|
return this[u.p(t)]();
|
|
134
134
|
}, r.add = function(t, n) {
|
|
135
|
-
var e,
|
|
135
|
+
var e, i = this;
|
|
136
136
|
t = Number(t);
|
|
137
|
-
var
|
|
138
|
-
var y = h(
|
|
139
|
-
return u.w(y.date(y.date() + Math.round(
|
|
137
|
+
var s = u.p(n), c = function(p) {
|
|
138
|
+
var y = h(i);
|
|
139
|
+
return u.w(y.date(y.date() + Math.round(p * t)), i);
|
|
140
140
|
};
|
|
141
|
-
if (
|
|
142
|
-
if (
|
|
143
|
-
if (
|
|
144
|
-
if (
|
|
145
|
-
var f = (e = {}, e[_] = F, e[k] = V, e[O] = w, e)[
|
|
141
|
+
if (s === d) return this.set(d, this.$M + t);
|
|
142
|
+
if (s === b) return this.set(b, this.$y + t);
|
|
143
|
+
if (s === x) return c(1);
|
|
144
|
+
if (s === L) return c(7);
|
|
145
|
+
var f = (e = {}, e[_] = F, e[k] = V, e[O] = w, e)[s] || 1, m = this.$d.getTime() + t * f;
|
|
146
146
|
return u.w(m, this);
|
|
147
147
|
}, r.subtract = function(t, n) {
|
|
148
148
|
return this.add(-1 * t, n);
|
|
149
149
|
}, r.format = function(t) {
|
|
150
150
|
var n = this, e = this.$locale();
|
|
151
151
|
if (!this.isValid()) return e.invalidDate || l;
|
|
152
|
-
var
|
|
153
|
-
return
|
|
154
|
-
},
|
|
155
|
-
return u.s(c % 12 || 12,
|
|
156
|
-
}, T = B || function(
|
|
157
|
-
var q =
|
|
158
|
-
return
|
|
152
|
+
var i = t || "YYYY-MM-DDTHH:mm:ssZ", s = u.z(this), c = this.$H, f = this.$m, m = this.$M, p = e.weekdays, y = e.months, B = e.meridiem, Y = function($, A, U, q) {
|
|
153
|
+
return $ && ($[A] || $(n, i)) || U[A].slice(0, q);
|
|
154
|
+
}, W = function($) {
|
|
155
|
+
return u.s(c % 12 || 12, $, "0");
|
|
156
|
+
}, T = B || function($, A, U) {
|
|
157
|
+
var q = $ < 12 ? "AM" : "PM";
|
|
158
|
+
return U ? q.toLowerCase() : q;
|
|
159
159
|
};
|
|
160
|
-
return
|
|
161
|
-
return A || (function(
|
|
162
|
-
switch (
|
|
160
|
+
return i.replace(v, (function($, A) {
|
|
161
|
+
return A || (function(U) {
|
|
162
|
+
switch (U) {
|
|
163
163
|
case "YY":
|
|
164
164
|
return String(n.$y).slice(-2);
|
|
165
165
|
case "YYYY":
|
|
@@ -179,19 +179,19 @@ function ot() {
|
|
|
179
179
|
case "d":
|
|
180
180
|
return String(n.$W);
|
|
181
181
|
case "dd":
|
|
182
|
-
return Y(e.weekdaysMin, n.$W,
|
|
182
|
+
return Y(e.weekdaysMin, n.$W, p, 2);
|
|
183
183
|
case "ddd":
|
|
184
|
-
return Y(e.weekdaysShort, n.$W,
|
|
184
|
+
return Y(e.weekdaysShort, n.$W, p, 3);
|
|
185
185
|
case "dddd":
|
|
186
|
-
return
|
|
186
|
+
return p[n.$W];
|
|
187
187
|
case "H":
|
|
188
188
|
return String(c);
|
|
189
189
|
case "HH":
|
|
190
190
|
return u.s(c, 2, "0");
|
|
191
191
|
case "h":
|
|
192
|
-
return
|
|
192
|
+
return W(1);
|
|
193
193
|
case "hh":
|
|
194
|
-
return
|
|
194
|
+
return W(2);
|
|
195
195
|
case "a":
|
|
196
196
|
return T(c, f, !0);
|
|
197
197
|
case "A":
|
|
@@ -207,54 +207,54 @@ function ot() {
|
|
|
207
207
|
case "SSS":
|
|
208
208
|
return u.s(n.$ms, 3, "0");
|
|
209
209
|
case "Z":
|
|
210
|
-
return
|
|
210
|
+
return s;
|
|
211
211
|
}
|
|
212
212
|
return null;
|
|
213
|
-
})(
|
|
213
|
+
})($) || s.replace(":", "");
|
|
214
214
|
}));
|
|
215
215
|
}, r.utcOffset = function() {
|
|
216
216
|
return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
|
|
217
217
|
}, r.diff = function(t, n, e) {
|
|
218
|
-
var
|
|
219
|
-
return u.m(
|
|
218
|
+
var i, s = this, c = u.p(n), f = h(t), m = (f.utcOffset() - this.utcOffset()) * F, p = this - f, y = function() {
|
|
219
|
+
return u.m(s, f);
|
|
220
220
|
};
|
|
221
221
|
switch (c) {
|
|
222
|
-
case
|
|
223
|
-
|
|
222
|
+
case b:
|
|
223
|
+
i = y() / 12;
|
|
224
224
|
break;
|
|
225
225
|
case d:
|
|
226
|
-
|
|
226
|
+
i = y();
|
|
227
227
|
break;
|
|
228
228
|
case N:
|
|
229
|
-
|
|
229
|
+
i = y() / 3;
|
|
230
230
|
break;
|
|
231
231
|
case L:
|
|
232
|
-
|
|
232
|
+
i = (p - m) / 6048e5;
|
|
233
233
|
break;
|
|
234
234
|
case x:
|
|
235
|
-
|
|
235
|
+
i = (p - m) / 864e5;
|
|
236
236
|
break;
|
|
237
237
|
case k:
|
|
238
|
-
|
|
238
|
+
i = p / V;
|
|
239
239
|
break;
|
|
240
240
|
case _:
|
|
241
|
-
|
|
241
|
+
i = p / F;
|
|
242
242
|
break;
|
|
243
243
|
case O:
|
|
244
|
-
|
|
244
|
+
i = p / w;
|
|
245
245
|
break;
|
|
246
246
|
default:
|
|
247
|
-
|
|
247
|
+
i = p;
|
|
248
248
|
}
|
|
249
|
-
return e ?
|
|
249
|
+
return e ? i : u.a(i);
|
|
250
250
|
}, r.daysInMonth = function() {
|
|
251
251
|
return this.endOf(d).$D;
|
|
252
252
|
}, r.$locale = function() {
|
|
253
253
|
return M[this.$L];
|
|
254
254
|
}, r.locale = function(t, n) {
|
|
255
255
|
if (!t) return this.$L;
|
|
256
|
-
var e = this.clone(),
|
|
257
|
-
return
|
|
256
|
+
var e = this.clone(), i = J(t, n, !0);
|
|
257
|
+
return i && (e.$L = i), e;
|
|
258
258
|
}, r.clone = function() {
|
|
259
259
|
return u.w(this.$d, this);
|
|
260
260
|
}, r.toDate = function() {
|
|
@@ -267,7 +267,7 @@ function ot() {
|
|
|
267
267
|
return this.$d.toUTCString();
|
|
268
268
|
}, a;
|
|
269
269
|
})(), Q = Z.prototype;
|
|
270
|
-
return h.prototype = Q, [["$ms", j], ["$s", O], ["$m", _], ["$H", k], ["$W", x], ["$M", d], ["$y",
|
|
270
|
+
return h.prototype = Q, [["$ms", j], ["$s", O], ["$m", _], ["$H", k], ["$W", x], ["$M", d], ["$y", b], ["$D", o]].forEach((function(a) {
|
|
271
271
|
Q[a[1]] = function(r) {
|
|
272
272
|
return this.$g(r, a[0], a[1]);
|
|
273
273
|
};
|
|
@@ -275,12 +275,12 @@ function ot() {
|
|
|
275
275
|
return a.$i || (a(r, Z, h), a.$i = !0), h;
|
|
276
276
|
}, h.locale = J, h.isDayjs = R, h.unix = function(a) {
|
|
277
277
|
return h(1e3 * a);
|
|
278
|
-
}, h.en = M[
|
|
278
|
+
}, h.en = M[S], h.Ls = M, h.p = {}, h;
|
|
279
279
|
}));
|
|
280
280
|
})(P)), P.exports;
|
|
281
281
|
}
|
|
282
282
|
var ut = ot();
|
|
283
|
-
const G = /* @__PURE__ */
|
|
283
|
+
const G = /* @__PURE__ */ it(ut), dt = {
|
|
284
284
|
__name: "OcOverviewMonthlyBarChart",
|
|
285
285
|
props: {
|
|
286
286
|
variant: {
|
|
@@ -299,15 +299,15 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
299
299
|
tooltipValueFormatter: Function
|
|
300
300
|
},
|
|
301
301
|
setup(H) {
|
|
302
|
-
const g = H, w =
|
|
303
|
-
|
|
302
|
+
const g = H, w = I(() => g.labelData.length === 30), F = I(() => Math.max(...g.chartData));
|
|
303
|
+
I(() => g.chartData.indexOf(F.value));
|
|
304
304
|
const V = (o, l = "SGD") => (typeof o == "number" ? o : Number(o)).toLocaleString("en-US", {
|
|
305
305
|
minimumFractionDigits: 2,
|
|
306
306
|
maximumFractionDigits: 2
|
|
307
307
|
}), j = (o, l = !1) => l ? G(o).format("DD MMM").toUpperCase() : G(o).format("ddd DD/MM").toUpperCase(), O = (o) => {
|
|
308
308
|
const l = [...g.chartData].sort((D, v) => v - D);
|
|
309
309
|
return o === l[0] ? "#4C8AFD" : o === l[1] ? "#80ACFE" : "#CCDEFE";
|
|
310
|
-
}, _ =
|
|
310
|
+
}, _ = I(() => ({
|
|
311
311
|
xAxis: {
|
|
312
312
|
data: (g.labelData || []).map((o) => j(o, w.value)),
|
|
313
313
|
splitLine: { show: !1 },
|
|
@@ -360,7 +360,13 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
360
360
|
top: "20",
|
|
361
361
|
containLabel: !0
|
|
362
362
|
},
|
|
363
|
-
|
|
363
|
+
// Animate on first render and whenever the data updates so bars grow up from
|
|
364
|
+
// the baseline (e.g. from a zero/empty state into their real values).
|
|
365
|
+
animation: !0,
|
|
366
|
+
animationDuration: 800,
|
|
367
|
+
animationDurationUpdate: 800,
|
|
368
|
+
animationEasing: "cubicOut",
|
|
369
|
+
animationEasingUpdate: "cubicOut",
|
|
364
370
|
series: [{
|
|
365
371
|
id: "myBar",
|
|
366
372
|
data: g.chartData,
|
|
@@ -372,7 +378,7 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
372
378
|
},
|
|
373
379
|
clip: !0
|
|
374
380
|
}]
|
|
375
|
-
})), k =
|
|
381
|
+
})), k = I(() => (g.labelData || []).map((o, l) => G(o).day() === 6 && l + 1 < g.labelData.length ? [l, l + 1] : null).filter(Boolean)), x = {
|
|
376
382
|
itemStyle: {
|
|
377
383
|
color: {
|
|
378
384
|
type: "linear",
|
|
@@ -388,10 +394,10 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
388
394
|
}
|
|
389
395
|
}
|
|
390
396
|
}, L = tt(), { chart: d } = at(L, _), N = (o, l, D = !1) => {
|
|
391
|
-
const v = o.getModel().getSeriesByType("bar"), z = v == null ? void 0 : v.map((
|
|
392
|
-
return l.forEach((
|
|
393
|
-
if (
|
|
394
|
-
const M = z.getItemLayout(
|
|
397
|
+
const v = o.getModel().getSeriesByType("bar"), z = v == null ? void 0 : v.map((S) => S.getData())[0], E = z.count(), C = [];
|
|
398
|
+
return l.forEach((S) => {
|
|
399
|
+
if (S < E) {
|
|
400
|
+
const M = z.getItemLayout(S);
|
|
395
401
|
C.push([
|
|
396
402
|
{ x: M.x - 2 },
|
|
397
403
|
{ x: M.x + M.width + 2 }
|
|
@@ -401,7 +407,7 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
401
407
|
{ x: C[0][0].x },
|
|
402
408
|
{ x: C[C.length - 1][1].x }
|
|
403
409
|
]] : C;
|
|
404
|
-
},
|
|
410
|
+
}, b = () => {
|
|
405
411
|
var o;
|
|
406
412
|
if (d.value)
|
|
407
413
|
if (w.value) {
|
|
@@ -430,7 +436,7 @@ const G = /* @__PURE__ */ st(ut), dt = {
|
|
|
430
436
|
}
|
|
431
437
|
};
|
|
432
438
|
return et([d, w], () => {
|
|
433
|
-
d.value &&
|
|
439
|
+
d.value && b();
|
|
434
440
|
}), (o, l) => (nt(), rt("div", {
|
|
435
441
|
ref_key: "barChart",
|
|
436
442
|
ref: L,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { ref as f, computed as b, watch as
|
|
1
|
+
import { ref as f, computed as b, watch as g, nextTick as _, createElementBlock as d, openBlock as m, createElementVNode as o, createCommentVNode as L, toDisplayString as i, Fragment as O, renderList as S, normalizeStyle as C } from "vue";
|
|
2
2
|
import { u as k } from "./useChart-D5nAyTGV.js";
|
|
3
|
-
const F = { class: "flex flex-col items-center justify-center" }, V = { class: "relative w-[210px] h-[210px]" }, j = { class: "absolute inset-0 flex flex-col items-center justify-center pointer-events-none" }, N = { class: "text-center" }, P = { class: "text-oc-text-400" },
|
|
3
|
+
const F = { class: "flex flex-col items-center justify-center" }, V = { class: "relative w-[210px] h-[210px]" }, j = { class: "absolute inset-0 flex flex-col items-center justify-center pointer-events-none" }, N = { class: "text-center" }, P = { class: "text-oc-text-400" }, E = { class: "text-lg font-semibold font-reddit-mono" }, T = {
|
|
4
4
|
key: 0,
|
|
5
5
|
class: "mt-4 flex flex-wrap gap-3 justify-center"
|
|
6
|
-
},
|
|
6
|
+
}, U = { class: "text-sm" }, z = {
|
|
7
7
|
__name: "OcOverviewPieChart",
|
|
8
8
|
props: {
|
|
9
9
|
chartData: Array,
|
|
@@ -25,15 +25,15 @@ const F = { class: "flex flex-col items-center justify-center" }, V = { class: "
|
|
|
25
25
|
default: !1
|
|
26
26
|
}
|
|
27
27
|
},
|
|
28
|
-
setup(
|
|
29
|
-
const t =
|
|
28
|
+
setup(n) {
|
|
29
|
+
const t = n, r = f(""), l = f(0), x = (e) => (typeof e == "number" ? e : Number(e)).toLocaleString(
|
|
30
30
|
"en-US",
|
|
31
31
|
t.currency ? { minimumFractionDigits: 2, maximumFractionDigits: 2 } : { minimumFractionDigits: 0, maximumFractionDigits: 0 }
|
|
32
32
|
), h = (e) => {
|
|
33
33
|
const a = typeof e == "number" ? e : Number(e);
|
|
34
34
|
return s.value ? Math.round(a / s.value * 100) : 0;
|
|
35
|
-
}, s = b(() => !t.chartData || t.chartData.length === 0 ? 0 : t.chartData.reduce((e, a) => e + (a.value || 0), 0)),
|
|
36
|
-
r.value = t.totalLabel,
|
|
35
|
+
}, s = b(() => !t.chartData || t.chartData.length === 0 ? 0 : t.chartData.reduce((e, a) => e + (a.value || 0), 0)), p = () => {
|
|
36
|
+
r.value = t.totalLabel, l.value = s.value;
|
|
37
37
|
}, D = b(() => ({
|
|
38
38
|
tooltip: t.tooltip,
|
|
39
39
|
series: [
|
|
@@ -48,7 +48,13 @@ const F = { class: "flex flex-col items-center justify-center" }, V = { class: "
|
|
|
48
48
|
borderColor: "#fff",
|
|
49
49
|
borderWidth: 2
|
|
50
50
|
},
|
|
51
|
-
|
|
51
|
+
// Animate the ring on first render and on data updates so slices sweep in
|
|
52
|
+
// instead of appearing instantly.
|
|
53
|
+
animation: !0,
|
|
54
|
+
animationDuration: 800,
|
|
55
|
+
animationDurationUpdate: 800,
|
|
56
|
+
animationEasing: "cubicOut",
|
|
57
|
+
animationEasingUpdate: "cubicOut",
|
|
52
58
|
label: {
|
|
53
59
|
show: !1
|
|
54
60
|
// Hide default labels
|
|
@@ -75,51 +81,51 @@ const F = { class: "flex flex-col items-center justify-center" }, V = { class: "
|
|
|
75
81
|
...t.additionalOptions ? t.additionalOptions : {}
|
|
76
82
|
}
|
|
77
83
|
]
|
|
78
|
-
})),
|
|
79
|
-
return
|
|
80
|
-
e && (await _(),
|
|
84
|
+
})), v = f(), { chart: y } = k(v, D), w = (e) => t.chartData[e].itemStyle.color;
|
|
85
|
+
return g(y, async (e) => {
|
|
86
|
+
e && (await _(), p(), e.on("mouseover", "series", (a) => {
|
|
81
87
|
if (a.componentType === "series" && a.seriesType === "pie") {
|
|
82
88
|
const c = a.name || "Unknown", u = a.value || 0;
|
|
83
|
-
r.value = `${c} (${h(u)}%)`,
|
|
89
|
+
r.value = `${c} (${h(u)}%)`, l.value = a.value || 0;
|
|
84
90
|
}
|
|
85
91
|
}), e.on("mouseout", "series", () => {
|
|
86
|
-
r.value = t.totalLabel,
|
|
92
|
+
r.value = t.totalLabel, l.value = s.value;
|
|
87
93
|
}));
|
|
88
|
-
}),
|
|
94
|
+
}), g(
|
|
89
95
|
() => t.chartData,
|
|
90
96
|
() => {
|
|
91
|
-
y.value &&
|
|
97
|
+
y.value && p();
|
|
92
98
|
},
|
|
93
99
|
{ deep: !0 }
|
|
94
100
|
), (e, a) => (m(), d("div", F, [
|
|
95
101
|
o("div", V, [
|
|
96
102
|
o("div", {
|
|
97
103
|
ref_key: "pieChart",
|
|
98
|
-
ref:
|
|
104
|
+
ref: v,
|
|
99
105
|
class: "w-[210px] h-[210px]"
|
|
100
106
|
}, null, 512),
|
|
101
107
|
o("div", j, [
|
|
102
108
|
o("div", N, [
|
|
103
|
-
o("div", P,
|
|
104
|
-
o("div",
|
|
109
|
+
o("div", P, i(r.value), 1),
|
|
110
|
+
o("div", E, i(n.currency) + " " + i(x(l.value)), 1)
|
|
105
111
|
])
|
|
106
112
|
])
|
|
107
113
|
]),
|
|
108
|
-
|
|
109
|
-
(m(!0), d(
|
|
114
|
+
n.chartData && n.chartData.length > 0 ? (m(), d("div", T, [
|
|
115
|
+
(m(!0), d(O, null, S(n.chartData, (c, u) => (m(), d("div", {
|
|
110
116
|
key: u,
|
|
111
117
|
class: "flex items-center gap-2 cursor-pointer hover:opacity-80 transition-opacity"
|
|
112
118
|
}, [
|
|
113
119
|
o("div", {
|
|
114
120
|
class: "w-3 h-3 rounded-full",
|
|
115
|
-
style:
|
|
121
|
+
style: C({ backgroundColor: w(u) })
|
|
116
122
|
}, null, 4),
|
|
117
|
-
o("span",
|
|
123
|
+
o("span", U, i(c.name) + " " + i(n.showPercentInLabel ? `(${h(c.value)}%)` : ""), 1)
|
|
118
124
|
]))), 128))
|
|
119
125
|
])) : L("", !0)
|
|
120
126
|
]));
|
|
121
127
|
}
|
|
122
128
|
};
|
|
123
129
|
export {
|
|
124
|
-
|
|
130
|
+
z as default
|
|
125
131
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@orchidui/dashboard",
|
|
3
3
|
"description": "Orchid Dashboard UI , Dashboard Ui Library Vue 3 tailwind css",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.106.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"build": "vite build"
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"rollup": "npm:@rollup/wasm-node"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@orchidui/core": "1.
|
|
36
|
+
"@orchidui/core": "1.106.0",
|
|
37
37
|
"dayjs": "^1.11.10",
|
|
38
38
|
"echarts": "^5.4.3",
|
|
39
39
|
"lottie-web": "^5.12.2",
|