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