import { RightOutlined } from '@ant-design/icons';
import { useNavigate } from '@umijs/max';
import { Spin } from 'antd';
import styles from './WorkAnalysis.less';

function WorkAnalysis(props) {
  const navigate = useNavigate();
  const { projectId, workAnalysisRequest: data, loading, eTime } = props;

  const project_categorys = data?.project_categorys || [];
  const toDetail = (item) => {
    sessionStorage.workAnalysis = JSON.stringify(item);
    navigate(
      `/smart-ops/work-analysis-detail/${projectId}?typeList=${item.technologys.join(
        ',',
      )}&eTime=${eTime}`,
    );
  };
  return (
    <Spin spinning={loading}>
      <div style={{ height: 'calc(100vh - 580px)', overflow: 'auto' }}>
        {project_categorys?.map((item) => (
          <div className={`${styles.box} card-box`} key={item.type}>
            <div className={styles.title}>{item.name}</div>
            <ul className={styles.list}>
              {item.childs?.map((cItem) => (
                <li key={cItem.type}>
                  <div className={styles.listTitle}>{cItem.name}</div>
                  <div className={styles.btn} onClick={() => toDetail(cItem)}>
                    {cItem.optimizationNumber == 0 ? (
                      <span style={{ color: '#12CEB3' }}>暂无优化</span>
                    ) : (
                      <span style={{ color: '#F5A623' }}>
                        可优化({cItem.optimizationNumber})
                      </span>
                    )}
                    <RightOutlined className={styles.icon} />
                    {/* <Icon className={styles.icon} type="right" /> */}
                  </div>
                </li>
              ))}
            </ul>
          </div>
        ))}
      </div>
    </Spin>
  );
}

export default WorkAnalysis;
