import { tableProps } from 'ant-design-vue/es/table';
import DynamicTable from './dynamic-table.vue';
import type { PropType, ExtractPropTypes } from 'vue';
import type { BookType } from 'xlsx';
import type {
  LoadDataParams,
  TableColumn,
  OnChangeCallbackParams,
  orderParamaItem,
  EditableType,
  OnSave,
  OnCancel,
} from './types/';
import type { SchemaFormProps } from '@/components/lt-a-form/src';
import { isBoolean } from '@/utils/is';
import type { ActionItem } from './types/tableAction';

type dataType = {
  Value: '';
  Lable: '';
};

type treeChild = {
  id: string;
  name: string;
};

interface treeType extends treeChild {
  children: treeChild[];
}

export type autoColsItem = TableColumn & {
  width?: number | string; //列宽
  Style: string; //显示类型 textbox checkbox combox tree datetime
  ifshowInQueryForm?: boolean; //是否显示在查询框中
  hideInSearch?: boolean; //是否隐藏
  isEdit?: boolean; //是否可编辑
  Visible: boolean;
  Option?: dataType[];
  maxlength?: number; // 数据最大长度不配置的话，则默认最大长度为500'
  valueFormat?: string; //日期格式 不配置的话，则默认'YYYY-MM-DD'
  treeOption?: treeType[]; //树形表格配置项
  Mode?: string; //下拉和树形是支持的模式 'multiple' | 'tags' | 'combobox'
  required?: boolean; //查询参数中，是否必须输入
  readonly?: boolean; //如果当前字段可编辑，但是为只读模式，则认为需要弹窗选择
  ifCondition?: boolean | string | object;
  editCondition?: []; //限制条件字段
  icon?: string; //显示图标
  requiredContent: boolean; //是否必须输入，默认false 为true的话，则会在表头生成红色*号
  btnOption?: ActionItem[]; //配置操作按钮
  dataIndex: string;
};

export interface cloumnFilterItem {
  prop?: string;
  type?: string;
  data?: dataType[];
  MatchCase?: string;
  options?: dataType[];
  defaultValue?: string | number | boolean;
  dataType?: string;
  mode?: string; //用于下拉选项设置是否多选
}
export const dynamicTableProps = {
  ...tableProps(),
  /** 是否显示搜索表单 */
  searchBox: {
    type: Boolean as PropType<boolean>,
    default: false,
  },
  /**根据列生成自定义查询条件*/
  queryFilterForm: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
  /** 表单属性配置 */
  formProps: {
    type: Object as PropType<SchemaFormProps>,
    default: () => ({}),
  },
  /** 表格列配置 */
  columns: {
    type: Array as PropType<TableColumn[]>,
    required: false,
    default: () => [],
  },
  //导出Excel列(实际有用的字段是 名称/字段  但是为了兼容性，直接使用Cols的字段去处理)
  exportColumns: {
    type: Array as PropType<TableColumn[]>,
    required: false,
    default: () => [],
  },
  /** 表格数据请求函数 */
  dataRequest: {
    // 获取列表数据函数API
    type: Function as PropType<
      (
        params?: LoadDataParams,
        onChangeParams?: OnChangeCallbackParams,
      ) => Promise<API.TableListResult>
    >,
  },
  /** 是否显示索引号 */
  showIndex: {
    type: Boolean as PropType<boolean>,
    default: false,
  },
  /** 索引列属性配置 */
  indexColumnProps: {
    type: Object as PropType<Partial<TableColumn>>,
    default: () => ({}),
  },
  /** 是否显示表格工具栏 */
  showToolBar: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
  /** 是否显示表格设置 */
  showTableSetting: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
  /** 表格标题 */
  headerTitle: String as PropType<string>,
  /** 表格标题提示信息 */
  titleTooltip: String as PropType<string>,
  // excel导出配置
  /** 导出的文件名 */
  exportFileName: {
    type: String as PropType<string>,
  },
  /** xlsx的booktype */
  exportBookType: {
    type: String as PropType<BookType>,
    default: 'xlsx',
  },
  /** 自动宽度 */
  exportAutoWidth: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
  /** 自定义数据导出格式函数 */
  exportFormatter: {
    type: Function as PropType<
      (columns: TableColumn<any>[], tableData: any[]) => { header: string[]; data: any[] }
    >,
    default: null,
  },
  /** 用于数据请求的URL */
  url: String,
  /*
          数据加载完成后，行选择模式
          0：啥也不做
          1: 选择第一行
          2：选择当前行，以行号为准，即上一次是选择第2行，数据加载完成后会选中第二行
          3: 选择最后一行
          */
  selectTypeAfterload: {
    type: Number,
    default: 0,
  },
  queryParams: Object, //查询参数
  dataFilter: Function, //数据过滤处理方法
  columnFilter: {
    type: Array as PropType<cloumnFilterItem[] | string[]>,
    default() {
      return [];
    },
  },
  /*
      远程请求数据查询参数生成模式，
      0为化工，
      1位仓库，
      2为标准接口提交数据
    */
  remoteQueryMode: {
    type: Number,
    default: 2,
  },
  autoClumns: {
    //动态生成的列，配置，则动态生成，不配置，则不动态生成
    type: Array as PropType<autoColsItem[]>,
  },
  isAutoEditable: Boolean, //是否生成可编辑表格
  ifCheckBox: {
    //是否显示CheckBox
    type: Boolean,
    default: true,
  },
  ifIndex: {
    //是否显示索引列
    type: Boolean,
    default: true,
  },
  editCondition: {
    //列是否可编辑条件
    type: String,
    default: '',
  },
  dataName: {
    //列是否可编辑条件
    type: String,
    default: 'datas',
  },
  spanMethod: Function,

  footStatus: {
    type: Boolean,
    default: false,
  },
  pageSpan: {
    type: Number,
    default: 17,
  },
  currentPage: {
    type: Number,
    default: 1,
  },
  showPage: {
    type: Boolean,
    default: false,
  },
  ifMonitor: {
    type: Boolean,
    default: false,
  },
  signalrUrl: {
    type: String,
    default: 'http://192.168.1.216:8081/notify',
  },
  signalrHub: {
    type: String,
    default: 'notify',
  },
  queryMethods: {
    type: String,
    default: 'Subcribe',
  },
  treeProps: {
    type: Object,
    default() {
      return {};
    },
  },
  isExpandTable: {
    type: Boolean,
    default: false,
  },
  externalQueryParama: {
    type: Object,
  },
  OrderParam: {
    //需要排序字段
    type: Array as PropType<orderParamaItem[]>,
    default() {
      return [];
    },
  },
  //令牌  在消息推送的时候，必须给
  accessToken: {
    type: String,
  },
  //是否允许手动改变列宽 默认可以
  ifResizeCloumn: {
    type: Boolean,
    default: true,
  },
  //是否表格高度跟随父组件固定
  ifFixed: {
    type: Boolean,
    default: true,
  },
  stripe: {
    //是否以斑马纹显示
    type: Boolean,
    default: true,
  },
  highlightCurrentRow: {
    //是否高亮当前行
    type: Boolean,
    default: true,
  },
  setCurrentNum: {
    //设置默认选择行
    type: Number,
    default: 0,
  },
  /** 编辑行类型，支持 只能同时编辑一行 | 同时编辑多行 */
  editableType: {
    type: String as PropType<EditableType>,
    default: 'single',
  },
  /** 单元格保存编辑回调 */
  onSave: {
    type: Function as PropType<OnSave>,
  },
  /** 单元格取消编辑回调 */
  onCancel: {
    type: Function as PropType<OnCancel>,
  },
  /** 只能编辑一行的的提示 */
  onlyOneLineEditorAlertMessage: String,
  /** 表格自适应高度 */
  autoHeight: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
  //显示在弹窗中编辑按钮
  showEditInDialog: {
    type: Boolean as PropType<boolean>,
    default: true,
  },
} as const;

