import type { Ref } from 'vue';

import type { ClassType, DeepPartial } from '@vben/types';

export interface CardListColumn<T = any> {
  /** 字段名 */
  field: string;
  /** 显示标题 */
  title: string;
  /** 格式化函数 */
  formatter?: (value: any, row: T) => string;
  /** 插槽配置 */
  slots?: {
    default?: string;
  };
  /** 显示条件 */
  show?: ((row: T) => boolean) | boolean;
  /** 编辑渲染组件 */
  editRender?: { name: string; props?: Record<string, any> };
  /** 字段占列数 */
  colSpan?: number;
}

export interface CardListPagination {
  /** 是否启用分页 */
  enabled?: boolean;
  /** 当前页码 */
  current?: number;
  /** 每页条数 */
  pageSize?: number;
  /** 总条数 */
  total?: number;
  /** 显示分页大小选择器 */
  showSizeChanger?: boolean;
  /** 显示快速跳转 */
  showQuickJumper?: boolean;
  /** 显示总条数 */
  showTotal?: ((total: number, range: [number, number]) => string) | boolean;
}

export interface CardListOptions<T = any> {
  /** 列配置 */
  columns?: CardListColumn<T>[];
  /** 卡片配置 */
  cardConfig?: {
    /** 卡片主键字段名 */
    keyField?: string;
  };
  /** 数据源 */
  data?: T[];
  /** 是否显示卡片标题 */
  showTitle?: boolean;
  /** 标题字段名，如果不指定则使用第一个字段 */
  titleField?: string;
  /** 卡片类名 */
  cardClass?: string;
  /** 网格列数 */
  gridColumns?: number;
  /** 字段列数，控制卡片内字段排列的列数 */
  fieldColumns?: number;
  /** 网格高度 */
  gridHeight?: string;
  /** 分页配置 */
  pagerConfig?: CardListPagination;
  /** 卡片高度 */
  cardHeight?: string;
  /** 卡片宽度 */
  cardWidth?: string;
  /** 卡片间距 */
  cardGap?: string;
  /** 加载状态 */
  loading?: boolean;
  /** 空状态文本 */
  emptyText?: string;
  /** 错误数据 */
  errorData?: T[];
}

export interface CardListProps<T = any> {
  /** 标题 */
  title?: string;
  /** 标题帮助 */
  titleHelp?: string;
  /** 组件class */
  class?: ClassType;
  /** 网格class */
  gridClass?: ClassType;
  /** 网格配置 */
  gridOptions?: DeepPartial<CardListOptions<T>>;
  /** 网格事件 */
  gridEvents?: {
    /** 卡片点击 */
    cardClick?: (row: T) => void;
    /** 页码变化 */
    pageChange?: (page: number, pageSize: number) => void;
    /** 每页条数变化 */
    pageSizeChange?: (pageSize: number) => void;
  };
}

export type CardListApi<T = any> = {
  /** 清空数据 */
  clear: () => void;
  /** 获取数据 */
  getData: () => T[];
  /** 获取状态 */
  getState: () => CardListProps<T> | null;
  /** 添加项目 */
  insertAt: (items: T[], index?: number) => void;
  /** 挂载组件 */
  mount: () => void;
  /** 刷新数据 */
  refresh: () => void;
  /** 删除项目 */
  remove: (predicate: ((row: T, index: number) => boolean) | number) => void;
  /** 重置 */
  reset: () => void;
  /** 设置数据 */
  setData: (data: T[]) => void;
  /** 设置错误数据 */
  setErrorItems: (errorItems: { id: number | string }[]) => void;
  /** 设置加载状态 */
  setLoading: (loading: boolean) => void;
  /** 设置分页 */
  setPagination: (pagination: CardListPagination) => void;
  /** 设置状态 */
  setState: (state: Partial<CardListProps<T>>) => void;
  /** 卸载组件 */
  unmount: () => void;
  /** 更新项目 */
  updateItem: (
    predicate: ((row: T, index: number) => boolean) | number,
    newItem: Partial<T>,
  ) => void;
};

export type ExtendedCardListApi<T = any> = CardListApi<T> & {
  useStore: <R = CardListProps<T>>(selector?: (state: CardListProps<T>) => R) => Readonly<Ref<R>>;
};

export type UseVbenCardList = <T extends Record<string, any> = any>(
  options: CardListProps<T>,
) => readonly [any, ExtendedCardListApi<T>];
