aboutsummaryrefslogtreecommitdiff
path: root/src/components/Form/Items/AddNewItemForm.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Form/Items/AddNewItemForm.js')
-rw-r--r--src/components/Form/Items/AddNewItemForm.js203
1 files changed, 0 insertions, 203 deletions
diff --git a/src/components/Form/Items/AddNewItemForm.js b/src/components/Form/Items/AddNewItemForm.js
deleted file mode 100644
index 37167fd..0000000
--- a/src/components/Form/Items/AddNewItemForm.js
+++ /dev/null
@@ -1,203 +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, { useState } from "react";
-import "./../Form.scss";
-
-const AddNewItemForm = (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 [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 = true;
-
- const enterItemNamePrompt = "start typing here";
- const registerItemPrompt = "add new";
- const emptyItemNames = [enterItemNamePrompt, registerItemPrompt, ""];
-
- // set description and price if match found in DB
- const applyItemInfo = (i) => {
- setItemDescValue(i.Description);
- setItemPriceValue(i.Price);
- setItemHSNValue(i.HSN);
- setItemGSTValue(i.GST);
- }
-
- // check the item name value and do stuff accordingly
- const setItemInfo = (itemName) =>
- (props.savedItems === null || itemName === registerItemPrompt)
- ? props.registerItemFormVisibility(true)
- : props.savedItems.some((i) =>
- itemName === i.Model.toLowerCase() && applyItemInfo(i))
-
- const resetAllValues = () => {
- setItemNameValue("");
- setItemDescValue("");
- setItemQtyValue(1);
- setItemPriceValue(1);
- setItemDiscountValue(0);
- setItemHSNValue(0);
- setItemGSTValue(props.defGSTValue);
- }
-
- return (
- <div className={"formContainer"}>
- <form className={"threePaneForm"} onSubmit={
- (event) => {
- event.preventDefault();
- const newInvoiceItem = {
- "Model": itemNameValue,
- "Description": itemDescValue,
- "Quantity": parseInt(itemQtyValue),
- "UnitPrice": parseFloat(itemPriceValue),
- "TotalPrice": parseFloat(itemPriceValue * itemQtyValue),
- "Discount": parseInt(itemDiscountValue),
- "HSN": parseInt(itemHSNValue),
-
- // this also checks if igst applies or not
- "sgst": inState ? parseInt(itemGSTValue) / 2 : "",
- "cgst": inState ? parseInt(itemGSTValue) / 2 : "",
- "igst": inState ? "" : parseInt(itemGSTValue)
- };
- console.log(newInvoiceItem);
- props.addItem(newInvoiceItem);
- resetAllValues();
- }
- }>
- <div className={"widePane formPane"}>
- <label>
- Item/Service:
- <select
- className={"selectInputBox"}
- value={itemNameValue}
- onChange={
- (event) => {
- setItemNameValue(event.target.value);
- setItemInfo(event.target.value.toLowerCase());
- }
- }>
- <option key={enterItemNamePrompt}>{enterItemNamePrompt}</option>
- {props.savedItems !== null && props.savedItems.map(
- (i) => <option key={i.Model}>{i.Model}</option>
- )}
- <option key={registerItemPrompt}>{registerItemPrompt}</option>
- </select>
- </label>
-
- <label>
- Description:
- <input className={"wideInputBox"} type="text" value={itemDescValue}
- onChange={
- (event) => {
- setItemDescValue(event.target.value);
- }
- }
- />
- </label>
- </div>
-
- <div className={"widePane formPane"}>
- <label>
- Quantity:
- <input className={"smallInputBox"} type="number" min="1" value={itemQtyValue}
- onInput={
- (event) => {
- const value = event.target.value;
- setItemQtyValue(value);
- }
- }
- required />
- </label>
-
- <label>
- Price:
- <input className={"smallInputBox"} type="number" min="1.00" step="0.001" value={itemPriceValue}
- onChange={
- (event) => {
- const value = event.target.value;
- setItemPriceValue(value);
- }
- }
- required />
- </label>
-
- <label>
- Discount:
- <input className={"smallInputBox"} type="number" min="0" step="0.001" value={itemDiscountValue}
- onChange={
- (event) => {
- const value = event.target.value;
- setItemDiscountValue(value);
- }
- }
- />
- </label>
-
- <label>
- HSN:
- <input className={"smallInputBox"} type="number" min="0" value={itemHSNValue}
- onChange={
- (event) => {
- const value = event.target.value;
- setItemHSNValue(value);
- }
- }
- required />
- </label>
-
- <label>
- GST:
- <input className={"smallInputBox"} type="number" min="0" value={itemGSTValue}
- onChange={
- (event) => {
- const value = event.target.value;
- setItemGSTValue(value);
- }
- }
- required />
- </label>
- </div>
-
- <div className={"smallPane formPane"}>
- <input type="button"
- value="Register New Client"
- onClick={() => props.registerPersonFormVisibility(true)}
- />
-
- <input type="button"
- value="Register New Item"
- 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)
- || itemQtyValue <= 0
- || itemPriceValue <= 0
- || itemGSTValue <= 0
- ) ? "disabled" : ""
- }
- />
- </div>
- </form>
- </div>
- )
-}
-
-export default AddNewItemForm;