@dt-frames/ui 3.0.1 → 4.0.1

package/es/components/iframe/src/index.d.ts

@@ -1,43 +0,0 @@
-declare const _default: import("vue").DefineComponent<{
-    showLoading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    src: {
-        type: StringConstructor;
-    };
-    height: {
-        type: globalThis.PropType<string | number>;
-    };
-    exeReduce: {
-        type: NumberConstructor;
-        default: number;
-    };
-    receiveMsg: {
-        type: globalThis.PropType<(msg: string) => void>;
-    };
-}, {
-    iframe: any;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    showLoading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    src: {
-        type: StringConstructor;
-    };
-    height: {
-        type: globalThis.PropType<string | number>;
-    };
-    exeReduce: {
-        type: NumberConstructor;
-        default: number;
-    };
-    receiveMsg: {
-        type: globalThis.PropType<(msg: string) => void>;
-    };
-}>>, {
-    showLoading: boolean;
-    exeReduce: number;
-}, {}>;
-export default _default;

package/es/components/iframe/src/index.scss

@@ -1,20 +0,0 @@
-.dt-iframe{
-    .ant-spin-nested-loading {
-        @apply relative h-full;
-  
-        .ant-spin-container {
-            @apply w-full h-full;
-        }
-    }
-  
-    &__mask {
-        @apply absolute top-0 left-0 w-full h-full;
-    }
-  
-    &__main {
-        @apply w-full h-full overflow-hidden bg-white;
-
-        border: 0;
-        box-sizing: border-box;
-    }
-}

package/es/components/modal/index.d.ts

@@ -1,5 +0,0 @@
-import { useModal, useModalOut } from './src/hooks/useModal';
-import DtModal from "./src/index";
-import ModalFooter from "./src/components/ModalFooter";
-import { basicProps } from './src/props';
-export { DtModal, ModalFooter, basicProps, useModalOut, useModal };

package/es/components/modal/index.js

