@dt-frames/ui 2.0.24 → 3.0.1

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

@@ -1,20 +1,16 @@
 import { ExtractPropTypes } from 'vue';
-import { basicProps } from './props';
-import { ModalMethods } from './types/modal.type';
-declare const _sfc_main: import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     t: {
         type: StringConstructor;
     };
-    visible: {
+    open: {
         type: BooleanConstructor;
+        default: boolean;
     };
     closable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    destroyOnClose: {
-        type: BooleanConstructor;
-    };
     scrollTop: {
         type: BooleanConstructor;
         default: boolean;
@@ -26,7 +22,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: NumberConstructor;
     };
     width: {
-        type: import("vue").PropType<String | Number>;
+        type: globalThis.PropType<String | Number>;
     };
     draggable: {
         type: BooleanConstructor;
@@ -40,7 +36,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         default: boolean;
     };
     title: {
-        type: import("vue").PropType<String | import("vue").ComputedRef<String> | ((data: import("@dt-frames/core").Recordable<any>) => String)>;
+        type: globalThis.PropType<String | globalThis.ComputedRef<String> | globalThis.Ref<String> | ((data: globalThis.Recordable) => String)>;
     };
     loading: {
         type: BooleanConstructor;
@@ -50,10 +46,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    useWrapper: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     wrapClassName: {
         type: StringConstructor;
     };
@@ -89,349 +81,29 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    maskStyle: import("vue").PropType<import("vue").CSSProperties>;
+    maskStyle: globalThis.PropType<import("vue").CSSProperties>;
     footer: {
-        type: import("vue").PropType<import("../../form").ButtonProps[]>;
+        type: globalThis.PropType<import("../../form").ButtonProps[]>;
     };
-    bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
+    bodyStyle: globalThis.PropType<import("vue").CSSProperties>;
     wrapperProps: ObjectConstructor;
-    getContainer: import("vue").PropType<() => any>;
-    closeFunc: import("vue").PropType<() => Promise<boolean>>;
+    getContainer: globalThis.PropType<() => any>;
+    closeFunc: globalThis.PropType<() => Promise<boolean>>;
     afterClose: FunctionConstructor;
 }, {
-    props: any;
-    emits: (event: "visible-change" | "cancel" | "save" | "register" | "toggle-fullscreen" | "update:visible", ...args: any[]) => void;
-    visibleRef: import("vue").Ref<boolean>;
-    propsRef: import("vue").Ref<Partial<ExtractPropTypes<{
-        t: {
-            type: StringConstructor;
-        };
-        visible: {
-            type: BooleanConstructor;
-        };
-        closable: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        destroyOnClose: {
-            type: BooleanConstructor;
-        };
-        scrollTop: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        height: {
-            type: NumberConstructor;
-        };
-        minHeight: {
-            type: NumberConstructor;
-        };
-        width: {
-            type: import("vue").PropType<String | Number>;
-        };
-        draggable: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        defaultFullscreen: {
-            type: BooleanConstructor;
-        };
-        canFullscreen: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        title: {
-            type: import("vue").PropType<String | import("vue").ComputedRef<String> | ((data: import("@dt-frames/core").Recordable<any>) => String)>;
-        };
-        loading: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        loadingTip: {
-            type: StringConstructor;
-            default: string;
-        };
-        useWrapper: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        wrapClassName: {
-            type: StringConstructor;
-        };
-        zIndex: {
-            type: NumberConstructor;
-        };
-        centered: {
-            type: BooleanConstructor;
-        };
-        showOkBtn: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        showCancelBtn: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        okText: {
-            type: StringConstructor;
-        };
-        cancelText: {
-            type: StringConstructor;
-        };
-        mask: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        maskClosable: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        keyboard: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        maskStyle: import("vue").PropType<import("vue").CSSProperties>;
-        footer: {
-            type: import("vue").PropType<import("../../form").ButtonProps[]>;
-        };
-        bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
-        wrapperProps: ObjectConstructor;
-        getContainer: import("vue").PropType<() => any>;
-        closeFunc: import("vue").PropType<() => Promise<boolean>>;
-        afterClose: FunctionConstructor;
-    }>>>;
-    modalWrapperRef: any;
-    getWrapClassName: import("vue").ComputedRef<string>;
-    toggleFullScreen: (e: Event) => void;
-    fullScreenRef: import("vue").Ref<boolean>;
-    handleFullscreen: (e: Event) => void;
-    getMergeProps: import("vue").ComputedRef<any>;
-    getBindValue: import("vue").ComputedRef<any>;
-    modalMethods: ModalMethods;
-    instance: import("vue").ComponentInternalInstance;
-    setModalProps: (props: Partial<ExtractPropTypes<typeof basicProps>>) => void;
-    handleSave: () => void;
-    handleCancel: (e?: Event) => Promise<void>;
-    readonly omit: any;
-    Modal: {
-        name: string;
-        inheritAttrs: boolean;
-        props: {
-            t: {
-                type: StringConstructor;
-            };
-            visible: {
-                type: BooleanConstructor;
-            };
-            closable: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            destroyOnClose: {
-                type: BooleanConstructor;
-            };
-            scrollTop: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            height: {
-                type: NumberConstructor;
-            };
-            minHeight: {
-                type: NumberConstructor;
-            };
-            width: {
-                type: import("vue").PropType<String | Number>;
-            };
-            draggable: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            defaultFullscreen: {
-                type: BooleanConstructor;
-            };
-            canFullscreen: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            title: {
-                type: import("vue").PropType<String | import("vue").ComputedRef<String> | ((data: import("@dt-frames/core").Recordable<any>) => String)>;
-            };
-            loading: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            loadingTip: {
-                type: StringConstructor;
-                default: string;
-            };
-            useWrapper: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            wrapClassName: {
-                type: StringConstructor;
-            };
-            zIndex: {
-                type: NumberConstructor;
-            };
-            centered: {
-                type: BooleanConstructor;
-            };
-            showOkBtn: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            showCancelBtn: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            okText: {
-                type: StringConstructor;
-            };
-            cancelText: {
-                type: StringConstructor;
-            };
-            mask: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            maskClosable: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            keyboard: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            maskStyle: import("vue").PropType<import("vue").CSSProperties>;
-            footer: {
-                type: import("vue").PropType<import("../../form").ButtonProps[]>;
-            };
-            bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
-            wrapperProps: ObjectConstructor;
-            getContainer: import("vue").PropType<() => any>;
-            closeFunc: import("vue").PropType<() => Promise<boolean>>;
-            afterClose: FunctionConstructor;
-        };
-        emits: string[];
-        setup(props: any, { slots, emit }: {
-            slots: any;
-            emit: any;
-        }): () => JSX.Element;
-    };
-    CloseIcon: import("vue").DefineComponent<{
-        canFullscreen: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        fullScreen: {
-            type: BooleanConstructor;
-        };
-    }, {
-        t: {
-            (key: string): string;
-            (key: string, locale: string): string;
-            (key: string, locale: string, list: unknown[]): string;
-            (key: string, locale: string, named: Record<string, unknown>): string;
-            (key: string, list: unknown[]): string;
-            (key: string, named: Record<string, unknown>): string;
-        };
-        props: any;
-        emit: (event: "cancel" | "fullscreen", ...args: any[]) => void;
-        getClass: import("vue").ComputedRef<(string | {
-            "dt-basic-modal-close--can-full": boolean;
-        })[]>;
-        handleCancel: (e: Event) => void;
-        handleFullScreen: (e: Event) => void;
-    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("cancel" | "fullscreen")[], "cancel" | "fullscreen", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
-        canFullscreen: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        fullScreen: {
-            type: BooleanConstructor;
-        };
-    }>> & {
-        onCancel?: (...args: any[]) => any;
-        onFullscreen?: (...args: any[]) => any;
-    }, {
-        canFullscreen: boolean;
-        fullScreen: boolean;
-    }>;
-    ModalFooter: import("vue").DefineComponent<{
-        authPrefix: {
-            type: StringConstructor;
-        };
-        buttons: import("vue").PropType<import("../../form").ButtonProps[]>;
-        showSave: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        showCancel: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        okText: {
-            type: StringConstructor;
-        };
-        cancelText: {
-            type: StringConstructor;
-        };
-    }, {
-        t: {
-            (key: string): string;
-            (key: string, locale: string): string;
-            (key: string, locale: string, list: unknown[]): string;
-            (key: string, locale: string, named: Record<string, unknown>): string;
-            (key: string, list: unknown[]): string;
-            (key: string, named: Record<string, unknown>): string;
-        };
-        emits: (event: "handleSave" | "handleCancel", ...args: any[]) => void;
-        props: any;
-        buttonList: import("vue").ComputedRef<import("../../form").ButtonProps[]>;
-        handleMethod: (item: import("../../form").ButtonProps) => void;
-        readonly DtFormButtons: import("vue").DefineComponent<{}, {}, any, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>;
-    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("handleSave" | "handleCancel")[], "handleSave" | "handleCancel", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
-        authPrefix: {
-            type: StringConstructor;
-        };
-        buttons: import("vue").PropType<import("../../form").ButtonProps[]>;
-        showSave: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        showCancel: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        okText: {
-            type: StringConstructor;
-        };
-        cancelText: {
-            type: StringConstructor;
-        };
-    }>> & {
-        onHandleSave?: (...args: any[]) => any;
-        onHandleCancel?: (...args: any[]) => any;
-    }, {
-        showSave: boolean;
-        showCancel: boolean;
-    }>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("visible-change" | "cancel" | "save" | "register" | "toggle-fullscreen" | "update:visible")[], "visible-change" | "cancel" | "save" | "register" | "toggle-fullscreen" | "update:visible", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    getBindValue: globalThis.ComputedRef<any>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open-change" | "cancel" | "save" | "register" | "toggle-fullscreen" | "update:open")[], "open-change" | "cancel" | "save" | "register" | "toggle-fullscreen" | "update:open", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     t: {
         type: StringConstructor;
     };
-    visible: {
+    open: {
         type: BooleanConstructor;
+        default: boolean;
     };
     closable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    destroyOnClose: {
-        type: BooleanConstructor;
-    };
     scrollTop: {
         type: BooleanConstructor;
         default: boolean;
@@ -443,7 +115,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: NumberConstructor;
     };
     width: {
-        type: import("vue").PropType<String | Number>;
+        type: globalThis.PropType<String | Number>;
     };
     draggable: {
         type: BooleanConstructor;
@@ -457,7 +129,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         default: boolean;
     };
     title: {
-        type: import("vue").PropType<String | import("vue").ComputedRef<String> | ((data: import("@dt-frames/core").Recordable<any>) => String)>;
+        type: globalThis.PropType<String | globalThis.ComputedRef<String> | globalThis.Ref<String> | ((data: globalThis.Recordable) => String)>;
     };
     loading: {
         type: BooleanConstructor;
@@ -467,10 +139,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    useWrapper: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     wrapClassName: {
         type: StringConstructor;
     };
@@ -506,38 +174,43 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    maskStyle: import("vue").PropType<import("vue").CSSProperties>;
+    maskStyle: globalThis.PropType<import("vue").CSSProperties>;
     footer: {
-        type: import("vue").PropType<import("../../form").ButtonProps[]>;
+        type: globalThis.PropType<import("../../form").ButtonProps[]>;
     };
-    bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
+    bodyStyle: globalThis.PropType<import("vue").CSSProperties>;
     wrapperProps: ObjectConstructor;
-    getContainer: import("vue").PropType<() => any>;
-    closeFunc: import("vue").PropType<() => Promise<boolean>>;
+    getContainer: globalThis.PropType<() => any>;
+    closeFunc: globalThis.PropType<() => Promise<boolean>>;
     afterClose: FunctionConstructor;
 }>> & {
-    "onVisible-change"?: (...args: any[]) => any;
+    "onOpen-change"?: (...args: any[]) => any;
     onCancel?: (...args: any[]) => any;
     onSave?: (...args: any[]) => any;
     onRegister?: (...args: any[]) => any;
     "onToggle-fullscreen"?: (...args: any[]) => any;
-    "onUpdate:visible"?: (...args: any[]) => any;
+    "onUpdate:open"?: (...args: any[]) => any;
 }, {
-    visible: boolean;
+    open: boolean;
     closable: boolean;
-    destroyOnClose: boolean;
     scrollTop: boolean;
     draggable: boolean;
     defaultFullscreen: boolean;
     canFullscreen: boolean;
     loading: boolean;
     loadingTip: string;
-    useWrapper: boolean;
     centered: boolean;
     showOkBtn: boolean;
     showCancelBtn: boolean;
     mask: boolean;
     maskClosable: boolean;
     keyboard: boolean;
+}, {}>, Partial<Record<string, (_: any) => any>> & Partial<Record<string, (_: any) => any>> & {
+    default?(_: {}): any;
 }>;
-export default _sfc_main;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/components/modal/{index.less → src/index.scss}

@@ -1,82 +1,104 @@
-.fullscreen-modal{
-	overflow: hidden;
-
-	.ant-modal {
-        top: 0 !important;
-        right: 0 !important;
-        bottom: 0 !important;
-        left: 0 !important;
-        width: 100% !important;
-        height: 100%;
-		max-width: 100%;
-
-        &-content {
-            height: 100%;
-        }
-    }
-
-    .ant-modal-content{
-        display: flex;
-        flex-direction: column;
-
-        .ant-modal-body{
-            flex: 1;
-            height: 0;
-        }
-    }
-}
-
-
-.dt-modal{
-    overflow: hidden;
-	.ant-modal {
-		padding: 0;
-	}
-
-    .ant-modal-content{
-        width: 100%;
-    }
-
-    &:not(.fullscreen-modal) {
-        .ant-modal {
-            .ant-modal-body{
-                max-height: calc(100vh - 160px );
-                min-height: 200px;
-                overflow-y: auto;
-            }
-        }
-    }
-}
-
-.dt-basic-modal-close{
-	&--can-full {
-        margin-right: 15px;
-        > i {
-            padding-right: 15px;
-            width: 40px;
-        }
-    }
-
-	&:not(&--can-full) {
-		&>i:nth-child(1) {
-            &:hover {
-                color: @primary-color;
-            }
-        }
-	}
-
-	&>i:last-child {
-		&:hover {
-			color: @error-color;
-		}
-	}
-}
-
-.dt-form-btns {
-	.ant-form-item-control-input-content{
-		display: flex;
-	}
-    .ant-btn{
-        display: flex;
-    }
-}
+.fullscreen-modal {
+    .ant-modal {
+        top: 0 !important;
+        right: 0 !important;
+        bottom: 0 !important;
+        left: 0 !important;
+        width: 100% !important;
+        height: 100%;
+		max-width: 100%;
+
+        &-content {
+            height: 100%;
+        }
+    }
+
+    .ant-modal-header,
+    .ant-modal-content{
+        border-radius: 0;
+    }
+
+    .ant-modal-content{
+        @apply flex flex-col;
+
+        .ant-modal-body{
+            @apply flex-1 h-0;
+        }
+    }
+}
+
+.dt-modal{
+	.ant-modal {
+		@apply p-0;
+	}
+
+    .ant-modal-content{
+        @apply w-full p-0;
+    }
+
+    &:not(.fullscreen-modal) {
+        .ant-modal {
+            .ant-modal-body{
+                max-height: calc(100vh - 160px );
+                min-height: 200px;
+                overflow-y: auto;
+            }
+        }
+    }
+
+    .ant-modal-header {
+        padding: 16px 24px;
+        line-height: 22px;
+        margin: 0;
+        height: 54px;
+        border-bottom: 1px solid #f0f0f0;
+
+        .ant-modal-title {
+            font-weight: 500;
+        }
+    }
+    .ant-modal-close:hover {
+        background: none;
+    }
+
+    .ant-form-item-control-input {
+        min-height: 30px;
+    }
+
+    .ant-modal-footer {
+        padding: 10px 16px;
+        margin: 0;
+        border-top: 1px solid #f0f0f0;
+    }
+}
+
+.dt-basic-modal-close{
+	&--can-full {
+        margin-right: 15px;
+        > i {
+            padding-right: 15px;
+            width: 40px;
+        }
+    }
+
+	&:not(&--can-full) {
+		&>i:nth-child(1) {
+            &:hover {
+                color: $colorPrimary;
+            }
+        }
+	}
+
+	&>i:last-child {
+		&:hover {
+			color: $error-color;
+		}
+	}
+}
+
+.dt-form-btns {
+	.ant-form-item-control-input-content,
+    .ant-btn {
+		@apply flex;
+	}
+}