@vxe-ui/plugin-render-antd 4.0.5 → 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.
@@ -1,101 +1,101 @@
1
- import { h } from 'vue'
2
- import { createWidgetAInput } from './input-widget'
3
- import { createWidgetATextarea } from './textarea-widget'
4
- import { createWidgetAInputNumber } from './number-input-widget'
5
- import { createWidgetADatePicker } from './date-picker-widget'
6
- import { createWidgetASelect } from './select-widget'
7
- import { createWidgetARadio } from './radio-widget'
8
- import { createWidgetACheckbox } from './checkbox-widget'
9
- import { createWidgetASwitch } from './switch-widget'
10
-
11
- import type { VxeUIExport } from 'vxe-pc-ui'
12
-
13
- /**
14
- * 表单设计器 - 渲染器
15
- */
16
- export function defineFormDesignRender (VxeUI: VxeUIExport) {
17
- const { getWidgetAInputConfig, WidgetAInputViewComponent, WidgetAInputFormComponent } = createWidgetAInput(VxeUI)
18
- const { getWidgetATextareaConfig, WidgetATextareaViewComponent, WidgetATextareaFormComponent } = createWidgetATextarea(VxeUI)
19
- const { getWidgetAInputNumberConfig, WidgetAInputNumberViewComponent, WidgetAInputNumberFormComponent } = createWidgetAInputNumber(VxeUI)
20
- const { getWidgetADatePickerConfig, WidgetADatePickerViewComponent, WidgetADatePickerFormComponent } = createWidgetADatePicker(VxeUI)
21
- const { getWidgetASelectConfig, WidgetASelectViewComponent, WidgetASelectFormComponent } = createWidgetASelect(VxeUI)
22
- const { getWidgetARadioConfig, WidgetARadioViewComponent, WidgetARadioFormComponent } = createWidgetARadio(VxeUI)
23
- const { getWidgetACheckboxConfig, WidgetACheckboxViewComponent, WidgetACheckboxFormComponent } = createWidgetACheckbox(VxeUI)
24
- const { getWidgetASwitchConfig, WidgetASwitchViewComponent, WidgetASwitchFormComponent } = createWidgetASwitch(VxeUI)
25
-
26
- VxeUI.renderer.mixin({
27
- AInputWidget: {
28
- createFormDesignWidgetConfig: getWidgetAInputConfig,
29
- renderFormDesignWidgetView (renderOpts, renderParams) {
30
- return h(WidgetAInputViewComponent, { renderOpts, renderParams })
31
- },
32
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
33
- return h(WidgetAInputFormComponent, { renderOpts, renderParams })
34
- }
35
- },
36
- ATextareaWidget: {
37
- createFormDesignWidgetConfig: getWidgetATextareaConfig,
38
- renderFormDesignWidgetView (renderOpts, renderParams) {
39
- return h(WidgetATextareaViewComponent, { renderOpts, renderParams })
40
- },
41
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
42
- return h(WidgetATextareaFormComponent, { renderOpts, renderParams })
43
- }
44
- },
45
- ANumberInputWidget: {
46
- createFormDesignWidgetConfig: getWidgetAInputNumberConfig,
47
- renderFormDesignWidgetView (renderOpts, renderParams) {
48
- return h(WidgetAInputNumberViewComponent, { renderOpts, renderParams })
49
- },
50
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
51
- return h(WidgetAInputNumberFormComponent, { renderOpts, renderParams })
52
- }
53
- },
54
- ADatePickerWidget: {
55
- createFormDesignWidgetConfig: getWidgetADatePickerConfig,
56
- renderFormDesignWidgetView (renderOpts, renderParams) {
57
- return h(WidgetADatePickerViewComponent, { renderOpts, renderParams })
58
- },
59
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
60
- return h(WidgetADatePickerFormComponent, { renderOpts, renderParams })
61
- }
62
- },
63
- ASelectWidget: {
64
- createFormDesignWidgetConfig: getWidgetASelectConfig,
65
- renderFormDesignWidgetView (renderOpts, renderParams) {
66
- return h(WidgetASelectViewComponent, { renderOpts, renderParams })
67
- },
68
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
69
- return h(WidgetASelectFormComponent, { renderOpts, renderParams })
70
- }
71
- },
72
- ARadioWidget: {
73
- createFormDesignWidgetConfig: getWidgetARadioConfig,
74
- renderFormDesignWidgetView (renderOpts, renderParams) {
75
- return h(WidgetARadioViewComponent, { renderOpts, renderParams })
76
- },
77
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
78
- return h(WidgetARadioFormComponent, { renderOpts, renderParams })
79
- }
80
- },
81
- ACheckboxWidget: {
82
- createFormDesignWidgetConfig: getWidgetACheckboxConfig,
83
- createFormDesignWidgetFieldValue: () => [],
84
- renderFormDesignWidgetView (renderOpts: any, renderParams: any) {
85
- return h(WidgetACheckboxViewComponent, { renderOpts, renderParams })
86
- },
87
- renderFormDesignWidgetFormView (renderOpts: any, renderParams: any) {
88
- return h(WidgetACheckboxFormComponent, { renderOpts, renderParams })
89
- }
90
- },
91
- ASwitchWidget: {
92
- createFormDesignWidgetConfig: getWidgetASwitchConfig,
93
- renderFormDesignWidgetView (renderOpts, renderParams) {
94
- return h(WidgetASwitchViewComponent, { renderOpts, renderParams })
95
- },
96
- renderFormDesignWidgetFormView (renderOpts, renderParams) {
97
- return h(WidgetASwitchFormComponent, { renderOpts, renderParams })
98
- }
99
- }
100
- })
101
- }
1
+ import { h } from 'vue'
2
+ import { createWidgetAInput } from './input-widget'
3
+ import { createWidgetATextarea } from './textarea-widget'
4
+ import { createWidgetAInputNumber } from './number-input-widget'
5
+ import { createWidgetADatePicker } from './date-picker-widget'
6
+ import { createWidgetASelect } from './select-widget'
7
+ import { createWidgetARadio } from './radio-widget'
8
+ import { createWidgetACheckbox } from './checkbox-widget'
9
+ import { createWidgetASwitch } from './switch-widget'
10
+
11
+ import type { VxeUIExport } from 'vxe-pc-ui'
12
+
13
+ /**
14
+ * 表单设计器 - 渲染器
15
+ */
16
+ export function defineFormDesignRender (VxeUI: VxeUIExport) {
17
+ const { getWidgetAInputConfig, WidgetAInputViewComponent, WidgetAInputFormComponent } = createWidgetAInput(VxeUI)
18
+ const { getWidgetATextareaConfig, WidgetATextareaViewComponent, WidgetATextareaFormComponent } = createWidgetATextarea(VxeUI)
19
+ const { getWidgetAInputNumberConfig, WidgetAInputNumberViewComponent, WidgetAInputNumberFormComponent } = createWidgetAInputNumber(VxeUI)
20
+ const { getWidgetADatePickerConfig, WidgetADatePickerViewComponent, WidgetADatePickerFormComponent } = createWidgetADatePicker(VxeUI)
21
+ const { getWidgetASelectConfig, WidgetASelectViewComponent, WidgetASelectFormComponent } = createWidgetASelect(VxeUI)
22
+ const { getWidgetARadioConfig, WidgetARadioViewComponent, WidgetARadioFormComponent } = createWidgetARadio(VxeUI)
23
+ const { getWidgetACheckboxConfig, WidgetACheckboxViewComponent, WidgetACheckboxFormComponent } = createWidgetACheckbox(VxeUI)
24
+ const { getWidgetASwitchConfig, WidgetASwitchViewComponent, WidgetASwitchFormComponent } = createWidgetASwitch(VxeUI)
25
+
26
+ VxeUI.renderer.mixin({
27
+ AInputWidget: {
28
+ createFormDesignWidgetConfig: getWidgetAInputConfig,
29
+ renderFormDesignWidgetView (renderOpts, renderParams) {
30
+ return h(WidgetAInputViewComponent, { renderOpts, renderParams })
31
+ },
32
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
33
+ return h(WidgetAInputFormComponent, { renderOpts, renderParams })
34
+ }
35
+ },
36
+ ATextareaWidget: {
37
+ createFormDesignWidgetConfig: getWidgetATextareaConfig,
38
+ renderFormDesignWidgetView (renderOpts, renderParams) {
39
+ return h(WidgetATextareaViewComponent, { renderOpts, renderParams })
40
+ },
41
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
42
+ return h(WidgetATextareaFormComponent, { renderOpts, renderParams })
43
+ }
44
+ },
45
+ ANumberInputWidget: {
46
+ createFormDesignWidgetConfig: getWidgetAInputNumberConfig,
47
+ renderFormDesignWidgetView (renderOpts, renderParams) {
48
+ return h(WidgetAInputNumberViewComponent, { renderOpts, renderParams })
49
+ },
50
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
51
+ return h(WidgetAInputNumberFormComponent, { renderOpts, renderParams })
52
+ }
53
+ },
54
+ ADatePickerWidget: {
55
+ createFormDesignWidgetConfig: getWidgetADatePickerConfig,
56
+ renderFormDesignWidgetView (renderOpts, renderParams) {
57
+ return h(WidgetADatePickerViewComponent, { renderOpts, renderParams })
58
+ },
59
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
60
+ return h(WidgetADatePickerFormComponent, { renderOpts, renderParams })
61
+ }
62
+ },
63
+ ASelectWidget: {
64
+ createFormDesignWidgetConfig: getWidgetASelectConfig,
65
+ renderFormDesignWidgetView (renderOpts, renderParams) {
66
+ return h(WidgetASelectViewComponent, { renderOpts, renderParams })
67
+ },
68
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
69
+ return h(WidgetASelectFormComponent, { renderOpts, renderParams })
70
+ }
71
+ },
72
+ ARadioWidget: {
73
+ createFormDesignWidgetConfig: getWidgetARadioConfig,
74
+ renderFormDesignWidgetView (renderOpts, renderParams) {
75
+ return h(WidgetARadioViewComponent, { renderOpts, renderParams })
76
+ },
77
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
78
+ return h(WidgetARadioFormComponent, { renderOpts, renderParams })
79
+ }
80
+ },
81
+ ACheckboxWidget: {
82
+ createFormDesignWidgetConfig: getWidgetACheckboxConfig,
83
+ createFormDesignWidgetFieldValue: () => [],
84
+ renderFormDesignWidgetView (renderOpts: any, renderParams: any) {
85
+ return h(WidgetACheckboxViewComponent, { renderOpts, renderParams })
86
+ },
87
+ renderFormDesignWidgetFormView (renderOpts: any, renderParams: any) {
88
+ return h(WidgetACheckboxFormComponent, { renderOpts, renderParams })
89
+ }
90
+ },
91
+ ASwitchWidget: {
92
+ createFormDesignWidgetConfig: getWidgetASwitchConfig,
93
+ renderFormDesignWidgetView (renderOpts, renderParams) {
94
+ return h(WidgetASwitchViewComponent, { renderOpts, renderParams })
95
+ },
96
+ renderFormDesignWidgetFormView (renderOpts, renderParams) {
97
+ return h(WidgetASwitchFormComponent, { renderOpts, renderParams })
98
+ }
99
+ }
100
+ })
101
+ }
@@ -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 WidgetAInputFormObjVO {
6
- placeholder: string
7
- }
8
-
9
- export function createWidgetAInput (VxeUI: VxeUIExport) {
10
- const getWidgetAInputConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetAInputFormObjVO> => {
11
- return {
12
- title: '输入框',
13
- icon: 'vxe-icon-input',
14
- options: {
15
- placeholder: ''
16
- }
17
- }
18
- }
19
-
20
- const WidgetAInputFormComponent = defineComponent({
21
- props: {
22
- renderOpts: {
23
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
24
- default: () => ({})
25
- },
26
- renderParams: {
27
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetAInputFormObjVO>>,
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
- const { options } = widget
42
-
43
- return h(VxeUIFormComponent, {
44
- class: 'vxe-form-design--widget-render-form-wrapper',
45
- vertical: true,
46
- span: 24,
47
- titleBold: true,
48
- titleOverflow: true,
49
- data: options
50
- }, {
51
- default () {
52
- return [
53
- h(VxeUIFormItemComponent, {
54
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
55
- }, {
56
- default () {
57
- return h(VxeUIInputComponent, {
58
- modelValue: widget.title,
59
- placeholder: options.placeholder,
60
- 'onUpdate:modelValue' (val: any) {
61
- widget.title = val
62
- }
63
- })
64
- }
65
- }),
66
- h(VxeUIFormItemComponent, {
67
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
68
- field: 'placeholder',
69
- itemRender: { name: 'VxeInput' }
70
- }),
71
- h(VxeUIFormItemComponent, {
72
- title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
73
- }, {
74
- default () {
75
- return h(VxeUISwitchComponent, {
76
- modelValue: widget.required,
77
- 'onUpdate:modelValue' (val: any) {
78
- widget.required = val
79
- }
80
- })
81
- }
82
- })
83
- ]
84
- }
85
- })
86
- }
87
- }
88
- })
89
-
90
- const WidgetAInputViewComponent = defineComponent({
91
- props: {
92
- renderOpts: {
93
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
94
- default: () => ({})
95
- },
96
- renderParams: {
97
- type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetAInputFormObjVO>>,
98
- default: () => ({})
99
- }
100
- },
101
- emits: [],
102
- setup (props) {
103
- const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
104
-
105
- const changeEvent = () => {
106
- const { renderParams } = props
107
- const { widget, $formView } = renderParams
108
- if ($formView) {
109
- const itemValue = $formView ? $formView.getItemValue(widget) : null
110
- $formView.updateItemStatus(widget, itemValue)
111
- }
112
- }
113
-
114
- return () => {
115
- const { renderParams } = props
116
- const { widget, $formView } = renderParams
117
-
118
- return h(VxeUIFormItemComponent, {
119
- class: ['vxe-form-design--widget-render-form-item'],
120
- field: widget.field,
121
- title: widget.title
122
- }, {
123
- default () {
124
- return h(resolveComponent('a-input') as ComponentOptions, {
125
- value: $formView ? $formView.getItemValue(widget) : null,
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
- getWidgetAInputConfig,
141
- WidgetAInputFormComponent,
142
- WidgetAInputViewComponent
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 WidgetAInputFormObjVO {
6
+ placeholder: string
7
+ }
8
+
9
+ export function createWidgetAInput (VxeUI: VxeUIExport) {
10
+ const getWidgetAInputConfig = (params: VxeGlobalRendererHandles.CreateFormDesignWidgetConfigParams): VxeGlobalRendererHandles.CreateFormDesignWidgetConfigObj<WidgetAInputFormObjVO> => {
11
+ return {
12
+ title: '输入框',
13
+ icon: 'vxe-icon-input',
14
+ options: {
15
+ placeholder: ''
16
+ }
17
+ }
18
+ }
19
+
20
+ const WidgetAInputFormComponent = defineComponent({
21
+ props: {
22
+ renderOpts: {
23
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewOptions>,
24
+ default: () => ({})
25
+ },
26
+ renderParams: {
27
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetFormViewParams<WidgetAInputFormObjVO>>,
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
+ const { options } = widget
42
+
43
+ return h(VxeUIFormComponent, {
44
+ class: 'vxe-form-design--widget-render-form-wrapper',
45
+ vertical: true,
46
+ span: 24,
47
+ titleBold: true,
48
+ titleOverflow: true,
49
+ data: options
50
+ }, {
51
+ default () {
52
+ return [
53
+ h(VxeUIFormItemComponent, {
54
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.name')
55
+ }, {
56
+ default () {
57
+ return h(VxeUIInputComponent, {
58
+ modelValue: widget.title,
59
+ placeholder: options.placeholder,
60
+ 'onUpdate:modelValue' (val: any) {
61
+ widget.title = val
62
+ }
63
+ })
64
+ }
65
+ }),
66
+ h(VxeUIFormItemComponent, {
67
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.placeholder'),
68
+ field: 'placeholder',
69
+ itemRender: { name: 'VxeInput' }
70
+ }),
71
+ h(VxeUIFormItemComponent, {
72
+ title: VxeUI.getI18n('vxe.formDesign.widgetProp.required')
73
+ }, {
74
+ default () {
75
+ return h(VxeUISwitchComponent, {
76
+ modelValue: widget.required,
77
+ 'onUpdate:modelValue' (val: any) {
78
+ widget.required = val
79
+ }
80
+ })
81
+ }
82
+ })
83
+ ]
84
+ }
85
+ })
86
+ }
87
+ }
88
+ })
89
+
90
+ const WidgetAInputViewComponent = defineComponent({
91
+ props: {
92
+ renderOpts: {
93
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewOptions>,
94
+ default: () => ({})
95
+ },
96
+ renderParams: {
97
+ type: Object as PropType<VxeGlobalRendererHandles.RenderFormDesignWidgetViewParams<WidgetAInputFormObjVO>>,
98
+ default: () => ({})
99
+ }
100
+ },
101
+ emits: [],
102
+ setup (props) {
103
+ const VxeUIFormItemComponent = VxeUI.getComponent<VxeFormItemComponent>('VxeFormItem')
104
+
105
+ const changeEvent = () => {
106
+ const { renderParams } = props
107
+ const { widget, $formView } = renderParams
108
+ if ($formView) {
109
+ const itemValue = $formView ? $formView.getItemValue(widget) : null
110
+ $formView.updateItemStatus(widget, itemValue)
111
+ }
112
+ }
113
+
114
+ return () => {
115
+ const { renderParams } = props
116
+ const { widget, $formView } = renderParams
117
+
118
+ return h(VxeUIFormItemComponent, {
119
+ class: ['vxe-form-design--widget-render-form-item'],
120
+ field: widget.field,
121
+ title: widget.title
122
+ }, {
123
+ default () {
124
+ return h(resolveComponent('a-input') as ComponentOptions, {
125
+ value: $formView ? $formView.getItemValue(widget) : null,
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
+ getWidgetAInputConfig,
141
+ WidgetAInputFormComponent,
142
+ WidgetAInputViewComponent
143
+ }
144
+ }