@vxe-ui/plugin-render-element 4.0.7 → 4.0.9
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/LICENSE +20 -20
- package/README.md +156 -154
- package/dist/all.common.js +21 -60
- package/dist/form/index.js +0 -47
- package/dist/form-design/checkbox-widget.js +1 -1
- package/dist/form-design/date-picker-widget.js +1 -1
- package/dist/form-design/input-widget.js +1 -1
- package/dist/form-design/number-input-widget.js +1 -1
- package/dist/form-design/radio-widget.js +1 -1
- package/dist/form-design/select-widget.js +1 -1
- package/dist/form-design/switch-widget.js +1 -1
- package/dist/form-design/textarea-widget.js +1 -1
- package/dist/form-design/use.js +1 -1
- package/dist/index.common.js +12 -4
- package/dist/index.js +12 -4
- package/dist/index.umd.js +21 -60
- package/dist/index.umd.min.js +1 -1
- package/package.json +75 -74
- package/src/form/index.ts +322 -369
- package/src/form-design/checkbox-widget.ts +166 -166
- package/src/form-design/date-picker-widget.ts +143 -143
- package/src/form-design/index.ts +101 -101
- package/src/form-design/input-widget.ts +144 -144
- package/src/form-design/number-input-widget.ts +143 -143
- package/src/form-design/radio-widget.ts +166 -166
- package/src/form-design/select-widget.ts +165 -165
- package/src/form-design/switch-widget.ts +139 -139
- package/src/form-design/textarea-widget.ts +148 -148
- package/src/form-design/use.ts +255 -255
- package/src/index.ts +87 -78
- package/src/table/index.ts +605 -604
- package/types/index.d.ts +12 -12
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2019 Xu Liangzhan
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2019 Xu Liangzhan
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
21
|
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,154 +1,156 @@
|
|
|
1
|
-
# @vxe-ui/plugin-render-element
|
|
2
|
-
|
|
3
|
-
[Vxe UI](https://vxeui.com/) plug-in for compatibility with the [element-plus](https://www.npmjs.com/package/element-plus) component.
|
|
4
|
-
|
|
5
|
-
## Compatibility
|
|
6
|
-
|
|
7
|
-
It corresponds to [vxe-table v4](https://www.npmjs.com/package/vxe-table) or [vxe-pc-ui v4](https://www.npmjs.com/package/vxe-pc-ui)
|
|
8
|
-
|
|
9
|
-
## Installing
|
|
10
|
-
|
|
11
|
-
```shell
|
|
12
|
-
npm install @vxe-ui/plugin-render-element
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
```javascript
|
|
16
|
-
// ...
|
|
17
|
-
// Use vxe-pc-ui
|
|
18
|
-
import { VxeUI } from 'vxe-pc-ui'
|
|
19
|
-
// Use vxe-table
|
|
20
|
-
// import { VxeUI } from 'vxe-table'
|
|
21
|
-
import VxeUIPluginRenderElement from '@vxe-ui/plugin-render-element'
|
|
22
|
-
import '@vxe-ui/plugin-render-element/dist/style.css'
|
|
23
|
-
// ...
|
|
24
|
-
|
|
25
|
-
VxeUI.use(VxeUIPluginRenderElement)
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
## API
|
|
29
|
-
|
|
30
|
-
### cell-render 默认的渲染配置项说明
|
|
31
|
-
|
|
32
|
-
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
33
|
-
|------|------|-----|-----|-----|
|
|
34
|
-
| name | 支持的渲染组件 | String | ElInput, ElAutocomplete, ElInputNumber, ElSwitch, ElRate, ElSlider, ElButton, ElButtons | — |
|
|
35
|
-
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
36
|
-
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
37
|
-
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
38
|
-
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
39
|
-
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
40
|
-
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
41
|
-
| events | 渲染组件附加事件,参数为 ( {row,rowIndex,column,columnIndex}, ...Component arguments ) | Object | — | — |
|
|
42
|
-
|
|
43
|
-
### edit-render 可编辑渲染器配置项说明
|
|
44
|
-
|
|
45
|
-
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
46
|
-
|------|------|-----|-----|-----|
|
|
47
|
-
| name | 支持的渲染组件 | String | ElInput, ElAutocomplete, ElInputNumber, ElSelect, ElCascader, ElTimeSelect, ElTimePicker, ElDatePicker, ElSwitch, ElRate, ElSlider, ElButton, ElButtons | — |
|
|
48
|
-
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
49
|
-
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
50
|
-
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
51
|
-
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
52
|
-
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
53
|
-
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
54
|
-
| events | 渲染组件附加事件,参数为 ( {row,rowIndex,column,columnIndex}, ...Component arguments ) | Object | — | — |
|
|
55
|
-
|
|
56
|
-
### filter-render 筛选渲染器配置项说明
|
|
57
|
-
|
|
58
|
-
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
59
|
-
|------|------|-----|-----|-----|
|
|
60
|
-
| name | 支持的渲染组件 | String | ElInput, ElInputNumber, ElAutocomplete, ElSelect, ElDatePicker, ElSwitch, ElRate, ElSlider | — |
|
|
61
|
-
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
62
|
-
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
63
|
-
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
64
|
-
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
65
|
-
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
66
|
-
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
67
|
-
| events | 渲染组件附加事件,参数为 ( {}, ...Component arguments ) | Object | — | — |
|
|
68
|
-
|
|
69
|
-
### item-render 表单-项渲染器配置项说明
|
|
70
|
-
|
|
71
|
-
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
72
|
-
|------|------|-----|-----|-----|
|
|
73
|
-
| name | 支持的渲染组件 | String | ElInput, ElInputNumber, ElAutocomplete, ElSelect, ElDatePicker, ElSwitch, ElRate, ElSlider, ElRadio, ElCheckbox, ElButton, ElButtons | — |
|
|
74
|
-
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
75
|
-
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
76
|
-
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
77
|
-
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
78
|
-
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
79
|
-
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
80
|
-
| events | 渲染组件附加事件,参数为 ( {}, ...Component arguments ) | Object | — | — |
|
|
81
|
-
|
|
82
|
-
### 表单设计器配置项
|
|
83
|
-
|
|
84
|
-
| 描述 |
|
|
85
|
-
|------|
|
|
86
|
-
| 'ElInputWidget', 'ElTextareaWidget', 'ElNumberInputWidget', 'ElDatePickerWidget', 'ElSelectWidget', 'ElRadioWidget', 'ElCheckboxWidget', 'ElSwitchWidget' |
|
|
87
|
-
|
|
88
|
-
## Cell demo
|
|
89
|
-
|
|
90
|
-
```html
|
|
91
|
-
<
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
{ id:
|
|
108
|
-
{ id:
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
<vxe-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
{ id:
|
|
139
|
-
{ id:
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
1
|
+
# @vxe-ui/plugin-render-element
|
|
2
|
+
|
|
3
|
+
[Vxe UI](https://vxeui.com/) plug-in for compatibility with the [element-plus](https://www.npmjs.com/package/element-plus) component.
|
|
4
|
+
|
|
5
|
+
## Compatibility
|
|
6
|
+
|
|
7
|
+
It corresponds to [vxe-table v4](https://www.npmjs.com/package/vxe-table) or [vxe-pc-ui v4](https://www.npmjs.com/package/vxe-pc-ui)
|
|
8
|
+
|
|
9
|
+
## Installing
|
|
10
|
+
|
|
11
|
+
```shell
|
|
12
|
+
npm install @vxe-ui/plugin-render-element
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
```javascript
|
|
16
|
+
// ...
|
|
17
|
+
// Use vxe-pc-ui
|
|
18
|
+
import { VxeUI } from 'vxe-pc-ui'
|
|
19
|
+
// Use vxe-table
|
|
20
|
+
// import { VxeUI } from 'vxe-table'
|
|
21
|
+
import VxeUIPluginRenderElement from '@vxe-ui/plugin-render-element'
|
|
22
|
+
import '@vxe-ui/plugin-render-element/dist/style.css'
|
|
23
|
+
// ...
|
|
24
|
+
|
|
25
|
+
VxeUI.use(VxeUIPluginRenderElement)
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
## API
|
|
29
|
+
|
|
30
|
+
### cell-render 默认的渲染配置项说明
|
|
31
|
+
|
|
32
|
+
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
33
|
+
|------|------|-----|-----|-----|
|
|
34
|
+
| name | 支持的渲染组件 | String | ElInput, ElAutocomplete, ElInputNumber, ElSwitch, ElRate, ElSlider, ElButton, ElButtons | — |
|
|
35
|
+
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
36
|
+
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
37
|
+
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
38
|
+
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
39
|
+
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
40
|
+
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
41
|
+
| events | 渲染组件附加事件,参数为 ( {row,rowIndex,column,columnIndex}, ...Component arguments ) | Object | — | — |
|
|
42
|
+
|
|
43
|
+
### edit-render 可编辑渲染器配置项说明
|
|
44
|
+
|
|
45
|
+
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
46
|
+
|------|------|-----|-----|-----|
|
|
47
|
+
| name | 支持的渲染组件 | String | ElInput, ElAutocomplete, ElInputNumber, ElSelect, ElCascader, ElTimeSelect, ElTimePicker, ElDatePicker, ElSwitch, ElRate, ElSlider, ElButton, ElButtons | — |
|
|
48
|
+
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
49
|
+
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
50
|
+
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
51
|
+
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
52
|
+
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
53
|
+
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
54
|
+
| events | 渲染组件附加事件,参数为 ( {row,rowIndex,column,columnIndex}, ...Component arguments ) | Object | — | — |
|
|
55
|
+
|
|
56
|
+
### filter-render 筛选渲染器配置项说明
|
|
57
|
+
|
|
58
|
+
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
59
|
+
|------|------|-----|-----|-----|
|
|
60
|
+
| name | 支持的渲染组件 | String | ElInput, ElInputNumber, ElAutocomplete, ElSelect, ElDatePicker, ElSwitch, ElRate, ElSlider | — |
|
|
61
|
+
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
62
|
+
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
63
|
+
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
64
|
+
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
65
|
+
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
66
|
+
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
67
|
+
| events | 渲染组件附加事件,参数为 ( {}, ...Component arguments ) | Object | — | — |
|
|
68
|
+
|
|
69
|
+
### item-render 表单-项渲染器配置项说明
|
|
70
|
+
|
|
71
|
+
| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|
|
72
|
+
|------|------|-----|-----|-----|
|
|
73
|
+
| name | 支持的渲染组件 | String | ElInput, ElInputNumber, ElAutocomplete, ElSelect, ElDatePicker, ElSwitch, ElRate, ElSlider, ElRadio, ElCheckbox, ElButton, ElButtons | — |
|
|
74
|
+
| attrs | 渲染组件附加属性,参数请查看被渲染的 Component attrs | Object | — | {} |
|
|
75
|
+
| props | 渲染组件附加属性,参数请查看被渲染的 Component props | Object | — | {} |
|
|
76
|
+
| options | 只对 name=ElSelect 有效,下拉组件选项列表 | Array | — | [] |
|
|
77
|
+
| optionProps | 只对 name=ElSelect 有效,下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
|
|
78
|
+
| optionGroups | 只对 name=ElSelect 有效,下拉组件分组选项列表 | Array | — | [] |
|
|
79
|
+
| optionGroupProps | 只对 name=ElSelect 有效,下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
|
|
80
|
+
| events | 渲染组件附加事件,参数为 ( {}, ...Component arguments ) | Object | — | — |
|
|
81
|
+
|
|
82
|
+
### 表单设计器配置项
|
|
83
|
+
|
|
84
|
+
| 描述 |
|
|
85
|
+
|------|
|
|
86
|
+
| 'ElInputWidget', 'ElTextareaWidget', 'ElNumberInputWidget', 'ElDatePickerWidget', 'ElSelectWidget', 'ElRadioWidget', 'ElCheckboxWidget', 'ElSwitchWidget' |
|
|
87
|
+
|
|
88
|
+
## Table Cell demo
|
|
89
|
+
|
|
90
|
+
```html
|
|
91
|
+
<template>
|
|
92
|
+
<vxe-table
|
|
93
|
+
height="600"
|
|
94
|
+
:data="tableData"
|
|
95
|
+
:edit-config="{trigger: 'click', mode: 'cell'}">
|
|
96
|
+
<vxe-column field="name" title="Name" :edit-render="{name: 'ElInput'}"></vxe-column>
|
|
97
|
+
<vxe-column field="age" title="Age" :edit-render="{name: 'ElInputNumber'}"></vxe-column>
|
|
98
|
+
<vxe-column field="date" title="Date" width="200" :edit-render="{name: 'ElDatePicker'}"></vxe-column>
|
|
99
|
+
</vxe-table>
|
|
100
|
+
</template>
|
|
101
|
+
|
|
102
|
+
<script>
|
|
103
|
+
export default {
|
|
104
|
+
data () {
|
|
105
|
+
return {
|
|
106
|
+
tableData: [
|
|
107
|
+
{ id: 100, name: 'test0', age: 28, sex: '1', date: '' },
|
|
108
|
+
{ id: 101, name: 'test1', age: 32, sex: '0', date: '' },
|
|
109
|
+
{ id: 102, name: 'test2', age: 36, sex: '1', date: '' }
|
|
110
|
+
]
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
</script>
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
## Table Filter demo
|
|
118
|
+
|
|
119
|
+
```html
|
|
120
|
+
<template>
|
|
121
|
+
<vxe-table
|
|
122
|
+
height="600"
|
|
123
|
+
:data="tableData">
|
|
124
|
+
<vxe-column field="name" title="Name":filters="nameOptions" :filter-render="{name: 'ElInput'}"></vxe-column>
|
|
125
|
+
<vxe-column field="age" title="Age"></vxe-column>
|
|
126
|
+
<vxe-column field="date" title="Date" ></vxe-column>
|
|
127
|
+
</vxe-table>
|
|
128
|
+
</template>
|
|
129
|
+
|
|
130
|
+
<script>
|
|
131
|
+
export default {
|
|
132
|
+
data () {
|
|
133
|
+
return {
|
|
134
|
+
nameOptions: [
|
|
135
|
+
{ data: '' }
|
|
136
|
+
],
|
|
137
|
+
tableData: [
|
|
138
|
+
{ id: 100, name: 'test0', age: 28, date: null },
|
|
139
|
+
{ id: 101, name: 'test1', age: 32, date: null },
|
|
140
|
+
{ id: 102, name: 'test2', age: 36, date: null }
|
|
141
|
+
]
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
</script>
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
## Contributors
|
|
149
|
+
|
|
150
|
+
Thank you to everyone who contributed to this project.
|
|
151
|
+
|
|
152
|
+
[](https://github.com/x-extends/vxe-ui-plugins/graphs/contributors)
|
|
153
|
+
|
|
154
|
+
## License
|
|
155
|
+
|
|
156
|
+
[MIT](LICENSE) © 2019-present, Xu Liangzhan
|
package/dist/all.common.js
CHANGED
|
@@ -115,7 +115,7 @@ function createWidgetElCheckbox(VxeUI) {
|
|
|
115
115
|
$formView = renderParams.$formView;
|
|
116
116
|
if ($formView) {
|
|
117
117
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
118
|
-
$formView.
|
|
118
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
119
119
|
}
|
|
120
120
|
};
|
|
121
121
|
return function () {
|
|
@@ -270,7 +270,7 @@ function createWidgetElDatePicker(VxeUI) {
|
|
|
270
270
|
$formView = renderParams.$formView;
|
|
271
271
|
if ($formView) {
|
|
272
272
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
273
|
-
$formView.
|
|
273
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
274
274
|
}
|
|
275
275
|
};
|
|
276
276
|
return function () {
|
|
@@ -592,7 +592,7 @@ function createWidgetElInput(VxeUI) {
|
|
|
592
592
|
$formView = renderParams.$formView;
|
|
593
593
|
if ($formView) {
|
|
594
594
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
595
|
-
$formView.
|
|
595
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
596
596
|
}
|
|
597
597
|
};
|
|
598
598
|
return function () {
|
|
@@ -735,7 +735,7 @@ function createWidgetElInputNumber(VxeUI) {
|
|
|
735
735
|
$formView = renderParams.$formView;
|
|
736
736
|
if ($formView) {
|
|
737
737
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
738
|
-
$formView.
|
|
738
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
739
739
|
}
|
|
740
740
|
};
|
|
741
741
|
return function () {
|
|
@@ -887,7 +887,7 @@ function createWidgetElRadio(VxeUI) {
|
|
|
887
887
|
$formView = renderParams.$formView;
|
|
888
888
|
if ($formView) {
|
|
889
889
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
890
|
-
$formView.
|
|
890
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
891
891
|
}
|
|
892
892
|
};
|
|
893
893
|
return function () {
|
|
@@ -1052,7 +1052,7 @@ function createWidgetElSelect(VxeUI) {
|
|
|
1052
1052
|
$formView = renderParams.$formView;
|
|
1053
1053
|
if ($formView) {
|
|
1054
1054
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
1055
|
-
$formView.
|
|
1055
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
1056
1056
|
}
|
|
1057
1057
|
};
|
|
1058
1058
|
return function () {
|
|
@@ -1202,7 +1202,7 @@ function createWidgetElSwitch(VxeUI) {
|
|
|
1202
1202
|
$formView = renderParams.$formView;
|
|
1203
1203
|
if ($formView) {
|
|
1204
1204
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
1205
|
-
$formView.
|
|
1205
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
1206
1206
|
}
|
|
1207
1207
|
};
|
|
1208
1208
|
return function () {
|
|
@@ -1343,7 +1343,7 @@ function createWidgetElTextarea(VxeUI) {
|
|
|
1343
1343
|
$formView = renderParams.$formView;
|
|
1344
1344
|
if ($formView) {
|
|
1345
1345
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
1346
|
-
$formView.
|
|
1346
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
1347
1347
|
}
|
|
1348
1348
|
};
|
|
1349
1349
|
return function () {
|
|
@@ -1542,7 +1542,7 @@ function useWidgetPropDataSource(VxeUI, props, isSubOption) {
|
|
|
1542
1542
|
"class": 'vxe-default-input',
|
|
1543
1543
|
value: item.value,
|
|
1544
1544
|
onInput: function onInput(evnt) {
|
|
1545
|
-
item.value = evnt.
|
|
1545
|
+
item.value = evnt.currentTarget.value;
|
|
1546
1546
|
}
|
|
1547
1547
|
}), (0, _vue.h)(VxeUIButtonComponent, {
|
|
1548
1548
|
status: 'danger',
|
|
@@ -1787,48 +1787,6 @@ function defineFormRender(VxeUI) {
|
|
|
1787
1787
|
})];
|
|
1788
1788
|
};
|
|
1789
1789
|
}
|
|
1790
|
-
/**
|
|
1791
|
-
* 检查触发源是否属于目标节点
|
|
1792
|
-
*/
|
|
1793
|
-
function getEventTargetNode(evnt, container, className) {
|
|
1794
|
-
var targetElem;
|
|
1795
|
-
var target = evnt.target;
|
|
1796
|
-
while (target && target.nodeType && target !== document) {
|
|
1797
|
-
if (className && target.className && target.className.split && target.className.split(' ').indexOf(className) > -1) {
|
|
1798
|
-
targetElem = target;
|
|
1799
|
-
} else if (target === container) {
|
|
1800
|
-
return {
|
|
1801
|
-
flag: className ? !!targetElem : true,
|
|
1802
|
-
container: container,
|
|
1803
|
-
targetElem: targetElem
|
|
1804
|
-
};
|
|
1805
|
-
}
|
|
1806
|
-
target = target.parentNode;
|
|
1807
|
-
}
|
|
1808
|
-
return {
|
|
1809
|
-
flag: false
|
|
1810
|
-
};
|
|
1811
|
-
}
|
|
1812
|
-
/**
|
|
1813
|
-
* 事件兼容性处理
|
|
1814
|
-
*/
|
|
1815
|
-
function handleClearEvent(params) {
|
|
1816
|
-
var $event = params.$event;
|
|
1817
|
-
var bodyElem = document.body;
|
|
1818
|
-
if (
|
|
1819
|
-
// 远程搜索
|
|
1820
|
-
getEventTargetNode($event, bodyElem, 'el-autocomplete-suggestion').flag ||
|
|
1821
|
-
// 下拉框
|
|
1822
|
-
getEventTargetNode($event, bodyElem, 'el-select-dropdown').flag ||
|
|
1823
|
-
// 级联
|
|
1824
|
-
getEventTargetNode($event, bodyElem, 'el-cascader__dropdown').flag || getEventTargetNode($event, bodyElem, 'el-cascader-menus').flag ||
|
|
1825
|
-
// 日期
|
|
1826
|
-
getEventTargetNode($event, bodyElem, 'el-time-panel').flag || getEventTargetNode($event, bodyElem, 'el-picker-panel').flag ||
|
|
1827
|
-
// 颜色
|
|
1828
|
-
getEventTargetNode($event, bodyElem, 'el-color-dropdown').flag) {
|
|
1829
|
-
return false;
|
|
1830
|
-
}
|
|
1831
|
-
}
|
|
1832
1790
|
VxeUI.renderer.mixin({
|
|
1833
1791
|
ElAutocomplete: {
|
|
1834
1792
|
renderFormItemContent: createFormItemRender()
|
|
@@ -1969,11 +1927,6 @@ function defineFormRender(VxeUI) {
|
|
|
1969
1927
|
renderFormItemContent: defaultButtonsItemRender
|
|
1970
1928
|
}
|
|
1971
1929
|
});
|
|
1972
|
-
VxeUI.interceptor.add('event.clearFilter', handleClearEvent);
|
|
1973
|
-
VxeUI.interceptor.add('event.clearEdit', handleClearEvent);
|
|
1974
|
-
VxeUI.interceptor.add('event.clearAreas', handleClearEvent);
|
|
1975
|
-
// 兼容老版本
|
|
1976
|
-
VxeUI.interceptor.add('event.clearActived', handleClearEvent);
|
|
1977
1930
|
}
|
|
1978
1931
|
},{"vue":"vue","xe-utils":"xe-utils"}],12:[function(require,module,exports){
|
|
1979
1932
|
"use strict";
|
|
@@ -1987,13 +1940,21 @@ var _form = require("./form");
|
|
|
1987
1940
|
var _formDesign = require("./form-design");
|
|
1988
1941
|
// eslint-disable-next-line no-unused-vars
|
|
1989
1942
|
var ElementPlus;
|
|
1943
|
+
function getEventTarget(evnt) {
|
|
1944
|
+
var target = evnt.target;
|
|
1945
|
+
if (target && target.shadowRoot && evnt.composed) {
|
|
1946
|
+
return evnt.composedPath()[0] || target;
|
|
1947
|
+
}
|
|
1948
|
+
return target;
|
|
1949
|
+
}
|
|
1990
1950
|
/**
|
|
1991
1951
|
* 检查触发源是否属于目标节点
|
|
1992
1952
|
*/
|
|
1993
1953
|
function getEventTargetNode(evnt, container, className) {
|
|
1994
1954
|
var targetElem;
|
|
1995
|
-
var target = evnt
|
|
1996
|
-
|
|
1955
|
+
var target = getEventTarget(evnt);
|
|
1956
|
+
var rootEl = document.documentElement || document.querySelector('html');
|
|
1957
|
+
while (target && target.nodeType && target !== rootEl) {
|
|
1997
1958
|
if (className && target.className && target.className.split && target.className.split(' ').indexOf(className) > -1) {
|
|
1998
1959
|
targetElem = target;
|
|
1999
1960
|
} else if (target === container) {
|
|
@@ -2003,7 +1964,7 @@ function getEventTargetNode(evnt, container, className) {
|
|
|
2003
1964
|
targetElem: targetElem
|
|
2004
1965
|
};
|
|
2005
1966
|
}
|
|
2006
|
-
target = target.
|
|
1967
|
+
target = target.parentElement;
|
|
2007
1968
|
}
|
|
2008
1969
|
return {
|
|
2009
1970
|
flag: false
|
|
@@ -2034,7 +1995,7 @@ var VxeUIPluginRenderElement = exports.VxeUIPluginRenderElement = {
|
|
|
2034
1995
|
ElementPlus = options ? options.ElementPlus : {};
|
|
2035
1996
|
// 检查版本
|
|
2036
1997
|
if (!/^(4)\./.test(VxeUI.uiVersion)) {
|
|
2037
|
-
console.error('[plugin-render-element 4.
|
|
1998
|
+
console.error('[@vxe-ui/plugin-render-element 4.0.9] Requires vxe-table 4.7.0+ version. https://vxeui.com/other4/#/plugin-export-xlsx/install');
|
|
2038
1999
|
}
|
|
2039
2000
|
(0, _table.defineTableRender)(VxeUI);
|
|
2040
2001
|
(0, _form.defineFormRender)(VxeUI);
|
package/dist/form/index.js
CHANGED
|
@@ -175,48 +175,6 @@ function defineFormRender(VxeUI) {
|
|
|
175
175
|
})];
|
|
176
176
|
};
|
|
177
177
|
}
|
|
178
|
-
/**
|
|
179
|
-
* 检查触发源是否属于目标节点
|
|
180
|
-
*/
|
|
181
|
-
function getEventTargetNode(evnt, container, className) {
|
|
182
|
-
var targetElem;
|
|
183
|
-
var target = evnt.target;
|
|
184
|
-
while (target && target.nodeType && target !== document) {
|
|
185
|
-
if (className && target.className && target.className.split && target.className.split(' ').indexOf(className) > -1) {
|
|
186
|
-
targetElem = target;
|
|
187
|
-
} else if (target === container) {
|
|
188
|
-
return {
|
|
189
|
-
flag: className ? !!targetElem : true,
|
|
190
|
-
container: container,
|
|
191
|
-
targetElem: targetElem
|
|
192
|
-
};
|
|
193
|
-
}
|
|
194
|
-
target = target.parentNode;
|
|
195
|
-
}
|
|
196
|
-
return {
|
|
197
|
-
flag: false
|
|
198
|
-
};
|
|
199
|
-
}
|
|
200
|
-
/**
|
|
201
|
-
* 事件兼容性处理
|
|
202
|
-
*/
|
|
203
|
-
function handleClearEvent(params) {
|
|
204
|
-
var $event = params.$event;
|
|
205
|
-
var bodyElem = document.body;
|
|
206
|
-
if (
|
|
207
|
-
// 远程搜索
|
|
208
|
-
getEventTargetNode($event, bodyElem, 'el-autocomplete-suggestion').flag ||
|
|
209
|
-
// 下拉框
|
|
210
|
-
getEventTargetNode($event, bodyElem, 'el-select-dropdown').flag ||
|
|
211
|
-
// 级联
|
|
212
|
-
getEventTargetNode($event, bodyElem, 'el-cascader__dropdown').flag || getEventTargetNode($event, bodyElem, 'el-cascader-menus').flag ||
|
|
213
|
-
// 日期
|
|
214
|
-
getEventTargetNode($event, bodyElem, 'el-time-panel').flag || getEventTargetNode($event, bodyElem, 'el-picker-panel').flag ||
|
|
215
|
-
// 颜色
|
|
216
|
-
getEventTargetNode($event, bodyElem, 'el-color-dropdown').flag) {
|
|
217
|
-
return false;
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
178
|
VxeUI.renderer.mixin({
|
|
221
179
|
ElAutocomplete: {
|
|
222
180
|
renderFormItemContent: createFormItemRender()
|
|
@@ -357,9 +315,4 @@ function defineFormRender(VxeUI) {
|
|
|
357
315
|
renderFormItemContent: defaultButtonsItemRender
|
|
358
316
|
}
|
|
359
317
|
});
|
|
360
|
-
VxeUI.interceptor.add('event.clearFilter', handleClearEvent);
|
|
361
|
-
VxeUI.interceptor.add('event.clearEdit', handleClearEvent);
|
|
362
|
-
VxeUI.interceptor.add('event.clearAreas', handleClearEvent);
|
|
363
|
-
// 兼容老版本
|
|
364
|
-
VxeUI.interceptor.add('event.clearActived', handleClearEvent);
|
|
365
318
|
}
|
|
@@ -114,7 +114,7 @@ function createWidgetElCheckbox(VxeUI) {
|
|
|
114
114
|
$formView = renderParams.$formView;
|
|
115
115
|
if ($formView) {
|
|
116
116
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
117
|
-
$formView.
|
|
117
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
118
118
|
}
|
|
119
119
|
};
|
|
120
120
|
return function () {
|
|
@@ -105,7 +105,7 @@ function createWidgetElDatePicker(VxeUI) {
|
|
|
105
105
|
$formView = renderParams.$formView;
|
|
106
106
|
if ($formView) {
|
|
107
107
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
108
|
-
$formView.
|
|
108
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
109
109
|
}
|
|
110
110
|
};
|
|
111
111
|
return function () {
|
|
@@ -106,7 +106,7 @@ function createWidgetElInput(VxeUI) {
|
|
|
106
106
|
$formView = renderParams.$formView;
|
|
107
107
|
if ($formView) {
|
|
108
108
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
109
|
-
$formView.
|
|
109
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
110
110
|
}
|
|
111
111
|
};
|
|
112
112
|
return function () {
|
|
@@ -105,7 +105,7 @@ function createWidgetElInputNumber(VxeUI) {
|
|
|
105
105
|
$formView = renderParams.$formView;
|
|
106
106
|
if ($formView) {
|
|
107
107
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
108
|
-
$formView.
|
|
108
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
109
109
|
}
|
|
110
110
|
};
|
|
111
111
|
return function () {
|
|
@@ -114,7 +114,7 @@ function createWidgetElRadio(VxeUI) {
|
|
|
114
114
|
$formView = renderParams.$formView;
|
|
115
115
|
if ($formView) {
|
|
116
116
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
117
|
-
$formView.
|
|
117
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
118
118
|
}
|
|
119
119
|
};
|
|
120
120
|
return function () {
|
|
@@ -115,7 +115,7 @@ function createWidgetElSelect(VxeUI) {
|
|
|
115
115
|
$formView = renderParams.$formView;
|
|
116
116
|
if ($formView) {
|
|
117
117
|
var itemValue = $formView ? $formView.getItemValue(widget) : null;
|
|
118
|
-
$formView.
|
|
118
|
+
$formView.updateWidgetStatus(widget, itemValue);
|
|
119
119
|
}
|
|
120
120
|
};
|
|
121
121
|
return function () {
|