From 35a44621c25b06471ae5b29bbdfb35fdcf652cf1 Mon Sep 17 00:00:00 2001 From: MikunoNaka Date: Fri, 25 Jun 2021 15:27:58 +0530 Subject: Changed the way all the values are calculated for stability --- src/components/Display/ItemsDisplay.js | 5 +- src/components/Display/SummaryDisplay.js | 129 -------------------------- src/components/Display/SummaryDisplay.txt | 132 +++++++++++++++++++++++++++ src/components/Form/Items/AddNewItemForm.tsx | 49 +++++----- src/components/Pages/BillingPage.tsx | 5 +- 5 files changed, 162 insertions(+), 158 deletions(-) delete mode 100644 src/components/Display/SummaryDisplay.js create mode 100644 src/components/Display/SummaryDisplay.txt (limited to 'src/components') diff --git a/src/components/Display/ItemsDisplay.js b/src/components/Display/ItemsDisplay.js index 0b2fbf0..f0882af 100644 --- a/src/components/Display/ItemsDisplay.js +++ b/src/components/Display/ItemsDisplay.js @@ -9,7 +9,7 @@ import React from "react"; import "./Display.scss"; import DisplayItem from "./DisplayItem"; -import {SummaryDisplayTR} from "./SummaryDisplay"; +// import {SummaryDisplayTR} from "./SummaryDisplay"; const ItemsDisplay = (props) => { const items = props.items; @@ -43,10 +43,11 @@ const ItemsDisplay = (props) => { } )} - ); + // this goes right before + // } export default ItemsDisplay; diff --git a/src/components/Display/SummaryDisplay.js b/src/components/Display/SummaryDisplay.js deleted file mode 100644 index 1bcc713..0000000 --- a/src/components/Display/SummaryDisplay.js +++ /dev/null @@ -1,129 +0,0 @@ -/* - * OpenBills - Self hosted browser app to generate and keep track of simple invoices - * Version - 0 - * Licensed under the MIT license - https://opensource.org/licenses/MIT - * - * Copyright (c) 2021 Vidhu Kant Sharma -*/ - -import React from "react"; -import "./Display.scss"; - -const getBasicSummary = (items) => { - let totalRawPrice = 0; - let totalQuantity = 0; - - items.some((i) => { - totalRawPrice += i.TotalPrice; - totalQuantity += i.Quantity; - return null; - } - ) - - return ( - { - "TotalRawPrice": totalRawPrice, - "TotalQuantity": totalQuantity - } - ); -} - -// TODO: remove mutability from this function -const getFullSummary = (items) => { - let totalRawPrice = 0; - let totalDiscount = 0; // to be subtracted from totalRawPrice - let totalTax = 0; - - items.some((i) => { - const itemTotalPrice = i.TotalPrice; - const itemDiscount = (i.Discount / 100) * itemTotalPrice; - - totalRawPrice += itemTotalPrice; - totalDiscount += itemDiscount; - totalTax += i.igst === "" - ? ((i.sgst + i.cgst) / 100) * (itemTotalPrice - itemDiscount) - : (i.igst / 100) * (itemTotalPrice - itemDiscount); - return null; - }) - - - - const totalPriceAfterTax = (totalRawPrice - totalDiscount) + totalTax; - const totalRoundedOff = Math.abs(totalPriceAfterTax - Math.round(totalPriceAfterTax)); - return ( - { - "TotalRawPrice": parseFloat(totalRawPrice.toFixed(2)), - "TotalDiscountPrice": parseFloat(totalDiscount.toFixed(2)), - "TotalPriceAfterDiscount": parseFloat((totalRawPrice - totalDiscount).toFixed(2)), - "TotalTaxAmount": parseFloat(totalTax.toFixed(2)), - "TotalPriceAfterTax": parseFloat(totalPriceAfterTax.toFixed(2)), - "RoundedOff": parseFloat(totalRoundedOff.toFixed(2)), - "TotalPrice": Math.round(totalPriceAfterTax) - } - ); -} - -export const SummaryDisplayTR = (props) => { - const summary = getBasicSummary(props.items); - - return ( - - Total - - - {summary.TotalQuantity} - - - - - - {summary.TotalRawPrice} - - ); -} - -const SummaryDisplay = (props) => { - const summary = getFullSummary(props.items); - - return ( -
-

