import React from 'react';

type DbEnc = 'utf8';
type DbType = 'mysql' | 'hive';
type FreqUnit = 'day' | 'week' | 'month';

export interface IDatasource {
  /**
   * 数据库 IP 或 域名
   */
  host: string;

  /**
   * 数据库用户名
   */
  user: string;

  /**
   * 数据库端口号
   */
  port: number;

  /**
   * 数据库密码 (空)
   */
  password: string;

  /**
   * 编码
   */
  charset: DbEnc;

  /**
   * 当前登录用户
   */
  manager: string;

  /**
   * 数据库类型
   */
  source: DbType;

  /**
   * 数据库显示名称
   */
  databasename: string;

  /**
   * ID
   */
  sourcename: string;
}

interface ISyncMapping {
  /**
   * 源数据源
   */
  sourceDatasource: IDatasource;

  /**
   * 源数据表
   */
  sourceTableName: string;

  /**
   * 目标数据源
   */
  destDatasource: IDatasource;

  /**
   * 目标数据表
   */
  destTableName: string;

  /**
   * 同步开始时间
   */
  startTime: Date;

  /**
   * 同步频次
   */
  frequency: number;

  /**
   * 同步频次单位
   */
  freqUnit: FreqUnit;
}

interface IProps {
  /**
   * 数据源列表
   */
  datasourceList: IDatasource[];

  /**
   * 获取表的函数, 返回数据库里表的数组
   */
  tableListFetcher: (ds: IDatasource) => Promise<string[]>;

  /**
   * 初始映射数据
   */
  initMappings?: ISyncMapping[];

  /**
   * 确认提交事件
   */
  onConfirm: (data: ISyncMapping[]) => void;

  /**
   * 取消提交事件
   */
  onCancel: (data: ISyncMapping[]) => void;
}

const DatasyncForm: React.FunctionComponent<IProps> = props => {
  return <div />;
};

export default DatasyncForm;
