feature/IO-3497-Ant-Design-v5-to-v6 - Signed off Files

This commit is contained in:
Dave
2026-01-12 11:34:25 -05:00
parent c3da0d9035
commit c119a66f27
70 changed files with 442 additions and 463 deletions

View File

@@ -1,4 +1,4 @@
import { Card, Col, Form, Row, Space, Statistic, Switch, Typography } from "antd";
import { Card, Col, Row, Space, Statistic, Switch, Typography } from "antd";
import dayjs from "../../utils/day";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
@@ -41,9 +41,10 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Card
title={t("scoreboard.labels.productivestatistics")}
extra={
<Form.Item label={t("general.labels.tvmode")} valuePropName="checked" name={["tvmode"]}>
<Space>
<Typography.Text>{t("general.labels.tvmode")}</Typography.Text>
<Switch onClick={() => setIsLarge(!isLarge)} defaultChecked={isLarge} />
</Form.Item>
</Space>
}
>
<Row gutter={[16, 16]}>
@@ -60,15 +61,17 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.seperatedThisWeek[day].total}
valueStyle={{
color:
parseFloat(data.seperatedThisWeek[day].total) >=
bodyshop.scoreboard_target.dailyBodyTarget +
bodyshop.scoreboard_target.dailyPaintTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.seperatedThisWeek[day].total) >=
bodyshop.scoreboard_target.dailyBodyTarget +
bodyshop.scoreboard_target.dailyPaintTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -78,14 +81,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.seperatedThisWeek[day].lab}
valueStyle={{
color:
parseFloat(data.seperatedThisWeek[day].lab) >=
bodyshop.scoreboard_target.dailyBodyTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.seperatedThisWeek[day].lab) >=
bodyshop.scoreboard_target.dailyBodyTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -93,14 +98,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.seperatedThisWeek[day].lar}
valueStyle={{
color:
parseFloat(data.seperatedThisWeek[day].lar) >=
bodyshop.scoreboard_target.dailyPaintTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.seperatedThisWeek[day].lar) >=
bodyshop.scoreboard_target.dailyPaintTarget
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -122,25 +129,27 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.totalThisWeek}
valueStyle={{
color:
parseFloat(data.totalThisWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
) +
styles={{
content: {
color:
parseFloat(data.totalThisWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
) +
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -150,19 +159,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.totalThisWeekLAB}
valueStyle={{
color:
parseFloat(data.totalThisWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalThisWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -170,19 +181,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.totalThisWeekLAR}
valueStyle={{
color:
parseFloat(data.totalThisWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalThisWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().startOf("week"),
dayjs().endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -196,25 +209,27 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.totalLastWeek}
valueStyle={{
color:
parseFloat(data.totalLastWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
) +
styles={{
content: {
color:
parseFloat(data.totalLastWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
) +
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -224,19 +239,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.totalLastWeekLAB}
valueStyle={{
color:
parseFloat(data.totalLastWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalLastWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -244,19 +261,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.totalLastWeekLAR}
valueStyle={{
color:
parseFloat(data.totalLastWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalLastWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(1, "week").startOf("week"),
dayjs().subtract(1, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -270,25 +289,27 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.totalPriorWeek}
valueStyle={{
color:
parseFloat(data.totalPriorWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
) +
styles={{
content: {
color:
parseFloat(data.totalPriorWeek) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
) +
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -298,19 +319,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.totalPriorWeekLAB}
valueStyle={{
color:
parseFloat(data.totalPriorWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalPriorWeekLAB) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyBodyTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -318,19 +341,21 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.totalPriorWeekLAR}
valueStyle={{
color:
parseFloat(data.totalPriorWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalPriorWeekLAR) >=
Util.WeeklyTargetHrsInPeriod(
bodyshop.scoreboard_target.dailyPaintTarget,
dayjs().subtract(2, "week").startOf("week"),
dayjs().subtract(2, "week").endOf("week"),
bodyshop
)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -347,15 +372,17 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.totalThisMonth}
valueStyle={{
color:
parseFloat(data.totalThisMonth) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalThisMonth) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -365,14 +392,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.totalThisMonthLAB}
valueStyle={{
color:
parseFloat(data.totalThisMonthLAB) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalThisMonthLAB) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -380,14 +409,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.totalThisMonthLAR}
valueStyle={{
color:
parseFloat(data.totalThisMonthLAR) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalThisMonthLAR) >=
Util.MonthlyTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -401,15 +432,17 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={data.totalLastMonth}
valueStyle={{
color:
parseFloat(data.totalLastMonth) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalLastMonth) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop) +
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -419,14 +452,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={data.totalLastMonthLAB}
valueStyle={{
color:
parseFloat(data.totalLastMonthLAB) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalLastMonthLAB) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyBodyTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -434,14 +469,16 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={data.totalLastMonthLAR}
valueStyle={{
color:
parseFloat(data.totalLastMonthLAR) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
color:
parseFloat(data.totalLastMonthLAR) >=
Util.LastMonthTargetHrs(bodyshop.scoreboard_target.dailyPaintTarget, bodyshop)
? "green"
: "red",
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -455,9 +492,11 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={`${data.totalEffieciencyOverPeriod || 0}%`}
valueStyle={{
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -467,9 +506,11 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.body")}</Typography.Text>}
value={`${data.totalEffieciencyOverPeriodLAB || 0}%`}
valueStyle={{
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -477,9 +518,11 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.refinish")}</Typography.Text>}
value={`${data.totalEffieciencyOverPeriodLAR || 0}%`}
valueStyle={{
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -492,9 +535,11 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Col span={24}>
<Statistic
value={jobData.count}
valueStyle={{
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>
@@ -504,9 +549,11 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Statistic
title={<Typography.Text strong>{t("scoreboard.labels.totalhrs")}</Typography.Text>}
value={jobData.tthrs}
valueStyle={{
fontSize: statisticSize,
fontWeight: statisticWeight
styles={{
content: {
fontSize: statisticSize,
fontWeight: statisticWeight
}
}}
/>
</Col>