diff options
Diffstat (limited to 'src/components/Form/Items')
| -rw-r--r-- | src/components/Form/Items/AddNewItemForm.tsx | 63 | ||||
| -rw-r--r-- | src/components/Form/Items/RegisterItemForm.tsx (renamed from src/components/Form/Items/RegisterItemForm.js) | 62 |
2 files changed, 49 insertions, 76 deletions
diff --git a/src/components/Form/Items/AddNewItemForm.tsx b/src/components/Form/Items/AddNewItemForm.tsx index 283d779..ae64b06 100644 --- a/src/components/Form/Items/AddNewItemForm.tsx +++ b/src/components/Form/Items/AddNewItemForm.tsx @@ -13,13 +13,12 @@ import { Item } from "../../../interfaces"; interface props { savedItems: Item[] addItem: (item: Item) => void - defGSTValue: number, - registerItemFormVisibility: any, + defGSTValue: number + registerItemFormVisibility: any registerPersonFormVisibility: any } const AddNewItemForm: React.FC<props> = (props) => { - console.log(props) const [itemNameValue, setItemNameValue] = useState<string>(""); const [itemDescValue, setItemDescValue] = useState<string>(""); const [itemPriceValue, setItemPriceValue] = useState<number>(0.00); @@ -35,18 +34,19 @@ const AddNewItemForm: React.FC<props> = (props) => { const enterItemNamePrompt: string = "start typing here"; const registerItemPrompt: string = "add new"; - const emptyItemNames: any[] = [enterItemNamePrompt, registerItemPrompt, ""]; + const emptyItemNames: string[] = [enterItemNamePrompt, registerItemPrompt, ""]; // set description and price if match found in DB const applyItemInfo = (i: any) => { + console.log(i) setItemDescValue(i.Description); - setItemPriceValue(i.Price); + setItemPriceValue(i.UnitPrice); setItemHSNValue(i.HSN); - setItemGSTValue(i.GST); + setItemGSTValue(i.TotalGST); } // check the item name value and do stuff accordingly - const setItemInfo = (itemName: any) => + const setItemInfo = (itemName: string) => (props.savedItems === null || itemName === registerItemPrompt) ? props.registerItemFormVisibility(true) : props.savedItems.some((i) => @@ -77,12 +77,13 @@ const AddNewItemForm: React.FC<props> = (props) => { TotalValue: (itemPriceValue * itemQTYValue), Discount: itemDiscountValue, HSN: itemHSNValue, + TotalGST: itemGSTValue, // this also checks if igst applies or not // TODO: fix this - sgst: 0, - cgst: 0, - igst: 0 + SGST: 0, + CGST: 0, + IGST: 0 // sgst: inState ? parseInt(itemGSTValue) / 2 : "", // cgst: inState ? parseInt(itemGSTValue) / 2 : "", // igst: inState ? "" : parseInt(itemGSTValue) @@ -115,11 +116,7 @@ const AddNewItemForm: React.FC<props> = (props) => { <label> Description: <input className={"wideInputBox"} type="text" value={itemDescValue} - onChange={ - (event) => { - setItemDescValue(event.target.value); - } - } + onChange={(event) => setItemDescValue(event.target.value)} /> </label> </div> @@ -129,10 +126,8 @@ const AddNewItemForm: React.FC<props> = (props) => { Quantity: <input className={"smallInputBox"} type="number" min="1" value={itemQTYValue} onInput={ - (event: React.FormEvent<HTMLInputElement>) => { - const value: number = parseInt(event.currentTarget.value); - setItemQTYValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setItemQTYValue(parseInt(event.currentTarget.value)) } required /> </label> @@ -141,10 +136,8 @@ const AddNewItemForm: React.FC<props> = (props) => { Price: <input className={"smallInputBox"} type="number" min="1.00" step="0.001" value={itemPriceValue} onInput={ - (event: React.FormEvent<HTMLInputElement>) => { - const value: number = parseFloat(event.currentTarget.value); - setItemPriceValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setItemPriceValue(parseFloat(event.currentTarget.value)) } required /> </label> @@ -153,10 +146,8 @@ const AddNewItemForm: React.FC<props> = (props) => { Discount: <input className={"smallInputBox"} type="number" min="0" step="0.001" value={itemDiscountValue} onInput={ - (event: React.FormEvent<HTMLInputElement>) => { - const value: number = parseInt(event.currentTarget.value); - setItemDiscountValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setItemDiscountValue(parseInt(event.currentTarget.value)) } /> </label> @@ -165,10 +156,8 @@ const AddNewItemForm: React.FC<props> = (props) => { HSN: <input className={"smallInputBox"} type="number" min="0" value={itemHSNValue} onInput={ - (event: React.FormEvent<HTMLInputElement>) => { - const value: number = parseInt(event.currentTarget.value); - setItemHSNValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setItemHSNValue(parseInt(event.currentTarget.value)) } required /> </label> @@ -177,10 +166,8 @@ const AddNewItemForm: React.FC<props> = (props) => { GST: <input className={"smallInputBox"} type="number" min="0" value={itemGSTValue} onInput={ - (event: React.FormEvent<HTMLInputElement>) => { - const value: number = parseInt(event.currentTarget.value); - setItemGSTValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setItemGSTValue(parseInt(event.currentTarget.value)) } required /> </label> @@ -197,10 +184,6 @@ const AddNewItemForm: React.FC<props> = (props) => { onClick={() => props.registerItemFormVisibility(true)} /> - <input type="button" value="Placeholder1" /> - <input type="button" value="Placeholder2" /> - <input type="submit" value="Force Add" /> - <input type="submit" value="add" disabled={ (emptyItemNames.includes(itemNameValue) @@ -213,7 +196,7 @@ const AddNewItemForm: React.FC<props> = (props) => { </div> </form> </div> - ) + ); } export default AddNewItemForm; diff --git a/src/components/Form/Items/RegisterItemForm.js b/src/components/Form/Items/RegisterItemForm.tsx index 6ad4c1f..dc48d3c 100644 --- a/src/components/Form/Items/RegisterItemForm.js +++ b/src/components/Form/Items/RegisterItemForm.tsx @@ -15,25 +15,29 @@ import React, { useState } from "react"; import axios from "axios"; import "./../Form.scss"; +interface props { + defGSTValue: number + setVisibility: any // this component's visibility + updateItemsList: () => Promise<void> +} -const RegisterItemForm = (props) => { - const [newItemNameValue, setNewItemNameValue] = useState(""); - const [newItemDescValue, setNewItemDescValue] = useState(""); - const [newItemPriceValue, setNewItemPriceValue] = useState(0.00); - const [newItemHSNValue, setNewItemHSNValue] = useState(""); - const [newItemGSTValue, setNewItemGSTValue] = useState(props.defGSTValue); +const RegisterItemForm: React.FC<props> = (props) => { + const [newItemNameValue, setNewItemNameValue] = useState<string>(""); + const [newItemDescValue, setNewItemDescValue] = useState<string>(""); + const [newItemPriceValue, setNewItemPriceValue] = useState<number>(0.00); + const [newItemHSNValue, setNewItemHSNValue] = useState<number>(); + const [newItemGSTValue, setNewItemGSTValue] = useState<number>(props.defGSTValue); // const [newItemBrandValue, setNewItemBrandValue] = useState(""); // const [newItemTypeValue, setNewItemTypeValue] = useState(""); const hideSelf = () => props.setVisibility(false); - const closeOnBGClicked = (event) => + const closeOnBGClicked = (event: any) => event.target.className === "floatingMenuBG" && hideSelf(); - const postForm = (event) => { + const postForm = (event: any) => { event.preventDefault(); - - // TODO: show confirmation before being invisible + // TODO: show confirmation before being invisible axios.post( `/api/items/register/` + `?model=${newItemNameValue}` @@ -44,7 +48,7 @@ const RegisterItemForm = (props) => { ) .then((res) => { console.log(res); - props.setVisibility(false); + hideSelf(); props.updateItemsList(); }) .catch((err) => { @@ -63,17 +67,13 @@ const RegisterItemForm = (props) => { <div className={"widePane formPane"}> <label> Item/Service: <input className={"wideInputBox"} type="text" value={newItemNameValue} onChange={ - (event) => { - setNewItemNameValue(event.target.value); - } + (event) => setNewItemNameValue(event.target.value) } required /> </label> <label> Description: <input className={"wideInputBox"} type="text" value={newItemDescValue} onChange={ - (event) => { - setNewItemDescValue(event.target.value); - } + (event) => setNewItemDescValue(event.target.value) } /> </label> @@ -81,48 +81,38 @@ const RegisterItemForm = (props) => { <div className={"widePane formPane"}> <label> Price: <input className={"smallInputBox"} type="number" min="0.00" step="0.001" value={newItemPriceValue} onChange={ - (event) => { - const value = event.target.value; - setNewItemPriceValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setNewItemPriceValue(parseInt(event.currentTarget.value)) } /> </label> <label> HSN: <input className={"smallInputBox"} type="number" min="0" value={newItemHSNValue} onChange={ - (event) => { - const value = event.target.value; - setNewItemHSNValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setNewItemHSNValue(parseInt(event.currentTarget.value)) } /> </label> <label> GST: <input className={"smallInputBox"} type="number" min="0" value={newItemGSTValue} onChange={ - (event) => { - const value = event.target.value; - setNewItemGSTValue(value); - } + (event: React.FormEvent<HTMLInputElement>) => + setNewItemGSTValue(parseInt(event.currentTarget.value)) } /> </label> - </div> + </div> </div> <div className={"menu"}> <input type="button" value="cancel" - onClick={ - () => { - props.setVisibility(false); - } - } + onClick={() => hideSelf()} /> <input type="submit" value="Register/Add" - disabled={newItemNameValue !== "" ? "" : "disabled"} + disabled={newItemNameValue === "" ? true : false} /> </div> </form> |