ele-admin-plus 1.3.0-beta.2 → 1.3.0-beta.3

package/es/ele-pro-form-builder/index.js

@@ -1,9 +1,9 @@
-import { defineComponent, useModel, ref, watch, openBlock, createBlock, withCtx, createVNode, createElementVNode, unref, createSlots, renderList, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import { defineComponent, useModel, ref, computed, watch, openBlock, createBlock, withCtx, createVNode, createElementVNode, unref, createSlots, renderList, renderSlot, normalizeProps, guardReactiveProps } from "vue";
 import { findTree, omit, eachTree } from "../utils/core";
 import { useMobile, useMobileDevice } from "../utils/hook";
 import { setValue } from "../ele-pro-form/util";
 import EleSplitPanel from "../ele-split-panel/index";
-import EleTabs from "../ele-tabs/index";
+import EleTabBar from "../ele-tab-bar/index";
 import ComponentList from "./components/component-list";
 import TemplateList from "./components/template-list";
 import OutlineTree from "./components/outline-tree";
@@ -12,14 +12,23 @@ import BodyForm from "./components/body-form";
 import PropsForm from "./components/props-form";
 import ConfigForm from "./components/config-form";
 import TableToolMenu from "./components/table-tool-menu";
+import ComponentPicker from "./components/component-picker";
 import { proFormBuilderProps, proFormBuilderEmits } from "./props";
-const _hoisted_1 = { class: "ele-pro-form-builder-body-wrapper" };
+const _hoisted_1 = { class: "ele-pro-form-builder-tab-body" };
+const _hoisted_2 = { class: "ele-pro-form-builder-body-wrapper" };
+const _hoisted_3 = { class: "ele-pro-form-builder-tab-body" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{ name: "EleProFormBuilder" },
   __name: "index",
   props: proFormBuilderProps,
   emits: proFormBuilderEmits,
   setup(__props, { emit: __emit }) {
+    const defaultHeaderRightTools = [
+      "import",
+      "export",
+      "clear",
+      "preview"
+    ];
     const props = __props;
     const emit = __emit;
     const [mobile] = useMobile((isMobile) => {
@@ -30,13 +39,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const formProps = useModel(props, "modelValue");
     const leftSideCollapse = ref(mobile.value);
     const rightSideCollapse = ref(mobile.value);
-    const leftTabActive = ref("proFormBuilderComponents");
-    const rightTabActive = ref("proFormBuilderFormProps");
+    const leftTabActive = ref("components");
+    const rightTabActive = ref("formProps");
     const currentFormItemId = ref();
     const currentScreen = ref("pc");
     const historyDataList = ref([]);
     const redoDataList = ref([]);
     const tableToolMenuRef = ref(null);
+    const showAddChildPicker = ref(false);
+    const addParentFormItemId = ref();
+    const headerRightToolNames = computed(() => {
+      if (typeof props.headerTools === "undefined" || props.headerTools === true) {
+        return defaultHeaderRightTools;
+      }
+      if (!props.headerTools) {
+        return [];
+      }
+      return props.headerTools;
+    });
     const setFormPropValue = (field, value) => {
       if (!formProps.value) {
         formProps.value = { items: [] };
@@ -47,27 +67,28 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         setValue(formProps.value, field, value);
       }
     };
-    const getFormItems = (setEmptyIfNull) => {
+    const getFormItems = () => {
       var _a;
-      if (!setEmptyIfNull) {
-        return ((_a = formProps.value) == null ? void 0 : _a.items) || [];
-      }
-      if (!formProps.value) {
-        formProps.value = { items: [] };
-        return [];
-      }
-      if (!formProps.value.items) {
-        formProps.value.items = [];
-        return [];
-      }
-      return formProps.value.items;
+      return ((_a = formProps.value) == null ? void 0 : _a.items) || [];
     };
     const setFormItems = (items) => {
       if (!formProps.value) {
-        formProps.value = { items: items || [] };
-      } else {
-        formProps.value.items = items || [];
+        formProps.value = Object.assign({}, props.proFormInitialProps || {}, {
+          items: items || []
+        });
+        return;
       }
+      const data = formProps.value;
+      if (!data.items && props.proFormInitialProps) {
+        const keys = Object.keys(data).filter(
+          (k) => typeof data[k] !== "undefined"
+        );
+        Object.assign(formProps.value, omit(props.proFormInitialProps, keys), {
+          items: items || []
+        });
+        return;
+      }
+      formProps.value.items = items || [];
     };
     const storeHistory = () => {
       const undoData = JSON.parse(
@@ -143,6 +164,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       updateItems,
       deleteItemIds
     }) => {
+      hideTableTool();
+      showAddChildPicker.value = false;
+      addParentFormItemId.value = void 0;
       if (addItems.length || deleteItemIds.length) {
         storeHistory();
       }
@@ -155,9 +179,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
         if (parentItemId == null) {
           if (index != null) {
-            getFormItems(true).splice(index, 0, item);
+            const items = getFormItems();
+            setFormItems([...items.slice(0, index), item, ...items.slice(index)]);
           } else {
-            getFormItems(true).push(item);
+            setFormItems([...getFormItems(), item]);
           }
           return;
         }
@@ -196,12 +221,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     const handleUpdateItemChildren = (data, parent) => {
+      hideTableTool();
       storeHistory();
       if (!parent) {
         setFormItems(data);
         return;
       }
-      parent.children = data;
+      eachTree(getFormItems(), (item) => {
+        if (item.key === parent.key) {
+          parent.children = data;
+          return false;
+        }
+      });
     };
     const handleUpdateFormItems = (items) => {
       handleUpdateItemChildren(items);
@@ -225,16 +256,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const handleOpenTableTool = (formItemId, el) => {
       tableToolMenuRef.value && tableToolMenuRef.value.openMenu(formItemId, el);
     };
+    const hideTableTool = () => {
+      tableToolMenuRef.value && tableToolMenuRef.value.hideMenu();
+    };
+    const handleOpenComponentPicker = (formItemId) => {
+      showAddChildPicker.value = true;
+      addParentFormItemId.value = formItemId;
+    };
     const handlePreviewFormSubmit = (data) => {
       emit("previewFormSubmit", data);
     };
     watch(currentFormItemId, (formItemId) => {
       if (formItemId != null) {
-        if (rightTabActive.value !== "proFormBuilderItemProps") {
-          rightTabActive.value = "proFormBuilderItemProps";
+        if (rightTabActive.value !== "itemProps") {
+          rightTabActive.value = "itemProps";
         }
-      } else if (!getFormItems().length && rightTabActive.value !== "proFormBuilderFormProps") {
-        rightTabActive.value = "proFormBuilderFormProps";
+      } else if (!getFormItems().length && rightTabActive.value !== "formProps") {
+        rightTabActive.value = "formProps";
       }
     });
     return (_ctx, _cache) => {
@@ -243,7 +281,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         size: "280px",
         allowCollapse: true,
         collapse: leftSideCollapse.value,
-        "onUpdate:collapse": _cache[7] || (_cache[7] = ($event) => leftSideCollapse.value = $event),
+        "onUpdate:collapse": _cache[8] || (_cache[8] = ($event) => leftSideCollapse.value = $event),
         class: "ele-pro-form-builder-wrapper"
       }, {
         body: withCtx(() => [
@@ -257,19 +295,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             class: "ele-pro-form-builder-main-wrapper"
           }, {
             body: withCtx(() => [
-              createElementVNode("div", _hoisted_1, [
+              createElementVNode("div", _hoisted_2, [
                 createVNode(BodyHeader, {
                   currentScreen: currentScreen.value,
                   "onUpdate:currentScreen": _cache[2] || (_cache[2] = ($event) => currentScreen.value = $event),
                   undoDisabled: !historyDataList.value.length,
                   redoDisabled: !redoDataList.value.length,
                   formProps: unref(formProps),
+                  headerTools: headerRightToolNames.value,
                   proFormComponent: _ctx.proFormComponent,
+                  jsonEditerComponent: _ctx.jsonEditerComponent,
                   itemTypeData: _ctx.itemTypeData,
+                  httpRequest: _ctx.httpRequest,
                   onUndo: handleUndo,
                   onRedo: handleRedo,
                   onClear: handleClear,
-                  onPreviewFormSubmit: handlePreviewFormSubmit
+                  onPreviewFormSubmit: handlePreviewFormSubmit,
+                  onImportData: handleImport
                 }, createSlots({ _: 2 }, [
                   renderList(Object.keys(_ctx.$slots), (name) => {
                     return {
@@ -279,7 +321,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       ])
                     };
                   })
-                ]), 1032, ["currentScreen", "undoDisabled", "redoDisabled", "formProps", "proFormComponent", "itemTypeData"]),
+                ]), 1032, ["currentScreen", "undoDisabled", "redoDisabled", "formProps", "headerTools", "proFormComponent", "jsonEditerComponent", "itemTypeData", "httpRequest"]),
                 createVNode(BodyForm, {
                   formProps: unref(formProps),
                   componentData: _ctx.componentData,
@@ -288,6 +330,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   currentScreen: currentScreen.value,
                   proFormComponent: _ctx.proFormComponent,
                   itemTypeData: _ctx.itemTypeData,
+                  httpRequest: _ctx.httpRequest,
                   onUpdateItems: handleUpdateItems,
                   onOpenTableTool: handleOpenTableTool,
                   onUpdateFormItems: handleUpdateFormItems
@@ -300,121 +343,123 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       ])
                     };
                   })
-                ]), 1032, ["formProps", "componentData", "currentFormItemId", "currentScreen", "proFormComponent", "itemTypeData"])
+                ]), 1032, ["formProps", "componentData", "currentFormItemId", "currentScreen", "proFormComponent", "itemTypeData", "httpRequest"])
               ])
             ]),
             default: withCtx(() => [
-              createVNode(EleTabs, {
-                flexTable: true,
+              createVNode(EleTabBar, {
                 modelValue: rightTabActive.value,
-                "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => rightTabActive.value = $event),
+                "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => rightTabActive.value = $event),
                 items: [
-                  { name: "proFormBuilderItemProps", label: "属性设置" },
-                  { name: "proFormBuilderFormProps", label: "表单设置" }
-                ],
-                class: "ele-pro-form-builder-right-wrapper"
-              }, {
-                proFormBuilderItemProps: withCtx(() => [
-                  createVNode(PropsForm, {
-                    formProps: unref(formProps),
-                    currentFormItemId: currentFormItemId.value,
-                    "onUpdate:currentFormItemId": _cache[4] || (_cache[4] = ($event) => currentFormItemId.value = $event),
-                    configFormPresetProps: _ctx.configFormPresetProps,
-                    componentData: _ctx.componentData,
-                    proFormComponent: _ctx.proFormComponent,
-                    itemTypeData: _ctx.itemTypeData,
-                    onUpdateItem: updateFormItemProp,
-                    onUpdateItems: handleUpdateItems,
-                    onSortItemChildren: handleSortItemChildren
-                  }, createSlots({ _: 2 }, [
-                    renderList(Object.keys(_ctx.$slots), (name) => {
-                      return {
-                        name,
-                        fn: withCtx((slotProps) => [
-                          renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps || {})))
-                        ])
-                      };
-                    })
-                  ]), 1032, ["formProps", "currentFormItemId", "configFormPresetProps", "componentData", "proFormComponent", "itemTypeData"])
-                ]),
-                proFormBuilderFormProps: withCtx(() => [
-                  createVNode(ConfigForm, {
-                    formProps: unref(formProps),
-                    configFormItems: _ctx.configFormItems,
-                    configFormPresetProps: _ctx.configFormPresetProps,
-                    proFormComponent: _ctx.proFormComponent,
-                    itemTypeData: _ctx.itemTypeData,
-                    onUpdateFormProp: handleUpdateFormProp
-                  }, createSlots({ _: 2 }, [
-                    renderList(Object.keys(_ctx.$slots), (name) => {
-                      return {
-                        name,
-                        fn: withCtx((slotProps) => [
-                          renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps || {})))
-                        ])
-                      };
-                    })
-                  ]), 1032, ["formProps", "configFormItems", "configFormPresetProps", "proFormComponent", "itemTypeData"])
-                ]),
-                _: 3
-              }, 8, ["modelValue"])
+                  { value: "itemProps", label: "属性设置" },
+                  { value: "formProps", label: "表单设置" }
+                ]
+              }, null, 8, ["modelValue"]),
+              createElementVNode("div", _hoisted_3, [
+                rightTabActive.value === "itemProps" ? (openBlock(), createBlock(PropsForm, {
+                  key: 0,
+                  formProps: unref(formProps),
+                  currentFormItemId: currentFormItemId.value,
+                  "onUpdate:currentFormItemId": _cache[5] || (_cache[5] = ($event) => currentFormItemId.value = $event),
+                  configFormPresetProps: _ctx.configFormPresetProps,
+                  componentData: _ctx.componentData,
+                  proFormComponent: _ctx.proFormComponent,
+                  codeEditerComponent: _ctx.codeEditerComponent,
+                  jsonEditerComponent: _ctx.jsonEditerComponent,
+                  htmlEditerComponent: _ctx.htmlEditerComponent,
+                  itemTypeData: _ctx.itemTypeData,
+                  httpRequest: _ctx.httpRequest,
+                  onUpdateItem: updateFormItemProp,
+                  onUpdateItems: handleUpdateItems,
+                  onSortItemChildren: handleSortItemChildren,
+                  onOpenComponentPicker: handleOpenComponentPicker
+                }, createSlots({ _: 2 }, [
+                  renderList(Object.keys(_ctx.$slots), (name) => {
+                    return {
+                      name,
+                      fn: withCtx((slotProps) => [
+                        renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps || {})))
+                      ])
+                    };
+                  })
+                ]), 1032, ["formProps", "currentFormItemId", "configFormPresetProps", "componentData", "proFormComponent", "codeEditerComponent", "jsonEditerComponent", "htmlEditerComponent", "itemTypeData", "httpRequest"])) : (openBlock(), createBlock(ConfigForm, {
+                  key: 1,
+                  formProps: unref(formProps),
+                  configFormItems: _ctx.configFormItems,
+                  configFormPresetProps: _ctx.configFormPresetProps,
+                  proFormComponent: _ctx.proFormComponent,
+                  jsonEditerComponent: _ctx.jsonEditerComponent,
+                  itemTypeData: _ctx.itemTypeData,
+                  httpRequest: _ctx.httpRequest,
+                  onUpdateFormProp: handleUpdateFormProp
+                }, createSlots({ _: 2 }, [
+                  renderList(Object.keys(_ctx.$slots), (name) => {
+                    return {
+                      name,
+                      fn: withCtx((slotProps) => [
+                        renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotProps || {})))
+                      ])
+                    };
+                  })
+                ]), 1032, ["formProps", "configFormItems", "configFormPresetProps", "proFormComponent", "jsonEditerComponent", "itemTypeData", "httpRequest"]))
+              ])
             ]),
             _: 3
           }, 8, ["collapse"])
         ]),
         default: withCtx(() => {
-          var _a;
+          var _a, _b, _c, _d;
           return [
-            createVNode(EleTabs, {
-              flexTable: true,
+            createVNode(EleTabBar, {
               modelValue: leftTabActive.value,
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => leftTabActive.value = $event),
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => leftTabActive.value = $event),
               items: [
-                { name: "proFormBuilderComponents", label: "组件库" },
-                { name: "proFormBuilderTemplates", label: "模板库" },
-                { name: "proFormBuilderOutlines", label: "大纲" }
-              ],
-              class: "ele-pro-form-builder-left-wrapper"
-            }, {
-              proFormBuilderComponents: withCtx(() => {
-                var _a2;
-                return [
-                  createVNode(ComponentList, {
-                    formItems: (_a2 = unref(formProps)) == null ? void 0 : _a2.items,
-                    draggable: !unref(mobileDevice) && !unref(mobile),
-                    componentData: _ctx.componentData,
-                    onUpdateItems: handleUpdateItems
-                  }, null, 8, ["formItems", "draggable", "componentData"])
-                ];
-              }),
-              proFormBuilderTemplates: withCtx(() => [
-                createVNode(TemplateList, {
-                  templateData: _ctx.templateData,
-                  onImportData: handleImport
-                }, null, 8, ["templateData"])
-              ]),
-              proFormBuilderOutlines: withCtx(() => {
-                var _a2;
-                return [
-                  createVNode(OutlineTree, {
-                    formItems: (_a2 = unref(formProps)) == null ? void 0 : _a2.items,
-                    currentFormItemId: currentFormItemId.value,
-                    "onUpdate:currentFormItemId": _cache[0] || (_cache[0] = ($event) => currentFormItemId.value = $event),
-                    componentData: _ctx.componentData,
-                    onUpdateItems: handleUpdateItems,
-                    onUpdateItemChildren: handleUpdateItemChildren,
-                    onOpenTableTool: handleOpenTableTool
-                  }, null, 8, ["formItems", "currentFormItemId", "componentData"])
-                ];
-              }),
-              _: 1
-            }, 8, ["modelValue"]),
+                { value: "components", label: "组件库" },
+                { value: "templates", label: "模板库" },
+                { value: "outlines", label: "大纲" }
+              ]
+            }, null, 8, ["modelValue"]),
+            createElementVNode("div", _hoisted_1, [
+              leftTabActive.value === "outlines" ? (openBlock(), createBlock(OutlineTree, {
+                key: 0,
+                formItems: (_a = unref(formProps)) == null ? void 0 : _a.items,
+                currentFormItemId: currentFormItemId.value,
+                "onUpdate:currentFormItemId": _cache[1] || (_cache[1] = ($event) => currentFormItemId.value = $event),
+                componentData: _ctx.componentData,
+                itemTypeData: _ctx.itemTypeData,
+                onUpdateItems: handleUpdateItems,
+                onUpdateItemChildren: handleUpdateItemChildren,
+                onOpenTableTool: handleOpenTableTool,
+                onOpenComponentPicker: handleOpenComponentPicker
+              }, null, 8, ["formItems", "currentFormItemId", "componentData", "itemTypeData"])) : leftTabActive.value === "templates" ? (openBlock(), createBlock(TemplateList, {
+                key: 1,
+                templateData: _ctx.templateData,
+                onImportData: handleImport
+              }, null, 8, ["templateData"])) : (openBlock(), createBlock(ComponentList, {
+                key: 2,
+                formItems: (_b = unref(formProps)) == null ? void 0 : _b.items,
+                draggable: !unref(mobileDevice) && !unref(mobile),
+                componentData: _ctx.componentData,
+                itemTypeData: _ctx.itemTypeData,
+                onUpdateItems: handleUpdateItems
+              }, null, 8, ["formItems", "draggable", "componentData", "itemTypeData"]))
+            ]),
             createVNode(TableToolMenu, {
               ref_key: "tableToolMenuRef",
               ref: tableToolMenuRef,
-              formItems: (_a = unref(formProps)) == null ? void 0 : _a.items,
+              formItems: (_c = unref(formProps)) == null ? void 0 : _c.items,
+              componentData: _ctx.componentData,
+              onUpdateItems: handleUpdateItems
+            }, null, 8, ["formItems", "componentData"]),
+            createVNode(ComponentPicker, {
+              modelValue: showAddChildPicker.value,
+              "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => showAddChildPicker.value = $event),
+              addParentFormItemId: addParentFormItemId.value,
+              formItems: (_d = unref(formProps)) == null ? void 0 : _d.items,
+              componentData: _ctx.componentData,
+              itemTypeData: _ctx.itemTypeData,
               onUpdateItems: handleUpdateItems
-            }, null, 8, ["formItems"])
+            }, null, 8, ["modelValue", "addParentFormItemId", "formItems", "componentData", "itemTypeData"])
           ];
         }),
         _: 3

