Admin vehicle/owner reassociation IO-157

client/src/pages/jobs-admin/jobs-admin.page.jsx

@@ -0,0 +1,78 @@
+import { useQuery } from "@apollo/react-hooks";
+import { Result } from "antd";
+import React, { useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { useParams } from "react-router-dom";
+import AlertComponent from "../../components/alert/alert.component";
+import JobAdminOwnerReassociate from "../../components/jobs-admin-owner-reassociate/jobs-admin-owner-reassociate.component";
+import JobCalculateTotals from "../../components/job-calculate-totals/job-calculate-totals.component";
+import JobAdminVehicleReassociate from "../../components/jobs-admin-vehicle-reassociate/jobs-admin-vehicle-reassociate.component";
+import LayoutFormRow from "../../components/layout-form-row/layout-form-row.component";
+import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
+import NotFound from "../../components/not-found/not-found.component";
+import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
+import { GET_JOB_BY_PK } from "../../graphql/jobs.queries";
+import {
+    setBreadcrumbs,
+    setSelectedHeader
+} from "../../redux/application/application.actions";
+
+const mapDispatchToProps = (dispatch) => ({
+  setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
+  setSelectedHeader: (key) => dispatch(setSelectedHeader(key)),
+});
+
+export function JobsCloseContainer({ setBreadcrumbs, setSelectedHeader }) {
+  const { jobId } = useParams();
+  const { loading, error, data } = useQuery(GET_JOB_BY_PK, {
+    variables: { id: jobId },
+  });
+  const { t } = useTranslation();
+  useEffect(() => {
+    setSelectedHeader("activejobs");
+    document.title = t("titles.jobs-admin", {
+      ro_number: data ? data.jobs_by_pk && data.jobs_by_pk.ro_number : null,
+    });
+
+    setBreadcrumbs([
+      {
+        link: `/manage/jobs/${jobId}/`,
+        label: t("titles.bc.jobs"),
+      },
+      {
+        link: `/manage/jobs/${jobId}/`,
+        label: t("titles.bc.jobs-detail", {
+          number: data ? data.jobs_by_pk && data.jobs_by_pk.ro_number : null,
+        }),
+      },
+      {
+        link: `/manage/jobs/${jobId}/admin`,
+        label: t("titles.bc.jobs-admin"),
+      },
+    ]);
+  }, [setBreadcrumbs, t, jobId, data, setSelectedHeader]);
+
+  if (loading) return <LoadingSpinner />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
+  if (!!!data.jobs_by_pk) return <NotFound />;
+  if (!data.jobs_by_pk.job_totals)
+    return (
+      <Result
+        title={t("jobs.errors.nofinancial")}
+        extra={<JobCalculateTotals job={data.jobs_by_pk} />}
+      />
+    );
+
+  return (
+    <RbacWrapper action="jobs:admin">
+      <div>
+        <LayoutFormRow grow>
+          <JobAdminOwnerReassociate job={data ? data.jobs_by_pk : {}} />
+          <JobAdminVehicleReassociate job={data ? data.jobs_by_pk : {}} />
+        </LayoutFormRow>
+      </div>
+    </RbacWrapper>
+  );
+}
+export default connect(null, mapDispatchToProps)(JobsCloseContainer);

client/src/pages/manage/manage.page.component.jsx

@@ -115,6 +115,8 @@ const AccountingPayments = lazy(() =>
 );
 const AllJobs = lazy(() => import("../jobs-all/jobs-all.container"));
 const JobsClose = lazy(() => import("../jobs-close/jobs-close.container"));
+const JobsAdmin = lazy(() => import("../jobs-admin/jobs-admin.page"));
+
 const ShopCsiPageContainer = lazy(() =>
   import("../shop-csi/shop-csi.container.page")
 );
@@ -208,6 +210,11 @@ export function Manage({ match, conflict }) {
                   path={`${match.path}/jobs/:jobId/close`}
                   component={JobsClose}
                 />
+                <Route
+                  exact
+                  path={`${match.path}/jobs/:jobId/admin`}
+                  component={JobsAdmin}
+                />
                 <Route
                   exact
                   path={`${match.path}/jobs/all`}