import { CSSProperties, Component } from "vue";
import { RuleItem } from "./rule";
import { FormInstance, UploadUserFile } from "element-plus";

export interface HeadersItem{
    Authorization?: string,
    token?: string,
    "Content-Type"?: string
}

export interface UserItem{
    id?: number,
    uid: number | string,
    nickname: string,
    username?: string,
    realname?: string,
    face?: string,
    mobile?: string,
    is_valid_mobile?: number | boolean,
    email?: string,
    is_valid_email?: number | boolean,
    idcard?: string,
    birth?: string,
    gender?: number | string,
    is_auth?: number | boolean,
    auth_type?: number | string,
    auth_name?: string,
    invite_code?: string,
    score?: number,
    balance?: number,
    role_name?: string,
    create_time?: number | string,
    ctime?: string,
    regip?: string,
    login_count?: number,
    last_login_time?: string,
    token?: string
}

export interface UploadItem{
    url?: string | [],
    options?: UploadOptions
}

export interface UploadOptions{
    type?: '' | 'img' | 'file' | 'video' | 'voice' | 'doc' | 'cert',
    url?: string | [],
    headers?: HeadersItem,
    method?: string,
    size?: 'small' | 'default' | 'large',
    multiple?: boolean,
    action?: string,
    data?: any,
    name?: string,
    withCredentials?:boolean,
    showFileList?:boolean,
    drag?: boolean,
    accept?: string,
    fileList?: any,
    listType?: 'text' | 'picture' | 'picture-card',
    autoUpload?: boolean,
    disabled?: boolean,
    limit?: number
}

export interface CascaderItem{
    label?: string
    value?: string | number,
    children?: CascaderItem[]
}

export interface SeleceItem{
    id?: number,
    title?: string,
    label?: string,
    value?: any,
    disabled?: boolean
}

export interface BreadcrumbItem{
    id?: number,
    title: string,
    router?: string,
}

export interface CarouselItem{
    id?: number,
    title?: string,
    src?: string,
    alt?: string,
    url?: string,
    content?: string
}

export interface CityItem{
    id?: number,
    title: string,
    level?: number,
    pid?: number,
    children?: CityItem[]
}

export interface CollapseItem{
    id?: number,
    title?: string,
    name?: string,
    content?: any
}

export interface DropdownItem{
    id?: number,
    title: string,
    router?: string,
    callback?: () => void,
    children?: DropdownItem[]
}

export interface EditorOptionsItem{
    type?: string,
    loadingText?: string,
    image?: EditorUploadItem,
    video?: EditorUploadItem,
}

export interface EditorUploadItem{
    service?: string,
    fieldName?: string,
    maxFileSize?: number,
    maxNumberOfFiles?: number,
    allowedFileTypes?: [],
    meta?: any,
    metaWithUrl?: boolean,
    headers?: any,
    withCredentials?: boolean,
    timeout?: number
}

export interface FormOptions{
    type: 'input' | 'form-group' | 'form-card' | 'form-multiple' | 'form-attr' | 'form-spec' | 'form-goods' | 'form-commission' | 'form-price' | 'checkbox' | 'checkbox-group' | 'checkbox-button' | 'radio' | 'radio-group' | 'radio-button' | 'select' | 'option' | 'upload' | 'icon' | 'cascader' | 'city' | 'color-picker' | 'date-picker' | 'datetime-picker' | 'time-picker' | 'time-select' | 'datetime' | 'input-number' | 'rate' | 'virtualized-select' | 'slider' | 'switch' | 'transfer' | 'upload' | 'editor' | 'varchar' | 'divider',
    label?: string,
    desc?: string,
    prop?: string,
    value?: any,
    placeholder?: string,
    hidden?: boolean,
    attrs?: FormAttrsItem,
    captcha?: CaptchaOptions,
    uploadAttrs?: UploadAttrsItem,
    editorOptions?: EditorOptionsItem,
    optionsData?: FormGoodsOptions[],
    specOptions?:FormOptions[],
    specValue?:any[],
    multiOptions?: any,
    slot?:FormSlotItem,
    rules?: RuleItem[],
    tip?: string,
    children?:FormOptions[],
    delimiter?: string,
    limit?: number,
    position?: 'left' | 'center' | 'right'
}

export interface CaptchaOptions{
    src: string,
    fit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down',
    width?: number,
    height?: number
}

export interface FormSlotItem{
    prefix?: FormSlotOption,
    suffix?: FormSlotOption,
    prepend?: FormSlotOption,
    append?: FormSlotOption,
}

export interface FormSlotOption{
    type?: 'string' | 'select' | 'dropdown',
    value?: any,
    size?: number,
    color?: string,
    time?: number,
    callback?: string
}