package/es/ele-pro-form-builder/props.d.ts

@@ -1,7 +1,7 @@
 import { PropType, ExtractPropTypes } from 'vue';
 import { UserComponent } from '../ele-app/types';
 import { ProFormItemProps, ProFormItemTypeData } from '../ele-pro-form/types';
-import { TemplateFormConfig, ComponentGroup, TemplateItem } from './types';
+import { TemplateFormConfig, TemplateFormProps, ComponentGroup, TemplateItem, HeaderRightToolName } from './types';
 
 /**
  * 属性
@@ -9,6 +9,11 @@ import { TemplateFormConfig, ComponentGroup, TemplateItem } from './types';
 export declare const proFormBuilderProps: {
     /** 配置数据 */
     modelValue: PropType<TemplateFormConfig>;
+    /** 顶栏右侧操作按钮顺序 */
+    headerTools: {
+        type: PropType<boolean | HeaderRightToolName[]>;
+        default: () => boolean;
+    };
     /** 组件库数据 */
     componentData: PropType<ComponentGroup[]>;
     /** 模板库数据 */
@@ -16,11 +21,21 @@ export declare const proFormBuilderProps: {
     /** 表单属性设置的表单项配置 */
     configFormItems: PropType<ProFormItemProps[]>;
     /** 表单属性设置的组件预设属性值 */
-    configFormPresetProps: PropType<Record<string, any>>;
+    configFormPresetProps: PropType<TemplateFormProps>;
+    /** 初始添加时的表单属性 */
+    proFormInitialProps: PropType<TemplateFormProps>;
     /** 高级表单组件 */
     proFormComponent: PropType<UserComponent>;
+    /** 代码编辑器组件 */
+    codeEditerComponent: PropType<UserComponent>;
+    /** JSON 编辑器组件 */
+    jsonEditerComponent: PropType<UserComponent>;
+    /** 富文本编辑器组件 */
+    htmlEditerComponent: PropType<UserComponent>;
     /** 高级表单组件类型数据 */
     itemTypeData: PropType<ProFormItemTypeData[]>;
+    /** 远程数据源请求工具 */
+    httpRequest: (ObjectConstructor | FunctionConstructor)[];
 };
 export type ProFormBuilderProps = ExtractPropTypes<typeof proFormBuilderProps>;
 /**

package/es/ele-pro-form-builder/props.js

@@ -1,6 +1,11 @@
 const proFormBuilderProps = {
   /** 配置数据 */
   modelValue: Object,
