From 6f625bb9741b90ea5272914bf7958eed0f42e885 Mon Sep 17 00:00:00 2001 From: MikunoNaka Date: Sun, 29 Aug 2021 11:40:15 +0530 Subject: Fixed SummaryDisplayTR --- src/components/Display/Display.scss | 4 +-- src/components/Display/ItemsDisplay.tsx | 13 +++----- src/components/Display/SummaryDisplay.tsx | 53 ++++++++++++++++++++++++------- src/interfaces.ts | 10 ++++++ 4 files changed, 57 insertions(+), 23 deletions(-) diff --git a/src/components/Display/Display.scss b/src/components/Display/Display.scss index 214cb18..2c0223b 100644 --- a/src/components/Display/Display.scss +++ b/src/components/Display/Display.scss @@ -54,7 +54,7 @@ .SummaryDisplayTR td { color: $foreground2; - font-size: 1.7rem; + font-size: $fontSize3 - 0.3; } .SummaryDisplay { @@ -82,7 +82,7 @@ } .SummaryDisplay td { - font-size: 1.25rem; + font-size: $fontSize2 - 0.25; padding: 0.2rem 0; } diff --git a/src/components/Display/ItemsDisplay.tsx b/src/components/Display/ItemsDisplay.tsx index 78c5094..79eed40 100644 --- a/src/components/Display/ItemsDisplay.tsx +++ b/src/components/Display/ItemsDisplay.tsx @@ -10,7 +10,7 @@ import React from "react"; import { Item } from "./../../interfaces"; import "./Display.scss"; import DisplayItem from "./DisplayItem"; -// import {SummaryDisplayTR} from "./SummaryDisplay"; +import {SummaryDisplayTR} from "./SummaryDisplay"; interface Props { items: Item[] @@ -19,9 +19,6 @@ interface Props { const ItemsDisplay: React.FC = (props) => { const items = props.items; - // TODO: remove mutability - let itemNumber = 0; - return ( @@ -38,19 +35,17 @@ const ItemsDisplay: React.FC = (props) => { {items.map( - (item) => { - itemNumber++ + (item, index) => { return ( - + ); } )} +
); - // this goes right before - // } export default ItemsDisplay; diff --git a/src/components/Display/SummaryDisplay.tsx b/src/components/Display/SummaryDisplay.tsx index 37ba077..ae779bf 100644 --- a/src/components/Display/SummaryDisplay.tsx +++ b/src/components/Display/SummaryDisplay.tsx @@ -7,30 +7,27 @@ */ import React, {Dispatch, SetStateAction} from "react"; -import { Item } from "./../../interfaces" +import { Item, InvoiceSummary } from "./../../interfaces" import "./Display.scss"; -interface props { +interface Props { items: Item[] setShowSubmitMenu: Dispatch> } -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 +interface PropsTR { + items: Item[] } -const getFullSummary = (items: Item[]): FullSummary => { +const getSummary = (items: Item[]): InvoiceSummary => { var rawPrice: number = 0; var totalDiscount: number = 0; var totalGST: number = 0; + var totalQTY: number = 0; for (let i in items) { const item = items[i]; + totalQTY += item.Quantity; rawPrice += item.TotalValue; totalDiscount += item.DiscountValue; totalGST += item.TotalGSTValue; @@ -43,6 +40,7 @@ const getFullSummary = (items: Item[]): FullSummary => { ).toFixed(2)); // rounded off value in 0.00 format return { + TotalQuantity: totalQTY, TotalRawPrice: rawPrice, TotalDiscount: totalDiscount, TotalGST: totalGST, @@ -52,8 +50,39 @@ const getFullSummary = (items: Item[]): FullSummary => { } } -const SummaryDisplay: React.FC = (props) => { - const summary: FullSummary = getFullSummary(props.items); +export const SummaryDisplayTR: React.FC = (props) => { + const summary: InvoiceSummary = getSummary(props.items); + + return ( + + Total + + + + + + + {summary.TotalQuantity} + + + {summary.TotalRawPrice} + + + {summary.TotalDiscount} + + + {summary.TotalGST} + + + {summary.TotalPriceAfterGST} + + + + ); +} + +const SummaryDisplay: React.FC = (props) => { + const summary: InvoiceSummary = getSummary(props.items); return (

Summary

diff --git a/src/interfaces.ts b/src/interfaces.ts index 8363752..53d14c3 100644 --- a/src/interfaces.ts +++ b/src/interfaces.ts @@ -59,3 +59,13 @@ export interface Invoice { Items: Item[] Transport: Transport } + +export interface InvoiceSummary { + TotalQuantity: number + 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 +} -- cgit v1.2.3