Added colors to appointments BOD-393

client/src/components/schedule-job-modal/schedule-job-modal.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Col, Form, Row, Switch } from "antd";
+import { Button, Col, Form, Row, Select, Switch } from "antd";
 import axios from "axios";
 import moment from "moment";
 import React, { useState } from "react";
@@ -120,6 +120,20 @@ export function ScheduleJobModalComponent({
           <Form.Item name={"email"} label={t("jobs.fields.ownr_ea")}>
             <EmailInput />
           </Form.Item>
+          <Form.Item name={"color"} label={t("appointments.fields.color")}>
+            <Select>
+              {bodyshop.appt_colors &&
+                bodyshop.appt_colors.map((color) => (
+                  <Select.Option
+                    style={{ color: color.color.hex }}
+                    key={color.color.hex}
+                    value={color.color.hex}
+                  >
+                    {color.label}
+                  </Select.Option>
+                ))}
+            </Select>
+          </Form.Item>
         </LayoutFormRow>
         {t("appointments.labels.history")}
         <ScheduleExistingAppointmentsList

client/src/components/schedule-job-modal/schedule-job-modal.container.jsx

@@ -92,6 +92,7 @@ export function ScheduleJobModalContainer({
           bodyshopid: bodyshop.id,
           start: moment(values.start),
           end: moment(values.start).add(bodyshop.appt_length || 60, "minutes"),
+          color: values.color,
         },
       },
     });