+  /** 顶栏右侧操作按钮顺序 */
+  headerTools: {
+    type: [Boolean, Array],
+    default: () => true
+  },
   /** 组件库数据 */
   componentData: Array,
   /** 模板库数据 */
@@ -9,10 +14,20 @@ const proFormBuilderProps = {
   configFormItems: Array,
   /** 表单属性设置的组件预设属性值 */
   configFormPresetProps: Object,
+  /** 初始添加时的表单属性 */
+  proFormInitialProps: Object,
   /** 高级表单组件 */
   proFormComponent: [String, Object, Function],
+  /** 代码编辑器组件 */
+  codeEditerComponent: [String, Object, Function],
+  /** JSON 编辑器组件 */
+  jsonEditerComponent: [String, Object, Function],
+  /** 富文本编辑器组件 */
+  htmlEditerComponent: [String, Object, Function],
   /** 高级表单组件类型数据 */
-  itemTypeData: Array
+  itemTypeData: Array,
+  /** 远程数据源请求工具 */
+  httpRequest: [Object, Function]
 };
 const proFormBuilderEmits = {
   "update:modelValue": (_config) => true,

package/es/ele-pro-form-builder/style/index.js

@@ -1,3 +1,13 @@
+import "element-plus/es/components/empty/style/index";
 import "element-plus/es/components/icon/style/index";
+import "element-plus/es/components/button/style/index";
+import "element-plus/es/components/input/style/index";
+import "element-plus/es/components/switch/style/index";
+import "../../ele-split-panel/style/index";
+import "../../ele-tab-bar/style/index";
 import "../../ele-pro-form/style/index";
+import "../../ele-modal/style/index";
+import "../../ele-tree-table/style/index";
+import "../../ele-select/style/index";
+import "../../ele-dropdown/style/index";
 import "./index.scss";