aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--package-lock.json77
-rw-r--r--package.json3
-rw-r--r--src/components/Form/Document/DocumentInfoForm.tsx19
-rw-r--r--src/components/Form/Form.scss11
-rw-r--r--src/components/Form/Items/AddNewItemForm.tsx108
5 files changed, 189 insertions, 29 deletions
diff --git a/package-lock.json b/package-lock.json
index 734a6e4..f2a280f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7,6 +7,9 @@
"": {
"version": "0.1.0",
"dependencies": {
+ "@fortawesome/fontawesome-svg-core": "^1.2.35",
+ "@fortawesome/free-solid-svg-icons": "^5.15.3",
+ "@fortawesome/react-fontawesome": "^0.1.14",
"@testing-library/jest-dom": "^5.11.10",
"@testing-library/react": "^11.2.5",
"@testing-library/user-event": "^12.8.3",
@@ -1930,6 +1933,51 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/@fortawesome/fontawesome-common-types": {
+ "version": "0.2.35",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.35.tgz",
+ "integrity": "sha512-IHUfxSEDS9dDGqYwIW7wTN6tn/O8E0n5PcAHz9cAaBoZw6UpG20IG/YM3NNLaGPwPqgjBAFjIURzqoQs3rrtuw==",
+ "hasInstallScript": true,
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/fontawesome-svg-core": {
+ "version": "1.2.35",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.35.tgz",
+ "integrity": "sha512-uLEXifXIL7hnh2sNZQrIJWNol7cTVIzwI+4qcBIq9QWaZqUblm0IDrtSqbNg+3SQf8SMGHkiSigD++rHmCHjBg==",
+ "hasInstallScript": true,
+ "dependencies": {
+ "@fortawesome/fontawesome-common-types": "^0.2.35"
+ },
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/free-solid-svg-icons": {
+ "version": "5.15.3",
+ "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.15.3.tgz",
+ "integrity": "sha512-XPeeu1IlGYqz4VWGRAT5ukNMd4VHUEEJ7ysZ7pSSgaEtNvSo+FLurybGJVmiqkQdK50OkSja2bfZXOeyMGRD8Q==",
+ "hasInstallScript": true,
+ "dependencies": {
+ "@fortawesome/fontawesome-common-types": "^0.2.35"
+ },
+ "engines": {
+ "node": ">=6"
+ }
+ },
+ "node_modules/@fortawesome/react-fontawesome": {
+ "version": "0.1.14",
+ "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.14.tgz",
+ "integrity": "sha512-4wqNb0gRLVaBm/h+lGe8UfPPivcbuJ6ecI4hIgW0LjI7kzpYB9FkN0L9apbVzg+lsBdcTf0AlBtODjcSX5mmKA==",
+ "dependencies": {
+ "prop-types": "^15.7.2"
+ },
+ "peerDependencies": {
+ "@fortawesome/fontawesome-svg-core": "^1.2.32",
+ "react": ">=16.x"
+ }
+ },
"node_modules/@hapi/address": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
@@ -23426,6 +23474,35 @@
}
}
},
+ "@fortawesome/fontawesome-common-types": {
+ "version": "0.2.35",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.35.tgz",
+ "integrity": "sha512-IHUfxSEDS9dDGqYwIW7wTN6tn/O8E0n5PcAHz9cAaBoZw6UpG20IG/YM3NNLaGPwPqgjBAFjIURzqoQs3rrtuw=="
+ },
+ "@fortawesome/fontawesome-svg-core": {
+ "version": "1.2.35",
+ "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.35.tgz",
+ "integrity": "sha512-uLEXifXIL7hnh2sNZQrIJWNol7cTVIzwI+4qcBIq9QWaZqUblm0IDrtSqbNg+3SQf8SMGHkiSigD++rHmCHjBg==",
+ "requires": {
+ "@fortawesome/fontawesome-common-types": "^0.2.35"
+ }
+ },
+ "@fortawesome/free-solid-svg-icons": {
+ "version": "5.15.3",
+ "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.15.3.tgz",
+ "integrity": "sha512-XPeeu1IlGYqz4VWGRAT5ukNMd4VHUEEJ7ysZ7pSSgaEtNvSo+FLurybGJVmiqkQdK50OkSja2bfZXOeyMGRD8Q==",
+ "requires": {
+ "@fortawesome/fontawesome-common-types": "^0.2.35"
+ }
+ },
+ "@fortawesome/react-fontawesome": {
+ "version": "0.1.14",
+ "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.14.tgz",
+ "integrity": "sha512-4wqNb0gRLVaBm/h+lGe8UfPPivcbuJ6ecI4hIgW0LjI7kzpYB9FkN0L9apbVzg+lsBdcTf0AlBtODjcSX5mmKA==",
+ "requires": {
+ "prop-types": "^15.7.2"
+ }
+ },
"@hapi/address": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
diff --git a/package.json b/package.json
index ebaf798..f19c429 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,9 @@
"private": true,
"proxy": "http://localhost:8080",
"dependencies": {
+ "@fortawesome/fontawesome-svg-core": "^1.2.35",
+ "@fortawesome/free-solid-svg-icons": "^5.15.3",
+ "@fortawesome/react-fontawesome": "^0.1.14",
"@testing-library/jest-dom": "^5.11.10",
"@testing-library/react": "^11.2.5",
"@testing-library/user-event": "^12.8.3",
diff --git a/src/components/Form/Document/DocumentInfoForm.tsx b/src/components/Form/Document/DocumentInfoForm.tsx
index 6193233..18d0be5 100644
--- a/src/components/Form/Document/DocumentInfoForm.tsx
+++ b/src/components/Form/Document/DocumentInfoForm.tsx
@@ -8,10 +8,13 @@
import React, { useState } from "react";
import { Person } from "./../../../interfaces";
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faSync } from '@fortawesome/free-solid-svg-icons'
import "./../Form.scss";
import SelectClientForm from "./../People/SelectClientForm";
+
interface Props {
savedPeople: Person[]
invoiceNumber: number
@@ -29,9 +32,19 @@ const DocumentInfoForm: React.FC<Props> = (props) => {
<div className={"documentInfoChild"}>
<label>
Invoice Number:
- <input className={"smallInputBox"} type="number" step="0.0" value={invoiceNumber} onInput={
- (event: React.FormEvent<HTMLInputElement>) => setInvoiceNumber(parseInt(event.currentTarget.value))
- } required />
+ <span className={"buttonInput"}>
+ {invoiceNumber === props.invoiceNumber ||
+ <FontAwesomeIcon icon={faSync} className={"icon"} onClick={
+ (event) => {
+ event.preventDefault(); // don't select the input box
+ setInvoiceNumber(props.invoiceNumber);
+ }
+ }/>
+ }
+ <input className={"smallInputBox"} type="number" step="0.0" value={invoiceNumber}
+ onInput={(event: React.FormEvent<HTMLInputElement>) => setInvoiceNumber(parseInt(event.currentTarget.value))}
+ required />
+ </span>
</label>
<label>
diff --git a/src/components/Form/Form.scss b/src/components/Form/Form.scss
index a850309..91ba8b1 100644
--- a/src/components/Form/Form.scss
+++ b/src/components/Form/Form.scss
@@ -50,6 +50,17 @@ input[type=number] {
input {
box-sizing: border-box;
+ height: $fontSize2 + 0.25;
+}
+
+.buttonInput .icon {
+ margin-right: 0.5rem;
+ font-size: $fontSize1 + 0.5;
+ margin-bottom: -0.25rem;
+}
+
+.icon:hover {
+ color: $altFG;
}
.wideInputBox, .selectInputBox {
diff --git a/src/components/Form/Items/AddNewItemForm.tsx b/src/components/Form/Items/AddNewItemForm.tsx
index 3d4e65f..7060f51 100644
--- a/src/components/Form/Items/AddNewItemForm.tsx
+++ b/src/components/Form/Items/AddNewItemForm.tsx
@@ -7,10 +7,12 @@
*/
import React, { useState } from "react";
-import "./../Form.scss";
import { Item } from "../../../interfaces";
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { faSync } from '@fortawesome/free-solid-svg-icons'
+import "./../Form.scss";
-interface props {
+interface Props {
savedItems: Item[]
addItem: (item: Item) => void
defGSTValue: number
@@ -18,15 +20,23 @@ interface props {
registerPersonFormVisibility: any
}
-const AddNewItemForm: React.FC<props> = (props) => {
+const AddNewItemForm: React.FC<Props> = (props) => {
const [itemNameValue, setItemNameValue] = useState<string>("");
const [itemDescValue, setItemDescValue] = useState<string>("");
const [itemPriceValue, setItemPriceValue] = useState<number>(0.00);
const [itemDiscountPercentage, setItemDiscountPercentage] = useState<number>(0.00);
- const [itemGSTPercentage, setItemGSTValue] = useState<number>(props.defGSTValue);
+ const [itemGSTPercentage, setItemGSTPercentage] = useState<number>(props.defGSTValue);
const [itemQTYValue, setItemQTYValue] = useState<number>(1);
const [itemHSNValue, setItemHSNValue] = useState<string>("");
+ // store the current item to easily reset a value to the default one
+ const [currentItem, setCurrentItem] = useState<Item|any>({
+ Description: "",
+ UnitPrice: 0.00,
+ GSTPercentage: props.defGSTValue,
+ HSN: ""
+ });
+
// to be handled by DocumentInfo
// check if client is in same state
// and apply cgst+sgst or igst accordingly
@@ -41,8 +51,10 @@ const AddNewItemForm: React.FC<props> = (props) => {
setItemDescValue(i.Description);
setItemPriceValue(i.UnitPrice);
setItemHSNValue(i.HSN);
- setItemGSTValue(i.TotalGST);
+ setItemGSTPercentage(i.TotalGST);
+ setCurrentItem(i)
}
+ console.log(currentItem)
// check the item name value and do stuff accordingly
const setItemInfo = (itemName: string) =>
@@ -58,7 +70,7 @@ const AddNewItemForm: React.FC<props> = (props) => {
setItemPriceValue(1);
setItemDiscountPercentage(0);
setItemHSNValue("");
- setItemGSTValue(props.defGSTValue);
+ setItemGSTPercentage(props.defGSTValue);
}
return (
@@ -70,8 +82,12 @@ const AddNewItemForm: React.FC<props> = (props) => {
const totalValue: number = itemPriceValue * itemQTYValue;
// the values below are being rounded to two decimal places
- const discountValue: number = parseFloat(((itemDiscountPercentage / 100) * totalValue).toFixed(2))
- const totalGSTValue: number = parseFloat(((itemGSTPercentage / 100) * totalValue).toFixed(2))
+ // i see no reason doing this anymore
+ // const discountvalue: number = parsefloat(((itemdiscountpercentage / 100) * totalvalue).tofixed(2))
+ // const totalgstvalue: number = parsefloat(((itemgstpercentage / 100) * totalvalue).tofixed(2))
+
+ const discountValue: number = (itemDiscountPercentage / 100) * totalValue;
+ const totalGSTValue: number = (itemGSTPercentage / 100) * totalValue;
const newInvoiceItem: Item = {
Model: itemNameValue,
@@ -117,9 +133,19 @@ const AddNewItemForm: React.FC<props> = (props) => {
<label>
Description:
- <input className={"wideInputBox"} type="text" value={itemDescValue}
- onChange={(event) => setItemDescValue(event.target.value)}
- />
+ <span className={"buttonInput"}>
+ {itemDescValue === currentItem.Description ||
+ <FontAwesomeIcon icon={faSync} className={"icon"} onClick={
+ (event) => {
+ event.preventDefault(); // don't select the input box
+ setItemDescValue(currentItem.Description);
+ }
+ }/>
+ }
+ <input className={"wideInputBox"} type="text" value={itemDescValue}
+ onChange={(event) => setItemDescValue(event.target.value)}
+ />
+ </span>
</label>
</div>
@@ -136,12 +162,22 @@ const AddNewItemForm: React.FC<props> = (props) => {
<label>
Price:
- <input className={"smallInputBox"} type="number" min="1.00" step="0.001" value={itemPriceValue}
- onInput={
- (event: React.FormEvent<HTMLInputElement>) =>
- setItemPriceValue(parseFloat(event.currentTarget.value))
- }
- required />
+ <span className={"buttonInput"}>
+ {itemPriceValue === currentItem.UnitPrice ||
+ <FontAwesomeIcon icon={faSync} className={"icon"} onClick={
+ (event) => {
+ event.preventDefault(); // don't select the input box
+ setItemPriceValue(currentItem.UnitPrice);
+ }
+ }/>
+ }
+ <input className={"smallInputBox"} type="number" min="1.00" step="0.001" value={itemPriceValue}
+ onInput={
+ (event: React.FormEvent<HTMLInputElement>) =>
+ setItemPriceValue(parseFloat(event.currentTarget.value))
+ }
+ required />
+ </span>
</label>
<label>
@@ -156,19 +192,39 @@ const AddNewItemForm: React.FC<props> = (props) => {
<label>
HSN:
- <input className={"smallInputBox"} type="number" min="0" value={itemHSNValue}
- onChange={(event) => setItemHSNValue(event.target.value)}
- required />
+ <span className={"buttonInput"}>
+ {itemHSNValue === currentItem.HSN ||
+ <FontAwesomeIcon icon={faSync} className={"icon"} onClick={
+ (event) => {
+ event.preventDefault(); // don't select the input box
+ setItemHSNValue(currentItem.HSN);
+ }
+ }/>
+ }
+ <input className={"smallInputBox"} type="number" min="0" value={itemHSNValue}
+ onChange={(event) => setItemHSNValue(event.target.value)}
+ required />
+ </span>
</label>
<label>
GST:
- <input className={"smallInputBox"} type="number" min="0" value={itemGSTPercentage}
- onInput={
- (event: React.FormEvent<HTMLInputElement>) =>
- setItemGSTValue(parseInt(event.currentTarget.value))
- }
- required />
+ <span className={"buttonInput"}>
+ {itemGSTPercentage === currentItem.TotalGST ||
+ <FontAwesomeIcon icon={faSync} className={"icon"} onClick={
+ (event) => {
+ event.preventDefault(); // don't select the input box
+ setItemGSTPercentage(currentItem.TotalGST);
+ }
+ }/>
+ }
+ <input className={"smallInputBox"} type="number" min="0" value={itemGSTPercentage}
+ onInput={
+ (event: React.FormEvent<HTMLInputElement>) =>
+ setItemGSTPercentage(parseInt(event.currentTarget.value))
+ }
+ required />
+ </span>
</label>
</div>
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-22 01:36:14 +0000