Added view intake and deliver checklists. IO-241

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

@@ -30,6 +30,7 @@ export function JobChecklistForm({
   currentUser,
   type,
   job,
+  readOnly = false,
 }) {
   const { t } = useTranslation();
   const [intakeJob] = useMutation(UPDATE_JOB);
@@ -63,6 +64,12 @@ export function JobChecklistForm({
           [(type === "intake" && "intakechecklist") ||
           (type === "deliver" && "deliverchecklist")]: {
             ...values,
+            formItems: formItems.map((fi) => {
+              return {
+                ...fi,
+                value: values[fi.name],
+              };
+            }),
             completed_by: currentUser.email,
             completed_at: new Date(),
           },
@@ -118,11 +125,17 @@ export function JobChecklistForm({
           removeFromProduction: true,
           actual_completion: job && job.actual_completion,
         }),
+        ...formItems
+          .filter((fi) => fi.value)
+          .reduce((acc, fi) => {
+            acc[fi.name] = fi.value;
+            return acc;
+          }, {}),
       }}
     >
       {t("checklist.labels.checklist")}
 
-      <ConfigFormComponents componentList={formItems} />
+      <ConfigFormComponents componentList={formItems} readOnly={readOnly} />
 
       {type === "intake" && (
         <div>
@@ -130,12 +143,14 @@ export function JobChecklistForm({
             name="addToProduction"
             valuePropName="checked"
             label={t("checklist.labels.addtoproduction")}
+            disabled={readOnly}
           >
             <Switch />
           </Form.Item>
           <Form.Item
             name="scheduled_completion"
             label={t("jobs.fields.scheduled_completion")}
+            disabled={readOnly}
             rules={[
               {
                 required: true,
@@ -148,6 +163,7 @@ export function JobChecklistForm({
           <Form.Item
             name="scheduled_delivery"
             label={t("jobs.fields.scheduled_delivery")}
+            disabled={readOnly}
           >
             <DateTimePicker />
           </Form.Item>
@@ -158,6 +174,7 @@ export function JobChecklistForm({
           <Form.Item
             name="actual_completion"
             label={t("jobs.fields.actual_completion")}
+            disabled={readOnly}
             rules={[
               {
                 required: true,
@@ -171,15 +188,17 @@ export function JobChecklistForm({
             name="removeFromProduction"
             valuePropName="checked"
             label={t("checklist.labels.removefromproduction")}
+            disabled={readOnly}
           >
             <Switch defaultChecked={true} />
           </Form.Item>
         </div>
       )}
-
-      <Button loading={loading} htmlType="submit">
-        {t("general.actions.submit")}
-      </Button>
+      {!readOnly && (
+        <Button loading={loading} htmlType="submit">
+          {t("general.actions.submit")}
+        </Button>
+      )}
     </Form>
   );
 }