diff --git a/client/src/App/ProductFruitsWrapper.jsx b/client/src/App/ProductFruitsWrapper.jsx
index 2d3cfbac7..2686a161e 100644
--- a/client/src/App/ProductFruitsWrapper.jsx
+++ b/client/src/App/ProductFruitsWrapper.jsx
@@ -27,6 +27,6 @@ ProductFruitsWrapper.propTypes = {
currentUser: PropTypes.shape({
authorized: PropTypes.bool,
email: PropTypes.string
- }).isRequired,
- workspaceCode: PropTypes.string.isRequired
+ }),
+ workspaceCode: PropTypes.string
};
diff --git a/client/src/components/production-board-kanban-card/production-board-kanban-card.component.jsx b/client/src/components/production-board-kanban-card/production-board-kanban-card.component.jsx
index 6c8fb3e87..163abf19c 100644
--- a/client/src/components/production-board-kanban-card/production-board-kanban-card.component.jsx
+++ b/client/src/components/production-board-kanban-card/production-board-kanban-card.component.jsx
@@ -284,17 +284,17 @@ export default function ProductionBoardCard({ technician, card, bodyshop, cardSe
return !(
cardSettings?.ownr_nm ||
cardSettings?.model_info ||
- (cardSettings?.ins_co_nm && metadata.ins_co_nm) ||
- (cardSettings?.clm_no && metadata.clm_no) ||
+ cardSettings?.ins_co_nm ||
+ cardSettings?.clm_no ||
cardSettings?.employeeassignments ||
- (cardSettings?.actual_in && metadata.actual_in) ||
- (cardSettings?.scheduled_completion && metadata.scheduled_completion) ||
- (cardSettings?.ats && metadata.alt_transport) ||
+ cardSettings?.actual_in ||
+ cardSettings?.scheduled_completion ||
+ cardSettings?.ats ||
cardSettings?.sublets ||
cardSettings?.production_note ||
cardSettings?.partsstatus
);
- }, [cardSettings, metadata]);
+ }, [cardSettings]);
const headerContent = (
diff --git a/client/src/components/production-board-kanban/defaultKanbanSettings.js b/client/src/components/production-board-kanban/defaultKanbanSettings.js
new file mode 100644
index 000000000..d06c67e83
--- /dev/null
+++ b/client/src/components/production-board-kanban/defaultKanbanSettings.js
@@ -0,0 +1,42 @@
+const statisticsItems = [
+ { id: 0, name: "totalHrs", label: "total_hours_in_production" },
+ { id: 1, name: "totalAmountInProduction", label: "total_amount_in_production" },
+ { id: 2, name: "totalLAB", label: "total_lab_in_production" },
+ { id: 3, name: "totalLAR", label: "total_lar_in_production" },
+ { id: 4, name: "jobsInProduction", label: "jobs_in_production" },
+ { id: 5, name: "totalHrsOnBoard", label: "total_hours_on_board" },
+ { 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" }
+];
+
+const defaultKanbanSettings = {
+ ats: true,
+ clm_no: true,
+ compact: false,
+ ownr_nm: true,
+ sublets: true,
+ ins_co_nm: true,
+ production_note: true,
+ employeeassignments: true,
+ scheduled_completion: true,
+ cardcolor: false,
+ orientation: false,
+ cardSize: "small",
+ model_info: true,
+ kiosk: false,
+ totalHrs: true,
+ totalAmountInProduction: false,
+ totalLAB: true,
+ totalLAR: true,
+ jobsInProduction: true,
+ totalHrsOnBoard: false,
+ totalLABOnBoard: false,
+ totalLAROnBoard: false,
+ jobsOnBoard: false,
+ totalAmountOnBoard: true,
+ statisticsOrder: statisticsItems.map((item) => item.id)
+};
+
+export { defaultKanbanSettings, statisticsItems };
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 1c02ab194..6f8932f94 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
@@ -21,6 +21,7 @@ import { createBoardData } from "./production-board-kanban.utils.js";
import ProductionBoardKanbanSettings from "./production-board-kanban.settings.component.jsx";
import cloneDeep from "lodash/cloneDeep";
import isEqual from "lodash/isEqual";
+import { defaultKanbanSettings } from "./defaultKanbanSettings.js";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop
@@ -179,32 +180,7 @@ function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTr
() =>
associationSettings?.kanban_settings && Object.keys(associationSettings.kanban_settings).length > 0
? associationSettings.kanban_settings
- : {
- ats: true,
- clm_no: true,
- compact: false,
- ownr_nm: true,
- sublets: true,
- ins_co_nm: true,
- production_note: true,
- employeeassignments: true,
- scheduled_completion: true,
- cardcolor: false,
- orientation: false,
- cardSize: "small",
- model_info: true,
- kiosk: false,
- totalHrs: true,
- totalAmountInProduction: false,
- totalLAB: true,
- totalLAR: true,
- jobsInProduction: true,
- totalHrsOnBoard: false,
- totalLABOnBoard: false,
- totalLAROnBoard: false,
- jobsOnBoard: false,
- totalAmountOnBoard: true
- },
+ : defaultKanbanSettings,
[associationSettings]
);
diff --git a/client/src/components/production-board-kanban/production-board-kanban.settings.component.jsx b/client/src/components/production-board-kanban/production-board-kanban.settings.component.jsx
index 39d60fa14..34fb2c36a 100644
--- a/client/src/components/production-board-kanban/production-board-kanban.settings.component.jsx
+++ b/client/src/components/production-board-kanban/production-board-kanban.settings.component.jsx
@@ -1,15 +1,132 @@
-// ProductionBoardKanbanSettings.jsx
import { useMutation } from "@apollo/client";
-import { Button, Card, Checkbox, Col, Form, notification, Popover, Radio, Row } from "antd";
+import { Button, Card, Checkbox, Col, Form, notification, Popover, Radio, Row, Tabs } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { UPDATE_KANBAN_SETTINGS } from "../../graphql/user.queries";
+import { DragDropContext, Draggable, Droppable } from "./trello-board/dnd/lib";
+import { defaultKanbanSettings, statisticsItems } from "./defaultKanbanSettings.js";
+
+const LayoutSettings = ({ t }) => (
+
+
+ {[
+ {
+ name: "orientation",
+ label: t("production.labels.orientation"),
+ options: [t("production.labels.vertical"), t("production.labels.horizontal")]
+ },
+ {
+ name: "cardSize",
+ label: t("production.labels.card_size"),
+ options: [t("production.options.small"), t("production.options.medium"), t("production.options.large")]
+ },
+ {
+ name: "compact",
+ label: t("production.labels.compact"),
+ options: [t("production.labels.tall"), t("production.labels.wide")]
+ },
+ {
+ name: "cardcolor",
+ label: t("production.labels.cardcolor"),
+ options: [t("production.labels.on"), t("production.labels.off")]
+ },
+ {
+ name: "kiosk",
+ label: t("production.labels.kiosk_mode"),
+ options: [t("production.labels.on"), t("production.labels.off")]
+ }
+ ].map(({ name, label, options }) => (
+
+
+
+ {options.map((option, idx) => (
+
+ {option}
+
+ ))}
+
+
+
+ ))}
+
+
+);
+
+const InformationSettings = ({ t }) => (
+
+
+ {[
+ "model_info",
+ "ownr_nm",
+ "clm_no",
+ "ins_co_nm",
+ "employeeassignments",
+ "actual_in",
+ "scheduled_completion",
+ "ats",
+ "production_note",
+ "sublets",
+ "partsstatus"
+ ].map((item) => (
+
+
+ {t(`production.labels.${item}`)}
+
+
+ ))}
+
+
+);
+
+const StatisticsSettings = ({ t, statisticsOrder, setStatisticsOrder, setHasChanges }) => {
+ const onDragEnd = (result) => {
+ if (!result.destination) return;
+ const newOrder = Array.from(statisticsOrder);
+ const [movedItem] = newOrder.splice(result.source.index, 1);
+ newOrder.splice(result.destination.index, 0, movedItem);
+ setStatisticsOrder(newOrder);
+ setHasChanges(true);
+ };
+
+ return (
+
+
+ {(provided) => (
+
+ {statisticsOrder.map((itemId, index) => {
+ const item = statisticsItems.find((stat) => stat.id === itemId);
+ return (
+
+ {(provided) => (
+
+
+
+ {t(`production.settings.statistics.${item.label}`)}
+
+
+
+ )}
+
+ );
+ })}
+ {provided.placeholder}
+
+ )}
+
+
+ );
+};
export default function ProductionBoardKanbanSettings({ associationSettings, parentLoading }) {
const [form] = Form.useForm();
const [open, setOpen] = useState(false);
const [loading, setLoading] = useState(false);
const [hasChanges, setHasChanges] = useState(false);
+ const [statisticsOrder, setStatisticsOrder] = useState(defaultKanbanSettings.statisticsOrder);
const [updateKbSettings] = useMutation(UPDATE_KANBAN_SETTINGS);
const { t } = useTranslation();
@@ -17,6 +134,9 @@ 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);
+ }
}
}, [form, associationSettings]);
@@ -27,7 +147,7 @@ export default function ProductionBoardKanbanSettings({ associationSettings, par
const result = await updateKbSettings({
variables: {
id: associationSettings?.id,
- ks: { ...values }
+ ks: { ...values, statisticsOrder }
}
});
@@ -48,103 +168,36 @@ export default function ProductionBoardKanbanSettings({ associationSettings, par
const handleValuesChange = () => setHasChanges(true);
- const cardStyle = { minWidth: "50vw", marginTop: 10 };
-
- const renderCheckboxItem = (name, labelKey) => (
-
-
- {t(labelKey)}
-
-
- );
-
- const renderCardSettings = () => (
- <>
-
-
-
-
-
- {t("production.labels.vertical")}
- {t("production.labels.horizontal")}
-
-
-
-
-
-
- {t("production.options.small")}
- {t("production.options.medium")}
- {t("production.options.large")}
-
-
-
-
-
-
- {t("production.labels.tall")}
- {t("production.labels.wide")}
-
-
-
-
-
-
- {t("production.labels.on")}
- {t("production.labels.off")}
-
-
-
-
-
-
- {t("production.labels.on")}
- {t("production.labels.off")}
-
-
-
-
-
-
-
- {[
- "model_info",
- "ownr_nm",
- "clm_no",
- "ins_co_nm",
- "employeeassignments",
- "actual_in",
- "scheduled_completion",
- "ats",
- "production_note",
- "sublets",
- "partsstatus"
- ].map((item) => renderCheckboxItem(item, `production.labels.${item}`))}
-
-
-
-
- {[
- { name: "totalHrs", label: "total_hours_in_production" },
- { name: "totalLAB", label: "total_lab_in_production" },
- { name: "totalLAR", label: "total_lar_in_production" },
- { name: "totalAmountInProduction", label: "total_amount_in_production" },
- { name: "jobsInProduction", label: "jobs_in_production" },
- { name: "totalHrsOnBoard", label: "total_hours_on_board" },
- { name: "totalLABOnBoard", label: "total_lab_on_board" },
- { name: "totalLAROnBoard", label: "total_lar_on_board" },
- { name: "jobsOnBoard", label: "total_jobs_on_board" },
- { name: "totalAmountOnBoard", label: "total_amount_on_board" }
- ].map((item) => renderCheckboxItem(item.name, `production.settings.statistics.${item.label}`))}
-
-
- >
- );
-
const overlay = (