epic-designer/dist/types/src/epic-designer.d.ts

基于vue3的设计器,可视化开发页面表单

import { ActionsModel } from '../../manager/src/index';
import { TableMeta } from './designer';
import { FormItemRule } from './rules';
export interface RenderCallbackParams {
    tableMeta?: TableMeta;
    values: Record<string, any>;
}
export interface ComponentSchema {
    [fieldName: string]: any;
    children?: ComponentSchema[];
    description?: string;
    editData?: object;
    field?: string;
    id?: string;
    input?: boolean;
    label?: string;
    noFormItem?: boolean;
    on?: {
        [eventName: string]: ActionsModel[];
    };
    props?: any;
    rules?: FormItemRule[];
    show?: ((renderCallbackParams: RenderCallbackParams) => boolean) | boolean;
    slotName?: string;
    slots?: {
        [slotName: string]: ComponentSchema[];
    };
    type: string;
}
export interface FormConfig {
    customStyle?: string;
    hideRequiredMark?: boolean;
    labelCol: any;
    labelLayout: any;
    labelWidth?: string;
    layout?: string;
    wrapperCol: any;
}
export type FormDataModel = Record<string, any>;
export interface DesignerState {
    disabledHover: boolean;
    hoverNode: ComponentSchema | null;
    matched: ComponentSchema[];
    selectedNode: ComponentSchema | null;
}
export interface PageSchema {
    canvas?: {
        height?: string;
        mode?: 'desktop' | 'mobile' | 'pad' | 'pc' | 'tablet';
        width?: string;
    };
    schemas: ComponentSchema[];
    script?: string;
}
export interface Designer {
    handleDelete: () => void;
    handleDuplicate: () => void;
    handleImported: (data: PageSchema) => void;
    handleToggleDeviceMode: (mode: string) => void;
    preview: () => void;
    reset: () => void;
    save: () => void;
    setDisabledHover: (disabledHover?: boolean) => void;
    setHoverNode: (schema: ComponentSchema | null) => void;
    setSelectedNode: (schema: ComponentSchema | null) => void;
    state: DesignerState;
}