@dt-frames/ui 2.0.0 → 2.0.2

package/es/components/form/index.js

@@ -0,0 +1,1895 @@
+import { RadioButton, RadioGroup, Button, FormItem as FormItem$1, Col as Col$1, Row, Form as Form$1 } from "ant-design-vue/es";
+import "ant-design-vue/es/form/style";
+import { toRaw as toRaw$1, unref as unref$1, computed as computed$1, getCurrentInstance, reactive as reactive$1, readonly, watchEffect, nextTick as nextTick$1, defineComponent as defineComponent$1, openBlock, createBlock, mergeProps, isRef, withCtx, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString, useAttrs as useAttrs$1, createElementVNode, createVNode, normalizeProps, guardReactiveProps, createCommentVNode, isVNode, resolveDirective, normalizeStyle, withDirectives, normalizeClass, withKeys, createSlots, renderSlot } from "vue";
+import { DtCache, CacheKey, deepMerge, Pages, useGo, useRedo, Language, useAppStore, isNumber, useI18n, isString, isFunction, error, useSlots, isArray, isBoolean, isNull, dispatchResize, isObject, isNullAndUnDef, useTimeoutFn } from "@dt-frames/core";
+import { isEqual, omit, cloneDeep, upperFirst, uniqBy, set } from "lodash-es";
+import { Input, Select, TreeSelect, Radio, Checkbox, AutoComplete, Cascader, DatePicker, InputNumber, Switch, TimePicker, Slider, Rate, Divider, Col, Tooltip, Form, FormItem } from "ant-design-vue";
+import { defineStore } from "pinia";
+import "ant-design-vue/es/button/style";
+import dayjs from "dayjs";
+const _default = "";
+const index$1 = "";
+var Theme = /* @__PURE__ */ ((Theme2) => {
+  Theme2["DARK"] = "dark";
+  Theme2["LIGHT"] = "light";
+  return Theme2;
+})(Theme || {});
+var MenuType = /* @__PURE__ */ ((MenuType2) => {
+  MenuType2["SIDE"] = "sidebar";
+  MenuType2["TOP_MENU"] = "top-menu";
+  MenuType2["MIX"] = "mix";
+  return MenuType2;
+})(MenuType || {});
+var MenuMode = /* @__PURE__ */ ((MenuMode2) => {
+  MenuMode2["INLINE"] = "inline";
+  MenuMode2["HORIZONTAL"] = "horizontal";
+  MenuMode2["VERTICAL"] = "vertical";
+  return MenuMode2;
+})(MenuMode || {});
+var ContentMode = /* @__PURE__ */ ((ContentMode2) => {
+  ContentMode2["FULL"] = "full";
+  ContentMode2["FIXED"] = "fixed";
+  return ContentMode2;
+})(ContentMode || {});
+var UiSize = /* @__PURE__ */ ((UiSize2) => {
+  UiSize2["LARGE"] = "large";
+  UiSize2["MIDDLE"] = "middle";
+  UiSize2["SMALL"] = "small";
+  return UiSize2;
+})(UiSize || {});
+const defaultThemeConf = {
+  content: {
+    contentMode: ContentMode.FULL
+  },
+  headOptions: {
+    fixed: true,
+    theme: Theme.LIGHT,
+    showLogo: true,
+    showBackToTop: true,
+    useLockPage: true,
+    size: UiSize.SMALL,
+    showSize: true,
+    showBreadCrumb: true,
+    showFullScreen: true,
+    showSearch: true,
+    showNotice: true,
+    showLocaleSwitch: true,
+    showSettingTheme: true,
+    showLoginOut: true
+  },
+  menuOptions: {
+    fixed: true,
+    theme: Theme.DARK,
+    collapsed: false,
+    collapsedShowTitle: false,
+    canDrag: true,
+    show: true,
+    hidden: false,
+    split: false,
+    menuWidth: 240,
+    trigger: true,
+    type: MenuType.SIDE,
+    mode: MenuMode.INLINE
+  },
+  footerOptions: {
+    show: false,
+    height: 48,
+    title: "Copyright(C) 2021 by www.ithinkdt.com. All rights reserved.",
+    subTitle: "Privacy Statement"
+  },
+  routeReuse: {
+    show: true,
+    cache: true,
+    canDrag: true,
+    showQuick: true,
+    showRedo: true,
+    showFold: true
+  }
+};
+const useThemeStore = defineStore({
+  id: "dt-theme",
+  state: () => ({
+    themeConf: DtCache.getLocal(CacheKey.THEME) ?? defaultThemeConf,
+    pageLoading: false
+  }),
+  getters: {
+    getThemeConf() {
+      return this.themeConf;
+    },
+    getHeaderConf() {
+      return this.themeConf.headOptions;
+    },
+    getMenuConf() {
+      return this.themeConf.menuOptions;
+    },
+    getFooterConf() {
+      return this.themeConf.footerOptions;
+    },
+    getRouteReuseConf() {
+      return this.themeConf.routeReuse;
+    },
+    getPageLoading() {
+      return this.pageLoading;
+    }
+  },
+  actions: {
+    setThemeConf(options = {}) {
+      let newThemeConf = deepMerge(this.themeConf, options);
+      this.themeConf = deepMerge(defaultThemeConf, newThemeConf);
+      DtCache.setLocal(CacheKey.THEME, this.themeConf);
+    }
+  }
+});
+defineStore({
+  id: "route-reuse",
+  state: () => ({
+    cacheTabList: /* @__PURE__ */ new Set(),
+    tabList: DtCache.getLocal(CacheKey.THEME)?.routeReuse?.cache ? DtCache.getLocal(CacheKey.ROUTE_REUSE) || [] : [],
+    lastDragEndIndex: 0
+  }),
+  getters: {
+    getTabList() {
+      return this.tabList;
+    },
+    getCachedTabList() {
+      return Array.from(this.cacheTabList);
+    },
+    getLastDragEndIndex() {
+      return this.lastDragEndIndex;
+    }
+  },
+  actions: {
+    async addTab(route) {
+      const { path, name, fullPath, params, query, meta } = route;
+      if (path === Pages.NOT_FOUND || path === Pages.LOGIN || path === Pages.BASE_PAGE) {
+        return;
+      }
+      let updateIndex = -1;
+      const tabHasExits = this.tabList.some((tab, index2) => {
+        updateIndex = index2;
+        return (tab.fullPath || tab.path) === (fullPath || path);
+      });
+      if (tabHasExits) {
+        const curTab = toRaw$1(this.tabList)[updateIndex];
+        curTab.params = params || curTab.params;
+        curTab.query = query || curTab.query;
+        curTab.fullPath = fullPath || curTab.fullPath;
+        this.tabList.splice(updateIndex, 1, curTab);
+      } else {
+        this.tabList.push(JSON.parse(JSON.stringify(route)));
+      }
+      this.updateCacheTab();
+    },
+    closeTab(path, router) {
+      const go = useGo(router);
+      const index2 = this.tabList.findIndex((item) => item.path === path);
+      let page;
+      if (index2 === 0) {
+        if (this.tabList.length !== 1) {
+          page = this.tabList[index2 + 1];
+        }
+      } else {
+        page = this.tabList[index2 - 1];
+      }
+      this.bulkCloseTabs([path]);
+      this.updateCacheTab();
+      path === router.currentRoute.value.path && go(page.path);
+    },
+    closeAllTab(currentRoute, router) {
+      const go = useGo(router);
+      let filterTabList = this.tabList.filter((item) => item?.meta?.affix ?? false);
+      const route = filterTabList.length > 0 ? filterTabList[filterTabList.length - 1] : unref$1(currentRoute);
+      this.tabList = [route];
+      this.updateCacheTab();
+      go(route.path);
+    },
+    closeLeftTabs(path) {
+      const index2 = this.tabList.findIndex((item) => item.path === path);
+      if (index2 > 0) {
+        const leftTabs = this.tabList.slice(0, index2);
+        const pathList = [];
+        for (const item of leftTabs) {
+          const affix = item?.meta?.affix ?? false;
+          if (!affix) {
+            pathList.push(item.fullPath);
+          }
+        }
+        this.bulkCloseTabs(pathList);
+      }
+      this.updateCacheTab();
+    },
+    closeRightTabs(path) {
+      const index2 = this.tabList.findIndex((item) => item.path === path);
+      if (index2 >= 0 && index2 < this.tabList.length - 1) {
+        const rightTabs = this.tabList.slice(index2 + 1, this.tabList.length);
+        const pathList = [];
+        for (const item of rightTabs) {
+          const affix = item?.meta?.affix ?? false;
+          if (!affix) {
+            pathList.push(item.fullPath);
+          }
+        }
+        this.bulkCloseTabs(pathList);
+      }
+      this.updateCacheTab();
+    },
+    closeOtherTabs(path) {
+      const pathList = [];
+      for (let item of this.tabList) {
+        const affix = item?.meta?.affix ?? false;
+        if (item.path !== path && !affix) {
+          pathList.push(item.path);
+        }
+      }
+      this.bulkCloseTabs(pathList);
+      this.updateCacheTab();
+    },
+    bulkCloseTabs(pathList) {
+      this.tabList = this.tabList.filter((item) => !pathList.includes(item.fullPath));
+    },
+    updateCacheTab() {
+      const cacheTab = DtCache.getLocal(CacheKey.THEME)?.routeReuse?.cache;
+      cacheTab && DtCache.setLocal(CacheKey.ROUTE_REUSE, this.tabList);
+      const cacheMap = /* @__PURE__ */ new Set();
+      for (const tab of this.tabList) {
+        if (tab.meta?.hideTab) {
+          continue;
+        }
+        const name = tab.name;
+        cacheMap.add(name);
+      }
+      this.cacheTabList = cacheMap;
+    },
+    async refreshPage(router) {
+      const findTab = this.getCachedTabList.find((item) => item === unref$1(router.currentRoute).name);
+      if (findTab) {
+        this.cacheTabList.delete(findTab.toString());
+      }
+      const redo = useRedo(router);
+      await redo();
+    },
+    sortTabs(oldIndex, newIndex) {
+      const currentTab = this.tabList[oldIndex];
+      this.tabList.splice(oldIndex, 1);
+      this.tabList.splice(newIndex, 0, currentTab);
+      this.lastDragEndIndex = this.lastDragEndIndex + 1;
+    }
+  }
+});
+function useMenu() {
+  const { getMenuConf, setThemeConf } = useThemeStore();
+  const getCollapsedShowTitle = computed$1(() => getMenuConf.collapsedShowTitle);
+  const getIsSidebarType = computed$1(() => getMenuConf.type === MenuType.SIDE);
+  const getMenuFixed = computed$1(() => getMenuConf.fixed);
+  const getShowMenu = computed$1(() => getMenuConf.show);
+  const getShowSidebar = computed$1(() => {
+    return unref$1(getSplit) || unref$1(getShowMenu) && unref$1(getMenuMode) !== MenuMode.HORIZONTAL;
+  });
+  const getMenuHidden = computed$1(() => getMenuConf.hidden);
+  const getMenuTheme = computed$1(() => getMenuConf.theme);
+  const getTrigger = computed$1(() => getMenuConf.trigger);
+  const getCanDrag = computed$1(() => getMenuConf.canDrag);
+  const getIsMixMode = computed$1(() => {
+    return unref$1(getMenuMode) === MenuMode.INLINE && unref$1(getMenuType) === MenuType.MIX;
+  });
+  const getMenuWidth = computed$1(() => unref$1(getIsMixMode) ? Number(getMenuConf.menuWidth) - 40 : getMenuConf.menuWidth);
+  const getLogoWidth = computed$1(() => getMenuConf.menuWidth);
+  const getMenuType = computed$1(() => getMenuConf.type);
+  const getIsTopMenu = computed$1(() => unref$1(getMenuType) === MenuType.TOP_MENU);
+  const getMenuMode = computed$1(() => getMenuConf.mode);
+  const getSplit = computed$1(() => getMenuConf.split);
+  const getCollapsed = computed$1(() => getMenuConf.collapsed);
+  const getIsHorizontal = computed$1(() => unref$1(getMenuMode) === MenuMode.HORIZONTAL);
+  const setThemeStore = (conf = {}) => setThemeConf(conf);
+  const toggleCollapsed = () => setThemeStore({
+    menuOptions: {
+      collapsed: !unref$1(getCollapsed)
+    }
+  });
+  const getMiniWidthNumber = computed$1(() => getMenuConf.collapsedShowTitle ? 80 : 48);
+  const getRealWidth = computed$1(() => {
+    return unref$1(getCollapsed) ? unref$1(getMiniWidthNumber) : unref$1(getMenuWidth);
+  });
+  const getCalcContentWidth = computed$1(() => {
+    const width = unref$1(getIsTopMenu) || !unref$1(getShowMenu) || unref$1(getSplit) && unref$1(getMenuHidden) ? 0 : unref$1(getRealWidth);
+    return `calc(100% - ${unref$1(width)}px)`;
+  });
+  return {
+    getCollapsedShowTitle,
+    getIsSidebarType,
+    getMenuFixed,
+    getShowMenu,
+    getShowSidebar,
+    getMenuHidden,
+    getMenuTheme,
+    getTrigger,
+    getMenuWidth,
+    getLogoWidth,
+    getMenuType,
+    getIsTopMenu,
+    getMenuMode,
+    getSplit,
+    getCollapsed,
+    getIsHorizontal,
+    getMiniWidthNumber,
+    getRealWidth,
+    getCalcContentWidth,
+    getIsMixMode,
+    getCanDrag,
+    toggleCollapsed,
+    setThemeStore
+  };
+}
+function useMultipleTab() {
+  const { getRouteReuseConf } = useThemeStore();
+  const getShowMultipleTab = computed(() => getRouteReuseConf.show);
+  const getShowQuick = computed(() => getRouteReuseConf.showQuick);
+  const getShowRedo = computed(() => getRouteReuseConf.showRedo);
+  const getCanCache = computed(() => getRouteReuseConf.cache);
+  const getCanDrag = computed(() => getRouteReuseConf.canDrag);
+  return {
+    getShowMultipleTab,
+    getShowQuick,
+    getShowRedo,
+    getCanCache,
+    getCanDrag
+  };
+}
+function useHeader() {
+  const HEADER_HEIGHT = 48;
+  const TABS_HEIGHT = 33;
+  const { getHeaderConf = {} } = useThemeStore();
+  const {
+    getIsSidebarType,
+    getMenuType,
+    getShowMenu,
+    getMenuHidden,
+    getTrigger,
+    getMenuMode,
+    getSplit,
+    getIsTopMenu,
+    getIsMixMode
+  } = useMenu();
+  const { getShowMultipleTab } = useMultipleTab();
+  const getHeaderTheme = computed$1(() => getHeaderConf.theme);
+  const getFixed = computed$1(() => getHeaderConf.fixed);
+  const getShowHeaderLogo = computed$1(() => unref$1(getShowLogo) && !unref$1(getIsSidebarType));
+  const getShowSearch = computed$1(() => getHeaderConf.showSearch);
+  const getShowHeaderTrigger = computed$1(() => {
+    if (unref$1(getMenuType) === MenuType.TOP_MENU || !unref$1(getShowMenu) || unref$1(getMenuHidden)) {
+      return false;
+    }
+    return unref$1(getTrigger);
+  });
+  const getShowBreadCrumb = computed$1(() => getHeaderConf.showBreadCrumb);
+  const getShowBread = computed$1(
+    () => unref$1(getMenuMode) !== MenuMode.HORIZONTAL && !unref$1(getSplit) && unref$1(getShowBreadCrumb)
+  );
+  const getShowTopMenu = computed$1(() => unref$1(getMenuMode) === MenuMode.HORIZONTAL || unref$1(getSplit));
+  const getShowNotice = computed$1(() => getHeaderConf.showNotice);
+  const getShowFullScreen = computed$1(() => getHeaderConf.showFullScreen);
+  const getShowLocale = computed$1(() => getHeaderConf.showLocaleSwitch);
+  const getShowSettingTheme = computed$1(() => getHeaderConf.showSettingTheme);
+  const getShowFullHeaderRef = computed$1(() => {
+    return !unref$1(getIsSidebarType) && !unref$1(getIsTopMenu);
+  });
+  const getHeaderHeight = computed$1(() => {
+    let height = 0;
+    height += HEADER_HEIGHT;
+    if (unref$1(getShowMultipleTab) && !unref$1(getSplit)) {
+      height += TABS_HEIGHT;
+    }
+    return height;
+  });
+  const getTabsHeight = computed$1(() => TABS_HEIGHT);
+  const getShowInsetHeaderRef = computed$1(() => {
+    return unref$1(getIsSidebarType) || unref$1(getIsTopMenu);
+  });
+  const getShowBackToTop = computed$1(() => getHeaderConf.showBackToTop);
+  const getIsZH = computed$1(() => {
+    let local = DtCache.getLocal(CacheKey.LOCALE);
+    if (!local)
+      return true;
+    return local === Language.ZH;
+  });
+  const getUiSize = computed$1(() => getHeaderConf?.size ?? UiSize.SMALL);
+  const getShowUiSize = computed$1(() => getHeaderConf?.showSize);
+  const getShowLogo = computed$1(() => getHeaderConf.showLogo);
+  const getShowLoginOut = computed$1(() => getHeaderConf.showLoginOut);
+  const loginOutClick = getHeaderConf.logoutClick;
+  return {
+    getHeaderTheme,
+    getFixed,
+    getShowSearch,
+    getShowHeaderLogo,
+    getShowHeaderTrigger,
+    getShowBread,
+    getShowTopMenu,
+    getShowFullScreen,
+    getShowLocale,
+    getShowSettingTheme,
+    getShowNotice,
+    getShowFullHeaderRef,
+    getHeaderHeight,
+    getTabsHeight,
+    getShowInsetHeaderRef,
+    getShowBackToTop,
+    getIsZH,
+    getUiSize,
+    getShowLogo,
+    getShowLoginOut,
+    getShowUiSize,
+    loginOutClick
+  };
+}
+function useLabelWidth(schemaItemRef, propsRef) {
+  const { getIsZH } = useHeader();
+  const { appConf } = useAppStore();
+  return computed(() => {
+    const { labelWidth, enLabelWidth, labelCol = {}, wrapperCol = {} } = unref(schemaItemRef);
+    const {
+      labelWidth: gLabelWidth,
+      enLabelWidth: gEnLabelWidth,
+      labelCol: glabelCol = {},
+      wrapperCol: gwrapperCol = {},
+      layout = appConf.ui.form.layout
+    } = unref(propsRef);
+    let width = (unref(getIsZH) ? labelWidth ?? gLabelWidth : enLabelWidth ?? gEnLabelWidth) ?? labelWidth ?? gLabelWidth ?? 0;
+    const labelcol = { ...glabelCol, ...labelCol };
+    const wrapcol = { ...gwrapperCol, ...wrapperCol };
+    width = isNumber(width) ? `${width}px` : width;
+    return {
+      labelCol: {
+        style: { width },
+        ...labelcol
+      },
+      wrapperCol: {
+        style: { width: layout === "vertical" ? "100%" : `calc(100% - ${width})` },
+        ...wrapcol
+      }
+    };
+  });
+}
+const SINGLE_DATA_TYPE = ["DatePicker", "MonthPicker", "WeekPicker", "TimePicker"];
+const MULTIFY_DATA_TYPE = ["RangePicker"];
+const DATE_PICKER_TYPES = [...SINGLE_DATA_TYPE, ...MULTIFY_DATA_TYPE];
+function createPlaceholder(component) {
+  const { t } = useI18n("UI");
+  if (component.includes("Input") || component.includes("Complete")) {
+    return t("PLEASE_INPUT");
+  }
+  if (component.includes("Picker") || component.includes("Select") || component.includes("Cascader") || component.includes("Checkbox") || component.includes("Radio") || component.includes("Switch")) {
+    return t("PLEASE_SELECT");
+  }
+  if (component.includes("Icon")) {
+    return t("PLEASE_SET_ICON");
+  }
+  return "";
+}
+function setComponentRuleType(rule, component, valueFormat) {
+  if (SINGLE_DATA_TYPE.includes(component)) {
+    rule.type = valueFormat ? "string" : "object";
+  } else if (["RangePicker", "Upload", "CheckboxGroup", "TimePicker"].includes(component)) {
+    rule.type = "array";
+  } else if (["InputNumber"].includes(component)) {
+    rule.type = "number";
+  }
+}
+function handleInputNumberValue(component, val) {
+  if (!component)
+    return val;
+  if ([
+    "Input",
+    "InputPassword",
+    "InputSearch",
+    "InputTextArea"
+  ].includes(component)) {
+    return val && isNumber(val) ? `${val}` : val;
+  }
+  return val;
+}
+const index = "";
+function useFormValue(props, key = "value", changeEvent = "change", emitData) {
+  const instance = getCurrentInstance();
+  const emit = instance?.emit;
+  const innerState = reactive$1({
+    value: props[key]
+  });
+  const defaultState = readonly(innerState);
+  const setState = (val) => {
+    innerState.value = val;
+    nextTick$1(() => {
+      emit?.(changeEvent, val, ...toRaw$1(unref$1(emitData)) || []);
+    });
+  };
+  watchEffect(() => {
+    innerState.value = props[key];
+  });
+  const state = computed$1({
+    get() {
+      return innerState.value;
+    },
+    set(value) {
+      if (isEqual(value, defaultState.value))
+        return;
+      innerState.value = value;
+      nextTick$1(() => {
+        emit?.(changeEvent, value, ...toRaw$1(unref$1(emitData)) || []);
+      });
+    }
+  });
+  return [state, setState, defaultState];
+}
+const _sfc_main$4 = /* @__PURE__ */ defineComponent$1({
+  __name: "radioButton",
+  props: {
+    value: {
+      type: [String, Number, Boolean]
+    },
+    options: {
+      type: Array,
+      default: () => []
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const [state] = useFormValue(props);
+    const getOptions = computed$1(() => {
+      const { options } = props;
+      if (!options || options?.length === 0)
+        return [];
+      const isStringArr = options.some((item) => isString(item));
+      if (!isStringArr)
+        return options;
+      return options.map((item) => ({ label: item, value: item }));
+    });
+    return (_ctx, _cache) => {
+      const _component_ARadioButton = RadioButton;
+      const _component_ARadioGroup = RadioGroup;
+      return openBlock(), createBlock(_component_ARadioGroup, mergeProps(unref$1(attrs), {
+        value: unref$1(state),
+        "onUpdate:value": _cache[0] || (_cache[0] = ($event) => isRef(state) ? state.value = $event : null),
+        "button-style": "solid"
+      }), {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref$1(getOptions), (item) => {
+            return openBlock(), createBlock(_component_ARadioButton, {
+              key: `${item.value}`,
+              value: item.value,
+              disabled: item.disabled
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(item.label), 1)
+              ]),
+              _: 2
+            }, 1032, ["value", "disabled"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 16, ["value"]);
+    };
+  }
+});
+const _hoisted_1$1 = { class: "input-with-dialog" };
+const _sfc_main$3 = /* @__PURE__ */ defineComponent$1({
+  __name: "formInputUseDialog",
+  setup(__props) {
+    const { t } = useI18n("UI");
+    const attrs = useAttrs$1();
+    const bindProps = computed$1(() => {
+      return {
+        ...omit(attrs, [
+          "formValues"
+        ]),
+        disabled: true
+      };
+    });
+    function onClickInput() {
+      const { model, schema = {} } = attrs.formValues;
+      if (!schema.openDialog || !isFunction(schema.openDialog)) {
+        error(t("MUSE_FUNCTION"));
+        return;
+      }
+      schema.openDialog(model);
+    }
+    function clearProps() {
+      const { model, schema = {} } = attrs.formValues;
+      [...schema.linkProps, schema.name].forEach((it) => model[it] = null);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$1, [
+        createElementVNode("div", { onClick: onClickInput }, [
+          createVNode(unref$1(Input), normalizeProps(guardReactiveProps(unref$1(bindProps))), null, 16)
+        ]),
+        unref$1(attrs).formValues?.schema?.linkProps?.length ? (openBlock(), createElementBlock("i", {
+          key: 0,
+          class: "i mdi:close-circle",
+          onClick: clearProps
+        })) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const components = {
+  Input,
+  InputWithDialog: _sfc_main$3,
+  InputTextArea: Input.TextArea,
+  InputSearch: Input.Search,
+  InputGroup: Input.Group,
+  InputPassword: Input.Password,
+  Select,
+  TreeSelect,
+  Radio,
+  RadioGroup: Radio.Group,
+  RadioButtonGroup: _sfc_main$4,
+  Checkbox,
+  CheckboxGroup: Checkbox.Group,
+  AutoComplete,
+  Cascader,
+  DatePicker,
+  MonthPicker: DatePicker.MonthPicker,
+  WeekPicker: DatePicker.WeekPicker,
+  RangePicker: DatePicker.RangePicker,
+  InputNumber,
+  Switch,
+  TimePicker,
+  Slider,
+  Rate,
+  Divider
+};
+const componentMap = /* @__PURE__ */ new Map();
+for (let item in components) {
+  componentMap.set(item, components[item]);
+}
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const _sfc_main$2 = defineComponent({
+  name: "FormItem",
+  inheritAttrs: false,
+  props: {
+    schema: {
+      type: Object,
+      default: () => ({})
+    },
+    formProps: {
+      type: Object,
+      default: () => ({})
+    },
+    defaultValues: {
+      type: Object,
+      default: () => ({})
+    },
+    formModel: {
+      type: Object,
+      default: () => ({})
+    },
+    setFormModel: {
+      type: Function
+    },
+    formActionType: {
+      type: Object
+    }
+  },
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const {
+      getSlot
+    } = useSlots();
+    const {
+      t
+    } = useI18n("UI");
+    const {
+      getUiSize
+    } = useHeader();
+    const {
+      appConf
+    } = useAppStore();
+    const {
+      schema,
+      formProps
+    } = toRefs(props);
+    const getValues = computed(() => {
+      const {
+        defaultValues,
+        formModel,
+        schema: schema2
+      } = props;
+      let name = schema2.name;
+      return {
+        name: isArray(name) ? name.join("-") : name,
+        model: formModel,
+        schema: schema2,
+        values: {
+          ...defaultValues,
+          ...formModel
+        }
+      };
+    });
+    const getShow = computed(() => {
+      const {
+        show = true,
+        isAdvanced = true
+      } = props.schema;
+      if (!isAdvanced) {
+        return false;
+      }
+      if (isFunction(show)) {
+        return show(unref(getValues).model);
+      }
+      return show;
+    });
+    const getComponentProps = computed(() => {
+      const {
+        schema: schema2
+      } = props;
+      let {
+        props: cProps = {}
+      } = schema2;
+      if (isFunction(cProps)) {
+        cProps = cProps(unref(getValues).model) ?? {};
+      }
+      if (schema2.component === "Divider") {
+        cProps = Object.assign({
+          type: "horizontal"
+        }, cProps, {
+          orientation: "left"
+        });
+      }
+      return cProps;
+    });
+    function renderItem() {
+      const {
+        component,
+        slot,
+        render,
+        name,
+        colon = appConf.ui.form.colon,
+        suffix,
+        prefix
+      } = props.schema;
+      const {
+        labelCol,
+        wrapperCol
+      } = unref(useLabelWidth(schema, formProps));
+      const getContent = () => {
+        const value = unref(getValues);
+        let _con = slot ? getSlot(slots, slot, value.model) : render ? render(value.model) : renderFormItem();
+        return component === "InputGroup" || component === "Icon" ? createVNode(FormItem, {
+          "class": "m-0"
+        }, _isSlot(_con) ? _con : {
+          default: () => [_con]
+        }) : _con;
+      };
+      const getSuffix = () => {
+        return isFunction(suffix) ? suffix(unref(getValues).model) : suffix;
+      };
+      const getPrefix = () => {
+        return isFunction(prefix) ? prefix(unref(getValues).model) : prefix;
+      };
+      return createVNode(Form.Item, {
+        "name": isArray(name) ? name.join("-") : name,
+        "colon": colon,
+        "class": [unref(getUiSize), {
+          "suffix-item": !!suffix
+        }],
+        "label": renderLabel(),
+        "rules": handleRules(),
+        "labelCol": labelCol,
+        "wrapperCol": wrapperCol
+      }, {
+        default: () => [createVNode("div", {
+          "style": "display:flex"
+        }, [!!prefix && createVNode("span", {
+          "class": "prefix px-2"
+        }, [getPrefix()]), createVNode("div", {
+          "style": "flex:1; width: 100%;"
+        }, [getContent()]), !!suffix && createVNode("span", {
+          "class": "suffix px-2"
+        }, [getSuffix()])])]
+      });
+    }
+    function renderLabel() {
+      const {
+        label,
+        toolTip,
+        subLabel,
+        toolTipProps = {}
+      } = props.schema;
+      const renderLabel2 = subLabel ? createVNode("span", null, [createTextVNode(" "), label, createTextVNode(" "), createVNode("span", {
+        "class": "text-secondary opacity-50"
+      }, [createTextVNode("("), subLabel, createTextVNode(")")])]) : label;
+      const _toolTip = isFunction(toolTip) ? toolTip(unref(getValues).model) : toolTip;
+      const _toolTipProps = {
+        title: renderLabel2,
+        autoAdjustOverflow: true,
+        placement: "top",
+        ...toolTipProps
+      };
+      return _toolTip ? createVNode("span", null, [createVNode(Tooltip, _toolTipProps, _isSlot(renderLabel2) ? renderLabel2 : {
+        default: () => [renderLabel2]
+      })]) : renderLabel2;
+    }
+    function renderFormItem() {
+      const {
+        schema: schema2,
+        formModel,
+        formActionType
+      } = props;
+      const {
+        component,
+        name,
+        changeEvent = "change",
+        valueField,
+        renderComponent,
+        props: sProps
+      } = props.schema;
+      const isCheck = component && ["Switch", "Checkbox"].includes(component);
+      const eventKey = `on${upperFirst(changeEvent)}`;
+      const _sProps = isFunction(sProps) ? sProps(formModel) : sProps;
+      const on = {
+        [eventKey]: (...args) => {
+          const [e] = args;
+          const target = e ? e.target : null;
+          const value = target ? isCheck ? target.checked : target.value : e;
+          if (isString(name)) {
+            props.setFormModel(name, value);
+          } else if (isArray(name)) {
+            name.map((key) => props.setFormModel(key, value));
+          }
+          if (_sProps && _sProps[eventKey])
+            _sProps[eventKey](...args, formModel);
+        }
+      };
+      for (let it in _sProps) {
+        if (it.startsWith("on") && it !== eventKey) {
+          on[it] = (...args) => {
+            _sProps[it](...args, formModel);
+          };
+        }
+      }
+      const getDisable = computed(() => {
+        const {
+          disabled: gDisabled
+        } = props.formProps;
+        const {
+          disabled
+        } = props.schema;
+        const {
+          disabled: itemDisabled = false
+        } = unref(getComponentProps);
+        let _disabled = !!gDisabled || itemDisabled;
+        if (isBoolean(disabled))
+          _disabled = disabled;
+        if (isFunction(disabled))
+          _disabled = disabled(unref(getValues).model);
+        return _disabled;
+      });
+      const itemProps = {
+        allowClear: _sProps?.allowClear ?? appConf.ui.form.allowClear,
+        size: unref(getUiSize) === UiSize.MIDDLE ? "default" : unref(getUiSize),
+        ...unref(getComponentProps),
+        disabled: unref(getDisable)
+      };
+      if (component === "Select") {
+        {
+          itemProps.showSearch = true;
+          itemProps.optionFilterProp = "label";
+        }
+      }
+      if (!itemProps.disabled && component !== "RangePicker") {
+        itemProps.placeholder = unref(getComponentProps)?.placeholder || createPlaceholder(component);
+      }
+      if (["DatePicker", "MonthPicker", "RangePicker"].includes(component)) {
+        itemProps.defaultValue = props.formModel[name];
+      }
+      itemProps.codeName = name;
+      itemProps.formValues = unref(getValues);
+      if (["Select", "DatePicker", "MonthPicker", "WeekPicker", "RangePicker"].includes(component)) {
+        itemProps.dropdownClassName += ` ${unref(getUiSize)}`;
+      }
+      const bindValue = {
+        [valueField || (isCheck ? "checked" : "value")]: props.formModel[name]
+      };
+      let compAttr = {
+        ...itemProps,
+        ...bindValue,
+        ...on
+      };
+      const Comp = componentMap.get(component);
+      if (!renderComponent) {
+        return createVNode(Comp, compAttr, null);
+      }
+      const compSlot = isFunction(renderComponent) ? {
+        ...renderComponent(unref(getValues))
+      } : {
+        default: () => renderComponent
+      };
+      return createVNode(Comp, compAttr, _isSlot(compSlot) ? compSlot : {
+        default: () => [compSlot]
+      });
+    }
+    function handleRules() {
+      const {
+        rules: defaultRules = [],
+        component,
+        label,
+        dynamicRules,
+        required
+      } = props.schema;
+      if (!component)
+        return [];
+      if (isFunction(dynamicRules)) {
+        return dynamicRules(unref(getValues).model);
+      }
+      const defaultMsg = createPlaceholder(component) + label;
+      let rules = cloneDeep(defaultRules);
+      const getRequired = isFunction(required) ? required(unref(getValues).model) : required;
+      function validator(rule, value) {
+        const msg = rule.message || defaultMsg;
+        if (value === void 0 || isNull(value) || Array.isArray(value) && value.length === 0 || typeof value === "string" && value.trim() === "" || typeof value === "object" && Reflect.has(value, "checked") && Reflect.has(value, "halfChecked") && Array.isArray(value.checked) && Array.isArray(value.halfChecked) && value.checked.length === 0 && value.halfChecked.length === 0) {
+          return Promise.reject(msg);
+        }
+        return Promise.resolve();
+      }
+      if (!rules || !rules.length) {
+        let _required = isBoolean(getRequired) ? getRequired : unref(getRequired);
+        rules = _required ? [{
+          required: _required,
+          validator
+        }] : [];
+      }
+      const requiredIndex = rules.findIndex((rule) => Reflect.has(rule, "required") && !Reflect.has(rule, "validator"));
+      if (requiredIndex !== -1) {
+        const rule = rules[requiredIndex];
+        if (!unref(getShow)) {
+          rule.required = false;
+        }
+        if (!Reflect.has(rule, "type")) {
+          rule.type = component === "InputNumber" ? "number" : "string";
+        }
+        rule.message = rule.message || defaultMsg;
+        if (component.includes("Input") || component.includes("Textarea")) {
+          rule.whitespace = true;
+        }
+        const valueFormat = unref(getComponentProps)?.valueFormat;
+        setComponentRuleType(rule, component, valueFormat);
+      }
+      const maxIndex = rules.findIndex((val) => val.max);
+      if (maxIndex !== -1 && !rules[maxIndex].validator) {
+        rules[maxIndex].message = rules[maxIndex].message || `\u6700\u5927\u503C\u4E3A${rules[maxIndex].max}`;
+      }
+      return rules;
+    }
+    return () => {
+      let _slot2;
+      const {
+        colSlot,
+        renderCol,
+        colProps,
+        component,
+        render,
+        slot
+      } = props.schema;
+      const {
+        colProps: gColProps,
+        mode
+      } = props.formProps;
+      let _colProps = colProps || gColProps || (mode === "search" ? appConf.ui.form.searchColspan : appConf.ui.form.dialogColspan);
+      const values = unref(getValues);
+      if (!component) {
+        if (!render && !renderCol && !slot) {
+          error(t("NEED_RENDER"));
+          return;
+        }
+      }
+      if (component === "Divider") {
+        let _slot;
+        let cprops = unref(getComponentProps);
+        const span = cprops?.span ?? 24;
+        return createVNode(Col, {
+          "span": span
+        }, {
+          default: () => [createVNode(Divider, cprops, _isSlot(_slot = renderLabel()) ? _slot : {
+            default: () => [_slot]
+          })]
+        });
+      }
+      const getContent = () => {
+        return colSlot ? getSlot(slots, colSlot, values) : renderCol ? renderCol(values) : renderItem();
+      };
+      return unref(getShow) && createVNode(Col, _colProps, _isSlot(_slot2 = getContent()) ? _slot2 : {
+        default: () => [_slot2]
+      });
+    };
+  }
+});
+const _hoisted_1 = {
+  key: 0,
+  className: "preIcon pr-1"
+};
+const _hoisted_2 = {
+  key: 0,
+  className: "preIcon pl-1"
+};
+const _hoisted_3 = { class: "text" };
+const _hoisted_4 = /* @__PURE__ */ createElementVNode("i", { class: "text-2xl i ic:baseline-arrow-drop-down" }, null, -1);
+const _hoisted_5 = [
+  _hoisted_4
+];
+const _sfc_main$1 = /* @__PURE__ */ defineComponent$1({
+  __name: "FormButtons",
+  props: {
+    mode: {
+      type: String,
+      default: "search"
+    },
+    show: {
+      type: Boolean,
+      default: true
+    },
+    showAdvancedButton: {
+      type: Boolean,
+      default: true
+    },
+    minShowColumn: {
+      type: Number,
+      default: 2
+    },
+    buttonList: {
+      type: [Array],
+      default: []
+    },
+    isAdvanced: {
+      type: Boolean,
+      default: true
+    }
+  },
+  emits: ["handle-method"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const { t } = useI18n();
+    const advancedRef = ref(props.isAdvanced);
+    let key = 0;
+    const showAdvanceRef = computed(() => {
+      return props.mode === "search" ? props.showAdvancedButton : false;
+    });
+    const colOpt = computed(() => {
+      let style = {
+        textAlign: "right"
+      };
+      if (props.mode === "dialog") {
+        Object.assign(style, {
+          display: "inline-block"
+        });
+      }
+      return { style };
+    });
+    const getAdvanceClass = computed(() => {
+      return [
+        "basic-arrow",
+        { "basic-arrow--active": !advancedRef.value }
+      ];
+    });
+    const toggleAdvanced = () => {
+      advancedRef.value = !advancedRef.value;
+      dispatchResize();
+      emits("handle-method", advancedRef.value);
+    };
+    function handleBtnClick(button) {
+      if (button.onClick && isFunction(button.onClick)) {
+        button.onClick();
+      } else {
+        emits("handle-method", button);
+      }
+    }
+    watch(() => props.isAdvanced, (v) => {
+      if (v) {
+        nextTick(() => toggleAdvanced());
+      }
+    }, {
+      immediate: true
+    });
+    watch(
+      () => props.buttonList,
+      (v) => key = new Date().getTime(),
+      {
+        immediate: true,
+        deep: true
+      }
+    );
+    return (_ctx, _cache) => {
+      const _component_AButton = Button;
+      const _component_AFormItem = FormItem$1;
+      const _component_ACol = Col$1;
+      const _directive_icon = resolveDirective("icon");
+      const _directive_auth = resolveDirective("auth");
+      return __props.show ? (openBlock(), createBlock(_component_ACol, normalizeProps(mergeProps({ key: 0 }, unref$1(colOpt))), {
+        default: withCtx(() => [
+          createVNode(_component_AFormItem, {
+            class: "dt-form-btns",
+            style: normalizeStyle({
+              "margin-bottom": __props.mode === "search" ? "16px" : "0px"
+            })
+          }, {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.buttonList, (button) => {
+                return openBlock(), createElementBlock(Fragment, null, [
+                  (button.show === void 0 ? true : button.show) ? withDirectives((openBlock(), createBlock(_component_AButton, {
+                    type: button.type,
+                    class: normalizeClass(button.class),
+                    loading: button.loading,
+                    disabled: button.disabled,
+                    key: unref$1(key),
+                    onClick: ($event) => handleBtnClick(button)
+                  }, {
+                    icon: withCtx(() => [
+                      button.preIcon ? withDirectives((openBlock(), createElementBlock("span", _hoisted_1, null, 512)), [
+                        [_directive_icon, button.preIcon]
+                      ]) : createCommentVNode("", true)
+                    ]),
+                    default: withCtx(() => [
+                      createTextVNode(" " + toDisplayString(unref$1(t)(button.name)) + " ", 1),
+                      button.postIcon ? withDirectives((openBlock(), createElementBlock("span", _hoisted_2, null, 512)), [
+                        [_directive_icon, button.postIcon]
+                      ]) : createCommentVNode("", true)
+                    ]),
+                    _: 2
+                  }, 1032, ["type", "class", "loading", "disabled", "onClick"])), [
+                    [_directive_auth, button.auth]
+                  ]) : createCommentVNode("", true)
+                ], 64);
+              }), 256)),
+              unref$1(showAdvanceRef) ? (openBlock(), createBlock(_component_AButton, {
+                key: 0,
+                type: "link",
+                class: "advanced",
+                onClick: toggleAdvanced
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("span", _hoisted_3, toDisplayString(unref$1(advancedRef) ? unref$1(t)("UI.ADVANCED") : unref$1(t)("UI.EXPAND")), 1),
+                  createElementVNode("span", {
+                    class: normalizeClass(unref$1(getAdvanceClass))
+                  }, _hoisted_5, 2)
+                ]),
+                _: 1
+              })) : createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["style"])
+        ]),
+        _: 1
+      }, 16)) : createCommentVNode("", true);
+    };
+  }
+});
+const SEARCH_BTN_NAME = "UI.SEARCH";
+const RESET_BTN_NAME = "UI.RESET";
+const SEARCH_BTNS = [
+  { name: SEARCH_BTN_NAME, preIcon: "mdi:magnify", type: "primary" },
+  { name: RESET_BTN_NAME, preIcon: "mdi:refresh", type: "default" }
+];
+function useFormEvents({
+  emits,
+  getSchema,
+  formModel,
+  defaultValue,
+  formElRef,
+  schemaRef,
+  getProps,
+  handleFormValues
+}) {
+  function getFormValues() {
+    const formEl = unref(formElRef);
+    if (!formEl)
+      return {};
+    return handleFormValues(toRaw(unref(formModel)));
+  }
+  function updateSchema(data) {
+    let updateItems = [];
+    updateItems = isObject(data) ? [data] : [...data];
+    if (updateItems?.length && !updateItems.every((it) => it.component !== "Divider" && it.name)) {
+      console.error("\u6240\u6709\u7684\u5143\u7D20\u90FD\u5FC5\u987B\u8BBE\u7F6Ename\u5C5E\u6027");
+      return;
+    }
+    const schema = [];
+    updateItems.forEach((it) => {
+      unref(getSchema).forEach((val) => {
+        if (val.name === it.name) {
+          const newSchema = deepMerge(val, it);
+          schema.push(newSchema);
+        } else {
+          schema.push(val);
+        }
+      });
+    });
+    let shcemas = uniqBy(schema, "name");
+    _setValue(shcemas);
+    schemaRef.value = shcemas;
+  }
+  function resetSchema(data) {
+    let updateItems = [];
+    updateItems = isObject(data) ? [data] : [...data];
+    _setValue(updateItems, true);
+    schemaRef.value = updateItems;
+  }
+  function _setValue(data, isReset = false) {
+    data = isArray(data) ? data : [data];
+    let obj = {};
+    data.map((it) => {
+      let name = isArray(it.name) ? it.name[0] : it.name;
+      obj[name] = null;
+      if (!isNullAndUnDef(it.defaultValue))
+        return obj[name] = it.defaultValue;
+      let props = isFunction(it.props) ? it.props(toRaw(unref(formModel))) : it.props;
+      if (!isNullAndUnDef(props?.defaultValue))
+        obj[name] = props.defaultValue;
+    });
+    if (isReset) {
+      let oldValues = getFormValues();
+      let oldObj = {};
+      Object.keys(oldValues).map((key) => oldObj[key] = null);
+      obj = {
+        ...oldObj,
+        ...obj
+      };
+    }
+    setFormValues(obj);
+  }
+  async function clearValidate(name) {
+    await unref(formElRef)?.clearValidate(name);
+  }
+  function resetForms() {
+    const { resetFunc } = unref(getProps);
+    resetFunc && isFunction(resetFunc) && resetFunc();
+    if (!unref(formElRef))
+      return;
+    Object.keys(formModel).forEach((key) => {
+      const schema = unref(getSchema).find((item) => item.name === key);
+      const isInput = schema?.component && ["Input", "InputPassword", "InputSearch", "InputTextArea"].includes(schema.component);
+      formModel[key] = isInput ? defaultValue.value[key] || "" : defaultValue.value[key];
+    });
+    nextTick(() => clearValidate());
+    emits("reset", toRaw(formModel));
+  }
+  function removeFormByName(names) {
+    if (!names)
+      return;
+    const schemaList = cloneDeep(unref(getSchema));
+    const nameList = isString(names) ? [names] : names;
+    for (const name of nameList) {
+      _removeSchemaByName(name, schemaList);
+    }
+    schemaRef.value = schemaList;
+  }
+  function _removeSchemaByName(name, schemaList) {
+    const index2 = schemaList.findIndex((schema) => schema.name === name);
+    if (index2 !== -1) {
+      delete formModel[name];
+      schemaList.splice(index2, 1);
+    }
+  }
+  function appendFormItems(schema, prefixName, first = false) {
+    const schemaList = cloneDeep(unref(getSchema));
+    const index2 = schemaList.findIndex((schema2) => schema2.name === prefixName);
+    if (!prefixName || index2 === -1 || first) {
+      first ? schemaList.unshift(...schema) : schemaList.push(...schema);
+      schemaRef.value = schemaList;
+      return;
+    }
+    if (index2 !== -1) {
+      schemaList.splice(index2 + 1, 0, ...schema);
+    }
+    schemaRef.value = schemaList;
+  }
+  function itemIsDateType(key) {
+    return unref(getSchema).some((item) => {
+      return item.name === key ? ["DatePicker", "MonthPicker", "WeekPicker", "TimePicker", "RangePicker"].includes(item.component) : false;
+    });
+  }
+  async function validateFields(nameList) {
+    return unref(formElRef)?.validateFields(nameList);
+  }
+  function setFormValues(values) {
+    if (!values || !Object.keys(values).length) {
+      for (let it in formModel)
+        formModel[it] = Array.isArray(formModel[it]) ? [] : null;
+      return;
+    }
+    const names = unref(getSchema).map((item) => item.name).filter(Boolean);
+    const validKeys = [];
+    Object.keys(values).forEach((key) => {
+      const schema = unref(getSchema).find((item) => item.name === key);
+      let value = values[key];
+      const hasKey = Reflect.has(values, key);
+      value = handleInputNumberValue(schema?.component, value);
+      if (hasKey && names.includes(key)) {
+        if (itemIsDateType(key)) {
+          if (Array.isArray(value)) {
+            const arr = [];
+            for (const ele of value) {
+              arr.push(ele ? dayjs(ele) : null);
+            }
+            formModel[key] = arr;
+          } else {
+            const { props } = schema || {};
+            let _props = props;
+            if (typeof props === "function") {
+              _props = props({ formModel });
+            }
+            formModel[key] = value ? _props?.valueFormat ? value : dayjs(value) : null;
+          }
+        } else {
+          formModel[key] = value;
+        }
+        validKeys.push(key);
+      } else {
+        formModel[key] = value;
+      }
+    });
+    return validateFields(validKeys);
+  }
+  async function validate(nameList) {
+    return await unref(formElRef)?.validate(nameList);
+  }
+  return {
+    getFormValues,
+    updateSchema,
+    resetSchema,
+    clearValidate,
+    resetForms,
+    removeFormByName,
+    validateFields,
+    setFormValues,
+    validate,
+    appendFormItems
+  };
+}
+function useFormValues({
+  defaultValue,
+  getSchema,
+  formModel
+}) {
+  const getComMap = () => {
+    let comMap = /* @__PURE__ */ new Map();
+    unref$1(getSchema).map((it) => {
+      if (it.component && it.name) {
+        comMap.set(it.name, it);
+      }
+    });
+    return comMap;
+  };
+  function handleFormValues(model) {
+    if (!isObject(model))
+      return {};
+    const vals = {};
+    let comMap = getComMap();
+    for (let [key, val] of Object.entries(model)) {
+      let component = comMap.get(key)?.component;
+      if (!key || Array.isArray(val) && val.length === 0 || isFunction(val)) {
+        continue;
+      }
+      if (component) {
+        if (SINGLE_DATA_TYPE.includes(component)) {
+          val = dayjs(val).valueOf();
+        } else if (MULTIFY_DATA_TYPE.includes(component)) {
+          val = (val || []).map((it) => dayjs(it).valueOf());
+          if (comMap.get(key).extraName?.length) {
+            comMap.get(key).extraName.map((it, i) => {
+              set(vals, it, val.length > 0 ? val[i] : null);
+            });
+          }
+        }
+      }
+      if (isString(val)) {
+        val = val.trim();
+      }
+      set(vals, key, val);
+    }
+    return vals;
+  }
+  function initDefault() {
+    const schema = unref$1(getSchema), obj = {};
+    schema.forEach((item) => {
+      const { props = {}, name, component, defaultValue: gDefaultValue, extraName } = item;
+      const { defaultValue: itemDefaultValue, mode, format, treeCheckable } = isFunction(props) ? props(formModel) : props;
+      if (!name)
+        return;
+      let names = [];
+      if (component === "InputWithDialog") {
+        names = [name, ...extraName];
+      } else if (isArray(name)) {
+        names = name;
+      } else {
+        names = [name];
+      }
+      const defaultValue2 = itemDefaultValue ?? gDefaultValue;
+      if (!isNullAndUnDef(defaultValue2)) {
+        if (DATE_PICKER_TYPES.includes(component)) {
+          if (isArray(defaultValue2)) {
+            let vals = defaultValue2.map((it) => format ? dayjs(it, format) : dayjs(it));
+            if (names.length > 1) {
+              names.map((key, index2) => obj[key] = vals[index2] ?? null);
+            } else {
+              obj[names[0]] = vals;
+            }
+          } else {
+            obj[names[0]] = format ? dayjs(defaultValue2, format) : dayjs(defaultValue2);
+          }
+        } else {
+          if (names.length > 1) {
+            names.forEach((key, index2) => {
+              if (!defaultValue2 || defaultValue2.length - 1 < index2) {
+                obj[key] = null;
+              } else {
+                obj[key] = defaultValue2[index2];
+              }
+            });
+          } else {
+            obj[names[0]] = defaultValue2;
+          }
+        }
+      } else {
+        names.map((it) => {
+          if (component === "TreeSelect" || (mode === "multiple" || treeCheckable) || component === "Select" && mode === "multiple") {
+            obj[it] = [];
+          } else {
+            obj[it] = null;
+          }
+        });
+      }
+    });
+    defaultValue.value = { ...obj };
+    for (let key in obj) {
+      formModel[key] = obj[key];
+    }
+  }
+  return {
+    initDefault,
+    handleFormValues
+  };
+}
+function useFormActions(opt) {
+  const { getProps, defaultValue, updateSchema, getFormValues, setFormValues } = opt;
+  const { appConf } = useAppStore();
+  function handleAdvanced(isAdvanced) {
+    const { schemas, minShowColumn = appConf.ui.form?.minShowColumn || 2 } = unref(getProps);
+    let schema = schemas.reduce((t, it, index2) => {
+      if (index2 > minShowColumn - 1)
+        it.isAdvanced = isAdvanced;
+      t.push(it);
+      return t;
+    }, []);
+    updateSchema(schema);
+  }
+  function handleMethod(params) {
+    const { onSearch, onReset } = unref(getProps);
+    if (isBoolean(params)) {
+      handleAdvanced(params);
+    } else if (params.name === SEARCH_BTN_NAME) {
+      console.log(getProps);
+      onSearch(getFormValues());
+    } else if (params.name === RESET_BTN_NAME) {
+      setFormValues(toRaw(defaultValue.value));
+      onReset(getFormValues());
+    } else {
+      params.onClick();
+    }
+  }
+  return [handleMethod];
+}
+const BasicProps = {
+  mode: {
+    type: String,
+    default: "search"
+  },
+  autoFetch: {
+    type: Boolean,
+    default: true
+  },
+  model: {
+    type: Object,
+    default: {}
+  },
+  layout: {
+    type: String,
+    default: "horizontal"
+  },
+  labelWidth: {
+    type: [Number, String],
+    default: 100
+  },
+  enLabelWidth: {
+    type: [Number, String],
+    default: 100
+  },
+  labelAlign: {
+    type: String,
+    default: "right"
+  },
+  labelCol: {
+    type: Object,
+    default: () => {
+    }
+  },
+  wrapperCol: {
+    type: Object,
+    default: () => {
+    }
+  },
+  rowProps: {
+    type: Object,
+    default: () => {
+    }
+  },
+  colProps: {
+    type: Object,
+    default: () => {
+    }
+  },
+  size: {
+    type: String,
+    default: "small"
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  compact: {
+    type: Boolean,
+    default: null
+  },
+  schemas: {
+    type: Array,
+    default: () => []
+  },
+  autoSearchOnEnter: {
+    type: Boolean,
+    default: true
+  },
+  alwaysShowLines: {
+    type: Boolean,
+    default: false
+  },
+  minShowColumn: {
+    type: Number,
+    default: 2
+  },
+  showAdvancedButton: {
+    type: Boolean,
+    default: true
+  },
+  allowClear: {
+    type: Boolean,
+    default: true
+  },
+  scrollToFirstError: {
+    type: Boolean,
+    default: true
+  },
+  colon: {
+    type: Boolean,
+    default: true
+  },
+  loading: {
+    type: Object,
+    default: () => {
+      return {
+        onSearch: ref(false),
+        onReset: ref(false)
+      };
+    }
+  },
+  onSearch: {
+    type: Function,
+    default: (params) => {
+    }
+  },
+  onReset: {
+    type: Function,
+    default: (params) => {
+    }
+  },
+  buttons: {
+    type: [Array, null, Boolean],
+    default: false
+  },
+  resetFunc: {
+    type: Function
+  },
+  registerInstance: {
+    type: Function
+  }
+};
+const _sfc_main = /* @__PURE__ */ defineComponent$1({
+  __name: "index",
+  props: BasicProps,
+  emits: ["register"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const { getAppConf } = useAppStore();
+    const attrs = useAttrs();
+    const formElRef = ref(null);
+    const formModel = reactive({});
+    const defaultValue = ref({});
+    const propsRef = ref();
+    const schemaRef = ref(null);
+    const getProps = computed(() => {
+      return {
+        ...props,
+        ...getAppConf.ui.form,
+        ...unref(propsRef)
+      };
+    });
+    const getBindValue = computed(() => {
+      return {
+        ...attrs,
+        ...unref(getProps)
+      };
+    });
+    const getSchema = computed(() => {
+      return unref(schemaRef) || unref(getProps).schemas;
+    });
+    const getFormClass = computed(() => {
+      const { compact, mode } = unref(getProps);
+      const getCompact = compact === null ? mode === "dialog" ? false : true : compact;
+      return [
+        "basic-form",
+        `basic-form__${mode}`,
+        {
+          "basic-form__compact": getCompact
+        }
+      ];
+    });
+    function setProps(formProps) {
+      propsRef.value = deepMerge(unref(propsRef) || {}, formProps);
+      return null;
+    }
+    function setFormModel(key, value) {
+      formModel[key] = value;
+      const { validateTrigger } = unref(getBindValue);
+      if (!validateTrigger || validateTrigger === "change") {
+        validateFields([key]);
+      }
+    }
+    function handleEnterPress() {
+    }
+    const { initDefault, handleFormValues } = useFormValues({
+      defaultValue,
+      getSchema,
+      formModel
+    });
+    const {
+      updateSchema,
+      resetSchema,
+      clearValidate,
+      resetForms,
+      removeFormByName,
+      setFormValues,
+      appendFormItems,
+      validate,
+      validateFields,
+      getFormValues
+    } = useFormEvents({
+      emits,
+      getSchema,
+      formModel,
+      formElRef,
+      defaultValue,
+      schemaRef,
+      getProps,
+      handleFormValues
+    });
+    const formActionMethods = {
+      setProps,
+      updateSchema,
+      resetSchema,
+      clearValidate,
+      resetForms,
+      removeFormByName,
+      setFormValues,
+      appendFormItems,
+      validate,
+      validateFields,
+      getFormValues
+    };
+    const getActionsProps = computed(() => {
+      const {
+        mode,
+        minShowColumn = getAppConf.ui.form.minShowColumn || 2,
+        schemas = [],
+        showAdvancedButton: advanced,
+        loading,
+        buttons
+      } = unref(getProps);
+      let showAdvancedButton = mode === "search" ? true : false;
+      if (advanced !== void 0) {
+        showAdvancedButton = advanced;
+      }
+      if (schemas.length <= minShowColumn) {
+        showAdvancedButton = false;
+      }
+      let buttonList = [];
+      if (isArray(buttons)) {
+        buttonList = [...buttons];
+      } else if (mode === "search" && !buttons) {
+        SEARCH_BTNS.forEach((it) => {
+          it.loading = it.name === SEARCH_BTN_NAME ? loading?.onSearch : loading?.onReset;
+          buttonList.push(it);
+        });
+      }
+      let colspan = mode === "search" ? getAppConf.ui.form.searchColspan : getAppConf.ui.form.dialogColspan;
+      return {
+        ...colspan,
+        ...{
+          showAdvancedButton,
+          buttonList
+        }
+      };
+    });
+    const [handleMethod] = useFormActions({
+      getProps,
+      defaultValue,
+      updateSchema,
+      getFormValues,
+      setFormValues
+    });
+    onMounted(() => {
+      setFormValues(null);
+      emits("register", formActionMethods);
+      initDefault();
+    });
+    watch(
+      () => unref(getProps).onSearch,
+      () => {
+        useTimeoutFn(() => {
+          const { onSearch, autoFetch } = unref(getProps);
+          if (autoFetch && onSearch && isFunction(onSearch)) {
+            onSearch(toRaw(defaultValue.value));
+          }
+        }, 1);
+      }
+    );
+    watch(
+      () => unref(getProps).model,
+      (v) => {
+        const { model } = unref(getProps);
+        if (!model || !Object.keys(model).length)
+          return;
+        setFormValues(model);
+      },
+      {
+        immediate: true,
+        deep: true
+      }
+    );
+    return (_ctx, _cache) => {
+      const _component_ARow = Row;
+      const _component_AForm = Form$1;
+      return openBlock(), createBlock(_component_AForm, mergeProps(unref$1(getBindValue), {
+        ref_key: "formElRef",
+        ref: formElRef,
+        class: unref$1(getFormClass),
+        model: unref$1(formModel),
+        layout: unref$1(getProps).layout,
+        onKeypress: withKeys(handleEnterPress, ["enter"])
+      }), {
+        default: withCtx(() => [
+          createVNode(_component_ARow, mergeProps(unref$1(getProps).rowProps, { style: {
+            margin: 0
+          } }), {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(unref$1(getSchema), (schema) => {
+                return openBlock(), createBlock(unref$1(_sfc_main$2), {
+                  key: schema.name,
+                  schema,
+                  formProps: unref$1(getProps),
+                  formModel: unref$1(formModel),
+                  defaultValues: unref$1(defaultValue),
+                  setFormModel,
+                  formActionType: formActionMethods
+                }, createSlots({ _: 2 }, [
+                  renderList(Object.keys(_ctx.$slots), (item) => {
+                    return {
+                      name: item,
+                      fn: withCtx((data) => [
+                        renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
+                      ])
+                    };
+                  })
+                ]), 1032, ["schema", "formProps", "formModel", "defaultValues"]);
+              }), 128)),
+              unref$1(getActionsProps).buttonList?.length ? (openBlock(), createBlock(unref$1(_sfc_main$1), mergeProps({ key: 0 }, unref$1(getActionsProps), { onHandleMethod: unref$1(handleMethod) }), null, 16, ["onHandleMethod"])) : createCommentVNode("", true)
+            ]),
+            _: 3
+          }, 16)
+        ]),
+        _: 3
+      }, 16, ["class", "model", "layout", "onKeypress"]);
+    };
+  }
+});
+function useForm(props) {
+  const formRef = ref(null);
+  const loadedRef = ref(false);
+  function register(instance) {
+    if (unref(loadedRef) && instance === unref(formRef))
+      return;
+    formRef.value = instance;
+    loadedRef.value = true;
+    watch(
+      () => props,
+      () => props && instance.setProps(props),
+      {
+        immediate: true,
+        deep: true
+      }
+    );
+  }
+  async function getForm() {
+    const form = unref(formRef);
+    if (!form)
+      console.error("\u8868\u5355\u672A\u7533\u660E!");
+    await nextTick();
+    return form;
+  }
+  const methods = {
+    setProps: async (props2) => {
+      const form = await getForm();
+      form.setProps(props2);
+    },
+    updateSchema: async (data) => {
+      const form = await getForm();
+      form.updateSchema(data);
+    },
+    resetSchema: async (data) => {
+      const form = await getForm();
+      form.resetSchema(data);
+    },
+    clearValidate: async (name) => {
+      const form = await getForm();
+      form.clearValidate(name);
+    },
+    resetForms: async () => {
+      const form = await getForm();
+      form.resetForms();
+    },
+    removeFormByName: async (name) => {
+      unref(formRef)?.removeFormByName(name);
+    },
+    setFormValues: async (values) => {
+      const form = await getForm();
+      form.setFormValues(values);
+    },
+    appendFormItems: async (schema, prefixName, first) => {
+      const form = await getForm();
+      form.appendFormItems(schema, prefixName, first);
+    },
+    validate: async (nameList) => {
+      const form = await getForm();
+      return form.validate(nameList);
+    },
+    validateFields: async (nameList) => {
+      const form = await getForm();
+      return form.validateFields(nameList);
+    },
+    getFormValues: () => {
+      return unref(formRef)?.getFormValues();
+    }
+  };
+  return [register, methods];
+}
+const withInstall = (comp) => {
+  comp.install = (app) => {
+    app.component(comp.name, comp);
+  };
+  return comp;
+};
+const DtForm = withInstall(_sfc_main);
+export {
+  DtForm,
+  useForm
+};