@@ -1,636 +0,0 @@
-import { isProd, isObject, isFunction, error, useTimeoutFn, getPopupContainer, extendSlots, dispatchResize, useI18n, isArray, isBoolean, useAppStore, deepMerge } from "@dt-frames/core";
-import { reactive, ref, getCurrentInstance, unref, onUnmounted, watch, toRaw, watchEffect, toRefs, useAttrs, createVNode, isVNode, computed, defineComponent, openBlock, createElementBlock, normalizeClass, Fragment, createBlock, withCtx, createElementVNode, createCommentVNode, renderSlot, nextTick, mergeProps, createSlots, createTextVNode, toDisplayString, renderList, normalizeProps, guardReactiveProps } from "vue";
-import { Tooltip, Spin } from "ant-design-vue/es";
-import { omit } from "lodash-es";
-import { Modal } from "ant-design-vue";
-import { DtFormButtons } from "../form";
-const orgDialogProp = reactive({});
-const cbTransfer = {};
-const dataTransfer = {};
-const cbFun = {};
-function useModalOut() {
-  const modal = ref(null);
-  const loaded = ref(true);
-  const uid = ref(null);
-  const open = ref(false);
-  function register(modalMethod, uuid, isOpen) {
-    if (!getCurrentInstance()) {
-      throw new Error("useModal\u53EA\u80FD\u5728setup()\u6216\u8005\u51FD\u6570\u4E2D\u4F7F\u7528");
-    }
-    uid.value = uuid;
-    if (unref(loaded) && modalMethod === unref(modal))
-      return;
-    modal.value = modalMethod;
-    loaded.value = true;
-    onUnmounted(() => {
-      if (isProd()) {
-        modal.value = null;
-        loaded.value = false;
-        delete dataTransfer[unref(uid)];
-        delete orgDialogProp[unref(uid)];
-        delete cbTransfer[unref(uid)];
-      }
-    });
-    watch(
-      () => unref(isOpen),
-      (v) => {
-        if (v === false) {
-          setTimeout(() => {
-            open.value = v;
-          }, 250);
-        } else {
-          open.value = v;
-        }
-      }
-    );
-  }
-  const getInstance = () => {
-    const instance = unref(modal);
-    if (!instance) {
-      error("useModalOut \u5B9E\u4F8B\u672A\u5B9A\u4E49");
-    }
-    return instance;
-  };
-  const methods = {
-    setModalProps: (props) => {
-      getInstance()?.setModalProps(props);
-    },
-    redoModalHeight: () => {
-      getInstance()?.redoModalHeight?.();
-    },
-    openModal: (params, afterClose) => {
-      open.value = true;
-      let uidWatch = watch(
-        () => unref(uid),
-        (v) => {
-          if (v) {
-            const id = unref(uid);
-            cbFun[id]?.(isObject(params) ? { ...toRaw(params) } : params);
-            getInstance()?.setModalProps({
-              footer: [],
-              defaultFullscreen: false,
-              ...orgDialogProp[id],
-              open: true
-            });
-            cbTransfer[id] = (res) => {
-              if (afterClose && isFunction(afterClose)) {
-                afterClose(res);
-              }
-            };
-            uidWatch();
-          }
-        }
-      );
-    },
-    closeModal: () => {
-      getInstance()?.setModalProps({ open: false });
-    }
-  };
-  return [register, methods, open];
-}
-function useModal(props, setModalData) {
-  const modalInstanceRef = ref(null);
-  const uidRef = ref(null);
-  const getInstance = () => {
-    const instance = unref(modalInstanceRef);
-    if (!instance) {
-      error("useModal \u5B9E\u4F8B\u672A\u5B9A\u4E49");
-    }
-    return instance;
-  };
-  const register = (modalInstance, uuid) => {
-    uidRef.value = uuid;
-    modalInstanceRef.value = modalInstance;
-    cbFun[uuid] = setModalData;
-    orgDialogProp[uuid] = toRaw(props);
-    modalInstance.setModalProps(props);
-  };
-  const methods = {
-    setLoading: (loading = true) => {
-      getInstance()?.setModalProps({ loading });
-    },
-    getModalProps: () => {
-      return getInstance()?.getModalProps();
-    },
-    closeModal: (rsp) => {
-      if (cbTransfer[unref(uidRef)])
-        cbTransfer[unref(uidRef)](rsp);
-      getInstance()?.setModalProps({ open: false });
-    },
-    setModalProps: (props2) => {
-      getInstance()?.setModalProps(props2);
-    },
-    redoModalHeight: () => {
-      const callRedo = getInstance()?.redoModalHeight;
-      callRedo && callRedo();
-    }
-  };
-  return [register, methods];
-}
-function useDragMove(context) {
-  const getStyle = (dom, attr) => {
-    return getComputedStyle(dom)[attr];
-  };
-  const drag = (wrap) => {
-    if (!wrap)
-      return;
-    wrap.setAttribute("data-drag", unref(context.draggable));
-    const dialogHeaderEl = wrap.querySelector(".ant-modal-header");
-    const dragDom = wrap.querySelector(".ant-modal");
-    if (!dialogHeaderEl || !dragDom || !unref(context.draggable))
-      return;
-    dialogHeaderEl.style.cursor = "move";
-    dialogHeaderEl.onmousedown = (e) => {
-      if (!e)
-        return;
-      const disX = e.clientX;
-      const disY = e.clientY;
-      const screenWidth = document.body.clientWidth;
-      const screenHeight = document.documentElement.clientHeight;
-      const dragDomWidth = dragDom.offsetWidth;
-      const dragDomheight = dragDom.offsetHeight;
-      const minDragDomLeft = dragDom.offsetLeft;
-      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
-      const minDragDomTop = dragDom.offsetTop;
-      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
-      const domLeft = getStyle(dragDom, "left");
-      const domTop = getStyle(dragDom, "top");
-      let styL = +domLeft;
-      let styT = +domTop;
-      if (domLeft.includes("%")) {
-        styL = +document.body.clientWidth * (+domLeft.replace(/%/g, "") / 100);
-        styT = +document.body.clientHeight * (+domTop.replace(/%/g, "") / 100);
-      } else {
-        styL = +domLeft.replace(/px/g, "");
-        styT = +domTop.replace(/px/g, "");
-      }
-      document.onmousemove = function(e2) {
-        let left = e2.clientX - disX;
-        let top = e2.clientY - disY;
-        if (-left > minDragDomLeft) {
-          left = -minDragDomLeft;
-        } else if (left > maxDragDomLeft) {
-          left = maxDragDomLeft;
-        }
-        if (-top > minDragDomTop) {
-          top = -minDragDomTop;
-        } else if (top > maxDragDomTop) {
-          top = maxDragDomTop;
-        }
-        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
-      };
-      document.onmouseup = () => {
-        document.onmousemove = null;
-        document.onmouseup = null;
-      };
-    };
-  };
-  const handleDrag = () => {
-    const dragWraps = document.querySelectorAll(".ant-modal-wrap");
-    for (const wrap of Array.from(dragWraps)) {
-      if (!wrap)
-        continue;
-      const display = getStyle(wrap, "display");
-      const draggable = wrap.getAttribute("data-drag");
-      if (display !== "none") {
-        if (draggable === null) {
-          drag(wrap);
-        }
-      }
-    }
-  };
-  watchEffect(() => {
-    if (!unref(context.open) || !unref(context.draggable)) {
-      return;
-    }
-    useTimeoutFn(() => {
-      handleDrag();
-    }, 30);
-  });
-}
-const basicProps = {
-  t: {
-    type: String
-  },
-  open: {
-    type: Boolean,
-    default: true
-  },
-  closable: {
-    type: Boolean,
-    default: true
-  },
-  scrollTop: {
-    type: Boolean,
-    default: true
-  },
-  height: { type: Number },
-  minHeight: { type: Number },
-  width: { type: [String, Number] },
-  draggable: {
-    type: Boolean,
-    default: true
-  },
-  defaultFullscreen: {
-    type: Boolean
-  },
-  canFullscreen: {
-    type: Boolean,
-    default: true
-  },
-  title: {
-    type: String
-  },
-  loading: { type: Boolean, default: false },
-  loadingTip: { type: String, default: "\u52A0\u8F7D\u4E2D..." },
-  wrapClassName: { type: String },
-  zIndex: { type: Number },
-  centered: { type: Boolean },
-  showOkBtn: {
-    type: Boolean,
-    default: true
-  },
-  showCancelBtn: {
-    type: Boolean,
-    default: true
-  },
-  okText: {
-    type: String
-  },
-  cancelText: {
-    type: String
-  },
-  mask: { type: Boolean, default: true },
-  maskClosable: { type: Boolean, default: true },
-  keyboard: { type: Boolean, default: true },
-  maskStyle: Object,
-  footer: {
-    type: Object
-  },
-  bodyStyle: Object,
-  wrapperProps: Object,
-  getContainer: Function,
-  closeFunc: Function,
-  afterClose: Function
-};
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const _sfc_main$3 = {
-  name: "Modal",
-  inheritAttrs: false,
-  props: basicProps,
-  emits: ["cancel"],
-  setup(props, {
-    slots,
-    emit
-  }) {
-    const {
-      open,
-      draggable
-    } = toRefs(props);
-    const attrs = useAttrs();
-    useDragMove({
-      open,
-      draggable
-    });
-    const onCancel = (e) => emit("cancel", e);
-    return () => {
-      let _slot;
-      const propsData = {
-        ...unref(attrs),
-        ...props,
-        destroyOnClose: true,
-        onCancel,
-        centered: true,
-        getContainer: getPopupContainer()
-      };
-      if (!propsData?.open)
-        return null;
-      return createVNode(Modal, propsData, _isSlot(_slot = extendSlots(slots)) ? _slot : {
-        default: () => [_slot]
-      });
-    };
-  }
-};
-function useFullScreen(wrapClassName) {
-  const fullScreenRef = ref(false);
-  const getWrapClassName = computed(() => {
-    const clsName = unref(wrapClassName) || "";
-    const cls = unref(fullScreenRef) ? `fullscreen-modal ${clsName} ` : unref(clsName);
-    return `dt-modal overflow-hidden ${cls}`;
-  });
-  function toggleFullScreen(e) {
-    e && e.stopPropagation();
-    fullScreenRef.value = !unref(fullScreenRef);
-    dispatchResize();
-  }
-  return {
-    fullScreenRef,
-    getWrapClassName,
-    toggleFullScreen
-  };
-}
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  __name: "CloseIcon",
-  props: {
-    canFullscreen: { type: Boolean, default: true },
-    fullScreen: { type: Boolean }
-  },
-  emits: ["cancel", "fullscreen"],
-  setup(__props, { emit }) {
-    const props = __props;
-    const { t } = useI18n("UI");
-    const getClass = computed(() => {
-      return [
-        "dt-basic-modal-close",
-        `dt-basic-modal-close--custom`,
-        {
-          [`dt-basic-modal-close--can-full`]: props.canFullscreen
-        }
-      ];
-    });
-    function handleCancel(e) {
-      emit("cancel", e);
-    }
-    function handleFullScreen(e) {
-      e?.stopPropagation();
-      e?.preventDefault();
-      emit("fullscreen");
-    }
-    return (_ctx, _cache) => {
-      const _component_ATooltip = Tooltip;
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["flex items-center justify-center", unref(getClass)])
-      }, [
-        __props.canFullscreen ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-          __props.fullScreen ? (openBlock(), createBlock(_component_ATooltip, {
-            key: 0,
-            title: unref(t)("EXIT_FULLSCREEN"),
-            placement: "bottom"
-          }, {
-            default: withCtx(() => [
-              createElementVNode("i", {
-                class: "i ic:baseline-fullscreen-exit hover:font-bold inline-block w-10 pr-4",
-                onClick: handleFullScreen
-              })
-            ]),
-            _: 1
-          }, 8, ["title"])) : (openBlock(), createBlock(_component_ATooltip, {
-            key: 1,
-            title: unref(t)("FULLSCREEN"),
-            placement: "bottom"
-          }, {
-            default: withCtx(() => [
-              createElementVNode("i", {
-                class: "i ic:baseline-fullscreen hover:font-bold inline-block w-10 pr-4",
-                onClick: handleFullScreen
-              })
-            ]),
-            _: 1
-          }, 8, ["title"]))
-        ], 64)) : createCommentVNode("", true),
-        createElementVNode("i", {
-          class: "i mdi:close w-10",
-          onClick: handleCancel
-        })
-      ], 2);
-    };
-  }
-});
-const _hoisted_1 = { class: "flex w-auto gap-3 justify-end items-center" };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "ModalFooter",
-  props: {
-    authPrefix: { type: String },
-    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 (isArray(props.buttons) && props.buttons && props.buttons?.length)
-        return props.buttons;
-      if (isBoolean(props.buttons) && !props.buttons)
-        return [];
-      let buttonActions = [
-        { t: "\u5173\u95ED", label: props.cancelText || t("CLOSE"), preIcon: "mdi:close", flag: "CANCEL" },
-        { t: "\u4FDD\u5B58", label: props.okText || t("SAVE"), preIcon: "mdi:content-save", auth: "edit", type: "primary", flag: "OK" }
-      ];
-      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(unref(DtFormButtons), {
-          mode: "dialog",
-          buttonList: unref(buttonList),
-          authPrefix: __props.authPrefix,
-          onHandleMethod: _cache[0] || (_cache[0] = ($event) => handleMethod($event))
-        }, null, 8, ["buttonList", "authPrefix"])
-      ]);
-    };
-  }
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "index",
-  props: basicProps,
-  emits: ["open-change", "cancel", "save", "register", "toggle-fullscreen", "update:open"],
-  setup(__props, { expose: __expose, emit: emits }) {
-    const props = __props;
-    const openRef = ref(false);
-    const propsRef = ref();
-    const modalWrapperRef = ref(null);
-    const { getWrapClassName, toggleFullScreen, fullScreenRef } = useFullScreen(computed(() => unref(propsRef)?.wrapClassName));
-    function handleFullscreen(e) {
-      toggleFullScreen(e);
-      emits("toggle-fullscreen", unref(fullScreenRef));
-    }
-    const getMergeProps = computed(() => {
-      return {
-        ...props,
-        ...unref(propsRef)
-      };
-    });
-    const { appConf } = useAppStore();
-    const getBindValue = computed(() => {
-      const bodyStyle = unref(getMergeProps)?.bodyStyle ?? {
-        padding: "24px"
-      };
-      const bindValue = {
-        ...unref(getMergeProps),
-        ...unref(propsRef),
-        open: unref(openRef),
-        wrapClassName: unref(getWrapClassName),
-        bodyStyle
-      };
-      bindValue.width = bindValue.width ?? appConf.ui.modal.width;
-      let omitArr = unref(fullScreenRef) ? ["height", "title"] : ["title"];
-      if (isArray(unref(propsRef)?.footer)) {
-        omitArr.push("footer");
-      }
-      return omit(bindValue, omitArr);
-    });
-    const modalMethods = {
-      getModalProps,
-      setModalProps,
-      redoModalHeight: () => {
-        nextTick(() => {
-          if (unref(modalWrapperRef)) {
-            unref(modalWrapperRef).setModalHeight();
-          }
-        });
-      }
-    };
-    const instance = getCurrentInstance();
-    if (instance) {
-      emits("register", modalMethods, instance.uid, openRef);
-    }
-    function setModalProps(props2) {
-      propsRef.value = deepMerge(unref(propsRef) || {}, props2);
-      if (Reflect.has(props2, "open")) {
-        openRef.value = !!props2.open;
-      }
-      if (Reflect.has(props2, "defaultFullscreen")) {
-        fullScreenRef.value = !!props2.defaultFullscreen;
-      }
-    }
-    function getModalProps() {
-      return unref(getBindValue);
-    }
-    function handleSave() {
-      emits("save");
-    }
-    async function handleCancel(e = null) {
-      if (e) {
-        e?.stopPropagation();
-        if (e.target?.classList?.contains("dt-basic-modal-close--custom"))
-          return;
-        if (props.closeFunc && isFunction(props.closeFunc)) {
-          const isClose = await props.closeFunc();
-          openRef.value = !isClose;
-          return;
-        }
-      }
-      const { afterClose } = unref(getBindValue);
-      if (afterClose && isFunction(afterClose)) {
-        afterClose();
-      }
-      openRef.value = false;
-      emits("cancel", e);
-    }
-    watch(() => unref(openRef), (v) => {
-      emits("open-change", v);
-      emits("update:open", v);
-      nextTick(() => {
-        if (props.scrollTop && v && unref(modalWrapperRef)) {
-          unref(modalWrapperRef).$el.scrollTop = 0;
-        }
-      });
-    }, {
-      immediate: false
-    });
-    __expose({
-      getBindValue
-    });
-    return (_ctx, _cache) => {
-      const _component_ASpin = Spin;
-      return openBlock(), createBlock(_sfc_main$3, mergeProps(unref(getBindValue), { onCancel: handleCancel }), createSlots({
-        default: withCtx(() => [
-          createVNode(_component_ASpin, {
-            spinning: unref(getBindValue).loading,
-            tip: unref(getBindValue).loadingTip
-          }, {
-            default: withCtx(() => [
-              renderSlot(_ctx.$slots, "default")
-            ]),
-            _: 3
-          }, 8, ["spinning", "tip"])
-        ]),
-        _: 2
-      }, [
-        !_ctx.$slots.closeIcon ? {
-          name: "closeIcon",
-          fn: withCtx(() => [
-            createVNode(_sfc_main$2, {
-              canFullscreen: unref(getBindValue).canFullscreen,
-              fullScreen: unref(fullScreenRef),
-              onCancel: handleCancel,
-              onFullscreen: handleFullscreen
-            }, null, 8, ["canFullscreen", "fullScreen"])
-          ]),
-          key: "0"
-        } : void 0,
-        !_ctx.$slots.title ? {
-          name: "title",
-          fn: withCtx(() => [
-            createTextVNode(toDisplayString(unref(getMergeProps).title), 1)
-          ]),
-          key: "1"
-        } : void 0,
-        !_ctx.$slots.footer ? {
-          name: "footer",
-          fn: withCtx(() => [
-            createVNode(_sfc_main$1, {
-              authPrefix: unref(getBindValue).authPrefix,
-              buttons: unref(propsRef)?.footer,
-              showSave: unref(getBindValue).showOkBtn,
-              showCancel: unref(getBindValue).showCancelBtn,
-              okText: unref(getBindValue).okText,
-              cancelText: unref(getBindValue).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, ["authPrefix", "buttons", "showSave", "showCancel", "okText", "cancelText"])
-          ]),
-          key: "2"
-        } : void 0,
-        renderList(Object.keys(unref(omit)(_ctx.$slots, "default")), (item) => {
-          return {
-            name: item,
-            fn: withCtx((data) => [
-              renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
-            ])
-          };
-        })
-      ]), 1040);
-    };
-  }
-});
-export {
-  _sfc_main as DtModal,
-  _sfc_main$1 as ModalFooter,
-  basicProps,
-  useModal,
-  useModalOut
-};