/*
 * @Author: 赵伟
 * @Date: 2024-04-18 18:35:41
 * @Description: 实验状态
 */

import { HyperParameterTrailStatus } from '@/enums';
import { ExperimentStatusInfo } from '@/pages/Experiment/status';
import themes from '@/styles/theme.less';
import styles from './index.less';

export const statusInfo: Record<HyperParameterTrailStatus, ExperimentStatusInfo> = {
  [HyperParameterTrailStatus.RUNNING]: {
    label: '运行中',
    color: themes.primaryColor,
    icon: '/assets/images/experiment-status/running-icon.png',
  },
  [HyperParameterTrailStatus.TERMINATED]: {
    label: '成功',
    color: themes.successColor,
    icon: '/assets/images/experiment-status/success-icon.png',
  },
  [HyperParameterTrailStatus.PENDING]: {
    label: '挂起',
    color: themes.pendingColor,
    icon: '/assets/images/experiment-status/pending-icon.png',
  },
  [HyperParameterTrailStatus.ERROR]: {
    label: '失败',
    color: themes.errorColor,
    icon: '/assets/images/experiment-status/fail-icon.png',
  },
  [HyperParameterTrailStatus.PAUSED]: {
    label: '暂停',
    color: themes.abortColor,
    icon: '/assets/images/experiment-status/omitted-icon.png',
  },
  [HyperParameterTrailStatus.RESTORING]: {
    label: '恢复中',
    color: themes.textColor,
    icon: '/assets/images/experiment-status/omitted-icon.png',
  },
};

function TrialStatusCell(status?: HyperParameterTrailStatus | null) {
  if (status === null || status === undefined) {
    return <span>--</span>;
  }
  return (
    <div className={styles['trial-status-cell']}>
      {/* <img
        style={{ width: '17px', marginRight: '7px' }}
        src={statusInfo[status]?.icon}
        draggable={false}
        alt=""
      /> */}
      <span
        style={{ color: statusInfo[status] ? statusInfo[status].color : themes.textColor }}
        className={styles['trial-status-cell__label']}
      >
        {statusInfo[status] ? statusInfo[status].label : status}
      </span>
    </div>
  );
}

export default TrialStatusCell;