Summary

- - - - - - - - {summary.TotalDiscountPrice !== 0.00 && - - - - - - } - - - - - - - - {summary.RoundedOff !== 0.00 && - - - - - } - - - - - - -
Base Total{summary.TotalRawPrice}
After Discount{summary.TotalPriceAfterDiscount}(-{summary.TotalDiscountPrice})
After Tax{summary.TotalPriceAfterTax}(+{summary.TotalTaxAmount})
Rounded Off{summary.RoundedOff}
Grand Total{summary.TotalPrice}
-
- ); -} - -export default SummaryDisplay; diff --git a/src/components/Display/SummaryDisplay.txt b/src/components/Display/SummaryDisplay.txt new file mode 100644 index 0000000..e06eac5 --- /dev/null +++ b/src/components/Display/SummaryDisplay.txt @@ -0,0 +1,132 @@ +/* + * OpenBills - Self hosted browser app to generate and keep track of simple invoices + * Version - 0 + * Licensed under the MIT license - https://opensource.org/licenses/MIT + * + * Copyright (c) 2021 Vidhu Kant Sharma +*/ + +import React from "react"; +import "./Display.scss"; + +interface props { +} + +const getBasicSummary = (items) => { + let totalRawPrice = 0; + let totalQuantity = 0; + + items.some((i) => { + totalRawPrice += i.TotalPrice; + totalQuantity += i.Quantity; + return null; + } + ) + + return ( + { + "TotalRawPrice": totalRawPrice, + "TotalQuantity": totalQuantity + } + ); +} + +// TODO: remove mutability from this function +const getFullSummary = (items) => { + let totalRawPrice = 0; + let totalDiscount = 0; // to be subtracted from totalRawPrice + let totalTax = 0; + + items.some((i) => { + const itemTotalPrice = i.TotalPrice; + const itemDiscount = (i.Discount / 100) * itemTotalPrice; + + totalRawPrice += itemTotalPrice; + totalDiscount += itemDiscount; + totalTax += i.igst === "" + ? ((i.sgst + i.cgst) / 100) * (itemTotalPrice - itemDiscount) + : (i.igst / 100) * (itemTotalPrice - itemDiscount); + return null; + }) + + + + const totalPriceAfterTax = (totalRawPrice - totalDiscount) + totalTax; + const totalRoundedOff = Math.abs(totalPriceAfterTax - Math.round(totalPriceAfterTax)); + return ( + { + "TotalRawPrice": parseFloat(totalRawPrice.toFixed(2)), + "TotalDiscountPrice": parseFloat(totalDiscount.toFixed(2)), + "TotalPriceAfterDiscount": parseFloat((totalRawPrice - totalDiscount).toFixed(2)), + "TotalTaxAmount": parseFloat(totalTax.toFixed(2)), + "TotalPriceAfterTax": parseFloat(totalPriceAfterTax.toFixed(2)), + "RoundedOff": parseFloat(totalRoundedOff.toFixed(2)), + "TotalPrice": Math.round(totalPriceAfterTax) + } + ); +} + +export const SummaryDisplayTR: React.FC = (props) => { + const summary = getBasicSummary(props.items); + + return ( + + Total + + + {summary.TotalQuantity} + + + + + + {summary.TotalRawPrice} + + ); +} + +const SummaryDisplay = (props) => { + const summary = getFullSummary(props.items); + + return ( +
+

Summary

