import { Component } from 'vue';
import { Layout } from 'vue3-grid-layout';
import { FrontComponent, FrontComponentCategory, visualOptionField } from '../const/const';
import { RadioRecord } from '../detail/config/util';
import { DataComponentRecord, DataSource } from '/@/api/dataBoard/model';

export type FrontDataSourceRecord = DataSource;

export type DataBoardLayoutInfo = Layout & {
  record: DataComponentRecord;
  width?: number;
  height?: number;
};

export interface ComponentConfig {
  Component: Component;
  ComponentName?: string;
  ComponentKey: FrontComponent;
  ComponentConfig?: Recordable;
  ComponentCategory: FrontComponentCategory;
  isMultipleDataSource?: boolean;
  hasHistoryTrend?: boolean;
  hasSetting?: boolean;
  transformConfig: (
    componentConfig: Recordable,
    record: DataComponentRecord,
    dataSourceRecord: DataSource | DataSource[]
  ) => Recordable;
}

export interface VisualOptionParams {
  [visualOptionField.FONT_COLOR]: string;
  [visualOptionField.UNIT]: string;
  [visualOptionField.ICON_COLOR]: string;
  [visualOptionField.ICON]: string;
  [visualOptionField.FIRST_PHASE_COLOR]: string;
  [visualOptionField.SECOND_PHASE_COLOR]: string;
  [visualOptionField.THIRD_PHASE_COLOR]: string;
  [visualOptionField.FIRST_PHASE_VALUE]: string;
  [visualOptionField.SECOND_PHASE_VALUE]: string;
  [visualOptionField.THIRD_PHASE_VALUE]: string;
}

export interface VisualComponentProps<Layout = Recordable, Value = Recordable> {
  value?: Value;
  layout?: Layout;
  radio?: RadioRecord;
  random?: boolean;
  add?: (key: string, method: Fn) => void;
  update?: () => void;
  remove?: (key: string) => void;
}
