@zl-ui-kit/components 0.27.0 → 0.27.1
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/README.md +11 -32
- package/dist/components/ZlAction/List.vue.mjs +49 -46
- package/dist/components/ZlAction/index.vue.d.ts +7 -1
- package/dist/components/ZlAction/index.vue.mjs +12 -8
- package/dist/components/ZlAction/types.d.ts +5 -2
- package/dist/components/ZlAppLayout/HeaderAside.css +1 -0
- package/dist/components/ZlAppLayout/HeaderAside.vue.d.ts +25 -0
- package/dist/components/ZlAppLayout/HeaderAside.vue.mjs +6 -0
- package/dist/components/ZlAppLayout/HeaderAside2.vue.mjs +65 -0
- package/dist/components/ZlAppLayout/Horizontal.css +1 -1
- package/dist/components/ZlAppLayout/Vertical.css +1 -1
- package/dist/components/ZlAppLayout/Vertical2.vue.mjs +39 -41
- package/dist/components/ZlAppLayout/index.vue.d.ts +50 -6
- package/dist/components/ZlAppLayout/index.vue.mjs +26 -8
- package/dist/components/ZlAppSlogan/index.css +1 -1
- package/dist/components/ZlAppSlogan/index.vue.d.ts +1 -1
- package/dist/components/ZlAppSlogan/index.vue.mjs +19 -12
- package/dist/components/ZlBreadcrumb/index.css +1 -0
- package/dist/components/ZlBreadcrumb/index.vue.d.ts +32 -0
- package/dist/components/ZlBreadcrumb/index.vue.mjs +58 -0
- package/dist/components/ZlBreadcrumb/index3.vue.mjs +6 -0
- package/dist/components/ZlBreadcrumb/types.d.ts +16 -0
- package/dist/components/ZlButton/index.vue.d.ts +81 -0
- package/dist/components/ZlButton/index.vue.mjs +60 -0
- package/dist/components/ZlButton/index2.vue.mjs +5 -0
- package/dist/components/ZlCardPage/index.vue.d.ts +41 -3
- package/dist/components/ZlCardPage/index.vue.mjs +68 -68
- package/dist/components/ZlCardPage/resolvePagination.d.ts +20 -0
- package/dist/components/ZlCardPage/resolvePagination.mjs +24 -0
- package/dist/components/ZlCheckboxTag/index.css +1 -1
- package/dist/components/ZlCheckboxTag/index.vue.d.ts +4 -4
- package/dist/components/ZlCheckboxTag/index.vue.mjs +34 -30
- package/dist/components/ZlCopy/copy.mjs +17 -7
- package/dist/components/ZlCopy/index.css +1 -1
- package/dist/components/ZlCopy/index.vue.mjs +2 -2
- package/dist/components/ZlCopy/index2.vue.mjs +34 -36
- package/dist/components/ZlDescription/index.css +1 -1
- package/dist/components/ZlDescription/index.vue.mjs +28 -24
- package/dist/components/ZlDevMenu/index.css +1 -0
- package/dist/components/ZlDevMenu/index.vue.d.ts +33 -0
- package/dist/components/ZlDevMenu/index.vue.mjs +110 -0
- package/dist/components/ZlDevMenu/index3.vue.mjs +6 -0
- package/dist/components/ZlDevMenu/types.d.ts +8 -0
- package/dist/components/ZlDialog/index.css +1 -1
- package/dist/components/ZlDialog/index.vue.d.ts +3 -0
- package/dist/components/ZlDialog/index.vue.mjs +39 -35
- package/dist/components/ZlDictTag/index.vue.d.ts +12 -3
- package/dist/components/ZlDictTag/index.vue.mjs +31 -26
- package/dist/components/ZlDrawer/index.css +1 -1
- package/dist/components/ZlDrawer/index.vue.d.ts +3 -0
- package/dist/components/ZlDrawer/index.vue.mjs +36 -32
- package/dist/components/ZlDynamicComponent/index.vue.d.ts +5 -3
- package/dist/components/ZlForm/index.css +1 -1
- package/dist/components/ZlForm/index.vue.d.ts +7 -0
- package/dist/components/ZlForm/index.vue.mjs +50 -47
- package/dist/components/ZlLayoutSwitch/index.css +1 -1
- package/dist/components/ZlLayoutSwitch/index.vue.d.ts +10 -0
- package/dist/components/ZlLayoutSwitch/index.vue.mjs +1 -1
- package/dist/components/ZlLayoutSwitch/index2.vue.mjs +27 -19
- package/dist/components/ZlLoading/index.css +1 -0
- package/dist/components/ZlLoading/index.vue.d.ts +27 -0
- package/dist/components/ZlLoading/index.vue.mjs +8 -0
- package/dist/components/ZlLoading/index2.vue.mjs +30 -0
- package/dist/components/ZlLogin/components/LoginForm.css +1 -1
- package/dist/components/ZlLogin/components/LoginForm.vue.mjs +1 -1
- package/dist/components/ZlLogin/components/LoginForm2.vue.mjs +26 -25
- package/dist/components/ZlMenu/MenuIcon.d.ts +17 -0
- package/dist/components/ZlMenu/MenuIcon.mjs +21 -0
- package/dist/components/ZlMenu/ZlMenuItem.vue.d.ts +7 -0
- package/dist/components/ZlMenu/ZlMenuItem.vue.mjs +53 -0
- package/dist/components/ZlMenu/ZlMenuItem2.vue.mjs +5 -0
- package/dist/components/ZlMenu/index.css +1 -0
- package/dist/components/ZlMenu/index.vue.d.ts +40 -0
- package/dist/components/ZlMenu/index.vue.mjs +60 -0
- package/dist/components/ZlMenu/index3.vue.mjs +6 -0
- package/dist/components/ZlMenu/types.d.ts +20 -0
- package/dist/components/ZlPageContainer/index.css +1 -1
- package/dist/components/ZlPageContainer/index.vue.mjs +1 -1
- package/dist/components/ZlPagination/index.css +1 -1
- package/dist/components/ZlPagination/index.vue.d.ts +21 -1
- package/dist/components/ZlPagination/index.vue.mjs +1 -1
- package/dist/components/ZlPagination/index2.vue.mjs +59 -33
- package/dist/components/ZlPagination/usePagination.d.ts +1 -0
- package/dist/components/ZlPagination/usePagination.mjs +51 -34
- package/dist/components/ZlPopconfirm/index.vue.mjs +25 -24
- package/dist/components/ZlSearch/index.vue.d.ts +25 -0
- package/dist/components/ZlSearch/index.vue.mjs +202 -205
- package/dist/components/ZlSearchTable/index.vue.d.ts +40 -2
- package/dist/components/ZlSearchTable/index.vue.mjs +59 -55
- package/dist/components/ZlTable/useTablePagination.d.ts +1 -0
- package/dist/components/ZlTable/useTablePagination.mjs +37 -23
- package/dist/components/ZlTabs/index.vue.d.ts +16 -3
- package/dist/components/ZlTag/ZlCornerTag.css +1 -1
- package/dist/components/ZlTag/ZlCornerTag.vue.d.ts +14 -1
- package/dist/components/ZlTag/ZlCornerTag.vue.mjs +25 -14
- package/dist/components/ZlTag/index.vue.mjs +4 -4
- package/dist/components/ZlUpload/index.css +1 -1
- package/dist/components/ZlUpload/index.vue.d.ts +44 -3
- package/dist/components/ZlUpload/index.vue.mjs +3 -3
- package/dist/components/ZlUpload/index2.vue.mjs +119 -79
- package/dist/index.d.ts +8 -2
- package/dist/index.mjs +183 -169
- package/dist/locales/en.mjs +2 -2
- package/dist/locales/zh-cn.mjs +3 -3
- package/package.json +6 -6
- package/dist/components/ZlAppMenu/AppMenu.css +0 -1
- package/dist/components/ZlAppMenu/AppMenu.vue.d.ts +0 -27
- package/dist/components/ZlAppMenu/AppMenu.vue.mjs +0 -37
- package/dist/components/ZlAppMenu/AppMenu3.vue.mjs +0 -6
- package/dist/components/ZlAppMenu/AppMenuItem.vue.d.ts +0 -11
- package/dist/components/ZlAppMenu/AppMenuItem.vue.mjs +0 -58
- package/dist/components/ZlAppMenu/AppMenuItem2.vue.mjs +0 -5
|
@@ -1,80 +1,84 @@
|
|
|
1
|
-
import { defineComponent as h, useModel as
|
|
2
|
-
import { useZlT as
|
|
3
|
-
|
|
1
|
+
import { defineComponent as h, useModel as z, ref as w, computed as c, useAttrs as x, resolveComponent as A, resolveDirective as D, openBlock as d, createBlock as f, mergeProps as _, withCtx as n, withDirectives as $, createElementBlock as M, renderSlot as m, createTextVNode as g, toDisplayString as v, unref as N, createCommentVNode as T, createVNode as Z, mergeModels as O } from "vue";
|
|
2
|
+
import { useZlT as S } from "@zl-ui-kit/composables";
|
|
3
|
+
import y from "../ZlButton/index.vue.mjs";
|
|
4
|
+
const E = { class: "zl-dialog__body" }, j = /* @__PURE__ */ h({
|
|
4
5
|
name: "ZlDialog",
|
|
5
6
|
inheritAttrs: !1,
|
|
6
7
|
__name: "index",
|
|
7
|
-
props: /* @__PURE__ */
|
|
8
|
+
props: /* @__PURE__ */ O({
|
|
8
9
|
onCancel: {},
|
|
9
10
|
onOk: {},
|
|
10
11
|
autoCloseAfterConfirm: { type: Boolean, default: !0 },
|
|
11
12
|
readonly: { type: Boolean },
|
|
12
|
-
loading: { type: Boolean }
|
|
13
|
+
loading: { type: Boolean },
|
|
14
|
+
footerVisible: { type: Boolean, default: !0 }
|
|
13
15
|
}, {
|
|
14
16
|
visible: { type: Boolean, default: !1 },
|
|
15
17
|
visibleModifiers: {}
|
|
16
18
|
}),
|
|
17
19
|
emits: ["update:visible"],
|
|
18
|
-
setup(
|
|
19
|
-
const { t:
|
|
20
|
-
async function
|
|
21
|
-
|
|
20
|
+
setup(e) {
|
|
21
|
+
const { t: i } = S(), o = e, t = z(e, "visible");
|
|
22
|
+
async function r() {
|
|
23
|
+
o.onCancel && !await o.onCancel() || (t.value = !1);
|
|
22
24
|
}
|
|
23
25
|
const s = w(!1);
|
|
24
|
-
async function
|
|
26
|
+
async function p() {
|
|
25
27
|
s.value = !0;
|
|
26
28
|
try {
|
|
27
|
-
|
|
28
|
-
} catch (
|
|
29
|
-
console.error("[ZlDialog] handleConfirm: ",
|
|
29
|
+
await o.onOk?.(), o.autoCloseAfterConfirm && (t.value = !1);
|
|
30
|
+
} catch (l) {
|
|
31
|
+
console.error("[ZlDialog] handleConfirm: ", l);
|
|
30
32
|
} finally {
|
|
31
33
|
s.value = !1;
|
|
32
34
|
}
|
|
33
35
|
}
|
|
34
|
-
const
|
|
35
|
-
return (
|
|
36
|
-
const
|
|
37
|
-
return d(),
|
|
36
|
+
const C = c(() => o.readonly ? i("zl.dialog.close", "关闭") : i("zl.dialog.confirm", "确定")), k = x(), b = c(() => ({ width: "600px", "destroy-on-close": !0, ...k }));
|
|
37
|
+
return (l, a) => {
|
|
38
|
+
const B = A("el-dialog"), V = D("loading");
|
|
39
|
+
return d(), f(B, _({
|
|
40
|
+
class: ["zl-dialog", { "zl-dialog--no-footer": !e.footerVisible }]
|
|
41
|
+
}, b.value, {
|
|
38
42
|
modelValue: t.value,
|
|
39
|
-
"onUpdate:modelValue":
|
|
40
|
-
"before-close":
|
|
43
|
+
"onUpdate:modelValue": a[1] || (a[1] = (u) => t.value = u),
|
|
44
|
+
"before-close": r
|
|
41
45
|
}), {
|
|
42
|
-
footer:
|
|
43
|
-
|
|
44
|
-
|
|
46
|
+
footer: n(() => [
|
|
47
|
+
m(l.$slots, "footer", {}, () => [
|
|
48
|
+
e.readonly ? T("", !0) : (d(), f(y, {
|
|
45
49
|
key: 0,
|
|
46
|
-
onClick:
|
|
50
|
+
onClick: r
|
|
47
51
|
}, {
|
|
48
|
-
default:
|
|
49
|
-
|
|
52
|
+
default: n(() => [
|
|
53
|
+
g(v(N(i)("zl.dialog.cancel", "取消")), 1)
|
|
50
54
|
]),
|
|
51
55
|
_: 1
|
|
52
56
|
})),
|
|
53
|
-
|
|
57
|
+
Z(y, {
|
|
54
58
|
type: "primary",
|
|
55
59
|
loading: s.value,
|
|
56
|
-
onClick:
|
|
60
|
+
onClick: a[0] || (a[0] = (u) => e.readonly ? r() : p())
|
|
57
61
|
}, {
|
|
58
|
-
default:
|
|
59
|
-
|
|
62
|
+
default: n(() => [
|
|
63
|
+
g(v(C.value), 1)
|
|
60
64
|
]),
|
|
61
65
|
_: 1
|
|
62
66
|
}, 8, ["loading"])
|
|
63
67
|
])
|
|
64
68
|
]),
|
|
65
|
-
default:
|
|
66
|
-
|
|
67
|
-
|
|
69
|
+
default: n(() => [
|
|
70
|
+
$((d(), M("div", E, [
|
|
71
|
+
m(l.$slots, "default")
|
|
68
72
|
])), [
|
|
69
|
-
[
|
|
73
|
+
[V, e.loading]
|
|
70
74
|
])
|
|
71
75
|
]),
|
|
72
76
|
_: 3
|
|
73
|
-
}, 16, ["modelValue"]);
|
|
77
|
+
}, 16, ["class", "modelValue"]);
|
|
74
78
|
};
|
|
75
79
|
}
|
|
76
80
|
});
|
|
77
81
|
export {
|
|
78
|
-
|
|
82
|
+
j as default
|
|
79
83
|
};
|
|
80
84
|
//# sourceMappingURL=index.vue.mjs.map
|
|
@@ -6,15 +6,18 @@ type __VLS_Props = {
|
|
|
6
6
|
* 行级字典请用独立 key(如 `` `resourceType.${row.id}` ``)。
|
|
7
7
|
*/
|
|
8
8
|
dictKey: string;
|
|
9
|
-
/**
|
|
9
|
+
/**
|
|
10
|
+
* 外部直传字典数据:无需依赖全局数据源即可翻译。格式同 `DictItem[]`(`{ label, value, icon?, color?, type? }`)。
|
|
11
|
+
* `color` 可以是主题色名,也可以是 `#ff7d45` 这类原生 CSS 颜色值(角标上按纯色渲染,不自动渐变)
|
|
12
|
+
*/
|
|
10
13
|
dict?: DictItem[];
|
|
11
14
|
/** 是否渲染成角标并指定方位,true 时为右上角 */
|
|
12
15
|
corner?: boolean | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
|
|
13
16
|
/**
|
|
14
17
|
* 角标形态(`corner` 生效时才起作用):
|
|
15
18
|
* `badge` 贴边小标签(默认);`ribbon` 斜跨在角上的绶带(45° 文字,如卡片右上角的「委托任务」)。
|
|
16
|
-
* 绶带与角点留有间距、文案建议 ≤4
|
|
17
|
-
* `--zl-corner-tag-ribbon-size` / `--zl-corner-tag-ribbon-gap
|
|
19
|
+
* 绶带与角点留有间距、文案建议 ≤4 个字;梯形高度用 `ribbon-height` 透传(带内字号跟着高度等比缩放),
|
|
20
|
+
* 尺寸/留白仍走 CSS 变量 `--zl-corner-tag-ribbon-size` / `--zl-corner-tag-ribbon-gap`。
|
|
18
21
|
*/
|
|
19
22
|
variant?: 'badge' | 'ribbon';
|
|
20
23
|
/**
|
|
@@ -32,8 +35,14 @@ type __VLS_Props = {
|
|
|
32
35
|
* @deprecated 用 `iconVisible`:全库显隐统一用 visible 语义,且不要用反向命名
|
|
33
36
|
*/
|
|
34
37
|
hideIcon?: boolean;
|
|
38
|
+
/** 是否使用填充背景(配合字典项 `color`/`type` 显示浅色底色,如 `--zl-<色>-1`),透传给内部 ZlTag */
|
|
39
|
+
fill?: boolean;
|
|
40
|
+
/** 是否使用全圆角样式,透传给内部 ZlTag */
|
|
41
|
+
rounded?: boolean;
|
|
35
42
|
};
|
|
36
43
|
declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
44
|
+
fill: boolean;
|
|
45
|
+
rounded: boolean;
|
|
37
46
|
variant: "badge" | "ribbon";
|
|
38
47
|
corner: boolean | "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
|
39
48
|
iconVisible: boolean;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { defineComponent as g, watch as
|
|
2
|
-
import { useDict as
|
|
3
|
-
import
|
|
1
|
+
import { defineComponent as g, watch as B, computed as n, openBlock as c, createBlock as d, mergeProps as u, withCtx as s, createTextVNode as f, toDisplayString as v } from "vue";
|
|
2
|
+
import { useDict as h, useDictStore as b } from "@zl-ui-kit/composables";
|
|
3
|
+
import S from "../ZlTag/ZlCornerTag.vue.mjs";
|
|
4
4
|
import '../ZlTag/index.css';import '../ZlTag/ZlCornerTag.css';/* empty css */
|
|
5
|
-
import
|
|
5
|
+
import k from "../ZlTag/index.vue.mjs";
|
|
6
6
|
/* empty css */
|
|
7
|
-
const
|
|
7
|
+
const K = /* @__PURE__ */ g({
|
|
8
8
|
name: "ZlDictTag",
|
|
9
9
|
__name: "index",
|
|
10
10
|
props: {
|
|
@@ -15,56 +15,61 @@ const I = /* @__PURE__ */ g({
|
|
|
15
15
|
value: {},
|
|
16
16
|
simple: { type: Boolean },
|
|
17
17
|
iconVisible: { type: Boolean, default: void 0 },
|
|
18
|
-
hideIcon: { type: Boolean, default: void 0 }
|
|
18
|
+
hideIcon: { type: Boolean, default: void 0 },
|
|
19
|
+
fill: { type: Boolean, default: !1 },
|
|
20
|
+
rounded: { type: Boolean, default: !1 }
|
|
19
21
|
},
|
|
20
|
-
setup(
|
|
21
|
-
const t =
|
|
22
|
-
|
|
22
|
+
setup(a) {
|
|
23
|
+
const t = a, p = h(t.dictKey, { data: t.dict });
|
|
24
|
+
B(
|
|
23
25
|
() => t.dict,
|
|
24
26
|
(e) => {
|
|
25
27
|
if (e?.length) {
|
|
26
|
-
const { dictStore: o } =
|
|
28
|
+
const { dictStore: o } = b();
|
|
27
29
|
o.value = { ...o.value, [t.dictKey]: e };
|
|
28
30
|
}
|
|
29
31
|
},
|
|
30
32
|
{ deep: !1 }
|
|
31
33
|
);
|
|
32
|
-
const
|
|
34
|
+
const i = n(() => p.value.find((e) => e.value === t.value)), m = { info: "gray" };
|
|
33
35
|
function y(e) {
|
|
34
36
|
const o = e.color ?? e.type;
|
|
35
37
|
if (o)
|
|
36
38
|
return m[o] ?? o;
|
|
37
39
|
}
|
|
38
|
-
const
|
|
39
|
-
const e =
|
|
40
|
+
const l = n(() => {
|
|
41
|
+
const e = i.value;
|
|
40
42
|
return e ? {
|
|
41
43
|
color: t.simple ? void 0 : y(e),
|
|
42
44
|
icon: t.iconVisible ?? !t.hideIcon ? e.icon : void 0
|
|
43
45
|
} : {};
|
|
44
|
-
}),
|
|
45
|
-
return (e, o) =>
|
|
46
|
+
}), r = n(() => t.corner === !0 ? "top-right" : t.corner);
|
|
47
|
+
return (e, o) => r.value ? (c(), d(S, u({
|
|
46
48
|
key: 0,
|
|
47
49
|
class: "zl-dict-corner-tag"
|
|
48
|
-
}, { ...
|
|
49
|
-
position:
|
|
50
|
-
variant:
|
|
50
|
+
}, { ...l.value, ...e.$attrs }, {
|
|
51
|
+
position: r.value,
|
|
52
|
+
variant: a.variant
|
|
51
53
|
}), {
|
|
52
|
-
default:
|
|
53
|
-
v(
|
|
54
|
+
default: s(() => [
|
|
55
|
+
f(v(i.value?.label || a.value), 1)
|
|
54
56
|
]),
|
|
55
57
|
_: 1
|
|
56
|
-
}, 16, ["position", "variant"])) : (
|
|
58
|
+
}, 16, ["position", "variant"])) : (c(), d(k, u({
|
|
57
59
|
key: 1,
|
|
58
60
|
class: "zl-dict-tag"
|
|
59
|
-
}, { ...
|
|
60
|
-
|
|
61
|
-
|
|
61
|
+
}, { ...l.value, ...e.$attrs }, {
|
|
62
|
+
fill: a.fill,
|
|
63
|
+
rounded: a.rounded
|
|
64
|
+
}), {
|
|
65
|
+
default: s(() => [
|
|
66
|
+
f(v(i.value?.label || a.value), 1)
|
|
62
67
|
]),
|
|
63
68
|
_: 1
|
|
64
|
-
}, 16));
|
|
69
|
+
}, 16, ["fill", "rounded"]));
|
|
65
70
|
}
|
|
66
71
|
});
|
|
67
72
|
export {
|
|
68
|
-
|
|
73
|
+
K as default
|
|
69
74
|
};
|
|
70
75
|
//# sourceMappingURL=index.vue.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zl-drawer__body{width:100%;min-height:100%}
|
|
1
|
+
.zl-drawer__body{width:100%;min-height:100%}.zl-drawer--no-footer .el-drawer__footer{display:none}
|
|
@@ -9,6 +9,8 @@ type __VLS_Props = {
|
|
|
9
9
|
readonly?: boolean;
|
|
10
10
|
/** 内容区加载态,为 true 时显示遮罩 loading */
|
|
11
11
|
loading?: boolean;
|
|
12
|
+
/** 底部按钮区是否可见;为 false 时隐藏整个页脚(默认取消/确定按钮与 footer 插槽一并隐藏),默认 true */
|
|
13
|
+
footerVisible?: boolean;
|
|
12
14
|
};
|
|
13
15
|
type __VLS_PublicProps = {
|
|
14
16
|
'visible'?: boolean;
|
|
@@ -29,6 +31,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
|
|
|
29
31
|
"onUpdate:visible"?: ((value: boolean) => any) | undefined;
|
|
30
32
|
}>, {
|
|
31
33
|
autoCloseAfterConfirm: boolean;
|
|
34
|
+
footerVisible: boolean;
|
|
32
35
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
33
36
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
34
37
|
export default _default;
|
|
@@ -1,83 +1,87 @@
|
|
|
1
|
-
import { defineComponent as B, useModel as
|
|
2
|
-
import { useZlT as
|
|
3
|
-
|
|
1
|
+
import { defineComponent as B, useModel as V, ref as h, computed as u, useAttrs as A, resolveComponent as D, resolveDirective as x, openBlock as d, createBlock as f, mergeProps as _, withCtx as a, withDirectives as $, createElementBlock as M, renderSlot as m, createTextVNode as v, toDisplayString as y, unref as N, createCommentVNode as T, createVNode as Z, mergeModels as O } from "vue";
|
|
2
|
+
import { useZlT as S } from "@zl-ui-kit/composables";
|
|
3
|
+
import w from "../ZlButton/index.vue.mjs";
|
|
4
|
+
const E = { class: "zl-drawer__body" }, j = /* @__PURE__ */ B({
|
|
4
5
|
name: "ZlDrawer",
|
|
5
6
|
inheritAttrs: !1,
|
|
6
7
|
__name: "index",
|
|
7
|
-
props: /* @__PURE__ */
|
|
8
|
+
props: /* @__PURE__ */ O({
|
|
8
9
|
onCancel: {},
|
|
9
10
|
onOk: {},
|
|
10
11
|
autoCloseAfterConfirm: { type: Boolean, default: !0 },
|
|
11
12
|
readonly: { type: Boolean },
|
|
12
|
-
loading: { type: Boolean }
|
|
13
|
+
loading: { type: Boolean },
|
|
14
|
+
footerVisible: { type: Boolean, default: !0 }
|
|
13
15
|
}, {
|
|
14
16
|
visible: { type: Boolean, default: !1 },
|
|
15
17
|
visibleModifiers: {}
|
|
16
18
|
}),
|
|
17
19
|
emits: ["update:visible"],
|
|
18
|
-
setup(
|
|
19
|
-
const { t:
|
|
20
|
+
setup(o) {
|
|
21
|
+
const { t: n } = S(), l = o, r = V(o, "visible");
|
|
20
22
|
async function s() {
|
|
21
|
-
|
|
23
|
+
l.onCancel && !await l.onCancel() || (r.value = !1);
|
|
22
24
|
}
|
|
23
25
|
const i = h(!1);
|
|
24
|
-
async function
|
|
26
|
+
async function C() {
|
|
25
27
|
i.value = !0;
|
|
26
28
|
try {
|
|
27
|
-
|
|
29
|
+
await l.onOk?.(), l.autoCloseAfterConfirm && (r.value = !1);
|
|
28
30
|
} catch (e) {
|
|
29
31
|
console.error("[ZlDrawer] handleConfirm: ", e);
|
|
30
32
|
} finally {
|
|
31
33
|
i.value = !1;
|
|
32
34
|
}
|
|
33
35
|
}
|
|
34
|
-
const
|
|
35
|
-
const { width: e, ...t } =
|
|
36
|
-
return { size: 600, ...e !== void 0 ? { size: e } : {},
|
|
36
|
+
const p = u(() => l.readonly ? n("zl.drawer.close", "关闭") : n("zl.drawer.confirm", "确定")), g = A(), k = u(() => {
|
|
37
|
+
const { width: e, ...t } = g;
|
|
38
|
+
return { size: 600, ...e !== void 0 ? { size: e } : {}, "destroy-on-close": !0, ...t };
|
|
37
39
|
});
|
|
38
40
|
return (e, t) => {
|
|
39
|
-
const
|
|
40
|
-
return d(),
|
|
41
|
-
|
|
42
|
-
|
|
41
|
+
const b = D("el-drawer"), z = x("loading");
|
|
42
|
+
return d(), f(b, _({
|
|
43
|
+
class: ["zl-drawer", { "zl-drawer--no-footer": !o.footerVisible }]
|
|
44
|
+
}, k.value, {
|
|
45
|
+
modelValue: r.value,
|
|
46
|
+
"onUpdate:modelValue": t[1] || (t[1] = (c) => r.value = c),
|
|
43
47
|
"before-close": s
|
|
44
48
|
}), {
|
|
45
|
-
footer:
|
|
46
|
-
|
|
47
|
-
|
|
49
|
+
footer: a(() => [
|
|
50
|
+
m(e.$slots, "footer", {}, () => [
|
|
51
|
+
o.readonly ? T("", !0) : (d(), f(w, {
|
|
48
52
|
key: 0,
|
|
49
53
|
onClick: s
|
|
50
54
|
}, {
|
|
51
|
-
default:
|
|
52
|
-
|
|
55
|
+
default: a(() => [
|
|
56
|
+
v(y(N(n)("zl.drawer.cancel", "取消")), 1)
|
|
53
57
|
]),
|
|
54
58
|
_: 1
|
|
55
59
|
})),
|
|
56
|
-
|
|
60
|
+
Z(w, {
|
|
57
61
|
type: "primary",
|
|
58
62
|
loading: i.value,
|
|
59
|
-
onClick: t[0] || (t[0] = (c) =>
|
|
63
|
+
onClick: t[0] || (t[0] = (c) => o.readonly ? s() : C())
|
|
60
64
|
}, {
|
|
61
|
-
default:
|
|
62
|
-
|
|
65
|
+
default: a(() => [
|
|
66
|
+
v(y(p.value), 1)
|
|
63
67
|
]),
|
|
64
68
|
_: 1
|
|
65
69
|
}, 8, ["loading"])
|
|
66
70
|
])
|
|
67
71
|
]),
|
|
68
|
-
default:
|
|
69
|
-
|
|
70
|
-
|
|
72
|
+
default: a(() => [
|
|
73
|
+
$((d(), M("div", E, [
|
|
74
|
+
m(e.$slots, "default")
|
|
71
75
|
])), [
|
|
72
|
-
[z,
|
|
76
|
+
[z, o.loading]
|
|
73
77
|
])
|
|
74
78
|
]),
|
|
75
79
|
_: 3
|
|
76
|
-
}, 16, ["modelValue"]);
|
|
80
|
+
}, 16, ["class", "modelValue"]);
|
|
77
81
|
};
|
|
78
82
|
}
|
|
79
83
|
});
|
|
80
84
|
export {
|
|
81
|
-
|
|
85
|
+
j as default
|
|
82
86
|
};
|
|
83
87
|
//# sourceMappingURL=index.vue.mjs.map
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { PropType } from 'vue';
|
|
2
|
+
import { IComponent } from './types';
|
|
1
3
|
/**
|
|
2
4
|
* 动态组件渲染引擎(schema → VNode)
|
|
3
5
|
* schema 见 types.ts;组件名支持全局注册名或组件对象;默认 el-input
|
|
@@ -15,7 +17,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
15
17
|
};
|
|
16
18
|
/** 待渲染组件的 schema 描述,缺省渲染 el-input */
|
|
17
19
|
component: {
|
|
18
|
-
type:
|
|
20
|
+
type: PropType<IComponent>;
|
|
19
21
|
default: () => {
|
|
20
22
|
component: string;
|
|
21
23
|
};
|
|
@@ -40,7 +42,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
40
42
|
};
|
|
41
43
|
/** 待渲染组件的 schema 描述,缺省渲染 el-input */
|
|
42
44
|
component: {
|
|
43
|
-
type:
|
|
45
|
+
type: PropType<IComponent>;
|
|
44
46
|
default: () => {
|
|
45
47
|
component: string;
|
|
46
48
|
};
|
|
@@ -49,7 +51,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
49
51
|
onInput?: ((_value: any, ..._values: any[]) => any) | undefined;
|
|
50
52
|
"onUpdate:modelValue"?: ((_value: any) => any) | undefined;
|
|
51
53
|
}>, {
|
|
52
|
-
component:
|
|
54
|
+
component: IComponent;
|
|
53
55
|
model: Record<string, any>;
|
|
54
56
|
value: string | number | boolean | unknown[];
|
|
55
57
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
@charset "UTF-8";.zl-form-item-label{display:inline-flex;align-items:center;gap:2px}.zl-form-item-label__tooltip{color:var(--zl-text-3, var(--el-text-color-secondary))}.zl-form-item--no-label .el-form-item__label{display:none}
|
|
@@ -4,6 +4,11 @@ type __VLS_Props = {
|
|
|
4
4
|
items: FormItem[];
|
|
5
5
|
/** 表单值对象,不传时由组件内部自建 */
|
|
6
6
|
model?: Record<string, any>;
|
|
7
|
+
/**
|
|
8
|
+
* 表单项 `label` 为空字符串/缺省时不渲染 label 占位(控件直接顶到最左)。
|
|
9
|
+
* 默认 false:即使 label 为空,EP 也会因 #label 插槽存在而保留 label 列占位
|
|
10
|
+
*/
|
|
11
|
+
hideEmptyLabel?: boolean;
|
|
7
12
|
};
|
|
8
13
|
/** el-form 的校验回调:第一个参数为是否通过,失败时第二个参数为错误字段集合 */
|
|
9
14
|
type ValidateCallback = (isValid: boolean, invalidFields?: Record<string, any>) => void;
|
|
@@ -32,6 +37,7 @@ declare function __VLS_template(): {
|
|
|
32
37
|
slot?: boolean;
|
|
33
38
|
slots?: Record<string, any>;
|
|
34
39
|
props: Record<string, any>;
|
|
40
|
+
hideLabel?: boolean;
|
|
35
41
|
};
|
|
36
42
|
}) => any>> & {
|
|
37
43
|
label?(_: {
|
|
@@ -45,6 +51,7 @@ declare function __VLS_template(): {
|
|
|
45
51
|
slot?: boolean;
|
|
46
52
|
slots?: Record<string, any>;
|
|
47
53
|
props: Record<string, any>;
|
|
54
|
+
hideLabel?: boolean;
|
|
48
55
|
};
|
|
49
56
|
}): any;
|
|
50
57
|
default?(_: {}): any;
|
|
@@ -1,70 +1,72 @@
|
|
|
1
|
-
import { defineComponent as
|
|
1
|
+
import { defineComponent as Z, toRefs as A, ref as V, computed as h, resolveComponent as m, openBlock as n, createBlock as d, mergeProps as c, withCtx as i, createElementBlock as D, Fragment as M, renderList as S, renderSlot as p, createElementVNode as E, toDisplayString as U, createVNode as q, createCommentVNode as x } from "vue";
|
|
2
2
|
import W from "./ZlFormChild.vue.mjs";
|
|
3
3
|
import j from "../ZlIcon/index.vue.mjs";
|
|
4
|
-
const G = { class: "zl-form-item-label" },
|
|
4
|
+
const G = { class: "zl-form-item-label" }, y = "onUpdate:modelValue", Q = /* @__PURE__ */ Z({
|
|
5
5
|
name: "ZlForm",
|
|
6
6
|
__name: "index",
|
|
7
7
|
props: {
|
|
8
8
|
items: { default: () => [] },
|
|
9
|
-
model: {}
|
|
9
|
+
model: {},
|
|
10
|
+
hideEmptyLabel: { type: Boolean }
|
|
10
11
|
},
|
|
11
|
-
setup(
|
|
12
|
-
const
|
|
12
|
+
setup(F, { expose: g }) {
|
|
13
|
+
const s = F, { items: v } = A(s), I = V(s.model ?? {}), r = h(() => s.model ?? I.value), P = h(() => {
|
|
13
14
|
const e = [];
|
|
14
15
|
return v.value.forEach((l) => {
|
|
15
16
|
if (!l.model)
|
|
16
17
|
throw new Error("[ZlForm]: form item's model is required!");
|
|
17
18
|
l.defaultValue !== void 0 && r.value[l.model] === void 0 && (r.value[l.model] = l.defaultValue);
|
|
18
19
|
}), v.value.forEach((l) => {
|
|
19
|
-
if (!
|
|
20
|
+
if (!k(l)) return;
|
|
20
21
|
const {
|
|
21
|
-
visible:
|
|
22
|
+
visible: u,
|
|
22
23
|
props: a,
|
|
23
24
|
tooltip: f,
|
|
24
25
|
formItemProps: o = {},
|
|
25
|
-
component:
|
|
26
|
-
label:
|
|
27
|
-
model:
|
|
26
|
+
component: N,
|
|
27
|
+
label: _,
|
|
28
|
+
model: $,
|
|
28
29
|
defaultValue: H,
|
|
29
|
-
slot:
|
|
30
|
-
slots:
|
|
31
|
-
...
|
|
32
|
-
} = l,
|
|
33
|
-
delete
|
|
34
|
-
const
|
|
30
|
+
slot: B,
|
|
31
|
+
slots: C,
|
|
32
|
+
...T
|
|
33
|
+
} = l, b = { ...o };
|
|
34
|
+
delete b.tooltip;
|
|
35
|
+
const R = { ...T, ...a ?? {} };
|
|
35
36
|
e.push({
|
|
36
|
-
formItemProps:
|
|
37
|
+
formItemProps: b,
|
|
37
38
|
tooltip: f,
|
|
38
|
-
component:
|
|
39
|
-
label:
|
|
40
|
-
model:
|
|
41
|
-
slot:
|
|
42
|
-
slots:
|
|
43
|
-
|
|
39
|
+
component: N,
|
|
40
|
+
label: _,
|
|
41
|
+
model: $,
|
|
42
|
+
slot: B,
|
|
43
|
+
slots: C,
|
|
44
|
+
hideLabel: s.hideEmptyLabel && !_,
|
|
45
|
+
props: w(R, l.model)
|
|
44
46
|
});
|
|
45
47
|
}), e;
|
|
46
|
-
}), t =
|
|
47
|
-
function
|
|
48
|
+
}), t = V(null);
|
|
49
|
+
function k(e) {
|
|
48
50
|
const l = e.visible;
|
|
49
51
|
return l === void 0 ? !0 : l === !1 || typeof l == "function" && !l(r.value, e) ? !1 : !!l;
|
|
50
52
|
}
|
|
51
|
-
function
|
|
52
|
-
const
|
|
53
|
-
return e[
|
|
54
|
-
r.value[l] = a,
|
|
53
|
+
function w(e = {}, l) {
|
|
54
|
+
const u = e[y];
|
|
55
|
+
return e[y] = (a) => {
|
|
56
|
+
r.value[l] = a, u?.(a);
|
|
55
57
|
}, e;
|
|
56
58
|
}
|
|
57
|
-
async function
|
|
59
|
+
async function L(e) {
|
|
58
60
|
return await t.value?.validate(e) ?? !0;
|
|
59
61
|
}
|
|
60
|
-
async function
|
|
62
|
+
async function z(e, l) {
|
|
61
63
|
return await t.value?.validateField(e, l) ?? !0;
|
|
62
64
|
}
|
|
63
|
-
return
|
|
65
|
+
return g({
|
|
64
66
|
/** 校验整个表单;同 `el-form.validate()`(无回调时失败会 reject 错误字段集合;0.9.0 及更早成功时返回 `undefined`) */
|
|
65
|
-
validate:
|
|
67
|
+
validate: L,
|
|
66
68
|
/** 校验指定字段(字段名或数组),语义同 `validate()` */
|
|
67
|
-
validateField:
|
|
69
|
+
validateField: z,
|
|
68
70
|
/** 重置字段并清除校验结果;不传参重置全部 */
|
|
69
71
|
resetFields: (e) => t.value?.resetFields(e),
|
|
70
72
|
/** 清除校验提示;不传参清除全部 */
|
|
@@ -84,30 +86,31 @@ const G = { class: "zl-form-item-label" }, E = "onUpdate:modelValue", Q = /* @__
|
|
|
84
86
|
return t.value;
|
|
85
87
|
}
|
|
86
88
|
}), (e, l) => {
|
|
87
|
-
const
|
|
88
|
-
return n(),
|
|
89
|
+
const u = m("el-tooltip"), a = m("el-form-item"), f = m("el-form");
|
|
90
|
+
return n(), d(f, c({
|
|
89
91
|
ref_key: "formRef",
|
|
90
92
|
ref: t,
|
|
91
93
|
class: "zl-form",
|
|
92
94
|
model: r.value
|
|
93
95
|
}, { labelWidth: "auto", ...e.$attrs }), {
|
|
94
|
-
default:
|
|
95
|
-
(n(!0),
|
|
96
|
+
default: i(() => [
|
|
97
|
+
(n(!0), D(M, null, S(P.value, (o) => (n(), d(a, c({
|
|
96
98
|
key: o.model,
|
|
97
99
|
label: o.label,
|
|
98
|
-
prop: o.model
|
|
100
|
+
prop: o.model,
|
|
101
|
+
class: { "zl-form-item--no-label": o.hideLabel }
|
|
99
102
|
}, { ref_for: !0 }, o.formItemProps), {
|
|
100
|
-
label:
|
|
101
|
-
|
|
103
|
+
label: i(() => [
|
|
104
|
+
E("span", G, [
|
|
102
105
|
p(e.$slots, "label", c({ ref_for: !0 }, { label: o.label, item: o }), () => [
|
|
103
|
-
|
|
106
|
+
E("span", null, U(o.label), 1)
|
|
104
107
|
]),
|
|
105
|
-
o.tooltip ? (n(), u
|
|
108
|
+
o.tooltip ? (n(), d(u, {
|
|
106
109
|
key: 0,
|
|
107
110
|
content: o.tooltip,
|
|
108
111
|
placement: "top"
|
|
109
112
|
}, {
|
|
110
|
-
default:
|
|
113
|
+
default: i(() => [
|
|
111
114
|
q(j, {
|
|
112
115
|
class: "zl-form-item-label__tooltip",
|
|
113
116
|
icon: "zl:help-color"
|
|
@@ -117,18 +120,18 @@ const G = { class: "zl-form-item-label" }, E = "onUpdate:modelValue", Q = /* @__
|
|
|
117
120
|
}, 8, ["content"])) : x("", !0)
|
|
118
121
|
])
|
|
119
122
|
]),
|
|
120
|
-
default:
|
|
123
|
+
default: i(() => [
|
|
121
124
|
o.slot ? p(e.$slots, o.model, {
|
|
122
125
|
model: r.value,
|
|
123
126
|
field: o
|
|
124
|
-
}, void 0, void 0, 0) : (n(),
|
|
127
|
+
}, void 0, void 0, 0) : (n(), d(W, {
|
|
125
128
|
key: 1,
|
|
126
129
|
item: o,
|
|
127
130
|
"model-value": r.value[o.model]
|
|
128
131
|
}, null, 8, ["item", "model-value"]))
|
|
129
132
|
]),
|
|
130
133
|
_: 2
|
|
131
|
-
}, 1040, ["label", "prop"]))), 128)),
|
|
134
|
+
}, 1040, ["label", "prop", "class"]))), 128)),
|
|
132
135
|
p(e.$slots, "default")
|
|
133
136
|
]),
|
|
134
137
|
_: 3
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zl-layout-switch .el-radio-
|
|
1
|
+
.zl-layout-switch[data-v-e4af4af4] .el-radio-button__inner{display:inline-flex;align-items:center;gap:4px;line-height:1;padding:8px 12px;font-size:14px}.zl-layout-switch__text[data-v-e4af4af4]{font-size:12px;line-height:1}
|