@ithinkdt/ui 4.0.15 → 4.0.17

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/index.js DELETED
@@ -1,1225 +0,0 @@
1
- import { n as e, t } from "./use-i18n-D1TTDOML.js";
2
- import n, { c as r, cB as i, cE as a, cM as o } from "./use-style.js";
3
- import { i as s, n as c, r as l, t as u } from "./directives-g3YmS-dM.js";
4
- import { Fragment as d, computed as f, createVNode as p, defineComponent as m, inject as h, isVNode as g, mergeProps as _, provide as v, reactive as y, ref as b, renderSlot as x, shallowRef as ee, toRef as S, toValue as C, unref as w, useTemplateRef as T, watch as E, withDirectives as D } from "vue";
5
- import { computedAsync as te, promiseTimeout as O, useElementHover as k, useElementSize as ne, useEventListener as re, useFullscreen as ie, watchDebounced as ae } from "@vueuse/core";
6
- import { NAvatar as A, NBadge as oe, NBreadcrumb as se, NBreadcrumbItem as ce, NButton as j, NDrawer as le, NDrawerContent as M, NDropdown as N, NEmpty as P, NIcon as F, NList as I, NListItem as L, NMenu as R, NPagination as z, NPopover as B, NScrollbar as V, NText as H, NThing as U, useThemeVars as W } from "ithinkdt-ui";
7
- import { useAtomicBroadcast as ue } from "@ithinkdt/common/composables";
8
- import { RouterLink as de, useRouter as G } from "vue-router";
9
- import { walkTree as fe } from "@ithinkdt/common/tree";
10
- import { isNullish as pe } from "@ithinkdt/common/object";
11
- import { getOpaqueColor as me } from "@ithinkdt/common/color";
12
- import { format as he } from "date-fns";
13
- //#region src/design/Account.jsx
14
- function K(e) {
15
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
16
- }
17
- var ge = /* @__PURE__ */ m({
18
- name: "AppAccount",
19
- props: {
20
- username: String,
21
- nickname: String,
22
- head: String,
23
- showLogoutButton: {
24
- type: Boolean,
25
- default: !0
26
- },
27
- showChangePwd: {
28
- type: Boolean,
29
- default: !0
30
- }
31
- },
32
- emit: ["logout", "change-pwd"],
33
- setup(t, { emit: n, slots: r }) {
34
- let i = f(() => /^[\u4E00-\u9FA5]+$/.test(t.nickname) ? t.nickname?.slice(t.nickname?.length > 3 ? 2 : 1) : t.nickname?.split(" ")[0]), { t: a } = e(), o = p(F, { size: "28" }, { default: () => [p("svg", {
35
- xmlns: "http://www.w3.org/2000/svg",
36
- width: "1em",
37
- height: "1em",
38
- viewBox: "-4 -4 32 32"
39
- }, [p("path", {
40
- fill: "currentColor",
41
- d: "M12 12q-1.65 0-2.825-1.175T8 8t1.175-2.825T12 4t2.825 1.175T16 8t-1.175 2.825T12 12m-8 6v-.8q0-.85.438-1.562T5.6 14.55q1.55-.775 3.15-1.162T12 13t3.25.388t3.15 1.162q.725.375 1.163 1.088T20 17.2v.8q0 .825-.587 1.413T18 20H6q-.825 0-1.412-.587T4 18"
42
- }, null)])] }), c = p("svg", {
43
- xmlns: "http://www.w3.org/2000/svg",
44
- width: "1em",
45
- height: "1em",
46
- viewBox: "0 0 24 24"
47
- }, [p("path", {
48
- fill: "currentColor",
49
- d: "M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2a9.99 9.99 0 0 1 8 4h-2.71a8 8 0 1 0 .001 12h2.71A9.99 9.99 0 0 1 12 22m7-6v-3h-8v-2h8V8l5 4z"
50
- }, null)]);
51
- return () => {
52
- let e;
53
- return p("div", { style: "display: flex; align-items: center" }, [
54
- p(B, { style: "padding: 4px" }, {
55
- trigger: () => p(j, {
56
- quaternary: !0,
57
- style: "--n-padding: 0 12px"
58
- }, { default: () => [p("div", { style: "display: flex; align-items: center; gap: 8px" }, [p(A, {
59
- key: t.head ? "head" : "no-head",
60
- src: t.head,
61
- round: !0,
62
- size: "small",
63
- radix: .78,
64
- color: "var(--color-primary-hover)"
65
- }, {
66
- fallback: () => o,
67
- placeholder: () => o,
68
- default: t.head ? void 0 : () => i.value
69
- }), p("span", { style: "font-size: 14px" }, [t.username ?? ""])])] }),
70
- default: () => {
71
- let e = () => t.showChangePwd ? p(j, {
72
- quaternary: !0,
73
- style: "justify-content: left",
74
- onClick: () => n("change-pwd")
75
- }, {
76
- icon: () => p(F, null, { default: () => [p("svg", {
77
- xmlns: "http://www.w3.org/2000/svg",
78
- width: "1em",
79
- height: "1em",
80
- viewBox: "0 0 32 32"
81
- }, [p("path", {
82
- fill: "currentColor",
83
- d: "M21 2a8.998 8.998 0 0 0-8.612 11.612L2 24v6h6l10.388-10.388A9 9 0 1 0 21 2m0 16a7 7 0 0 1-2.032-.302l-1.147-.348l-.847.847l-3.181 3.181L12.414 20L11 21.414l1.379 1.379l-1.586 1.586L9.414 23L8 24.414l1.379 1.379L7.172 28H4v-3.172l9.802-9.802l.848-.847l-.348-1.147A7 7 0 1 1 21 18"
84
- }, null), p("circle", {
85
- cx: "22",
86
- cy: "10",
87
- r: "2",
88
- fill: "currentColor"
89
- }, null)])] }),
90
- default: () => a("common.account.changePwd")
91
- }) : void 0, i = () => t.showLogoutButton ? void 0 : p(j, {
92
- quaternary: !0,
93
- style: "justify-content: left",
94
- onClick: () => n("logout")
95
- }, {
96
- icon: () => p(F, null, K(c) ? c : { default: () => [c] }),
97
- default: () => [a("common.account.logout")]
98
- });
99
- return x(r, "dropdown", {
100
- pwd: e,
101
- logout: i
102
- }, () => [p("div", { style: "display: flex; flex-direction: column" }, [
103
- e(),
104
- x(r, "dropdownExtra"),
105
- i()
106
- ])]);
107
- }
108
- }),
109
- x(r, "extra"),
110
- t.showLogoutButton ? D(p(j, {
111
- quaternary: !0,
112
- style: "--n-padding: 0 12px",
113
- onClick: () => t.username && n("logout")
114
- }, K(e = x(r, "logoutButton", void 0, () => [p(F, { size: "16" }, K(c) ? c : { default: () => [c] })])) ? e : { default: () => [e] }), [[
115
- s,
116
- a("common.account.logout"),
117
- void 0,
118
- { "bottom-end": !0 }
119
- ]]) : void 0
120
- ]);
121
- };
122
- }
123
- }), _e = /* @__PURE__ */ m({
124
- name: "AppAppearance",
125
- props: { mode: String },
126
- emit: ["update:mode"],
127
- setup(t, { emit: n }) {
128
- let { t: r } = e();
129
- return () => D(p(j, {
130
- quaternary: !0,
131
- style: "--n-padding: 0 12px",
132
- onClick: () => {
133
- n("update:mode", t.mode === "light" ? "dark" : t.mode === "dark" ? "auto" : "light");
134
- }
135
- }, { default: () => [p(F, { size: "18" }, { default: () => [t.mode === "light" ? p("svg", {
136
- xmlns: "http://www.w3.org/2000/svg",
137
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
138
- role: "img",
139
- width: "1em",
140
- height: "1em",
141
- viewBox: "0 0 24 24"
142
- }, [p("path", {
143
- fill: "currentColor",
144
- d: "M12 15q1.25 0 2.125-.875T15 12q0-1.25-.875-2.125T12 9q-1.25 0-2.125.875T9 12q0 1.25.875 2.125T12 15Zm0 2q-2.075 0-3.537-1.463Q7 14.075 7 12t1.463-3.538Q9.925 7 12 7t3.538 1.462Q17 9.925 17 12q0 2.075-1.462 3.537Q14.075 17 12 17ZM1 13v-2h4v2Zm18 0v-2h4v2Zm-8-8V1h2v4Zm0 18v-4h2v4ZM6.35 7.75L3.875 5.275l1.4-1.4L7.75 6.35Zm12.375 12.375L16.25 17.65l1.4-1.4l2.475 2.475ZM17.65 7.75l-1.4-1.4l2.475-2.475l1.4 1.4ZM5.275 20.125l-1.4-1.4L6.35 16.25l1.4 1.4ZM12 12Z"
145
- }, null)]) : t.mode === "dark" ? p("svg", {
146
- xmlns: "http://www.w3.org/2000/svg",
147
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
148
- role: "img",
149
- width: "1em",
150
- height: "1em",
151
- viewBox: "0 0 24 24"
152
- }, [p("path", {
153
- fill: "currentColor",
154
- d: "M12 21q-3.75 0-6.375-2.625T3 12q0-3.75 2.625-6.375T12 3q.35 0 .688.025q.337.025.662.075q-1.025.725-1.637 1.887Q11.1 6.15 11.1 7.5q0 2.25 1.575 3.825Q14.25 12.9 16.5 12.9q1.375 0 2.525-.613q1.15-.612 1.875-1.637q.05.325.075.662Q21 11.65 21 12q0 3.75-2.625 6.375T12 21Zm0-2q2.2 0 3.95-1.212q1.75-1.213 2.55-3.163q-.5.125-1 .2q-.5.075-1 .075q-3.075 0-5.238-2.162Q9.1 10.575 9.1 7.5q0-.5.075-1t.2-1q-1.95.8-3.162 2.55Q5 9.8 5 12q0 2.9 2.05 4.95Q9.1 19 12 19Zm-.25-6.75Z"
155
- }, null)]) : p("svg", {
156
- xmlns: "http://www.w3.org/2000/svg",
157
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
158
- role: "img",
159
- width: "1em",
160
- height: "1em",
161
- viewBox: "0 0 24 24"
162
- }, [p("path", {
163
- fill: "currentColor",
164
- d: "M11 19q1.35 0 2.513-.538q1.162-.537 1.987-1.487q-3.15-.2-5.325-2.488Q8 12.2 8 9q0-.325.025-.638q.025-.312.075-.612q-1.4.775-2.25 2.162Q5 11.3 5 13q0 2.5 1.75 4.25T11 19Zm0 2q-3.35 0-5.675-2.325Q3 16.35 3 13q0-3.35 2.325-5.675Q7.65 5 11 5q.125 0 .25.012q.125.013.25.013q-.725.8-1.113 1.812Q10 7.85 10 9q0 2.5 1.75 4.25T16 15q.8 0 1.525-.2q.725-.2 1.375-.55q-.45 2.875-2.662 4.812Q14.025 21 11 21Zm2.8-10L17 2h2l3.2 9h-1.9l-.7-2h-3.2l-.7 2Zm3.05-3.35h2.3L18 4Z"
165
- }, null)])] })] }), [[
166
- s,
167
- t.mode === "light" ? r("common.layout.mode.light") : t.mode === "dark" ? r("common.layout.mode.dark") : r("common.layout.mode.auto"),
168
- void 0,
169
- { bottom: !0 }
170
- ]]);
171
- }
172
- }), q = "APP_SIDEBAR_COLLAPSED", J = () => p("svg", {
173
- xmlns: "http://www.w3.org/2000/svg",
174
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
175
- role: "img",
176
- width: "1em",
177
- height: "1em",
178
- viewBox: "0 0 24 24"
179
- }, [p("path", {
180
- fill: "currentColor",
181
- d: "m17 18l-5-2.18L7 18V5h10m0-2H7a2 2 0 0 0-2 2v16l7-3l7 3V5a2 2 0 0 0-2-2Z"
182
- }, null)]), Y = "__APP_CTX__", X = () => h(Y);
183
- //#endregion
184
- //#region src/design/Breadcrumb.jsx
185
- function ve(e) {
186
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
187
- }
188
- var ye = /* @__PURE__ */ m({
189
- name: "AppBreadcrumb",
190
- props: {
191
- items: {
192
- type: Array,
193
- default: () => []
194
- },
195
- getIcon: {
196
- type: Function,
197
- default: void 0
198
- }
199
- },
200
- setup(e) {
201
- let t = G(), n = Symbol(), r = Symbol();
202
- return E(() => e.items, (t) => {
203
- fe(t, (t) => {
204
- t.icon && (typeof t.icon == "string" ? (t[n] = e.getIcon?.(t.icon), t[r] = () => t[n]?.() || J()) : t[r] = t.icon);
205
- });
206
- }, { immediate: !0 }), () => {
207
- let n;
208
- return p(se, null, ve(n = e.items.map((e) => p(ce, {
209
- clickable: e.href?.length > 0,
210
- separator: e.separator,
211
- onClick: e.href && ((n) => {
212
- n.stopPropagation(), t.push(e.href);
213
- })
214
- }, { default: () => [e.icon ? p(d, null, [p(F, { component: e[r] }, null), " "]) : void 0, C(e.title)] }))) ? n : { default: () => [n] });
215
- };
216
- }
217
- }), be = /* @__PURE__ */ m({
218
- name: "AppFullscreen",
219
- props: {},
220
- emit: ["change"],
221
- setup(t, { emit: n }) {
222
- let { t: r } = e(), { isFullscreen: i, toggle: a } = ie();
223
- return () => D(p(j, {
224
- quaternary: !0,
225
- style: "--n-padding: 0 12px",
226
- onClick: () => {
227
- a(), n("change", i.value);
228
- }
229
- }, { default: () => [p(F, { size: "18" }, { default: () => [i.value ? p("svg", {
230
- xmlns: "http://www.w3.org/2000/svg",
231
- width: "1em",
232
- height: "1em",
233
- viewBox: "0 0 24 24"
234
- }, [p("path", {
235
- fill: "none",
236
- stroke: "currentColor",
237
- "stroke-linecap": "round",
238
- "stroke-linejoin": "round",
239
- "stroke-width": "1.5",
240
- d: "M8.345 3.75v2.095a2.5 2.5 0 0 1-2.5 2.5H3.75M8.345 20.25v-2.095a2.5 2.5 0 0 0-2.5-2.5H3.75M15.655 3.75v2.095a2.5 2.5 0 0 0 2.5 2.5h2.095M15.655 20.25v-2.095a2.5 2.5 0 0 1 2.5-2.5h2.095"
241
- }, null)]) : p("svg", {
242
- xmlns: "http://www.w3.org/2000/svg",
243
- width: "1em",
244
- height: "1em",
245
- viewBox: "0 0 24 24"
246
- }, [p("path", {
247
- fill: "none",
248
- stroke: "currentColor",
249
- "stroke-linecap": "round",
250
- "stroke-linejoin": "round",
251
- "stroke-width": "1.5",
252
- d: "M3.75 8.345V6.25a2.5 2.5 0 0 1 2.5-2.5h2.095M3.75 15.655v2.095a2.5 2.5 0 0 0 2.5 2.5h2.095M20.25 8.345V6.25a2.5 2.5 0 0 0-2.5-2.5h-2.095m4.595 11.905v2.095a2.5 2.5 0 0 1-2.5 2.5h-2.095"
253
- }, null)])] })] }), [[
254
- s,
255
- i.value ? r("common.layout.screen.exitfull") : r("common.layout.screen.full"),
256
- void 0,
257
- { bottom: !0 }
258
- ]]);
259
- }
260
- }), xe = /* @__PURE__ */ m({
261
- name: "AppLanguage",
262
- props: {
263
- lang: String,
264
- supports: Array
265
- },
266
- emit: ["update:lang"],
267
- setup(e, { emit: t }) {
268
- return () => p(N, {
269
- options: e.supports,
270
- keyField: "value",
271
- showArrow: !0,
272
- onSelect: (e) => t("update:lang", e)
273
- }, { default: () => [p(j, {
274
- quaternary: !0,
275
- style: "--n-padding: 0 12px"
276
- }, { default: () => [p(F, { size: "18" }, { default: () => [p("svg", {
277
- xmlns: "http://www.w3.org/2000/svg",
278
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
279
- role: "img",
280
- width: "1em",
281
- height: "1em",
282
- viewBox: "0 0 24 24"
283
- }, [p("g", {
284
- fill: "none",
285
- stroke: "currentColor",
286
- "stroke-linecap": "round",
287
- "stroke-linejoin": "round",
288
- "stroke-width": "1.5"
289
- }, [p("path", { d: "M2 12c0 5.523 4.477 10 10 10s10-4.477 10-10S17.523 2 12 2S2 6.477 2 12Z" }, null), p("path", { d: "M13 2.05S16 6 16 12c0 6-3 9.95-3 9.95m-2 0S8 18 8 12c0-6 3-9.95 3-9.95M2.63 15.5h18.74m-18.74-7h18.74" }, null)])])] })] })] });
290
- }
291
- }), Se = /* @__PURE__ */ r([
292
- i("layout", {
293
- display: "grid",
294
- gridTemplateAreas: "\n 'sidebar header'\n 'sidebar content'\n 'sidebar footer'\n ",
295
- gridTemplateRows: "auto 1fr auto",
296
- gridTemplateColumns: "auto 1fr",
297
- position: "relative",
298
- top: "0",
299
- left: "0",
300
- transition: "all 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
301
- "--app-content-height": "calc(100vh - var(--app-header-height) - var(--app-footer-height))"
302
- }, [o("full-header", { gridTemplateAreas: "\n 'header header'\n 'sidebar content'\n 'sidebar footer'\n " }), o("full-content", {
303
- width: "calc(100% + var(--app-sidebar-width))",
304
- height: "calc(100% + var(--app-header-height))",
305
- left: "calc(-1 * var(--app-sidebar-width))",
306
- top: "calc(-1 * var(--app-header-height))"
307
- })]),
308
- i("header", {
309
- gridArea: "header",
310
- overflow: "hidden",
311
- zIndex: 2,
312
- height: "var(--app-header-height, 44px)"
313
- }),
314
- i("sidebar", {
315
- gridArea: "sidebar",
316
- width: "var(--app-sidebar-width, 220px)",
317
- display: "flex",
318
- flexDirection: "column",
319
- overflow: "auto",
320
- position: "relative",
321
- transition: "width 0.2s ease-in-out",
322
- zIndex: "2"
323
- }, [a("collapse-btn", {
324
- "--n-padding": "0 12px",
325
- position: "absolute",
326
- zIndex: "2",
327
- bottom: "8px",
328
- right: "8px"
329
- })]),
330
- i("content", {
331
- gridArea: "content",
332
- position: "relative",
333
- overflow: "hidden",
334
- zIndex: "1"
335
- }),
336
- i("footer", {
337
- gridArea: "footer",
338
- lineHeight: "32px",
339
- textAlign: "center",
340
- color: "gray"
341
- })
342
- ]), Ce = () => p("svg", {
343
- xmlns: "http://www.w3.org/2000/svg",
344
- width: "1em",
345
- height: "1em",
346
- viewBox: "0 0 24 24"
347
- }, [p("path", {
348
- fill: "none",
349
- stroke: "currentColor",
350
- "stroke-linecap": "round",
351
- "stroke-linejoin": "round",
352
- "stroke-width": "1.5",
353
- d: "M11.5 18s-6-4.419-6-6s6-6 6-6m7 12s-6-4.419-6-6s6-6 6-6",
354
- color: "currentColor"
355
- }, null)]), we = () => p("svg", {
356
- xmlns: "http://www.w3.org/2000/svg",
357
- width: "1em",
358
- height: "1em",
359
- viewBox: "0 0 24 24"
360
- }, [p("path", {
361
- fill: "none",
362
- stroke: "currentColor",
363
- "stroke-linecap": "round",
364
- "stroke-linejoin": "round",
365
- "stroke-width": "1.5",
366
- d: "M12.5 18s6-4.419 6-6s-6-6-6-6m-7 12s6-4.419 6-6s-6-6-6-6",
367
- color: "currentColor"
368
- }, null)]), Te = /* @__PURE__ */ m({
369
- name: "AppLayout",
370
- props: {
371
- layout: {
372
- type: String,
373
- default: "left2right"
374
- },
375
- fullContent: Boolean
376
- },
377
- setup(e, { slots: t }) {
378
- n("-layout", Se, b("app"), !1);
379
- let r = y({
380
- sidebarWidth: "0px",
381
- headerHeight: "0px",
382
- footerHeight: "0px",
383
- hasMultiTab: !1
384
- });
385
- return v(Y, r), () => {
386
- let { layout: n } = e;
387
- return p("div", {
388
- class: {
389
- "app-layout": !0,
390
- "app-layout--full-header": n === "top2bottom",
391
- "app-layout--full-content": e.fullContent
392
- },
393
- style: {
394
- "--app-sidebar-width": r.sidebarWidth,
395
- "--app-header-height": r.headerHeight,
396
- "--app-footer-height": r.footerHeight
397
- }
398
- }, [x(t, "default")]);
399
- };
400
- }
401
- }), Ee = /* @__PURE__ */ m({
402
- name: "AppHeader",
403
- props: { height: {
404
- type: Number,
405
- default: 44
406
- } },
407
- setup(e, { slots: t }) {
408
- let n = X();
409
- return () => (n.headerHeight = e.height + "px", p("div", { class: "app-header" }, [x(t, "default")]));
410
- }
411
- }), De = /* @__PURE__ */ m({
412
- name: "AppSidebar",
413
- props: {
414
- showCollapseBtn: {
415
- type: Boolean,
416
- default: !0
417
- },
418
- collapsed: Boolean,
419
- width: {
420
- type: Number,
421
- default: 220
422
- },
423
- collapsedWidth: {
424
- type: Number,
425
- default: 60
426
- }
427
- },
428
- emits: { "update:collapsed": () => !0 },
429
- setup(t, { emit: n, slots: r }) {
430
- v(q, S(t, "collapsed"));
431
- let { t: i } = e(), a = X();
432
- return () => (a.sidebarWidth = (t.collapsed ? t.collapsedWidth : t.width) + "px", p("div", { class: "app-sidebar" }, [x(r, "default"), t.showCollapseBtn ? D(p(j, {
433
- class: "app-sidebar__collapse-btn",
434
- quaternary: !0,
435
- onClick: () => {
436
- n("update:collapsed", !t.collapsed);
437
- }
438
- }, { default: () => [p(F, { size: "20" }, { default: () => [t.collapsed ? p(we, null, null) : p(Ce, null, null)] })] }), [[s, t.collapsed ? i("common.layout.sidebar.expand") : i("common.layout.sidebar.collapse")]]) : void 0]));
439
- }
440
- }), Oe = /* @__PURE__ */ m({
441
- name: "AppContent",
442
- setup(e, { slots: t }) {
443
- return () => p("div", { class: "app-content" }, [x(t, "default")]);
444
- }
445
- }), ke = /* @__PURE__ */ m({
446
- name: "AppFooter",
447
- props: { height: {
448
- type: Number,
449
- default: 30
450
- } },
451
- setup(e, { slots: t }) {
452
- let n = X();
453
- return () => (n.footerHeight = e.height + "px", p("div", { class: "app-footer" }, [x(t, "default")]));
454
- }
455
- });
456
- //#endregion
457
- //#region src/design/Logo.jsx
458
- function Ae(e) {
459
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
460
- }
461
- var je = /* @__PURE__ */ m({
462
- name: "AppLogo",
463
- props: {
464
- src: [String, Function],
465
- name: String,
466
- collapsed: {
467
- type: Boolean,
468
- default: void 0
469
- },
470
- center: {
471
- type: Boolean,
472
- default: !1
473
- },
474
- link: {
475
- type: Boolean,
476
- default: !0
477
- }
478
- },
479
- setup(e, { slots: t }) {
480
- let n = te(() => typeof e.src == "function" ? e.src() : e.src), r = h(q, !1);
481
- return () => {
482
- let { name: i, collapsed: a, center: o, link: s } = e;
483
- a ??= w(r);
484
- let c = a ? 1 : 1 / 1.1;
485
- return p("div", {
486
- class: "app-logo",
487
- style: {
488
- "--app-logo-img-size": "32px",
489
- "--app-logo-name-size": "22px",
490
- width: o ? "100%" : "auto",
491
- overflow: "hidden",
492
- display: "flex",
493
- alignItems: "center",
494
- justifyContent: o ? "center" : "flex-start",
495
- cursor: s ? "pointer" : void 0
496
- }
497
- }, [x(t, "default", void 0, () => [p("div", {
498
- class: "app-logo__img",
499
- style: `
500
- width: ${a ? "var(--app-sidebar-width, 60px)" : "56px"};
501
- font-size: ${a ? "calc(var(--app-sidebar-width, 60px) - 24px)" : "32px"};
502
- transition: width 0.2s ease-in-out 0.1s;
503
- flex: 0 0 auto;
504
- display: flex;
505
- justify-content: center
506
- `
507
- }, [x(t, "icon", void 0, () => [p("img", {
508
- src: n.value,
509
- alt: "App Logo",
510
- style: `transition: height 0.2s ease-in-out; height: calc(var(--app-logo-img-size) * ${c})`
511
- }, null)])])]), i ? p(H, {
512
- class: "app-logo__name",
513
- style: "font-size: var(--app-logo-name-size); font-weight: bold; white-space: nowrap; flex: 0 1 auto; overflow: hidden"
514
- }, Ae(i) ? i : { default: () => [i] }) : void 0]);
515
- };
516
- }
517
- });
518
- //#endregion
519
- //#region src/design/Menu.jsx
520
- function Z(e) {
521
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
522
- }
523
- var Me = /* @__PURE__ */ m({
524
- name: "AppMenu",
525
- props: {
526
- menus: Array,
527
- getIcon: Function,
528
- current: String,
529
- horizontal: Boolean,
530
- single: Boolean,
531
- accordion: Boolean,
532
- collapsed: {
533
- type: Boolean,
534
- default: void 0
535
- },
536
- renderLabel: Function,
537
- width: {
538
- type: Number,
539
- default: 220
540
- },
541
- collapsedWidth: {
542
- type: Number,
543
- default: 60
544
- }
545
- },
546
- setup(e) {
547
- let t = ee([]);
548
- E([() => e.menus, () => e.single], ([n, r]) => {
549
- if (t.value = [], !n?.length) return;
550
- let i = (t, n = 0) => {
551
- let a = [];
552
- for (let o of t) {
553
- if (o.type === "action") continue;
554
- let t = o.type === "view" ? void 0 : i(o.children ?? [], n + 1), s = {
555
- _: o,
556
- key: o.key,
557
- label: () => e.renderLabel?.(o) ?? o.name,
558
- icon: n === 0 || o.icon ? pe(o.icon) || typeof o.icon == "string" ? e.getIcon?.(o.icon, o) ?? J : o.icon : void 0,
559
- children: r ? void 0 : t,
560
- path: o.path || (r ? t?.[0]?.path : void 0),
561
- depth: n
562
- };
563
- delete s.type, a.push(s);
564
- }
565
- return a;
566
- };
567
- t.value = i(n);
568
- }, { immediate: !0 }), E([T("menu"), () => e.current], ([e, t]) => {
569
- e?.showOption(t);
570
- }, { immediate: !0 });
571
- let n = h(q, !1), r = (t) => {
572
- let r = e.collapsed ?? w(n), i;
573
- if (t._.type === "view") if (t.isExternal && t.externalEmbed) i = p("a", {
574
- href: t.externalLink,
575
- target: "_blank",
576
- onClick: (e) => e.stopPropagation()
577
- }, [t.label()]);
578
- else {
579
- let e;
580
- i = p(de, { to: t.path }, Z(e = t.label()) ? e : { default: () => [e] });
581
- }
582
- else i = p("span", null, [t.label()]);
583
- return i.key = `${t.key}:${+!!r}`, t.depth === 0 && !r && (i = D(p("div", null, [i]), [[
584
- s,
585
- t.label(),
586
- void 0,
587
- {
588
- auto: !0,
589
- right: !0
590
- }
591
- ]])), t.isNew && (i = p("div", { style: "display: flex; width: 100%" }, [p("span", { style: "flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis" }, [i]), p("svg", {
592
- xmlns: "http://www.w3.org/2000/svg",
593
- width: "24",
594
- height: "24",
595
- viewBox: "0 0 1024 1024",
596
- style: "margin-left: 8px; flex: 0 0 auto;"
597
- }, [p("path", {
598
- d: "M245.76 286.72h552.96c124.928 0 225.28 100.352 225.28 225.28s-100.352 225.28-225.28 225.28H0V532.48c0-135.168 110.592-245.76 245.76-245.76z m133.12 348.16V401.408H348.16v178.176l-112.64-178.176H204.8V634.88h30.72v-178.176L348.16 634.88h30.72z m182.272-108.544v-24.576h-96.256v-75.776h110.592v-24.576h-141.312V634.88h143.36v-24.576h-112.64v-83.968h96.256z m100.352 28.672l-34.816-151.552h-34.816l55.296 233.472H675.84l47.104-161.792 4.096-20.48 4.096 20.48 47.104 161.792h28.672l57.344-233.472h-34.816l-32.768 151.552-4.096 30.72-6.144-30.72-40.96-151.552h-30.72l-40.96 151.552-6.144 30.72-6.144-30.72z",
599
- fill: "var(--color-danger)"
600
- }, null)])])), i;
601
- };
602
- return () => {
603
- let i = p(R, {
604
- ref: "menu",
605
- options: t.value,
606
- rootIndent: 16,
607
- accordion: e.accordion,
608
- collapsed: e.collapsed ?? w(n),
609
- dropdownProps: { showArrow: !0 },
610
- mode: e.horizontal ? "horizontal" : "vertical",
611
- value: e.current ?? null,
612
- renderLabel: r,
613
- responsive: !0,
614
- collapsedWidth: e.collapsedWidth,
615
- width: e.width
616
- }, null);
617
- return e.horizontal ? i : p(V, null, Z(i) ? i : { default: () => [i] });
618
- };
619
- }
620
- });
621
- //#endregion
622
- //#region src/design/MultiTabs.jsx
623
- function Ne(e) {
624
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
625
- }
626
- function Pe(t, n, r) {
627
- let { t: i } = e(), a = y({
628
- visible: !1,
629
- x: 0,
630
- y: 0
631
- }), o = async (e, t) => {
632
- e.preventDefault(), e.stopPropagation(), !(a.visible && a.tab === t) && (a.tab = t, a.visible && (a.visible = !1, await O(130)), a.visible = !0, a.x = e.clientX, a.y = e.clientY);
633
- }, s = async () => {
634
- requestIdleCallback(() => {
635
- a.visible = !1;
636
- }, { timeout: 30 });
637
- }, c = G();
638
- return {
639
- ctx: a,
640
- onCtx: o,
641
- onClickOutside: s,
642
- options: f(() => [
643
- {
644
- key: "reload",
645
- label: i("common.layout.tabs.reloadTab"),
646
- disabled: !a.tab || a.tab.key !== n.value,
647
- icon: () => p(F, { size: 20 }, { default: () => [p("svg", {
648
- xmlns: "http://www.w3.org/2000/svg",
649
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
650
- role: "img",
651
- width: "1em",
652
- height: "1em",
653
- viewBox: "0 0 24 24"
654
- }, [p("path", {
655
- fill: "currentColor",
656
- d: "M17.65 6.35A7.958 7.958 0 0 0 12 4a8 8 0 0 0-8 8a8 8 0 0 0 8 8c3.73 0 6.84-2.55 7.73-6h-2.08A5.99 5.99 0 0 1 12 18a6 6 0 0 1-6-6a6 6 0 0 1 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35Z"
657
- }, null)])] })
658
- },
659
- {
660
- key: "fullTab",
661
- label: i("common.layout.tabs.fullTab"),
662
- icon: () => p(F, { size: 16 }, { default: () => [p("svg", {
663
- xmlns: "http://www.w3.org/2000/svg",
664
- width: "1em",
665
- height: "1em",
666
- viewBox: "0 0 24 24"
667
- }, [p("path", {
668
- fill: "currentColor",
669
- "fill-rule": "evenodd",
670
- d: "M18.29 2.89c-1.028-.138-2.383-.14-4.29-.14a.75.75 0 0 1 0-1.5h.056c1.838 0 3.294 0 4.433.153c1.172.158 2.121.49 2.87 1.238c.748.749 1.08 1.698 1.238 2.87c.153 1.14.153 2.595.153 4.433V10a.75.75 0 0 1-1.5 0c0-1.907-.002-3.261-.14-4.29c-.135-1.005-.389-1.585-.812-2.008s-1.003-.677-2.009-.812M2 13.25a.75.75 0 0 1 .75.75c0 1.907.002 3.262.14 4.29c.135 1.005.389 1.585.812 2.008s1.003.677 2.009.812c1.028.138 2.382.14 4.289.14a.75.75 0 0 1 0 1.5h-.056c-1.838 0-3.294 0-4.433-.153c-1.172-.158-2.121-.49-2.87-1.238c-.748-.749-1.08-1.698-1.238-2.87c-.153-1.14-.153-2.595-.153-4.433V14a.75.75 0 0 1 .75-.75",
671
- "clip-rule": "evenodd"
672
- }, null), p("path", {
673
- fill: "currentColor",
674
- d: "M9.944 1.25H10a.75.75 0 0 1 0 1.5c-1.907 0-3.261.002-4.29.14c-1.005.135-1.585.389-2.008.812S3.025 4.705 2.89 5.71c-.138 1.029-.14 2.383-.14 4.29a.75.75 0 0 1-1.5 0v-.056c0-1.838 0-3.294.153-4.433c.158-1.172.49-2.121 1.238-2.87c.749-.748 1.698-1.08 2.87-1.238c1.14-.153 2.595-.153 4.433-.153M22 13.25a.75.75 0 0 1 .75.75v.056c0 1.838 0 3.294-.153 4.433c-.158 1.172-.49 2.121-1.238 2.87c-.749.748-1.698 1.08-2.87 1.238c-1.14.153-2.595.153-4.433.153H14a.75.75 0 0 1 0-1.5c1.907 0 3.262-.002 4.29-.14c1.005-.135 1.585-.389 2.008-.812s.677-1.003.812-2.009c.138-1.027.14-2.382.14-4.289a.75.75 0 0 1 .75-.75",
675
- opacity: ".5"
676
- }, null)])] })
677
- },
678
- {
679
- key: "open",
680
- label: i("common.layout.tabs.openTabBlank"),
681
- disabled: !a.tab,
682
- icon: () => p(F, { size: 20 }, { default: () => [p("svg", {
683
- xmlns: "http://www.w3.org/2000/svg",
684
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
685
- role: "img",
686
- width: "1em",
687
- height: "1em",
688
- viewBox: "0 0 15 15"
689
- }, [p("path", {
690
- fill: "currentColor",
691
- "clip-rule": "evenodd",
692
- "fill-rule": "evenodd",
693
- d: "M12 13a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v3.5a.5.5 0 0 0 1 0V3h9v9H8.5a.5.5 0 0 0 0 1H12ZM9 6.5v3a.5.5 0 0 1-1 0V7.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 7H5.5a.5.5 0 0 1 0-1h3a.498.498 0 0 1 .5.497"
694
- }, null)])] })
695
- },
696
- {
697
- key: "closeAll",
698
- label: i("common.layout.tabs.closeAllTabs"),
699
- icon: () => p(F, { size: 20 }, { default: () => [p("svg", {
700
- xmlns: "http://www.w3.org/2000/svg",
701
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
702
- role: "img",
703
- width: "1em",
704
- height: "1em",
705
- viewBox: "0 0 24 24"
706
- }, [p("path", {
707
- fill: "currentColor",
708
- d: "M6.4 19L5 17.6l5.6-5.6L5 6.4L6.4 5l5.6 5.6L17.6 5L19 6.4L13.4 12l5.6 5.6l-1.4 1.4l-5.6-5.6L6.4 19Z"
709
- }, null)])] })
710
- },
711
- {
712
- key: "closeLeft",
713
- label: i("common.layout.tabs.closeLeftTabs"),
714
- disabled: !a.tab,
715
- icon: () => p(F, { size: 20 }, { default: () => [p("svg", {
716
- xmlns: "http://www.w3.org/2000/svg",
717
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
718
- role: "img",
719
- width: "1em",
720
- height: "1em",
721
- viewBox: "0 0 24 24"
722
- }, [p("path", {
723
- fill: "currentColor",
724
- d: "M11 16v-3h10v-2H11V8l-4 4l4 4m-8 4h2V4H3v16Z"
725
- }, null)])] })
726
- },
727
- {
728
- key: "closeRight",
729
- label: i("common.layout.tabs.closeRightTabs"),
730
- disabled: !a.tab,
731
- icon: () => p(F, { size: 20 }, { default: () => [p("svg", {
732
- xmlns: "http://www.w3.org/2000/svg",
733
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
734
- role: "img",
735
- width: "1em",
736
- height: "1em",
737
- viewBox: "0 0 24 24"
738
- }, [p("path", {
739
- fill: "currentColor",
740
- d: "M13 8v3H3v2h10v3l4-4l-4-4m6 12h2V4h-2v16Z"
741
- }, null)])] })
742
- },
743
- {
744
- key: "closeOther",
745
- label: i("common.layout.tabs.closeOtherTabs"),
746
- disabled: !a.tab,
747
- icon: () => p(F, { size: 20 }, { default: () => [" ", p("svg", {
748
- xmlns: "http://www.w3.org/2000/svg",
749
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
750
- role: "img",
751
- width: "1em",
752
- height: "1em",
753
- viewBox: "0 0 1024 1024"
754
- }, [p("path", {
755
- fill: "currentColor",
756
- d: "M180 176h-60c-4.4 0-8 3.6-8 8v656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V184c0-4.4-3.6-8-8-8zm724 0h-60c-4.4 0-8 3.6-8 8v656c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V184c0-4.4-3.6-8-8-8zM785.3 504.3L657.7 403.6a7.23 7.23 0 0 0-11.7 5.7V476H378v-62.8c0-6-7-9.4-11.7-5.7L238.7 508.3a7.14 7.14 0 0 0 0 11.3l127.5 100.8c4.7 3.7 11.7.4 11.7-5.7V548h268v62.8c0 6 7 9.4 11.7 5.7l127.5-100.8c3.8-2.9 3.8-8.5.2-11.4z"
757
- }, null)])] })
758
- }
759
- ]),
760
- onSelect: async (e) => {
761
- a.visible = !1;
762
- let i = [...t.value];
763
- if (e === "closeAll") {
764
- await c.push("/");
765
- for (let e of i) e.key !== n.value && e.close(!1);
766
- return;
767
- }
768
- if (e === "fullTab") {
769
- r();
770
- return;
771
- }
772
- if (a.tab) switch (e) {
773
- case "open":
774
- window.open(a.tab.href, "_blank");
775
- break;
776
- case "reload":
777
- a.tab.reloading || (a.tab.reloading = !0, await O(220), a.tab.reloading = !1);
778
- break;
779
- case "close":
780
- a.tab?.close();
781
- break;
782
- case "closeOther":
783
- n.value !== a.tab.key && await c.push(a.tab.fullPath);
784
- for (let e of i) e.key !== a.tab.key && e.close(!1);
785
- break;
786
- case "closeLeft":
787
- n.value !== a.tab.key && await c.push(a.tab.fullPath);
788
- for (let e of t.value.slice(0, i.indexOf(a.tab))) e.close(!1);
789
- break;
790
- case "closeRight":
791
- n.value !== a.tab.key && await c.push(a.tab.fullPath);
792
- for (let e of t.value.slice(i.indexOf(a.tab) + 1)) e.close(!1);
793
- break;
794
- }
795
- }
796
- };
797
- }
798
- function Fe(e, t, n) {
799
- function r(n) {
800
- if (n === -1 || !t.value?.children.length) return;
801
- let r = t.value.children[n];
802
- e.value.scrollTo({
803
- behavior: "smooth",
804
- left: Math.max(0, t.value.offsetLeft + r.offsetLeft - e.value.clientWidth / 2 + r.clientWidth / 2 + 10)
805
- });
806
- }
807
- return ae(k(e), (e) => {
808
- e || r(n.value);
809
- }, { debounce: 333 }), E(n, r, { flush: "post" }), re(e, "wheel", (t) => {
810
- t.deltaMode === WheelEvent.DOM_DELTA_PIXEL && (t.preventDefault(), e.value.scrollBy({ left: t.deltaY }));
811
- }, { passive: !1 }), {
812
- el: e,
813
- content: t
814
- };
815
- }
816
- var Q = (e) => p("svg", e, [
817
- p("defs", null, [
818
- p("symbol", {
819
- id: "geometry-left",
820
- viewBox: "0 0 214 36"
821
- }, [p("path", { d: "M17 0h197v36H0v-2c4.5 0 9-3.5 9-8V8c0-4.5 3.5-8 8-8z" }, null)]),
822
- p("symbol", {
823
- id: "geometry-right",
824
- viewBox: "0 0 214 36"
825
- }, [p("use", { "xlink:href": "#geometry-left" }, null)]),
826
- p("clipPath", null, [p("rect", {
827
- width: "100%",
828
- height: "100%",
829
- x: "0"
830
- }, null)])
831
- ]),
832
- p("svg", {
833
- width: "50%",
834
- height: "100%"
835
- }, [p("use", {
836
- "xlink:href": "#geometry-left",
837
- width: "214",
838
- height: "36",
839
- fill: "currentColor"
840
- }, null)]),
841
- p("g", { transform: "scale(-1, 1)" }, [p("svg", {
842
- width: "50%",
843
- height: "100%",
844
- x: "-100%",
845
- y: "0"
846
- }, [p("use", {
847
- "xlink:href": "#geometry-right",
848
- width: "214",
849
- height: "36",
850
- fill: "currentColor"
851
- }, null)])])
852
- ]), Ie = /* @__PURE__ */ m({
853
- name: "AppTab",
854
- props: {
855
- path: String,
856
- isCurrent: Boolean,
857
- isLast: Boolean,
858
- closable: Boolean,
859
- dark: Boolean
860
- },
861
- emits: ["close"],
862
- setup(e, { emit: t, slots: n }) {
863
- let r = b(), i = k(r), a = b(), o = b(), { width: s } = ne(o);
864
- E(s, async () => {
865
- await O(1), a.value.style.width = o.value.scrollWidth + "px";
866
- });
867
- let c = W(), l = f(() => ({
868
- fontSize: "14px",
869
- color: e.isCurrent ? c.value.primaryColor : c.value.textColor3,
870
- maxWidth: "355px",
871
- overflow: "hidden"
872
- })), u = f(() => ({
873
- width: "calc(100% + 27px)",
874
- height: "100%",
875
- position: "absolute",
876
- top: "0",
877
- left: "-14px",
878
- zIndex: e.isCurrent ? -1 : -2,
879
- color: e.isCurrent ? me(c.value.primaryColor, e.dark ? .3 : .12, e.dark ? "#000" : "#fff") : i.value ? c.value.borderColor : "transparent"
880
- }));
881
- return () => p("div", {
882
- ref: r,
883
- style: "position: relative; padding: 2px 10px 5px; cursor: pointer"
884
- }, [
885
- p("div", {
886
- ref: a,
887
- style: "transition: width 300ms; overflow: hidden"
888
- }, [p("div", {
889
- ref: o,
890
- style: "display: flex; align-items: center; gap: 4px; width: fit-content"
891
- }, [p("span", { style: l.value }, [x(n, "default")]), e.closable !== !1 && (e.isCurrent || i.value) ? p("span", { style: "line-height: 0; display: inline-block; text-align: right; padding-top: 2px" }, [p(j, {
892
- text: !0,
893
- onClick: (e) => {
894
- e.stopPropagation(), t("close");
895
- }
896
- }, { default: () => [p(F, { size: 18 }, { default: () => [p("svg", {
897
- xmlns: "http://www.w3.org/2000/svg",
898
- width: "1em",
899
- height: "1em",
900
- viewBox: "0 0 24 24"
901
- }, [p("path", {
902
- fill: "currentColor",
903
- d: "m6.4 18.308l-.708-.708l5.6-5.6l-5.6-5.6l.708-.708l5.6 5.6l5.6-5.6l.708.708l-5.6 5.6l5.6 5.6l-.708.708l-5.6-5.6z"
904
- }, null)])] })] })]) : void 0])]),
905
- p("span", { style: "height: 50%; width: 1px; background: #aaa; display: inline-block; position: absolute; top: 20%; right: -4px; z-index: -3" }, null),
906
- p(Q, { style: u.value }, null)
907
- ]);
908
- }
909
- }), Le = /* @__PURE__ */ m({
910
- name: "AppMultiTabs",
911
- props: {
912
- fullTab: Boolean,
913
- showBreadcrumb: Boolean,
914
- tabs: Array,
915
- current: Object,
916
- dark: Boolean
917
- },
918
- emits: ["update:fullTab"],
919
- setup(e, { emit: t, slots: n }) {
920
- let r = X();
921
- r.hasMultiTab = !0;
922
- let i = G(), { ctx: a, onCtx: o, onClickOutside: s, options: c, onSelect: l } = Pe(S(e, "tabs"), f(() => e.current?.key), () => t("update:fullTab", !e.fullTab)), u = f(() => e.current ? e.tabs.findIndex((t) => t.key === e.current?.key) : -1), d = b(), m = b();
923
- return Fe(d, m, u), () => p("div", { style: "width: 100%; height: 100%; overflow: hidden; display: flex; justify-content: space-between" }, [p("div", {
924
- ref: d,
925
- style: "flex: 1 1 100%; height: 100%; display: flex; overflow: hidden; align-items: center; position: relative"
926
- }, [
927
- p("div", { style: "height: 100%; flex: 0 0 16px; z-index: 1; position: sticky; left: 0; backdrop-filter: opacity(0.9) blur(5px)" }, null),
928
- p("div", {
929
- ref: m,
930
- style: "padding-inline: 12px; flex: 1 1 auto; display: flex; align-items: end; gap: 8px; height: 100%",
931
- onContextmenu: (e) => o(e)
932
- }, [e.tabs.map((t, r, a) => {
933
- let s, c = e.current?.key === t.key, l = t.title ?? t.path;
934
- return p(Ie, {
935
- key: t.key,
936
- isCurrent: c,
937
- isLast: r === a.length - 1,
938
- onClose: t.close,
939
- closable: t.closable,
940
- dark: e.dark,
941
- onClick: () => {
942
- c || i.push(t.fullPath);
943
- },
944
- onContextmenu: (e) => o(e, t)
945
- }, Ne(s = x(n, "name", {
946
- isCurrent: c,
947
- name: l,
948
- tab: t
949
- }, () => [l])) ? s : { default: () => [s] });
950
- })]),
951
- p("div", { style: "height: 100%; flex: 0 0 16px; z-index: 1; position: sticky; right: 0; backdrop-filter: opacity(0.9) blur(5px)" }, null)
952
- ]), p(N, {
953
- placement: "bottom-start",
954
- trigger: "manual",
955
- show: a.visible,
956
- x: a.x,
957
- y: a.y,
958
- options: c.value,
959
- onClickoutside: s,
960
- onSelect: l
961
- }, null)]);
962
- }
963
- });
964
- //#endregion
965
- //#region src/design/Notification.jsx
966
- function $(e) {
967
- return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !g(e);
968
- }
969
- var Re = /* @__PURE__ */ m({
970
- name: "AppNotification",
971
- inheritAttrs: !1,
972
- props: {
973
- getUnreadCount: Function,
974
- getPage: Function,
975
- markRead: Function,
976
- markDelete: Function,
977
- interval: {
978
- type: Number,
979
- default: 3e4
980
- }
981
- },
982
- setup(t, { slots: n, attrs: r }) {
983
- let { t: i } = e(), a = b(!1), o = b("unread"), l = y({
984
- page: 1,
985
- size: 10,
986
- loading: !1,
987
- records: [],
988
- total: 0,
989
- unread: 0
990
- }), { sync: u, post: f } = ue({
991
- channel: "__ithinkdt_mc_shared_channel",
992
- onMsg: (e) => {
993
- l.unread = e;
994
- },
995
- getMsg: () => (a.value && (l.loading = !0, Promise.resolve(t.getPage?.(o.value, l.page, l.size) ?? []).then(({ records: e, total: t }) => {
996
- l.records = e, o.value === "unread" ? (l.unread = t, f(t)) : l.total = t;
997
- }).finally(() => {
998
- l.loading = !1;
999
- })), t.getUnreadCount?.() ?? 0),
1000
- timeout: () => t.interval,
1001
- immediate: !0
1002
- });
1003
- return () => {
1004
- let e, f = D(p(j, _(r, {
1005
- quaternary: !0,
1006
- style: "--n-padding: 0 12px",
1007
- onClick: () => {
1008
- a.value = !0, o.value = l.unread > 0 ? "unread" : "all", setTimeout(u, 300);
1009
- }
1010
- }), $(e = x(n, "icon", void 0, () => [p(oe, {
1011
- show: l.unread > 0,
1012
- dot: !0,
1013
- offset: [-2, 5],
1014
- processing: !0
1015
- }, { default: () => [p(F, { size: "18" }, { default: () => [p("svg", {
1016
- xmlns: "http://www.w3.org/2000/svg",
1017
- width: "1em",
1018
- height: "1em",
1019
- viewBox: "0 0 24 24"
1020
- }, [p("g", {
1021
- fill: "none",
1022
- stroke: "currentColor",
1023
- "stroke-linecap": "round",
1024
- "stroke-linejoin": "round",
1025
- "stroke-width": "1.5",
1026
- color: "currentColor"
1027
- }, [p("path", { d: "M2.53 14.77c-.213 1.394.738 2.361 1.902 2.843c4.463 1.85 10.673 1.85 15.136 0c1.164-.482 2.115-1.45 1.902-2.843c-.13-.857-.777-1.57-1.256-2.267c-.627-.924-.689-1.931-.69-3.003C19.525 5.358 16.157 2 12 2S4.475 5.358 4.475 9.5c0 1.072-.062 2.08-.69 3.003c-.478.697-1.124 1.41-1.255 2.267" }, null), p("path", { d: "M8 19c.458 1.725 2.076 3 4 3c1.925 0 3.541-1.275 4-3" }, null)])])] })] })])) ? e : { default: () => [e] }), [[
1028
- s,
1029
- i("common.notification.tip", { count: l.unread }),
1030
- void 0,
1031
- { bottom: !0 }
1032
- ]]), m = () => {
1033
- let e, t;
1034
- return p("div", { style: "display: flex; align-items: baseline; gap: 20px" }, [
1035
- p("div", { style: "padding-right: 12px" }, [i("common.notification.title")]),
1036
- p(j, {
1037
- text: !0,
1038
- type: o.value === "all" ? "primary" : "default",
1039
- onClick: () => {
1040
- o.value = "all", u();
1041
- }
1042
- }, $(e = i("common.notification.all")) ? e : { default: () => [e] }),
1043
- p(j, {
1044
- text: !0,
1045
- type: o.value === "unread" ? "primary" : "default",
1046
- onClick: () => {
1047
- o.value = "unread", u();
1048
- }
1049
- }, $(t = i("common.notification.unread", { count: l.unread > 99 ? "99+" : l.unread.toString() })) ? t : { default: () => [t] })
1050
- ]);
1051
- }, h = (e) => p(L, {
1052
- key: e.key,
1053
- onClick: () => {
1054
- e.status === "unread" && (t.markRead?.([e.key]).then(() => {
1055
- e.status = "read";
1056
- }), l.unread--), e.link && window.open(e.link, "_target");
1057
- }
1058
- }, { default: () => [p(U, {
1059
- bordered: !1,
1060
- closable: !0,
1061
- contentIndented: !0,
1062
- size: "small",
1063
- onMouseenter: () => e.hover = !0,
1064
- onMouseleave: () => e.hover = !1,
1065
- style: "padding: 0 4px"
1066
- }, {
1067
- avatar: () => p(F, {
1068
- size: 22,
1069
- color: e.status === "unread" ? "var(--color-primary)" : void 0
1070
- }, { default: () => [p("svg", {
1071
- xmlns: "http://www.w3.org/2000/svg",
1072
- width: "1em",
1073
- height: "1em",
1074
- viewBox: "0 0 24 24"
1075
- }, [p("path", {
1076
- fill: "currentColor",
1077
- d: "M12.3 7.29c.2-.18.44-.29.7-.29c.27 0 .5.11.71.29c.19.21.29.45.29.71c0 .27-.1.5-.29.71c-.21.19-.44.29-.71.29c-.26 0-.5-.1-.7-.29c-.19-.21-.3-.44-.3-.71c0-.26.11-.5.3-.71m-2.5 4.68s2.17-1.72 2.96-1.79c.74-.06.59.79.52 1.23l-.01.06c-.14.53-.31 1.17-.48 1.78c-.38 1.39-.75 2.75-.66 3c.1.34.72-.09 1.17-.39c.06-.04.11-.08.16-.11c0 0 .08-.08.16.03c.02.03.04.06.06.08c.09.14.14.19.02.27l-.04.02c-.22.15-1.16.81-1.54 1.05c-.41.27-1.98 1.17-1.74-.58c.21-1.23.49-2.29.71-3.12c.41-1.5.59-2.18-.33-1.59c-.37.22-.59.36-.72.45c-.11.08-.12.08-.19-.05l-.03-.06l-.05-.08c-.07-.1-.07-.11.03-.2M22 12c0 5.5-4.5 10-10 10S2 17.5 2 12S6.5 2 12 2s10 4.5 10 10m-2 0c0-4.42-3.58-8-8-8s-8 3.58-8 8s3.58 8 8 8s8-3.58 8-8"
1078
- }, null)])] }),
1079
- header: () => e.title,
1080
- "header-extra": () => {
1081
- let n, r;
1082
- return e.hover ? p("div", {
1083
- style: "display: flex; justify-content: end; gap: 12px",
1084
- onClick: (e) => {
1085
- e.preventDefault(), e.stopPropagation();
1086
- }
1087
- }, [e.status === "unread" ? p(j, {
1088
- text: !0,
1089
- type: "primary",
1090
- onClick: () => {
1091
- t.markRead?.([e.key]).then(() => {
1092
- e.status = "read", l.unread--;
1093
- });
1094
- }
1095
- }, $(n = i("common.notification.markRead")) ? n : { default: () => [n] }) : void 0, p(j, {
1096
- text: !0,
1097
- type: "error",
1098
- onClick: () => {
1099
- l.records === 1 ? (l.records = [], u()) : l.records.splice(l.records.findIndex((t) => t.key == e.key), 1), t.markDelete?.([e.key]);
1100
- }
1101
- }, $(r = i("common.notification.markDelete")) ? r : { default: () => [r] })]) : void 0;
1102
- },
1103
- default: e.content,
1104
- footer: () => p("span", { style: "color: gray" }, [e.hover ? he(e.date, i("common.notification.time")) : i("common.timeago", { time: e.date })])
1105
- })] }), g = () => {
1106
- let e;
1107
- return D(l.records.length > 0 ? p(I, {
1108
- clickable: !0,
1109
- hoverable: !0,
1110
- style: "min-height: 50vh"
1111
- }, $(e = l.records.map((e) => h(e))) ? e : { default: () => [e] }) : p(P, { style: "margin-top: 30vh" }, null), [[c, l.loading]]);
1112
- }, v = () => p("div", { style: "display: flex; justify-content: space-between; width: 100%" }, [o.value === "unread" ? p(j, {
1113
- text: !0,
1114
- type: "primary",
1115
- disabled: l.records.length === 0,
1116
- onClick: () => {
1117
- let e = l.records.filter((e) => e.status === "unread").map((e) => e.key);
1118
- t.markRead(e).then(() => {
1119
- for (; l.unread - e.length <= l.size * (l.page - 1);) l.page--;
1120
- u();
1121
- });
1122
- }
1123
- }, {
1124
- icon: () => p(F, { size: "20" }, { default: () => [p("svg", {
1125
- xmlns: "http://www.w3.org/2000/svg",
1126
- width: "1em",
1127
- height: "1em",
1128
- viewBox: "0 0 24 24"
1129
- }, [p("path", {
1130
- fill: "currentColor",
1131
- d: "M.41 13.41L6 19l1.41-1.42L1.83 12m20.41-6.42L11.66 16.17L7.5 12l-1.43 1.41L11.66 19l12-12M18 7l-1.41-1.42l-6.35 6.35l1.42 1.41z"
1132
- }, null)])] }),
1133
- default: () => i("common.notification.markPageRead")
1134
- }) : p("span", null, null), p(z, {
1135
- simple: !0,
1136
- pageSize: l.size,
1137
- page: l.page,
1138
- itemCount: o.value === "unread" ? l.unread : l.total,
1139
- onUpdatePage: (e) => {
1140
- l.page = e, u();
1141
- }
1142
- }, null)]);
1143
- return p(d, null, [f, p(le, {
1144
- show: a.value,
1145
- "onUpdate:show": (e) => a.value = e,
1146
- showMask: !1,
1147
- width: 400
1148
- }, { default: () => [p(M, {
1149
- title: i("common.notification.title"),
1150
- closable: !0,
1151
- nativeScrollbar: !1,
1152
- bodyContentStyle: { padding: "0" }
1153
- }, {
1154
- header: m,
1155
- default: g,
1156
- footer: v
1157
- })] })]);
1158
- };
1159
- }
1160
- }), ze = (e) => p("svg", _({
1161
- xmlns: "http://www.w3.org/2000/svg",
1162
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
1163
- role: "img",
1164
- width: "1em",
1165
- height: "1em",
1166
- viewBox: "0 0 24 24"
1167
- }, e), [p("path", {
1168
- fill: "currentColor",
1169
- d: "m9.55 18l-5.7-5.7l1.425-1.425L9.55 15.15l9.175-9.175L20.15 7.4z"
1170
- }, null)]), Be = /* @__PURE__ */ m({
1171
- name: "AppTenant",
1172
- props: {
1173
- options: Array,
1174
- current: String
1175
- },
1176
- emit: ["update:current"],
1177
- setup(t, { emit: n }) {
1178
- let { t: r } = e(), i = (e) => e.disabled ? p("div", null, [e.name]) : p("div", { style: "display: flex; align-items: center; justify-content: space-between; gap: 20px" }, [p("div", { style: "display: flex; align-items: center; gap: 8px" }, [p(A, {
1179
- round: !0,
1180
- size: 22,
1181
- color: "var(--color-primary-hover)"
1182
- }, { default: () => [e.icon?.() || e.name[0]] }), p("span", { style: e.id === t.current ? "color: var(--color-primary)" : "" }, [e.name])]), e.id === t.current ? p(ze, { style: "color: var(--color-primary); font-size: 20px" }, null) : p("div", null, null)]), a = f(() => [{
1183
- id: "___",
1184
- name: r("common.account.changeTenant"),
1185
- disabled: !0
1186
- }, ...t.options ?? []]);
1187
- return () => {
1188
- if (!t.options?.length) return;
1189
- let e = t.options.find((e) => e.id === t.current);
1190
- return p(N, {
1191
- options: a.value,
1192
- placement: "bottom-end",
1193
- keyField: "id",
1194
- labelField: "name",
1195
- showArrow: !0,
1196
- renderLabel: i,
1197
- onSelect: (e) => e !== t.current && n("update:current", e)
1198
- }, { default: () => [p(j, {
1199
- quaternary: !0,
1200
- style: "--n-padding: 0 6px"
1201
- }, {
1202
- icon: () => p(F, { size: "18" }, { default: () => [p("svg", {
1203
- xmlns: "http://www.w3.org/2000/svg",
1204
- "xmlns:xlink": "http://www.w3.org/1999/xlink",
1205
- viewBox: "0 0 1024 1024",
1206
- width: "1em",
1207
- height: "1em",
1208
- role: "img"
1209
- }, [p("path", {
1210
- d: "M728 600.2c8.1-13.2 4-30.4-9.1-38.5-30.7-19-63.6-33.8-97.8-44.4 69.4-43 115.6-119.8 115.6-207.4C736.7 175.2 627.5 66 492.8 66S249 175.2 249 309.9c0 88.2 46.8 165.5 117 208.3-12.9 4.1-25.6 8.8-38.1 14.1-51.1 21.8-97 53-136.4 92.7-39.4 39.7-70.3 85.9-91.9 137.4-22.4 53.3-33.7 109.9-33.7 168.2 0 15.5 12.5 28 28 28s28-12.5 28-28c0-207.5 167.4-376.3 373.2-376.3 68.8 0 136.1 19 194.4 55 13.1 8.2 30.4 4.1 38.5-9.1zM305 309.9c0-50.2 19.5-97.4 55-132.8 35.5-35.5 82.7-55 132.8-55 50.2 0 97.4 19.5 132.8 55 35.5 35.5 55 82.7 55 132.8s-19.5 97.4-55 132.8c-35.5 35.5-82.7 55-132.8 55-50.2 0-97.4-19.5-132.8-55-35.5-35.5-55-82.6-55-132.8zM606.2 746.4h325.1c11.3 0 21.5-6.8 25.9-17.3s1.9-22.5-6.1-30.5L844.5 592.1c-10.9-10.9-28.7-10.9-39.6 0-10.9 10.9-10.9 28.7 0 39.6l58.7 58.6H606.2c-15.5 0-28 12.5-28 28s12.6 28.1 28 28.1zM931.4 794.6H606.3c-11.3 0-21.5 6.8-25.9 17.3s-1.9 22.5 6.1 30.5l106.6 106.4c5.5 5.5 12.6 8.2 19.8 8.2 7.2 0 14.4-2.7 19.8-8.2 10.9-10.9 10.9-28.7 0-39.6L674 850.6h257.4c15.5 0 28-12.5 28-28s-12.5-28-28-28z",
1211
- fill: "currentColor"
1212
- }, null)])] }),
1213
- default: () => e?.shotName || e?.name
1214
- })] });
1215
- };
1216
- }
1217
- }), Ve = /* @__PURE__ */ m({
1218
- name: "UIProvider",
1219
- props: { i18n: Function },
1220
- setup(e, { slots: n }) {
1221
- return v(t, S(e, "i18n")), () => x(n, "default");
1222
- }
1223
- });
1224
- //#endregion
1225
- export { ge as AppAccount, _e as AppAppearance, ye as AppBreadcrumb, Oe as AppContent, ke as AppFooter, be as AppFullscreen, Ee as AppHeader, xe as AppLanguage, Te as AppLayout, je as AppLogo, Me as AppMenu, Le as AppMultiTabs, Re as AppNotification, De as AppSidebar, Be as AppTenant, u as SpinDirectiveProvider, l as TooltipDirectiveProvider, Ve as UIProvider, c as vSpin, s as vTooltip };