@zl-ui-kit/components 0.14.1 → 0.14.2
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
|
@@ -5774,13 +5774,13 @@ import { ZlTabs } from '@zl-ui-kit/components'
|
|
|
5774
5774
|
|
|
5775
5775
|
**props**
|
|
5776
5776
|
|
|
5777
|
-
| 属性 | 类型 | 默认值 | 必填 | 示例 | 说明
|
|
5778
|
-
| ------------ | ------------------ | ----------- | ---- | ------------------- |
|
|
5779
|
-
| `tabs` | `any[]` | `() => []` | 否 | `:tabs="[]"` | 页签配置列表，以 key 关联内容插槽
|
|
5780
|
-
| `modelValue` | `[String, Number]` | `undefined` | 否 | `v-model="value"` | 当前激活页签的 key，可用 v-model 双向绑定
|
|
5781
|
-
| `border` | `boolean` | `true` | 否 | `:border="false"` | 是否显示页签导航分隔线，默认显示
|
|
5782
|
-
| `fit` | `boolean` | — | 否 | `fit` | 是否撑满容器并让内容区滚动
|
|
5783
|
-
| `darkNav` | `boolean` | `true` | 否 | `:dark-nav="false"` |
|
|
5777
|
+
| 属性 | 类型 | 默认值 | 必填 | 示例 | 说明 |
|
|
5778
|
+
| ------------ | ------------------ | ----------- | ---- | ------------------- | ------------------------------------------------------------------------ |
|
|
5779
|
+
| `tabs` | `any[]` | `() => []` | 否 | `:tabs="[]"` | 页签配置列表，以 key 关联内容插槽 |
|
|
5780
|
+
| `modelValue` | `[String, Number]` | `undefined` | 否 | `v-model="value"` | 当前激活页签的 key，可用 v-model 双向绑定 |
|
|
5781
|
+
| `border` | `boolean` | `true` | 否 | `:border="false"` | 是否显示页签导航分隔线，默认显示 |
|
|
5782
|
+
| `fit` | `boolean` | — | 否 | `fit` | 是否撑满容器并让内容区滚动 |
|
|
5783
|
+
| `darkNav` | `boolean` | `true` | 否 | `:dark-nav="false"` | 是否启用导航背景色（取主题卡片底色 `--zl-bg-2`，light 为白底），默认启用 |
|
|
5784
5784
|
|
|
5785
5785
|
> 选项式组件（`defineComponent`），props 定义在 `props: {}` 中
|
|
5786
5786
|
> 把 `$attrs` 透传给内部组件，未列出的属性会继续下传
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zl-tabs-wrap{position:relative;width:100%}.zl-tabs-wrap>.zl-tabs__extra,.zl-tabs-wrap [slot=extra]{position:absolute;top:6px;right:12px;z-index:1}.zl-tabs{--nav-bg: var(--zl-
|
|
1
|
+
.zl-tabs-wrap{position:relative;width:100%}.zl-tabs-wrap>.zl-tabs__extra,.zl-tabs-wrap [slot=extra]{position:absolute;top:6px;right:12px;z-index:1}.zl-tabs{--nav-bg: var(--zl-bg-2, #fff)}.zl-tabs-dark-nav.zl-tabs>.el-tabs__header{background-color:var(--nav-bg);margin-bottom:0}.zl-tabs-no-border .el-tabs__nav-wrap:after{display:none}.zl-tabs-fit{height:100%;display:flex;flex-direction:column}.zl-tabs-fit .el-tabs__content{flex:1;overflow:auto}.zl-tabs .el-tabs__item{font-weight:400;font-size:12px;line-height:20px;padding:0 16px}.zl-tabs .el-tabs__item.is-active{font-weight:600;color:var(--zl-text-1, #242e43)}
|
|
@@ -12,6 +12,11 @@
|
|
|
12
12
|
* 里手写的裸函数没有上下文：EP 的 ElTabs / ElTabPane 在各自 render 里调用它时，
|
|
13
13
|
* Vue 会告警 `Slot "default" invoked outside of the render function`，且 slot 内的
|
|
14
14
|
* 响应式依赖不会被追踪（数据变了页签内容不更新）。withCtx 补齐上下文后与模板写法等价。
|
|
15
|
+
*
|
|
16
|
+
* 注意 3：`class` 必须经 mergeProps 合并，不能写成 `{ class: [...], ...attrs }`。
|
|
17
|
+
* 对象字面量后展开的 `attrs.class` 会整键覆盖前一个 `class`，调用方只要写了
|
|
18
|
+
* `class="xxx"`，内部的 `zl-tabs` / `zl-tabs-no-border` 等类就全丢，`border` 等开关随之失效
|
|
19
|
+
* （且无任何告警）。mergeProps 会把两边 class/style/事件合并成数组。
|
|
15
20
|
*/
|
|
16
21
|
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
|
17
22
|
/** 页签配置列表，以 key 关联内容插槽 */
|
|
@@ -31,7 +36,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
31
36
|
};
|
|
32
37
|
/** 是否撑满容器并让内容区滚动 */
|
|
33
38
|
fit: BooleanConstructor;
|
|
34
|
-
/**
|
|
39
|
+
/** 是否启用导航背景色（取主题卡片底色 `--zl-bg-2`，light 为白底），默认启用 */
|
|
35
40
|
darkNav: {
|
|
36
41
|
type: BooleanConstructor;
|
|
37
42
|
default: boolean;
|
|
@@ -59,7 +64,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
59
64
|
};
|
|
60
65
|
/** 是否撑满容器并让内容区滚动 */
|
|
61
66
|
fit: BooleanConstructor;
|
|
62
|
-
/**
|
|
67
|
+
/** 是否启用导航背景色（取主题卡片底色 `--zl-bg-2`，light 为白底），默认启用 */
|
|
63
68
|
darkNav: {
|
|
64
69
|
type: BooleanConstructor;
|
|
65
70
|
default: boolean;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ElTabs as b, ElTabPane as p } from "element-plus";
|
|
2
|
-
import { defineComponent as c, getCurrentInstance as y, h as r, withCtx as
|
|
3
|
-
const
|
|
2
|
+
import { defineComponent as c, getCurrentInstance as y, h as r, mergeProps as z, withCtx as n, renderSlot as d } from "vue";
|
|
3
|
+
const g = c({
|
|
4
4
|
name: "ZlTabs",
|
|
5
5
|
inheritAttrs: !1,
|
|
6
6
|
props: {
|
|
@@ -12,7 +12,7 @@ const V = c({
|
|
|
12
12
|
border: { type: Boolean, default: !0 },
|
|
13
13
|
/** 是否撑满容器并让内容区滚动 */
|
|
14
14
|
fit: Boolean,
|
|
15
|
-
/**
|
|
15
|
+
/** 是否启用导航背景色（取主题卡片底色 `--zl-bg-2`，light 为白底），默认启用 */
|
|
16
16
|
darkNav: { type: Boolean, default: !0 }
|
|
17
17
|
},
|
|
18
18
|
emits: {
|
|
@@ -20,50 +20,54 @@ const V = c({
|
|
|
20
20
|
"update:modelValue": (e) => typeof e == "string" || typeof e == "number" || e === void 0
|
|
21
21
|
},
|
|
22
22
|
setup(e, { slots: a, attrs: u, emit: s }) {
|
|
23
|
-
const
|
|
23
|
+
const o = y();
|
|
24
24
|
return () => r("div", { class: "zl-tabs-wrap" }, [
|
|
25
25
|
r(
|
|
26
26
|
b,
|
|
27
|
+
z(
|
|
28
|
+
{
|
|
29
|
+
class: [
|
|
30
|
+
"zl-tabs",
|
|
31
|
+
{
|
|
32
|
+
"zl-tabs-no-border": !e.border,
|
|
33
|
+
"zl-tabs-fit": e.fit,
|
|
34
|
+
"zl-tabs-dark-nav": e.darkNav
|
|
35
|
+
}
|
|
36
|
+
]
|
|
37
|
+
},
|
|
38
|
+
u,
|
|
39
|
+
{
|
|
40
|
+
// 受控页签走显式契约（modelValue 已声明为 prop，不会落在 attrs 里）
|
|
41
|
+
modelValue: e.modelValue,
|
|
42
|
+
"onUpdate:modelValue": (t) => s("update:modelValue", t)
|
|
43
|
+
}
|
|
44
|
+
),
|
|
27
45
|
{
|
|
28
|
-
|
|
29
|
-
"zl-tabs",
|
|
30
|
-
{
|
|
31
|
-
"zl-tabs-no-border": !e.border,
|
|
32
|
-
"zl-tabs-fit": e.fit,
|
|
33
|
-
"zl-tabs-dark-nav": e.darkNav
|
|
34
|
-
}
|
|
35
|
-
],
|
|
36
|
-
...u,
|
|
37
|
-
// 受控页签走显式契约（modelValue 已声明为 prop，不会落在 attrs 里）
|
|
38
|
-
modelValue: e.modelValue,
|
|
39
|
-
"onUpdate:modelValue": (t) => s("update:modelValue", t)
|
|
40
|
-
},
|
|
41
|
-
{
|
|
42
|
-
default: o(
|
|
46
|
+
default: n(
|
|
43
47
|
() => [
|
|
44
48
|
...e.tabs.map((t) => {
|
|
45
|
-
const { key: l, title:
|
|
49
|
+
const { key: l, title: m, lazyLoad: f, ...i } = t;
|
|
46
50
|
return r(
|
|
47
51
|
p,
|
|
48
52
|
{
|
|
49
53
|
key: l,
|
|
50
54
|
name: l,
|
|
51
|
-
label:
|
|
55
|
+
label: m,
|
|
52
56
|
// 默认懒挂载；可用 tab 里的 `lazy: false` 或 arco 风 `lazyLoad: false` 覆盖
|
|
53
|
-
lazy:
|
|
54
|
-
...
|
|
57
|
+
lazy: f ?? !0,
|
|
58
|
+
...i
|
|
55
59
|
},
|
|
56
60
|
{
|
|
57
61
|
// 必须返回数组：ElTabPane 用 renderSlot 渲染内容，内部 ensureValidVNode
|
|
58
62
|
// 会对返回值调用 .some()，拿到单个 vnode 会直接抛 TypeError。
|
|
59
|
-
default:
|
|
63
|
+
default: n(() => [d(a, l, { tab: t })], o)
|
|
60
64
|
}
|
|
61
65
|
);
|
|
62
66
|
}),
|
|
63
67
|
// 追加在页签列表之后的内容（不在任何 ElTabPane 内）
|
|
64
68
|
d(a, "default")
|
|
65
69
|
],
|
|
66
|
-
|
|
70
|
+
o
|
|
67
71
|
)
|
|
68
72
|
}
|
|
69
73
|
),
|
|
@@ -73,6 +77,6 @@ const V = c({
|
|
|
73
77
|
}
|
|
74
78
|
});
|
|
75
79
|
export {
|
|
76
|
-
|
|
80
|
+
g as default
|
|
77
81
|
};
|
|
78
82
|
//# sourceMappingURL=index.vue.mjs.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zl-ui-kit/components",
|
|
3
|
-
"version": "0.14.
|
|
3
|
+
"version": "0.14.2",
|
|
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/composables": "0.14.
|
|
43
|
-
"@zl-ui-kit/icons": "0.14.
|
|
44
|
-
"@zl-ui-kit/utils": "0.14.
|
|
42
|
+
"@zl-ui-kit/composables": "0.14.2",
|
|
43
|
+
"@zl-ui-kit/icons": "0.14.2",
|
|
44
|
+
"@zl-ui-kit/utils": "0.14.2"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"@vueuse/core": "^12.3.0 || ^13.0.0 || ^14.0.0 || ^15.0.0",
|
|
@@ -99,9 +99,9 @@
|
|
|
99
99
|
"@vue-office/pptx": "1.0.1",
|
|
100
100
|
"echarts": "^5.6.0",
|
|
101
101
|
"@jichuang/tsconfig": "1.0.0",
|
|
102
|
-
"@
|
|
102
|
+
"@jichuang/eslint-config": "1.0.0",
|
|
103
103
|
"@jichuang/vite-config": "1.0.0",
|
|
104
|
-
"@
|
|
104
|
+
"@zl-ui-kit/theme": "0.14.2"
|
|
105
105
|
},
|
|
106
106
|
"repository": {
|
|
107
107
|
"type": "git",
|