IO-2371 Closing Period

client/src/components/shop-info/shop-info.container.jsx

@@ -1,14 +1,14 @@
-import React, { useEffect, useState } from "react";
-import ShopInfoComponent from "./shop-info.component";
+import { useMutation, useQuery } from "@apollo/client";
 import { Form, notification } from "antd";
-import { useQuery, useMutation } from "@apollo/client";
-import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries";
-import LoadingSpinner from "../loading-spinner/loading-spinner.component";
-import AlertComponent from "../alert/alert.component";
+import moment from "moment";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { logImEXEvent } from "../../firebase/firebase.utils";
+import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries";
+import AlertComponent from "../alert/alert.component";
 import FormsFieldChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
-import moment from "moment";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import ShopInfoComponent from "./shop-info.component";
 export default function ShopInfoContainer() {
   const [form] = Form.useForm();
   const { t } = useTranslation();
@@ -52,13 +52,28 @@ export default function ShopInfoContainer() {
       onFinish={handleFinish}
       initialValues={
         data
-          ? {
-              ...data.bodyshops[0],
-              schedule_start_time: moment(
-                data.bodyshops[0].schedule_start_time
-              ),
-              schedule_end_time: moment(data.bodyshops[0].schedule_end_time),
-            }
+          ? data.bodyshops[0].accountingconfig.ClosingPeriod
+            ? {
+                ...data.bodyshops[0],
+                accountingconfig: {
+                  ...data.bodyshops[0].accountingconfig,
+                  ClosingPeriod: [
+                    moment(data.bodyshops[0].accountingconfig.ClosingPeriod[0]),
+                    moment(data.bodyshops[0].accountingconfig.ClosingPeriod[1]),
+                  ],
+                },
+                schedule_start_time: moment(
+                  data.bodyshops[0].schedule_start_time
+                ),
+                schedule_end_time: moment(data.bodyshops[0].schedule_end_time),
+              }
+            : {
+                ...data.bodyshops[0],
+                schedule_start_time: moment(
+                  data.bodyshops[0].schedule_start_time
+                ),
+                schedule_end_time: moment(data.bodyshops[0].schedule_end_time),
+              }
           : null
       }
     >

client/src/components/shop-info/shop-info.general.component.jsx

@@ -1,6 +1,8 @@
 import { DeleteFilled } from "@ant-design/icons";
+import { useTreatments } from "@splitsoftware/splitio-react";
 import {
   Button,
+  DatePicker,
   Form,
   Input,
   InputNumber,
@@ -9,8 +11,13 @@ import {
   Space,
   Switch,
 } from "antd";
+import momentTZ from "moment-timezone";
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import DatePickerRanges from "../../utils/DatePickerRanges";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
 import PhoneFormItem, {
@@ -18,12 +25,22 @@ import PhoneFormItem, {
 } from "../form-items-formatted/phone-form-item.component";
 import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-
-import momentTZ from "moment-timezone";
 const timeZonesList = momentTZ.tz.names();
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoGeneral);
 
-export default function ShopInfoGeneral({ form }) {
+export function ShopInfoGeneral({ form, bodyshop }) {
   const { t } = useTranslation();
+  const { ClosingPeriod } = useTreatments(
+    ["ClosingPeriod"],
+    {},
+    bodyshop && bodyshop.imexshopid
+  );
 
   return (
     <div>
@@ -392,6 +409,20 @@ export default function ShopInfoGeneral({ form }) {
         >
           <Select mode="tags" />
         </Form.Item>
+        {ClosingPeriod.treatment === "on" && (
+          <>
+            <Form.Item
+              allowClear
+              name={["accountingconfig", "ClosingPeriod"]}
+              label={t("bodyshop.fields.closingperiod")} //{t("reportcenter.labels.dates")}
+            >
+              <DatePicker.RangePicker
+                format="MM/DD/YYYY"
+                ranges={DatePickerRanges}
+              />
+            </Form.Item>
+          </>
+        )}
       </LayoutFormRow>
       <LayoutFormRow
         header={t("bodyshop.labels.scoreboardsetup")}
@@ -604,7 +635,9 @@ export default function ShopInfoGeneral({ form }) {
         </Form.Item>
         <Form.Item
           name={["md_email_cc", "parts_return_slip"]}
-          label={t("bodyshop.fields.md_email_cc", { template: "parts_return_slip" })}
+          label={t("bodyshop.fields.md_email_cc", {
+            template: "parts_return_slip",
+          })}
           rules={[
             {
               //message: t("general.validation.required"),