IO-1029 IO-1019 Bills, PO, an CC Fixes.

client/src/components/bill-delete-button/bill-delete-button.component.jsx

@@ -1,3 +1,4 @@
+import { DeleteFilled } from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
 import { Button, notification, Popconfirm } from "antd";
 import React, { useState } from "react";
@@ -57,7 +58,7 @@ export default function BillDeleteButton({ bill }) {
           // onClick={handleDelete}
           loading={loading}
         >
-          {t("general.actions.delete")}
+          <DeleteFilled />
         </Button>
       </Popconfirm>
     </RbacWrapper>

client/src/components/bill-detail-edit/bill-detail-edit.container.jsx

@@ -148,7 +148,7 @@ export function BillDetailEditcontainer({ setPartsOrderContext }) {
   }, [form, search.billid, data]);
 
   if (error) return <AlertComponent message={error.message} type="error" />;
-  if (!!!search.billid) return <div>{t("bills.labels.noneselected")}</div>;
+  if (!search.billid) return <></>; //<div>{t("bills.labels.noneselected")}</div>;
 
   const exported = data && data.bills_by_pk && data.bills_by_pk.exported;
 

client/src/components/contract-form/contract-form.component.jsx

@@ -12,7 +12,7 @@ import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormDateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import InputPhone, {
-  PhoneItemFormatterValidation
+  PhoneItemFormatterValidation,
 } from "../form-items-formatted/phone-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import ContractFormJobPrefill from "./contract-form-job-prefill.component";
@@ -100,7 +100,7 @@ export default function ContractFormComponent({
                 moment(selectedCar.nextservicedate).isBefore(
                   moment(form.getFieldValue("scheduledreturn"))
                 );
-              console.log(`dueForService`, dueForService);
+
               if (mileageOver || dueForService)
                 return (
                   <Space direction="vertical" style={{ color: "tomato" }}>

client/src/components/courtesy-car-form/courtesy-car-form.component.jsx

@@ -1,15 +1,17 @@
-import { Button, Form, Input, InputNumber, PageHeader } from "antd";
+import { WarningFilled } from "@ant-design/icons";
+import { useApolloClient } from "@apollo/client";
+import { Button, Form, Input, InputNumber, PageHeader, Space } from "antd";
+import moment from "moment";
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { CHECK_CC_FLEET_NUMBER } from "../../graphql/courtesy-car.queries";
+import { DateFormatter } from "../../utils/DateFormatter";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
 import CourtesyCarStatus from "../courtesy-car-status-select/courtesy-car-status-select.component";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-import InputNumberCalculator from "../form-input-number-calculator/form-input-number-calculator.component";
-import { useApolloClient } from "@apollo/client";
-import { CHECK_CC_FLEET_NUMBER } from "../../graphql/courtesy-car.queries";
 
 export default function CourtesyCarCreateFormComponent({ form, saveLoading }) {
   const { t } = useTranslation();
@@ -221,20 +223,56 @@ export default function CourtesyCarCreateFormComponent({ form, saveLoading }) {
             },
           ]}
         >
-          <InputNumberCalculator />
+          <InputNumber />
-        </Form.Item>
-        <Form.Item
-          label={t("courtesycars.fields.nextservicedate")}
-          name="nextservicedate"
-          rules={[
-            {
-              required: true,
-              message: t("general.validation.required"),
-            },
-          ]}
-        >
-          <FormDatePicker />
         </Form.Item>
+        <div>
+          <Form.Item
+            label={t("courtesycars.fields.nextservicedate")}
+            name="nextservicedate"
+            rules={[
+              {
+                required: true,
+                message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <FormDatePicker />
+          </Form.Item>
+          <Form.Item
+            shouldUpdate={(p, c) =>
+              p.mileage !== c.mileage ||
+              p.nextservicedate !== c.nextservicedate ||
+              p.nextservicekm !== c.nextservicekm
+            }
+          >
+            {() => {
+              const nextservicedate = form.getFieldValue("nextservicedate");
+              const nextservicekm = form.getFieldValue("nextservicekm");
+
+              const mileageOver =
+                nextservicekm <= form.getFieldValue("mileage");
+
+              const dueForService =
+                nextservicedate && moment(nextservicedate).isBefore(moment());
+
+              if (mileageOver || dueForService)
+                return (
+                  <Space direction="vertical" style={{ color: "tomato" }}>
+                    <span>
+                      <WarningFilled style={{ marginRight: ".3rem" }} />
+                      {t("contracts.labels.cardueforservice")}
+                    </span>
+                    <span>{`${nextservicekm} km`}</span>
+                    <span>
+                      <DateFormatter>{nextservicedate}</DateFormatter>
+                    </span>
+                  </Space>
+                );
+
+              return <></>;
+            }}
+          </Form.Item>
+        </div>
         <Form.Item label={t("courtesycars.fields.damage")} name="damage">
           <Input.TextArea />
         </Form.Item>

client/src/components/parts-order-list-table/parts-order-list-table.component.jsx

@@ -113,6 +113,7 @@ export function PartsOrderListTableComponent({
       </Button>
       <Popconfirm
         title={t("parts_orders.labels.confirmdelete")}
+        disabled={jobRO || !record.return}
         onConfirm={async () => {
           //Delete the parts return.!
 

client/src/components/parts-order-modal/parts-order-modal.component.jsx

@@ -24,7 +24,7 @@ export default function PartsOrderModalComponent({
       <Form.Item name="returnfrombill" style={{ display: "none" }}>
         <Input />
       </Form.Item>
-      <LayoutFormRow noDivider>
+      <LayoutFormRow grow noDivider>
         <Form.Item
           name="vendorid"
           label={t("vendors.fields.name")}
@@ -149,6 +149,7 @@ export default function PartsOrderModalComponent({
         defaultValue={sendType}
         onChange={(e) => setSendType(e.target.value)}
       >
+        <Radio value={"none"}>{t("general.labels.none")}</Radio>
         <Radio value={"e"}>{t("parts_orders.labels.email")}</Radio>
         <Radio value={"p"}>{t("parts_orders.labels.print")}</Radio>
       </Radio.Group>

client/src/components/parts-order-modal/parts-order-modal.container.jsx

@@ -88,6 +88,7 @@ export function PartsOrderModalContainer({
           },
         ],
       },
+      refetchQueries: ["QUERY_PARTS_BILLS_BY_JOBID"],
     });
     if (!!insertResult.error) {
       notification["error"]({
@@ -180,7 +181,7 @@ export function PartsOrderModalContainer({
         },
         "e"
       );
-    } else {
+    } else if (sendType === "p") {
       GenerateDocument(
         {
           name: isReturn