IO-899 Add ccc rate presets.

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

@@ -1,21 +1,21 @@
-import { Form, Input, InputNumber, Space } from "antd";
 import { WarningFilled } from "@ant-design/icons";
+import { Form, Input, InputNumber, Space } from "antd";
+import moment from "moment";
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { DateFormatter } from "../../utils/DateFormatter";
 import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
 import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
+import ContractsRatesChangeButton from "../contracts-rates-change-button/contracts-rates-change-button.component";
 import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
 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 InputNumberCalculator from "../form-input-number-calculator/form-input-number-calculator.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";
-import FormDateTimePicker from "../form-date-time-picker/form-date-time-picker.component";
-import moment from "moment";
-import { DateFormatter } from "../../utils/DateFormatter";
 
 export default function ContractFormComponent({
   form,
@@ -132,7 +132,7 @@ export default function ContractFormComponent({
           <Input.TextArea />
         </Form.Item>
       </LayoutFormRow>
-      <LayoutFormRow>
+      <LayoutFormRow grow>
         <Form.Item
           label={t("contracts.fields.fuelout")}
           name="fuelout"
@@ -293,6 +293,7 @@ export default function ContractFormComponent({
           <FormDatePicker />
         </Form.Item>
       </LayoutFormRow>
+      <ContractsRatesChangeButton form={form} />
       <LayoutFormRow header={t("contracts.labels.rates")}>
         <Form.Item label={t("contracts.fields.dailyrate")} name="dailyrate">
           <InputNumber precision={2} />
@@ -330,16 +331,16 @@ export default function ContractFormComponent({
           <InputNumber precision={2} />
         </Form.Item>
         <Form.Item label={t("contracts.fields.federaltax")} name="federaltax">
-          <InputNumberCalculator precision={2} />
+          <InputNumber precision={2} />
         </Form.Item>
         <Form.Item label={t("contracts.fields.statetax")} name="statetax">
-          <InputNumberCalculator precision={2} />
+          <InputNumber precision={2} />
         </Form.Item>
         <Form.Item label={t("contracts.fields.localtax")} name="localtax">
-          <InputNumberCalculator precision={2} />
+          <InputNumber precision={2} />
         </Form.Item>
         <Form.Item label={t("contracts.fields.coverage")} name="coverage">
-          <InputNumberCalculator precision={2} />
+          <InputNumber precision={2} />
         </Form.Item>
       </LayoutFormRow>
     </div>

client/src/components/contracts-rates-change-button/contracts-rates-change-button.component.jsx

@@ -0,0 +1,46 @@
+import { DownOutlined } from "@ant-design/icons";
+import { Dropdown, Menu } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+
+export function ContractsRatesChangeButton({ disabled, form, bodyshop }) {
+  const { t } = useTranslation();
+
+  const handleClick = ({ item, key, keyPath }) => {
+    const { label, ...rate } = item.props.value;
+    form.setFieldsValue(rate);
+  };
+
+  const menu = (
+    <div>
+      <Menu onClick={handleClick}>
+        {bodyshop.md_ccc_rates.map((rate, idx) => (
+          <Menu.Item value={rate} key={idx}>
+            {rate.label}
+          </Menu.Item>
+        ))}
+      </Menu>
+    </div>
+  );
+
+  return (
+    <Dropdown overlay={menu} disabled={disabled}>
+      <a
+        className="ant-dropdown-link"
+        href=" #"
+        onClick={(e) => e.preventDefault()}
+      >
+        {t("contracts.actions.changerate")} <DownOutlined />
+      </a>
+    </Dropdown>
+  );
+}
+
+export default connect(mapStateToProps, null)(ContractsRatesChangeButton);

client/src/components/shop-info/shop-info.general.component.jsx

@@ -685,6 +685,123 @@ export default function ShopInfoGeneral({ form }) {
           }}
         </Form.List>
       </LayoutFormRow>
+      <LayoutFormRow grow header={t("bodyshop.fields.md_ccc_rates")}>
+        <Form.List name={["md_ccc_rates"]}>
+          {(fields, { add, remove, move }) => {
+            return (
+              <div>
+                {fields.map((field, index) => (
+                  <Form.Item key={field.key}>
+                    <LayoutFormRow noDivider>
+                      <Form.Item
+                        label={t("general.labels.label")}
+                        key={`${index}label`}
+                        name={[field.name, "label"]}
+                      >
+                        <Input />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.actax")}
+                        key={`${index}actax`}
+                        name={[field.name, "actax"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.dailyfreekm")}
+                        key={`${index}dailyfreekm`}
+                        name={[field.name, "dailyfreekm"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.refuelcharge")}
+                        key={`${index}refuelcharge`}
+                        name={[field.name, "refuelcharge"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.excesskmrate")}
+                        key={`${index}excesskmrate`}
+                        name={[field.name, "excesskmrate"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.cleanupcharge")}
+                        key={`${index}cleanupcharge`}
+                        name={[field.name, "cleanupcharge"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.damagewaiver")}
+                        key={`${index}damagewaiver`}
+                        name={[field.name, "damagewaiver"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.federaltax")}
+                        key={`${index}federaltax`}
+                        name={[field.name, "federaltax"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.statetax")}
+                        key={`${index}statetax`}
+                        name={[field.name, "statetax"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.localtax")}
+                        key={`${index}localtax`}
+                        name={[field.name, "localtax"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+                      <Form.Item
+                        label={t("contracts.fields.coverage")}
+                        key={`${index}coverage`}
+                        name={[field.name, "coverage"]}
+                      >
+                        <InputNumber precision={2} />
+                      </Form.Item>
+
+                      <Space wrap>
+                        <DeleteFilled
+                          onClick={() => {
+                            remove(field.name);
+                          }}
+                        />
+                        <FormListMoveArrows
+                          move={move}
+                          index={index}
+                          total={fields.length}
+                        />
+                      </Space>
+                    </LayoutFormRow>
+                  </Form.Item>
+                ))}
+                <Form.Item>
+                  <Button
+                    type="dashed"
+                    onClick={() => {
+                      add();
+                    }}
+                    style={{ width: "100%" }}
+                  >
+                    {t("general.actions.add")}
+                  </Button>
+                </Form.Item>
+              </div>
+            );
+          }}
+        </Form.List>
+      </LayoutFormRow>
     </div>
   );
 }