export interface FormAttrItem{
    id?: number,
    label?: string,
    prop?: string,
    value?: any
}

export interface FormAttrOptions{
    tipWidth?: number | string,
    desc?: string,
    attrData?: FormGoodsOptions[]
}

export interface FormGoodsItem{
    tipWidth?: number | string,
    desc?: string,
    optionsData?: FormGoodsOptions[],
    specOptions?: FormOptions[],
    specValue?: any[]
}

export interface FormSpecItem{
    id?: number,
    title?: string,
    prop?: string,
    value?: any
}

export interface FormSpecOptions{
    tipWidth?: number | string,
    desc?: string,
    specData?: FormGoodsOptions[]
}

export interface FormGoodsOptions{
    id?: number,
    title?: string,
    label?: string,
    selected?: number | boolean,
    field_name?: string,
    field_type?: string,
    field_length?: number,
    default_value?: string | string[]
    is_required?: boolean | number,
    level?: number,
    pid?: number,
    number?: number,
    sort?: number,
    value?: any,
    disabled?: boolean | string,
    children?: FormGoodsOptions[]
}

export interface FormAttrsItem{
    type?: string,
    placeholder?: string,
    format?: string,
    multiple?: boolean,
    size?: 'default' | 'small' | 'large',
    maxlength?: string | number,
    minlength?: string | number,
    clearable?: boolean,
    showPassword?: boolean,
    disabled?: boolean,
    prefixIcon?: string | Component,
    suffixIcon?: string | Component,
    rows?: number,
    autocomplete?: string,
    name?: string,
    readonly?: boolean,
    max?: any,
    min?: any,
    autofocus?: boolean,
    label?: string,
    style?: CSSProperties,
    gutter?: number,
    span?: number,
    options?: CascaderItem[]
}

export interface UploadAttrsItem{
    type?: 'default' | 'drag' | 'avatar' | 'pic' | 'card' | 'file',
    size?: 'default' | 'small' | 'large',
    action?: string,
    headers?: Headers | Record<string,any>,
    method?: string,
    multiple?: boolean,
    data?: Record<string,any>,
    name?: string,
    withCredentials?: boolean,
    showFileList?: boolean,
    drag?: boolean,
    accept?: string,
    fileList?: UploadUserFile[],
    listType?: 'text' | 'picture' | 'picture-card',
    autoUpload?: boolean,
    disabled?: boolean,
    limit?: number
}

export interface SpecOptionsItem{
    data?: any[],
    options?: TableOptions[]
}

export interface MenuItem{
    id?: number,
    title: string,
    router?: string,
    icon?: string,
    level?: number,
    pid?: number,
    number?: number,
    children?: MenuItem[]
}

export interface MenuOptions{
    id?: number,
    title?: string,
    aside_width?: number,
    aside_heigth?: number,
    is_nav?: number,
    is_nav_icon?: number,
    nav_font_size?: number,
    nav_text_color?: string,
    nav_hover_color?: string,
    nav_bg_color?: string,
    nav_hover_bg_color?: string,
    aside_bg_color?: string,
    aside_text_color?: string,
    menu_is_icon?: number[],
    menu_font_size?: number,
    menu_font_bold?: 0,
    menu_text_color?: string,
    menu_hover_text_color?: string,
    menu_bg_color?: string,
    menu_hover_bg_color?: string,
    sub_font_size?: number,
    sub_font_blod?: number,
    sub_text_color?: string,
    sub_hover_text_color?: string,
    sub_bg_color?: string,
    sub_hover_bg_color?: string,
    main_bg_color?: string
}

export interface SkinItem{
    id?: number,
    title?: string,
    mode?: 'hm' | 'hmf' | 'am' | 'ham' | 'hamf' | 'ahm' | 'ahmf',
    is_full_screen?: number | boolean,
    aside_width?: number,
    aside_bg_color?: string,
    header_bg_color?: string,
    header_height?: number,
    header_text_color?: string,
    main_padding?: number,
    main_bg_color?: string,
    menu_font_size?: number,
    menu_text_color?: string,
    menu_active_color?: string,
    menu_bg_color?: string,
    sub_font_size?: number,
    sub_text_color?: string,
    sub_active_color?: string,
    sub_bg_color?: string
}

export interface TableOptions{
    type?: 'char' | 'varchar' | 'int' | 'number' | 'checkbox' | 'radio' | 'rate' | 'slider' | 'button' | 'switch' | 'icon' | 'img' | 'image' | 'pic' | 'picture' | 'avatar' | 'group' | 'link' | 'router' | 'download' | 'action' | 'mod' | 'del',
    label: string,
    prop?: string,
    fixed?: string,
    width?: string | number,
    order?: boolean,
    prefix?: string,
    suffix?: string,
    align?: 'left' | 'center' | 'right' | 'start' | 'end',
    size?: number,
    length?: number,
    default?: any,
    value?: any,
    router?: string,
    editable?: boolean,
    slot?: string,
    action?: boolean,
    desc?: string,
    callback?: string,
    is_switch?: boolean
}

