vxe-pc-ui 4.6.49 → 4.7.0

package/es/form-design/render/index.js

@@ -1,215 +0,0 @@
-import { h } from 'vue';
-import { renderer } from '@vxe-ui/core';
-import { getWidgetTextConfig, WidgetTextViewComponent, WidgetTextFormComponent } from '../widget-text';
-import { getWidgetRowConfig, WidgetRowEditComponent, WidgetRowViewComponent, WidgetRowFormComponent } from '../widget-row';
-import { getWidgetSubtableConfig, WidgetSubtableEditComponent, WidgetSubtableViewComponent, WidgetSubtableFormComponent } from '../widget-subtable';
-import { getWidgetInputConfig, WidgetInputViewComponent, WidgetInputFormComponent } from '../widget-input';
-import { getWidgetTextareaConfig, WidgetTextareaViewComponent, WidgetTextareaFormComponent } from '../widget-textarea';
-import { getWidgetSelectConfig, WidgetSelectViewComponent, WidgetSelectFormComponent } from '../widget-select';
-import { getWidgetVxeInputConfig, WidgetVxeInputViewComponent, WidgetVxeInputFormComponent } from '../widget-vxe-input';
-import { getWidgetVxeNumberInputConfig, WidgetVxeNumberInputViewComponent, WidgetVxeNumberInputFormComponent } from '../widget-vxe-number-input';
-import { getWidgetVxeDatePickerConfig, WidgetVxeDatePickerViewComponent, WidgetVxeDatePickerFormComponent } from '../widget-vxe-date-picker';
-import { getWidgetVxeTextareaConfig, WidgetVxeTextareaViewComponent, WidgetVxeTextareaFormComponent } from '../widget-vxe-textarea';
-import { getWidgetVxeSwitchConfig, WidgetVxeSwitchViewComponent, WidgetVxeSwitchFormComponent } from '../widget-vxe-switch';
-import { getWidgetVxeSelectConfig, WidgetVxeSelectViewComponent, WidgetVxeSelectFormComponent } from '../widget-vxe-select';
-import { getWidgetVxeTreeSelectConfig, WidgetVxeTreeSelectViewComponent, WidgetVxeTreeSelectFormComponent } from '../widget-vxe-tree-select';
-import { getWidgetVxeRadioGroupConfig, WidgetVxeRadioGroupViewComponent, WidgetVxeRadioGroupFormComponent } from '../widget-vxe-radio-group';
-import { getWidgetVxeCheckboxGroupConfig, WidgetVxeCheckboxGroupViewComponent, WidgetVxeCheckboxGroupFormComponent } from '../widget-vxe-checkbox-group';
-import { getWidgetVxeUploadFileConfig, WidgetVxeUploadFileViewComponent, WidgetVxeUploadFileFormComponent } from '../widget-vxe-upload-file';
-import { getWidgetVxeUploadImageConfig, WidgetVxeUploadImageViewComponent, WidgetVxeUploadImageFormComponent } from '../widget-vxe-upload-image';
-import { getWidgetVxeRateConfig, WidgetVxeRateViewComponent, WidgetVxeRateFormComponent } from '../widget-vxe-rate';
-import { getWidgetVxeSliderConfig, WidgetVxeSliderViewComponent, WidgetVxeSliderFormComponent } from '../widget-vxe-slider';
-/**
- * 表单设计器 - 渲染器
- */
-renderer.mixin({
-    text: {
-        createFormDesignWidgetConfig: getWidgetTextConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetTextViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetTextFormComponent, { renderOpts, renderParams });
-        }
-    },
-    /**
-     * 已废弃
-     */
-    title: {
-        createFormDesignWidgetConfig: getWidgetTextConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetTextViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetTextFormComponent, { renderOpts, renderParams });
-        }
-    },
-    row: {
-        createFormDesignWidgetConfig: getWidgetRowConfig,
-        renderFormDesignWidgetEdit(renderOpts, renderParams) {
-            return h(WidgetRowEditComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetRowViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetRowFormComponent, { renderOpts, renderParams });
-        }
-    },
-    subtable: {
-        createFormDesignWidgetConfig: getWidgetSubtableConfig,
-        renderFormDesignWidgetEdit(renderOpts, renderParams) {
-            return h(WidgetSubtableEditComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetSubtableViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetSubtableFormComponent, { renderOpts, renderParams });
-        }
-    },
-    input: {
-        createFormDesignWidgetConfig: getWidgetInputConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetInputViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetInputFormComponent, { renderOpts, renderParams });
-        }
-    },
-    textarea: {
-        createFormDesignWidgetConfig: getWidgetTextareaConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetTextareaViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetTextareaFormComponent, { renderOpts, renderParams });
-        }
-    },
-    select: {
-        createFormDesignWidgetConfig: getWidgetSelectConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetSelectViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetSelectFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeInput: {
-        createFormDesignWidgetConfig: getWidgetVxeInputConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeInputViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeInputFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeNumberInput: {
-        createFormDesignWidgetConfig: getWidgetVxeNumberInputConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeNumberInputViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeNumberInputFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeDatePicker: {
-        createFormDesignWidgetConfig: getWidgetVxeDatePickerConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeDatePickerViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeDatePickerFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeTextarea: {
-        createFormDesignWidgetConfig: getWidgetVxeTextareaConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeTextareaViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeTextareaFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeSwitch: {
-        createFormDesignWidgetConfig: getWidgetVxeSwitchConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeSwitchViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeSwitchFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeSelect: {
-        createFormDesignWidgetConfig: getWidgetVxeSelectConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeSelectViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeSelectFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeTreeSelect: {
-        createFormDesignWidgetConfig: getWidgetVxeTreeSelectConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeTreeSelectViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeTreeSelectFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeRadioGroup: {
-        createFormDesignWidgetConfig: getWidgetVxeRadioGroupConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeRadioGroupViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeRadioGroupFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeCheckboxGroup: {
-        createFormDesignWidgetConfig: getWidgetVxeCheckboxGroupConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeCheckboxGroupViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeCheckboxGroupFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeUploadFile: {
-        createFormDesignWidgetConfig: getWidgetVxeUploadFileConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeUploadFileViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeUploadFileFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeUploadImage: {
-        createFormDesignWidgetConfig: getWidgetVxeUploadImageConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeUploadImageViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeUploadImageFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeRate: {
-        createFormDesignWidgetConfig: getWidgetVxeRateConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeRateViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeRateFormComponent, { renderOpts, renderParams });
-        }
-    },
-    VxeSlider: {
-        createFormDesignWidgetConfig: getWidgetVxeSliderConfig,
-        renderFormDesignWidgetView(renderOpts, renderParams) {
-            return h(WidgetVxeSliderViewComponent, { renderOpts, renderParams });
-        },
-        renderFormDesignWidgetFormView(renderOpts, renderParams) {
-            return h(WidgetVxeSliderFormComponent, { renderOpts, renderParams });
-        }
-    }
-});

package/es/form-design/render/util.js

@@ -1,7 +0,0 @@
-import { getI18n } from '@vxe-ui/core';
-export const getFormDesignWidgetName = (name) => {
-    return getI18n(`vxe.formDesign.widget.component.${name}`);
-};
-export const handleGetFormDesignWidgetName = (params) => {
-    return getFormDesignWidgetName(params.name);
-};

package/es/form-design/src/default-setting-data.js

@@ -1,39 +0,0 @@
-export const getDefaultSettingFormData = (defOpts) => {
-    return {
-        title: '',
-        pcVisible: defOpts ? !!defOpts.pcVisible : true,
-        pcVertical: true,
-        pcTitleBold: true,
-        pcTitleColon: false,
-        pcTitleAlign: '',
-        pcTitleWidth: '',
-        pcTitleWidthUnit: '',
-        mobileVisible: defOpts ? !!defOpts.mobileVisible : true,
-        mobileVertical: true,
-        mobileTitleBold: true,
-        mobileTitleColon: false,
-        mobileTitleAlign: '',
-        mobileTitleWidth: '',
-        mobileTitleWidthUnit: ''
-    };
-};
-export const createDefaultFormViewPCFormConfig = (params) => {
-    const { formConfig } = params;
-    return {
-        vertical: formConfig.pcVertical,
-        titleBold: formConfig.pcTitleBold,
-        titleColon: formConfig.pcTitleColon,
-        titleAlign: formConfig.pcTitleAlign,
-        titleWidth: formConfig.pcTitleWidth
-    };
-};
-export const createDefaultFormViewMobileFormConfig = (params) => {
-    const { formConfig } = params;
-    return {
-        vertical: formConfig.mobileVertical,
-        titleBold: formConfig.mobileTitleBold,
-        titleColon: formConfig.mobileTitleColon,
-        titleAlign: formConfig.mobileTitleAlign,
-        titleWidth: formConfig.mobileTitleWidth
-    };
-};

package/es/form-design/src/default-setting-form.js

@@ -1,90 +0,0 @@
-import { h, inject, createCommentVNode } from 'vue';
-import { defineVxeComponent } from '../../ui/src/comp';
-import { getIcon, getI18n } from '../../ui';
-import VxeFormComponent from '../../form/src/form';
-import VxeFormItemComponent from '../../form/src/form-item';
-import VxeSwitchComponent from '../../switch/src/switch';
-import VxeTextComponent from '../../text/src/text';
-export const DefaultSettingFormComponent = defineVxeComponent({
-    name: 'DefaultSettingForm',
-    props: {
-        formData: {
-            type: Object,
-            default: () => ({})
-        }
-    },
-    emits: [],
-    setup(props) {
-        const $xeFormDesign = inject('$xeFormDesign', null);
-        if (!$xeFormDesign) {
-            return () => [];
-        }
-        const { props: formDesignProps } = $xeFormDesign;
-        return () => {
-            const { formData } = props;
-            return h(VxeFormComponent, {
-                data: formData,
-                span: 24,
-                vertical: true,
-                titleBold: true
-            }, {
-                default() {
-                    const { showPc, showMobile } = formDesignProps;
-                    return [
-                        h(VxeFormItemComponent, {
-                            title: getI18n('vxe.formDesign.formName'),
-                            field: 'title',
-                            itemRender: { name: 'VxeInput', props: { placeholder: getI18n('vxe.formDesign.defFormTitle') } }
-                        }),
-                        showPc && showMobile
-                            ? h(VxeFormItemComponent, {
-                                title: getI18n('vxe.formDesign.widgetProp.displaySetting.name')
-                            }, {
-                                default() {
-                                    return [
-                                        h('div', {
-                                            class: 'vxe-form-design--widget-form-item-devices'
-                                        }, [
-                                            h('div', {
-                                                class: 'vxe-form-design--widget-form-item-pc'
-                                            }, [
-                                                h(VxeTextComponent, {
-                                                    icon: getIcon().FORM_DESIGN_PROPS_PC,
-                                                    content: getI18n('vxe.formDesign.widgetProp.displaySetting.pc')
-                                                }),
-                                                h(VxeSwitchComponent, {
-                                                    modelValue: formData.pcVisible,
-                                                    openLabel: getI18n('vxe.formDesign.widgetProp.displaySetting.visible'),
-                                                    closeLabel: getI18n('vxe.formDesign.widgetProp.displaySetting.hidden'),
-                                                    'onUpdate:modelValue'(val) {
-                                                        formData.pcVisible = val;
-                                                    }
-                                                })
-                                            ]),
-                                            h('div', {
-                                                class: 'vxe-form-design--widget-form-item-mobile'
-                                            }, [
-                                                h(VxeTextComponent, {
-                                                    icon: getIcon().FORM_DESIGN_PROPS_MOBILE,
-                                                    content: getI18n('vxe.formDesign.widgetProp.displaySetting.mobile')
-                                                }),
-                                                h(VxeSwitchComponent, {
-                                                    modelValue: formData.mobileVisible,
-                                                    openLabel: getI18n('vxe.formDesign.widgetProp.displaySetting.visible'),
-                                                    closeLabel: getI18n('vxe.formDesign.widgetProp.displaySetting.hidden'),
-                                                    'onUpdate:modelValue'(val) {
-                                                        formData.mobileVisible = val;
-                                                    }
-                                                })
-                                            ])
-                                        ])
-                                    ];
-                                }
-                            })
-                            : createCommentVNode()
-                    ];
-                }
-            });
-        };
-    }
-});

package/es/form-design/src/default-style-form.js

@@ -1,320 +0,0 @@
-import { h, ref, inject, createCommentVNode } from 'vue';
-import { defineVxeComponent } from '../../ui/src/comp';
-import { getI18n } from '@vxe-ui/core';
-import VxeFormComponent from '../../form/src/form';
-import VxeFormItemComponent from '../../form/src/form-item';
-import VxeInputComponent from '../../input/src/input';
-import VxeRadioGroupComponent from '../../radio/src/group';
-import VxeSelectGroupComponent from '../../select/src/select';
-const getBoldOptions = () => {
-    return [
-        { label: getI18n('vxe.formDesign.styleSetting.fontNormal'), value: false },
-        { label: getI18n('vxe.formDesign.styleSetting.fontBold'), value: true }
-    ];
-};
-const getColonOptions = () => {
-    return [
-        { label: getI18n('vxe.formDesign.styleSetting.colonVisible'), value: true },
-        { label: getI18n('vxe.formDesign.styleSetting.colonHidden'), value: false }
-    ];
-};
-const getAlignOptions = () => {
-    return [
-        { label: getI18n('vxe.formDesign.styleSetting.alignLeft'), value: '' },
-        { label: getI18n('vxe.formDesign.styleSetting.alignRight'), value: 'right' }
-    ];
-};
-const getWidthUnitOptions = () => {
-    return [
-        { label: getI18n('vxe.formDesign.styleSetting.unitPx'), value: '' },
-        { label: getI18n('vxe.formDesign.styleSetting.unitPct'), value: '%' }
-    ];
-};
-const renderLayoutOption = (formData, field, type, changeEvent) => {
-    const isVertical = type === 'vertical';
-    return h('div', {
-        class: ['vxe-form-design--widget-form-item-option', `is--${type}`, {
-                'is--active': isVertical ? formData[field] : !formData[field]
-            }],
-        onClick() {
-            formData[field] = isVertical;
-            changeEvent();
-        }
-    }, [
-        h('div', {
-            class: 'vxe-form-design--widget-form-item-option-row'
-        }),
-        h('div', {
-            class: 'vxe-form-design--widget-form-item-option-row'
-        }),
-        h('div', {}, isVertical ? getI18n('vxe.formDesign.styleSetting.verticalLayout') : getI18n('vxe.formDesign.styleSetting.horizontalLayout'))
-    ]);
-};
-export const DefaultPCStyleFormComponent = defineVxeComponent({
-    name: 'DefaultPCStyleForm',
-    props: {
-        formData: {
-            type: Object,
-            default: () => ({})
-        }
-    },
-    emits: [],
-    setup(props) {
-        const $xeFormDesign = inject('$xeFormDesign', null);
-        const verticalField = 'pcVertical';
-        const refBoldOpts = ref(getBoldOptions());
-        const refColonOpts = ref(getColonOptions());
-        const refAlignOpts = ref(getAlignOptions());
-        const refWidthUnitOpts = ref(getWidthUnitOptions());
-        const refreshPreview = () => {
-            if ($xeFormDesign) {
-                $xeFormDesign.refreshPreviewView();
-            }
-        };
-        const changeLayoutEvent = () => {
-            const { formData } = props;
-            if (!formData.pcTitleWidth) {
-                formData.pcTitleWidth = 100;
-            }
-            refreshPreview();
-        };
-        return () => {
-            const { formData } = props;
-            return h(VxeFormComponent, {
-                data: formData,
-                span: 24,
-                vertical: true,
-                titleBold: true
-            }, {
-                default() {
-                    return [
-                        h(VxeFormItemComponent, {
-                            title: getI18n('vxe.formDesign.styleSetting.layoutTitle'),
-                            field: verticalField
-                        }, {
-                            default() {
-                                return [
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-layout'
-                                    }, [
-                                        renderLayoutOption(formData, verticalField, 'vertical', changeLayoutEvent),
-                                        renderLayoutOption(formData, verticalField, 'horizontal', changeLayoutEvent)
-                                    ])
-                                ];
-                            }
-                        }),
-                        h(VxeFormItemComponent, {
-                            title: getI18n('vxe.formDesign.styleSetting.styleTitle')
-                        }, {
-                            default() {
-                                return [
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-prop-list'
-                                    }, [
-                                        h('span', {}, getI18n('vxe.formDesign.styleSetting.boldTitle')),
-                                        h(VxeRadioGroupComponent, {
-                                            modelValue: formData.pcTitleBold,
-                                            options: refBoldOpts.value,
-                                            onChange: refreshPreview,
-                                            'onUpdate:modelValue'(val) {
-                                                formData.pcTitleBold = val;
-                                            }
-                                        })
-                                    ]),
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-prop-list'
-                                    }, [
-                                        h('span', {}, getI18n('vxe.formDesign.styleSetting.colonTitle')),
-                                        h(VxeRadioGroupComponent, {
-                                            modelValue: formData.pcTitleColon,
-                                            options: refColonOpts.value,
-                                            onChange: refreshPreview,
-                                            'onUpdate:modelValue'(val) {
-                                                formData.pcTitleColon = val;
-                                            }
-                                        })
-                                    ]),
-                                    formData.pcVertical
-                                        ? createCommentVNode()
-                                        : h('div', {
-                                            class: 'vxe-form-design--widget-form-item-prop-list'
-                                        }, [
-                                            h('span', {}, getI18n('vxe.formDesign.styleSetting.alignTitle')),
-                                            h(VxeRadioGroupComponent, {
-                                                modelValue: formData.pcTitleAlign,
-                                                options: refAlignOpts.value,
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.pcTitleAlign = val;
-                                                }
-                                            })
-                                        ]),
-                                    formData.pcVertical
-                                        ? createCommentVNode()
-                                        : h('div', {
-                                            class: 'vxe-form-design--widget-form-item-prop-list'
-                                        }, [
-                                            h('span', {}, getI18n('vxe.formDesign.styleSetting.widthTitle')),
-                                            h(VxeInputComponent, {
-                                                class: 'vxe-form-design--widget-form-item-prop-width',
-                                                modelValue: formData.pcTitleWidth,
-                                                type: 'integer',
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.pcTitleWidth = val;
-                                                }
-                                            }),
-                                            h(VxeSelectGroupComponent, {
-                                                class: 'vxe-form-design--widget-form-item-prop-unit',
-                                                modelValue: formData.pcTitleWidthUnit,
-                                                options: refWidthUnitOpts.value,
-                                                transfer: true,
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.pcTitleWidthUnit = val;
-                                                }
-                                            })
-                                        ])
-                                ];
-                            }
-                        })
-                    ];
-                }
-            });
-        };
-    }
-});
-export const DefaultMobileStyleFormComponent = defineVxeComponent({
-    name: 'DefaultMobileStyleForm',
-    props: {
-        formData: {
-            type: Object,
-            default: () => ({})
-        }
-    },
-    emits: [],
-    setup(props) {
-        const $xeFormDesign = inject('$xeFormDesign', null);
-        const verticalField = 'mobileVertical';
-        const refBoldOpts = ref(getBoldOptions());
-        const refColonOpts = ref(getColonOptions());
-        const refAlignOpts = ref(getAlignOptions());
-        const refWidthUnitOpts = ref(getWidthUnitOptions());
-        const refreshPreview = () => {
-            if ($xeFormDesign) {
-                $xeFormDesign.refreshPreviewView();
-            }
-        };
-        const changeLayoutEvent = () => {
-            const { formData } = props;
-            if (!formData.mobileTitleWidth) {
-                formData.mobileTitleWidth = 100;
-            }
-            refreshPreview();
-        };
-        return () => {
-            const { formData } = props;
-            return h(VxeFormComponent, {
-                data: formData,
-                span: 24,
-                vertical: true,
-                titleBold: true
-            }, {
-                default() {
-                    return [
-                        h(VxeFormItemComponent, {
-                            title: getI18n('vxe.formDesign.styleSetting.layoutTitle'),
-                            field: verticalField
-                        }, {
-                            default() {
-                                return [
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-layout'
-                                    }, [
-                                        renderLayoutOption(formData, verticalField, 'vertical', changeLayoutEvent),
-                                        renderLayoutOption(formData, verticalField, 'horizontal', changeLayoutEvent)
-                                    ])
-                                ];
-                            }
-                        }),
-                        h(VxeFormItemComponent, {
-                            title: getI18n('vxe.formDesign.styleSetting.styleTitle')
-                        }, {
-                            default() {
-                                return [
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-prop-list'
-                                    }, [
-                                        h('span', {}, getI18n('vxe.formDesign.styleSetting.boldTitle')),
-                                        h(VxeRadioGroupComponent, {
-                                            modelValue: formData.mobileTitleBold,
-                                            options: refBoldOpts.value,
-                                            onChange: refreshPreview,
-                                            'onUpdate:modelValue'(val) {
-                                                formData.mobileTitleBold = val;
-                                            }
-                                        })
-                                    ]),
-                                    h('div', {
-                                        class: 'vxe-form-design--widget-form-item-prop-list'
-                                    }, [
-                                        h('span', {}, getI18n('vxe.formDesign.styleSetting.colonTitle')),
-                                        h(VxeRadioGroupComponent, {
-                                            modelValue: formData.mobileTitleColon,
-                                            options: refColonOpts.value,
-                                            onChange: refreshPreview,
-                                            'onUpdate:modelValue'(val) {
-                                                formData.mobileTitleColon = val;
-                                            }
-                                        })
-                                    ]),
-                                    formData.mobileVertical
-                                        ? createCommentVNode()
-                                        : h('div', {
-                                            class: 'vxe-form-design--widget-form-item-prop-list'
-                                        }, [
-                                            h('span', {}, getI18n('vxe.formDesign.styleSetting.alignTitle')),
-                                            h(VxeRadioGroupComponent, {
-                                                modelValue: formData.mobileTitleAlign,
-                                                options: refAlignOpts.value,
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.mobileTitleAlign = val;
-                                                }
-                                            })
-                                        ]),
-                                    formData.mobileVertical
-                                        ? createCommentVNode()
-                                        : h('div', {
-                                            class: 'vxe-form-design--widget-form-item-prop-list'
-                                        }, [
-                                            h('span', {}, getI18n('vxe.formDesign.styleSetting.widthTitle')),
-                                            h(VxeInputComponent, {
-                                                class: 'vxe-form-design--widget-form-item-prop-width',
-                                                modelValue: formData.mobileTitleWidth,
-                                                type: 'integer',
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.mobileTitleWidth = val;
-                                                }
-                                            }),
-                                            h(VxeSelectGroupComponent, {
-                                                class: 'vxe-form-design--widget-form-item-prop-unit',
-                                                modelValue: formData.mobileTitleWidthUnit,
-                                                options: refWidthUnitOpts.value,
-                                                transfer: true,
-                                                onChange: refreshPreview,
-                                                'onUpdate:modelValue'(val) {
-                                                    formData.mobileTitleWidthUnit = val;
-                                                }
-                                            })
-                                        ])
-                                ];
-                            }
-                        })
-                    ];
-                }
-            });
-        };
-    }
-});