-
+
{metadata?.suspended &&
}
{metadata?.iouparent && (
+
diff --git a/client/src/components/production-board-kanban/production-board-kanban.component.jsx b/client/src/components/production-board-kanban/production-board-kanban.component.jsx
index afd0e94e1..0c515132b 100644
--- a/client/src/components/production-board-kanban/production-board-kanban.component.jsx
+++ b/client/src/components/production-board-kanban/production-board-kanban.component.jsx
@@ -15,13 +15,13 @@ import AuditTrailMapping from "../../utils/AuditTrailMappings";
import IndefiniteLoading from "../indefinite-loading/indefinite-loading.component";
import ProductionBoardFilters from "../production-board-filters/production-board-filters.component";
import ProductionListDetailComponent from "../production-list-detail/production-list-detail.component";
-import CardColorLegend from "../production-board-kanban-card/production-board-kanban-card-color-legend.component";
+import CardColorLegend from "./production-board-kanban-card-color-legend.component.jsx";
import "./production-board-kanban.styles.scss";
import { createBoardData } from "./production-board-kanban.utils.js";
import ProductionBoardKanbanSettings from "./settings/production-board-kanban.settings.component.jsx";
import cloneDeep from "lodash/cloneDeep";
import isEqual from "lodash/isEqual";
-import { defaultKanbanSettings } from "./settings/defaultKanbanSettings.js";
+import { defaultFilters, mergeWithDefaults } from "./settings/defaultKanbanSettings.js";
import NoteUpsertModal from "../../components/note-upsert-modal/note-upsert-modal.container";
const mapStateToProps = createStructuredSelector({
@@ -41,7 +41,7 @@ const mapDispatchToProps = (dispatch) => ({
function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTrail, associationSettings, statuses }) {
const [boardLanes, setBoardLanes] = useState({ lanes: [] });
- const [filter, setFilter] = useState({ search: "", employeeId: null });
+ const [filter, setFilter] = useState(defaultFilters);
const [loading, setLoading] = useState(true);
const [isMoving, setIsMoving] = useState(false);
const [orientation, setOrientation] = useState("vertical");
@@ -182,19 +182,14 @@ function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTr
[boardLanes, client, getCardByID, isMoving, t, insertAuditTrail]
);
- const cardSettings = useMemo(
- () =>
- associationSettings?.kanban_settings && Object.keys(associationSettings.kanban_settings).length > 0
- ? associationSettings.kanban_settings
- : defaultKanbanSettings,
- [associationSettings]
- );
+ const cardSettings = useMemo(() => {
+ const kanbanSettings = associationSettings?.kanban_settings;
+ return mergeWithDefaults(kanbanSettings);
+ }, [associationSettings]);
- const handleSettingsChange = useCallback((newSettings) => {
- setLoading(true);
- setOrientation(newSettings.orientation ? "vertical" : "horizontal");
- setLoading(false);
- }, []);
+ const handleSettingsChange = () => {
+ setFilter(defaultFilters);
+ };
if (loading) {
return
;
diff --git a/client/src/components/production-board-kanban/production-board-kanban.statistics.jsx b/client/src/components/production-board-kanban/production-board-kanban.statistics.jsx
index 482ddb726..1af5ec59c 100644
--- a/client/src/components/production-board-kanban/production-board-kanban.statistics.jsx
+++ b/client/src/components/production-board-kanban/production-board-kanban.statistics.jsx
@@ -2,11 +2,13 @@ import React, { useMemo } from "react";
import { Card, Statistic } from "antd";
import { useTranslation } from "react-i18next";
import PropTypes from "prop-types";
-import { statisticsItems, defaultKanbanSettings } from "./settings/defaultKanbanSettings.js";
+import { defaultKanbanSettings, statisticsItems } from "./settings/defaultKanbanSettings.js";
+
export const StatisticType = {
HOURS: "hours",
AMOUNT: "amount",
- JOBS: "jobs"
+ JOBS: "jobs",
+ TASKS: "tasks"
};
const mergeStatistics = (items, values) => {
@@ -122,6 +124,20 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
return parseFloat(total.toFixed(2));
}, [reducerData, cardSettings.totalAmountOnBoard]);
+ const tasksInProduction = useMemo(() => {
+ if (!data || !cardSettings.tasksInProduction) return null;
+ return data.reduce((acc, item) => acc + (item.tasks_aggregate?.aggregate?.count || 0), 0);
+ }, [data, cardSettings.tasksInProduction]);
+
+ const tasksOnBoard = useMemo(() => {
+ if (!reducerData || !cardSettings.tasksOnBoard) return null;
+ return reducerData.lanes.reduce((acc, lane) => {
+ return (
+ acc + lane.cards.reduce((laneAcc, card) => laneAcc + (card.metadata.tasks_aggregate?.aggregate?.count || 0), 0)
+ );
+ }, 0);
+ }, [reducerData, cardSettings.tasksOnBoard]);
+
const statistics = useMemo(
() =>
mergeStatistics(statisticsItems, [
@@ -134,7 +150,9 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
{ id: 6, value: totalAmountOnBoard, type: StatisticType.AMOUNT },
{ id: 7, value: totalLABOnBoard, type: StatisticType.HOURS },
{ id: 8, value: totalLAROnBoard, type: StatisticType.HOURS },
- { id: 9, value: jobsOnBoard, type: StatisticType.JOBS }
+ { id: 9, value: jobsOnBoard, type: StatisticType.JOBS },
+ { id: 10, value: tasksOnBoard, type: StatisticType.TASKS },
+ { id: 11, value: tasksInProduction, type: StatisticType.TASKS }
]),
[
totalHrs,
@@ -146,7 +164,9 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
totalAmountOnBoard,
totalLABOnBoard,
totalLAROnBoard,
- jobsOnBoard
+ jobsOnBoard,
+ tasksOnBoard,
+ tasksInProduction
]
);
@@ -187,37 +207,9 @@ const ProductionStatistics = ({ data, cardSettings, reducerData }) => {
};
ProductionStatistics.propTypes = {
- data: PropTypes.arrayOf(
- PropTypes.shape({
- labhrs: PropTypes.object,
- larhrs: PropTypes.object,
- job_totals: PropTypes.object
- })
- ).isRequired,
- cardSettings: PropTypes.shape({
- totalHrs: PropTypes.bool,
- totalLAB: PropTypes.bool,
- totalLAR: PropTypes.bool,
- jobsInProduction: PropTypes.bool,
- totalAmountInProduction: PropTypes.bool,
- totalHrsOnBoard: PropTypes.bool,
- totalLABOnBoard: PropTypes.bool,
- totalLAROnBoard: PropTypes.bool,
- jobsOnBoard: PropTypes.bool,
- totalAmountOnBoard: PropTypes.bool,
- statisticsOrder: PropTypes.arrayOf(PropTypes.number)
- }).isRequired,
- reducerData: PropTypes.shape({
- lanes: PropTypes.arrayOf(
- PropTypes.shape({
- cards: PropTypes.arrayOf(
- PropTypes.shape({
- metadata: PropTypes.object
- })
- ).isRequired
- })
- ).isRequired
- })
+ data: PropTypes.array.isRequired,
+ cardSettings: PropTypes.object.isRequired,
+ reducerData: PropTypes.object
};
export default ProductionStatistics;
diff --git a/client/src/components/production-board-kanban/production-board-kanban.utils.js b/client/src/components/production-board-kanban/production-board-kanban.utils.js
index fed3d12db..ba3974c1a 100644
--- a/client/src/components/production-board-kanban/production-board-kanban.utils.js
+++ b/client/src/components/production-board-kanban/production-board-kanban.utils.js
@@ -29,7 +29,7 @@ const sortByParentId = (arr) => {
// Function to create board data based on statuses and jobs, with optional filtering
export const createBoardData = ({ statuses, data, filter, cardSettings }) => {
- const { search, employeeId } = filter;
+ const { search, employeeId, alert } = filter;
const lanes = statuses.map((status) => ({
id: status,
@@ -52,6 +52,11 @@ export const createBoardData = ({ statuses, data, filter, cardSettings }) => {
);
}
+ // Filter jobs by alert if alert filter is true
+ if (alert) {
+ filteredJobs = filteredJobs.filter((job) => job.production_vars?.alert);
+ }
+
const DataGroupedByStatus = groupBy(filteredJobs, "status");
Object.keys(DataGroupedByStatus).forEach((statusGroupKey) => {
diff --git a/client/src/components/production-board-kanban/settings/InformationSettings.jsx b/client/src/components/production-board-kanban/settings/InformationSettings.jsx
index c50f61697..3725d1ab8 100644
--- a/client/src/components/production-board-kanban/settings/InformationSettings.jsx
+++ b/client/src/components/production-board-kanban/settings/InformationSettings.jsx
@@ -18,7 +18,8 @@ const InformationSettings = ({ t }) => (
"sublets",
"partsstatus",
"estimator",
- "subtotal"
+ "subtotal",
+ "tasks"
].map((item) => (
diff --git a/client/src/components/production-board-kanban/settings/defaultKanbanSettings.js b/client/src/components/production-board-kanban/settings/defaultKanbanSettings.js
index ce0760637..87b364ea2 100644
--- a/client/src/components/production-board-kanban/settings/defaultKanbanSettings.js
+++ b/client/src/components/production-board-kanban/settings/defaultKanbanSettings.js
@@ -8,7 +8,9 @@ const statisticsItems = [
{ id: 6, name: "totalAmountOnBoard", label: "total_amount_on_board" },
{ id: 7, name: "totalLABOnBoard", label: "total_lab_on_board" },
{ id: 8, name: "totalLAROnBoard", label: "total_lar_on_board" },
- { id: 9, name: "jobsOnBoard", label: "total_jobs_on_board" }
+ { id: 9, name: "jobsOnBoard", label: "total_jobs_on_board" },
+ { id: 10, name: "tasksOnBoard", label: "tasks_on_board" },
+ { id: 11, name: "tasksInProduction", label: "tasks_in_production" }
];
const defaultKanbanSettings = {
@@ -23,6 +25,7 @@ const defaultKanbanSettings = {
scheduled_completion: true,
cardcolor: false,
orientation: false,
+ tasks: false,
cardSize: "small",
model_info: true,
kiosk: false,
@@ -35,6 +38,8 @@ const defaultKanbanSettings = {
totalLABOnBoard: false,
totalLAROnBoard: false,
jobsOnBoard: false,
+ tasksOnBoard: false,
+ tasksInProduction: false,
totalAmountOnBoard: true,
estimator: false,
subtotal: false,
@@ -43,4 +48,22 @@ const defaultKanbanSettings = {
selectedEstimators: []
};
-export { defaultKanbanSettings, statisticsItems };
+const defaultFilters = { search: "", employeeId: null, alert: false };
+
+const mergeWithDefaults = (settings) => {
+ // Create a new object that starts with the default settings
+ const mergedSettings = { ...defaultKanbanSettings };
+
+ // Override with the provided settings, if any
+ if (settings) {
+ for (const key in settings) {
+ if (settings.hasOwnProperty(key)) {
+ mergedSettings[key] = settings[key];
+ }
+ }
+ }
+
+ return mergedSettings;
+};
+
+export { defaultKanbanSettings, statisticsItems, mergeWithDefaults, defaultFilters };
diff --git a/client/src/components/production-board-kanban/settings/production-board-kanban.settings.component.jsx b/client/src/components/production-board-kanban/settings/production-board-kanban.settings.component.jsx
index 38b0c9350..0d78416f8 100644
--- a/client/src/components/production-board-kanban/settings/production-board-kanban.settings.component.jsx
+++ b/client/src/components/production-board-kanban/settings/production-board-kanban.settings.component.jsx
@@ -3,13 +3,15 @@ import { Button, Card, Col, Form, notification, Popover, Row, Tabs } from "antd"
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { UPDATE_KANBAN_SETTINGS } from "../../../graphql/user.queries.js";
-import { defaultKanbanSettings } from "./defaultKanbanSettings.js";
+import { defaultKanbanSettings, mergeWithDefaults } from "./defaultKanbanSettings.js";
import LayoutSettings from "./LayoutSettings.jsx";
import InformationSettings from "./InformationSettings.jsx";
import StatisticsSettings from "./StatisticsSettings.jsx";
import FilterSettings from "./FilterSettings.jsx";
+import PropTypes from "prop-types";
+import { isFunction } from "lodash";
-export default function ProductionBoardKanbanSettings({ associationSettings, parentLoading, bodyshop, data }) {
+function ProductionBoardKanbanSettings({ associationSettings, parentLoading, bodyshop, data, onSettingsChange }) {
const [form] = Form.useForm();
const [open, setOpen] = useState(false);
const [loading, setLoading] = useState(false);
@@ -23,16 +25,11 @@ export default function ProductionBoardKanbanSettings({ associationSettings, par
useEffect(() => {
if (associationSettings?.kanban_settings) {
- form.setFieldsValue(associationSettings.kanban_settings);
- if (associationSettings.kanban_settings.statisticsOrder) {
- setStatisticsOrder(associationSettings.kanban_settings.statisticsOrder);
- }
- if (associationSettings.kanban_settings.selectedMdInsCos) {
- setSelectedMdInsCos(associationSettings.kanban_settings.selectedMdInsCos);
- }
- if (associationSettings.kanban_settings.selectedEstimators) {
- setSelectedEstimators(associationSettings.kanban_settings.selectedEstimators);
- }
+ const finalSettings = mergeWithDefaults(associationSettings.kanban_settings);
+ form.setFieldsValue(finalSettings);
+ setStatisticsOrder(finalSettings.statisticsOrder);
+ setSelectedMdInsCos(finalSettings.selectedMdInsCos);
+ setSelectedEstimators(finalSettings.selectedEstimators);
}
}, [form, associationSettings]);
@@ -65,6 +62,11 @@ export default function ProductionBoardKanbanSettings({ associationSettings, par
setOpen(false);
setLoading(false);
parentLoading(false);
+
+ if (onSettingsChange && isFunction(onSettingsChange)) {
+ onSettingsChange(values);
+ }
+
setHasChanges(false);
};
@@ -155,3 +157,13 @@ export default function ProductionBoardKanbanSettings({ associationSettings, par
);
}
+
+ProductionBoardKanbanSettings.propTypes = {
+ associationSettings: PropTypes.object,
+ parentLoading: PropTypes.func.isRequired,
+ bodyshop: PropTypes.object.isRequired,
+ onSettingsChange: PropTypes.func,
+ data: PropTypes.array
+};
+
+export default ProductionBoardKanbanSettings;
diff --git a/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx b/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx
index 493812840..cd30952fb 100644
--- a/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx
+++ b/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx
@@ -12,7 +12,7 @@ import { EyeInvisibleOutlined, EyeOutlined } from "@ant-design/icons";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../../../redux/user/user.selectors.js";
import { selectTechnician } from "../../../../redux/tech/tech.selectors.js";
-import ProductionBoardCard from "../../../production-board-kanban-card/production-board-kanban-card.component.jsx";
+import ProductionBoardCard from "../../production-board-kanban-card.component.jsx";
import HeightMemoryWrapper from "../components/HeightMemoryWrapper.jsx";
import SizeMemoryWrapper from "../components/SizeMemoryWrapper.jsx";
import ListComponent from "../components/ListComponent.jsx";
diff --git a/client/src/components/production-list-columns/production-list-columns.add.component.jsx b/client/src/components/production-list-columns/production-list-columns.add.component.jsx
index 1d1ea8867..24cca5537 100644
--- a/client/src/components/production-list-columns/production-list-columns.add.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.add.component.jsx
@@ -2,7 +2,6 @@ import React from "react";
import { Button, Dropdown } from "antd";
import dataSource from "./production-list-columns.data";
import { useTranslation } from "react-i18next";
-
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectTechnician } from "../../redux/tech/tech.selectors";
@@ -10,16 +9,23 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
import { useSplitTreatments } from "@splitsoftware/splitio-react";
const mapStateToProps = createStructuredSelector({
- //currentUser: selectCurrentUser
technician: selectTechnician,
bodyshop: selectBodyshop
});
-const mapDispatchToProps = (dispatch) => ({
- //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-export default connect(mapStateToProps, mapDispatchToProps)(ProductionColumnsComponent);
-export function ProductionColumnsComponent({ columnState, technician, bodyshop, data, tableState, refetch }) {
+const mapDispatchToProps = (dispatch) => ({
+ // Add any necessary dispatch actions here
+});
+
+export function ProductionColumnsComponent({
+ columnState,
+ technician,
+ bodyshop,
+ data,
+ tableState,
+ refetch,
+ onColumnAdd
+}) {
const [columns, setColumns] = columnState;
const { t } = useTranslation();
const {
@@ -29,18 +35,26 @@ export function ProductionColumnsComponent({ columnState, technician, bodyshop,
names: ["Enhanced_Payroll"],
splitKey: bodyshop.imexshopid
});
+
const handleAdd = (e) => {
- setColumns([
- ...columns,
- ...dataSource({
- bodyshop,
- technician,
- state: tableState,
- data,
- activeStatuses: bodyshop.md_ro_statuses.active_statuses,
- treatments: { Enhanced_Payroll }
- }).filter((i) => i.key === e.key)
- ]);
+ const newColumn = dataSource({
+ bodyshop,
+ technician,
+ state: tableState,
+ data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((i) => i.key === e.key);
+
+ if (newColumn) {
+ const updatedColumns = [...columns, newColumn];
+ setColumns(updatedColumns);
+
+ // Call the onColumnAdd function passed as a prop
+ if (onColumnAdd) {
+ onColumnAdd(newColumn);
+ }
+ }
};
const columnKeys = columns.map((i) => i.key);
@@ -76,12 +90,4 @@ export function ProductionColumnsComponent({ columnState, technician, bodyshop,
);
}
-// c.key)}
-// render={(item) => item.title}
-// onChange={(nextTargetKeys, direction, moveKeys) => {
-// setColumns(dataSource.filter((i) => nextTargetKeys.includes(i.key)));
-// }}
-// />
+export default connect(mapStateToProps, mapDispatchToProps)(ProductionColumnsComponent);
diff --git a/client/src/components/production-list-columns/production-list-columns.alert.component.jsx b/client/src/components/production-list-columns/production-list-columns.alert.component.jsx
index e9a4e2d62..db219745b 100644
--- a/client/src/components/production-list-columns/production-list-columns.alert.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.alert.component.jsx
@@ -1,6 +1,6 @@
-import { ExclamationCircleFilled } from "@ant-design/icons";
+import { ExclamationCircleFilled, PlusCircleFilled } from "@ant-design/icons";
import { useMutation } from "@apollo/client";
-import { Button } from "antd";
+import { Button, Popconfirm } from "antd";
import React, { useCallback } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
@@ -8,6 +8,7 @@ import { logImEXEvent } from "../../firebase/firebase.utils";
import { UPDATE_JOB } from "../../graphql/jobs.queries";
import { insertAuditTrail } from "../../redux/application/application.actions";
import AuditTrailMapping from "../../utils/AuditTrailMappings";
+import { useTranslation } from "react-i18next";
const mapStateToProps = createStructuredSelector({});
@@ -22,22 +23,24 @@ const mapDispatchToProps = (dispatch) => ({
)
});
-const ProductionListColumnAlert = ({ record, insertAuditTrail }) => {
+const ProductionListColumnAlert = ({ id, productionVars, refetch, insertAuditTrail }) => {
const [updateAlert] = useMutation(UPDATE_JOB);
+ const { t } = useTranslation();
const handleAlertToggle = useCallback(() => {
logImEXEvent("production_toggle_alert");
- const newAlertState = !!record.production_vars?.alert ? !record.production_vars.alert : true;
+ const newAlertState = !!productionVars?.alert ? !productionVars?.alert : true;
+ const finalProductionVars = {
+ ...productionVars,
+ alert: newAlertState
+ };
updateAlert({
variables: {
- jobId: record.id,
+ jobId: id,
job: {
- production_vars: {
- ...record.production_vars,
- alert: newAlertState
- }
+ production_vars: finalProductionVars
}
}
}).catch((err) => {
@@ -45,17 +48,26 @@ const ProductionListColumnAlert = ({ record, insertAuditTrail }) => {
});
insertAuditTrail({
- jobid: record.id,
+ jobid: id,
operation: AuditTrailMapping.alertToggle(newAlertState),
type: "alertToggle"
});
- if (record.refetch) record.refetch();
- }, [updateAlert, insertAuditTrail, record]);
+ if (refetch) refetch();
+ }, [updateAlert, insertAuditTrail, id, productionVars, refetch]);
- if (!record.production_vars?.alert) return null;
-
- return } onClick={handleAlertToggle} />;
+ return productionVars?.alert ? (
+
+ } />
+
+ ) : (
+ } onClick={handleAlertToggle} />
+ );
};
export default connect(mapStateToProps, mapDispatchToProps)(ProductionListColumnAlert);
diff --git a/client/src/components/production-list-columns/production-list-columns.data.jsx b/client/src/components/production-list-columns/production-list-columns.data.jsx
index 6738711ae..16a450dab 100644
--- a/client/src/components/production-list-columns/production-list-columns.data.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.data.jsx
@@ -2,10 +2,13 @@ import { BranchesOutlined, PauseCircleOutlined } from "@ant-design/icons";
import { Checkbox, Space, Tooltip } from "antd";
import i18n from "i18next";
import { Link } from "react-router-dom";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { store } from "../../redux/store";
import CurrencyFormatter from "../../utils/CurrencyFormatter";
import { TimeFormatter } from "../../utils/DateFormatter";
import PhoneFormatter from "../../utils/PhoneFormatter";
import { onlyUnique } from "../../utils/arrayHelper";
+import InstanceRenderManager from "../../utils/instanceRenderMgr";
import { alphaSort, dateSort, statusSort } from "../../utils/sorters";
import JobAltTransportChange from "../job-at-change/job-at-change.component";
import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
@@ -23,10 +26,12 @@ import ProductionListColumnPartsReceived from "./production-list-columns.partsre
import ProductionListColumnNote from "./production-list-columns.productionnote.component";
import ProductionListColumnCategory from "./production-list-columns.status.category";
import ProductionListColumnStatus from "./production-list-columns.status.component";
-import ProductionlistColumnTouchTime from "./prodution-list-columns.touchtime.component";
-import { store } from "../../redux/store";
-import { setModalContext } from "../../redux/modals/modals.actions";
-import InstanceRenderManager from "../../utils/instanceRenderMgr";
+import ProductionListColumnTouchTime from "./prodution-list-columns.touchtime.component";
+
+const getEmployeeName = (employeeId, employees) => {
+ const employee = employees.find((e) => e.id === employeeId);
+ return employee ? `${employee.first_name} ${employee.last_name}` : "";
+};
const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatments }) => {
const { Enhanced_Payroll } = treatments;
@@ -258,7 +263,7 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
{ text: "True", value: true },
{ text: "False", value: false }
],
- onFilter: (value, record) => value.includes(record.special_coverage_policy),
+ onFilter: (value, record) => value === record.special_coverage_policy,
render: (text, record) =>
},
@@ -349,7 +354,14 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
key: "alert",
sorter: (a, b) => Number(a.production_vars?.alert || false) - Number(b.production_vars?.alert || false),
sortOrder: state.sortedInfo.columnKey === "alert" && state.sortedInfo.order,
- render: (text, record) =>
+ filters: [
+ { text: "True", value: true },
+ { text: "False", value: false }
+ ],
+ onFilter: (value, record) => value === (record.production_vars?.alert || false),
+ render: (text, record) => (
+
+ )
},
{
title: i18n.t("production.labels.note"),
@@ -370,7 +382,7 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
dataIndex: "tt",
key: "tt",
render: (text, record) => {
- return ;
+ return ;
}
},
{
@@ -419,8 +431,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
sortOrder: state.sortedInfo.columnKey === "employee_body" && state.sortedInfo.order,
sorter: (a, b) =>
alphaSort(
- bodyshop.employees?.find((e) => e.id === a.employee_body)?.first_name,
- bodyshop.employees?.find((e) => e.id === b.employee_body)?.first_name
+ getEmployeeName(a.employee_body, bodyshop.employees),
+ getEmployeeName(b.employee_body, bodyshop.employees)
),
render: (text, record) => (
@@ -433,8 +445,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
sortOrder: state.sortedInfo.columnKey === "employee_prep" && state.sortedInfo.order,
sorter: (a, b) =>
alphaSort(
- bodyshop.employees?.find((e) => e.id === a.employee_prep)?.first_name,
- bodyshop.employees?.find((e) => e.id === b.employee_prep)?.first_name
+ getEmployeeName(a.employee_prep, bodyshop.employees),
+ getEmployeeName(b.employee_prep, bodyshop.employees)
),
render: (text, record) => (
@@ -453,8 +465,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
sortOrder: state.sortedInfo.columnKey === "employee_csr" && state.sortedInfo.order,
sorter: (a, b) =>
alphaSort(
- bodyshop.employees?.find((e) => e.id === a.employee_csr)?.first_name,
- bodyshop.employees?.find((e) => e.id === b.employee_csr)?.first_name
+ getEmployeeName(a.employee_csr, bodyshop.employees),
+ getEmployeeName(b.employee_csr, bodyshop.employees)
),
render: (text, record) => (
@@ -467,8 +479,8 @@ const r = ({ technician, state, activeStatuses, data, bodyshop, refetch, treatme
sortOrder: state.sortedInfo.columnKey === "employee_refinish" && state.sortedInfo.order,
sorter: (a, b) =>
alphaSort(
- bodyshop.employees?.find((e) => e.id === a.employee_refinish)?.first_name,
- bodyshop.employees?.find((e) => e.id === b.employee_refinish)?.first_name
+ getEmployeeName(a.employee_refinish, bodyshop.employees),
+ getEmployeeName(b.employee_refinish, bodyshop.employees)
),
render: (text, record) => (
diff --git a/client/src/components/production-list-columns/production-list-columns.date.component.jsx b/client/src/components/production-list-columns/production-list-columns.date.component.jsx
index 7a639d8e5..b4fb36007 100644
--- a/client/src/components/production-list-columns/production-list-columns.date.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.date.component.jsx
@@ -1,12 +1,12 @@
import { useMutation } from "@apollo/client";
-import { Button, Card, Dropdown, Space, TimePicker } from "antd";
+import { Button, Card, Dropdown, Space } from "antd";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { UPDATE_JOB } from "../../graphql/jobs.queries";
import { DateFormatter } from "../../utils/DateFormatter";
import dayjs from "../../utils/day";
-import FormDatePicker from "../form-date-picker/form-date-picker.component";
+import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
export default function ProductionListDate({ record, field, time, pastIndicator }) {
const [updateAlert] = useMutation(UPDATE_JOB);
@@ -57,22 +57,14 @@ export default function ProductionListDate({ record, field, time, pastIndicator
label: (
e.stopPropagation()}>
- e.stopPropagation()}
value={(record[field] && dayjs(record[field])) || null}
onChange={handleChange}
- format="MM/DD/YYYY"
+ format={time ? "MM/DD/YYYY hh:mm a" : "MM/DD/YYYY"}
isDateOnly={!time}
+ showTime={time ? { format: "hh:mm a", minuteStep: 15 } : false}
/>
- {time && (
- e.stopPropagation()}
- value={(record[field] && dayjs(record[field])) || null}
- onChange={handleChange}
- minuteStep={15}
- format="hh:mm a"
- />
- )}
diff --git a/client/src/components/production-list-columns/production-list-columns.empassignment.component.jsx b/client/src/components/production-list-columns/production-list-columns.empassignment.component.jsx
index d4c92220e..141ed42bb 100644
--- a/client/src/components/production-list-columns/production-list-columns.empassignment.component.jsx
+++ b/client/src/components/production-list-columns/production-list-columns.empassignment.component.jsx
@@ -148,6 +148,7 @@ export function ProductionListEmpAssignment({ insertAuditTrail, bodyshop, record
) : (
{
setAssignment({ operation: type });
setVisibility(true);
diff --git a/client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx b/client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx
deleted file mode 100644
index bdbb2b5a6..000000000
--- a/client/src/components/production-list-save-config-button/production-list-save-config-button.component.jsx
+++ /dev/null
@@ -1,89 +0,0 @@
-import { useMutation } from "@apollo/client";
-import React, { useState } from "react";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import { Button, Form, Input, notification, Popover, Space } from "antd";
-import { useTranslation } from "react-i18next";
-import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-
-const mapStateToProps = createStructuredSelector({
- //currentUser: selectCurrentUser
- bodyshop: selectBodyshop
-});
-const mapDispatchToProps = (dispatch) => ({
- //setUserLanguage: language => dispatch(setUserLanguage(language))
-});
-
-export function ProductionListSaveConfigButton({ columns, bodyshop, tableState }) {
- const [updateShop] = useMutation(UPDATE_SHOP);
- const [loading, setLoading] = useState(false);
- const [open, setOpen] = useState(false);
- const [form] = Form.useForm();
-
- const { t } = useTranslation();
-
- const handleSaveConfig = async (values) => {
- logImEXEvent("production_save_config");
- setLoading(true);
- const result = await updateShop({
- variables: {
- id: bodyshop.id,
- shop: {
- production_config: [
- ...bodyshop.production_config.filter((b) => b.name !== values.name),
- //Assign it to the name
- {
- name: values.name,
- columns: {
- columnKeys: columns.map((i) => {
- return { key: i.key, width: i.width };
- }),
- tableState
- }
- }
- ]
- }
- }
- });
- if (!!!result.errors) {
- notification["success"]({ message: t("bodyshop.successes.save") });
- } else {
- notification["error"]({
- message: t("bodyshop.errors.saving", {
- error: JSON.stringify(result.errors)
- })
- });
- }
- form.resetFields();
- setOpen(false);
- setLoading(false);
- };
- const popMenu = (
-
-
-
- );
-
- return (
-
-
-
- );
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(ProductionListSaveConfigButton);
diff --git a/client/src/components/production-list-table/production-list-config-manager.component.jsx b/client/src/components/production-list-table/production-list-config-manager.component.jsx
new file mode 100644
index 000000000..b34fb92d7
--- /dev/null
+++ b/client/src/components/production-list-table/production-list-config-manager.component.jsx
@@ -0,0 +1,505 @@
+import { DeleteOutlined, ExclamationCircleOutlined, PlusOutlined } from "@ant-design/icons";
+import { useMutation } from "@apollo/client";
+import { Button, Form, Input, Modal, notification, Popconfirm, Popover, Select, Space } from "antd";
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { UPDATE_ACTIVE_PROD_LIST_VIEW } from "../../graphql/associations.queries";
+import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
+import ProductionListColumns from "../production-list-columns/production-list-columns.data";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
+import { logImEXEvent } from "../../firebase/firebase.utils";
+import { isFunction } from "lodash";
+
+const { confirm } = Modal;
+
+export function ProductionListConfigManager({
+ refetch,
+ bodyshop,
+ technician,
+ currentUser,
+ state,
+ data,
+ columns,
+ setColumns,
+ setState,
+ onSave,
+ hasUnsavedChanges,
+ setHasUnsavedChanges
+}) {
+ const { t } = useTranslation();
+ const [updateDefaultProdView] = useMutation(UPDATE_ACTIVE_PROD_LIST_VIEW);
+ const [updateShop] = useMutation(UPDATE_SHOP);
+ const [loading, setLoading] = useState(false);
+ const [open, setOpen] = useState(false);
+ const [isAddingNewProfile, setIsAddingNewProfile] = useState(false);
+ const [form] = Form.useForm();
+
+ const [activeView, setActiveView] = useState(() => {
+ const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
+ return assoc && assoc.default_prod_list_view;
+ });
+
+ const defaultState = {
+ sortedInfo: {
+ columnKey: "ro_number",
+ order: null
+ },
+ filteredInfo: {}
+ };
+
+ const ensureDefaultState = (state) => {
+ return {
+ sortedInfo: state?.sortedInfo || defaultState.sortedInfo,
+ filteredInfo: state?.filteredInfo || defaultState.filteredInfo,
+ ...state
+ };
+ };
+
+ const createDefaultView = async () => {
+ const defaultConfig = {
+ name: t("production.constants.main_profile"),
+ columns: {
+ columnKeys: [
+ { key: "ro_number", width: 100 },
+ { key: "ownr", width: 100 },
+ { key: "vehicle", width: 100 },
+ { key: "ins_co_nm", width: 100 },
+ { key: "actual_in", width: 100 },
+ { key: "scheduled_completion", width: 100 },
+ { key: "labhrs", width: 100 },
+ { key: "employee_body", width: 100 },
+ { key: "larhrs", width: 100 },
+ { key: "employee_refinish", width: 100 },
+ { key: "tt", width: 100 },
+ { key: "status", width: 100 },
+ { key: "sublets", width: 100 },
+ { key: "viewdetail", width: 100 }
+ ],
+ tableState: ensureDefaultState(state)
+ }
+ };
+
+ const result = await updateShop({
+ variables: {
+ id: bodyshop.id,
+ shop: {
+ production_config: [defaultConfig]
+ }
+ }
+ });
+
+ if (!result.errors) {
+ await updateActiveProdView(t("production.constants.main_profile"));
+ window.location.reload(); // Reload the page
+ } else {
+ notification.error({
+ message: t("bodyshop.errors.creatingdefaultview", {
+ error: JSON.stringify(result.errors)
+ })
+ });
+ }
+ };
+
+ const {
+ treatments: { Enhanced_Payroll }
+ } = useSplitTreatments({
+ attributes: {},
+ names: ["Enhanced_Payroll"],
+ splitKey: bodyshop.imexshopid
+ });
+
+ const updateActiveProdView = async (viewName) => {
+ const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
+ if (assoc) {
+ await updateDefaultProdView({
+ variables: { assocId: assoc.id, view: viewName },
+ update(cache) {
+ cache.modify({
+ id: cache.identify(bodyshop),
+ fields: {
+ associations(existingAssociations) {
+ return existingAssociations.map((a) => {
+ if (a.useremail !== currentUser.email) return a;
+ return { ...a, default_prod_list_view: viewName };
+ });
+ }
+ }
+ });
+ }
+ });
+ setActiveView(viewName);
+ setHasUnsavedChanges(false);
+ }
+ };
+
+ const handleSelect = async (value) => {
+ if (hasUnsavedChanges) {
+ confirm({
+ title: t("general.labels.unsavedchanges"),
+ icon: ,
+ content: t("general.messages.unsavedchangespopup"),
+ onOk: () => proceedWithSelect(value),
+ onCancel() {
+ // Do nothing if canceled
+ }
+ });
+ } else {
+ await proceedWithSelect(value);
+ }
+ };
+
+ const proceedWithSelect = async (value) => {
+ if (value === "add_new") {
+ setIsAddingNewProfile(true);
+ setOpen(true);
+ return;
+ }
+
+ const selectedConfig = bodyshop.production_config.find((pc) => pc.name === value);
+
+ // If the selected profile doesn't exist, revert to the main profile
+ if (!selectedConfig) {
+ const mainProfileConfig = bodyshop.production_config.find(
+ (pc) => pc.name === t("production.constants.main_profile")
+ );
+
+ if (mainProfileConfig) {
+ await updateActiveProdView(t("production.constants.main_profile"));
+ setColumns(
+ mainProfileConfig.columns.columnKeys.map((k) => {
+ return {
+ ...ProductionListColumns({
+ bodyshop,
+ refetch,
+ technician,
+ state: ensureDefaultState(state),
+ data: data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((e) => e.key === k.key),
+ width: k.width
+ };
+ })
+ );
+ const newState = ensureDefaultState(mainProfileConfig.columns.tableState);
+ setState(newState);
+
+ if (onSave && isFunction(onSave)) {
+ onSave();
+ }
+ return;
+ }
+ }
+
+ // If the selected profile exists, proceed as normal
+ if (selectedConfig) {
+ const newColumns = selectedConfig.columns.columnKeys.map((k) => {
+ return {
+ ...ProductionListColumns({
+ bodyshop,
+ refetch,
+ technician,
+ state: ensureDefaultState(state),
+ data: data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((e) => e.key === k.key),
+ width: k.width
+ };
+ });
+ setColumns(newColumns);
+ const newState = ensureDefaultState(selectedConfig.columns.tableState);
+ setState(newState);
+
+ await updateActiveProdView(value);
+ if (onSave && isFunction(onSave)) {
+ onSave();
+ }
+ }
+ };
+
+ const handleTrash = async (name) => {
+ if (name === t("production.constants.main_profile")) return;
+
+ const remainingConfigs = bodyshop.production_config.filter((b) => b.name !== name);
+
+ await updateShop({
+ variables: {
+ id: bodyshop.id,
+ shop: {
+ production_config: remainingConfigs
+ }
+ },
+ awaitRefetchQueries: true
+ });
+
+ if (name === activeView) {
+ // Only switch profiles if the deleted profile was the active profile
+ if (remainingConfigs.length > 0) {
+ const nextConfig = remainingConfigs[0];
+ await updateActiveProdView(nextConfig.name);
+ setColumns(
+ nextConfig.columns.columnKeys.map((k) => {
+ return {
+ ...ProductionListColumns({
+ technician,
+ state: ensureDefaultState(state),
+ refetch,
+ data: data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((e) => e.key === k.key),
+ width: k.width
+ };
+ })
+ );
+ setState(ensureDefaultState(nextConfig.columns.tableState));
+ } else {
+ await updateActiveProdView(null);
+ setColumns([]);
+ setState(defaultState);
+ }
+ } else {
+ // Revert back to the active view and load its columns and state
+ const activeConfig = bodyshop.production_config.find((pc) => pc.name === activeView);
+ if (activeConfig) {
+ await updateActiveProdView(activeView);
+ setColumns(
+ activeConfig.columns.columnKeys.map((k) => {
+ return {
+ ...ProductionListColumns({
+ technician,
+ state: ensureDefaultState(state),
+ refetch,
+ data: data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((e) => e.key === k.key),
+ width: k.width
+ };
+ })
+ );
+ setState(ensureDefaultState(activeConfig.columns.tableState));
+ }
+ }
+ };
+
+ const handleSaveConfig = async (values) => {
+ logImEXEvent("production_save_config");
+ setLoading(true);
+
+ const profileName = isAddingNewProfile ? values.name : activeView;
+
+ const result = await updateShop({
+ variables: {
+ id: bodyshop.id,
+ shop: {
+ production_config: [
+ ...bodyshop.production_config.filter((b) => b.name !== profileName),
+ {
+ name: profileName,
+ columns: {
+ columnKeys: columns.map((i) => ({ key: i.key, width: i.width })),
+ tableState: ensureDefaultState(state)
+ }
+ }
+ ]
+ }
+ }
+ });
+
+ if (!result.errors) {
+ notification.success({ message: t("bodyshop.successes.save") });
+ if (isAddingNewProfile) {
+ await updateActiveProdView(profileName);
+ }
+ if (onSave && isFunction(onSave)) {
+ onSave();
+ }
+ setHasUnsavedChanges(false);
+ } else {
+ notification.error({
+ message: t("bodyshop.errors.saving", {
+ error: JSON.stringify(result.errors)
+ })
+ });
+ }
+
+ form.resetFields();
+ setOpen(false);
+ setLoading(false);
+ setIsAddingNewProfile(false);
+ };
+
+ useEffect(() => {
+ const validateAndSetDefaultView = () => {
+ const configExists = bodyshop.production_config.some((pc) => pc.name === activeView);
+
+ if (!configExists) {
+ // If the default view doesn't exist, revert to the main profile
+ const mainProfileConfig = bodyshop.production_config.find(
+ (pc) => pc.name === t("production.constants.main_profile")
+ );
+
+ if (mainProfileConfig) {
+ setActiveView(t("production.constants.main_profile"));
+
+ setColumns(
+ mainProfileConfig.columns.columnKeys.map((k) => {
+ return {
+ ...ProductionListColumns({
+ bodyshop,
+ refetch,
+ technician,
+ state: ensureDefaultState(state),
+ data: data,
+ activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+ treatments: { Enhanced_Payroll }
+ }).find((e) => e.key === k.key),
+ width: k.width
+ };
+ })
+ );
+ setState(ensureDefaultState(mainProfileConfig.columns.tableState));
+
+ updateActiveProdView(t("production.constants.main_profile"));
+ }
+ } else {
+ // If the default view exists, set it as active
+ setActiveView(activeView);
+ }
+ };
+
+ if (!bodyshop.production_config || bodyshop.production_config.length === 0) {
+ createDefaultView().catch((e) => {
+ console.error("Something went wrong saving the production list view Config.");
+ });
+ } else {
+ validateAndSetDefaultView();
+ }
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [activeView, bodyshop.production_config]);
+
+ const popMenu = (
+
+
+
+ );
+
+ return (
+
+
+
+
+
+
+ );
+}
diff --git a/client/src/components/production-list-table/production-list-table-view-select.component.jsx b/client/src/components/production-list-table/production-list-table-view-select.component.jsx
deleted file mode 100644
index 9a98ede10..000000000
--- a/client/src/components/production-list-table/production-list-table-view-select.component.jsx
+++ /dev/null
@@ -1,157 +0,0 @@
-import { DeleteOutlined } from "@ant-design/icons";
-import { useMutation } from "@apollo/client";
-import { Popconfirm, Select } from "antd";
-import React from "react";
-import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { UPDATE_ACTIVE_PROD_LIST_VIEW } from "../../graphql/associations.queries";
-import { UPDATE_SHOP } from "../../graphql/bodyshop.queries";
-import { selectTechnician } from "../../redux/tech/tech.selectors";
-import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors";
-import ProductionListColumns from "../production-list-columns/production-list-columns.data";
-import { useSplitTreatments } from "@splitsoftware/splitio-react";
-
-const mapStateToProps = createStructuredSelector({
- bodyshop: selectBodyshop,
- technician: selectTechnician,
- currentUser: selectCurrentUser
-});
-
-export function ProductionListTable({ refetch, bodyshop, technician, currentUser, state, data, setColumns, setState }) {
- const { t } = useTranslation();
- const [updateDefaultProdView] = useMutation(UPDATE_ACTIVE_PROD_LIST_VIEW);
- const [updateShop] = useMutation(UPDATE_SHOP);
-
- const {
- treatments: { Enhanced_Payroll }
- } = useSplitTreatments({
- attributes: {},
- names: ["Enhanced_Payroll"],
- splitKey: bodyshop.imexshopid
- });
-
- const handleSelect = async (value, option) => {
- setColumns(
- bodyshop.production_config
- .filter((pc) => pc.name === value)[0]
- .columns.columnKeys.map((k) => {
- return {
- ...ProductionListColumns({
- bodyshop,
- refetch,
- technician,
- state,
- data: data,
- activeStatuses: bodyshop.md_ro_statuses.active_statuses,
- treatments: { Enhanced_Payroll }
- }).find((e) => e.key === k.key),
- width: k.width
- };
- })
- );
- setState(bodyshop.production_config.filter((pc) => pc.name === value)[0].columns.tableState);
-
- const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
-
- if (assoc) {
- await updateDefaultProdView({
- variables: { assocId: assoc.id, view: value },
- update(cache) {
- cache.modify({
- id: cache.identify(bodyshop),
- fields: {
- associations(existingAssociations, { readField }) {
- return existingAssociations.map((a) => {
- if (a.useremail !== currentUser.email) return a;
- return { ...a, default_prod_list_view: value };
- });
- }
- }
- });
- }
- });
- }
- };
-
- const handleTrash = async (name) => {
- await updateShop({
- variables: {
- id: bodyshop.id,
- shop: {
- production_config: bodyshop.production_config.filter((b) => b.name !== name)
- }
- },
- awaitRefetchQueries: true
- });
-
- setColumns(
- bodyshop.production_config[0].columns.columnKeys.map((k) => {
- return {
- ...ProductionListColumns({
- technician,
- state,
- refetch,
- data: data,
- activeStatuses: bodyshop.md_ro_statuses.active_statuses,
- treatments: { Enhanced_Payroll }
- }).find((e) => e.key === k.key),
- width: k.width
- };
- })
- );
-
- setState(bodyshop.production_config[0].columns.tableState);
- };
- const assoc = bodyshop.associations.find((a) => a.useremail === currentUser.email);
-
- const defaultView = assoc && assoc.default_prod_list_view;
- return (
-
-
-
No columns found.
;
@@ -186,8 +222,29 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
.toFixed(1);
const totalLAB = data.reduce((acc, val) => acc + (val.labhrs?.aggregate?.sum?.mod_lb_hrs || 0), 0).toFixed(1);
const totalLAR = data.reduce((acc, val) => acc + (val.larhrs?.aggregate?.sum?.mod_lb_hrs || 0), 0).toFixed(1);
+
return (
+
+ {hasUnsavedChanges && (
+
+ {t("general.messages.unsavedchanges")}
+
+ {t("general.actions.reset")}
+
+