@zl-ui-kit/components 0.12.0 → 0.13.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 +106 -30
- package/dist/components/ZlPageContainer/index.css +1 -0
- package/dist/components/{ZlPageHeader → ZlPageContainer}/index.vue.d.ts +6 -1
- package/dist/components/{ZlPageHeader → ZlPageContainer}/index.vue.mjs +2 -2
- package/dist/components/ZlPageContainer/index2.vue.mjs +53 -0
- package/dist/components/ZlStep/index.css +1 -0
- package/dist/components/ZlStep/index.vue.d.ts +73 -0
- package/dist/components/ZlStep/index.vue.mjs +8 -0
- package/dist/components/ZlStep/index2.vue.mjs +91 -0
- package/dist/components/ZlTreeSelect/index.css +1 -1
- package/dist/components/ZlTreeSelect/index.vue.d.ts +22 -3
- package/dist/components/ZlTreeSelect/index.vue.mjs +2 -2
- package/dist/components/ZlTreeSelect/index2.vue.mjs +101 -40
- package/dist/index.d.ts +3 -1
- package/dist/index.mjs +83 -80
- package/package.json +6 -6
- package/dist/components/ZlPageHeader/index.css +0 -1
- package/dist/components/ZlPageHeader/index2.vue.mjs +0 -38
package/README.md
CHANGED
|
@@ -3464,7 +3464,7 @@ const { i18n } = useLocale({ messages })
|
|
|
3464
3464
|
| [`ZlIconLabel`](#zliconlabel) | 主入口 | 1 | 1 | 1 | 0 |
|
|
3465
3465
|
| [`ZlCornerTag`](#zlcornertag) | 主入口 | 3 | 0 | 1 | 0 |
|
|
3466
3466
|
| [`ZlLayoutSwitch`](#zllayoutswitch) | 主入口 | 2 | 1 | 0 | 0 |
|
|
3467
|
-
| [`
|
|
3467
|
+
| [`ZlPageContainer`](#zlpagecontainer) | 主入口 | 3 | 0 | 4 | 0 |
|
|
3468
3468
|
| [`ZlPagination`](#zlpagination) | 主入口 | 4 | 3 | 0 | 0 |
|
|
3469
3469
|
| [`ZlPermission`](#zlpermission) | 主入口 | 1 | 0 | 1 | 0 |
|
|
3470
3470
|
| [`ZlPopconfirm`](#zlpopconfirm) | 主入口 | 4 | 2 | 3 | 0 |
|
|
@@ -3474,6 +3474,7 @@ const { i18n } = useLocale({ messages })
|
|
|
3474
3474
|
| [`ZlSection`](#zlsection) | 主入口 | 4 | 0 | 3 | 0 |
|
|
3475
3475
|
| [`ZlSorter`](#zlsorter) | 主入口 | 2 | 2 | 1 | 0 |
|
|
3476
3476
|
| [`ZlSorterList`](#zlsorterlist) | 主入口 | 2 | 1 | 0 | 0 |
|
|
3477
|
+
| [`ZlStep`](#zlstep) | 主入口 | 10 | 0 | 3 | 0 |
|
|
3477
3478
|
| [`ZlSwitch`](#zlswitch) | 主入口 | 8 | 2 | 2 | 0 |
|
|
3478
3479
|
| [`ZlTable`](#zltable) | 主入口 | 6 | 3 | 3 | 16 |
|
|
3479
3480
|
| [`ZlTabs`](#zltabs) | 主入口 | 5 | 1 | 3 | 0 |
|
|
@@ -3482,7 +3483,7 @@ const { i18n } = useLocale({ messages })
|
|
|
3482
3483
|
| [`ZlTitle`](#zltitle) | 主入口 | 5 | 0 | 3 | 0 |
|
|
3483
3484
|
| [`ZlUpload`](#zlupload) | 主入口 | 13 | 1 | 1 | 0 |
|
|
3484
3485
|
| [`ZlTree`](#zltree) | 主入口 | 10 | 2 | 5 | 23 |
|
|
3485
|
-
| [`ZlTreeSelect`](#zltreeselect) | 主入口 |
|
|
3486
|
+
| [`ZlTreeSelect`](#zltreeselect) | 主入口 | 10 | 1 | 0 | 0 |
|
|
3486
3487
|
| [`ZlChart`](#zlchart) | 子入口 chart | 2 | 0 | 0 | 1 |
|
|
3487
3488
|
| [`ZlEditor`](#zleditor) | 子入口 editor | 3 | 1 | 0 | 10 |
|
|
3488
3489
|
| [`ZlSqlEditor`](#zlsqleditor) | 子入口 editor | 4 | 1 | 0 | 3 |
|
|
@@ -4911,52 +4912,61 @@ import { ZlLayoutSwitch } from '@zl-ui-kit/components'
|
|
|
4911
4912
|
| ------------------- | ------------------- | -------------- |
|
|
4912
4913
|
| `update:modelValue` | `'grid' \| 'table'` | `v-model` 更新 |
|
|
4913
4914
|
|
|
4914
|
-
#### `
|
|
4915
|
+
#### `ZlPageContainer`
|
|
4915
4916
|
|
|
4916
|
-
<sub>入口 `@zl-ui-kit/components` · 源码 `packages/components/src/components/
|
|
4917
|
+
<sub>入口 `@zl-ui-kit/components` · 源码 `packages/components/src/components/ZlPageContainer/index.vue`</sub>
|
|
4917
4918
|
|
|
4918
|
-
|
|
4919
|
+
**简介**:页面容器:占满父级高度的整页骨架,统一页面底色(浅灰)与内边距;顶部标题栏(标题 + 描述 + 右侧 extra 操作,无任何头部内容时自动隐藏),下方 content 插槽放页面主体内容
|
|
4919
4920
|
|
|
4920
|
-
**接口概览**:
|
|
4921
|
+
**接口概览**:3 props · 4 插槽
|
|
4921
4922
|
|
|
4922
4923
|
**用法示例**
|
|
4923
4924
|
|
|
4924
4925
|
```vue
|
|
4925
4926
|
<script setup lang="ts">
|
|
4926
|
-
import {
|
|
4927
|
+
import { ZlPageContainer } from '@zl-ui-kit/components'
|
|
4927
4928
|
</script>
|
|
4928
4929
|
|
|
4929
4930
|
<template>
|
|
4930
|
-
<
|
|
4931
|
+
<ZlPageContainer
|
|
4932
|
+
:title="hasHeader.value ? '数据加工管理' : undefined"
|
|
4933
|
+
:description="description"
|
|
4934
|
+
style="flex: 1; min-height: 0"
|
|
4935
|
+
/>
|
|
4931
4936
|
</template>
|
|
4932
4937
|
```
|
|
4933
4938
|
|
|
4939
|
+
> 示例中的 `title`、`description` 是数组 / 对象 / 函数等非字面量入参,由调用方提供数据;其余属性写法可直接照搬。
|
|
4940
|
+
|
|
4934
4941
|
**插槽用法**
|
|
4935
4942
|
|
|
4936
4943
|
```vue
|
|
4937
4944
|
<template>
|
|
4938
|
-
<
|
|
4945
|
+
<ZlPageContainer>
|
|
4939
4946
|
<template #title>…</template>
|
|
4940
4947
|
<template #description>…</template>
|
|
4941
4948
|
<template #extra>…</template>
|
|
4942
|
-
|
|
4949
|
+
<template #content>…</template>
|
|
4950
|
+
</ZlPageContainer>
|
|
4943
4951
|
</template>
|
|
4944
4952
|
```
|
|
4945
4953
|
|
|
4946
4954
|
**props**
|
|
4947
4955
|
|
|
4948
|
-
| 属性 | 类型
|
|
4949
|
-
| ------------- |
|
|
4950
|
-
| `title` | `string`
|
|
4951
|
-
| `description` | `string`
|
|
4956
|
+
| 属性 | 类型 | 默认值 | 必填 | 示例 | 说明 |
|
|
4957
|
+
| ------------- | ------------------ | ------ | ---- | ---------------------- | ---------------------------------------------------------- |
|
|
4958
|
+
| `title` | `string` | — | 否 | `title="标题"` | 页头标题文案;可用 title 插槽覆盖 |
|
|
4959
|
+
| `description` | `string` | — | 否 | `description="副标题"` | 标题下方的描述文案;可用 description 插槽覆盖 |
|
|
4960
|
+
| `padding` | `number \| string` | `16` | 否 | `:padding="padding"` | 页面统一内边距,数字为 px、字符串原样用于 padding;默认 16 |
|
|
4952
4961
|
|
|
4953
4962
|
**插槽(slots)**
|
|
4954
4963
|
|
|
4955
|
-
| 插槽 | 作用域参数 | 示例 | 说明
|
|
4956
|
-
| ------------- | ---------- | ------------------------------------- |
|
|
4957
|
-
| `title` | — | `<template #title>…</template>` | 自定义标题内容,覆盖 title
|
|
4958
|
-
| `description` | — | `<template #description>…</template>` | 自定义描述内容,覆盖 description
|
|
4959
|
-
| `extra` | — | `<template #extra>…</template>` | 页头右侧自定义内容区(如新建、导出等操作按钮)
|
|
4964
|
+
| 插槽 | 作用域参数 | 示例 | 说明 |
|
|
4965
|
+
| ------------- | ---------- | ------------------------------------- | --------------------------------------------------------------------- |
|
|
4966
|
+
| `title` | — | `<template #title>…</template>` | 自定义标题内容,覆盖 title |
|
|
4967
|
+
| `description` | — | `<template #description>…</template>` | 自定义描述内容,覆盖 description |
|
|
4968
|
+
| `extra` | — | `<template #extra>…</template>` | 页头右侧自定义内容区(如新建、导出等操作按钮) |
|
|
4969
|
+
| `content` | — | `<template #content>…</template>` | 页面主体内容区,占满页头以下的剩余高度(如左列表 + 右详情的整块布局) |
|
|
4960
4970
|
|
|
4961
4971
|
#### `ZlPagination`
|
|
4962
4972
|
|
|
@@ -5416,6 +5426,63 @@ import { ZlSorterList } from '@zl-ui-kit/components'
|
|
|
5416
5426
|
| -------- | ------------------------------------- | -------------------------------------------------------------- |
|
|
5417
5427
|
| `change` | `Record<string, any>, string, string` | 某字段排序变化时触发,参数依次为整份排序对象、字段名、新排序值 |
|
|
5418
5428
|
|
|
5429
|
+
#### `ZlStep`
|
|
5430
|
+
|
|
5431
|
+
<sub>入口 `@zl-ui-kit/components` · 源码 `packages/components/src/components/ZlStep/index.vue`</sub>
|
|
5432
|
+
|
|
5433
|
+
**简介**:步骤条:以 schema 描述各步骤,支持横向/纵向排列与标题、描述、图标级作用域插槽自定义; 封装 Element Plus el-steps,状态(finish/process/wait/error/success)随 current 自动推算,也可逐项覆盖
|
|
5434
|
+
|
|
5435
|
+
**接口概览**:10 props · 3 插槽
|
|
5436
|
+
|
|
5437
|
+
**用法示例**
|
|
5438
|
+
|
|
5439
|
+
```vue
|
|
5440
|
+
<script setup lang="ts">
|
|
5441
|
+
import { ZlStep } from '@zl-ui-kit/components'
|
|
5442
|
+
</script>
|
|
5443
|
+
|
|
5444
|
+
<template>
|
|
5445
|
+
<ZlStep :current="current.value" :direction="direction.value" />
|
|
5446
|
+
</template>
|
|
5447
|
+
```
|
|
5448
|
+
|
|
5449
|
+
> 示例中的 `current`、`direction` 是数组 / 对象 / 函数等非字面量入参,由调用方提供数据;其余属性写法可直接照搬。
|
|
5450
|
+
|
|
5451
|
+
**插槽用法**
|
|
5452
|
+
|
|
5453
|
+
```vue
|
|
5454
|
+
<template>
|
|
5455
|
+
<ZlStep>
|
|
5456
|
+
<template #title="{ item, index }">…</template>
|
|
5457
|
+
<template #description="{ item, index }">…</template>
|
|
5458
|
+
<template #icon="{ item, index }">…</template>
|
|
5459
|
+
</ZlStep>
|
|
5460
|
+
</template>
|
|
5461
|
+
```
|
|
5462
|
+
|
|
5463
|
+
**props**
|
|
5464
|
+
|
|
5465
|
+
| 属性 | 类型 | 默认值 | 必填 | 示例 | 说明 |
|
|
5466
|
+
| --------------------- | --------------------------------------------------------- | -------------- | ---- | ---------------------------- | ------------------------------------------------------- |
|
|
5467
|
+
| `steps` | `StepItem[]` | `() => []` | 否 | `:steps="steps"` | 步骤列表,决定步骤数量、顺序与内容 |
|
|
5468
|
+
| `current` | `number` | `0` | 否 | `:current="1"` | 当前步骤下标(从 0 开始) |
|
|
5469
|
+
| `direction` | `'horizontal' \| 'vertical'` | `'horizontal'` | 否 | `direction="horizontal"` | 排列方向:横向或纵向 |
|
|
5470
|
+
| `processStatus` | `'process' \| 'finish' \| 'error'` | `'process'` | 否 | `process-status="process"` | 当前步骤呈现的状态 |
|
|
5471
|
+
| `finishStatus` | `'wait' \| 'process' \| 'finish' \| 'error' \| 'success'` | `'finish'` | 否 | `finish-status="wait"` | 已完成步骤呈现的状态 |
|
|
5472
|
+
| `showDescription` | `boolean` | `true` | 否 | `:show-description="false"` | 是否展示各步骤描述 |
|
|
5473
|
+
| `alignCenter` | `boolean` | `true` | 否 | `:align-center="false"` | 各步骤是否居中对齐(图标与标题/描述水平居中,默认居中) |
|
|
5474
|
+
| `space` | `number \| string` | — | 否 | `:space="space"` | 步骤条间距,数字为 px、字符串支持百分比;缺省自动均分 |
|
|
5475
|
+
| `titleFontSize` | `number` | — | 否 | `:title-font-size="1"` | 标题字号(px) |
|
|
5476
|
+
| `descriptionFontSize` | `number` | — | 否 | `:description-font-size="1"` | 描述字号(px) |
|
|
5477
|
+
|
|
5478
|
+
**插槽(slots)**
|
|
5479
|
+
|
|
5480
|
+
| 插槽 | 作用域参数 | 示例 | 说明 |
|
|
5481
|
+
| ------------- | ---------------- | ------------------------------------------------------- | -------------------------------------------------------------- |
|
|
5482
|
+
| `title` | `item` / `index` | `<template #title="{ item, index }">…</template>` | 自定义步骤标题,作用域参数 { item, index } |
|
|
5483
|
+
| `description` | `item` / `index` | `<template #description="{ item, index }">…</template>` | 自定义步骤描述,作用域参数 { item, index } |
|
|
5484
|
+
| `icon` | `item` / `index` | `<template #icon="{ item, index }">…</template>` | 自定义步骤图标,作用域参数 { item, index };缺省渲染 item.icon |
|
|
5485
|
+
|
|
5419
5486
|
#### `ZlSwitch`
|
|
5420
5487
|
|
|
5421
5488
|
<sub>入口 `@zl-ui-kit/components` · 源码 `packages/components/src/components/ZlSwitch/index.vue`</sub>
|
|
@@ -5944,7 +6011,7 @@ import { ZlTree } from '@zl-ui-kit/components'
|
|
|
5944
6011
|
|
|
5945
6012
|
<sub>入口 `@zl-ui-kit/components` · 源码 `packages/components/src/components/ZlTreeSelect/index.vue`</sub>
|
|
5946
6013
|
|
|
5947
|
-
**接口概览**:
|
|
6014
|
+
**接口概览**:10 props · 1 事件
|
|
5948
6015
|
|
|
5949
6016
|
**用法示例**
|
|
5950
6017
|
|
|
@@ -5954,22 +6021,31 @@ import { ZlTreeSelect } from '@zl-ui-kit/components'
|
|
|
5954
6021
|
</script>
|
|
5955
6022
|
|
|
5956
6023
|
<template>
|
|
5957
|
-
<ZlTreeSelect
|
|
6024
|
+
<ZlTreeSelect
|
|
6025
|
+
:multiple="multiple.value"
|
|
6026
|
+
:origin-tree-data="treeData"
|
|
6027
|
+
placeholder="请选择"
|
|
6028
|
+
v-model="value"
|
|
6029
|
+
/>
|
|
5958
6030
|
</template>
|
|
5959
6031
|
```
|
|
5960
6032
|
|
|
5961
|
-
> 示例中的 `originTreeData` 是数组 / 对象 / 函数等非字面量入参,由调用方提供数据;其余属性写法可直接照搬。
|
|
6033
|
+
> 示例中的 `multiple`、`originTreeData` 是数组 / 对象 / 函数等非字面量入参,由调用方提供数据;其余属性写法可直接照搬。
|
|
5962
6034
|
|
|
5963
6035
|
**props**
|
|
5964
6036
|
|
|
5965
|
-
| 属性 | 类型
|
|
5966
|
-
| ------------------- |
|
|
5967
|
-
| `modelValue` | `any`
|
|
5968
|
-
| `originTreeData` | `any[]`
|
|
5969
|
-
| `allName` | `string`
|
|
5970
|
-
| `labelInValue` | `boolean`
|
|
5971
|
-
| `fieldNames` | `{ key?: string; title?: string; children?: string }`
|
|
5972
|
-
| `treeCheckStrictly` | `boolean`
|
|
6037
|
+
| 属性 | 类型 | 默认值 | 必填 | 示例 | 说明 |
|
|
6038
|
+
| ------------------- | ---------------------------------------------------------------- | -------------------------------------------------------------- | ---- | --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
|
|
6039
|
+
| `modelValue` | `any` | — | 否 | `v-model="value"` | 当前选中值:多选为键值数组(级联下含半选父键),单选为单个键值;labelInValue 时包成 {label,value} |
|
|
6040
|
+
| `originTreeData` | `any[]` | — | 是 | `:origin-tree-data="[]"` | 树数据 |
|
|
6041
|
+
| `allName` | `string` | — | 否 | `all-name="全部"` | "全部"节点名(启用全选控制条,仅多选模式生效) |
|
|
6042
|
+
| `labelInValue` | `boolean` | `false` | 否 | `label-in-value` | 返回 {label, value} 对象数组(缺省返回键值数组) |
|
|
6043
|
+
| `fieldNames` | `{ key?: string; title?: string; children?: string }` | `() => ({ key: 'key', title: 'title', children: 'children' })` | 否 | `:field-names="{}"` | 树节点键名、标题与子级字段映射 |
|
|
6044
|
+
| `treeCheckStrictly` | `boolean` | `false` | 否 | `tree-check-strictly` | 父子不关联(true 时取消级联:勾选/单选互不影响) |
|
|
6045
|
+
| `multiple` | `boolean` | `true` | 否 | `:multiple="false"` | 是否多选(默认 true);true 时节点前渲染复选框并父子级联,false 时仅叶子节点可单选 |
|
|
6046
|
+
| `disabled` | `boolean \| Array<string \| number> \| ((data: any) => boolean)` | `undefined` | 否 | `:disabled="() => {}"` | 动态控制不可选项: - 布尔值:整体禁用下拉控件 - 键数组:禁用这些 key 对应的节点 - 函数:`(data) => boolean` 返回 true 的节点禁用 |
|
|
6047
|
+
| `showPath` | `boolean` | `true` | 否 | `:show-path="false"` | 选中后是否在输入框 / 标签里显示完整父级路径(默认 true,体现级联关系) |
|
|
6048
|
+
| `pathSeparator` | `string` | `' / '` | 否 | `path-separator="path-separator"` | 路径分隔符(showPath 生效时用) |
|
|
5973
6049
|
|
|
5974
6050
|
> 把 `$attrs` 透传给 `el-tree-select`,未列出的属性会继续下传
|
|
5975
6051
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.zl-page-container[data-v-4a47d884]{display:flex;flex-direction:column;box-sizing:border-box;height:100%;background-color:var(--zl-fill-2, #f0f2f7)}.zl-page-container__header[data-v-4a47d884]{display:flex;flex-shrink:0;gap:16px;align-items:center;margin-bottom:16px}.zl-page-container__main[data-v-4a47d884]{flex:1;min-width:0}.zl-page-container__title[data-v-4a47d884]{font-size:16px;font-weight:600;line-height:24px;color:var(--zl-text-1, #242e43)}.zl-page-container__description[data-v-4a47d884]{margin-top:2px;font-size:13px;line-height:20px;color:var(--zl-text-3, #79879c)}.zl-page-container__extra[data-v-4a47d884]{display:flex;flex-shrink:0;align-items:center;gap:8px}.zl-page-container__content[data-v-4a47d884]{flex:1;min-height:0;overflow:auto}
|
|
@@ -3,6 +3,8 @@ type __VLS_Props = {
|
|
|
3
3
|
title?: string;
|
|
4
4
|
/** 标题下方的描述文案;可用 description 插槽覆盖 */
|
|
5
5
|
description?: string;
|
|
6
|
+
/** 页面统一内边距,数字为 px、字符串原样用于 padding;默认 16 */
|
|
7
|
+
padding?: number | string;
|
|
6
8
|
};
|
|
7
9
|
declare function __VLS_template(): {
|
|
8
10
|
attrs: Partial<{}>;
|
|
@@ -10,12 +12,15 @@ declare function __VLS_template(): {
|
|
|
10
12
|
title?(_: {}): any;
|
|
11
13
|
description?(_: {}): any;
|
|
12
14
|
extra?(_: {}): any;
|
|
15
|
+
content?(_: {}): any;
|
|
13
16
|
};
|
|
14
17
|
refs: {};
|
|
15
18
|
rootEl: HTMLDivElement;
|
|
16
19
|
};
|
|
17
20
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
18
|
-
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
21
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
22
|
+
padding: number | string;
|
|
23
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
19
24
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
20
25
|
export default _default;
|
|
21
26
|
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./index2.vue.mjs";
|
|
2
2
|
import './index.css';/* empty css */
|
|
3
|
-
import
|
|
4
|
-
const m = /* @__PURE__ */
|
|
3
|
+
import t from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
+
const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-4a47d884"]]);
|
|
5
5
|
export {
|
|
6
6
|
m as default
|
|
7
7
|
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { defineComponent as p, computed as g, openBlock as n, createElementBlock as i, normalizeStyle as u, createElementVNode as a, renderSlot as o, createTextVNode as l, toDisplayString as r, createCommentVNode as d } from "vue";
|
|
2
|
+
const m = {
|
|
3
|
+
key: 0,
|
|
4
|
+
class: "zl-page-container__header"
|
|
5
|
+
}, _ = { class: "zl-page-container__main" }, v = { class: "zl-page-container__title" }, $ = {
|
|
6
|
+
key: 0,
|
|
7
|
+
class: "zl-page-container__description"
|
|
8
|
+
}, h = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "zl-page-container__extra"
|
|
11
|
+
}, y = { class: "zl-page-container__content" }, k = /* @__PURE__ */ p({
|
|
12
|
+
name: "ZlPageContainer",
|
|
13
|
+
__name: "index",
|
|
14
|
+
props: {
|
|
15
|
+
title: {},
|
|
16
|
+
description: {},
|
|
17
|
+
padding: { default: 16 }
|
|
18
|
+
},
|
|
19
|
+
setup(t) {
|
|
20
|
+
const s = t, c = g(() => ({
|
|
21
|
+
padding: typeof s.padding == "number" ? `${s.padding}px` : s.padding
|
|
22
|
+
}));
|
|
23
|
+
return (e, z) => (n(), i("div", {
|
|
24
|
+
class: "zl-page-container",
|
|
25
|
+
style: u(c.value)
|
|
26
|
+
}, [
|
|
27
|
+
t.title || t.description || e.$slots.title || e.$slots.description || e.$slots.extra ? (n(), i("div", m, [
|
|
28
|
+
a("div", _, [
|
|
29
|
+
a("div", v, [
|
|
30
|
+
o(e.$slots, "title", {}, () => [
|
|
31
|
+
l(r(t.title), 1)
|
|
32
|
+
], !0)
|
|
33
|
+
]),
|
|
34
|
+
t.description || e.$slots.description ? (n(), i("div", $, [
|
|
35
|
+
o(e.$slots, "description", {}, () => [
|
|
36
|
+
l(r(t.description), 1)
|
|
37
|
+
], !0)
|
|
38
|
+
])) : d("", !0)
|
|
39
|
+
]),
|
|
40
|
+
e.$slots.extra ? (n(), i("div", h, [
|
|
41
|
+
o(e.$slots, "extra", {}, void 0, !0)
|
|
42
|
+
])) : d("", !0)
|
|
43
|
+
])) : d("", !0),
|
|
44
|
+
a("div", y, [
|
|
45
|
+
o(e.$slots, "content", {}, void 0, !0)
|
|
46
|
+
])
|
|
47
|
+
], 4));
|
|
48
|
+
}
|
|
49
|
+
});
|
|
50
|
+
export {
|
|
51
|
+
k as default
|
|
52
|
+
};
|
|
53
|
+
//# sourceMappingURL=index2.vue.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.zl-step[data-v-0fadba95]{width:100%}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
export interface StepItem {
|
|
2
|
+
/** 步骤标题;可用 title 插槽覆盖 */
|
|
3
|
+
title?: string;
|
|
4
|
+
/** 步骤描述;可用 description 插槽覆盖 */
|
|
5
|
+
description?: string;
|
|
6
|
+
/** 步骤图标(图标名字符串,经 ZlIcon 渲染);可用 icon 插槽覆盖 */
|
|
7
|
+
icon?: string;
|
|
8
|
+
/** 该步骤状态;缺省由 current 自动推算(finish/process/wait),显式指定则覆盖 */
|
|
9
|
+
status?: 'wait' | 'process' | 'finish' | 'error' | 'success';
|
|
10
|
+
/** 是否禁用该步骤 */
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
/** 透传给该步骤的其它属性 */
|
|
13
|
+
[key: string]: any;
|
|
14
|
+
}
|
|
15
|
+
type __VLS_Props = {
|
|
16
|
+
/** 步骤列表,决定步骤数量、顺序与内容 */
|
|
17
|
+
steps?: StepItem[];
|
|
18
|
+
/** 当前步骤下标(从 0 开始) */
|
|
19
|
+
current?: number;
|
|
20
|
+
/** 排列方向:横向或纵向 */
|
|
21
|
+
direction?: 'horizontal' | 'vertical';
|
|
22
|
+
/** 当前步骤呈现的状态 */
|
|
23
|
+
processStatus?: 'process' | 'finish' | 'error';
|
|
24
|
+
/** 已完成步骤呈现的状态 */
|
|
25
|
+
finishStatus?: 'wait' | 'process' | 'finish' | 'error' | 'success';
|
|
26
|
+
/** 是否展示各步骤描述 */
|
|
27
|
+
showDescription?: boolean;
|
|
28
|
+
/** 各步骤是否居中对齐(图标与标题/描述水平居中,默认居中) */
|
|
29
|
+
alignCenter?: boolean;
|
|
30
|
+
/** 步骤条间距,数字为 px、字符串支持百分比;缺省自动均分 */
|
|
31
|
+
space?: number | string;
|
|
32
|
+
/** 标题字号(px) */
|
|
33
|
+
titleFontSize?: number;
|
|
34
|
+
/** 描述字号(px) */
|
|
35
|
+
descriptionFontSize?: number;
|
|
36
|
+
};
|
|
37
|
+
declare function __VLS_template(): {
|
|
38
|
+
attrs: Partial<{}>;
|
|
39
|
+
slots: {
|
|
40
|
+
title?(_: {
|
|
41
|
+
item: StepItem;
|
|
42
|
+
index: number;
|
|
43
|
+
}): any;
|
|
44
|
+
description?(_: {
|
|
45
|
+
item: StepItem;
|
|
46
|
+
index: number;
|
|
47
|
+
}): any;
|
|
48
|
+
icon?(_: {
|
|
49
|
+
item: StepItem;
|
|
50
|
+
index: number;
|
|
51
|
+
}): any;
|
|
52
|
+
};
|
|
53
|
+
refs: {};
|
|
54
|
+
rootEl: any;
|
|
55
|
+
};
|
|
56
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
57
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
58
|
+
steps: StepItem[];
|
|
59
|
+
current: number;
|
|
60
|
+
direction: "horizontal" | "vertical";
|
|
61
|
+
processStatus: "process" | "finish" | "error";
|
|
62
|
+
finishStatus: "wait" | "process" | "finish" | "error" | "success";
|
|
63
|
+
showDescription: boolean;
|
|
64
|
+
alignCenter: boolean;
|
|
65
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
66
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
67
|
+
export default _default;
|
|
68
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
69
|
+
new (): {
|
|
70
|
+
$slots: S;
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
//# sourceMappingURL=index.vue.d.ts.map
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import o from "./index2.vue.mjs";
|
|
2
|
+
import './index.css';/* empty css */
|
|
3
|
+
import t from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
+
const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-0fadba95"]]);
|
|
5
|
+
export {
|
|
6
|
+
f as default
|
|
7
|
+
};
|
|
8
|
+
//# sourceMappingURL=index.vue.mjs.map
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import { defineComponent as k, resolveComponent as c, openBlock as a, createBlock as u, withCtx as o, createElementBlock as v, Fragment as y, renderList as g, createSlots as $, renderSlot as l, createTextVNode as d, toDisplayString as f, createVNode as B } from "vue";
|
|
2
|
+
const F = /* @__PURE__ */ k({
|
|
3
|
+
name: "ZlStep",
|
|
4
|
+
__name: "index",
|
|
5
|
+
props: {
|
|
6
|
+
steps: { default: () => [] },
|
|
7
|
+
current: { default: 0 },
|
|
8
|
+
direction: { default: "horizontal" },
|
|
9
|
+
processStatus: { default: "process" },
|
|
10
|
+
finishStatus: { default: "finish" },
|
|
11
|
+
showDescription: { type: Boolean, default: !0 },
|
|
12
|
+
alignCenter: { type: Boolean, default: !0 },
|
|
13
|
+
space: {},
|
|
14
|
+
titleFontSize: {},
|
|
15
|
+
descriptionFontSize: {}
|
|
16
|
+
},
|
|
17
|
+
setup(t) {
|
|
18
|
+
const i = t;
|
|
19
|
+
function p(s, r) {
|
|
20
|
+
return s.status ? s.status : r < i.current ? i.finishStatus : r === i.current ? i.processStatus : "wait";
|
|
21
|
+
}
|
|
22
|
+
return (s, r) => {
|
|
23
|
+
const S = c("zl-icon"), z = c("el-step"), h = c("el-steps");
|
|
24
|
+
return a(), u(h, {
|
|
25
|
+
class: "zl-step",
|
|
26
|
+
active: t.current,
|
|
27
|
+
direction: t.direction,
|
|
28
|
+
"process-status": t.processStatus,
|
|
29
|
+
"finish-status": t.finishStatus,
|
|
30
|
+
"align-center": t.alignCenter,
|
|
31
|
+
space: t.space,
|
|
32
|
+
"title-font-size": t.titleFontSize,
|
|
33
|
+
"description-font-size": t.descriptionFontSize
|
|
34
|
+
}, {
|
|
35
|
+
default: o(() => [
|
|
36
|
+
(a(!0), v(y, null, g(t.steps, (e, n) => (a(), u(z, {
|
|
37
|
+
key: n,
|
|
38
|
+
title: e.title,
|
|
39
|
+
description: t.showDescription ? e.description : void 0,
|
|
40
|
+
status: p(e, n),
|
|
41
|
+
disabled: e.disabled
|
|
42
|
+
}, $({ _: 2 }, [
|
|
43
|
+
s.$slots.title ? {
|
|
44
|
+
name: "title",
|
|
45
|
+
fn: o(() => [
|
|
46
|
+
l(s.$slots, "title", {
|
|
47
|
+
item: e,
|
|
48
|
+
index: n
|
|
49
|
+
}, () => [
|
|
50
|
+
d(f(e.title), 1)
|
|
51
|
+
], !0)
|
|
52
|
+
]),
|
|
53
|
+
key: "0"
|
|
54
|
+
} : void 0,
|
|
55
|
+
s.$slots.description ? {
|
|
56
|
+
name: "description",
|
|
57
|
+
fn: o(() => [
|
|
58
|
+
l(s.$slots, "description", {
|
|
59
|
+
item: e,
|
|
60
|
+
index: n
|
|
61
|
+
}, () => [
|
|
62
|
+
d(f(e.description), 1)
|
|
63
|
+
], !0)
|
|
64
|
+
]),
|
|
65
|
+
key: "1"
|
|
66
|
+
} : void 0,
|
|
67
|
+
s.$slots.icon || e.icon ? {
|
|
68
|
+
name: "icon",
|
|
69
|
+
fn: o(() => [
|
|
70
|
+
l(s.$slots, "icon", {
|
|
71
|
+
item: e,
|
|
72
|
+
index: n
|
|
73
|
+
}, () => [
|
|
74
|
+
B(S, {
|
|
75
|
+
icon: e.icon
|
|
76
|
+
}, null, 8, ["icon"])
|
|
77
|
+
], !0)
|
|
78
|
+
]),
|
|
79
|
+
key: "2"
|
|
80
|
+
} : void 0
|
|
81
|
+
]), 1032, ["title", "description", "status", "disabled"]))), 128))
|
|
82
|
+
]),
|
|
83
|
+
_: 3
|
|
84
|
+
}, 8, ["active", "direction", "process-status", "finish-status", "align-center", "space", "title-font-size", "description-font-size"]);
|
|
85
|
+
};
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
export {
|
|
89
|
+
F as default
|
|
90
|
+
};
|
|
91
|
+
//# sourceMappingURL=index2.vue.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zl-tree-select[data-v-
|
|
1
|
+
.zl-tree-select[data-v-e77adcc8]{width:100%}.zl-tree-select__all[data-v-e77adcc8]{padding:4px 0 8px}.zl-tree-select[data-v-e77adcc8] .el-tree-select .el-tree-node__label{font-size:12px}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
type __VLS_Props = {
|
|
2
2
|
/** 树数据 */
|
|
3
3
|
originTreeData: any[];
|
|
4
|
-
/** "全部"
|
|
4
|
+
/** "全部"节点名(启用全选控制条,仅多选模式生效) */
|
|
5
5
|
allName?: string;
|
|
6
6
|
/** 返回 {label, value} 对象数组(缺省返回键值数组) */
|
|
7
7
|
labelInValue?: boolean;
|
|
@@ -11,8 +11,21 @@ type __VLS_Props = {
|
|
|
11
11
|
title?: string;
|
|
12
12
|
children?: string;
|
|
13
13
|
};
|
|
14
|
-
/**
|
|
14
|
+
/** 父子不关联(true 时取消级联:勾选/单选互不影响) */
|
|
15
15
|
treeCheckStrictly?: boolean;
|
|
16
|
+
/** 是否多选(默认 true);true 时节点前渲染复选框并父子级联,false 时仅叶子节点可单选 */
|
|
17
|
+
multiple?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* 动态控制不可选项:
|
|
20
|
+
* - 布尔值:整体禁用下拉控件
|
|
21
|
+
* - 键数组:禁用这些 key 对应的节点
|
|
22
|
+
* - 函数:`(data) => boolean` 返回 true 的节点禁用
|
|
23
|
+
*/
|
|
24
|
+
disabled?: boolean | Array<string | number> | ((data: any) => boolean);
|
|
25
|
+
/** 选中后是否在输入框 / 标签里显示完整父级路径(默认 true,体现级联关系) */
|
|
26
|
+
showPath?: boolean;
|
|
27
|
+
/** 路径分隔符(showPath 生效时用) */
|
|
28
|
+
pathSeparator?: string;
|
|
16
29
|
};
|
|
17
30
|
type __VLS_PublicProps = {
|
|
18
31
|
modelValue?: any;
|
|
@@ -22,6 +35,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
|
|
|
22
35
|
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
23
36
|
"onUpdate:modelValue"?: ((value: any) => any) | undefined;
|
|
24
37
|
}>, {
|
|
38
|
+
multiple: boolean;
|
|
39
|
+
disabled: boolean | Array<string | number> | ((data: any) => boolean);
|
|
25
40
|
fieldNames: {
|
|
26
41
|
key?: string;
|
|
27
42
|
title?: string;
|
|
@@ -29,6 +44,10 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
|
|
|
29
44
|
};
|
|
30
45
|
labelInValue: boolean;
|
|
31
46
|
treeCheckStrictly: boolean;
|
|
32
|
-
|
|
47
|
+
showPath: boolean;
|
|
48
|
+
pathSeparator: string;
|
|
49
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
50
|
+
treeSelectRef: unknown;
|
|
51
|
+
}, any>;
|
|
33
52
|
export default _default;
|
|
34
53
|
//# sourceMappingURL=index.vue.d.ts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import e from "./index2.vue.mjs";
|
|
2
2
|
import './index.css';/* empty css */
|
|
3
3
|
import o from "../../_virtual/_plugin-vue_export-helper.mjs";
|
|
4
|
-
const
|
|
4
|
+
const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-e77adcc8"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
a as default
|
|
7
7
|
};
|
|
8
8
|
//# sourceMappingURL=index.vue.mjs.map
|
|
@@ -1,75 +1,136 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
const
|
|
1
|
+
import { defineComponent as R, useModel as H, ref as L, computed as a, resolveComponent as C, openBlock as w, createElementBlock as B, createVNode as x, withCtx as D, createTextVNode as K, toDisplayString as T, createCommentVNode as O, mergeProps as U, mergeModels as Z } from "vue";
|
|
2
|
+
const _ = { class: "zl-tree-select" }, j = {
|
|
3
3
|
key: 0,
|
|
4
4
|
class: "zl-tree-select__all"
|
|
5
|
-
},
|
|
5
|
+
}, G = /* @__PURE__ */ R({
|
|
6
6
|
name: "ZlTreeSelect",
|
|
7
7
|
inheritAttrs: !1,
|
|
8
8
|
__name: "index",
|
|
9
|
-
props: /* @__PURE__ */
|
|
9
|
+
props: /* @__PURE__ */ Z({
|
|
10
10
|
originTreeData: {},
|
|
11
11
|
allName: {},
|
|
12
12
|
labelInValue: { type: Boolean, default: !1 },
|
|
13
13
|
fieldNames: { default: () => ({ key: "key", title: "title", children: "children" }) },
|
|
14
|
-
treeCheckStrictly: { type: Boolean, default: !1 }
|
|
14
|
+
treeCheckStrictly: { type: Boolean, default: !1 },
|
|
15
|
+
multiple: { type: Boolean, default: !0 },
|
|
16
|
+
disabled: { type: [Boolean, Array, Function], default: void 0 },
|
|
17
|
+
showPath: { type: Boolean, default: !0 },
|
|
18
|
+
pathSeparator: { default: " / " }
|
|
15
19
|
}, {
|
|
16
20
|
modelValue: {},
|
|
17
21
|
modelModifiers: {}
|
|
18
22
|
}),
|
|
19
23
|
emits: ["update:modelValue"],
|
|
20
24
|
setup(n) {
|
|
21
|
-
const t = n,
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
const t = n, u = H(n, "modelValue"), k = L(), i = a(() => t.fieldNames.key ?? "key"), c = a(() => t.fieldNames.title ?? "title"), f = a(() => t.fieldNames.children ?? "children");
|
|
26
|
+
function b(e) {
|
|
27
|
+
const l = e?.[f.value];
|
|
28
|
+
return !Array.isArray(l) || l.length === 0;
|
|
29
|
+
}
|
|
30
|
+
const I = a(() => typeof t.disabled == "boolean" ? t.disabled : void 0);
|
|
31
|
+
function F(e) {
|
|
32
|
+
if (!t.multiple && !b(e)) return !0;
|
|
33
|
+
const l = t.disabled;
|
|
34
|
+
return Array.isArray(l) ? l.includes(e[i.value]) : typeof l == "function" ? !!l(e) : !1;
|
|
35
|
+
}
|
|
36
|
+
const M = a(() => {
|
|
37
|
+
const e = /* @__PURE__ */ new Map(), l = t.pathSeparator, r = (s, o) => {
|
|
38
|
+
(s || []).forEach((y) => {
|
|
39
|
+
const N = String(y[c.value] ?? ""), V = o ? `${o}${l}${N}` : N;
|
|
40
|
+
e.set(y[i.value], V);
|
|
41
|
+
const p = y[f.value];
|
|
42
|
+
Array.isArray(p) && p.length > 0 && r(p, V);
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
return r(t.originTreeData, ""), e;
|
|
46
|
+
}), P = a(() => ({
|
|
47
|
+
children: f.value,
|
|
48
|
+
label: (e) => t.showPath ? M.value.get(e[i.value]) ?? e[c.value] : e[c.value],
|
|
49
|
+
disabled: (e) => F(e)
|
|
50
|
+
})), m = a(() => {
|
|
51
|
+
const e = [], l = (r) => {
|
|
52
|
+
r.forEach((s) => {
|
|
53
|
+
e.push(s);
|
|
54
|
+
const o = s[f.value];
|
|
55
|
+
Array.isArray(o) && o.length > 0 && l(o);
|
|
30
56
|
});
|
|
31
57
|
};
|
|
32
58
|
return l(t.originTreeData), e;
|
|
33
|
-
}),
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
59
|
+
}), g = a(() => m.value.filter(b).map((e) => e[i.value])), h = a(
|
|
60
|
+
() => t.multiple && !t.treeCheckStrictly ? g.value : m.value.map((e) => e[i.value])
|
|
61
|
+
), d = a(() => {
|
|
62
|
+
const e = u.value, l = (r) => t.labelInValue ? r?.value : r;
|
|
63
|
+
return Array.isArray(e) ? e.map(l) : e == null || e === "" ? [] : [l(e)];
|
|
64
|
+
}), $ = a(() => {
|
|
65
|
+
if (!t.multiple) return d.value[0];
|
|
66
|
+
if (t.treeCheckStrictly) return d.value;
|
|
67
|
+
const e = new Set(g.value);
|
|
68
|
+
return d.value.filter((l) => e.has(l));
|
|
69
|
+
}), A = a(() => {
|
|
70
|
+
const e = new Set(d.value);
|
|
71
|
+
return h.value.length > 0 && h.value.every((l) => e.has(l));
|
|
72
|
+
});
|
|
73
|
+
function S(e) {
|
|
74
|
+
return m.value.find((l) => l[i.value] === e)?.[c.value];
|
|
75
|
+
}
|
|
76
|
+
function v(e) {
|
|
77
|
+
t.labelInValue ? u.value = e.map((l) => ({ label: S(l), value: l })) : u.value = e;
|
|
78
|
+
}
|
|
79
|
+
function E(e) {
|
|
80
|
+
if (t.multiple) {
|
|
81
|
+
const l = Array.isArray(e) ? e : e == null ? [] : [e];
|
|
82
|
+
if (t.treeCheckStrictly)
|
|
83
|
+
v(l);
|
|
84
|
+
else {
|
|
85
|
+
const r = k.value?.getHalfCheckedKeys?.() ?? [];
|
|
86
|
+
v([...l, ...r]);
|
|
87
|
+
}
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
e == null || e === "" ? u.value = null : t.labelInValue ? u.value = { label: S(e), value: e } : u.value = e;
|
|
39
91
|
}
|
|
40
|
-
function
|
|
41
|
-
e ?
|
|
92
|
+
function z(e) {
|
|
93
|
+
e ? v(h.value) : u.value = [];
|
|
42
94
|
}
|
|
43
95
|
return (e, l) => {
|
|
44
|
-
const
|
|
45
|
-
return
|
|
46
|
-
n.allName ? (
|
|
47
|
-
|
|
48
|
-
"model-value":
|
|
49
|
-
indeterminate:
|
|
50
|
-
onChange:
|
|
96
|
+
const r = C("el-checkbox"), s = C("el-tree-select");
|
|
97
|
+
return w(), B("div", _, [
|
|
98
|
+
n.allName && n.multiple ? (w(), B("div", j, [
|
|
99
|
+
x(r, {
|
|
100
|
+
"model-value": A.value,
|
|
101
|
+
indeterminate: d.value.length > 0 && !A.value,
|
|
102
|
+
onChange: z
|
|
51
103
|
}, {
|
|
52
|
-
default:
|
|
53
|
-
|
|
104
|
+
default: D(() => [
|
|
105
|
+
K(T(n.allName), 1)
|
|
54
106
|
]),
|
|
55
107
|
_: 1
|
|
56
108
|
}, 8, ["model-value", "indeterminate"])
|
|
57
|
-
])) :
|
|
58
|
-
|
|
59
|
-
"
|
|
60
|
-
|
|
61
|
-
"
|
|
62
|
-
|
|
109
|
+
])) : O("", !0),
|
|
110
|
+
x(s, U({
|
|
111
|
+
ref_key: "treeSelectRef",
|
|
112
|
+
ref: k,
|
|
113
|
+
"model-value": $.value,
|
|
114
|
+
multiple: n.multiple,
|
|
115
|
+
"show-checkbox": n.multiple,
|
|
116
|
+
"collapse-tags": n.multiple,
|
|
117
|
+
"collapse-tags-tooltip": n.multiple,
|
|
63
118
|
"check-strictly": n.treeCheckStrictly,
|
|
119
|
+
disabled: I.value,
|
|
64
120
|
data: n.originTreeData,
|
|
65
|
-
props:
|
|
121
|
+
props: P.value,
|
|
66
122
|
"node-key": i.value
|
|
67
|
-
}, e.$attrs, { "onUpdate:modelValue":
|
|
123
|
+
}, e.$attrs, { "onUpdate:modelValue": E }), {
|
|
124
|
+
default: D(({ data: o }) => [
|
|
125
|
+
K(T(o[c.value]), 1)
|
|
126
|
+
]),
|
|
127
|
+
_: 1
|
|
128
|
+
}, 16, ["model-value", "multiple", "show-checkbox", "collapse-tags", "collapse-tags-tooltip", "check-strictly", "disabled", "data", "props", "node-key"])
|
|
68
129
|
]);
|
|
69
130
|
};
|
|
70
131
|
}
|
|
71
132
|
});
|
|
72
133
|
export {
|
|
73
|
-
|
|
134
|
+
G as default
|
|
74
135
|
};
|
|
75
136
|
//# sourceMappingURL=index2.vue.mjs.map
|
package/dist/index.d.ts
CHANGED
|
@@ -35,7 +35,7 @@ export { default as ZlIconHover } from './components/ZlIconHover/index.vue';
|
|
|
35
35
|
export { default as ZlIconLabel } from './components/ZlIconLabel/index.vue';
|
|
36
36
|
export { default as ZlCornerTag } from './components/ZlTag/ZlCornerTag.vue';
|
|
37
37
|
export { default as ZlLayoutSwitch } from './components/ZlLayoutSwitch/index.vue';
|
|
38
|
-
export { default as
|
|
38
|
+
export { default as ZlPageContainer } from './components/ZlPageContainer/index.vue';
|
|
39
39
|
export { default as ZlPagination } from './components/ZlPagination/index.vue';
|
|
40
40
|
export { default as ZlPermission } from './components/ZlPermission/index.vue';
|
|
41
41
|
export { default as ZlPopconfirm } from './components/ZlPopconfirm/index.vue';
|
|
@@ -45,6 +45,7 @@ export { default as ZlSearchTable } from './components/ZlSearchTable/index.vue';
|
|
|
45
45
|
export { default as ZlSection } from './components/ZlSection/index.vue';
|
|
46
46
|
export { default as ZlSorter } from './components/ZlSorter/index.vue';
|
|
47
47
|
export { default as ZlSorterList } from './components/ZlSorter/ZlSorterList.vue';
|
|
48
|
+
export { default as ZlStep } from './components/ZlStep/index.vue';
|
|
48
49
|
export { default as ZlSwitch } from './components/ZlSwitch/index.vue';
|
|
49
50
|
export { default as ZlTable } from './components/ZlTable/index.vue';
|
|
50
51
|
export { default as ZlTabs } from './components/ZlTabs/index.vue';
|
|
@@ -59,6 +60,7 @@ export { usePagination } from './components/ZlPagination/usePagination';
|
|
|
59
60
|
export { useTablePagination } from './components/ZlTable/useTablePagination';
|
|
60
61
|
export { usePermission, usePermissionProvider } from './components/ZlPermission/usePermission';
|
|
61
62
|
export type { MenuItem } from './components/ZlAppMenu/AppMenu.vue';
|
|
63
|
+
export type { StepItem } from './components/ZlStep/index.vue';
|
|
62
64
|
export type { ActionItem, FormItem, SearchItem, TableColumn } from './types';
|
|
63
65
|
export type { IGridItem } from './components/ZlGrid/types';
|
|
64
66
|
export type { IComponent, IComponentSlot, VForSlot, VModelSlot, ComponentOrSlot, } from './components/ZlDynamicComponent/types';
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import i from "./components/ZlAction/index.vue.mjs";
|
|
2
|
-
import
|
|
2
|
+
import t from "./components/ZlAction/List.vue.mjs";
|
|
3
3
|
import './components/ZlTree/index.css';import './components/ZlTag/index.css';import './components/ZlTabs/index.css';import './components/ZlTable/index.css';import './components/ZlSwitch/index.css';import './components/ZlSection/index.css';import './components/ZlSearchTable/index.css';import './components/ZlSearch/index.css';import './components/ZlRadioTag/index.css';import './components/ZlPopconfirm/index.css';import './components/ZlPdfViewer/index.css';import './components/ZlLogin/index.css';import './components/ZlIconLabel/index.css';import './components/ZlGrid/index.css';import './components/ZlForm/index.css';import './components/ZlDrawer/index.css';import './components/ZlDialog/index.css';import './components/ZlDescription/index.css';import './components/ZlTag/ZlCornerTag.css';import './components/ZlCheckboxTag/index.css';import './components/ZlCard/index.css';import './components/ZlCardPage/index.css';import './components/ZlAppSlogan/index.css';import './components/ZlAppMenu/AppMenu.css';import './components/ZlAction/List.css';/* empty css */
|
|
4
|
-
import
|
|
4
|
+
import a from "./components/ZlAddSub/index.vue.mjs";
|
|
5
5
|
import l from "./components/ZlAppLayout/index.vue.mjs";
|
|
6
6
|
import p from "./components/ZlAppMenu/AppMenu.vue.mjs";
|
|
7
7
|
/* empty css */
|
|
@@ -25,13 +25,13 @@ import T from "./components/ZlDescription/index.vue.mjs";
|
|
|
25
25
|
import u from "./components/ZlDialog/index.vue.mjs";
|
|
26
26
|
/* empty css */
|
|
27
27
|
import P from "./components/ZlDictTag/index.vue.mjs";
|
|
28
|
-
import
|
|
28
|
+
import C from "./components/ZlDrawer/index.vue.mjs";
|
|
29
29
|
/* empty css */
|
|
30
|
-
import
|
|
31
|
-
import
|
|
32
|
-
import
|
|
30
|
+
import S from "./components/ZlDynamicComponent/index.vue.mjs";
|
|
31
|
+
import b from "./components/ZlEmpty/index.vue.mjs";
|
|
32
|
+
import h from "./components/ZlForm/index.vue.mjs";
|
|
33
33
|
/* empty css */
|
|
34
|
-
import
|
|
34
|
+
import A from "./components/ZlForm/ZlFormChild.vue.mjs";
|
|
35
35
|
import x from "./components/ZlGrid/ZlGridItem.vue.mjs";
|
|
36
36
|
import I from "./components/ZlGrid/index.vue.mjs";
|
|
37
37
|
/* empty css */
|
|
@@ -45,11 +45,11 @@ import F from "./components/ZlLayoutSwitch/index.vue.mjs";
|
|
|
45
45
|
import G from "./components/ZlLogin/index.vue.mjs";
|
|
46
46
|
/* empty css */
|
|
47
47
|
import M from "./components/ZlLogin/components/LoginForm.vue.mjs";
|
|
48
|
-
import k from "./components/
|
|
48
|
+
import k from "./components/ZlPageContainer/index.vue.mjs";
|
|
49
49
|
import z from "./components/ZlPagination/index.vue.mjs";
|
|
50
|
-
import
|
|
50
|
+
import E from "./components/ZlPdfViewer/index.vue.mjs";
|
|
51
51
|
/* empty css */
|
|
52
|
-
import
|
|
52
|
+
import H from "./components/ZlPermission/index.vue.mjs";
|
|
53
53
|
import j from "./components/ZlPopconfirm/index.vue.mjs";
|
|
54
54
|
/* empty css */
|
|
55
55
|
import R from "./components/ZlRadioTag/index.vue.mjs";
|
|
@@ -62,32 +62,33 @@ import O from "./components/ZlSection/index.vue.mjs";
|
|
|
62
62
|
/* empty css */
|
|
63
63
|
import U from "./components/ZlSorter/index.vue.mjs";
|
|
64
64
|
import B from "./components/ZlSorter/ZlSorterList.vue.mjs";
|
|
65
|
-
import J from "./components/
|
|
65
|
+
import J from "./components/ZlStep/index.vue.mjs";
|
|
66
|
+
import K from "./components/ZlSwitch/index.vue.mjs";
|
|
66
67
|
/* empty css */
|
|
67
|
-
import
|
|
68
|
+
import N from "./components/ZlTable/index.vue.mjs";
|
|
68
69
|
/* empty css */
|
|
69
|
-
import
|
|
70
|
+
import Q from "./components/ZlTabs/index.vue.mjs";
|
|
70
71
|
/* empty css */
|
|
71
|
-
import
|
|
72
|
+
import W from "./components/ZlTag/index.vue.mjs";
|
|
72
73
|
/* empty css */
|
|
73
|
-
import
|
|
74
|
-
import
|
|
75
|
-
import
|
|
74
|
+
import X from "./components/ZlText/index.vue.mjs";
|
|
75
|
+
import Y from "./components/ZlTitle/index.vue.mjs";
|
|
76
|
+
import oo from "./components/ZlTree/index.vue.mjs";
|
|
76
77
|
/* empty css */
|
|
77
|
-
import
|
|
78
|
-
import
|
|
79
|
-
import { presetIconifyIcon as
|
|
80
|
-
import { usePagination as
|
|
81
|
-
import { useTablePagination as
|
|
82
|
-
import { usePermission as
|
|
83
|
-
import { createZlI18n as
|
|
84
|
-
import { default as
|
|
85
|
-
import { zlMessages as
|
|
86
|
-
import { default as
|
|
87
|
-
const
|
|
78
|
+
import ro from "./components/ZlTreeSelect/index.vue.mjs";
|
|
79
|
+
import mo from "./components/ZlUpload/index.vue.mjs";
|
|
80
|
+
import { presetIconifyIcon as Gr } from "./components/ZlIcon/presetIconifyIcon.mjs";
|
|
81
|
+
import { usePagination as kr } from "./components/ZlPagination/usePagination.mjs";
|
|
82
|
+
import { useTablePagination as Er } from "./components/ZlTable/useTablePagination.mjs";
|
|
83
|
+
import { usePermission as jr, usePermissionProvider as Rr } from "./components/ZlPermission/usePermission.mjs";
|
|
84
|
+
import { createZlI18n as qr } from "./locales/createZlI18n.mjs";
|
|
85
|
+
import { default as Ur } from "./locales/en.mjs";
|
|
86
|
+
import { zlMessages as Jr } from "./locales/messages.mjs";
|
|
87
|
+
import { default as Nr } from "./locales/zh-cn.mjs";
|
|
88
|
+
const io = {
|
|
88
89
|
ZlAction: i,
|
|
89
|
-
ZlActionList:
|
|
90
|
-
ZlAddSub:
|
|
90
|
+
ZlActionList: t,
|
|
91
|
+
ZlAddSub: a,
|
|
91
92
|
ZlAppLayout: l,
|
|
92
93
|
ZlAppMenu: p,
|
|
93
94
|
ZlAppSlogan: f,
|
|
@@ -102,11 +103,11 @@ const mo = {
|
|
|
102
103
|
ZlDescription: T,
|
|
103
104
|
ZlDialog: u,
|
|
104
105
|
ZlDictTag: P,
|
|
105
|
-
ZlDrawer:
|
|
106
|
-
ZlDynamicComponent:
|
|
107
|
-
ZlEmpty:
|
|
108
|
-
ZlForm:
|
|
109
|
-
ZlFormChild:
|
|
106
|
+
ZlDrawer: C,
|
|
107
|
+
ZlDynamicComponent: S,
|
|
108
|
+
ZlEmpty: b,
|
|
109
|
+
ZlForm: h,
|
|
110
|
+
ZlFormChild: A,
|
|
110
111
|
ZlGridItem: x,
|
|
111
112
|
ZlGrid: I,
|
|
112
113
|
ZlHorizontalTable: L,
|
|
@@ -118,10 +119,10 @@ const mo = {
|
|
|
118
119
|
ZlLayoutSwitch: F,
|
|
119
120
|
ZlLogin: G,
|
|
120
121
|
ZlLoginForm: M,
|
|
121
|
-
|
|
122
|
+
ZlPageContainer: k,
|
|
122
123
|
ZlPagination: z,
|
|
123
|
-
ZlPdfViewer:
|
|
124
|
-
ZlPermission:
|
|
124
|
+
ZlPdfViewer: E,
|
|
125
|
+
ZlPermission: H,
|
|
125
126
|
ZlPopconfirm: j,
|
|
126
127
|
ZlRadioTag: R,
|
|
127
128
|
ZlSearch: V,
|
|
@@ -129,26 +130,27 @@ const mo = {
|
|
|
129
130
|
ZlSection: O,
|
|
130
131
|
ZlSorter: U,
|
|
131
132
|
ZlSorterList: B,
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
133
|
+
ZlStep: J,
|
|
134
|
+
ZlSwitch: K,
|
|
135
|
+
ZlTable: N,
|
|
136
|
+
ZlTabs: Q,
|
|
137
|
+
ZlTag: W,
|
|
138
|
+
ZlText: X,
|
|
139
|
+
ZlTitle: Y,
|
|
140
|
+
ZlUpload: mo,
|
|
141
|
+
ZlTree: oo,
|
|
142
|
+
ZlTreeSelect: ro
|
|
141
143
|
};
|
|
142
|
-
function
|
|
143
|
-
Object.entries(
|
|
144
|
+
function to(o) {
|
|
145
|
+
Object.entries(io).forEach(([r, m]) => {
|
|
144
146
|
o.component(r, m);
|
|
145
147
|
});
|
|
146
148
|
}
|
|
147
|
-
const
|
|
149
|
+
const wr = { install: to };
|
|
148
150
|
export {
|
|
149
151
|
i as ZlAction,
|
|
150
|
-
|
|
151
|
-
|
|
152
|
+
t as ZlActionList,
|
|
153
|
+
a as ZlAddSub,
|
|
152
154
|
l as ZlAppLayout,
|
|
153
155
|
p as ZlAppMenu,
|
|
154
156
|
f as ZlAppSlogan,
|
|
@@ -164,11 +166,11 @@ export {
|
|
|
164
166
|
T as ZlDescription,
|
|
165
167
|
u as ZlDialog,
|
|
166
168
|
P as ZlDictTag,
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
169
|
+
C as ZlDrawer,
|
|
170
|
+
S as ZlDynamicComponent,
|
|
171
|
+
b as ZlEmpty,
|
|
172
|
+
h as ZlForm,
|
|
173
|
+
A as ZlFormChild,
|
|
172
174
|
I as ZlGrid,
|
|
173
175
|
x as ZlGridItem,
|
|
174
176
|
L as ZlHorizontalTable,
|
|
@@ -179,10 +181,10 @@ export {
|
|
|
179
181
|
F as ZlLayoutSwitch,
|
|
180
182
|
G as ZlLogin,
|
|
181
183
|
M as ZlLoginForm,
|
|
182
|
-
k as
|
|
184
|
+
k as ZlPageContainer,
|
|
183
185
|
z as ZlPagination,
|
|
184
|
-
|
|
185
|
-
|
|
186
|
+
E as ZlPdfViewer,
|
|
187
|
+
H as ZlPermission,
|
|
186
188
|
j as ZlPopconfirm,
|
|
187
189
|
R as ZlRadioTag,
|
|
188
190
|
V as ZlSearch,
|
|
@@ -190,25 +192,26 @@ export {
|
|
|
190
192
|
O as ZlSection,
|
|
191
193
|
U as ZlSorter,
|
|
192
194
|
B as ZlSorterList,
|
|
193
|
-
J as
|
|
194
|
-
K as
|
|
195
|
-
N as
|
|
196
|
-
Q as
|
|
197
|
-
W as
|
|
198
|
-
X as
|
|
199
|
-
Y as
|
|
200
|
-
oo as
|
|
201
|
-
ro as
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
Gr as
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
Ur as
|
|
212
|
-
Jr as
|
|
195
|
+
J as ZlStep,
|
|
196
|
+
K as ZlSwitch,
|
|
197
|
+
N as ZlTable,
|
|
198
|
+
Q as ZlTabs,
|
|
199
|
+
W as ZlTag,
|
|
200
|
+
X as ZlText,
|
|
201
|
+
Y as ZlTitle,
|
|
202
|
+
oo as ZlTree,
|
|
203
|
+
ro as ZlTreeSelect,
|
|
204
|
+
mo as ZlUpload,
|
|
205
|
+
qr as createZlI18n,
|
|
206
|
+
wr as default,
|
|
207
|
+
to as install,
|
|
208
|
+
Gr as presetIconifyIcon,
|
|
209
|
+
kr as usePagination,
|
|
210
|
+
jr as usePermission,
|
|
211
|
+
Rr as usePermissionProvider,
|
|
212
|
+
Er as useTablePagination,
|
|
213
|
+
Ur as zlEnMessages,
|
|
214
|
+
Jr as zlMessages,
|
|
215
|
+
Nr as zlZhMessages
|
|
213
216
|
};
|
|
214
217
|
//# sourceMappingURL=index.mjs.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zl-ui-kit/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.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/composables": "0.
|
|
43
|
-
"@zl-ui-kit/icons": "0.
|
|
44
|
-
"@zl-ui-kit/utils": "0.
|
|
42
|
+
"@zl-ui-kit/composables": "0.13.0",
|
|
43
|
+
"@zl-ui-kit/icons": "0.13.0",
|
|
44
|
+
"@zl-ui-kit/utils": "0.13.0"
|
|
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/vite-config": "1.0.0",
|
|
102
|
-
"@
|
|
102
|
+
"@zl-ui-kit/theme": "0.13.0",
|
|
103
103
|
"@jichuang/eslint-config": "1.0.0",
|
|
104
|
-
"@
|
|
104
|
+
"@jichuang/tsconfig": "1.0.0"
|
|
105
105
|
},
|
|
106
106
|
"repository": {
|
|
107
107
|
"type": "git",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.zl-page-header[data-v-1d8b3906]{display:flex;align-items:center;gap:16px;padding:12px 16px;background-color:var(--zl-bg-1, #fff);border-bottom:1px solid var(--zl-border-2, #e3e9ef)}.zl-page-header__main[data-v-1d8b3906]{flex:1;min-width:0}.zl-page-header__title[data-v-1d8b3906]{font-size:16px;font-weight:600;line-height:24px;color:var(--zl-text-1, #242e43)}.zl-page-header__description[data-v-1d8b3906]{margin-top:2px;font-size:13px;line-height:20px;color:var(--zl-text-3, #79879c)}.zl-page-header__extra[data-v-1d8b3906]{flex-shrink:0;display:flex;align-items:center;gap:8px}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { defineComponent as l, openBlock as s, createElementBlock as o, createElementVNode as r, renderSlot as i, createTextVNode as a, toDisplayString as d, createCommentVNode as n } from "vue";
|
|
2
|
-
const c = { class: "zl-page-header" }, p = { class: "zl-page-header__main" }, _ = { class: "zl-page-header__title" }, h = {
|
|
3
|
-
key: 0,
|
|
4
|
-
class: "zl-page-header__description"
|
|
5
|
-
}, m = {
|
|
6
|
-
key: 0,
|
|
7
|
-
class: "zl-page-header__extra"
|
|
8
|
-
}, v = /* @__PURE__ */ l({
|
|
9
|
-
name: "ZlPageHeader",
|
|
10
|
-
__name: "index",
|
|
11
|
-
props: {
|
|
12
|
-
title: {},
|
|
13
|
-
description: {}
|
|
14
|
-
},
|
|
15
|
-
setup(t) {
|
|
16
|
-
return (e, u) => (s(), o("div", c, [
|
|
17
|
-
r("div", p, [
|
|
18
|
-
r("div", _, [
|
|
19
|
-
i(e.$slots, "title", {}, () => [
|
|
20
|
-
a(d(t.title), 1)
|
|
21
|
-
], !0)
|
|
22
|
-
]),
|
|
23
|
-
t.description || e.$slots.description ? (s(), o("div", h, [
|
|
24
|
-
i(e.$slots, "description", {}, () => [
|
|
25
|
-
a(d(t.description), 1)
|
|
26
|
-
], !0)
|
|
27
|
-
])) : n("", !0)
|
|
28
|
-
]),
|
|
29
|
-
e.$slots.extra ? (s(), o("div", m, [
|
|
30
|
-
i(e.$slots, "extra", {}, void 0, !0)
|
|
31
|
-
])) : n("", !0)
|
|
32
|
-
]));
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
export {
|
|
36
|
-
v as default
|
|
37
|
-
};
|
|
38
|
-
//# sourceMappingURL=index2.vue.mjs.map
|