aboutsummaryrefslogtreecommitdiff
path: root/src/components/Display
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Display')
-rw-r--r--src/components/Display/SummaryDisplay.tsx116
-rw-r--r--src/components/Display/SummaryDisplay.txt132
2 files changed, 116 insertions, 132 deletions
diff --git a/src/components/Display/SummaryDisplay.tsx b/src/components/Display/SummaryDisplay.tsx
new file mode 100644
index 0000000..9488836
--- /dev/null
+++ b/src/components/Display/SummaryDisplay.tsx
@@ -0,0 +1,116 @@
+/*
+ * 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 { Item } from "./../../interfaces"
+import "./Display.scss";
+
+interface props {
+ items: Item[]
+}
+
+interface FullSummary {
+ TotalRawPrice: number // total price without gst/discount
+ TotalDiscount: number // total amount of discount
+ TotalGST: number // total gst to be paid
+ TotalPriceAfterDiscount: number
+ TotalPriceAfterGST: number
+ TotalRoundedOff: number
+}
+
+const getFullSummary = (items: Item[]): FullSummary => {
+ var rawPrice: number = 0;
+ var totalDiscount: number = 0;
+ var totalGST: number = 0;
+
+ for (let i in items) {
+ const item = items[i];
+ rawPrice += item.TotalValue;
+ totalDiscount += item.DiscountValue;
+ totalGST += item.TotalGSTValue;
+ }
+
+ const totalPriceAfterDiscount: number = rawPrice - totalDiscount;
+ const totalPriceAfterGST: number = totalPriceAfterDiscount + totalGST;
+ const totalRoundedOff: number = parseFloat(Math.abs(
+ (totalPriceAfterGST) - Math.round(totalPriceAfterGST)
+ ).toFixed(2)); // rounded off value in 0.00 format
+
+ return {
+ TotalRawPrice: rawPrice,
+ TotalDiscount: totalDiscount,
+ TotalGST: totalGST,
+ TotalPriceAfterDiscount: totalPriceAfterDiscount,
+ TotalPriceAfterGST: totalPriceAfterGST,
+ TotalRoundedOff: totalRoundedOff
+ }
+}
+
+// export const SummaryDisplayTR: React.FC<props> = (props) => {
+// const summary = getBasicSummary(props.items);
+//
+// return (
+// <tr className={"SummaryDisplayTR"}>
+// <td>Total</td>
+// <td className={"disabledBorder"}></td>
+// <td className={"disabledBorder"}></td>
+// <td>{summary.TotalQuantity}</td>
+// <td className={"disabledBorder"}></td>
+// <td className={"disabledBorder"}></td>
+// <td className={"disabledBorder"}></td>
+// <td className={"disabledBorder"}></td>
+// <td className={"disabledBorder"}></td>
+// <td>{summary.TotalRawPrice}</td>
+// </tr>
+// );
+// }
+
+const SummaryDisplay: React.FC<props> = (props) => {
+ const summary: FullSummary = getFullSummary(props.items);
+ return (
+ <div className={"SummaryDisplay"}>
+ <h1>Summary</h1>
+ <table>
+ <tbody>
+ <tr>
+ <td>Base Total</td>
+ <td>{summary.TotalRawPrice}</td>
+ </tr>
+
+ {summary.TotalDiscount !== 0.00 &&
+ <tr>
+ <td>After Discount</td>
+ <td>{summary.TotalPriceAfterDiscount}</td>
+ <td>(-{summary.TotalDiscount})</td>
+ </tr>
+ }
+
+ <tr>
+ <td>After Tax</td>
+ <td>{summary.TotalRawPrice + summary.TotalGST}</td>
+ <td>(+{summary.TotalGST})</td>
+ </tr>
+
+ {summary.TotalRoundedOff !== 0.00 &&
+ <tr>
+ <td>Rounded Off</td>
+ <td>{summary.TotalRoundedOff}</td>
+ </tr>
+ }
+
+ <tr className={"grandTotal"}>
+ <td>Grand Total</td>
+ <td>{summary.TotalRawPrice + (summary.TotalGST - summary.TotalDiscount)}</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ );
+}
+
+export default SummaryDisplay;
diff --git a/src/components/Display/SummaryDisplay.txt b/src/components/Display/SummaryDisplay.txt
deleted file mode 100644
index e06eac5..0000000
--- a/src/components/Display/SummaryDisplay.txt
+++ /dev/null
@@ -1,132 +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";
-
-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> = (props) => {
- const summary = getBasicSummary(props.items);
-
- return (
- <tr className={"SummaryDisplayTR"}>
- <td>Total</td>
- <td className={"disabledBorder"}></td>
- <td className={"disabledBorder"}></td>
- <td>{summary.TotalQuantity}</td>
- <td className={"disabledBorder"}></td>
- <td className={"disabledBorder"}></td>
- <td className={"disabledBorder"}></td>
- <td className={"disabledBorder"}></td>
- <td className={"disabledBorder"}></td>
- <td>{summary.TotalRawPrice}</td>
- </tr>
- );
-}
-
-const SummaryDisplay = (props) => {
- const summary = getFullSummary(props.items);
-
- return (
- <div className={"SummaryDisplay"}>
- <h1>Summary</h1>
- <table>
- <tbody>
- <tr>
- <td>Base Total</td>
- <td>{summary.TotalRawPrice}</td>
- </tr>
-
- {summary.TotalDiscountPrice !== 0.00 &&
- <tr>
- <td>After Discount</td>
- <td>{summary.TotalPriceAfterDiscount}</td>
- <td>(-{summary.TotalDiscountPrice})</td>
- </tr>
- }
-
- <tr>
- <td>After Tax</td>
- <td>{summary.TotalPriceAfterTax}</td>
- <td>(+{summary.TotalTaxAmount})</td>
- </tr>
-
- {summary.RoundedOff !== 0.00 &&
- <tr>
- <td>Rounded Off</td>
- <td>{summary.RoundedOff}</td>
- </tr>
- }
-
- <tr className={"grandTotal"}>
- <td>Grand Total</td>
- <td>{summary.TotalPrice}</td>
- </tr>
- </tbody>
- </table>
- </div>
- );
-}
-
-export default SummaryDisplay;