@keyblade/pro-components 1.7.4 → 1.7.6
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/es/pro-layout/hooks.d.ts +1 -0
- package/es/pro-layout/hooks.js +46 -46
- package/es/pro-layout/index.d.ts +18 -0
- package/es/pro-layout/pro-layout.vue.d.ts +15 -0
- package/es/pro-layout/pro-layout.vue.js +70 -62
- package/es/pro-page-header/index.js +3 -3
- package/es/style.css +1 -1
- package/package.json +1 -1
package/es/pro-layout/hooks.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { type Ref } from 'vue';
|
|
|
2
2
|
import type { IProMenuItem } from '../pro-menu';
|
|
3
3
|
export declare function useHooks(menuItems: Ref<IProMenuItem[]>, options: {
|
|
4
4
|
hideTabs: boolean;
|
|
5
|
+
disableKeepAlive: boolean;
|
|
5
6
|
}): {
|
|
6
7
|
menuSelectedKeys: Ref<string[]>;
|
|
7
8
|
activeMenuItem: Ref<IProMenuItem | undefined>;
|
package/es/pro-layout/hooks.js
CHANGED
|
@@ -1,106 +1,106 @@
|
|
|
1
|
-
import { ref as i, watch as
|
|
1
|
+
import { ref as i, watch as T } from "vue";
|
|
2
2
|
import { useRoute as S, useRouter as x } from "vue-router";
|
|
3
|
-
function
|
|
4
|
-
const r = S(),
|
|
5
|
-
|
|
6
|
-
}, u = i(),
|
|
3
|
+
function J(h, o) {
|
|
4
|
+
const r = S(), b = x(), m = i([]), P = (t) => {
|
|
5
|
+
m.value = [t];
|
|
6
|
+
}, u = i(), v = i([]), d = i({}), p = i([]), c = i([]), f = i([]), N = () => {
|
|
7
7
|
const t = [], l = (a) => {
|
|
8
8
|
var n;
|
|
9
9
|
for (const e in a) {
|
|
10
|
-
const
|
|
11
|
-
if (
|
|
12
|
-
return delete
|
|
10
|
+
const s = a[e];
|
|
11
|
+
if (s.name === ((n = u == null ? void 0 : u.value) == null ? void 0 : n.name) || s.children && s.children.length > 0 && l(s.children))
|
|
12
|
+
return delete s.children, t.unshift(s), !0;
|
|
13
13
|
}
|
|
14
14
|
return !1;
|
|
15
15
|
};
|
|
16
|
-
l(JSON.parse(JSON.stringify(
|
|
16
|
+
l(JSON.parse(JSON.stringify(h.value))), v.value = t;
|
|
17
17
|
}, k = () => {
|
|
18
18
|
var l, a, n;
|
|
19
|
-
const t = (l =
|
|
19
|
+
const t = (l = v.value) == null ? void 0 : l.map((e) => ({ path: e == null ? void 0 : e.path, label: e == null ? void 0 : e.title }));
|
|
20
20
|
p.value = (a = u.value) != null && a.breadcrumbs ? (n = u.value) == null ? void 0 : n.breadcrumbs : t.length !== 0 ? t : [];
|
|
21
21
|
};
|
|
22
22
|
function y() {
|
|
23
23
|
if (!u.value || u.value.noAffix) {
|
|
24
|
-
|
|
24
|
+
c.value.forEach((e) => {
|
|
25
25
|
e.active = !1;
|
|
26
26
|
});
|
|
27
27
|
return;
|
|
28
28
|
}
|
|
29
29
|
const { name: t, title: l } = u.value;
|
|
30
30
|
let a = -1;
|
|
31
|
-
|
|
32
|
-
e.active = !1, e.name === t && (a =
|
|
31
|
+
c.value.forEach((e, s) => {
|
|
32
|
+
e.active = !1, e.name === t && (a = s);
|
|
33
33
|
});
|
|
34
34
|
const n = {
|
|
35
35
|
name: t,
|
|
36
|
-
parentNames:
|
|
36
|
+
parentNames: v.value.map((e) => e.name),
|
|
37
37
|
title: l ?? t,
|
|
38
38
|
fullPath: r.fullPath,
|
|
39
39
|
active: !0
|
|
40
40
|
};
|
|
41
41
|
if (~a) {
|
|
42
|
-
const e =
|
|
43
|
-
e.fullPath === r.fullPath ? (e.active = !0, e.fullPath = r.fullPath) : (
|
|
44
|
-
|
|
42
|
+
const e = c.value[a];
|
|
43
|
+
e.fullPath === r.fullPath ? (e.active = !0, e.fullPath = r.fullPath) : (c.value.splice(a, 1), setTimeout(() => {
|
|
44
|
+
c.value.push(n);
|
|
45
45
|
}));
|
|
46
46
|
} else
|
|
47
|
-
|
|
47
|
+
c.value.push(n);
|
|
48
48
|
}
|
|
49
|
-
const
|
|
50
|
-
const l =
|
|
51
|
-
|
|
52
|
-
},
|
|
49
|
+
const A = (t) => {
|
|
50
|
+
const l = c.value.findIndex((n) => n.name === t), a = c.value[l];
|
|
51
|
+
b.push(a.fullPath);
|
|
52
|
+
}, E = (t) => {
|
|
53
53
|
let l = -1, a = -1;
|
|
54
|
-
if (
|
|
55
|
-
e.name === t && (a =
|
|
54
|
+
if (c.value.forEach((e, s) => {
|
|
55
|
+
e.name === t && (a = s), e.active && (l = s);
|
|
56
56
|
}), l === a) {
|
|
57
57
|
let e;
|
|
58
|
-
a === 0 ? e =
|
|
58
|
+
a === 0 ? e = c.value[a + 1] : e = c.value[a - 1], e.active = !0, b.push(e.fullPath);
|
|
59
59
|
}
|
|
60
|
-
const n =
|
|
60
|
+
const n = c.value.splice(a, 1);
|
|
61
61
|
I(n[0]);
|
|
62
|
-
},
|
|
62
|
+
}, g = () => {
|
|
63
63
|
var l;
|
|
64
|
-
if ((l = r == null ? void 0 : r.meta) != null && l.ignoreCache)
|
|
64
|
+
if (o != null && o.disableKeepAlive || (l = r == null ? void 0 : r.meta) != null && l.ignoreCache)
|
|
65
65
|
return;
|
|
66
|
-
const t = new Set(
|
|
67
|
-
|
|
66
|
+
const t = new Set(f.value);
|
|
67
|
+
v.value.forEach((a) => {
|
|
68
68
|
a.name && t.add(a.name);
|
|
69
|
-
}),
|
|
69
|
+
}), f.value = Array.from(t.values());
|
|
70
70
|
}, I = (t) => {
|
|
71
|
-
const l = new Set(
|
|
71
|
+
const l = new Set(f.value);
|
|
72
72
|
t.parentNames.forEach((a) => {
|
|
73
73
|
l.delete(a);
|
|
74
|
-
}),
|
|
74
|
+
}), c.value.forEach((a) => {
|
|
75
75
|
a.parentNames.forEach((n) => {
|
|
76
|
-
const e =
|
|
76
|
+
const e = d.value[n];
|
|
77
77
|
e != null && e.ignoreCache || l.add(e.name);
|
|
78
78
|
});
|
|
79
|
-
}),
|
|
79
|
+
}), f.value = Array.from(l.values());
|
|
80
80
|
};
|
|
81
|
-
return
|
|
81
|
+
return T(h, () => {
|
|
82
82
|
const t = {}, l = (a) => {
|
|
83
83
|
a.forEach((n) => {
|
|
84
84
|
n.children && n.children.length > 0 && l(n.children), delete n.children, t[n.name] = n;
|
|
85
85
|
});
|
|
86
86
|
};
|
|
87
|
-
l(JSON.parse(JSON.stringify(
|
|
88
|
-
}, { immediate: !0 }),
|
|
87
|
+
l(JSON.parse(JSON.stringify(h.value))), d.value = t;
|
|
88
|
+
}, { immediate: !0 }), T(() => r == null ? void 0 : r.name, () => {
|
|
89
89
|
var l;
|
|
90
90
|
const t = r == null ? void 0 : r.name;
|
|
91
|
-
u.value =
|
|
91
|
+
u.value = d.value[t], m.value = u != null && u.value ? [u.value.name, ...((l = u.value) == null ? void 0 : l.activatedKeys) || []] : [], N(), k(), o.hideTabs || y(), g();
|
|
92
92
|
}, { immediate: !0 }), {
|
|
93
|
-
menuSelectedKeys:
|
|
93
|
+
menuSelectedKeys: m,
|
|
94
94
|
activeMenuItem: u,
|
|
95
|
-
menuItemMap:
|
|
95
|
+
menuItemMap: d,
|
|
96
96
|
breadcrumbItems: p,
|
|
97
|
-
tabs:
|
|
98
|
-
keepAliveInclude:
|
|
97
|
+
tabs: c,
|
|
98
|
+
keepAliveInclude: f,
|
|
99
99
|
onMenuItemClick: P,
|
|
100
|
-
onTabClick:
|
|
101
|
-
onTabDelete:
|
|
100
|
+
onTabClick: A,
|
|
101
|
+
onTabDelete: E
|
|
102
102
|
};
|
|
103
103
|
}
|
|
104
104
|
export {
|
|
105
|
-
|
|
105
|
+
J as useHooks
|
|
106
106
|
};
|
package/es/pro-layout/index.d.ts
CHANGED
|
@@ -18,6 +18,7 @@ declare const ProLayout: {
|
|
|
18
18
|
footerTitle?: string | undefined;
|
|
19
19
|
hideFooter?: boolean | undefined;
|
|
20
20
|
hideTabs?: boolean | undefined;
|
|
21
|
+
disableKeepAlive?: boolean | undefined;
|
|
21
22
|
key?: string | number | symbol | undefined;
|
|
22
23
|
ref?: import("vue").VNodeRef | undefined;
|
|
23
24
|
ref_for?: boolean | undefined;
|
|
@@ -149,6 +150,11 @@ declare const ProLayout: {
|
|
|
149
150
|
required: false;
|
|
150
151
|
default: boolean;
|
|
151
152
|
};
|
|
153
|
+
disableKeepAlive: {
|
|
154
|
+
type: import("vue").PropType<boolean>;
|
|
155
|
+
required: false;
|
|
156
|
+
default: boolean;
|
|
157
|
+
};
|
|
152
158
|
}>> & {
|
|
153
159
|
onCollapse?: ((collapsed: boolean) => any) | undefined;
|
|
154
160
|
onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
|
|
@@ -170,6 +176,7 @@ declare const ProLayout: {
|
|
|
170
176
|
footerTitle: string;
|
|
171
177
|
hideFooter: boolean;
|
|
172
178
|
hideTabs: boolean;
|
|
179
|
+
disableKeepAlive: boolean;
|
|
173
180
|
}, {}, string, {}> & {
|
|
174
181
|
beforeCreate?: ((() => void) | (() => void)[]) | undefined;
|
|
175
182
|
created?: ((() => void) | (() => void)[]) | undefined;
|
|
@@ -261,6 +268,11 @@ declare const ProLayout: {
|
|
|
261
268
|
required: false;
|
|
262
269
|
default: boolean;
|
|
263
270
|
};
|
|
271
|
+
disableKeepAlive: {
|
|
272
|
+
type: import("vue").PropType<boolean>;
|
|
273
|
+
required: false;
|
|
274
|
+
default: boolean;
|
|
275
|
+
};
|
|
264
276
|
}>> & {
|
|
265
277
|
onCollapse?: ((collapsed: boolean) => any) | undefined;
|
|
266
278
|
onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
|
|
@@ -339,6 +351,11 @@ declare const ProLayout: {
|
|
|
339
351
|
required: false;
|
|
340
352
|
default: boolean;
|
|
341
353
|
};
|
|
354
|
+
disableKeepAlive: {
|
|
355
|
+
type: import("vue").PropType<boolean>;
|
|
356
|
+
required: false;
|
|
357
|
+
default: boolean;
|
|
358
|
+
};
|
|
342
359
|
}>> & {
|
|
343
360
|
onCollapse?: ((collapsed: boolean) => any) | undefined;
|
|
344
361
|
onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
|
|
@@ -360,6 +377,7 @@ declare const ProLayout: {
|
|
|
360
377
|
footerTitle: string;
|
|
361
378
|
hideFooter: boolean;
|
|
362
379
|
hideTabs: boolean;
|
|
380
|
+
disableKeepAlive: boolean;
|
|
363
381
|
}, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
|
|
364
382
|
$slots: {
|
|
365
383
|
"header-left"?(_: {}): any;
|
|
@@ -83,11 +83,18 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
83
83
|
required: false;
|
|
84
84
|
default: string;
|
|
85
85
|
};
|
|
86
|
+
/** tabs头部间距 */
|
|
86
87
|
tabsHeaderPadding: {
|
|
87
88
|
type: PropType<boolean>;
|
|
88
89
|
required: false;
|
|
89
90
|
default: boolean;
|
|
90
91
|
};
|
|
92
|
+
/** 禁用全局路由缓存 */
|
|
93
|
+
disableKeepAlive: {
|
|
94
|
+
type: PropType<boolean>;
|
|
95
|
+
required: false;
|
|
96
|
+
default: boolean;
|
|
97
|
+
};
|
|
91
98
|
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
92
99
|
/** 收缩事件 */
|
|
93
100
|
collapse: (collapsed: boolean) => true;
|
|
@@ -176,11 +183,18 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
176
183
|
required: false;
|
|
177
184
|
default: string;
|
|
178
185
|
};
|
|
186
|
+
/** tabs头部间距 */
|
|
179
187
|
tabsHeaderPadding: {
|
|
180
188
|
type: PropType<boolean>;
|
|
181
189
|
required: false;
|
|
182
190
|
default: boolean;
|
|
183
191
|
};
|
|
192
|
+
/** 禁用全局路由缓存 */
|
|
193
|
+
disableKeepAlive: {
|
|
194
|
+
type: PropType<boolean>;
|
|
195
|
+
required: false;
|
|
196
|
+
default: boolean;
|
|
197
|
+
};
|
|
184
198
|
}>> & {
|
|
185
199
|
onCollapse?: ((collapsed: boolean) => any) | undefined;
|
|
186
200
|
onKeepAliveIncludeChange?: ((keepAliveInclude: string[]) => any) | undefined;
|
|
@@ -199,6 +213,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
|
|
|
199
213
|
footerTitle: string;
|
|
200
214
|
hideFooter: boolean;
|
|
201
215
|
hideTabs: boolean;
|
|
216
|
+
disableKeepAlive: boolean;
|
|
202
217
|
}, {}>, {
|
|
203
218
|
"header-left"?(_: {}): any;
|
|
204
219
|
"header-center"?(_: {}): any;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent as U, useCssVars as X, toRefs as Y, useSlots as Z, provide as I, ref as ee, watch as
|
|
1
|
+
import { defineComponent as U, useCssVars as X, toRefs as Y, useSlots as Z, provide as I, ref as ee, watch as A, resolveComponent as a, openBlock as o, createBlock as u, normalizeClass as l, withCtx as s, createVNode as r, createElementVNode as p, unref as n, renderSlot as y, createElementBlock as m, Fragment as k, createTextVNode as _, toDisplayString as v, createCommentVNode as f } from "vue";
|
|
2
2
|
import { useHooks as te } from "./hooks.js";
|
|
3
|
-
const
|
|
3
|
+
const le = ["src"], ae = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @__PURE__ */ U({
|
|
4
4
|
__name: "pro-layout",
|
|
5
5
|
props: {
|
|
6
6
|
/**
|
|
@@ -85,10 +85,17 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
85
85
|
required: !1,
|
|
86
86
|
default: "rounded"
|
|
87
87
|
},
|
|
88
|
+
/** tabs头部间距 */
|
|
88
89
|
tabsHeaderPadding: {
|
|
89
90
|
type: Boolean,
|
|
90
91
|
required: !1,
|
|
91
92
|
default: !0
|
|
93
|
+
},
|
|
94
|
+
/** 禁用全局路由缓存 */
|
|
95
|
+
disableKeepAlive: {
|
|
96
|
+
type: Boolean,
|
|
97
|
+
required: !1,
|
|
98
|
+
default: !1
|
|
92
99
|
}
|
|
93
100
|
},
|
|
94
101
|
emits: {
|
|
@@ -98,59 +105,60 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
98
105
|
keepAliveIncludeChange: (t) => !0
|
|
99
106
|
},
|
|
100
107
|
setup(t, { emit: $ }) {
|
|
101
|
-
const
|
|
108
|
+
const c = t;
|
|
102
109
|
X((i) => ({
|
|
103
|
-
|
|
104
|
-
"
|
|
105
|
-
"
|
|
110
|
+
c299e954: W,
|
|
111
|
+
"5c2d09d7": z,
|
|
112
|
+
"4313bece": V
|
|
106
113
|
}));
|
|
107
|
-
const { menuItems: C } = Y(
|
|
108
|
-
menuSelectedKeys:
|
|
109
|
-
breadcrumbItems:
|
|
114
|
+
const { menuItems: C } = Y(c), b = Z(), {
|
|
115
|
+
menuSelectedKeys: P,
|
|
116
|
+
breadcrumbItems: w,
|
|
110
117
|
tabs: T,
|
|
111
118
|
keepAliveInclude: h,
|
|
112
|
-
onMenuItemClick:
|
|
113
|
-
onTabClick:
|
|
114
|
-
onTabDelete:
|
|
119
|
+
onMenuItemClick: H,
|
|
120
|
+
onTabClick: K,
|
|
121
|
+
onTabDelete: N
|
|
115
122
|
} = te(C, {
|
|
116
|
-
hideTabs:
|
|
123
|
+
hideTabs: c.hideTabs,
|
|
124
|
+
disableKeepAlive: c.disableKeepAlive
|
|
117
125
|
});
|
|
118
|
-
I("ProBreadcrumbItems",
|
|
119
|
-
const
|
|
126
|
+
I("ProBreadcrumbItems", w), I("ProKeepAliveInclude", h);
|
|
127
|
+
const W = `${c.headerHeight}px`, z = `${c.siderWidth}px`, V = `${oe}px`, d = ee(c.siderCollapsed), q = (i) => {
|
|
120
128
|
d.value = i, $("collapse", i);
|
|
121
129
|
};
|
|
122
|
-
return
|
|
123
|
-
d.value =
|
|
124
|
-
}, { immediate: !0 }),
|
|
130
|
+
return A(() => c.siderCollapsed, () => {
|
|
131
|
+
d.value = c.siderCollapsed;
|
|
132
|
+
}, { immediate: !0 }), A(h, () => {
|
|
125
133
|
$("keepAliveIncludeChange", h.value);
|
|
126
134
|
}, { immediate: !0 }), (i, S) => {
|
|
127
|
-
const
|
|
128
|
-
return o(),
|
|
129
|
-
class:
|
|
135
|
+
const B = a("a-typography-title"), x = a("a-space"), D = a("a-layout-header"), F = a("kb-pro-menu"), M = a("icon-menu-unfold"), E = a("icon-menu-fold"), R = a("a-button"), j = a("a-layout-sider"), G = a("kb-pro-reuse-tabs"), J = a("a-affix"), L = a("kb-pro-keep-alive-router-view"), O = a("a-layout-content"), Q = a("a-layout-footer"), g = a("a-layout");
|
|
136
|
+
return o(), u(g, {
|
|
137
|
+
class: l([e, `${e}-${t.layout}`])
|
|
130
138
|
}, {
|
|
131
139
|
default: s(() => [
|
|
132
|
-
r(
|
|
133
|
-
class:
|
|
140
|
+
r(D, {
|
|
141
|
+
class: l([`${e}-header`, { [`${e}-header-collapsed`]: d.value }])
|
|
134
142
|
}, {
|
|
135
143
|
default: s(() => [
|
|
136
144
|
p("div", {
|
|
137
|
-
class:
|
|
145
|
+
class: l(`${e}-header-left`)
|
|
138
146
|
}, [
|
|
139
|
-
n(b)["header-left"] ?
|
|
140
|
-
t.layout !== "side" ? (o(),
|
|
147
|
+
n(b)["header-left"] ? y(i.$slots, "header-left", { key: 0 }) : (o(), m(k, { key: 1 }, [
|
|
148
|
+
t.layout !== "side" ? (o(), m("div", {
|
|
141
149
|
key: 0,
|
|
142
|
-
class:
|
|
150
|
+
class: l(`${e}-header-left-logo`)
|
|
143
151
|
}, [
|
|
144
|
-
r(
|
|
152
|
+
r(x, null, {
|
|
145
153
|
default: s(() => [
|
|
146
154
|
p("img", {
|
|
147
|
-
class:
|
|
155
|
+
class: l(`${e}-header-left-logo-img`),
|
|
148
156
|
alt: "logo",
|
|
149
157
|
src: t.logo
|
|
150
|
-
}, null, 10,
|
|
151
|
-
d.value ?
|
|
158
|
+
}, null, 10, le),
|
|
159
|
+
d.value ? f("", !0) : (o(), u(B, {
|
|
152
160
|
key: 0,
|
|
153
|
-
class:
|
|
161
|
+
class: l(`${e}-header-left-logo-title`),
|
|
154
162
|
heading: 5
|
|
155
163
|
}, {
|
|
156
164
|
default: s(() => [
|
|
@@ -161,18 +169,18 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
161
169
|
]),
|
|
162
170
|
_: 1
|
|
163
171
|
})
|
|
164
|
-
], 2)) :
|
|
172
|
+
], 2)) : f("", !0)
|
|
165
173
|
], 64))
|
|
166
174
|
], 2),
|
|
167
175
|
p("div", {
|
|
168
|
-
class:
|
|
176
|
+
class: l(`${e}-header-center`)
|
|
169
177
|
}, [
|
|
170
|
-
n(b)["header-center"] ?
|
|
178
|
+
n(b)["header-center"] ? y(i.$slots, "header-center", { key: 0 }) : f("", !0)
|
|
171
179
|
], 2),
|
|
172
180
|
p("div", {
|
|
173
|
-
class:
|
|
181
|
+
class: l(`${e}-header-right`)
|
|
174
182
|
}, [
|
|
175
|
-
|
|
183
|
+
y(i.$slots, "header-right")
|
|
176
184
|
], 2)
|
|
177
185
|
]),
|
|
178
186
|
_: 3
|
|
@@ -180,7 +188,7 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
180
188
|
r(g, null, {
|
|
181
189
|
default: s(() => [
|
|
182
190
|
r(j, {
|
|
183
|
-
class:
|
|
191
|
+
class: l([`${e}-sider`, { [`${e}-sider-collapsed`]: d.value }]),
|
|
184
192
|
width: t.siderWidth,
|
|
185
193
|
collapsible: !0,
|
|
186
194
|
breakpoint: t.siderBreakpoint,
|
|
@@ -190,23 +198,23 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
190
198
|
}, {
|
|
191
199
|
default: s(() => [
|
|
192
200
|
p("div", {
|
|
193
|
-
class:
|
|
201
|
+
class: l(`${e}-sider-content`)
|
|
194
202
|
}, [
|
|
195
|
-
n(b)["sider-top"] ?
|
|
196
|
-
t.layout === "side" ? (o(),
|
|
203
|
+
n(b)["sider-top"] ? y(i.$slots, "sider-top", { key: 0 }) : (o(), m(k, { key: 1 }, [
|
|
204
|
+
t.layout === "side" ? (o(), m("div", {
|
|
197
205
|
key: 0,
|
|
198
|
-
class:
|
|
206
|
+
class: l(`${e}-sider-content-logo`)
|
|
199
207
|
}, [
|
|
200
|
-
r(
|
|
208
|
+
r(x, null, {
|
|
201
209
|
default: s(() => [
|
|
202
210
|
p("img", {
|
|
203
|
-
class:
|
|
211
|
+
class: l(`${e}-sider-content-logo-img`),
|
|
204
212
|
alt: "logo",
|
|
205
213
|
src: t.logo
|
|
206
|
-
}, null, 10,
|
|
207
|
-
d.value ?
|
|
214
|
+
}, null, 10, ae),
|
|
215
|
+
d.value ? f("", !0) : (o(), u(B, {
|
|
208
216
|
key: 0,
|
|
209
|
-
class:
|
|
217
|
+
class: l(`${e}-sider-content-logo-title`),
|
|
210
218
|
heading: 5
|
|
211
219
|
}, {
|
|
212
220
|
default: s(() => [
|
|
@@ -217,22 +225,22 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
217
225
|
]),
|
|
218
226
|
_: 1
|
|
219
227
|
})
|
|
220
|
-
], 2)) :
|
|
228
|
+
], 2)) : f("", !0)
|
|
221
229
|
], 64)),
|
|
222
230
|
r(F, {
|
|
223
231
|
collapsed: d.value,
|
|
224
|
-
"selected-keys": n(
|
|
232
|
+
"selected-keys": n(P),
|
|
225
233
|
items: n(C),
|
|
226
|
-
onMenuItemClick: n(
|
|
234
|
+
onMenuItemClick: n(H)
|
|
227
235
|
}, null, 8, ["collapsed", "selected-keys", "items", "onMenuItemClick"])
|
|
228
236
|
], 2),
|
|
229
237
|
r(R, {
|
|
230
|
-
class:
|
|
238
|
+
class: l(`${e}-sider-collapse-btn`),
|
|
231
239
|
size: "mini",
|
|
232
240
|
onClick: S[0] || (S[0] = (se) => q(!d.value))
|
|
233
241
|
}, {
|
|
234
242
|
icon: s(() => [
|
|
235
|
-
d.value ? (o(),
|
|
243
|
+
d.value ? (o(), u(M, { key: 0 })) : (o(), u(E, { key: 1 }))
|
|
236
244
|
]),
|
|
237
245
|
_: 1
|
|
238
246
|
}, 8, ["class"])
|
|
@@ -240,24 +248,24 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
240
248
|
_: 3
|
|
241
249
|
}, 8, ["class", "width", "breakpoint", "collapsed"]),
|
|
242
250
|
r(g, {
|
|
243
|
-
class:
|
|
251
|
+
class: l([`${e}-body`, { [`${e}-body-collapsed`]: d.value }])
|
|
244
252
|
}, {
|
|
245
253
|
default: s(() => [
|
|
246
|
-
t.hideTabs ?
|
|
254
|
+
t.hideTabs ? f("", !0) : (o(), u(J, {
|
|
247
255
|
key: 0,
|
|
248
|
-
class:
|
|
256
|
+
class: l(`${e}-body-affix`),
|
|
249
257
|
offsetTop: t.headerHeight
|
|
250
258
|
}, {
|
|
251
259
|
default: s(() => [
|
|
252
|
-
n(T).length > 0 ? (o(),
|
|
260
|
+
n(T).length > 0 ? (o(), u(G, {
|
|
253
261
|
key: 0,
|
|
254
262
|
tabs: n(T),
|
|
255
263
|
"tabs-size": t.tabsSize,
|
|
256
264
|
"tabs-type": t.tabsType,
|
|
257
265
|
"tabs-header-padding": t.tabsHeaderPadding,
|
|
258
|
-
onTabClick: n(
|
|
259
|
-
onTabDelete: n(
|
|
260
|
-
}, null, 8, ["tabs", "tabs-size", "tabs-type", "tabs-header-padding", "onTabClick", "onTabDelete"])) :
|
|
266
|
+
onTabClick: n(K),
|
|
267
|
+
onTabDelete: n(N)
|
|
268
|
+
}, null, 8, ["tabs", "tabs-size", "tabs-type", "tabs-header-padding", "onTabClick", "onTabDelete"])) : f("", !0)
|
|
261
269
|
]),
|
|
262
270
|
_: 1
|
|
263
271
|
}, 8, ["class", "offsetTop"])),
|
|
@@ -267,10 +275,10 @@ const ae = ["src"], le = ["src"], e = "keyblade-pro-layout", oe = 48, re = /* @_
|
|
|
267
275
|
]),
|
|
268
276
|
_: 1
|
|
269
277
|
}),
|
|
270
|
-
t.hideFooter ?
|
|
271
|
-
n(b).footer !== void 0 ?
|
|
278
|
+
t.hideFooter ? f("", !0) : (o(), m(k, { key: 1 }, [
|
|
279
|
+
n(b).footer !== void 0 ? y(i.$slots, "footer", { key: 0 }) : (o(), u(Q, {
|
|
272
280
|
key: 1,
|
|
273
|
-
class:
|
|
281
|
+
class: l(`${e}-body-footer`)
|
|
274
282
|
}, {
|
|
275
283
|
default: s(() => [
|
|
276
284
|
_(v(t.footerTitle), 1)
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import o from "./pro-page-header.vue.js";
|
|
2
2
|
import "./pro-page-header.vue2.js";
|
|
3
|
-
import { Breadcrumb as r, Typography as s } from "@arco-design/web-vue";
|
|
4
|
-
import { IconApps as
|
|
3
|
+
import { Breadcrumb as r, Typography as s, Link as t } from "@arco-design/web-vue";
|
|
4
|
+
import { IconApps as m } from "@arco-design/web-vue/es/icon";
|
|
5
5
|
const a = Object.assign(o, {
|
|
6
6
|
install: (e) => {
|
|
7
|
-
e.use(r), e.use(s), e.use(t), e.component("KbProPageHeader", o);
|
|
7
|
+
e.use(r), e.use(s), e.use(t), e.use(m), e.component("KbProPageHeader", o);
|
|
8
8
|
}
|
|
9
9
|
}), P = a;
|
|
10
10
|
export {
|
package/es/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.keyblade-pro-menu .keyblade-pro-menu-item-img{width:14px;height:auto}.keyblade-pro-layout{width:100%;height:100%}.keyblade-pro-layout .keyblade-pro-layout-header{position:fixed;top:0;left:0;width:100%;height:var(--
|
|
1
|
+
.keyblade-pro-page-header{background:var(--color-bg-2);padding:16px 32px}.keyblade-pro-page-header .keyblade-pro-page-header-section-breadcrumb .arco-breadcrumb-item:first-child{padding-left:0}.keyblade-pro-page-header .keyblade-pro-page-header-title.arco-typography{padding-top:4px;margin-top:0}.keyblade-pro-page-container .keyblade-pro-page-container-content{padding:20px}.keyblade-pro-menu .keyblade-pro-menu-item-img{width:14px;height:auto}.keyblade-pro-layout{width:100%;height:100%}.keyblade-pro-layout .keyblade-pro-layout-header{position:fixed;top:0;left:0;width:100%;height:var(--c299e954);z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background-color:var(--color-bg-2);border-bottom:1px solid var(--color-border);transition:all .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout .keyblade-pro-layout-header-left{cursor:pointer;display:flex;align-items:center}.keyblade-pro-layout .keyblade-pro-layout-header-left-logo-img{width:28px;height:28px}.keyblade-pro-layout .keyblade-pro-layout-header-left-logo-title.arco-typography{margin:0;font-size:18px}.keyblade-pro-layout .keyblade-pro-layout-header-center{flex:1}.keyblade-pro-layout .keyblade-pro-layout-sider{padding-top:var(--c299e954);position:fixed;top:0;left:0;z-index:99;height:100%;transition:all .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout .keyblade-pro-layout-sider-content{position:relative;height:100%;overflow:auto}.keyblade-pro-layout .keyblade-pro-layout-sider-collapse-btn.arco-btn{position:absolute;right:12px;bottom:12px}.keyblade-pro-layout .keyblade-pro-layout-body{padding-top:var(--c299e954);padding-left:var(--5c2d09d7);min-height:100vh;overflow-y:hidden;background-color:var(--color-fill-2);transition:padding .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout .keyblade-pro-layout-body-affix .arco-affix{z-index:98}.keyblade-pro-layout .keyblade-pro-layout-body-footer{display:flex;align-items:center;justify-content:center;height:40px;color:var(--color-text-2);text-align:center}.keyblade-pro-layout .keyblade-pro-layout-body-collapsed{padding-left:var(--4313bece)}.keyblade-pro-layout-side .keyblade-pro-layout-header{z-index:98;left:var(--5c2d09d7);width:calc(100% - var(--5c2d09d7))}.keyblade-pro-layout-side .keyblade-pro-layout-header-collapsed{left:var(--4313bece);width:calc(100% - var(--4313bece))}.keyblade-pro-layout-side .keyblade-pro-layout-sider{padding-top:0}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-logo{position:relative;display:flex;align-items:center;padding:16px;cursor:pointer;transition:padding .3s cubic-bezier(.645,.045,.355,1)}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-logo-img{width:28px;height:28px}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-logo-title.arco-typography{margin:0;font-size:18px}.keyblade-pro-layout-side .keyblade-pro-layout-sider-collapsed .keyblade-pro-layout-sider-content-logo{padding:16px 10px}.keyblade-pro-reuse-tabs{position:relative;background-color:var(--color-bg-2);padding:4px 20px}
|