Added formrow components and for fields changed components + reformatted couple of job detail screens. BOD-160 BOD-155

client/src/pages/jobs-detail/jobs-detail.page.component.jsx

@@ -23,6 +23,7 @@ import { createStructuredSelector } from "reselect";
 import { CalculateJob } from "../../components/job-totals-table/job-totals.utility";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import FormFieldsChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
 
 const JobsLinesContainer = lazy(() =>
   import("../../components/job-detail-lines/job-lines.container")
@@ -96,14 +97,8 @@ export function JobsDetailPage({
 
   const search = queryString.parse(useLocation().search);
   const formItemLayout = {
-    labelCol: {
-      xs: { span: 12 },
-      sm: { span: 5 },
-    },
-    wrapperCol: {
-      xs: { span: 24 },
-      sm: { span: 12 },
-    },
+    layout: "vertical",
+    // size: "small",
   };
 
   const handleFinish = (values) => {
@@ -134,7 +129,6 @@ export function JobsDetailPage({
       <JobLineUpsertModalContainer />
       <Form
         form={form}
-        //onFieldsChange={(a, b) => console.log("a,b", a, b)}
         name='JobDetailForm'
         onFinish={handleFinish}
         {...formItemLayout}
@@ -143,6 +137,8 @@ export function JobsDetailPage({
           ...job,
           loss_date: job.loss_date ? moment(job.loss_date) : null,
         }}>
+        <FormFieldsChanged form={form} />
+
         <JobsDetailHeader
           job={job}
           mutationConvertJob={mutationConvertJob}
@@ -221,7 +217,7 @@ export function JobsDetailPage({
               </span>
             }
             key='dates'>
-            <JobsDetailDatesComponent job={job} />}
+            <JobsDetailDatesComponent job={job} />
           </Tabs.TabPane>
           <Tabs.TabPane
             tab={

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

@@ -12,7 +12,7 @@ import ChatAffixContainer from "../../components/chat-affix/chat-affix.container
 import ConflictComponent from "../../components/conflict/conflict.component";
 import ErrorBoundary from "../../components/error-boundary/error-boundary.component";
 import FcmNotification from "../../components/fcm-notification/fcm-notification.component";
-import FooterComponent from "../../components/footer/footer.component";
+//import FooterComponent from "../../components/footer/footer.component";
 //Component Imports
 import HeaderContainer from "../../components/header/header.container";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
@@ -110,7 +110,7 @@ const ShopCsiPageContainer = lazy(() =>
   import("../shop-csi/shop-csi.container.page")
 );
 
-const { Content, Footer } = Layout;
+const { Content } = Layout;
 
 const stripePromise = new Promise((resolve, reject) => {
   client.query({ query: QUERY_STRIPE_ID }).then((resp) => {

client/src/pages/manage/manage.page.styles.scss

@@ -1,7 +1,8 @@
 .content-container {
   overflow-y: auto;
-  margin: 0.5rem 1.5rem;
-  padding: 1.5rem;
+  margin: 0rem 1.5rem;
+  padding: 0.5rem 1.5rem;
+  border-radius: 12px;
   background: #fff;
 }