export interface MenuOptions{
    logoSize?: string,
    logoColor?: string,
    textSize?: string,
    backgroundColor?: string,
    textColor?: string,
    activeTextColor?: string,
    borderBottom?: boolean,
    borderBottomColor?: string,
    hoverBgColor?: string,
    hoverAfterColor?: string,
    hoverTextColor?: string
}

export interface AboutItem{
    title?: string,
    enTitle?: string,
    pic?: string,
    fit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down',
    width?: string,
    height?: string,
    content?: string
}

export interface GridItem{
    id?: number,
    title?: string,
    icon?: string,
    pic?: string,
    title_color?: string,
    desc_color?: string,
    bg_color?: string,
    font_size?: number,
    desc_size?: number,
    keyword?: string,
    desc?: string,
    router?: string,
    name?: string,
    gutter?: number,
    span?: number,

    width?: number | string,
    height?: number | string,
    margin?: number,
    padding?: number,
    border?: number,
    border_color?: string,
    hover_color?: string,
    hover_border_width?: number,
    hover_border_color?: string,

    img_fit?: 'contain' | 'cover' | 'fill' | 'none' | 'scale-down' | 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset',
    img_bg_color?: string,
    img_text_color?: string,
    img_font_size?: number,
    img_keyword_size?: number,
    img_keyword_color?: string,
    img_desc_size?: number,
    img_desc_color?: string,

    children?: GridData[]
}

export interface GridData{
    id?: number,
    title?: string,
    pic?: string,
    keyword?: string,
    desc?: string,
    router?: string,
}


export interface TableItem{
    title?: string,
    table?: string,
    primaryKey?: string,
    layer?: number,
    thead?: TableOptions[],
    rows?: number,
    data?: any[],
    query?: FormOptions[],
    action?: string,
    grant?: any,
    api?: string,
    importFile?: string,
    is_total?: number,
    is_size?: number,
    is_jumper?: number
}

export interface ScopeItem{
    form: FormInstance,
    model: any
}

export interface MainUserItem{
    uid: number,
    nickname: string,
    face: string,
    token: string,
    mobile?: string,
    email?: string,
    tips?: string,
    value?: UserValueItem[],
    office?: UserValueItem[],
    echart1?: MainEchartItem,
    echart2?: MainEchartItem,
    echart3?: MainEchartItem,
    echart4?: MainEchartItem
}

export interface UserValueItem{
    title?: string,
    desc?: string,
    icon?: string,
    pic?: string,
    value?: number,
    val?: number
}

export interface MainEchartItem{
    title?: string,
    type?: string,
    options?: any,
    data?: any
}

export interface GrantOptions{
    role_id?: string | number,
    role?: RoleItem[],
    menu?: GrantValue[],
    handle?: HandleItem[]
}

export interface RoleItem{
    id?: number,
    title?: string,
    value?: number,
    label?: string,
    level?: number,
    pid?: number,
    number?: number,
    sort?: number,
    children?: RoleItem[]
}

export interface GrantValue{
    menu_id: number,
    title?: string,
    level?: number,
    pid?: number,
    number?: number,
    handle_list?: number[],
    IsShow: number,
    IsRefresh?: number,
    IsAdd?: number,
    IsModify?: number,
    IsSave?: number,
    IsDel?: number,
    IsImport?: number,
    IsExport?: number,
    IsChecked?: number,
    IsApproved?: number,
    IsReject?: number,
    IsPrint?: number,
    IsTruncate?: number,
    IsBack?: number
}

export interface HandleItem{
    id?: number,
    title?: string,
    handle_name?: string
}

export interface LoginOptions{
    header_height?: number,
    footer_height?: number,
    bg_color?: string,
    bg_img?: string | string[],
    width?: number,
    login_width?: number,
    login_height?: number,
    bg_login_color?: string,
    bg_login_img?: string
}

export interface ResultItem{
    code: number,
    msg?: string,
    data?: any
}
export interface PropItem{
    prop: string,
    label?: string,
    width?: number
}

export interface ContainerOptions{
    mode?: 'hm' | 'hmf' | 'am' | 'ham' | 'hamf' | 'ahm' | 'ahmf' | '',
    asideWidth?: string,
    asideBorderColor?: string,
    asideTextColor?: string,
    headerHeight?: number,
    footerHeight?: string,
    asideBgColor?: string,
    headerBgColor?: string,
    mainBgColor?: string,
    footerBgColor?: string,
    headerPadding?: number,
    mainPadding?: number
}