import { CalendarOutlined } from "@ant-design/icons";
import { Card, Col, Divider, Row, Statistic } from "antd";
import { groupBy } from "lodash";
import dayjs from "../../utils/day";
import { useMemo } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import ScoreboardJobsList from "../scoreboard-jobs-list/scoreboard-jobs-list.component";
import * as Util from "./scoreboard-targets-table.util";

const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop
});
const mapDispatchToProps = () => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});

const rowGutter = [16, 16];
const statSpans = { xs: 24, sm: 3 };

export function ScoreboardTargetsTable({ bodyshop, scoreBoardlist }) {
  const { t } = useTranslation();

  const values = useMemo(() => {
    const dateHash = groupBy(scoreBoardlist, "date");

    let ret = {
      todayBody: 0,
      todayPaint: 0,
      todayJobs: 0,
      weeklyPaint: 0,
      weeklyJobs: 0,
      weeklyBody: 0,
      toDateBody: 0,
      toDatePaint: 0,
      toDateJobs: 0
    };

    const today = dayjs();
    if (dateHash[today.format("YYYY-MM-DD")]) {
      dateHash[today.format("YYYY-MM-DD")].forEach((d) => {
        ret.todayBody = ret.todayBody + d.bodyhrs;
        ret.todayPaint = ret.todayPaint + d.painthrs;
        ret.todayJobs++;
      });
    }

    let StartOfWeek = dayjs().startOf("week");
    while (StartOfWeek.isSameOrBefore(today)) {
      if (dateHash[StartOfWeek.format("YYYY-MM-DD")]) {
        dateHash[StartOfWeek.format("YYYY-MM-DD")].forEach((d) => {
          ret.weeklyBody = ret.weeklyBody + d.bodyhrs;
          ret.weeklyPaint = ret.weeklyPaint + d.painthrs;
          ret.weeklyJobs++;
        });
      }
      StartOfWeek = StartOfWeek.add(1, "day");
    }

    let startOfMonth = dayjs().startOf("month");
    while (startOfMonth.isSameOrBefore(today)) {
      if (dateHash[startOfMonth.format("YYYY-MM-DD")]) {
        dateHash[startOfMonth.format("YYYY-MM-DD")].forEach((d) => {
          ret.toDateBody = ret.toDateBody + d.bodyhrs;
          ret.toDatePaint = ret.toDatePaint + d.painthrs;
          ret.toDateJobs++;
        });
      }
      startOfMonth = startOfMonth.add(1, "day");
    }

    return ret;
  }, [scoreBoardlist]);

  return (
    <Card title={t("scoreboard.labels.targets")} extra={<ScoreboardJobsList scoreBoardlist={scoreBoardlist} />}>
      <Row gutter={rowGutter}>
        <Col xs={24} sm={{ offset: 0, span: 4 }} lg={{ span: 4 }}>
          <Statistic
            title={t("scoreboard.labels.workingdays")}
            value={Util.CalculateWorkingDaysThisMonth()}
            prefix={<CalendarOutlined />}
          />
        </Col>
        <Col xs={24} sm={{ offset: 0, span: 20 }} lg={{ offset: 0, span: 20 }}>
          <Row>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.dailytarget")}
                value={bodyshop.scoreboard_target.dailyBodyTarget}
                prefix={t("scoreboard.labels.bodyabbrev")}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic title={t("scoreboard.labels.dailyactual")} value={values.todayBody.toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.weeklytarget")}
                value={Util.WeeklyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic title={t("scoreboard.labels.weeklyactual")} value={values.weeklyBody.toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.monthlytarget")}
                value={Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.asoftodaytarget")}
                value={Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic title={t("scoreboard.labels.todateactual")} value={values.toDateBody.toFixed(1)} />
            </Col>
          </Row>
          <Row>
            <Col {...statSpans}>
              <Statistic
                value={bodyshop.scoreboard_target.dailyPaintTarget}
                prefix={t("scoreboard.labels.refinishabbrev")}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic value={values.todayPaint.toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.WeeklyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={values.weeklyPaint.toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={values.toDatePaint.toFixed(1)} />
            </Col>
          </Row>
          <Row>
            <Divider style={{ margin: 5 }} />
          </Row>
          <Row>
            <Col {...statSpans}>
              <Statistic value={"\u00A0"} prefix={t("scoreboard.labels.total")} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={(values.todayPaint + values.todayBody).toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.WeeklyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
                  Util.WeeklyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic value={(values.weeklyPaint + values.weeklyBody).toFixed(1)} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
                  Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
                  Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic value={(values.toDatePaint + values.toDateBody).toFixed(1)} />
            </Col>
          </Row>
          <Row>
            <Divider style={{ margin: 5 }} />
          </Row>
          <Row>
            <Col {...statSpans}>
              <Statistic value={"\u00A0"} prefix={t("scoreboard.labels.jobs")} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={values.todayJobs} />
            </Col>
            <Col {...statSpans} />
            <Col {...statSpans}>
              <Statistic value={values.weeklyJobs} />
            </Col>
            <Col {...statSpans} />
            <Col {...statSpans} />
            <Col {...statSpans}>
              <Statistic value={values.toDateJobs} />
            </Col>
          </Row>
        </Col>
      </Row>
    </Card>
  );
}

export default connect(mapStateToProps, mapDispatchToProps)(ScoreboardTargetsTable);