+ + + + + + + + {summary.TotalDiscountPrice !== 0.00 && + + + + + + } + + + + + + + + {summary.RoundedOff !== 0.00 && + + + + + } + + + + + + +
Base Total{summary.TotalRawPrice}
After Discount{summary.TotalPriceAfterDiscount}(-{summary.TotalDiscountPrice})
After Tax{summary.TotalPriceAfterTax}(+{summary.TotalTaxAmount})
Rounded Off{summary.RoundedOff}
Grand Total{summary.TotalPrice}
+
+ ); +} + +export default SummaryDisplay; diff --git a/src/components/Form/Items/AddNewItemForm.tsx b/src/components/Form/Items/AddNewItemForm.tsx index ae64b06..e51ecfc 100644 --- a/src/components/Form/Items/AddNewItemForm.tsx +++ b/src/components/Form/Items/AddNewItemForm.tsx @@ -22,15 +22,15 @@ const AddNewItemForm: React.FC = (props) => { const [itemNameValue, setItemNameValue] = useState(""); const [itemDescValue, setItemDescValue] = useState(""); const [itemPriceValue, setItemPriceValue] = useState(0.00); - const [itemDiscountValue, setItemDiscountValue] = useState(0.00); - const [itemGSTValue, setItemGSTValue] = useState(props.defGSTValue); + const [itemDiscountPercentage, setItemDiscountPercentage] = useState(0.00); + const [itemGSTPercentage, setItemGSTValue] = useState(props.defGSTValue); const [itemQTYValue, setItemQTYValue] = useState(1); const [itemHSNValue, setItemHSNValue] = useState(0); // to be handled by DocumentInfo // check if client is in same state // and apply cgst+sgst or igst accordingly - // const inState: boolean = true; + const inState: boolean = true; const enterItemNamePrompt: string = "start typing here"; const registerItemPrompt: string = "add new"; @@ -57,7 +57,7 @@ const AddNewItemForm: React.FC = (props) => { setItemDescValue(""); setItemQTYValue(1); setItemPriceValue(1); - setItemDiscountValue(0); + setItemDiscountPercentage(0); setItemHSNValue(0); setItemGSTValue(props.defGSTValue); } @@ -68,28 +68,27 @@ const AddNewItemForm: React.FC = (props) => { (event) => { event.preventDefault(); - // TODO: maybe move calculation of GST and Discount here + const discountValue: number = (itemDiscountPercentage / 100) * itemPriceValue; + const totalGSTValue: number = (itemGSTPercentage / 100) * (itemQTYValue); const newInvoiceItem: Item = { - Model: itemNameValue, - Description: itemDescValue, - Quantity: itemQTYValue, - UnitPrice: itemPriceValue, - TotalValue: (itemPriceValue * itemQTYValue), - Discount: itemDiscountValue, - HSN: itemHSNValue, - TotalGST: itemGSTValue, + Model: itemNameValue, + Description: itemDescValue, + Quantity: itemQTYValue, + UnitPrice: itemPriceValue, + TotalValue: itemPriceValue * itemQTYValue, + Discount: itemDiscountPercentage, + DiscountValue: discountValue, + HSN: itemHSNValue, + TotalGST: itemGSTPercentage, + TotalGSTValue: totalGSTValue, // this also checks if igst applies or not - // TODO: fix this - SGST: 0, - CGST: 0, - IGST: 0 - // sgst: inState ? parseInt(itemGSTValue) / 2 : "", - // cgst: inState ? parseInt(itemGSTValue) / 2 : "", - // igst: inState ? "" : parseInt(itemGSTValue) + SGST: inState && totalGSTValue / 2, + CGST: inState && totalGSTValue / 2, + IGST: inState || totalGSTValue } - props.addItem(newInvoiceItem); + props.addItem(newInvoiceItem); resetAllValues(); } }> @@ -144,10 +143,10 @@ const AddNewItemForm: React.FC = (props) => { @@ -164,7 +163,7 @@ const AddNewItemForm: React.FC = (props) => {