import { CHILD_MAP } from '../config';
import { Tooltip } from 'antd';
import ProjectInfo from './ProjectInfo';
import Map from './Map';
import Monitor from './Monitor';
import style from '../index.less';
import AlarmCenter from './AlarmCenter';
import MessageCenter from './MessageCenter';

function Model(props: DataMeter.IModelsProps) {
  const { layout, edit, removeModel } = props;
  let content: React.ReactElement;
  let path: number;
  switch (layout.key) {
    case 'ProjectInfo':
      content = <ProjectInfo {...props} />;
      path = 1;
      break;
    case 'Map':
      return <Map {...props} />;
    case 'Monitor':
      return <Monitor {...props} />;
    case 'AlarmCenter': //报警中心
      return <AlarmCenter {...props} />;
    // case 'FileManagement':
    //   content = (
    //     <FileManagement
    //       key={layout.i}
    //       projectId={projectId}
    //       {...props}
    //       child={layout.child}
    //     />
    //   );
    //   break;
    // case 'DataCenter':
    //   let originList = [];
    //   let configList = (chartConfigList || []).map((config) => {
    //     var data = layout.child.find((child) => child.key === config.id);
    //     return {
    //       ...config,
    //       title: config.name,
    //       key: config.id,
    //       type: 'chartConfig',
    //       show: data ? data.show : true,
    //     };
    //   });
    //   layout.child.forEach((layout) => {
    //     if (!layout.children && layout.type != 'chartConfig') {
    //       originList.push(layout);
    //     } else {
    //       // 有子级则只将子级加入tabs
    //       originList = originList.concat(layout.children);
    //     }
    //   });

    //   originList = originList.concat(configList);
    //   content = (
    //     <DataCenter
    //       projectId={projectId}
    //       key={layout.i + projectId}
    //       {...props}
    //       child={
    //         subModule == 0 ? originList : chartConfigList ? originList : []
    //       }
    //       layout={layout}
    //       setActive={setActive}
    //     />
    //   );
    //   break;
    case 'MessageCenter': //新闻动态
      return <MessageCenter {...props} />;
    // case 'Other':
    //   content = (
    //     <Other
    //       key={layout.i}
    //       {...props}
    //       projectId={projectId}
    //       child={layout.child}
    //       layout={layout}
    //       setActive={setActive}
    //       subModule={subModule}
    //     />
    //   );
    //   break;
    // case 'PlanManagement':
    //   content = (
    //     <PlanManagement
    //       key={layout.i}
    //       projectId={projectId}
    //       {...props}
    //       child={layout.child}
    //       layout={layout}
    //       setActive={setActive}
    //     />
    //   );
    //   break;
    default:
      content = <div>loading...</div>;
      break;
  }

  return (
    <div className={style.item} key={layout.i}>
      {content}
      <Control {...props} />
    </div>
  );
}

function Control(props: DataMeter.IModelsProps) {
  const { edit, layout, showEditModel, removeModel } = props;
  return (
    <div
      className={style.controlBox}
      onMouseDown={(e) => {
        e.stopPropagation();
      }}
    >
      {edit && CHILD_MAP[layout.key] && (
        <Tooltip title="编辑该模块">
          <div
            className={style.edit}
            onClick={() => {
              showEditModel(layout);
            }}
          ></div>
        </Tooltip>
      )}
      {edit && (
        <Tooltip title="删除该模块">
          <div
            className={style.close}
            onClick={() => {
              removeModel(layout.key, layout.active);
            }}
          ></div>
        </Tooltip>
      )}
    </div>
  );
}
export default Model;

// export default (props: DataMeter.IModelsProps) => <div>123123</div>;
