import PageContent from '@/components/PageContent';
import PageTitle from '@/components/PageTitle';
import { GetTokenFromUrl, UnityAction } from '@/utils/utils';
import { connect, history, useParams } from '@umijs/max';
import dayjs from 'dayjs';
import { useEffect } from 'react';
import styles from './index.less';

function List(props) {
  const { loading, list, processList = [], dispatch } = props;

  const { projectId } = useParams();

  const goToDetail = (record) => {
    UnityAction.sendMsg('reportDetail', '');
    history.push(
      `/self-inspection/detail/${projectId}/${
        record.Id
      }?JWT-TOKEN=${GetTokenFromUrl()}`,
    );
  };

  useEffect(() => {
    let params = {};
    params.projectId = projectId;
    params.auto = 1;
    params.startDate = dayjs()
      .subtract(10, 'day')
      .format('YYYY-MM-DD 00:00:00');
    params.endDate = dayjs().format('YYYY-MM-DD 23:59:59');
    params.pageSize = 100;
    params.currentPage = 1;
    dispatch({
      type: 'patrolArtificialRecord/queryPatrol',
      payload: params,
    });
  }, []);
  return (
    <PageContent closeable={false}>
      <PageTitle returnable>自检记录</PageTitle>
      <div className={`content-title ${styles.list}`}>
        {list.map((item) => (
          <div className={styles.item} onClick={() => goToDetail(item)}>
            {item.Status == 0 ? (
              <div className={`${styles.status}`}>正常</div>
            ) : (
              <div className={`${styles.status} ${styles.statusError}`}>
                异常
              </div>
            )}
            <div className={styles.info}>
              <div className={styles.time}>
                <i></i>自检时间：{dayjs(item.CreatedTime).format('MM-DD HH:mm')}
              </div>
              <div className={styles.desc}>
                <i></i>
                发现异常
                <span className={styles.number}>{item.Status}</span>
                <span>项</span>
              </div>
            </div>
            <div className={styles.btn}></div>
          </div>
        ))}
      </div>
    </PageContent>
  );
}

export default connect(({ patrolArtificialRecord, loading }) => ({
  list: patrolArtificialRecord.list,
  routeInfoList: patrolArtificialRecord.routeInfoList,
  loading: loading.models.patrolArtificialRecord,
  processList: patrolArtificialRecord.processList,
}))(List);