@vxe-ui/plugin-render-antd 4.0.6 → 4.0.7

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.
Files changed (20) hide show
  1. package/LICENSE +20 -20
  2. package/README.md +151 -151
  3. package/dist/index.umd.min.js +1 -1
  4. package/dist/style.css +7 -7
  5. package/dist/style.min.css +1 -1
  6. package/package.json +73 -73
  7. package/src/form/index.ts +309 -309
  8. package/src/form-design/checkbox-widget.ts +164 -164
  9. package/src/form-design/date-picker-widget.ts +144 -144
  10. package/src/form-design/index.ts +101 -101
  11. package/src/form-design/input-widget.ts +144 -144
  12. package/src/form-design/number-input-widget.ts +144 -144
  13. package/src/form-design/radio-widget.ts +164 -164
  14. package/src/form-design/select-widget.ts +156 -156
  15. package/src/form-design/switch-widget.ts +140 -140
  16. package/src/form-design/textarea-widget.ts +148 -148
  17. package/src/form-design/use.ts +255 -255
  18. package/src/index.ts +71 -71
  19. package/src/table/index.ts +542 -542
  20. package/types/index.d.ts +12 -12
package/src/form-design/checkbox-widget.ts CHANGED
@@ -1,164 +1,164 @@
1
- import { defineComponent, h, PropType, resolveComponent, ComponentOptions, computed } from 'vue'
2
- import { useWidgetPropDataSource, WidgetDataSourceOptionObjVO } from './use'
3
- import XEUtils from 'xe-utils'
4
-
5
- import type { VxeUIExport, VxeGlobalRendererHandles, VxeFormComponent, VxeFormItemComponent, VxeSwitchComponent, VxeInputComponent } from 'vxe-pc-ui'
6
-
7
- interface WidgetACheckboxFormObjVO {
8
- options: WidgetDataSourceOptionObjVO[]
9
- }
10
-
11
- export function createWidgetACheckbox (VxeUI: VxeUIExport) {
12
- const getWidgetACheckboxConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetACheckboxFormObjVO> => {
13
- return {
14
- title: '复选框',
15
- icon: 'vxe-icon-checkbox-checked',
16
- options: {
17
- options: XEUtils.range(0, 3).map((v, i) => {
18
- return {
19
- value: VxeUI.getI18n('vxe.formDesign.widgetProp.dataSource.defValue', [i + 1])
20
- }
21
- })
22
- }
23
- }
24
- }
25
-
26
- const WidgetACheckboxFormComponent = defineComponent({
27
- props: {
28
- renderOpts: {
29
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
30
- default: () => ({})
31
- },
32
- renderParams: {
33
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetACheckboxFormObjVO>>,
34
- default: () => ({})
35
- }
36
- },
37
- emits: [],
38
- setup (props) {
39
- const VxeUIFormComponent = VxeUI.getComponent<VxeFormComponent>('VxeForm')
40
- const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
41
- const VxeUISwitchComponent = VxeUI.getComponent<VxeSwitchComponent>('VxeSwitch')
42
- const VxeUIInputComponent = VxeUI.getComponent<VxeInputComponent>('VxeInput')
43
-
44
- const { renderDataSourceFormItem } = useWidgetPropDataSource(VxeUI, props, false)
45
-
46
- return () => {
47
- const { renderParams } = props
48
- const { widget } = renderParams
49
-
50
- return h(VxeUIFormComponent, {
51
- class: 'vxe-form-design--widget-render-form-wrapper',
52
- vertical: true,
53
- span: 24,
54
- titleBold: true,
55
- titleOverflow: true,
56
- data: widget.options
57
- }, {
58
- default () {
59
- return [
60
- h(VxeUIFormItemComponent, {
61
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
62
- }, {
63
- default () {
64
- return h(VxeUIInputComponent, {
65
- modelValue: widget.title,
66
- 'onUpdate:modelValue' (val: any) {
67
- widget.title = val
68
- }
69
- })
70
- }
71
- }),
72
- h(VxeUIFormItemComponent, {
73
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
74
- field: 'placeholder',
75
- itemRender: { name: 'ElInput' }
76
- }),
77
- h(VxeUIFormItemComponent, {
78
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
79
- }, {
80
- default () {
81
- return h(VxeUISwitchComponent, {
82
- modelValue: widget.required,
83
- 'onUpdate:modelValue' (val: any) {
84
- widget.required = val
85
- }
86
- })
87
- }
88
- }),
89
- renderDataSourceFormItem()
90
- ]
91
- }
92
- })
93
- }
94
- }
95
- })
96
-
97
- const WidgetACheckboxViewComponent = defineComponent({
98
- props: {
99
- renderOpts: {
100
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
101
- default: () => ({})
102
- },
103
- renderParams: {
104
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetACheckboxFormObjVO>>,
105
- default: () => ({})
106
- }
107
- },
108
- emits: [],
109
- setup (props) {
110
- const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
111
-
112
- const checkboxOptions = computed(() => {
113
- const { renderParams } = props
114
- const { widget } = renderParams
115
- const { options } = widget
116
- return options.options.map(item => {
117
- return {
118
- label: item.value,
119
- value: item.value
120
- }
121
- })
122
- })
123
-
124
- const changeEvent = () => {
125
- const { renderParams } = props
126
- const { widget, $formView } = renderParams
127
- if ($formView) {
128
- const itemValue = $formView ? $formView.getItemValue(widget) : null
129
- $formView.updateItemStatus(widget, itemValue)
130
- }
131
- }
132
-
133
- return () => {
134
- const { renderParams } = props
135
- const { widget, $formView } = renderParams
136
-
137
- return h(VxeUIFormItemComponent, {
138
- class: ['vxe-form-design--widget-render-form-item'],
139
- field: widget.field,
140
- title: widget.title
141
- }, {
142
- default () {
143
- return h(resolveComponent('a-checkbox-group') as ComponentOptions, {
144
- value: $formView ? $formView.getItemValue(widget) : null,
145
- options: checkboxOptions.value,
146
- onChange: changeEvent,
147
- 'onUpdate:value' (val: any) {
148
- if ($formView) {
149
- $formView.setItemValue(widget, val)
150
- }
151
- }
152
- })
153
- }
154
- })
155
- }
156
- }
157
- })
158
-
159
- return {
160
- getWidgetACheckboxConfig,
161
- WidgetACheckboxFormComponent,
162
- WidgetACheckboxViewComponent
163
- }
164
- }
1
+ import { defineComponent, h, PropType, resolveComponent, ComponentOptions, computed } from 'vue'
2
+ import { useWidgetPropDataSource, WidgetDataSourceOptionObjVO } from './use'
3
+ import XEUtils from 'xe-utils'
4
+
5
+ import type { VxeUIExport, VxeGlobalRendererHandles, VxeFormComponent, VxeFormItemComponent, VxeSwitchComponent, VxeInputComponent } from 'vxe-pc-ui'
6
+
7
+ interface WidgetACheckboxFormObjVO {
8
+ options: WidgetDataSourceOptionObjVO[]
9
+ }
10
+
11
+ export function createWidgetACheckbox (VxeUI: VxeUIExport) {
12
+ const getWidgetACheckboxConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetACheckboxFormObjVO> => {
13
+ return {
14
+ title: '复选框',
15
+ icon: 'vxe-icon-checkbox-checked',
16
+ options: {
17
+ options: XEUtils.range(0, 3).map((v, i) => {
18
+ return {
19
+ value: VxeUI.getI18n('vxe.formDesign.widgetProp.dataSource.defValue', [i + 1])
20
+ }
21
+ })
22
+ }
23
+ }
24
+ }
25
+
26
+ const WidgetACheckboxFormComponent = defineComponent({
27
+ props: {
28
+ renderOpts: {
29
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
30
+ default: () => ({})
31
+ },
32
+ renderParams: {
33
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetACheckboxFormObjVO>>,
34
+ default: () => ({})
35
+ }
36
+ },
37
+ emits: [],
38
+ setup (props) {
39
+ const VxeUIFormComponent = VxeUI.getComponent<VxeFormComponent>('VxeForm')
40
+ const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
41
+ const VxeUISwitchComponent = VxeUI.getComponent<VxeSwitchComponent>('VxeSwitch')
42
+ const VxeUIInputComponent = VxeUI.getComponent<VxeInputComponent>('VxeInput')
43
+
44
+ const { renderDataSourceFormItem } = useWidgetPropDataSource(VxeUI, props, false)
45
+
46
+ return () => {
47
+ const { renderParams } = props
48
+ const { widget } = renderParams
49
+
50
+ return h(VxeUIFormComponent, {
51
+ class: 'vxe-form-design--widget-render-form-wrapper',
52
+ vertical: true,
53
+ span: 24,
54
+ titleBold: true,
55
+ titleOverflow: true,
56
+ data: widget.options
57
+ }, {
58
+ default () {
59
+ return [
60
+ h(VxeUIFormItemComponent, {
61
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
62
+ }, {
63
+ default () {
64
+ return h(VxeUIInputComponent, {
65
+ modelValue: widget.title,
66
+ 'onUpdate:modelValue' (val: any) {
67
+ widget.title = val
68
+ }
69
+ })
70
+ }
71
+ }),
72
+ h(VxeUIFormItemComponent, {
73
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
74
+ field: 'placeholder',
75
+ itemRender: { name: 'ElInput' }
76
+ }),
77
+ h(VxeUIFormItemComponent, {
78
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
79
+ }, {
80
+ default () {
81
+ return h(VxeUISwitchComponent, {
82
+ modelValue: widget.required,
83
+ 'onUpdate:modelValue' (val: any) {
84
+ widget.required = val
85
+ }
86
+ })
87
+ }
88
+ }),
89
+ renderDataSourceFormItem()
90
+ ]
91
+ }
92
+ })
93
+ }
94
+ }
95
+ })
96
+
97
+ const WidgetACheckboxViewComponent = defineComponent({
98
+ props: {
99
+ renderOpts: {
100
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
101
+ default: () => ({})
102
+ },
103
+ renderParams: {
104
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetACheckboxFormObjVO>>,
105
+ default: () => ({})
106
+ }
107
+ },
108
+ emits: [],
109
+ setup (props) {
110
+ const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
111
+
112
+ const checkboxOptions = computed(() => {
113
+ const { renderParams } = props
114
+ const { widget } = renderParams
115
+ const { options } = widget
116
+ return options.options.map(item => {
117
+ return {
118
+ label: item.value,
119
+ value: item.value
120
+ }
121
+ })
122
+ })
123
+
124
+ const changeEvent = () => {
125
+ const { renderParams } = props
126
+ const { widget, $formView } = renderParams
127
+ if ($formView) {
128
+ const itemValue = $formView ? $formView.getItemValue(widget) : null
129
+ $formView.updateItemStatus(widget, itemValue)
130
+ }
131
+ }
132
+
133
+ return () => {
134
+ const { renderParams } = props
135
+ const { widget, $formView } = renderParams
136
+
137
+ return h(VxeUIFormItemComponent, {
138
+ class: ['vxe-form-design--widget-render-form-item'],
139
+ field: widget.field,
140
+ title: widget.title
141
+ }, {
142
+ default () {
143
+ return h(resolveComponent('a-checkbox-group') as ComponentOptions, {
144
+ value: $formView ? $formView.getItemValue(widget) : null,
145
+ options: checkboxOptions.value,
146
+ onChange: changeEvent,
147
+ 'onUpdate:value' (val: any) {
148
+ if ($formView) {
149
+ $formView.setItemValue(widget, val)
150
+ }
151
+ }
152
+ })
153
+ }
154
+ })
155
+ }
156
+ }
157
+ })
158
+
159
+ return {
160
+ getWidgetACheckboxConfig,
161
+ WidgetACheckboxFormComponent,
162
+ WidgetACheckboxViewComponent
163
+ }
164
+ }
package/src/form-design/date-picker-widget.ts CHANGED
@@ -1,144 +1,144 @@
1
- import { defineComponent, h, PropType, resolveComponent, ComponentOptions } from 'vue'
2
-
3
- import type { VxeUIExport, VxeGlobalRendererHandles, VxeFormComponent, VxeFormItemComponent, VxeSwitchComponent, VxeInputComponent } from 'vxe-pc-ui'
4
-
5
- interface WidgetADatePickerFormObjVO {
6
- placeholder: string
7
- }
8
-
9
- export function createWidgetADatePicker (VxeUI: VxeUIExport) {
10
- const getWidgetADatePickerConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetADatePickerFormObjVO> => {
11
- return {
12
- title: '日期',
13
- icon: 'vxe-icon-input',
14
- options: {
15
- placeholder: ''
16
- }
17
- }
18
- }
19
-
20
- const WidgetADatePickerFormComponent = defineComponent({
21
- props: {
22
- renderOpts: {
23
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
24
- default: () => ({})
25
- },
26
- renderParams: {
27
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetADatePickerFormObjVO>>,
28
- default: () => ({})
29
- }
30
- },
31
- emits: [],
32
- setup (props) {
33
- const VxeUIFormComponent = VxeUI.getComponent<VxeFormComponent>('VxeForm')
34
- const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
35
- const VxeUISwitchComponent = VxeUI.getComponent<VxeSwitchComponent>('VxeSwitch')
36
- const VxeUIInputComponent = VxeUI.getComponent<VxeInputComponent>('VxeInput')
37
-
38
- return () => {
39
- const { renderParams } = props
40
- const { widget } = renderParams
41
-
42
- return h(VxeUIFormComponent, {
43
- class: 'vxe-form-design--widget-render-form-wrapper',
44
- vertical: true,
45
- span: 24,
46
- titleBold: true,
47
- titleOverflow: true,
48
- data: widget.options
49
- }, {
50
- default () {
51
- return [
52
- h(VxeUIFormItemComponent, {
53
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
54
- }, {
55
- default () {
56
- return h(VxeUIInputComponent, {
57
- modelValue: widget.title,
58
- 'onUpdate:modelValue' (val: any) {
59
- widget.title = val
60
- }
61
- })
62
- }
63
- }),
64
- h(VxeUIFormItemComponent, {
65
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
66
- field: 'placeholder',
67
- itemRender: { name: 'VxeInput' }
68
- }),
69
- h(VxeUIFormItemComponent, {
70
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
71
- }, {
72
- default () {
73
- return h(VxeUISwitchComponent, {
74
- modelValue: widget.required,
75
- 'onUpdate:modelValue' (val: any) {
76
- widget.required = val
77
- }
78
- })
79
- }
80
- })
81
- ]
82
- }
83
- })
84
- }
85
- }
86
- })
87
-
88
- const WidgetADatePickerViewComponent = defineComponent({
89
- props: {
90
- renderOpts: {
91
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
92
- default: () => ({})
93
- },
94
- renderParams: {
95
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetADatePickerFormObjVO>>,
96
- default: () => ({})
97
- }
98
- },
99
- emits: [],
100
- setup (props) {
101
- const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
102
-
103
- const changeEvent = () => {
104
- const { renderParams } = props
105
- const { widget, $formView } = renderParams
106
- if ($formView) {
107
- const itemValue = $formView ? $formView.getItemValue(widget) : null
108
- $formView.updateItemStatus(widget, itemValue)
109
- }
110
- }
111
-
112
- return () => {
113
- const { renderParams } = props
114
- const { widget, $formView } = renderParams
115
- const { options } = widget
116
-
117
- return h(VxeUIFormItemComponent, {
118
- class: ['vxe-form-design--widget-render-form-item'],
119
- field: widget.field,
120
- title: widget.title
121
- }, {
122
- default () {
123
- return h(resolveComponent('a-date-picker') as ComponentOptions, {
124
- value: $formView ? $formView.getItemValue(widget) : null,
125
- placeholder: options.placeholder,
126
- onChange: changeEvent,
127
- 'onUpdate:value' (val: any) {
128
- if ($formView) {
129
- $formView.setItemValue(widget, val)
130
- }
131
- }
132
- })
133
- }
134
- })
135
- }
136
- }
137
- })
138
-
139
- return {
140
- getWidgetADatePickerConfig,
141
- WidgetADatePickerFormComponent,
142
- WidgetADatePickerViewComponent
143
- }
144
- }
1
+ import { defineComponent, h, PropType, resolveComponent, ComponentOptions } from 'vue'
2
+
3
+ import type { VxeUIExport, VxeGlobalRendererHandles, VxeFormComponent, VxeFormItemComponent, VxeSwitchComponent, VxeInputComponent } from 'vxe-pc-ui'
4
+
5
+ interface WidgetADatePickerFormObjVO {
6
+ placeholder: string
7
+ }
8
+
9
+ export function createWidgetADatePicker (VxeUI: VxeUIExport) {
10
+ const getWidgetADatePickerConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetADatePickerFormObjVO> => {
11
+ return {
12
+ title: '日期',
13
+ icon: 'vxe-icon-input',
14
+ options: {
15
+ placeholder: ''
16
+ }
17
+ }
18
+ }
19
+
20
+ const WidgetADatePickerFormComponent = defineComponent({
21
+ props: {
22
+ renderOpts: {
23
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
24
+ default: () => ({})
25
+ },
26
+ renderParams: {
27
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetADatePickerFormObjVO>>,
28
+ default: () => ({})
29
+ }
30
+ },
31
+ emits: [],
32
+ setup (props) {
33
+ const VxeUIFormComponent = VxeUI.getComponent<VxeFormComponent>('VxeForm')
34
+ const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
35
+ const VxeUISwitchComponent = VxeUI.getComponent<VxeSwitchComponent>('VxeSwitch')
36
+ const VxeUIInputComponent = VxeUI.getComponent<VxeInputComponent>('VxeInput')
37
+
38
+ return () => {
39
+ const { renderParams } = props
40
+ const { widget } = renderParams
41
+
42
+ return h(VxeUIFormComponent, {
43
+ class: 'vxe-form-design--widget-render-form-wrapper',
44
+ vertical: true,
45
+ span: 24,
46
+ titleBold: true,
47
+ titleOverflow: true,
48
+ data: widget.options
49
+ }, {
50
+ default () {
51
+ return [
52
+ h(VxeUIFormItemComponent, {
53
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
54
+ }, {
55
+ default () {
56
+ return h(VxeUIInputComponent, {
57
+ modelValue: widget.title,
58
+ 'onUpdate:modelValue' (val: any) {
59
+ widget.title = val
60
+ }
61
+ })
62
+ }
63
+ }),
64
+ h(VxeUIFormItemComponent, {
65
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
66
+ field: 'placeholder',
67
+ itemRender: { name: 'VxeInput' }
68
+ }),
69
+ h(VxeUIFormItemComponent, {
70
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
71
+ }, {
72
+ default () {
73
+ return h(VxeUISwitchComponent, {
74
+ modelValue: widget.required,
75
+ 'onUpdate:modelValue' (val: any) {
76
+ widget.required = val
77
+ }
78
+ })
79
+ }
80
+ })
81
+ ]
82
+ }
83
+ })
84
+ }
85
+ }
86
+ })
87
+
88
+ const WidgetADatePickerViewComponent = defineComponent({
89
+ props: {
90
+ renderOpts: {
91
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
92
+ default: () => ({})
93
+ },
94
+ renderParams: {
95
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetADatePickerFormObjVO>>,
96
+ default: () => ({})
97
+ }
98
+ },
99
+ emits: [],
100
+ setup (props) {
101
+ const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
102
+
103
+ const changeEvent = () => {
104
+ const { renderParams } = props
105
+ const { widget, $formView } = renderParams
106
+ if ($formView) {
107
+ const itemValue = $formView ? $formView.getItemValue(widget) : null
108
+ $formView.updateItemStatus(widget, itemValue)
109
+ }
110
+ }
111
+
112
+ return () => {
113
+ const { renderParams } = props
114
+ const { widget, $formView } = renderParams
115
+ const { options } = widget
116
+
117
+ return h(VxeUIFormItemComponent, {
118
+ class: ['vxe-form-design--widget-render-form-item'],
119
+ field: widget.field,
120
+ title: widget.title
121
+ }, {
122
+ default () {
123
+ return h(resolveComponent('a-date-picker') as ComponentOptions, {
124
+ value: $formView ? $formView.getItemValue(widget) : null,
125
+ placeholder: options.placeholder,
126
+ onChange: changeEvent,
127
+ 'onUpdate:value' (val: any) {
128
+ if ($formView) {
129
+ $formView.setItemValue(widget, val)
130
+ }
131
+ }
132
+ })
133
+ }
134
+ })
135
+ }
136
+ }
137
+ })
138
+
139
+ return {
140
+ getWidgetADatePickerConfig,
141
+ WidgetADatePickerFormComponent,
142
+ WidgetADatePickerViewComponent
143
+ }
144
+ }