import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { Spin } from "antd";
import { useEffect, useState } from "react";
import threePersonIcon from "~/assets/images/public/bigScreen/ico6.png";
import dangerIcon from "~/assets/images/public/bigScreen/ico7.png";
import nightIcon from "~/assets/images/public/bigScreen/ico8.png";
import newWorkIcon from "~/assets/images/public/bigScreen/ico9.png";
import { NS_BI_STATISTICS } from "~/enumerate/namespace";
import Panel from "../../Panel";
import "./index.less";

/** 展示重点作业类型及危险作业接口返回的实时数量。 */
function WorkPanel(props) {
  const [list, setList] = useState([
    {
      name: "三人以上作业",
      doingCount: 0,
      appliedCount: 0,
      image: threePersonIcon,
    },
    { name: "危险作业", doingCount: 0, appliedCount: 0, image: dangerIcon },
    {
      name: "夜间作业",
      doingCount: 0,
      appliedCount: 0,
      image: nightIcon,
    },
    { name: "四新作业", doingCount: 0, appliedCount: 0, image: newWorkIcon },
  ]);
  useEffect(() => {
    const loadStatistics = async () => {
      const { data: eightWorkData = {} } = await props.getEightWorkInfoDangerWorkStatistics();
      const { data: keyProjectData = {} } = await props.getKeyProjectLargeScreenStatistics();
      setList((prevState) => {
        prevState[1].doingCount = eightWorkData.doingCount;
        prevState[1].appliedCount = eightWorkData.appliedCount;

        prevState[0].doingCount = keyProjectData.morePeopleStartCount;
        prevState[0].appliedCount = keyProjectData.morePeopleApplyCount;

        prevState[2].doingCount = keyProjectData.fourNewHomeworkStartCount;
        prevState[2].appliedCount = keyProjectData.fourNewHomeworkApplyCount;

        prevState[3].doingCount = keyProjectData.nightWorkStartCount;
        prevState[3].appliedCount = keyProjectData.nightWorkApplyCount;

        return [...prevState];
      });
    };

    loadStatistics();
  }, []);
  return (
    <Panel title="重点作业管理统计" className="index-info-right-panel__work">
      <Spin spinning={props.biStatistics.getEightWorkInfoDangerWorkStatisticsLoading || props.biStatistics.getKeyProjectLargeScreenStatisticsLoading}>
        <div className="index-info-work__list">
          {list.map(item => (
            <div className="index-info-work__item" key={item.name}>
              <img src={item.image} alt="" />
              <div>
                <strong>{item.name}</strong>
                <p>
                  当前作业数：
                  {item.doingCount}
                </p>
                <p>
                  申请数：
                  {item.appliedCount}
                </p>
              </div>
            </div>
          ))}
        </div>
      </Spin>
    </Panel>
  );
}

export default Connect([NS_BI_STATISTICS], true)(WorkPanel);
