Added negative validation on entering invoices for credit memos BOD-219

This commit is contained in:
Patrick Fic
2020-08-04 09:53:13 -07:00
parent a722120351
commit 455d5148d0
6 changed files with 140 additions and 86 deletions

View File

@@ -9,6 +9,7 @@ import {
} from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import AlertComponent from "../alert/alert.component";
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
import JobSearchSelect from "../job-search-select/job-search-select.component";
import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
@@ -50,17 +51,18 @@ export default function InvoiceFormComponent({
}, [form, setDiscount, vendorAutoCompleteOptions, loadLines]);
return (
<div className='invoice-form-wrapper'>
<div className='invoice-form-invoice-details'>
<div className="invoice-form-wrapper">
<div className="invoice-form-invoice-details">
<Form.Item
name='jobid'
name="jobid"
label={t("invoices.fields.ro_number")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
]}
>
<JobSearchSelect
options={roAutoCompleteOptions}
disabled={invoiceEdit}
@@ -73,74 +75,82 @@ export default function InvoiceFormComponent({
</Form.Item>
<Form.Item
label={t("invoices.fields.vendor")}
name='vendorid'
name="vendorid"
style={{ display: invoiceEdit ? "none" : null }}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
]}
>
<VendorSearchSelect
options={vendorAutoCompleteOptions}
onSelect={handleVendorSelect}
/>
</Form.Item>
</div>
<div className='invoice-form-invoice-details'>
<div className="invoice-form-invoice-details">
<Form.Item
label={t("invoices.fields.invoice_number")}
name='invoice_number'
name="invoice_number"
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("invoices.fields.date")}
name='date'
name="date"
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
]}
>
<DatePicker />
</Form.Item>
<Form.Item
label={t("invoices.fields.is_credit_memo")}
name='is_credit_memo'
valuePropName='checked'>
name="is_credit_memo"
valuePropName="checked"
>
<Switch />
</Form.Item>
<Form.Item
label={t("invoices.fields.total")}
name='total'
name="total"
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}>
<CurrencyInput />
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("invoices.fields.federal_tax_rate")}
name='federal_tax_rate'>
<CurrencyInput />
name="federal_tax_rate"
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("invoices.fields.state_tax_rate")}
name='state_tax_rate'>
<CurrencyInput />
name="state_tax_rate"
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("invoices.fields.local_tax_rate")}
name='local_tax_rate'>
<CurrencyInput />
name="local_tax_rate"
>
<CurrencyInput min={0} />
</Form.Item>
</div>
<InvoiceFormLines
@@ -151,18 +161,19 @@ export default function InvoiceFormComponent({
/>
<Form.Item
name='upload'
label='Upload'
name="upload"
label="Upload"
style={{ display: invoiceEdit ? "none" : null }}
valuePropName='fileList'
valuePropName="fileList"
getValueFromEvent={(e) => {
console.log("Upload event:", e);
if (Array.isArray(e)) {
return e;
}
return e && e.fileList;
}}>
<Upload name='logo' beforeUpload={() => false} listType='picture'>
}}
>
<Upload name="logo" beforeUpload={() => false} listType="picture">
<Button>Click to upload</Button>
</Upload>
</Form.Item>
@@ -185,46 +196,54 @@ export default function InvoiceFormComponent({
totals = CalculateInvoiceTotal(values);
if (!!totals)
return (
<div className='invoice-form-totals'>
<Statistic
title={t("invoices.labels.subtotal")}
value={totals.subtotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.federal_tax")}
value={totals.federalTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.state_tax")}
value={totals.stateTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.local_tax")}
value={totals.localTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.entered_total")}
value={totals.enteredTotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.invoice_total")}
value={totals.invoiceTotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.discrepancy")}
valueStyle={{
color:
totals.discrepancy.getAmount() === 0 ? "green" : "red",
}}
value={totals.discrepancy.toFormat()}
precision={2}
/>
<div>
<div className="invoice-form-totals">
<Statistic
title={t("invoices.labels.subtotal")}
value={totals.subtotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.federal_tax")}
value={totals.federalTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.state_tax")}
value={totals.stateTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.local_tax")}
value={totals.localTax.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.entered_total")}
value={totals.enteredTotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.invoice_total")}
value={totals.invoiceTotal.toFormat()}
precision={2}
/>
<Statistic
title={t("invoices.labels.discrepancy")}
valueStyle={{
color:
totals.discrepancy.getAmount() === 0 ? "green" : "red",
}}
value={totals.discrepancy.toFormat()}
precision={2}
/>
</div>
{form.getFieldValue("is_credit_memo") ? (
<AlertComponent
type="warning"
message={t("invoices.labels.enteringcreditmemo")}
/>
) : null}
</div>
);
return null;