import { CalendarOutlined } from "@ant-design/icons";
import { Card, Col, Divider, Row, Statistic } from "antd";
import dayjs from "../../utils/day";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import * as Util from "../scoreboard-targets-table/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 ScoreboardTimeTicketsTargetsTable({ bodyshop }) {
  const { t } = useTranslation();

  return (
    <Card title={t("scoreboard.labels.targets")}>
      <Row gutter={rowGutter}>
        <Col xs={24} sm={{ offset: 0, span: 3 }} lg={{ span: 3 }}>
          <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="Type" value={t("scoreboard.labels.body")} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.dailytarget")}
                value={bodyshop.scoreboard_target.dailyBodyTarget}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.thisweek")}
                value={Util.WeeklyTargetHrs(
                  bodyshop.scoreboard_target.dailyBodyTarget,
                  dayjs().startOf("week"),
                  dayjs().endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.lastweek")}
                value={Util.WeeklyTargetHrs(
                  bodyshop.scoreboard_target.dailyBodyTarget,
                  dayjs().subtract(1, "week").startOf("week"),
                  dayjs().subtract(1, "week").endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.priorweek")}
                value={Util.WeeklyTargetHrs(
                  bodyshop.scoreboard_target.dailyBodyTarget,
                  dayjs().subtract(2, "week").startOf("week"),
                  dayjs().subtract(2, "week").endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.thismonth")}
                value={Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.lastmonth")}
                value={Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                title={t("scoreboard.labels.asoftodaytarget")}
                value={Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)}
              />
            </Col>
          </Row>
          <Row>
            <Col {...statSpans}>
              <Statistic value={t("scoreboard.labels.refinish")} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={bodyshop.scoreboard_target.dailyPaintTarget} />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={Util.WeeklyTargetHrsInPeriod(
                  bodyshop.scoreboard_target.dailyPaintTarget,
                  dayjs().startOf("week"),
                  dayjs().endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={Util.WeeklyTargetHrs(
                  bodyshop.scoreboard_target.dailyPaintTarget,
                  dayjs().subtract(1, "week").startOf("week"),
                  dayjs().subtract(1, "week").endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={Util.WeeklyTargetHrs(
                  bodyshop.scoreboard_target.dailyPaintTarget,
                  dayjs().subtract(2, "week").startOf("week"),
                  dayjs().subtract(2, "week").endOf("week"),
                  bodyshop
                )}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
            <Col {...statSpans}>
              <Statistic value={Util.AsOfTodayTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)} />
            </Col>
          </Row>
          <Row>
            <Divider style={{ margin: 5 }} />
          </Row>
          <Row>
            <Col {...statSpans}></Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  bodyshop.scoreboard_target.dailyBodyTarget + bodyshop.scoreboard_target.dailyPaintTarget
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyBodyTarget,
                    dayjs().startOf("week"),
                    dayjs().endOf("week"),
                    bodyshop
                  ) +
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyPaintTarget,
                    dayjs().startOf("week"),
                    dayjs().endOf("week"),
                    bodyshop
                  )
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyBodyTarget,
                    dayjs().subtract(1, "week").startOf("week"),
                    dayjs().subtract(1, "week").endOf("week"),
                    bodyshop
                  ) +
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyPaintTarget,
                    dayjs().subtract(1, "week").startOf("week"),
                    dayjs().subtract(1, "week").endOf("week"),
                    bodyshop
                  )
                ).toFixed(1)}
              />
            </Col>
            <Col {...statSpans}>
              <Statistic
                value={(
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyBodyTarget,
                    dayjs().subtract(2, "week").startOf("week"),
                    dayjs().subtract(2, "week").endOf("week"),
                    bodyshop
                  ) +
                  Util.WeeklyTargetHrs(
                    bodyshop.scoreboard_target.dailyPaintTarget,
                    dayjs().subtract(2, "week").startOf("week"),
                    dayjs().subtract(2, "week").endOf("week"),
                    bodyshop
                  )
                ).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.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
                  Util.LastMonthTargetHrs(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>
          </Row>
        </Col>
      </Row>
    </Card>
  );
}

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