@dt-frames/ui 2.0.1 → 2.0.3

package/es/components/drawer/index.js

@@ -0,0 +1,838 @@
+import { Button, FormItem, Col, Drawer } from "ant-design-vue/es";
+import "ant-design-vue/es/drawer/style";
+import { defineComponent, getCurrentInstance as getCurrentInstance$1, ref as ref$1, inject, computed, onUnmounted, h as h$1, provide, onMounted, nextTick as nextTick$1, unref, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, createBlock, resolveDynamicComponent, withCtx, renderSlot, createVNode, mergeProps, toDisplayString, watch, resolveDirective, normalizeProps, Fragment, renderList, withDirectives, createCommentVNode, createTextVNode, useAttrs, createSlots, guardReactiveProps, reactive, toRaw as toRaw$1 } from "vue";
+import { off, on, useI18n, dispatchResize, isFunction, DtCache, CacheKey, deepMerge, isUnDef, useApp, isObject, error } from "@dt-frames/core";
+import "ant-design-vue/es/col/style";
+import "ant-design-vue/es/form/style";
+import "ant-design-vue/es/button/style";
+const isServer = typeof window === "undefined";
+const BAR_MAP = {
+  vertical: {
+    offset: "offsetHeight",
+    scroll: "scrollTop",
+    scrollSize: "scrollHeight",
+    size: "height",
+    key: "vertical",
+    axis: "Y",
+    client: "clientY",
+    direction: "top"
+  },
+  horizontal: {
+    offset: "offsetWidth",
+    scroll: "scrollLeft",
+    scrollSize: "scrollWidth",
+    size: "width",
+    key: "horizontal",
+    axis: "X",
+    client: "clientX",
+    direction: "left"
+  }
+};
+function renderThumbStyle({ move, size, bar }) {
+  const style = {};
+  const translate = `translate${bar.axis}(${move}%)`;
+  style[bar.size] = size;
+  style.transform = translate;
+  style.msTransform = translate;
+  style.webkitTransform = translate;
+  return style;
+}
+function resizeHandler(entries) {
+  for (const entry of entries) {
+    const listeners = entry.target.__resizeListeners__ || [];
+    if (listeners.length) {
+      listeners.forEach((fn) => {
+        fn();
+      });
+    }
+  }
+}
+function addResizeListener(element, fn) {
+  if (isServer)
+    return;
+  if (!element.__resizeListeners__) {
+    element.__resizeListeners__ = [];
+    element.__ro__ = new ResizeObserver(resizeHandler);
+    element.__ro__.observe(element);
+  }
+  element.__resizeListeners__.push(fn);
+}
+function removeResizeListener(element, fn) {
+  if (!element || !element.__resizeListeners__)
+    return;
+  element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
+  if (!element.__resizeListeners__.length) {
+    element.__ro__.disconnect();
+  }
+}
+const Bar = defineComponent({
+  name: "Bar",
+  props: {
+    vertical: Boolean,
+    size: String,
+    move: Number
+  },
+  setup(props) {
+    const instance = getCurrentInstance$1();
+    const thumb = ref$1();
+    const wrap = inject("scroll-bar-wrap", {});
+    const bar = computed(() => {
+      return BAR_MAP[props.vertical ? "vertical" : "horizontal"];
+    });
+    const barStore = ref$1({});
+    const cursorDown = ref$1();
+    const clickThumbHandler = (e) => {
+      if (e.ctrlKey || e.button === 2) {
+        return;
+      }
+      window.getSelection()?.removeAllRanges();
+      startDrag(e);
+      barStore.value[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
+    };
+    const clickTrackHandler = (e) => {
+      const offset = Math.abs(
+        e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
+      );
+      const thumbHalf = thumb.value[bar.value.offset] / 2;
+      const thumbPositionPercentage = (offset - thumbHalf) * 100 / instance?.vnode.el?.[bar.value.offset];
+      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
+    };
+    const startDrag = (e) => {
+      e.stopImmediatePropagation();
+      cursorDown.value = true;
+      on(document, "mousemove", mouseMoveDocumentHandler);
+      on(document, "mouseup", mouseUpDocumentHandler);
+      document.onselectstart = () => false;
+    };
+    const mouseMoveDocumentHandler = (e) => {
+      if (cursorDown.value === false)
+        return;
+      const prevPage = barStore.value[bar.value.axis];
+      if (!prevPage)
+        return;
+      const offset = (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
+      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
+      const thumbPositionPercentage = (offset - thumbClickPosition) * 100 / instance?.vnode.el?.[bar.value.offset];
+      wrap.value[bar.value.scroll] = thumbPositionPercentage * wrap.value[bar.value.scrollSize] / 100;
+    };
+    function mouseUpDocumentHandler() {
+      cursorDown.value = false;
+      barStore.value[bar.value.axis] = 0;
+      off(document, "mousemove", mouseMoveDocumentHandler);
+      document.onselectstart = null;
+    }
+    onUnmounted(() => {
+      off(document, "mouseup", mouseUpDocumentHandler);
+    });
+    return () => h$1(
+      "div",
+      {
+        class: ["scrollbar__bar", "is-" + bar.value.key],
+        onMousedown: clickTrackHandler
+      },
+      h$1("div", {
+        ref: thumb,
+        class: "scrollbar__thumb",
+        onMousedown: clickThumbHandler,
+        style: renderThumbStyle({
+          size: props.size,
+          move: props.move,
+          bar: bar.value
+        })
+      })
+    );
+  }
+});
+const _hoisted_1$3 = { class: "scrollbar relative h-full overflow-hidden" };
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "scroll-bar",
+  props: {
+    wrapClass: {
+      type: [String, Array],
+      default: ""
+    },
+    wrapStyle: Array,
+    viewClass: {
+      type: [String, Array],
+      default: ""
+    },
+    viewStyle: {
+      type: [String, Array],
+      default: ""
+    },
+    noresize: Boolean,
+    tag: {
+      type: String,
+      default: "div"
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const sizeWidth = ref$1("0");
+    const sizeHeight = ref$1("0");
+    const moveX = ref$1(0);
+    const moveY = ref$1(0);
+    const wrap = ref$1();
+    const resize = ref$1();
+    provide("scroll-bar-wrap", wrap);
+    const style = computed(() => {
+      let rsStyle = {};
+      if (Array.isArray(props.wrapStyle)) {
+        props.wrapStyle.forEach((it) => {
+          if (it)
+            rsStyle = Object.assign({}, rsStyle, it);
+        });
+      }
+      return rsStyle;
+    });
+    const handleScroll = () => {
+      moveY.value = unref(wrap).scrollTop * 100 / unref(wrap).clientHeight;
+      moveX.value = unref(wrap).scrollLeft * 100 / unref(wrap).clientWidth;
+    };
+    const update = () => {
+      if (!unref(wrap))
+        return;
+      const heightPercentage = unref(wrap).clientHeight * 100 / unref(wrap).scrollHeight;
+      const widthPercentage = unref(wrap).clientWidth * 100 / unref(wrap).scrollWidth;
+      sizeHeight.value = heightPercentage < 100 ? heightPercentage + "%" : "";
+      sizeWidth.value = widthPercentage < 100 ? widthPercentage + "%" : "";
+    };
+    onMounted(() => {
+      nextTick$1(update);
+      if (!props.noresize) {
+        addResizeListener(unref(resize), update);
+        addResizeListener(unref(wrap), update);
+        addEventListener("resize", update);
+      }
+    });
+    onBeforeUnmount(() => {
+      if (!props.noresize) {
+        removeResizeListener(unref(resize), update);
+        removeResizeListener(unref(wrap), update);
+        removeEventListener("resize", update);
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$3, [
+        createElementVNode("div", {
+          ref_key: "wrap",
+          ref: wrap,
+          class: normalizeClass([[__props.wrapClass, "scrollbar__wrap--hidden-default"], "h-full overflow-auto"]),
+          style: normalizeStyle(unref(style)),
+          onScroll: handleScroll
+        }, [
+          (openBlock(), createBlock(resolveDynamicComponent(__props.tag), {
+            class: normalizeClass(["box-border", __props.viewClass]),
+            ref_key: "resize",
+            ref: resize,
+            style: normalizeStyle(__props.viewStyle)
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "default")
+            ]),
+            _: 3
+          }, 8, ["class", "style"]))
+        ], 38),
+        createVNode(unref(Bar), {
+          move: moveX.value,
+          size: sizeWidth.value
+        }, null, 8, ["move", "size"]),
+        createVNode(unref(Bar), {
+          vertical: "",
+          move: moveY.value,
+          size: sizeHeight.value
+        }, null, 8, ["move", "size"])
+      ]);
+    };
+  }
+});
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "scroll-container",
+  setup(__props) {
+    const scrollbarRef = ref(null);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$6, mergeProps({
+        ref_key: "scrollbarRef",
+        ref: scrollbarRef
+      }, _ctx.$attrs, { class: "w-full h-full" }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+});
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "slot-container",
+  props: {
+    template: {
+      type: Function
+    },
+    data: {
+      type: Object
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const Container = h("div", [props.template(props.data)]);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Container));
+    };
+  }
+});
+const withInstall = (comp) => {
+  comp.install = (app) => {
+    app.component(comp.name, comp);
+  };
+  return comp;
+};
+const DtScrollContainer = withInstall(_sfc_main$5);
+withInstall(_sfc_main$4);
+const _hoisted_1$2 = { class: "flex h-full items-center" };
+const _hoisted_2$1 = { class: "pr-12" };
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  __name: "DrawerHeader",
+  props: {
+    title: {
+      type: String
+    }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$2, [
+        createElementVNode("span", null, toDisplayString(__props.title), 1),
+        createElementVNode("span", _hoisted_2$1, [
+          renderSlot(_ctx.$slots, "titleToolbar")
+        ])
+      ]);
+    };
+  }
+});
+const _hoisted_1$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$2 = /* @__PURE__ */ defineComponent({
+  __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$1(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$1(() => 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;
+      const _component_ACol = Col;
+      const _directive_icon = resolveDirective("icon");
+      const _directive_auth = resolveDirective("auth");
+      return __props.show ? (openBlock(), createBlock(_component_ACol, normalizeProps(mergeProps({ key: 0 }, unref(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?.value,
+                    disabled: button.disabled,
+                    key: unref(key),
+                    onClick: ($event) => handleBtnClick(button)
+                  }, {
+                    icon: withCtx(() => [
+                      button.preIcon ? withDirectives((openBlock(), createElementBlock("span", _hoisted_1$1, null, 512)), [
+                        [_directive_icon, button.preIcon]
+                      ]) : createCommentVNode("", true)
+                    ]),
+                    default: withCtx(() => [
+                      createTextVNode(" " + toDisplayString(unref(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(showAdvanceRef) ? (openBlock(), createBlock(_component_AButton, {
+                key: 0,
+                type: "link",
+                class: "advanced",
+                onClick: toggleAdvanced
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("span", _hoisted_3, toDisplayString(advancedRef.value ? unref(t)("UI.ADVANCED") : unref(t)("UI.EXPAND")), 1),
+                  createElementVNode("span", {
+                    class: normalizeClass(unref(getAdvanceClass))
+                  }, _hoisted_5, 2)
+                ]),
+                _: 1
+              })) : createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["style"])
+        ]),
+        _: 1
+      }, 16)) : createCommentVNode("", true);
+    };
+  }
+});
+const _hoisted_1 = {
+  class: "flex items-center",
+  style: { gap: "10px" }
+};
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "DrawerFooter",
+  props: {
+    buttons: Object,
+    showSave: { type: Boolean, default: true },
+    showCancel: { type: Boolean, default: true },
+    okText: { type: String },
+    cancelText: { type: String }
+  },
+  emits: [
+    "handleSave",
+    "handleCancel"
+  ],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const { t } = useI18n("UI");
+    const buttonList = computed(() => {
+      if (props.buttons && props.buttons.length)
+        return props.buttons;
+      let buttonActions = [
+        { t: "\u4FDD\u5B58", name: props.okText || t("SAVE"), preIcon: "mdi:content-save", type: "primary", flag: "OK" },
+        { t: "\u5173\u95ED", name: props.cancelText || t("CLOSE"), preIcon: "mdi:close", flag: "CANCEL" }
+      ];
+      if (!props.showSave)
+        buttonActions = buttonActions.filter((btn) => btn.flag !== "OK");
+      if (!props.showCancel)
+        buttonActions = buttonActions.filter((btn) => btn.flag !== "CANCEL");
+      return buttonActions;
+    });
+    function handleMethod(item) {
+      switch (item.flag) {
+        case "OK":
+          emits("handleSave");
+          break;
+        case "CANCEL":
+          emits("handleCancel");
+          break;
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        renderSlot(_ctx.$slots, "appendFooter"),
+        createVNode(_sfc_main$2, {
+          mode: "dialog",
+          buttonList: unref(buttonList),
+          onHandleMethod: _cache[0] || (_cache[0] = ($event) => handleMethod($event))
+        }, null, 8, ["buttonList"])
+      ]);
+    };
+  }
+});
+const basicProps = {
+  t: {
+    type: String
+  },
+  title: {
+    type: String
+  },
+  visible: { type: Boolean },
+  loading: { type: Boolean },
+  loadingTip: { type: String, default: "\u52A0\u8F7D\u4E2D..." },
+  mask: { type: Boolean, default: true },
+  maskClosable: { type: Boolean, default: true },
+  keyboard: { type: Boolean, default: true },
+  maskStyle: Object,
+  closeFunc: {
+    type: [Function, Object],
+    default: null
+  },
+  destroyOnClose: { type: Boolean },
+  getContainer: {
+    type: [Object, String]
+  },
+  width: { type: [String, Number] },
+  showOkBtn: {
+    type: Boolean,
+    default: true
+  },
+  showCancelBtn: {
+    type: Boolean,
+    default: true
+  },
+  okText: {
+    type: String
+  },
+  cancelText: {
+    type: String
+  },
+  footer: {
+    type: Array
+  },
+  afterClose: Function
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: basicProps,
+  emits: ["cancel", "save", "register", "visible-change"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const propsRef = ref$1(null);
+    const auths = DtCache.getLocal(CacheKey.AUTHS);
+    const visibleRef = ref$1(false);
+    const getMergeProps = computed(() => {
+      return deepMerge(toRaw(props), unref(propsRef));
+    });
+    const getshowFooter = computed(() => {
+      const { footer } = unref(getProps);
+      if (isUnDef(footer))
+        return true;
+      const filterFooterLen = footer.filter((it) => {
+        if (it.auth && auths.indexOf(it.auth) !== -1 || !it.auth)
+          return true;
+        return false;
+      }).length;
+      return !!filterFooterLen;
+    });
+    const getProps = computed(() => {
+      let opt = {
+        placement: "right",
+        ...unref(attrs),
+        ...unref(getMergeProps),
+        visible: unref(visibleRef),
+        bodyStyle: {
+          padding: 0
+        }
+      };
+      const { getContainer, width } = opt;
+      if (!getContainer) {
+        opt = {
+          ...opt,
+          getContainer: ".dt-layout-content",
+          style: {
+            position: "absolute"
+          },
+          width: width || "100%"
+        };
+      } else {
+        opt.width = width || "30%";
+      }
+      return opt;
+    });
+    const getScrollContentStyle = computed(() => {
+      return {
+        position: "relative",
+        height: `100%`
+      };
+    });
+    function handleSave() {
+      emits("save");
+    }
+    async function handleCancel(e = null) {
+      const { closeFunc } = unref(getProps);
+      if (closeFunc && isFunction(closeFunc)) {
+        const isClose = await closeFunc();
+        visibleRef.value = !isClose;
+        return;
+      }
+      const { afterClose } = unref(getProps);
+      if (afterClose && isFunction(afterClose)) {
+        afterClose();
+      }
+      visibleRef.value = false;
+      propsRef.value.visible = false;
+      emits("cancel", e);
+    }
+    function setDrawerProps(props2) {
+      propsRef.value = deepMerge(unref(propsRef) || {}, props2);
+    }
+    const drawerMethods = {
+      setDrawerProps
+    };
+    const instance = getCurrentInstance();
+    instance && emits("register", drawerMethods, instance.uid);
+    watch(
+      () => unref(propsRef).visible,
+      (v) => {
+        emits("visible-change", v);
+        visibleRef.value = v;
+      },
+      { immediate: false }
+    );
+    return (_ctx, _cache) => {
+      const _component_ADrawer = Drawer;
+      return openBlock(), createBlock(_component_ADrawer, mergeProps({
+        class: "dt-drawer",
+        onClose: handleCancel
+      }, unref(getProps), {
+        footerStyle: {
+          padding: unref(getshowFooter) ? "10px 16px" : "0"
+        }
+      }), createSlots({
+        default: withCtx(() => [
+          createVNode(unref(DtScrollContainer), {
+            style: normalizeStyle(unref(getScrollContentStyle))
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "default")
+            ]),
+            _: 3
+          }, 8, ["style"])
+        ]),
+        _: 2
+      }, [
+        !_ctx.$slots.title ? {
+          name: "title",
+          fn: withCtx(() => [
+            createVNode(_sfc_main$3, {
+              title: unref(getProps).title
+            }, {
+              titleToolbar: withCtx(() => [
+                renderSlot(_ctx.$slots, "titleToolbar")
+              ]),
+              _: 3
+            }, 8, ["title"])
+          ]),
+          key: "0"
+        } : {
+          name: "title",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "title")
+          ]),
+          key: "1"
+        },
+        unref(getshowFooter) ? {
+          name: "footer",
+          fn: withCtx(() => [
+            createVNode(_sfc_main$1, {
+              buttons: propsRef.value?.footer,
+              showSave: unref(getProps).showOkBtn,
+              showCancel: unref(getProps).showCancelBtn,
+              okText: unref(getProps).okText,
+              cancelText: unref(getProps).cancelText,
+              onHandleSave: handleSave,
+              onHandleCancel: handleCancel
+            }, createSlots({ _: 2 }, [
+              renderList(Object.keys(_ctx.$slots), (item) => {
+                return {
+                  name: item,
+                  fn: withCtx((data) => [
+                    renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
+                  ])
+                };
+              })
+            ]), 1032, ["buttons", "showSave", "showCancel", "okText", "cancelText"])
+          ]),
+          key: "2"
+        } : void 0
+      ]), 1040, ["footerStyle"]);
+    };
+  }
+});
+const orgDialogProp = reactive({});
+const cbTransfer = reactive({});
+const dataTransfer = reactive({});
+function useDrawerOut() {
+  const drawer = ref$1(null);
+  const loaded = ref$1(false);
+  const uid = ref$1("");
+  const { isProd } = useApp();
+  function register(drawerMethods, uuid) {
+    if (!getCurrentInstance()) {
+      throw new Error("useDrawer\u53EA\u80FD\u5728setup()\u6216\u8005\u51FD\u6570\u4E2D\u4F7F\u7528");
+    }
+    uid.value = uuid;
+    onUnmounted(() => {
+      if (unref(isProd)) {
+        drawer.value = null;
+        loaded.value = false;
+        dataTransfer[unref(uid)] = null;
+        orgDialogProp[unref(uid)] = null;
+        cbTransfer[unref(uid)] = (res) => {
+        };
+      }
+    });
+    if (unref(loaded) && drawerMethods === unref(drawer))
+      return;
+    drawer.value = drawerMethods;
+    loaded.value = true;
+  }
+  const getInstance = () => {
+    const instance = unref(drawer);
+    if (!instance) {
+      error("useDrawerOut \u5B9E\u4F8B\u672A\u5B9A\u4E49");
+    }
+    return instance;
+  };
+  const methods = {
+    setDrawerProps: (props) => {
+      getInstance()?.setDrawerProps(props);
+    },
+    openDrawer: (params = null, afterClose) => {
+      const id = unref(uid);
+      dataTransfer[id] = isObject(params) ? { ...toRaw$1(params) } : params;
+      getInstance()?.setDrawerProps({
+        defaultFullscreen: false,
+        ...orgDialogProp[id],
+        visible: true
+      });
+      cbTransfer[id] = (res) => {
+        if (afterClose && isFunction(afterClose)) {
+          afterClose(res);
+        }
+      };
+    },
+    closeDrawer: () => {
+      getInstance()?.setDrawerProps({ visible: false });
+    }
+  };
+  return [register, methods];
+}
+function useDrawer(props, setModalData) {
+  const drawerInstanceRef = ref$1(null);
+  const currentInstance = getCurrentInstance();
+  const uidRef = ref$1("");
+  const { isProd } = useApp();
+  const getInstance = () => {
+    const instance = unref(drawerInstanceRef);
+    if (!instance) {
+      error("useDrawer \u5B9E\u4F8B\u672A\u5B9A\u4E49");
+    }
+    return instance;
+  };
+  function register(drawerInstance, uuid) {
+    if (unref(isProd)) {
+      drawerInstanceRef.value = null;
+    }
+    uidRef.value = uuid;
+    drawerInstanceRef.value = drawerInstance;
+    currentInstance?.emit("register", drawerInstance, uuid);
+    orgDialogProp[uuid] = toRaw$1(props);
+    drawerInstance.setDrawerProps(props);
+  }
+  watchEffect(() => {
+    const data = dataTransfer[unref(uidRef)];
+    if (!data)
+      return;
+    if (!setModalData || !isFunction(setModalData))
+      return;
+    nextTick(() => {
+      setModalData(data);
+    });
+  });
+  const methods = {
+    changeLoading: (loading = true) => {
+      getInstance()?.setDrawerProps({ loading });
+    },
+    closeDrawer: (rsp) => {
+      if (cbTransfer[unref(uidRef)])
+        cbTransfer[unref(uidRef)](rsp);
+      getInstance()?.setDrawerProps({ visible: false });
+    },
+    setDrawerProps: (props2) => {
+      getInstance()?.setDrawerProps(props2);
+    }
+  };
+  return [register, methods];
+}
+const DtDrawer = withInstall(_sfc_main);
+export {
+  DtDrawer,
+  useDrawer,
+  useDrawerOut
+};