@zl-ui-kit/components 0.19.0 → 0.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -1892,7 +1892,20 @@ const items: MenuOption[] = [
|
|
|
1892
1892
|
| `collapseTransition` | `boolean` | false | 折叠动画 |
|
|
1893
1893
|
| `navigate` | `(item: MenuOption) => void` | — | 点击后的跳转回调（通常传 `router.push`） |
|
|
1894
1894
|
|
|
1895
|
-
`MenuOption` 字段：`key`（唯一标识）/ `label`（文案）/ `icon
|
|
1895
|
+
`MenuOption` 字段：`key`（唯一标识）/ `label`（文案）/ `icon?`（字符串 `zl:*` 图标名、组件或 VNode）/ `disabled?` / `children?`。
|
|
1896
|
+
|
|
1897
|
+
`icon` 支持三种形态，可在同一个菜单里混用：
|
|
1898
|
+
|
|
1899
|
+
```ts
|
|
1900
|
+
import { h } from 'vue'
|
|
1901
|
+
import MenuIcon from './MenuIcon.vue'
|
|
1902
|
+
|
|
1903
|
+
const items: MenuOption[] = [
|
|
1904
|
+
{ key: 'home', label: '首页', icon: 'zl:home' },
|
|
1905
|
+
{ key: 'custom', label: '自定义', icon: h(MenuIcon, { name: 'a-home' }) },
|
|
1906
|
+
]
|
|
1907
|
+
```
|
|
1908
|
+
|
|
1896
1909
|
主题变量：`--zl-menu-text-color` / `--zl-menu-hover-bg`（与 `ZlAppMenu` 同口径）。
|
|
1897
1910
|
|
|
1898
1911
|
### ZlPermission
|
|
@@ -5199,13 +5212,13 @@ import { ZlMenu } from '@zl-ui-kit/components'
|
|
|
5199
5212
|
|
|
5200
5213
|
**`items` 条目字段（`MenuOption`）**
|
|
5201
5214
|
|
|
5202
|
-
| 字段 | 类型
|
|
5203
|
-
| ---------- |
|
|
5204
|
-
| `key` | `string`
|
|
5205
|
-
| `label` | `string`
|
|
5206
|
-
| `icon` | `string`
|
|
5207
|
-
| `disabled` | `boolean`
|
|
5208
|
-
| `children` | `MenuOption[]`
|
|
5215
|
+
| 字段 | 类型 | 必填 | 说明 |
|
|
5216
|
+
| ---------- | ------------------------------ | ---- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
5217
|
+
| `key` | `string` | 是 | 唯一标识：选中态、select 事件、路由跳转都以它为准 |
|
|
5218
|
+
| `label` | `string` | 是 | 菜单文案 |
|
|
5219
|
+
| `icon` | `string \| Component \| VNode` | 否 | 图标： - 字符串：`@zl-ui-kit/icons` 中的 `zl:*` 图标名； - 组件：如 `h(MenuIcon, { name: 'a-home' })` 里的组件本身； - VNode：如 `h(MenuIcon, { name: 'a-home' })` 的结果。 |
|
|
5220
|
+
| `disabled` | `boolean` | 否 | 是否禁用 |
|
|
5221
|
+
| `children` | `MenuOption[]` | 否 | 子菜单 |
|
|
5209
5222
|
|
|
5210
5223
|
**事件（emits）**
|
|
5211
5224
|
|
|
@@ -7265,13 +7278,13 @@ ZlGrid 子项 schema
|
|
|
7265
7278
|
|
|
7266
7279
|
ZlMenu 菜单项配置
|
|
7267
7280
|
|
|
7268
|
-
| 字段 | 类型
|
|
7269
|
-
| ---------- |
|
|
7270
|
-
| `key` | `string`
|
|
7271
|
-
| `label` | `string`
|
|
7272
|
-
| `icon` | `string`
|
|
7273
|
-
| `disabled` | `boolean`
|
|
7274
|
-
| `children` | `MenuOption[]`
|
|
7281
|
+
| 字段 | 类型 | 必填 | 说明 |
|
|
7282
|
+
| ---------- | ------------------------------ | ---- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
7283
|
+
| `key` | `string` | 是 | 唯一标识：选中态、select 事件、路由跳转都以它为准 |
|
|
7284
|
+
| `label` | `string` | 是 | 菜单文案 |
|
|
7285
|
+
| `icon` | `string \| Component \| VNode` | 否 | 图标： - 字符串：`@zl-ui-kit/icons` 中的 `zl:*` 图标名； - 组件：如 `h(MenuIcon, { name: 'a-home' })` 里的组件本身； - VNode：如 `h(MenuIcon, { name: 'a-home' })` 的结果。 |
|
|
7286
|
+
| `disabled` | `boolean` | 否 | 是否禁用 |
|
|
7287
|
+
| `children` | `MenuOption[]` | 否 | 子菜单 |
|
|
7275
7288
|
|
|
7276
7289
|
#### `TableColumn`
|
|
7277
7290
|
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Component, PropType, VNode } from 'vue';
|
|
2
|
+
/** 内部渲染器：统一处理字符串图标 / 组件 / VNode 三种形态 */
|
|
3
|
+
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
|
4
|
+
icon: {
|
|
5
|
+
type: PropType<string | Component | VNode>;
|
|
6
|
+
required: true;
|
|
7
|
+
};
|
|
8
|
+
}>, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
9
|
+
[key: string]: any;
|
|
10
|
+
}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
11
|
+
icon: {
|
|
12
|
+
type: PropType<string | Component | VNode>;
|
|
13
|
+
required: true;
|
|
14
|
+
};
|
|
15
|
+
}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
16
|
+
export default _default;
|
|
17
|
+
//# sourceMappingURL=MenuIcon.d.ts.map
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { defineComponent as t, h as e, isVNode as o } from "vue";
|
|
2
|
+
import i from "../ZlIcon/index.vue.mjs";
|
|
3
|
+
const p = t({
|
|
4
|
+
name: "ZlMenuIcon",
|
|
5
|
+
props: {
|
|
6
|
+
icon: {
|
|
7
|
+
type: [String, Object, Function],
|
|
8
|
+
required: !0
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
setup(r) {
|
|
12
|
+
return () => {
|
|
13
|
+
const { icon: n } = r;
|
|
14
|
+
return typeof n == "string" ? e(i, { icon: n }) : o(n) ? n : e(n);
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
export {
|
|
19
|
+
p as default
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=MenuIcon.mjs.map
|
|
@@ -1,46 +1,46 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
3
|
-
const
|
|
1
|
+
import { defineComponent as b, resolveComponent as l, openBlock as t, createBlock as n, withCtx as i, createElementBlock as s, Fragment as y, renderList as f, unref as c, createCommentVNode as o, createElementVNode as x, toDisplayString as u, createTextVNode as I } from "vue";
|
|
2
|
+
import d from "./MenuIcon.mjs";
|
|
3
|
+
const g = /* @__PURE__ */ b({
|
|
4
4
|
name: "ZlMenuItem",
|
|
5
5
|
__name: "ZlMenuItem",
|
|
6
6
|
props: {
|
|
7
7
|
item: {}
|
|
8
8
|
},
|
|
9
9
|
setup(e) {
|
|
10
|
-
return (
|
|
11
|
-
const
|
|
12
|
-
return e.item.children?.length ? (t(), n(
|
|
10
|
+
return (M, h) => {
|
|
11
|
+
const a = l("ZlMenuItem", !0), r = l("el-sub-menu"), k = l("el-menu-item");
|
|
12
|
+
return e.item.children?.length ? (t(), n(r, {
|
|
13
13
|
key: 0,
|
|
14
14
|
index: e.item.key,
|
|
15
15
|
disabled: e.item.disabled
|
|
16
16
|
}, {
|
|
17
17
|
title: i(() => [
|
|
18
|
-
e.item.icon ? (t(), n(
|
|
18
|
+
e.item.icon ? (t(), n(c(d), {
|
|
19
19
|
key: 0,
|
|
20
20
|
icon: e.item.icon
|
|
21
|
-
}, null, 8, ["icon"])) :
|
|
22
|
-
x("span", null,
|
|
21
|
+
}, null, 8, ["icon"])) : o("", !0),
|
|
22
|
+
x("span", null, u(e.item.label), 1)
|
|
23
23
|
]),
|
|
24
24
|
default: i(() => [
|
|
25
|
-
(t(!0),
|
|
25
|
+
(t(!0), s(y, null, f(e.item.children, (m) => (t(), n(a, {
|
|
26
26
|
key: m.key,
|
|
27
27
|
item: m
|
|
28
28
|
}, null, 8, ["item"]))), 128))
|
|
29
29
|
]),
|
|
30
30
|
_: 1
|
|
31
|
-
}, 8, ["index", "disabled"])) : (t(), n(
|
|
31
|
+
}, 8, ["index", "disabled"])) : (t(), n(k, {
|
|
32
32
|
key: 1,
|
|
33
33
|
index: e.item.key,
|
|
34
34
|
disabled: e.item.disabled
|
|
35
35
|
}, {
|
|
36
36
|
title: i(() => [
|
|
37
|
-
|
|
37
|
+
I(u(e.item.label), 1)
|
|
38
38
|
]),
|
|
39
39
|
default: i(() => [
|
|
40
|
-
e.item.icon ? (t(), n(
|
|
40
|
+
e.item.icon ? (t(), n(c(d), {
|
|
41
41
|
key: 0,
|
|
42
42
|
icon: e.item.icon
|
|
43
|
-
}, null, 8, ["icon"])) :
|
|
43
|
+
}, null, 8, ["icon"])) : o("", !0)
|
|
44
44
|
]),
|
|
45
45
|
_: 1
|
|
46
46
|
}, 8, ["index", "disabled"]));
|
|
@@ -48,6 +48,6 @@ const M = /* @__PURE__ */ k({
|
|
|
48
48
|
}
|
|
49
49
|
});
|
|
50
50
|
export {
|
|
51
|
-
|
|
51
|
+
g as default
|
|
52
52
|
};
|
|
53
53
|
//# sourceMappingURL=ZlMenuItem.vue.mjs.map
|
|
@@ -1,11 +1,17 @@
|
|
|
1
|
+
import { Component, VNode } from 'vue';
|
|
1
2
|
/** ZlMenu 菜单项配置 */
|
|
2
3
|
export interface MenuOption {
|
|
3
4
|
/** 唯一标识：选中态、select 事件、路由跳转都以它为准 */
|
|
4
5
|
key: string;
|
|
5
6
|
/** 菜单文案 */
|
|
6
7
|
label: string;
|
|
7
|
-
/**
|
|
8
|
-
|
|
8
|
+
/**
|
|
9
|
+
* 图标：
|
|
10
|
+
* - 字符串：`@zl-ui-kit/icons` 中的 `zl:*` 图标名；
|
|
11
|
+
* - 组件：如 `h(MenuIcon, { name: 'a-home' })` 里的组件本身；
|
|
12
|
+
* - VNode：如 `h(MenuIcon, { name: 'a-home' })` 的结果。
|
|
13
|
+
*/
|
|
14
|
+
icon?: string | Component | VNode;
|
|
9
15
|
/** 是否禁用 */
|
|
10
16
|
disabled?: boolean;
|
|
11
17
|
/** 子菜单 */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zl-ui-kit/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.20.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "ZL UI 业务组件库（Element Plus 体系，Zl 前缀）——首批：Icon/AutoTooltip/Tag/CornerTag/Text/Title/Copy/Empty/Pagination/DictTag",
|
|
6
6
|
"license": "MIT",
|
|
@@ -39,9 +39,9 @@
|
|
|
39
39
|
"file-type": "^20.4.1",
|
|
40
40
|
"dt-sql-parser": "^4.3.1",
|
|
41
41
|
"sql-formatter": "^15.4.2",
|
|
42
|
-
"@zl-ui-kit/
|
|
43
|
-
"@zl-ui-kit/
|
|
44
|
-
"@zl-ui-kit/utils": "0.
|
|
42
|
+
"@zl-ui-kit/composables": "0.20.0",
|
|
43
|
+
"@zl-ui-kit/icons": "0.20.0",
|
|
44
|
+
"@zl-ui-kit/utils": "0.20.0"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"@vueuse/core": "^12.3.0 || ^13.0.0 || ^14.0.0 || ^15.0.0",
|
|
@@ -98,10 +98,10 @@
|
|
|
98
98
|
"@vue-office/pdf": "^2.0.10",
|
|
99
99
|
"@vue-office/pptx": "1.0.1",
|
|
100
100
|
"echarts": "^5.6.0",
|
|
101
|
-
"@
|
|
101
|
+
"@zl-ui-kit/theme": "0.20.0",
|
|
102
102
|
"@jichuang/eslint-config": "1.0.0",
|
|
103
|
-
"@jichuang/
|
|
104
|
-
"@
|
|
103
|
+
"@jichuang/vite-config": "1.0.0",
|
|
104
|
+
"@jichuang/tsconfig": "1.0.0"
|
|
105
105
|
},
|
|
106
106
|
"repository": {
|
|
107
107
|
"type": "git",
|