Added financial fields.

client/src/components/jobs-detail-financial/jobs-detail-financial.component.jsx

@@ -0,0 +1,57 @@
+import { Form, Input, InputNumber } from "antd";
+import React, { useContext } from "react";
+import { useTranslation } from "react-i18next";
+import JobDetailFormContext from "../../pages/jobs-detail/jobs-detail.page.context";
+
+export default function JobsDetailFinancials({ job }) {
+  const form = useContext(JobDetailFormContext);
+  const { getFieldDecorator } = form;
+  const { t } = useTranslation();
+
+  return (
+    <div>
+      <Form.Item label={t("jobs.fields.ded_amt")}>
+        {getFieldDecorator("ded_amt", {
+          initialValue: job.ded_amt
+        })(<InputNumber name="ded_amt" />)}
+      </Form.Item>
+      <Form.Item label={t("jobs.fields.ded_status")}>
+        {getFieldDecorator("ded_status", {
+          initialValue: job.ded_status
+        })(<Input name="ded_status" />)}
+      </Form.Item>
+      <Form.Item label={t("jobs.fields.depreciation_taxes")}>
+        {getFieldDecorator("depreciation_taxes", {
+          initialValue: job.depreciation_taxes
+        })(<InputNumber name="depreciation_taxes" />)}
+      </Form.Item>
+      TODO: This is equivalent of GST payable.
+      <Form.Item label={t("jobs.fields.federal_tax_payable")}>
+        {getFieldDecorator("federal_tax_payable", {
+          initialValue: job.federal_tax_payable
+        })(<InputNumber name="federal_tax_payable" />)}
+      </Form.Item>
+      TODO: equivalent of other customer amount
+      <Form.Item label={t("jobs.fields.other_amount_payable")}>
+        {getFieldDecorator("other_amount_payable", {
+          initialValue: job.other_amount_payable
+        })(<InputNumber name="other_amount_payable" />)}
+      </Form.Item>
+      <Form.Item label={t("jobs.fields.towing_payable")}>
+        {getFieldDecorator("towing_payable", {
+          initialValue: job.towing_payable
+        })(<InputNumber name="towing_payable" />)}
+      </Form.Item>
+      <Form.Item label={t("jobs.fields.storage_payable")}>
+        {getFieldDecorator("storage_payable", {
+          initialValue: job.storage_payable
+        })(<InputNumber name="storage_payable" />)}
+      </Form.Item>
+      <Form.Item label={t("jobs.fields.adjustment_bottom_line")}>
+        {getFieldDecorator("adjustment_bottom_line", {
+          initialValue: job.adjustment_bottom_line
+        })(<InputNumber name="adjustment_bottom_line" />)}
+      </Form.Item>
+    </div>
+  );
+}