diff --git a/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx b/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx index b4d4af3d7..c23626ac7 100644 --- a/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx +++ b/client/src/components/current-user-dropdown/current-user-dropdown.component.jsx @@ -1,6 +1,6 @@ import React from "react"; import { Link } from "react-router-dom"; -import { Dropdown, Menu, Icon, Avatar, Typography, Row, Col } from "antd"; +import { Dropdown, Menu, Icon, Avatar, Row, Col } from "antd"; import { useTranslation } from "react-i18next"; import i18next from "i18next"; import { useQuery } from "@apollo/react-hooks"; @@ -22,25 +22,24 @@ export default function CurrentUserDropdown() { } }; const menu = ( - + - {t("menus.currentuser.profile")} + {t("menus.currentuser.profile")} - + {t("menus.currentuser.languageselector")} - } - > - + }> + {t("general.languages.english")} - + {t("general.languages.french")} - + {t("general.languages.spanish")} @@ -56,10 +55,10 @@ export default function CurrentUserDropdown() { - + - + {currentUser?.displayName ?? t("general.labels.unknown")} diff --git a/client/src/components/job-detail-cards/job-detail-cards.component.jsx b/client/src/components/job-detail-cards/job-detail-cards.component.jsx new file mode 100644 index 000000000..ee5b0e551 --- /dev/null +++ b/client/src/components/job-detail-cards/job-detail-cards.component.jsx @@ -0,0 +1,16 @@ +import React from "react"; +import JobDetailCardsCustomerContainer from "./job-detail-cards.customer.container"; +import { useTranslation } from "react-i18next"; + +export default function JobDetailCards({ selectedJob }) { + const { t } = useTranslation(); + + if (!selectedJob) { + return
{t("jobs.errors.nojobselected")}
; + } + return ( +
+ +
+ ); +} diff --git a/client/src/components/job-detail-cards/job-detail-cards.customer.component.jsx b/client/src/components/job-detail-cards/job-detail-cards.customer.component.jsx new file mode 100644 index 000000000..8b12d2955 --- /dev/null +++ b/client/src/components/job-detail-cards/job-detail-cards.customer.component.jsx @@ -0,0 +1,8 @@ +import React from "react"; +import { useTranslation } from "react-i18next"; +import { Card } from "antd"; +export default function JobDetailCardsCustomerComponent({ loading, data }) { + const { t } = useTranslation(); + + return Card has loaded.; +} diff --git a/client/src/components/job-detail-cards/job-detail-cards.customer.container.jsx b/client/src/components/job-detail-cards/job-detail-cards.customer.container.jsx new file mode 100644 index 000000000..747eb6bc3 --- /dev/null +++ b/client/src/components/job-detail-cards/job-detail-cards.customer.container.jsx @@ -0,0 +1,15 @@ +import React from "react"; +import JobDetailCardsCustomerComponent from "./job-detail-cards.customer.component"; +import { useQuery } from "@apollo/react-hooks"; +import AlertComponent from "../alert/alert.component"; +import { QUERY_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries"; + +export default function JobDetailCardsCustomerContainer({ selectedJob }) { + const { loading, error, data } = useQuery(QUERY_JOBS_IN_PRODUCTION, { + fetchPolicy: "network-only" + }); + + if (error) return ; + + return ; +} diff --git a/client/src/components/jobs-list/jobs-list.component.jsx b/client/src/components/jobs-list/jobs-list.component.jsx index c6220b4a2..95fb0153a 100644 --- a/client/src/components/jobs-list/jobs-list.component.jsx +++ b/client/src/components/jobs-list/jobs-list.component.jsx @@ -4,37 +4,43 @@ import { Table, Icon, Input, Dropdown, Menu } from "antd"; import { alphaSort } from "../../utils/sorters"; import { useTranslation } from "react-i18next"; -export default function JobsPage({ loading, jobs }) { +export default function JobsPage({ + loading, + jobs, + selectedJob, + setSelectedJob +}) { const [state, setState] = useState({ sortedInfo: {}, filteredInfo: { text: "" } }); + const { t } = useTranslation(); const actionMenu = ( - - + + {t("jobs.actions.viewJobImages")} - - + + {t("jobs.actions.printCenter")} - - + + {t("jobs.actions.notes")} - - + + {t("jobs.actions.postInvoices")} - - + + {t("jobs.actions.receiveParts")} - - + + {t("jobs.actions.partStatus")} @@ -108,7 +114,7 @@ export default function JobsPage({ loading, jobs }) { key: "action", render: (text, record) => ( - + ) } @@ -123,16 +129,37 @@ export default function JobsPage({ loading, jobs }) { setState({ ...state, filterinfo: { text: [value] } }); }; + const handleOnRowClick = record => { + if (record) { + if (record.id) { + setSelectedJob(record.id); + return; + } + } + setSelectedJob(null); + }; + return (
- + ({ ...item }))} - rowKey="id" + rowKey='id' dataSource={jobs} onChange={handleTableChange} + onRow={(record, rowIndex) => { + return { + onClick: event => { + handleOnRowClick(record); + }, // click row + onDoubleClick: event => {}, // double click row + onContextMenu: event => {}, // right button click row + onMouseEnter: event => {}, // mouse enter row + onMouseLeave: event => {} // mouse leave row + }; + }} /> ); diff --git a/client/src/graphql/jobs.queries.js b/client/src/graphql/jobs.queries.js index dece3f259..284568a6a 100644 --- a/client/src/graphql/jobs.queries.js +++ b/client/src/graphql/jobs.queries.js @@ -60,7 +60,6 @@ export const QUERY_JOBS_IN_PRODUCTION = gql` updated_at est_number ro_number - status scheduled_completion scheduled_delivery vehicle { diff --git a/client/src/pages/jobs/jobs.page.jsx b/client/src/pages/jobs/jobs.page.jsx index 73d29d521..588bffd8f 100644 --- a/client/src/pages/jobs/jobs.page.jsx +++ b/client/src/pages/jobs/jobs.page.jsx @@ -1,11 +1,13 @@ -import React, { useEffect } from "react"; +import React, { useEffect, useState } from "react"; import { useSubscription } from "@apollo/react-hooks"; import AlertComponent from "../../components/alert/alert.component"; import { Col } from "antd"; import { SUBSCRIPTION_ALL_OPEN_JOBS } from "../../graphql/jobs.queries"; import { useTranslation } from "react-i18next"; import JobsList from "../../components/jobs-list/jobs-list.component"; +import JobDetailCards from "../../components/job-detail-cards/job-detail-cards.component"; +//TODO: Implement pagination for this. export default function JobsPage() { const { loading, error, data } = useSubscription(SUBSCRIPTION_ALL_OPEN_JOBS, { fetchPolicy: "network-only" @@ -16,11 +18,19 @@ export default function JobsPage() { document.title = t("titles.jobs"); }, [t]); - if (error) return ; + const [selectedJob, setSelectedJob] = useState(null); + if (error) return ; + console.log(selectedJob); return ( - + + ); } diff --git a/client/src/pages/profile/profile.page.jsx b/client/src/pages/profile/profile.page.jsx index 0f8d1d243..29f3b7410 100644 --- a/client/src/pages/profile/profile.page.jsx +++ b/client/src/pages/profile/profile.page.jsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; -import { Layout, Menu, Icon } from "antd"; +import { Layout } from "antd"; import ProfileSideBar from "../../components/profile-sidebar/profile-sidebar.component"; import ProfileContent from "../../components/profile-content/profile-content.component"; diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json index 19d33ed55..a659d499f 100644 --- a/client/src/translations/en_us/common.json +++ b/client/src/translations/en_us/common.json @@ -57,7 +57,8 @@ "noaccess": "This job does not exist or you do not have access to it.", "validationtitle": "Validation Error", "validation": "Please ensure all fields are entered correctly.", - "saving": "Error encountered while saving record." + "saving": "Error encountered while saving record.", + "nojobselected": "No job is selected." }, "actions": { "viewJobImages": "View Job Images", @@ -69,7 +70,5 @@ "card": {} } } - - } }