diff --git a/bodyshop_translations.babel b/bodyshop_translations.babel index baeccc730..8a260b62a 100644 --- a/bodyshop_translations.babel +++ b/bodyshop_translations.babel @@ -1981,6 +1981,27 @@ errors + + saving + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + selectjobandcar false @@ -2550,7 +2571,7 @@ courtesycars - erorrs + errors saving @@ -3001,7 +3022,206 @@ - statuses + labels + + + fuel + + + 12 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 14 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 18 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 34 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 38 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 58 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + 78 + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + empty + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + full + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + + + + + status in @@ -3713,6 +3933,27 @@ actions + + create + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + delete false @@ -10190,6 +10431,27 @@ + + contracts-detail + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + courtesycars-create false diff --git a/client/src/components/contract-cars/contract-cars.component.jsx b/client/src/components/contract-cars/contract-cars.component.jsx index 75cec3ab9..7b4d01041 100644 --- a/client/src/components/contract-cars/contract-cars.component.jsx +++ b/client/src/components/contract-cars/contract-cars.component.jsx @@ -92,7 +92,7 @@ export default function ContractsCarsComponent({ .includes(state.search.toLowerCase()) || (cc.plate || "").toLowerCase().includes(state.search.toLowerCase()) ); - console.log("filteredData", filteredData); + return ( { - const [option, setOption] = useState("contracts.status.new"); +const ContractStatusComponent = ({ + value = "contracts.status.new", + onChange +}) => { + const [option, setOption] = useState(value); const { t } = useTranslation(); - const onChangeSelect = newOption => { - setOption(newOption); + useEffect(() => { if (onChange) { - onChange(newOption); + onChange(option); } - }; + }, [option, onChange]); return ( + - + { + const [option, setOption] = useState(value); + const { t } = useTranslation(); + + useEffect(() => { + if (onChange) { + onChange(option); + } + }, [option, onChange]); + + const marks = { + 0: { + style: { + color: "#f50" + }, + label: t("courtesycars.labels.fuel.empty") + }, + 13: t("courtesycars.labels.fuel.18"), + 25: t("courtesycars.labels.fuel.14"), + 38: t("courtesycars.labels.fuel.38"), + 50: t("courtesycars.labels.fuel.12"), + 63: t("courtesycars.labels.fuel.58"), + 75: t("courtesycars.labels.fuel.34"), + 88: t("courtesycars.labels.fuel.78"), + 100: { + style: { + color: "#008000" + }, + label: {t("courtesycars.labels.fuel.full")} + } + }; + + return ( + + ); +}; +export default CourtesyCarFuelComponent; diff --git a/client/src/components/courtesy-car-status-select/courtesy-car-status-select.component.jsx b/client/src/components/courtesy-car-status-select/courtesy-car-status-select.component.jsx new file mode 100644 index 000000000..b60ca64cc --- /dev/null +++ b/client/src/components/courtesy-car-status-select/courtesy-car-status-select.component.jsx @@ -0,0 +1,39 @@ +import React, { useState, useEffect } from "react"; +import { Select } from "antd"; +import { useTranslation } from "react-i18next"; +const { Option } = Select; + +const CourtesyCarStatusComponent = ({ + value = "courtesycars.status.in", + onChange +}) => { + const [option, setOption] = useState(value); + const { t } = useTranslation(); + + useEffect(() => { + if (onChange) { + onChange(option); + } + }, [option, onChange]); + + return ( + + ); +}; +export default CourtesyCarStatusComponent; diff --git a/client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx b/client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx index bf7e57dff..9d31150d4 100644 --- a/client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx +++ b/client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx @@ -9,7 +9,6 @@ export default function JobsList({ loading, courtesycars }) { sortedInfo: {}, filteredInfo: { text: "" } }); - console.log("courtesycars", courtesycars); const { t } = useTranslation(); @@ -38,7 +37,8 @@ export default function JobsList({ loading, courtesycars }) { key: "status", sorter: (a, b) => alphaSort(a.status, b.status), sortOrder: - state.sortedInfo.columnKey === "status" && state.sortedInfo.order + state.sortedInfo.columnKey === "status" && state.sortedInfo.order, + render: (text, record) => t(record.status) }, { title: t("courtesycars.fields.year"), diff --git a/client/src/graphql/cccontracts.queries.js b/client/src/graphql/cccontracts.queries.js index 5436e4c33..c0873e1c0 100644 --- a/client/src/graphql/cccontracts.queries.js +++ b/client/src/graphql/cccontracts.queries.js @@ -9,3 +9,52 @@ export const INSERT_NEW_CONTRACT = gql` } } `; + +export const UPDATE_CONTRACT = gql` + mutation UPDATE_CONTRACT( + $contractId: uuid! + $cccontract: cccontracts_set_input! + ) { + update_cccontracts( + where: { id: { _eq: $contractId } } + _set: $cccontract + ) { + returning { + id + } + } + } +`; + +export const QUERY_CONTRACT_BY_PK = gql` + query QUERY_CONTRACT_BY_PK($id: uuid!) { + cccontracts_by_pk(id: $id) { + actualreturn + agreementnumber + cc_cardholder + cc_expiry + cc_num + courtesycarid + driver_addr1 + driver_city + driver_addr2 + driver_dlexpiry + driver_dlnumber + driver_dlst + driver_dob + driver_fn + driver_ln + driver_ph1 + driver_state + driver_zip + id + jobid + kmend + kmstart + scheduledreturn + start + status + updated_at + } + } +`; diff --git a/client/src/graphql/courtesy-car.queries.js b/client/src/graphql/courtesy-car.queries.js index 3d64201fd..2548873b6 100644 --- a/client/src/graphql/courtesy-car.queries.js +++ b/client/src/graphql/courtesy-car.queries.js @@ -14,7 +14,7 @@ export const INSERT_NEW_COURTESY_CAR = gql` export const QUERY_AVAILABLE_CC = gql` query QUERY_AVAILABLE_CC { - courtesycars(where: {serviceenddate: {_is_null: true}}) { + courtesycars(where: { serviceenddate: { _is_null: true } }) { color dailycost damage @@ -85,6 +85,20 @@ export const QUERY_CC_BY_PK = gql` status vin year + cccontracts { + status + start + scheduledreturn + kmstart + kmend + driver_ln + driver_fn + job { + ro_number + est_number + id + } + } } } `; diff --git a/client/src/pages/contract-create/contract-create.page.container.jsx b/client/src/pages/contract-create/contract-create.page.container.jsx index 85d8c0f60..4f4515b8f 100644 --- a/client/src/pages/contract-create/contract-create.page.container.jsx +++ b/client/src/pages/contract-create/contract-create.page.container.jsx @@ -8,6 +8,7 @@ import { Form, notification } from "antd"; import { useTranslation } from "react-i18next"; import { INSERT_NEW_CONTRACT } from "../../graphql/cccontracts.queries"; import { useMutation } from "@apollo/react-hooks"; +import { useHistory } from "react-router-dom"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop }); @@ -17,8 +18,8 @@ export function ContractCreatePageContainer({ bodyshop }) { const { t } = useTranslation(); const selectedCarState = useState(null); const selectedJobState = useState(null); - const [insertContract] = useMutation(INSERT_NEW_CONTRACT); + const history = useHistory(); const handleFinish = values => { if (!!selectedCarState[0] && !!selectedJobState[0]) { @@ -35,8 +36,18 @@ export function ContractCreatePageContainer({ bodyshop }) { notification["success"]({ message: t("contracts.successes.saved") }); + + history.push( + `/manage/courtesycars/contracts/${response.data.insert_cccontracts.returning[0].id}` + ); }) - .catch(error => console.log("error", error)); + .catch(error => + notification["error"]({ + message: t("contracts.errors.saving", { + error: JSON.stringify(error) + }) + }) + ); } else { notification["error"]({ message: t("contracts.errors.selectjobandcar") @@ -50,7 +61,6 @@ export function ContractCreatePageContainer({ bodyshop }) { return (
- + + SOME SORT OF HEADER INFORMATION HERE. + + + ); +} diff --git a/client/src/pages/contract-detail/contract-detail.page.container.jsx b/client/src/pages/contract-detail/contract-detail.page.container.jsx new file mode 100644 index 000000000..243078792 --- /dev/null +++ b/client/src/pages/contract-detail/contract-detail.page.container.jsx @@ -0,0 +1,84 @@ +import { useMutation, useQuery } from "@apollo/react-hooks"; +import { Form, notification } from "antd"; +import moment from "moment"; +import React, { useEffect } from "react"; +import { useTranslation } from "react-i18next"; +import { useParams } from "react-router-dom"; +import AlertComponent from "../../components/alert/alert.component"; +import { + QUERY_CONTRACT_BY_PK, + UPDATE_CONTRACT +} from "../../graphql/cccontracts.queries"; +import ContractDetailPageComponent from "./contract-detail.page.component"; + +export default function ContractDetailPageContainer() { + const { t } = useTranslation(); + const [updateContract] = useMutation(UPDATE_CONTRACT); + const [form] = Form.useForm(); + const { contractId } = useParams(); + + const { loading, error, data } = useQuery(QUERY_CONTRACT_BY_PK, { + variables: { id: contractId } + }); + + useEffect(() => { + document.title = loading + ? t("titles.app") + : error + ? t("titles.app") + : t("titles.contracts-detail", { + id: (data && data.cccontracts_by_pk.id) || "" + }); + }, [t, data, error, loading]); + + const handleFinish = values => { + updateContract({ + variables: { cccontract: { ...values }, contractId: contractId } + }) + .then(response => { + notification["success"]({ message: t("contracts.successess.saved") }); + }) + .catch(error => + notification["error"]({ + message: t("contracts.errors.saving", { error: error }) + }) + ); + }; + + useEffect(() => { + if (data) form.resetFields(); + }, [data, form]); + + if (error) return ; + return ( + + + + ); +} diff --git a/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx b/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx index ef10bf592..cbcd4dd45 100644 --- a/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx +++ b/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx @@ -7,6 +7,7 @@ import { createStructuredSelector } from "reselect"; import { INSERT_NEW_COURTESY_CAR } from "../../graphql/courtesy-car.queries"; import { selectBodyshop } from "../../redux/user/user.selectors"; import CourtesyCarCreateComponent from "./courtesy-car-create.page.component"; +import { useHistory } from "react-router-dom"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop @@ -16,13 +17,17 @@ export function CourtesyCarCreateContainer({ bodyshop }) { const [form] = Form.useForm(); const [insertCourtesyCar] = useMutation(INSERT_NEW_COURTESY_CAR); const { t } = useTranslation(); - + const history = useHistory(); + const handleFinish = values => { insertCourtesyCar({ variables: { courtesycar: { ...values, bodyshopid: bodyshop.id } } }) .then(response => { notification["success"]({ message: t("courtesycars.successes.saved") }); + history.push( + `/manage/courtesycars/${response.data.insert_courtesycars.returning[0].id}` + ); }) .catch(error => console.log("error", error)); }; diff --git a/client/src/pages/courtesy-car-detail/courtesy-car-detail.page.component.jsx b/client/src/pages/courtesy-car-detail/courtesy-car-detail.page.component.jsx index 586e83b4c..8a874d3aa 100644 --- a/client/src/pages/courtesy-car-detail/courtesy-car-detail.page.component.jsx +++ b/client/src/pages/courtesy-car-detail/courtesy-car-detail.page.component.jsx @@ -1,6 +1,12 @@ import React from "react"; import CourtesyCarCreateFormComponent from "../../components/courtesy-car-form/courtesy-car-form.component"; +import CourtesyCarContractListComponent from "../../components/courtesy-car-contract-list/courtesy-car-contract-list.component"; -export default function CourtesyCarDetailPageComponent() { - return ; +export default function CourtesyCarDetailPageComponent({ contracts }) { + return ( +
+ + +
+ ); } diff --git a/client/src/pages/jobs-available/jobs-available.page.component.jsx b/client/src/pages/jobs-available/jobs-available.page.component.jsx index 80fda293e..e92db9064 100644 --- a/client/src/pages/jobs-available/jobs-available.page.component.jsx +++ b/client/src/pages/jobs-available/jobs-available.page.component.jsx @@ -11,7 +11,7 @@ export default function JobsAvailablePageComponent({ const { t } = useTranslation(); return (
- + diff --git a/client/src/pages/manage/manage.page.component.jsx b/client/src/pages/manage/manage.page.component.jsx index 0175ea813..add936f32 100644 --- a/client/src/pages/manage/manage.page.component.jsx +++ b/client/src/pages/manage/manage.page.component.jsx @@ -58,6 +58,9 @@ const CourtesyCarsPage = lazy(() => const ContractCreatePage = lazy(() => import("../contract-create/contract-create.page.container") ); +const ContractDetailPage = lazy(() => + import("../contract-detail/contract-detail.page.container") +); const { Header, Content, Footer } = Layout; @@ -90,7 +93,7 @@ export default function Manage({ match }) { @@ -125,7 +128,7 @@ export default function Manage({ match }) {
cc contract id
} + component={ContractDetailPage} />