export type DynamicTableProps = ExtractPropTypes<typeof dynamicTableProps>;

export const dynamicTableEmits = {
  change: (...rest: OnChangeCallbackParams) => rest.length === 4,
  'toggle-advanced': (isAdvanced: boolean) => isBoolean(isAdvanced),
  'get-query-data': (parama) => {
    return parama;
  }, //向外界提交当前表格获取到的数据信息
  loadSuccess: (data, index?) => {
    return {
      data,
      index,
    };
  },
  'order-change': (parama) => {
    return parama;
  }, //向外界提交当前表格获取到的数据信息
  'row-click': (record, index, event) => {
    return { record, index, event };
  },
  'row-dblclick': (record, index, event) => {
    return { record, index, event };
  },
  'row-contexmenu': (record, index, event) => {
    return { record, index, event };
  },
  'row-mouse-enter': (record, index, event) => {
    return { record, index, event };
  },
  'row-mouse-leave': (record, index, event) => {
    return { record, index, event };
  },
  'header-click': (record, index, event) => {
    return { record, index, event };
  },
  'cell-click': (record, index, event) => {
    return { record, index, event };
  },
  'cell-dblclick': (record, index, event) => {
    return { record, index, event };
  },
  'cell-contexmenu': (record, index, event) => {
    return { record, index, event };
  },
  'cell-mouse-enter': (record, index, event) => {
    return { record, index, event };
  },
  'cell-mouse-leave': (record, index, event) => {
    return { record, index, event };
  },
  'header-cell-click': (record, index, event) => {
    return { record, index, event };
  },
  'edit-in-dlg': function (record) {
    return { record };
  },
};

export type DynamicTableEmits = typeof dynamicTableEmits;

export type DynamicTableEmitFn = EmitFn<DynamicTableEmits>;
// @ts-ignore
export type DynamicTableInstance = InstanceType<typeof DynamicTable>;

// 默认支持的插槽
export const defaultSlots = [
  'emptyText',
  'expandIcon',
  'title',
  'footer',
  'summary',
  'expandedRowRender',
  'customFilterIcon',
  'customFilterDropdown',
] as const;
