Set default dinero currencies. Created checklist display skeleton component. BOD-377

bodyshop_translations.babel

@@ -15444,6 +15444,27 @@
                                             </concept_node>
                                         </children>
                                     </folder_node>
+                                    <concept_node>
+                                        <name>checklists</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>cost</name>
                                         <definition_loaded>false</definition_loaded>

client/src/components/job-checklist/components/job-checklist-form/job-checklist-form.component.jsx

@@ -8,19 +8,23 @@ import { useHistory, useLocation, useParams } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import { MARK_LATEST_APPOINTMENT_AS_ARRIVED } from "../../../../graphql/appointments.queries";
 import { UPDATE_JOB } from "../../../../graphql/jobs.queries";
-import { selectBodyshop } from "../../../../redux/user/user.selectors";
+import {
+  selectBodyshop,
+  selectCurrentUser,
+} from "../../../../redux/user/user.selectors";
 import DateTimePicker from "../../../form-date-time-picker/form-date-time-picker.component";
 import ConfigFormComponents from "../../../config-form-components/config-form-components.component";
 import { logImEXEvent } from "../../../../firebase/firebase.utils";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
+  currentUser: selectCurrentUser,
 });
 const mapDispatchToProps = (dispatch) => ({
   //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 
-export function JobChecklistForm({ formItems, bodyshop, type }) {
+export function JobChecklistForm({ formItems, bodyshop, currentUser, type }) {
   const { t } = useTranslation();
   const [intakeJob] = useMutation(UPDATE_JOB);
   const [loading, setLoading] = useState(false);
@@ -48,7 +52,11 @@ export function JobChecklistForm({ formItems, bodyshop, type }) {
           }),
 
           [(type === "intake" && "intakechecklist") ||
-          (type === "deliver" && "deliverchecklist")]: values,
+          (type === "deliver" && "deliverchecklist")]: {
+            ...values,
+            completed_by: currentUser.email,
+            completed_at: new Date(),
+          },
 
           ...(type === "deliver" && {
             scheduled_delivery: values.scheduledDelivery,

client/src/components/job-checklist/job-checklist-display.component.jsx

@@ -0,0 +1,12 @@
+import React from "react";
+import ConfigFormComponents from "../config-form-components/config-form-components.component";
+
+export default function JobChecklistDisplay({ checklist }) {
+  console.log("JobChecklistDisplay -> checklist", checklist);
+  if (!checklist) return <div></div>;
+  return (
+    <div>
+      <ConfigFormComponents readOnly componentList={checklist} />
+    </div>
+  );
+}

client/src/components/jobs-detail-checklists/jobs-detail-checklists.component.jsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { Row, Col } from "antd";
+import JobChecklistDisplay from "../job-checklist/job-checklist-display.component";
+
+const colSpan = { sm: { span: 24 }, md: { span: 12 } };
+export default function JobsDetailChecklists({ job }) {
+  return (
+    <div>
+      <Row gutter={[16, 16]}>
+        <Col {...colSpan}>
+          <JobChecklistDisplay checklist={job.intakechecklist} />
+        </Col>
+        <Col {...colSpan}>
+          {" "}
+          <JobChecklistDisplay checklist={job.deliverchecklist} />
+        </Col>
+      </Row>
+    </div>
+  );
+}

client/src/index.js

@@ -10,9 +10,13 @@ import AppContainer from "./App/App.container";
 import "./index.css";
 import LoadingSpinner from "./components/loading-spinner/loading-spinner.component";
 import "./App/registerServiceWorker.component";
+import Dinero from "dinero.js";
 
 require("dotenv").config();
 
+Dinero.defaultCurrency = "CAD";
+Dinero.globalLocale = "en-CA";
+
 ReactDOM.render(
   <Provider store={store}>
     <BrowserRouter>

client/src/pages/jobs-detail/jobs-detail.page.component.jsx

@@ -4,6 +4,7 @@ import Icon, {
   DollarCircleOutlined,
   FileImageFilled,
   ToolFilled,
+  CheckSquareFilled,
 } from "@ant-design/icons";
 import { Form, notification, Tabs } from "antd";
 import Axios from "axios";
@@ -24,6 +25,7 @@ import { createStructuredSelector } from "reselect";
 import FormFieldsChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import JobsDetailChecklists from "../../components/jobs-detail-checklists/jobs-detail-checklists.component";
 
 const JobsLinesContainer = lazy(() =>
   import("../../components/job-detail-lines/job-lines.container")
@@ -275,6 +277,17 @@ export function JobsDetailPage({
           >
             <JobsDetailAuditContainer recordId={job.id} />
           </Tabs.TabPane>
+          <Tabs.TabPane
+            tab={
+              <span>
+                <CheckSquareFilled />
+                {t("jobs.labels.checklists")}
+              </span>
+            }
+            key="checklists"
+          >
+            <JobsDetailChecklists job={job} />
+          </Tabs.TabPane>
         </Tabs>
       </Form>
     </Suspense>

client/src/translations/en_us/common.json

@@ -953,6 +953,7 @@
 					"totals": "Totals",
 					"vehicle": "Vehicle"
 				},
+				"checklists": "Checklists",
 				"cost": "Cost",
 				"cost_labor": "Cost - Labor",
 				"cost_parts": "Cost - Parts",

client/src/translations/es/common.json

@@ -953,6 +953,7 @@
 					"totals": "Totales",
 					"vehicle": "Vehículo"
 				},
+				"checklists": "",
 				"cost": "",
 				"cost_labor": "",
 				"cost_parts": "",

client/src/translations/fr/common.json

@@ -953,6 +953,7 @@
 					"totals": "Totaux",
 					"vehicle": "Véhicule"
 				},
+				"checklists": "",
 				"cost": "",
 				"cost_labor": "",
 				"cost_parts": "",

server/job/job-totals.js

@@ -1,5 +1,8 @@
 const Dinero = require("dinero.js");
 
+Dinero.defaultCurrency = "CAD";
+Dinero.globalLocale = "en-CA";
+
 exports.default = async function (req, res) {
   const { job, shoprates } = req.body;
   console.log(`Calculating Job Totals for ${job.id} - ${job.ro_number}`);