vxe-pc-ui 4.0.91 → 4.0.93

package/es/form/src/form-config-item.js

@@ -33,13 +33,13 @@ const VxeFormConfigItem = defineComponent({
             const titleSlot = slots ? slots.title : null;
             const span = item.span || allSpan;
             const align = item.align || allAlign;
+            const itemVertical = XEUtils.eqNull(vertical) ? allVertical : vertical;
             const titleBold = XEUtils.eqNull(item.titleBold) ? allTitleBold : item.titleBold;
             const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign;
-            const titleWidth = XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth;
+            const titleWidth = itemVertical ? null : (XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth);
             const titleColon = XEUtils.eqNull(item.titleColon) ? allTitleColon : item.titleColon;
             const titleAsterisk = XEUtils.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk;
             const itemOverflow = XEUtils.eqNull(titleOverflow) ? allTitleOverflow : titleOverflow;
-            const itemVertical = XEUtils.eqNull(vertical) ? allVertical : vertical;
             const ovEllipsis = itemOverflow === 'ellipsis';
             const ovTitle = itemOverflow === 'title';
             const ovTooltip = itemOverflow === true || itemOverflow === 'tooltip';

package/es/form/src/form-item.js

@@ -93,13 +93,13 @@ export default defineComponent({
             const titleSlot = slots ? slots.title : null;
             const span = item.span || props.span;
             const align = item.align || props.align;
+            const itemVertical = XEUtils.eqNull(vertical) ? allVertical : vertical;
             const titleBold = XEUtils.eqNull(item.titleBold) ? allTitleBold : item.titleBold;
             const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign;
-            const titleWidth = XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth;
+            const titleWidth = itemVertical ? null : (XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth);
             const titleColon = XEUtils.eqNull(item.titleColon) ? allTitleColon : item.titleColon;
             const titleAsterisk = XEUtils.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk;
             const itemOverflow = XEUtils.eqNull(titleOverflow) ? allTitleOverflow : titleOverflow;
-            const itemVertical = XEUtils.eqNull(vertical) ? allVertical : vertical;
             const ovEllipsis = itemOverflow === 'ellipsis';
             const ovTitle = itemOverflow === 'title';
             const ovTooltip = itemOverflow === true || itemOverflow === 'tooltip';

package/es/form/src/form.js

@@ -493,11 +493,13 @@ export default defineComponent({
                 return nextTick();
             }
             let fields = [];
-            if (XEUtils.isArray(fieldOrItem)) {
-                fields = fieldOrItem;
-            }
-            else {
-                fields = [fieldOrItem];
+            if (fieldOrItem) {
+                if (XEUtils.isArray(fieldOrItem)) {
+                    fields = fieldOrItem;
+                }
+                else {
+                    fields = [fieldOrItem];
+                }
             }
             return beginValidate(fields.map(field => handleFieldOrItem($xeForm, field)), '', callback);
         };

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

@@ -92,7 +92,7 @@ export default defineComponent({
             return XEUtils.clone(reactData.formData, true);
         };
         const loadFormConfig = (data) => {
-            reactData.formData = Object.assign({}, data);
+            reactData.formData = Object.assign({}, createSettingForm(), data);
             return nextTick();
         };
         const getWidgetData = () => {
@@ -127,7 +127,7 @@ export default defineComponent({
             },
             clearConfig() {
                 reactData.widgetObjList = [];
-                createSettingForm();
+                initSettingForm();
                 return nextTick();
             },
             loadConfig,
@@ -301,7 +301,10 @@ export default defineComponent({
                 const createFormConfig = compConf ? compConf.createFormDesignSettingFormConfig : null;
                 formData = (createFormConfig ? createFormConfig({}) : {}) || {};
             }
-            reactData.formData = formData;
+            return formData;
+        };
+        const initSettingForm = () => {
+            reactData.formData = createSettingForm();
         };
         const openStylePreviewEvent = () => {
             openStyleSetting();
@@ -367,7 +370,7 @@ export default defineComponent({
         watch(() => props.config, (value) => {
             loadConfig(value || {});
         });
-        createSettingForm();
+        initSettingForm();
         updateWidgetConfigs();
         if (props.config) {
             loadConfig(props.config);

package/es/form-design/src/form-view.js

@@ -124,7 +124,7 @@ export default defineComponent({
                 { required: true, content: '该填写该字段！' }
             ];
         };
-        const updateItemStatus = (widget, value) => {
+        const updateWidgetStatus = (widget, value) => {
             const { field } = widget;
             const $form = formRef.value;
             if ($form) {
@@ -154,6 +154,17 @@ export default defineComponent({
         const dispatchEvent = (type, params, evnt) => {
             emit(type, createEvent(evnt, { $formView: $xeFormView }, params));
         };
+        const toWidgetFields = (widget) => {
+            if (widget) {
+                if (XEUtils.isArray(widget)) {
+                    return widget.map(item => item.name);
+                }
+                else {
+                    return [widget.name];
+                }
+            }
+            return null;
+        };
         const formViewMethods = {
             dispatchEvent,
             clearConfig,
@@ -161,9 +172,42 @@ export default defineComponent({
             parseConfig,
             loadFormConfig,
             loadWidgetData,
-            updateItemStatus,
+            updateWidgetStatus,
             setItemValue,
-            getItemValue
+            getItemValue,
+            validate() {
+                const $form = formRef.value;
+                if ($form) {
+                    return $form.validate();
+                }
+                return nextTick();
+            },
+            validateWidget(widget) {
+                const $form = formRef.value;
+                if ($form) {
+                    return $form.validateField(toWidgetFields(widget));
+                }
+                return nextTick();
+            },
+            clearValidate(widget) {
+                const $form = formRef.value;
+                if ($form) {
+                    return $form.clearValidate(toWidgetFields(widget));
+                }
+                return nextTick();
+            },
+            reset() {
+                const $form = formRef.value;
+                if ($form) {
+                    return $form.reset();
+                }
+                return nextTick();
+            },
+            /**
+             * 已废弃
+             * @deprecated
+             */
+            updateItemStatus: updateWidgetStatus
         };
         const handleSubmit = (params) => {
             dispatchEvent('submit', params, params.$event);

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

@@ -1,7 +1,7 @@
 import { createCommentVNode, defineComponent, h, inject, ref, reactive, provide } from 'vue';
 import { getIcon, getI18n, renderer } from '@vxe-ui/core';
 import { getSlotVNs } from '../../ui/src/vn';
-import VxeDrawerComponent from '../../drawer/src/drawer';
+import VxeModalComponent from '../../modal/src/modal';
 import VxeTabsComponent from '../../tabs/src/tabs';
 import VxeTabPaneComponent from '../../tabs/src/tab-pane';
 import VxeFormViewComponent from './form-view';
@@ -156,13 +156,15 @@ export default defineComponent({
         };
         const renderVN = () => {
             const { showPc, showMobile } = formDesignProps;
-            return h(VxeDrawerComponent, {
+            return h(VxeModalComponent, {
                 modelValue: settingVisible.value,
                 title: getI18n('vxe.formDesign.styleSetting.title'),
                 height: '90vh',
+                width: '90vw',
+                escClosable: true,
                 maskClosable: true,
                 destroyOnClose: true,
-                position: 'bottom',
+                showMaximize: true,
                 'onUpdate:modelValue'(val) {
                     settingVisible.value = val;
                 }

package/es/form-design/src/use/index.js

@@ -0,0 +1,4 @@
+export * from './widget-name';
+export * from './widget-view';
+export * from './widget-prop-data-source';
+export * from './widget-prop-default-value';

package/es/form-design/src/use/widget-name.js

@@ -0,0 +1,11 @@
+import { computed } from 'vue';
+import XEUtils from 'xe-utils';
+export function useWidgetName(props) {
+    const computeKebabCaseName = computed(() => {
+        const { renderOpts } = props;
+        return renderOpts ? XEUtils.kebabCase(renderOpts.name) : '';
+    });
+    return {
+        computeKebabCaseName
+    };
+}

package/es/form-design/src/{use.js → use/widget-prop-data-source.js}

@@ -1,10 +1,9 @@
-import { h, onMounted, computed, ref, watch } from 'vue';
+import { h, onMounted, ref, watch } from 'vue';
 import { VxeUI, getIcon, getI18n } from '@vxe-ui/core';
-import VxeFormItemComponent from '../../form/src/form-item';
-import VxeButtonComponent from '../../button/src/button';
-import VxeTextareaComponent from '../../textarea/src/textarea';
-import VxeTipComponent from '../../tip/src/tip';
-import XEUtils from 'xe-utils';
+import VxeFormItemComponent from '../../../form/src/form-item';
+import VxeButtonComponent from '../../../button/src/button';
+import VxeTextareaComponent from '../../../textarea/src/textarea';
+import VxeTipComponent from '../../../tip/src/tip';
 export function useWidgetPropDataSource(props, isSubOption) {
     const optionsContent = ref('');
     const expandIndexList = ref([]);
@@ -42,6 +41,19 @@ export function useWidgetPropDataSource(props, isSubOption) {
             expandIndexList.value.push(gIndex);
         }
     };
+    const removeOptionEvent = (item, group) => {
+        const { renderParams } = props;
+        const { widget } = renderParams;
+        const { options } = widget;
+        if (group) {
+            if (group.options) {
+                group.options = group.options.filter(obj => obj !== item);
+            }
+        }
+        else {
+            options.options = options.options.filter(obj => obj !== item);
+        }
+    };
     const confirmBatchAddOptionEvent = () => {
         const { renderParams } = props;
         const { widget } = renderParams;
@@ -131,7 +143,8 @@ export function useWidgetPropDataSource(props, isSubOption) {
             }
         });
     };
-    const renderOption = (item, hasFirstLevel, isExpand, gIndex, hasSub, isFirst, isLast) => {
+    const renderOption = (item, group, isExpand, gIndex, hasSub, isFirst, isLast) => {
+        const hasFirstLevel = !group;
         return h('div', {
             class: ['vxe-form-design--widget-form-item-data-source-option', {
                     'is--first': isFirst,
@@ -160,7 +173,10 @@ export function useWidgetPropDataSource(props, isSubOption) {
             h(VxeButtonComponent, {
                 status: 'danger',
                 mode: 'text',
-                icon: getIcon().FORM_DESIGN_WIDGET_DELETE
+                icon: getIcon().FORM_DESIGN_WIDGET_DELETE,
+                onClick() {
+                    removeOptionEvent(item, group);
+                }
             })
         ]);
     };
@@ -175,15 +191,15 @@ export function useWidgetPropDataSource(props, isSubOption) {
                 const { options } = group;
                 const isExpand = expandIndexList.value.includes(gIndex);
                 if (options && options.length) {
-                    optVNs.push(renderOption(group, true, isExpand, gIndex, true, gIndex === 0, gIndex === groups.length - 1));
+                    optVNs.push(renderOption(group, null, isExpand, gIndex, true, gIndex === 0, gIndex === groups.length - 1));
                     if (isExpand) {
                         optVNs.push(h('div', {
                             class: 'vxe-form-design--widget-form-item-data-source-sub-option'
-                        }, options.map(item => renderOption(item, false, isExpand, 0, false, false, false))));
+                        }, options.map(item => renderOption(item, group, isExpand, 0, false, false, false))));
                     }
                 }
                 else {
-                    optVNs.push(renderOption(group, true, isExpand, gIndex, false, gIndex === 0, gIndex === groups.length - 1));
+                    optVNs.push(renderOption(group, null, isExpand, gIndex, false, gIndex === 0, gIndex === groups.length - 1));
                 }
             });
         }
@@ -226,36 +242,3 @@ export function useWidgetPropDataSource(props, isSubOption) {
         }
     };
 }
-export function useWidgetName(props) {
-    const computeKebabCaseName = computed(() => {
-        const { renderOpts } = props;
-        return renderOpts ? XEUtils.kebabCase(renderOpts.name) : '';
-    });
-    return {
-        computeKebabCaseName
-    };
-}
-export function useWidgetView(props) {
-    const currWidget = computed(() => {
-        const { renderParams } = props;
-        return renderParams.widget;
-    });
-    const widgetModel = computed({
-        get() {
-            const { renderParams } = props;
-            const { $formView, widget } = renderParams;
-            return $formView ? $formView.getItemValue(widget) : null;
-        },
-        set(value) {
-            const { renderParams } = props;
-            const { $formView, widget } = renderParams;
-            if ($formView) {
-                $formView.setItemValue(widget, value);
-            }
-        }
-    });
-    return {
-        currWidget,
-        widgetModel
-    };
-}

package/es/form-design/src/use/widget-prop-default-value.js

@@ -0,0 +1,38 @@
+import { h, ref } from 'vue';
+import VxeFormItemComponent from '../../../form/src/form-item';
+import VxeSelectComponent from '../../../select/src/select';
+import VxeInputComponent from '../../../input/src/input';
+export function useWidgetPropDefaultValue(props) {
+    const defValOptions = ref([
+        { value: 'custom', label: '自定义' }
+        // { value: 'linkage', label: '数据联动' }
+    ]);
+    return {
+        renderDefaultValueFormItem() {
+            const { renderParams } = props;
+            const { widget } = renderParams;
+            const { defaultValue } = widget.options;
+            return h(VxeFormItemComponent, {
+                title: '默认值'
+            }, {
+                default() {
+                    return [
+                        h(VxeSelectComponent, {
+                            modelValue: defaultValue.type,
+                            options: defValOptions.value,
+                            'onUpdate:modelValue'(val) {
+                                defaultValue.type = val;
+                            }
+                        }),
+                        h(VxeInputComponent, {
+                            modelValue: defaultValue.value,
+                            'onUpdate:modelValue'(val) {
+                                defaultValue.value = val;
+                            }
+                        })
+                    ];
+                }
+            });
+        }
+    };
+}

package/es/form-design/src/use/widget-view.js

@@ -0,0 +1,25 @@
+import { computed } from 'vue';
+export function useWidgetView(props) {
+    const currWidget = computed(() => {
+        const { renderParams } = props;
+        return renderParams.widget;
+    });
+    const widgetModel = computed({
+        get() {
+            const { renderParams } = props;
+            const { $formView, widget } = renderParams;
+            return $formView ? $formView.getItemValue(widget) : null;
+        },
+        set(value) {
+            const { renderParams } = props;
+            const { $formView, widget } = renderParams;
+            if ($formView) {
+                $formView.setItemValue(widget, value);
+            }
+        }
+    });
+    return {
+        currWidget,
+        widgetModel
+    };
+}

package/es/form-design/style.css

@@ -1,5 +1,4 @@
-.vxe-form-design--widget-form-empty-data,
-.vxe-list-design--widget-form-empty-data {
+.vxe-form-design--widget-form-empty-data {
   text-align: center;
   color: var(--vxe-ui-input-placeholder-color);
   border: 1px solid var(--vxe-ui-input-border-color);

package/es/form-design/style.min.css

@@ -1 +1 @@
-.vxe-form-design--widget-form-empty-data,.vxe-list-design--widget-form-empty-data{text-align:center;color:var(--vxe-ui-input-placeholder-color);border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);padding:var(--vxe-ui-layout-padding-double)}.vxe-form-design--widget-row-form-row{border:1px solid var(--vxe-ui-input-border-color);margin-bottom:var(--vxe-ui-layout-padding-default);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer}.vxe-form-design--widget-row-form-row:hover{border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design--widget-row-form-row.is--active{border-color:var(--vxe-ui-font-primary-color);color:var(--vxe-ui-layout-background-color)}.vxe-form-design--widget-row-form-row.is--active .vxe-form-design--widget-row-form-col div{background:var(--vxe-ui-font-primary-color)}.vxe-form-design--widget-row-form-col{padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-row-form-col>div{line-height:24px;background:var(--vxe-ui-font-tinge-color);text-align:center;border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--widget-row-view{position:relative;min-height:100%;padding:var(--vxe-ui-layout-padding-default);border:1px solid transparent;cursor:grabbing}.vxe-form-design--widget-row-view::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-row-view:hover{background-color:var(--vxe-ui-form-design-sub-widget-hover-background-color)}.vxe-form-design--widget-row-view:hover .vxe-form-design--widget-row-view-empty{background-color:transparent}.vxe-form-design--widget-row-view.is--active{border:1px dashed var(--vxe-ui-font-primary-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-row-view.is--drag,.vxe-form-design--widget-row-view.is--sort{background-color:var(--vxe-ui-base-drag-background-color)}.vxe-form-design--widget-row-view-empty{display:flex;flex-direction:row;align-items:center;justify-content:center;height:78px;padding:var(--vxe-ui-layout-padding-default);color:var(--vxe-ui-font-placeholder-color);border:2px dashed var(--vxe-ui-input-border-color);font-size:.95em;background-color:var(--vxe-ui-layout-background-color)}.vxe-form-design--preview-item.widget-row::after,.vxe-form-design--preview-item.widget-subtable::after{display:none}.vxe-form-design--preview-item.widget-row{padding:var(--vxe-ui-layout-padding-default) 0}.vxe-form-design--widget-subtable-view{display:flex;flex-direction:row;max-width:100%;border-radius:var(--vxe-ui-base-border-radius);overflow-y:hidden;overflow-x:auto}.vxe-form-design--widget-subtable-view-box{border:1px solid var(--vxe-ui-input-border-color);border-width:1px 1px 1px 0;display:inline-flex;flex-direction:row;flex-wrap:nowrap}.vxe-form-design--widget-subtable-view-left{position:sticky;left:0;top:0;display:flex;flex-shrink:0;padding-top:var(--vxe-ui-layout-padding-default);box-shadow:8px 0 10px -5px rgba(0,0,0,.12);border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius);z-index:5}.vxe-form-design--widget-subtable-view-right{flex-grow:1;padding-top:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-col{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;min-width:54px;text-align:center;border-top:1px solid var(--vxe-ui-input-border-color);border-right:1px solid var(--vxe-ui-input-border-color);border-bottom:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-form-design--widget-subtable-col:first-child{border-left:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius)}.vxe-form-design--widget-subtable-col::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-subtable-head{flex-shrink:0;height:2.8em;line-height:2.8em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 var(--vxe-ui-layout-padding-default);border-bottom:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-subtable-body{flex-grow:1;padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-body,.vxe-form-design--widget-subtable-head{width:100%}.vxe-form-design--widget-subtable-body,.vxe-form-design--widget-subtable-view-empty{display:flex;flex-direction:row;align-items:center;justify-content:center}.vxe-form-design--widget-subtable-view-wrapper{display:flex;flex-direction:row;border:1px solid var(--vxe-ui-input-border-color);border-left:0;background-color:var(--vxe-ui-layout-background-color);border-radius:0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0}.vxe-form-design--widget-subtable-view-list{display:flex;flex-direction:row;flex-wrap:nowrap}.vxe-form-design--widget-subtable-view-list>.vxe-form-design--widget-subtable-view-item{border-right:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-subtable-view-list-move{transition:transform .35s ease-in-out}.vxe-form-design--widget-subtable-view-item{position:relative;min-width:200px;cursor:grabbing}.vxe-form-design--widget-subtable-view-item:hover{background:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-subtable-view-item.is--active{background:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-subtable-view-item.is--active::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border:1px dashed var(--vxe-ui-font-primary-color);pointer-events:none;z-index:2}.vxe-form-design--widget-subtable-view-item-box{height:100%}.vxe-form-design--widget-subtable-view-item-box::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-subtable-view-empty{flex-grow:1;color:var(--vxe-ui-font-placeholder-color);padding:0 var(--vxe-ui-layout-padding-threefold);min-height:78px;min-width:260px;cursor:default}.vxe-form-design--widget-subtable-form-item{overflow:hidden}.vxe-form-design--widget-subtable-form-item>.vxe-form--item-inner{overflow:hidden}.vxe-form-design--widget-subtable-form-item>.vxe-form--item-inner>.vxe-form--item-content{overflow:hidden}.vxe-form-design--widget-subtable-view-item-wrapper{height:100%}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical{padding:0}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical .vxe-form--item-title{height:2.8em;line-height:2.8em;padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical .vxe-form--item-content{display:flex;flex-direction:row;align-items:center;justify-content:center;padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item-title{border-bottom:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design .vxe-form-design--widget-form-item-devices{display:flex;flex-direction:column}.vxe-form-design .vxe-form-design--widget-form-item-layout{display:flex;flex-direction:row}.vxe-form-design .vxe-form-design--widget-form-item-option{width:50%;text-align:center;padding:var(--vxe-ui-layout-padding-default);margin:0 var(--vxe-ui-layout-padding-default);border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row{display:flex;flex-direction:column}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row:nth-child(1)::before{content:"";display:block;width:30%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{content:"";display:block;width:100%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row{display:flex;flex-direction:row}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(1)::before,.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{content:"";display:block;width:30%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(1)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(2)::after{content:"";display:block;width:70%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option:hover{border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--active{color:var(--vxe-ui-font-primary-color);border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(1)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(1)::before,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(2)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{background-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option-row{margin-bottom:.2em}.vxe-form-design--widget-form-item-data-source{max-height:30vh;min-height:140px;overflow:auto}.vxe-form-design--widget-form-item-data-source-option{position:relative;display:flex;flex-direction:row;padding:var(--vxe-ui-layout-padding-half) 0}.vxe-form-design--widget-form-item-data-source-option::before{content:"";position:absolute;top:0;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:100%;border:1px dotted var(--vxe-ui-base-popup-border-color);border-width:0 0 0 1px}.vxe-form-design--widget-form-item-data-source-option::after{content:"";position:absolute;top:50%;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:0;border-top:1px dotted var(--vxe-ui-base-popup-border-color)}.vxe-form-design--widget-form-item-data-source-option.is--first::before{top:50%;height:50%}.vxe-form-design--widget-form-item-data-source-option.is--last::before{height:50%}.vxe-form-design--widget-form-item-data-source-option .vxe-button{flex-shrink:0}.vxe-form-design--widget-form-item-data-source-option .vxe-form-design--widget-expand-btn{display:flex;flex-direction:row;align-items:center;width:2em}.vxe-form-design--widget-form-item-data-source-option .vxe-form-design--widget-expand-btn i{cursor:pointer;background-color:var(--vxe-ui-layout-background-color);transition:transform .1s ease-in-out;z-index:2}.vxe-form-design--widget-form-item-data-source-sub-option{position:relative}.vxe-form-design--widget-form-item-data-source-sub-option::before{content:"";position:absolute;top:0;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:100%;border:1px dotted var(--vxe-ui-base-popup-border-color);border-width:0 0 0 1px}.vxe-form-design--widget-form-item-data-source-sub-option:last-child::before{display:none}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option{padding-left:var(--vxe-ui-layout-padding-double)}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option:first-child::before{top:0;height:50%}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option::before{top:-50%;left:calc(var(--vxe-ui-layout-padding-double) + .5em);width:var(--vxe-ui-layout-padding-default);height:100%}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option::after{left:calc(var(--vxe-ui-layout-padding-double) + .5em)}.vxe-form-design--widget-form-item-data-source-popup{height:100%;display:flex;flex-direction:column;overflow:auto}.vxe-form-design--widget-form-item-data-source-popup>.vxe-textarea{flex-grow:1}.vxe-form-design--widget-form-item-data-source-popup>.vxe-textarea .vxe-textarea--inner{height:100%}.vxe-form-design .vxe-form-design--widget-form-item-prop-list{margin-bottom:var(--vxe-ui-layout-padding-double);padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list:first-child{margin-top:var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span{padding:0 .5em}.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span:first-child{padding:0;padding-right:var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-unit,.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-width,.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span:first-child{display:inline-flex;vertical-align:middle}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-width{width:90px}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-unit{width:90px}.vxe-list-design .vxe-list-design--widget-form-item-prop-list{margin-bottom:var(--vxe-ui-layout-padding-double);padding:0 var(--vxe-ui-layout-padding-default)}.vxe-list-design .vxe-list-design--widget-form-item-prop-list:first-child{margin-top:var(--vxe-ui-layout-padding-default)}.vxe-list-design .vxe-list-design--widget-form-item-prop-list:last-child{margin-bottom:0}.vxe-list-design .vxe-list-design--widget-form-item-prop-list>span{padding:0 .5em}.vxe-list-design .vxe-list-design--widget-form-item-prop-list>span:first-child{padding:0;padding-right:var(--vxe-ui-layout-padding-default)}.vxe-form-design{display:flex;flex-direction:column;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-form-design{font-size:var(--vxe-ui-font-size-default)}.vxe-form-design.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-form-design.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-form-design.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-form-design--body{display:flex;flex-direction:row;flex-grow:1;overflow:hidden}.vxe-form-design--header{flex-shrink:0;padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design--header-wrapper{display:flex;flex-direction:row;align-items:center;width:100%;min-height:3em;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--header-left,.vxe-form-design--header-right{flex-shrink:0}.vxe-form-design--header-middle{flex-grow:1}.vxe-form-design--layout-style{display:flex;flex-direction:row;height:100%;overflow:hidden}.vxe-form-design--layout-style-preview{flex-grow:1;padding-right:var(--vxe-ui-layout-padding-default);overflow:hidden}.vxe-form-design--layout-style-preview>.vxe-form-view{height:100%;width:100%;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);overflow:auto}.vxe-form-design--layout-style-preview.is--mobile>.vxe-form-view{width:400px;margin:0 auto}.vxe-form-design--layout-style-setting{flex-shrink:0;width:300px;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color);z-index:1;overflow:auto}.vxe-form-design--widget{width:280px;flex-shrink:0;overflow:auto}.vxe-form-design--setting,.vxe-form-design--widget{padding:var(--vxe-ui-layout-padding-default);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--setting{width:300px;flex-shrink:0;overflow:auto}.vxe-form-design--preview{flex-grow:1;overflow:auto;padding:var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-half);-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-form-design--preview-wrapper{width:100%;height:100%;overflow:auto;padding:var(--vxe-ui-layout-padding-default) 0;background-color:var(--vxe-ui-layout-background-color);border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-list{display:flex;flex-direction:row;flex-wrap:wrap}.vxe-form-design--widget-title{font-weight:700;padding:var(--vxe-ui-layout-padding-half) 0 var(--vxe-ui-layout-padding-half) var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-group{border-radius:var(--vxe-ui-base-border-radius);padding:var(--vxe-ui-layout-padding-default);margin-bottom:var(--vxe-ui-layout-padding-default);background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-item{width:50%;padding:var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-box{position:relative;height:32px;line-height:32px;font-size:var(--vxe-ui-form-design-widget-item-font-size);padding:0 var(--vxe-ui-layout-padding-half);border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:grabbing;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-form-design--widget-box:hover{border-color:var(--vxe-ui-font-primary-lighten-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-box:hover .vxe-form-design--widget-item-add{display:block}.vxe-form-design--widget-item-icon{padding:0 .2em}.vxe-form-design--widget-item-name{padding-left:var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-item-add{display:none;position:absolute;top:0;right:var(--vxe-ui-layout-padding-default);width:1em;height:100%;cursor:pointer}.vxe-form-design--widget-item-add:hover{color:var(--vxe-ui-font-primary-color)}.vxe-form-design--preview-list{width:100%}.vxe-form-design--preview-list-move{transition:transform .35s ease-in-out}.vxe-form-design--preview-item{position:relative;display:block;padding:var(--vxe-ui-layout-padding-default);border:1px solid transparent;cursor:grabbing}.vxe-form-design--preview-item::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--preview-item:hover{background-color:var(--vxe-ui-form-design-widget-hover-background-color)}.vxe-form-design--preview-item.is--active{border:1px dashed var(--vxe-ui-font-primary-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--preview-item.is--drag,.vxe-form-design--preview-item.is--sort{background-color:var(--vxe-ui-base-drag-background-color)}.vxe-form-design--preview-item-view{width:100%}.vxe-form-design--preview-item-operate{position:absolute;top:calc(var(--vxe-ui-layout-padding-default) * -1);right:var(--vxe-ui-layout-padding-default);z-index:3}.vxe-form-design--setting-form{height:100%;background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--setting-form-tabs{height:100%}
+.vxe-form-design--widget-form-empty-data{text-align:center;color:var(--vxe-ui-input-placeholder-color);border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);padding:var(--vxe-ui-layout-padding-double)}.vxe-form-design--widget-row-form-row{border:1px solid var(--vxe-ui-input-border-color);margin-bottom:var(--vxe-ui-layout-padding-default);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer}.vxe-form-design--widget-row-form-row:hover{border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design--widget-row-form-row.is--active{border-color:var(--vxe-ui-font-primary-color);color:var(--vxe-ui-layout-background-color)}.vxe-form-design--widget-row-form-row.is--active .vxe-form-design--widget-row-form-col div{background:var(--vxe-ui-font-primary-color)}.vxe-form-design--widget-row-form-col{padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-row-form-col>div{line-height:24px;background:var(--vxe-ui-font-tinge-color);text-align:center;border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--widget-row-view{position:relative;min-height:100%;padding:var(--vxe-ui-layout-padding-default);border:1px solid transparent;cursor:grabbing}.vxe-form-design--widget-row-view::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-row-view:hover{background-color:var(--vxe-ui-form-design-sub-widget-hover-background-color)}.vxe-form-design--widget-row-view:hover .vxe-form-design--widget-row-view-empty{background-color:transparent}.vxe-form-design--widget-row-view.is--active{border:1px dashed var(--vxe-ui-font-primary-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-row-view.is--drag,.vxe-form-design--widget-row-view.is--sort{background-color:var(--vxe-ui-base-drag-background-color)}.vxe-form-design--widget-row-view-empty{display:flex;flex-direction:row;align-items:center;justify-content:center;height:78px;padding:var(--vxe-ui-layout-padding-default);color:var(--vxe-ui-font-placeholder-color);border:2px dashed var(--vxe-ui-input-border-color);font-size:.95em;background-color:var(--vxe-ui-layout-background-color)}.vxe-form-design--preview-item.widget-row::after,.vxe-form-design--preview-item.widget-subtable::after{display:none}.vxe-form-design--preview-item.widget-row{padding:var(--vxe-ui-layout-padding-default) 0}.vxe-form-design--widget-subtable-view{display:flex;flex-direction:row;max-width:100%;border-radius:var(--vxe-ui-base-border-radius);overflow-y:hidden;overflow-x:auto}.vxe-form-design--widget-subtable-view-box{border:1px solid var(--vxe-ui-input-border-color);border-width:1px 1px 1px 0;display:inline-flex;flex-direction:row;flex-wrap:nowrap}.vxe-form-design--widget-subtable-view-left{position:sticky;left:0;top:0;display:flex;flex-shrink:0;padding-top:var(--vxe-ui-layout-padding-default);box-shadow:8px 0 10px -5px rgba(0,0,0,.12);border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius);z-index:5}.vxe-form-design--widget-subtable-view-right{flex-grow:1;padding-top:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-col{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;min-width:54px;text-align:center;border-top:1px solid var(--vxe-ui-input-border-color);border-right:1px solid var(--vxe-ui-input-border-color);border-bottom:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color)}.vxe-form-design--widget-subtable-col:first-child{border-left:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius)}.vxe-form-design--widget-subtable-col::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-subtable-head{flex-shrink:0;height:2.8em;line-height:2.8em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 var(--vxe-ui-layout-padding-default);border-bottom:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-subtable-body{flex-grow:1;padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-body,.vxe-form-design--widget-subtable-head{width:100%}.vxe-form-design--widget-subtable-body,.vxe-form-design--widget-subtable-view-empty{display:flex;flex-direction:row;align-items:center;justify-content:center}.vxe-form-design--widget-subtable-view-wrapper{display:flex;flex-direction:row;border:1px solid var(--vxe-ui-input-border-color);border-left:0;background-color:var(--vxe-ui-layout-background-color);border-radius:0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0}.vxe-form-design--widget-subtable-view-list{display:flex;flex-direction:row;flex-wrap:nowrap}.vxe-form-design--widget-subtable-view-list>.vxe-form-design--widget-subtable-view-item{border-right:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-subtable-view-list-move{transition:transform .35s ease-in-out}.vxe-form-design--widget-subtable-view-item{position:relative;min-width:200px;cursor:grabbing}.vxe-form-design--widget-subtable-view-item:hover{background:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-subtable-view-item.is--active{background:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-subtable-view-item.is--active::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border:1px dashed var(--vxe-ui-font-primary-color);pointer-events:none;z-index:2}.vxe-form-design--widget-subtable-view-item-box{height:100%}.vxe-form-design--widget-subtable-view-item-box::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--widget-subtable-view-empty{flex-grow:1;color:var(--vxe-ui-font-placeholder-color);padding:0 var(--vxe-ui-layout-padding-threefold);min-height:78px;min-width:260px;cursor:default}.vxe-form-design--widget-subtable-form-item{overflow:hidden}.vxe-form-design--widget-subtable-form-item>.vxe-form--item-inner{overflow:hidden}.vxe-form-design--widget-subtable-form-item>.vxe-form--item-inner>.vxe-form--item-content{overflow:hidden}.vxe-form-design--widget-subtable-view-item-wrapper{height:100%}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical{padding:0}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical .vxe-form--item-title{height:2.8em;line-height:2.8em;padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item.is--vertical .vxe-form--item-content{display:flex;flex-direction:row;align-items:center;justify-content:center;padding:var(--vxe-ui-layout-padding-default)}.vxe-form-design--widget-subtable-view-item-wrapper .vxe-form--item-title{border-bottom:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design .vxe-form-design--widget-form-item-devices{display:flex;flex-direction:column}.vxe-form-design .vxe-form-design--widget-form-item-layout{display:flex;flex-direction:row}.vxe-form-design .vxe-form-design--widget-form-item-option{width:50%;text-align:center;padding:var(--vxe-ui-layout-padding-default);margin:0 var(--vxe-ui-layout-padding-default);border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);cursor:pointer}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row{display:flex;flex-direction:column}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row:nth-child(1)::before{content:"";display:block;width:30%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--vertical .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{content:"";display:block;width:100%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row{display:flex;flex-direction:row}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(1)::before,.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{content:"";display:block;width:30%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(1)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--horizontal .vxe-form-design--widget-form-item-option-row:nth-child(2)::after{content:"";display:block;width:70%;height:1.2em;margin:2px;background-color:var(--vxe-ui-font-tinge-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design .vxe-form-design--widget-form-item-option:hover{border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--active{color:var(--vxe-ui-font-primary-color);border-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(1)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(1)::before,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(2)::after,.vxe-form-design .vxe-form-design--widget-form-item-option.is--active .vxe-form-design--widget-form-item-option-row:nth-child(2)::before{background-color:var(--vxe-ui-font-primary-color)}.vxe-form-design .vxe-form-design--widget-form-item-option-row{margin-bottom:.2em}.vxe-form-design--widget-form-item-data-source{max-height:30vh;min-height:140px;overflow:auto}.vxe-form-design--widget-form-item-data-source-option{position:relative;display:flex;flex-direction:row;padding:var(--vxe-ui-layout-padding-half) 0}.vxe-form-design--widget-form-item-data-source-option::before{content:"";position:absolute;top:0;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:100%;border:1px dotted var(--vxe-ui-base-popup-border-color);border-width:0 0 0 1px}.vxe-form-design--widget-form-item-data-source-option::after{content:"";position:absolute;top:50%;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:0;border-top:1px dotted var(--vxe-ui-base-popup-border-color)}.vxe-form-design--widget-form-item-data-source-option.is--first::before{top:50%;height:50%}.vxe-form-design--widget-form-item-data-source-option.is--last::before{height:50%}.vxe-form-design--widget-form-item-data-source-option .vxe-button{flex-shrink:0}.vxe-form-design--widget-form-item-data-source-option .vxe-form-design--widget-expand-btn{display:flex;flex-direction:row;align-items:center;width:2em}.vxe-form-design--widget-form-item-data-source-option .vxe-form-design--widget-expand-btn i{cursor:pointer;background-color:var(--vxe-ui-layout-background-color);transition:transform .1s ease-in-out;z-index:2}.vxe-form-design--widget-form-item-data-source-sub-option{position:relative}.vxe-form-design--widget-form-item-data-source-sub-option::before{content:"";position:absolute;top:0;left:var(--vxe-ui-layout-padding-half);width:var(--vxe-ui-layout-padding-default);height:100%;border:1px dotted var(--vxe-ui-base-popup-border-color);border-width:0 0 0 1px}.vxe-form-design--widget-form-item-data-source-sub-option:last-child::before{display:none}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option{padding-left:var(--vxe-ui-layout-padding-double)}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option:first-child::before{top:0;height:50%}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option::before{top:-50%;left:calc(var(--vxe-ui-layout-padding-double) + .5em);width:var(--vxe-ui-layout-padding-default);height:100%}.vxe-form-design--widget-form-item-data-source-sub-option .vxe-form-design--widget-form-item-data-source-option::after{left:calc(var(--vxe-ui-layout-padding-double) + .5em)}.vxe-form-design--widget-form-item-data-source-popup{height:100%;display:flex;flex-direction:column;overflow:auto}.vxe-form-design--widget-form-item-data-source-popup>.vxe-textarea{flex-grow:1}.vxe-form-design--widget-form-item-data-source-popup>.vxe-textarea .vxe-textarea--inner{height:100%}.vxe-form-design .vxe-form-design--widget-form-item-prop-list{margin-bottom:var(--vxe-ui-layout-padding-double);padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list:first-child{margin-top:var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span{padding:0 .5em}.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span:first-child{padding:0;padding-right:var(--vxe-ui-layout-padding-default)}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-unit,.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-width,.vxe-form-design .vxe-form-design--widget-form-item-prop-list>span:first-child{display:inline-flex;vertical-align:middle}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-width{width:90px}.vxe-form-design .vxe-form-design--widget-form-item-prop-list .vxe-form-design--widget-form-item-prop-unit{width:90px}.vxe-list-design .vxe-list-design--widget-form-item-prop-list{margin-bottom:var(--vxe-ui-layout-padding-double);padding:0 var(--vxe-ui-layout-padding-default)}.vxe-list-design .vxe-list-design--widget-form-item-prop-list:first-child{margin-top:var(--vxe-ui-layout-padding-default)}.vxe-list-design .vxe-list-design--widget-form-item-prop-list:last-child{margin-bottom:0}.vxe-list-design .vxe-list-design--widget-form-item-prop-list>span{padding:0 .5em}.vxe-list-design .vxe-list-design--widget-form-item-prop-list>span:first-child{padding:0;padding-right:var(--vxe-ui-layout-padding-default)}.vxe-form-design{display:flex;flex-direction:column;color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family)}.vxe-form-design{font-size:var(--vxe-ui-font-size-default)}.vxe-form-design.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-form-design.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-form-design.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-form-design--body{display:flex;flex-direction:row;flex-grow:1;overflow:hidden}.vxe-form-design--header{flex-shrink:0;padding:0 var(--vxe-ui-layout-padding-default)}.vxe-form-design--header-wrapper{display:flex;flex-direction:row;align-items:center;width:100%;min-height:3em;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--header-left,.vxe-form-design--header-right{flex-shrink:0}.vxe-form-design--header-middle{flex-grow:1}.vxe-form-design--layout-style{display:flex;flex-direction:row;height:100%;overflow:hidden}.vxe-form-design--layout-style-preview{flex-grow:1;padding-right:var(--vxe-ui-layout-padding-default);overflow:hidden}.vxe-form-design--layout-style-preview>.vxe-form-view{height:100%;width:100%;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);overflow:auto}.vxe-form-design--layout-style-preview.is--mobile>.vxe-form-view{width:400px;margin:0 auto}.vxe-form-design--layout-style-setting{flex-shrink:0;width:300px;border:1px solid var(--vxe-ui-input-border-color);border-radius:var(--vxe-ui-base-border-radius);background-color:var(--vxe-ui-layout-background-color);z-index:1;overflow:auto}.vxe-form-design--widget{width:280px;flex-shrink:0;overflow:auto}.vxe-form-design--setting,.vxe-form-design--widget{padding:var(--vxe-ui-layout-padding-default);border-radius:var(--vxe-ui-base-border-radius)}.vxe-form-design--setting{width:300px;flex-shrink:0;overflow:auto}.vxe-form-design--preview{flex-grow:1;overflow:auto;padding:var(--vxe-ui-layout-padding-default) var(--vxe-ui-layout-padding-half);-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-form-design--preview-wrapper{width:100%;height:100%;overflow:auto;padding:var(--vxe-ui-layout-padding-default) 0;background-color:var(--vxe-ui-layout-background-color);border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-list{display:flex;flex-direction:row;flex-wrap:wrap}.vxe-form-design--widget-title{font-weight:700;padding:var(--vxe-ui-layout-padding-half) 0 var(--vxe-ui-layout-padding-half) var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-group{border-radius:var(--vxe-ui-base-border-radius);padding:var(--vxe-ui-layout-padding-default);margin-bottom:var(--vxe-ui-layout-padding-default);background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--widget-item{width:50%;padding:var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-box{position:relative;height:32px;line-height:32px;font-size:var(--vxe-ui-form-design-widget-item-font-size);padding:0 var(--vxe-ui-layout-padding-half);border-radius:var(--vxe-ui-base-border-radius);border:1px solid var(--vxe-ui-input-border-color);background-color:var(--vxe-ui-layout-background-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:grabbing;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vxe-form-design--widget-box:hover{border-color:var(--vxe-ui-font-primary-lighten-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--widget-box:hover .vxe-form-design--widget-item-add{display:block}.vxe-form-design--widget-item-icon{padding:0 .2em}.vxe-form-design--widget-item-name{padding-left:var(--vxe-ui-layout-padding-half)}.vxe-form-design--widget-item-add{display:none;position:absolute;top:0;right:var(--vxe-ui-layout-padding-default);width:1em;height:100%;cursor:pointer}.vxe-form-design--widget-item-add:hover{color:var(--vxe-ui-font-primary-color)}.vxe-form-design--preview-list{width:100%}.vxe-form-design--preview-list-move{transition:transform .35s ease-in-out}.vxe-form-design--preview-item{position:relative;display:block;padding:var(--vxe-ui-layout-padding-default);border:1px solid transparent;cursor:grabbing}.vxe-form-design--preview-item::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.vxe-form-design--preview-item:hover{background-color:var(--vxe-ui-form-design-widget-hover-background-color)}.vxe-form-design--preview-item.is--active{border:1px dashed var(--vxe-ui-font-primary-color);background-color:var(--vxe-ui-base-active-background-color)}.vxe-form-design--preview-item.is--drag,.vxe-form-design--preview-item.is--sort{background-color:var(--vxe-ui-base-drag-background-color)}.vxe-form-design--preview-item-view{width:100%}.vxe-form-design--preview-item-operate{position:absolute;top:calc(var(--vxe-ui-layout-padding-default) * -1);right:var(--vxe-ui-layout-padding-default);z-index:3}.vxe-form-design--setting-form{height:100%;background-color:var(--vxe-ui-layout-background-color);border:1px solid var(--vxe-ui-input-border-color)}.vxe-form-design--setting-form-tabs{height:100%}

package/es/form-design/widget-input/input-view.js

@@ -22,7 +22,7 @@ export const WidgetInputViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-select/select-view.js

@@ -21,7 +21,7 @@ export const WidgetSelectViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         const renderOptions = () => {

package/es/form-design/widget-textarea/textarea-view.js

@@ -22,7 +22,7 @@ export const WidgetTextareaViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-checkbox-group/vxe-checkbox-group-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeCheckboxGroupViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-date-picker/vxe-date-picker-data.js

@@ -4,7 +4,11 @@ export const getWidgetVxeDatePickerConfig = () => {
         title: handleGetFormDesignWidgetName,
         icon: 'vxe-icon-calendar',
         options: {
-            placeholder: ''
+            placeholder: '',
+            defaultValue: {
+                type: '',
+                value: ''
+            }
         }
     };
 };

package/es/form-design/widget-vxe-date-picker/vxe-date-picker-form.js

@@ -19,6 +19,7 @@ export const WidgetVxeDatePickerFormComponent = defineComponent({
     emits: [],
     setup(props) {
         const { computeKebabCaseName } = useWidgetName(props);
+        // const { renderDefaultValueFormItem } = useWidgetPropDefaultValue(props)
         return () => {
             const { renderParams } = props;
             const { widget } = renderParams;
@@ -49,6 +50,7 @@ export const WidgetVxeDatePickerFormComponent = defineComponent({
                             field: 'placeholder',
                             itemRender: { name: 'VxeInput' }
                         }),
+                        // renderDefaultValueFormItem(),
                         h(VxeFormItemComponent, {
                             title: getI18n('vxe.formDesign.widgetProp.required')
                         }, {

package/es/form-design/widget-vxe-date-picker/vxe-date-picker-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeDatePickerViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-input/vxe-input-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeInputViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-number-input/vxe-number-input-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeNumberInputViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-radio-group/vxe-radio-group-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeRadioGroupViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-select/vxe-select-view.js

@@ -23,7 +23,7 @@ export const WidgetVxeSelectViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-switch/vxe-switch-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeSwitchViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {

package/es/form-design/widget-vxe-textarea/vxe-textarea-view.js

@@ -22,7 +22,7 @@ export const WidgetVxeTextareaViewComponent = defineComponent({
             const { widget } = renderParams;
             if ($xeFormView) {
                 const itemValue = $xeFormView ? $xeFormView.getItemValue(widget) : null;
-                $xeFormView.updateItemStatus(widget, itemValue);
+                $xeFormView.updateWidgetStatus(widget, itemValue);
             }
         };
         return () => {