@dazhicheng/ui 1.5.6 → 1.5.8

package/dist/components/tt-modal/src/props.d.ts

@@ -0,0 +1,161 @@
+import { ButtonProps } from 'element-plus';
+import { PropType } from 'vue';
+import { TipConfig } from '../../../directives/disabled-tip';
+export declare const modalProps: {
+    /** 测试标识 */
+    testId: any;
+    /** 是否显示 */
+    visible: {
+        type: BooleanConstructor;
+    };
+    /** 标题 */
+    title: any;
+    /** 取消按钮文本 */
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 确定按钮文本 */
+    okText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 最小高度 */
+    minHeight: any;
+    /** 高度 */
+    height: any;
+    /** 是否滚动到顶 */
+    scrollTop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 取消前的函数 */
+    closeFunc: PropType<() => Promise<boolean>>;
+    /** 是否允许拖拽 */
+    draggable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否允许放大 */
+    fullscreen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否允许自定义大小 */
+    resizer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+export declare const basicProps: {
+    /** 测试标识 */
+    testId: any;
+    /** 是否显示 */
+    visible: {
+        type: BooleanConstructor;
+    };
+    /** 标题 */
+    title: any;
+    /** 取消按钮文本 */
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 确定按钮文本 */
+    okText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 最小高度 */
+    minHeight: any;
+    /** 高度 */
+    height: any;
+    /** 是否滚动到顶 */
+    scrollTop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 取消前的函数 */
+    closeFunc: PropType<() => Promise<boolean>>;
+    /** 是否允许拖拽 */
+    draggable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否允许放大 */
+    fullscreen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否允许自定义大小 */
+    resizer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+} & {
+    /** 弹窗的loading */
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 弹窗的loading提示 */
+    loadingTip: {
+        type: StringConstructor;
+    };
+    /** 是否显示footer */
+    showFooter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否显示取消按钮 */
+    showCancelBtn: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否显示确定按钮 */
+    showOkBtn: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否显示确定按钮loading */
+    confirmLoading: {
+        type: BooleanConstructor;
+    };
+    /** 是否显示取消按钮loading */
+    cancelLoading: {
+        type: BooleanConstructor;
+    };
+    /** 宽度 */
+    width: PropType<string | number>;
+    /** 弹窗距离顶部的距离需要带px单位 */
+    top: {
+        type: StringConstructor;
+    };
+    /** 弹大小 */
+    size: {
+        type: PropType<"medium" | "small" | "mini">;
+        default: string;
+    };
+    /** 确定按钮的样式 */
+    okButtonProps: {
+        type: PropType<Partial<ButtonProps> & {
+            disabledTip?: TipConfig | TipConfig[];
+        }>;
+        default: Partial<ButtonProps>;
+    };
+    /** 取消按钮的样式 */
+    cancelButtonProps: {
+        type: PropType<Partial<ButtonProps>>;
+        default: Partial<ButtonProps>;
+    };
+    /** 是否贴住底部 */
+    isBottom: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 是否显示modal */
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};

package/dist/components/tt-modal/src/typing.d.ts

@@ -0,0 +1,188 @@
+import { TipConfig } from '../../../directives/disabled-tip';
+import { ButtonProps, DialogProps } from 'element-plus';
+import { Component, ComputedRef, Ref } from 'vue';
+import { default as TtModal } from './RenderModal.vue';
+import { default as TtModalWrapper } from './components/ModalWrapper.vue';
+import { ModalApi } from './utils/modal-api';
+/**
+ * @description: 弹窗对外暴露的方法
+ */
+export type ModalMethods = {
+    setModalProps: (props: Partial<ModalProps>) => void;
+    emitVisible?: (visible: boolean, uid: number) => void;
+    redoModalHeight?: () => void;
+    scrollToBottom: () => void;
+};
+type RegisterFn = (modalMethods: ModalMethods, uuid: string) => void;
+export type TtModalRegister = [methods: ModalMethods, uuid: string];
+export type ModalReturnMethods = {
+    /** 打开弹窗 */
+    openModal: <T = any>(props?: boolean, data?: T, openOnSet?: boolean) => void;
+    /** 关闭弹窗事件 */
+    closeModal: () => void;
+    getVisible?: ComputedRef<boolean>;
+} & ModalMethods;
+export type UseModalReturnType = [RegisterFn, ModalReturnMethods];
+export type ModalReturnInnerMethods = {
+    /** 关闭弹窗事件 */
+    closeModal: () => void;
+    /** 改变弹窗loading事件 */
+    changeLoading: (loading: boolean) => void;
+    /** 改变确定按钮事件 */
+    changeOkLoading: (loading: boolean) => void;
+    /** 获取visible */
+    getVisible?: ComputedRef<boolean>;
+    redoModalHeight: () => void;
+} & ModalMethods;
+export type UseModalInnerReturnType = [RegisterFn, ModalReturnInnerMethods];
+export type ModalProps = InstanceType<typeof TtModal>["$props"] & Partial<DialogProps>;
+export type ModalWrapperProps = InstanceType<typeof TtModalWrapper>["$props"];
+export type ModalRenderState = {
+    /**
+     * 是否显示
+     * @default false
+     */
+    visible?: boolean;
+    /** 测试标识 */
+    testId?: string;
+    /** 标题 */
+    title?: string;
+    /**
+     * 取消按钮文本
+     * @default '取消'
+     */
+    cancelText?: string;
+    /**
+     * 确定按钮文本
+     * @default '确定'
+     */
+    okText?: string;
+    /**
+     * 最小高度
+     * @default 192
+     */
+    minHeight?: number;
+    /**
+     * 高度
+     */
+    height?: number;
+    /**
+     * 是否滚动到顶
+     * @default true
+     */
+    scrollTop?: boolean;
+    /**
+     * 取消前的函数
+     */
+    closeFunc?: () => Promise<boolean>;
+    /**
+     * 是否允许拖拽
+     * @default true
+     */
+    draggable?: boolean;
+    /**
+     * 是否允许放大
+     * @default false
+     */
+    fullscreen?: boolean;
+    /**
+     * 是否允许自定义大小
+     * @default false
+     */
+    resizer?: boolean;
+    /**
+     * Function 自定义大小改变时触发
+     */
+    resizeChange?: () => void;
+    /**
+     * 弹窗的loading
+     * @default false
+     */
+    loading?: boolean;
+    /** 弹窗的loading提示 */
+    loadingTip?: string;
+    /**
+     * 是否显示footer
+     * @default true
+     */
+    showFooter?: boolean;
+    /**
+     * 是否显示取消按钮
+     * @default true
+     */
+    showCancelBtn?: boolean;
+    /**
+     * 是否显示确定按钮
+     * @default true
+     */
+    showOkBtn?: boolean;
+    /**
+     * 是否显示确定按钮loading
+     * @default false
+     */
+    confirmLoading?: boolean;
+    /**
+     * 是否显示取消按钮loading
+     * @default false
+     */
+    cancelLoading?: boolean;
+    /** 宽度 */
+    width?: string | number;
+    /** 弹窗距离顶部的距离需要带px单位 */
+    top?: string;
+    /**
+     * 弹窗大小
+     * @default 'small'
+     */
+    size?: "medium" | "small" | "mini";
+    /**
+     * 确定按钮的样式
+     * @default { type: 'primary' }
+     */
+    okButtonProps?: Partial<ButtonProps> & {
+        disabledTip?: TipConfig[];
+    };
+    /**
+     * 取消按钮的样式
+     * @default {}
+     */
+    cancelButtonProps?: Partial<ButtonProps>;
+    /**
+     * 是否贴住底部
+     * @default false
+     */
+    isBottom?: boolean;
+} & Partial<DialogProps>;
+export type ModalApiOptions = ModalRenderState & Partial<DialogProps> & {
+    /**
+     * 独立的弹窗组件
+     */
+    connectedComponent?: Component;
+    /**
+     * 点击取消按钮的回调
+     */
+    onClose?: () => void;
+    /**
+     * 弹窗关闭动画结束的回调
+     * @returns
+     */
+    onClosed?: () => void;
+    /**
+     * 弹窗状态变化回调
+     * @param isOpen
+     * @returns
+     */
+    onVisibleChange?: (isOpen: boolean) => void;
+    /**
+     * 点击确定按钮的回调
+     */
+    onOk?: () => void;
+    /**
+     * 监听的方法
+     */
+    onReceiveSharedData?: (data: Record<string, any>) => void;
+};
+export type TtModalExtendedModalApi = ModalApi & {
+    useStore: <T = NoInfer<ModalRenderState>>(selector?: (state: NoInfer<ModalRenderState>) => T) => Readonly<Ref<T>>;
+};
+export {};

package/dist/components/tt-modal/src/utils/modal-api.d.ts

@@ -0,0 +1,97 @@
+import { ModalApiOptions, ModalMethods, ModalRenderState } from '../typing';
+import { Store } from '@tanstack/vue-store';
+export type ApiType = Pick<ModalApiOptions, "onClose" | "onVisibleChange" | "onOk" | "onReceiveSharedData" | "onClosed">;
+/**
+ * 弹窗的API类
+ * @description 用于管理弹窗的共享数据、状态和API接口
+ */
+export declare class ModalApi {
+    /** 共享数据对象，用于在组件间传递数据 */
+    sharedData: Record<"payload", any>;
+    /** 状态存储对象，使用Store管理弹窗的各种状态 */
+    store: Store<ModalRenderState>;
+    /** 弹窗的API接口，用于处理外部事件 */
+    private api;
+    /** 弹窗的当前状态，使用Partial<ModalRenderState>类型 */
+    state: ModalRenderState;
+    /** 弹窗的实例方法，用于处理弹窗的各种操作 */
+    private methods?;
+    /** 构造函数，初始化弹窗的API接口和状态 */
+    constructor(options?: ModalApiOptions);
+    /**
+     * 挂载弹窗实例和API接口
+     * @param api - 外部传入的API接口
+     * @param methods - 外部传入的实例方法
+     */
+    mount(api: ApiType, methods: ModalMethods): void;
+    /**
+     * 关闭弹窗
+     */
+    close(): Promise<void>;
+    /**
+     * 取消操作
+     */
+    onClosed(): void;
+    /**
+     * 确认操作
+     */
+    onOk: () => void;
+    /**
+     * 获取共享数据
+     * @returns 共享数据对象
+     */
+    getData<T extends object = Record<string, any>>(): T;
+    /**
+     * 设置弹窗的状态
+     * @param stateOrFn - 状态对象或状态函数
+     * @returns 当前实例
+     */
+    setState(stateOrFn: ((prev: Partial<ModalRenderState>) => Partial<ModalRenderState>) | Partial<ModalRenderState>): this;
+    /**
+     * 打开弹窗
+     * @param visible - 是否可见
+     * @param data - 共享数据
+     */
+    openModal<T>(visible?: boolean, data?: T): void;
+    /**
+     * 设置弹窗的属性
+     * @param props - 属性对象
+     * @returns 当前实例
+     */
+    setModalProps(props: Partial<ModalRenderState>): Promise<void>;
+    /**
+     * 设置弹窗的加载状态
+     * @param loading - 是否加载中
+     * @returns 当前实例
+     */
+    changeLoading(loading?: boolean): this;
+    /**
+     * 设置确认按钮的加载状态
+     * @param loading - 是否加载中
+     * @returns 当前实例
+     */
+    changeOkLoading(loading?: boolean): this;
+    /**
+     * 设置共享数据
+     * @param payload - 共享数据
+     * @returns 当前实例
+     */
+    setData(payload: any): this;
+    /**
+     * 关闭弹窗
+     */
+    closeModal(): void;
+    /**
+     * 获取弹窗的可见状态
+     * @returns 弹窗的可见状态
+     */
+    getVisible: import('vue').ComputedRef<boolean | undefined>;
+    /**
+     * 重置弹窗高度
+     */
+    redoModalHeight(): void;
+    /**
+     * 滚动到底部
+     */
+    scrollToBottom(): void;
+}