IO-995 Update CSR to be a relationship.

client/src/components/job-employee-assignments/job-employee-assignments.component.jsx

@@ -23,7 +23,9 @@ export function JobEmployeeAssignments({
   jobRO,
   body,
   refinish,
+
   prep,
+  csr,
   handleAdd,
   handleRemove,
   loading,
@@ -155,6 +157,30 @@ export function JobEmployeeAssignments({
             />
           )}
         </DataLabel>
+        <DataLabel label={t("jobs.fields.employee_csr")}>
+          {csr ? (
+            <div>
+              <span>{`${csr.first_name || ""} ${csr.last_name || ""}`}</span>
+              <DeleteFilled
+                disabled={jobRO}
+                style={iconStyle}
+                operation="csr"
+                onClick={() => !jobRO && handleRemove("csr")}
+              />
+            </div>
+          ) : (
+            <PlusCircleFilled
+              disabled={jobRO}
+              style={iconStyle}
+              onClick={() => {
+                if (!jobRO) {
+                  setAssignment({ operation: "csr" });
+                  setVisibility(true);
+                }
+              }}
+            />
+          )}
+        </DataLabel>
       </Spin>
     </Popover>
   );

client/src/components/job-employee-assignments/job-employee-assignments.container.jsx

@@ -61,6 +61,7 @@ export default function JobEmployeeAssignmentsContainer({ job, refetch }) {
         body={job.employee_body_rel}
         refinish={job.employee_refinish_rel}
         prep={job.employee_prep_rel}
+        csr={job.employee_csr_rel}
         handleAdd={handleAdd}
         handleRemove={handleRemove}
         loading={loading}
@@ -75,6 +76,8 @@ const determineFieldName = (operation) => {
       return "employee_body";
     case "prep":
       return "employee_prep";
+    case "csr":
+      return "employee_csr";
     case "refinish":
       return "employee_refinish";
 

client/src/components/jobs-create-jobs-info/jobs-create-jobs-info.component.jsx

@@ -146,9 +146,6 @@ export function JobsCreateJobsInfo({ bodyshop, form, selected }) {
         </Collapse.Panel>
         <Collapse.Panel key="claim" header={t("menus.jobsdetail.claimdetail")}>
           <LayoutFormRow>
-            <Form.Item label={t("jobs.fields.csr")} name="csr">
-              <Input />
-            </Form.Item>
             <Form.Item label={t("jobs.fields.loss_desc")} name="loss_desc">
               <Input />
             </Form.Item>

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

@@ -207,10 +207,6 @@ export function JobsDetailGeneral({ bodyshop, jobRO, job, form }) {
         </Form.Item>
       </FormRow>
       <FormRow header={t("jobs.forms.other")}>
-        <Form.Item label={t("jobs.fields.csr")} name="csr">
-          <Input disabled={jobRO} />
-        </Form.Item>
-
         <Form.Item label={t("jobs.fields.category")} name="category">
           <Select disabled={jobRO}>
             {bodyshop.md_categories.map((s) => (

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

@@ -67,6 +67,11 @@ export default function ProductionBoardCard(technician, card) {
                     ? `${card.employee_refinish_rel.first_name} ${card.employee_refinish_rel.last_name}`
                     : ""
                 }`}</div>
+                <div>{`P: ${
+                  card.employee_csr_rel
+                    ? `${card.employee_csr_rel.first_name} ${card.employee_csr_rel.last_name}`
+                    : ""
+                }`}</div>
               </div>
             </div>
           </Col>

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

@@ -167,14 +167,7 @@ const r = ({ technician, state }) => {
       key: "special_coverage_policy",
       ellipsis: true,
     },
-    {
-      title: i18n.t("jobs.fields.csr"),
-      dataIndex: "csr",
-      key: "csr",
-      ellipsis: true,
-      sorter: (a, b) => alphaSort(a.csr, b.csr),
-      sortOrder: state.sortedInfo.columnKey === "csr" && state.sortedInfo.order,
-    },
+
     {
       title: i18n.t("jobs.fields.alt_transport"),
       dataIndex: "alt_transport",
@@ -317,6 +310,17 @@ const r = ({ technician, state }) => {
         />
       ),
     },
+    {
+      title: i18n.t("jobs.fields.employee_csr"),
+      dataIndex: "employee_csr",
+      key: "employee_csr",
+      render: (text, record) => (
+        <ProductionListEmployeeAssignment
+          record={record}
+          type="employee_csr_rel"
+        />
+      ),
+    },
     {
       title: i18n.t("jobs.fields.employee_refinish"),
       dataIndex: "employee_refinish",

client/src/components/production-list-columns/production-list-columns.empassignment.component.jsx

@@ -158,7 +158,8 @@ const determineFieldName = (operation) => {
       return "employee_prep";
     case "employee_refinish_rel":
       return "employee_refinish";
-
+    case "employee_csr_rel":
+      return "employee_csr";
     default:
       return null;
   }