Added order parts link to job drawer BOD-210

client/src/components/job-detail-cards/job-detail-cards.component.jsx

@@ -1,6 +1,6 @@
 import { PrinterFilled } from "@ant-design/icons";
 import { useQuery } from "@apollo/react-hooks";
-import { Button, Col, Drawer, Grid, PageHeader, Row, Tag } from "antd";
+import { Button, Col, Drawer, Grid, PageHeader, Row, Tag, Space } from "antd";
 import queryString from "query-string";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -75,20 +75,22 @@ export function JobDetailCards({ setPrintCenterContext }) {
       visible={!!selected}
       destroyOnClose
       width={drawerPercentage}
-      placement='right'
-      onClose={handleDrawerClose}>
+      placement="right"
+      onClose={handleDrawerClose}
+    >
       {loading ? <LoadingSpinner /> : null}
-      {error ? <AlertComponent message={error.message} type='error' /> : null}
+      {error ? <AlertComponent message={error.message} type="error" /> : null}
       {data ? (
         <PageHeader
           ghost={true}
           tags={[
-            <OwnerTagPopoverComponent key='owner' job={data.jobs_by_pk} />,
-            <VehicleTagPopoverComponent key='vehicle' job={data.jobs_by_pk} />,
+            <OwnerTagPopoverComponent key="owner" job={data.jobs_by_pk} />,
+            <VehicleTagPopoverComponent key="vehicle" job={data.jobs_by_pk} />,
             <Tag
-              color='#f50'
-              key='production'
-              style={{ display: data.jobs_by_pk.inproduction ? "" : "none" }}>
+              color="#f50"
+              key="production"
+              style={{ display: data.jobs_by_pk.inproduction ? "" : "none" }}
+            >
               {t("jobs.labels.inproduction")}
             </Tag>,
           ]}
@@ -103,20 +105,27 @@ export function JobDetailCards({ setPrintCenterContext }) {
           }
           subTitle={data.jobs_by_pk.status}
           extra={
-            <Button
-              onClick={() => {
-                setPrintCenterContext({
-                  actions: { refetch: refetch },
-                  context: {
-                    id: data.jobs_by_pk.id,
-                    type: "job",
-                  },
-                });
-              }}>
-              <PrinterFilled />
-              {t("jobs.actions.printCenter")}
-            </Button>
-          }>
+            <Space>
+              <Button
+                onClick={() => {
+                  setPrintCenterContext({
+                    actions: { refetch: refetch },
+                    context: {
+                      id: data.jobs_by_pk.id,
+                      type: "job",
+                    },
+                  });
+                }}
+              >
+                <PrinterFilled />
+                {t("jobs.actions.printCenter")}
+              </Button>
+              <Link to={`/manage/jobs/${data.jobs_by_pk.id}?tab=repairdata`}>
+                <Button>{t("parts.actions.order")}</Button>
+              </Link>
+            </Space>
+          }
+        >
           <Row gutter={[16, 16]}>
             <Col {...colBreakPoints}>
               <JobDetailCardsInsuranceComponent

client/src/components/time-tickets-summary-employees/time-tickets-summary-employees.component.jsx

@@ -10,6 +10,7 @@ import { TemplateList } from "../../utils/TemplateConstants";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { onlyUnique } from "../../utils/arrayHelper";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -85,9 +86,16 @@ export function TimeTicketsSummaryEmployees({
             {t("timetickets.labels.jobhours")}
           </Typography.Title>
         }
-        itemLayout='horizontal'
-        dataSource={jobTickets}
-        renderItem={(item) => {
+        itemLayout="horizontal"
+        //dataSource={jobTickets}
+      >
+        {jobTickets.map((item, idx) => {
+          const costCenters = item.tickets
+            .map((i) => i.cost_center)
+            .filter(onlyUnique);
+
+          console.log("costCenters", costCenters);
+
           const actHrs = item.tickets.reduce(
             (acc, val) => acc + val.actualhrs,
             0
@@ -109,15 +117,19 @@ export function TimeTicketsSummaryEmployees({
 
           return (
             <List.Item
+              key={idx}
               actions={[
                 <Button
-                  onClick={() => handlePrintEmployeeTicket(item.employee.id)}>
+                  onClick={() => handlePrintEmployeeTicket(item.employee.id)}
+                >
                   {t("timetickets.actions.printemployee")}
                 </Button>,
-              ]}>
+              ]}
+            >
               <LoadingSkeleton loading={loading}>
                 <List.Item.Meta
                   title={`${item.employee.first_name} ${item.employee.last_name}`}
+                  description="cost center?"
                 />
                 <Space>
                   <Statistic
@@ -145,15 +157,15 @@ export function TimeTicketsSummaryEmployees({
               </LoadingSkeleton>
             </List.Item>
           );
-        }}
-      />
+        })}
+      </List>
       <List
         header={
           <Typography.Title level={3}>
             {t("timetickets.labels.clockhours")}
           </Typography.Title>
         }
-        itemLayout='horizontal'
+        itemLayout="horizontal"
         dataSource={shiftTickets}
         renderItem={(item) => {
           const clockHrs = item.tickets.reduce((acc, val) => {
@@ -169,10 +181,12 @@ export function TimeTicketsSummaryEmployees({
             <List.Item
               actions={[
                 <Button
-                  onClick={() => handlePrintEmployeeTicket(item.employee.id)}>
+                  onClick={() => handlePrintEmployeeTicket(item.employee.id)}
+                >
                   {t("timetickets.actions.printemployee")}
                 </Button>,
-              ]}>
+              ]}
+            >
               <LoadingSkeleton loading={loading}>
                 <List.Item.Meta
                   title={`${item.employee.first_name} ${item.employee.last_name}`}