IO-1830 Add Parts Status to Production Boards.

client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx

@@ -12,8 +12,8 @@ const mapDispatchToProps = (dispatch) => ({
 export default connect(mapStateToProps, mapDispatchToProps)(JobPartsQueueCount);
 
 export function JobPartsQueueCount({ bodyshop, parts }) {
-  console.log(parts);
   const partsStatus = useMemo(() => {
+    if (!parts) return null;
     return parts.reduce(
       (acc, val) => {
         acc.total = acc.total + val.count;
@@ -23,6 +23,7 @@ export function JobPartsQueueCount({ bodyshop, parts }) {
       },
       {
         total: 0,
+        null: 0,
         [bodyshop.md_order_statuses.default_bo]: 0,
         [bodyshop.md_order_statuses.default_ordered]: 0,
         [bodyshop.md_order_statuses.default_received]: 0,
@@ -31,33 +32,35 @@ export function JobPartsQueueCount({ bodyshop, parts }) {
     );
   }, [bodyshop, parts]);
 
-  console.log(
-    "🚀  ~ file: job-parts-queue-count.component.jsx  ~ line 8  ~ partsStatus",
-    partsStatus
-  );
+  if (!parts) return null;
 
   return (
     <Row>
-      <Col span={5}>
+      <Col span={4}>
         <Tooltip title="Total">
           <Tag>{partsStatus.total}</Tag>
         </Tooltip>
       </Col>
-      <Col span={5}>
+      <Col span={4}>
+        <Tooltip title="No Status">
+          <Tag color="gold">{partsStatus["null"]}</Tag>
+        </Tooltip>
+      </Col>
+      <Col span={4}>
         <Tooltip title={bodyshop.md_order_statuses.default_ordered}>
           <Tag color="blue">
             {partsStatus[bodyshop.md_order_statuses.default_ordered]}
           </Tag>
         </Tooltip>
       </Col>
-      <Col span={5}>
+      <Col span={4}>
         <Tooltip title={bodyshop.md_order_statuses.default_received}>
           <Tag color="green">
             {partsStatus[bodyshop.md_order_statuses.default_received]}
           </Tag>
         </Tooltip>
       </Col>
-      <Col span={5}>
+      <Col span={4}>
         <Tooltip title={bodyshop.md_order_statuses.default_returned}>
           <Tag color="orange">
             {partsStatus[bodyshop.md_order_statuses.default_returned]}

client/src/components/production-board-kanban-card/production-board-kanban-card.component.jsx

@@ -1,6 +1,7 @@
 import {
   CalendarOutlined,
   EyeFilled,
+  DownloadOutlined,
   PauseCircleOutlined,
 } from "@ant-design/icons";
 import { Card, Col, Row, Space } from "antd";
@@ -14,6 +15,7 @@ import ProductionSubletsManageComponent from "../production-sublets-manage/produ
 import "./production-board-card.styles.scss";
 import moment from "moment";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
 
 export default function ProductionBoardCard(
   technician,
@@ -157,6 +159,16 @@ export default function ProductionBoardCard(
             </Row>
           </Col>
         )} */}
+        {cardSettings && cardSettings.actual_in && card.actual_in && (
+          <Col span={cardSettings && cardSettings.compact ? 24 : 12}>
+            <Space>
+              <DownloadOutlined />
+              <DateTimeFormatter format="MM/DD">
+                {card.actual_in}
+              </DateTimeFormatter>
+            </Space>
+          </Col>
+        )}
         {cardSettings &&
           cardSettings.scheduled_completion &&
           card.scheduled_completion && (
@@ -188,6 +200,11 @@ export default function ProductionBoardCard(
             )}
           </Col>
         )}
+        {cardSettings && cardSettings.partsstatus && (
+          <Col span={24}>
+            <JobPartsQueueCount parts={card.joblines_status} />
+          </Col>
+        )}
       </Row>
     </Card>
   );

client/src/components/production-board-kanban/production-board-kanban.card-settings.component.jsx

@@ -97,6 +97,13 @@ export default function ProductionBoardKanbanCardSettings({
               >
                 <Switch />
               </Form.Item>
+              <Form.Item
+                valuePropName="checked"
+                label={t("production.labels.actual_in")}
+                name="actual_in"
+              >
+                <Switch />
+              </Form.Item>
             </Col>
             <Col span={12}>
               <Form.Item
@@ -131,6 +138,13 @@ export default function ProductionBoardKanbanCardSettings({
               >
                 <Switch />
               </Form.Item>
+              <Form.Item
+                valuePropName="checked"
+                label={t("production.labels.partsstatus")}
+                name="partsstatus"
+              >
+                <Switch />
+              </Form.Item>
               <Form.Item
                 valuePropName="checked"
                 label={t("production.labels.stickyheader")}

client/src/components/production-list-columns/production-list-columns.data.js

@@ -23,6 +23,7 @@ import ProductionlistColumnTouchTime from "./prodution-list-columns.touchtime.co
 import ProductionListColumnComment from "./production-list-columns.comment.component";
 import ProductionListColumnPartsReceived from "./production-list-columns.partsreceived.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
 
 const r = ({ technician, state, activeStatuses, bodyshop }) => {
   return [
@@ -490,6 +491,14 @@ const r = ({ technician, state, activeStatuses, bodyshop }) => {
         <ProductionListColumnPartsReceived record={record} />
       ),
     },
+    {
+      title: i18n.t("jobs.fields.partsstatus"),
+      dataIndex: "partsstatus",
+      key: "partsstatus",
+      render: (text, record) => (
+        <JobPartsQueueCount parts={record.joblines_status} record={record} />
+      ),
+    },
   ];
 };
 export default r;