\r\n \r\n .\r\n {feedback}\r\n
\r\n {JSON.parse(sessionStorage.getItem('userLoginDeets')).businessUnit}
\r\n \r\n {/* Collapse */}\r\n \r\n \r\n {logo ? (\r\n 
\r\n \r\n ) : (\r\n \r\n \r\n \r\n )}\r\n \r\n ) : null}\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n {/* Form */}\r\n \r\n {/* Navigation */}\r\n \r\n {/* Divider */}\r\n \r\n {/* Heading */}\r\n
\r\n
\r\n \r\nsetShow(false)}\r\n >\r\n ×\r\n \r\n
\r\n\r\n \r\n List of Payments\r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n
\r\n \r\n | Date | */}\r\nDate | \r\nAmount | \r\n{/* \r\n\r\n Paid to date\r\n | */}\r\n\r\n Reference\r\n | \r\n\r\n Remarks\r\n | \r\n \r\n
|---|---|---|---|---|---|
| {moment(item?.paymentDate,\"DD-MM-YYYY\").format(\"DD/MMM/YYYY\")} | \r\n{item?.currency }{\" \"}{moneyInTxt(item?.amount)} | \r\n {/*{item?.duration} | */}\r\n {/*{moneyInTxt(item?.paidToDateFc)} | */}\r\n{item?.reference} | \r\n{item?.remarks} | \r\n\r\n
\r\n \r\n \r\n {/* \r\n Close\r\n */}\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nexport default Loader\r\n","import React, { useEffect, useState } from 'react'\r\nimport { toast } from 'react-toastify'\r\nimport { Modal, Row, Col, Button, FormGroup, Input } from 'reactstrap'\r\n\r\nconst AddItem = ({\r\n formData,\r\n services,\r\n currency,\r\n addRecordToData,\r\n handleServiceType,\r\n setShowAddItem,\r\n setFormData,\r\n disabled,\r\n setCurrency,\r\n setBank\r\n ,invoiceId,\r\n setServices\r\n}) => {\r\n \r\n const [quantity, setQuantity] = useState(1);\r\n const [manuallyEnteredPrice, setManuallyEnteredPrice] = useState(\"\");\r\n\r\n const handleReset=()=>{\r\n setShowAddItem(false)\r\n setCurrency(\"\")\r\n setQuantity(1);\r\n setManuallyEnteredPrice(\"\");\r\n }\r\n\r\nconst handleAdd=()=>{\r\n if(!(formData.price > 0)){\r\n if(manuallyEnteredPrice > 0){\r\n formData['price'] = manuallyEnteredPrice;\r\n formData['quantity'] = quantity\r\n //setFormData({...formData, quantity: quantity, price: manuallyEnteredPrice});\r\n addRecordToData(formData)\r\n } \r\n else{\r\n if(quantity <= 0){\r\n toast.warning(\"Please enter quantity greather than 0\")\r\n }\r\n\r\n if(manuallyEnteredPrice <=0){\r\n toast.warning(\"Please enter price greather than 0\")\r\n }\r\n }\r\n \r\n }else{ \r\n if(quantity <= 0){\r\n toast.warning(\"Please enter quantity greather than 0\")\r\n }else{\r\n formData['quantity'] = quantity\r\n addRecordToData(formData)\r\n }\r\n }\r\n}\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default AddItem\r\n","import { Card } from 'reactstrap'\r\nconst SuggestionsList = ({\r\n filteredSuggestions,\r\n activeSuggestionIndex,\r\n onClick,\r\n}) => {\r\n return filteredSuggestions.length ? (\r\n \r\n \r\n handleReset()}\r\n >\r\n ×\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {services?.map((service, index) => (\r\n \r\n ))}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n setQuantity(e.target.value)}\r\n />\r\n \r\n \r\n \r\n \r\n 0 && true}\r\n className='form-control sel-sm'\r\n id='input-country'\r\n placeholder='Price'\r\n type='number'\r\n value={formData.price > 0 ? formData.price : manuallyEnteredPrice}\r\n onChange={(e) =>\r\n {\r\n if(!(formData.price >0)){\r\n setManuallyEnteredPrice(e.target.value)\r\n }else{\r\n \r\n setManuallyEnteredPrice(\"\")\r\n }\r\n }\r\n }\r\n />\r\n \r\n \r\n
\r\n\r\n \r\n handleAdd()}\r\n type='button'\r\n style={{ width: '100%' }}\r\n size='sm'\r\n >\r\n ADD\r\n \r\n \r\n
\r\n
\r\n - onClick(suggestion)}>\r\n {suggestion.name}\r\n
\r\n Customer not found on the list\r\n
\r\n )\r\n}\r\n\r\nexport default SuggestionsList\r\n","import React, { useState } from 'react'\r\nimport { Input, InputGroup, InputGroupAddon, InputGroupText } from 'reactstrap'\r\nimport SuggestionsList from './SuggestionsList'\r\n\r\nconst Autocomplete = ({ suggestions, formData, setFormData }) => {\r\n const [filteredSuggestions, setFilteredSuggestions] = useState([])\r\n const [activeSuggestionIndex, setActiveSuggestionIndex] = useState(0)\r\n const [showSuggestions, setShowSuggestions] = useState(false)\r\n const [input, setInput] = useState('')\r\n\r\n const onChange = (e) => {\r\n const userInput = e.target.value\r\n\r\n // Filter our suggestions that don't contain the user's input\r\n const unLinked = suggestions.filter((suggestion) =>\r\n suggestion.name.toLowerCase().includes(userInput.toLowerCase())\r\n )\r\n setInput(e.target.value)\r\n setFormData({ ...formData, customerName: userInput })\r\n setFilteredSuggestions(unLinked)\r\n setActiveSuggestionIndex(0)\r\n setShowSuggestions(true)\r\n }\r\n\r\n const onClick = (suggestion) => {\r\n //console.log(suggestion)\r\n setFilteredSuggestions([])\r\n setInput(suggestion.name)\r\n setFormData({\r\n ...formData,\r\n customerName: suggestion.name,\r\n customerEmail: suggestion.email,\r\n customerTel: suggestion.telephone,\r\n customerCode: suggestion.code,\r\n serviceProviderId: suggestion?.id\r\n })\r\n setActiveSuggestionIndex(0)\r\n setShowSuggestions(false)\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n ![]({require(\"../assets/img/theme/npa.png\").default})
\r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
\r\n
\r\n\r\n \r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
Adj. Petroleum Commission\r\n
\r\n Dzorwulu Accra.\r\n
\r\n \r\n
\r\n INVOICE
\r\nIssued on : {moment().format(\"DD MMMM YYYY\")}
\r\n\r\n Due Date:{\" \"}\r\n {formData\r\n ? moment(formData.dueDate).format(\"DD MMMM YYYY\")\r\n : \" \"}\r\n
\r\n\r\n
\r\n\r\n Invoice for: {formData.customerName}
\r\n\r\n {/*{formData.businessUnit}
*/}\r\n\r\n \r\n \r\n
\r\n
\r\n | \r\n {\" \"}\r\n Code\r\n | \r\n\r\n Description\r\n | \r\n\r\n QTY\r\n | \r\n\r\n Price\r\n | \r\n\r\n Amount\r\n | \r\nAction | \r\n
|---|---|---|---|---|---|
| {item.itemCode} | \r\n\r\n {item.quantity}\r\n | \r\n\r\n {moneyInTxt(item.price)}\r\n | \r\n\r\n {moneyInTxt(item.quantity * item.price)}\r\n | \r\n
\r\n
\r\n \r\n
\r\n \r\n Total {currencyPreview ? `(${currencyPreview})` : \"\"} {\" \"}\r\n {moneyInTxt(\r\n gridData.reduce(\r\n (total, item) => total + item.quantity * item.price,\r\n 0\r\n )\r\n )}\r\n
\r\n\r\n
\r\n \r\n );\r\n}\r\n\r\nconst styles = {\r\n header: {\r\n display: \"flex\",\r\n height: \"20%\",\r\n marginBottom: 20,\r\n },\r\n bottomcomments: {\r\n display: \"flex\",\r\n justifyContent: \"space-between\",\r\n marginTop: -90,\r\n },\r\n leftHeader: {\r\n display: \"flex\",\r\n width: \"50%\",\r\n flexDirection: \"column\",\r\n alignItems: \"flex-start\",\r\n //border: '1px solid blue',\r\n },\r\n rightHeader: {\r\n display: \"flex\",\r\n width: \"50%\",\r\n flexDirection: \"column\",\r\n alignItems: \"flex-end\",\r\n //border: '1px solid green',\r\n },\r\n title: {\r\n height: \"max-content\",\r\n backgroundColor: \"#eff4fd\",\r\n borderRadius: 5,\r\n padding: \"5px 10px 0px 10px\",\r\n marginBottom: 25,\r\n width: \"100%\",\r\n },\r\n body: {\r\n marginTop: 0,\r\n height: \"220px\",\r\n overflow: \"auto\",\r\n },\r\n footer: {\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n marginTop: 25,\r\n height: \"10%\",\r\n overflow: \"auto\",\r\n },\r\n total: {\r\n display: \"flex\",\r\n justifyContent: \"flex-end\",\r\n width: \"100%\",\r\n marginLeft: \"70%\",\r\n borderTop: \"1px solid #e3e3e3\",\r\n paddingTop: 10,\r\n //paddingRight: 50,\r\n marginTop: 10,\r\n },\r\n comments: {\r\n height: 60,\r\n width: \"47%\",\r\n overflow: \"auto\",\r\n flexDirection: \"row\",\r\n backgroundColor: \"#eff4fd\",\r\n borderRadius: 10,\r\n padding: 10,\r\n color: \"#cecece\",\r\n marginTop: 40,\r\n },\r\n\r\n tablehead: {\r\n display: \"flex\",\r\n justifyContent: \"flex-end\",\r\n alignItems: \"flex-end\",\r\n },\r\n};\r\n\r\nexport default InvoicePreview;\r\n","import InvoiceForm from '../../components/InvoiceForm'\r\nimport InvoicePreview from '../../components/InvoicePreview'\r\nimport React, { useState, createContext, useEffect } from 'react'\r\nimport { Modal } from 'reactstrap'\r\n\r\nconst init = {\r\n customerName: '',\r\n customerCode: '',\r\n invoiceType: '',\r\n businessUnit: '',\r\n serviceCode: '',\r\n description: '',\r\n quantity: 1,\r\n price: '',\r\n comments: '',\r\n supportedBranch: '',\r\n}\r\n\r\nexport const FormContext = createContext(null)\r\n\r\nfunction NewInvoice({ setShowNewInvoiceModal,invoiceId,setInvoiceID,setFailedGHGHOVInvoices,servicelist }) {\r\n const [formData, setFormData] = useState(init)\r\n const [gridData, setGridData] = useState([])\r\n const [comments, setComments] = useState('')\r\n const [currencyPreview,setCurrencyPreview]=useState(\"\")\r\n const [closeForm,setCloseForm]=useState()\r\n const [dueDate,setDueDate]=useState(\"\")\r\n const [head,setHead]=useState(\"Create\")\r\n\r\n let closeFormX =()=>{\r\n setShowNewInvoiceModal(false)\r\n setInvoiceID(\"\")\r\n \r\n }\r\n//console.log(invoiceId);\r\nuseEffect(()=>{\r\nif(invoiceId){\r\n if(invoiceId.status == \"Declined For Review\"){\r\n setHead(\"Update\")\r\n }\r\n}\r\n},[])\r\n return (\r\n <>\r\n \r\n
\r\n {comments}
\r\n\r\n closeFormX() }\r\n >\r\n ×\r\n \r\n
\r\n \r\n {head} your invoice\r\n
\r\n\r\n \r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nexport default NewInvoice\r\n","import React, { useContext, useRef, useEffect, useState } from 'react'\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport { saveInvoice } from '../actions'\r\nimport axios from 'axios'\r\n\r\nimport {\r\n FormGroup,\r\n Form,\r\n Input,\r\n Row,\r\n Col,\r\n Button,\r\n Card,\r\n CardBody,\r\n} from 'reactstrap'\r\nimport { AppContext } from 'views/Index'\r\n\r\nfunction InvoiceFormDraft({ draftData, setShowDraftDetails }) {\r\n const descriptionRef = useRef(null)\r\n const quantityRef = useRef(null)\r\n const priceRef = useRef(null)\r\n const [services, setServices] = useState([])\r\n const [supportBranches, setSupportBranches] = useState([])\r\n const [formData, setFormData] = useState({})\r\n const [gridData, setGridData] = useState([])\r\n\r\n //get service\r\n const getServices = async () => {\r\n try {\r\n let allService = await (\r\n await fetch(\r\n `https://iml.npa-enterprise.com/NpaGhGovCheckoutAPI/api/v1/Checkout/SearchAvailableServices?current_page=0&results_per_page=1000&sort_by=name&sort_ascending=true`\r\n )\r\n ).json()\r\n\r\n // const result = await axios.get( `https://iml.npa-enterprise.com/NpaGhGovCheckoutAPI/api/v1/Checkout/SearchAvailableServices?current_page=0&results_per_page=1000&sort_by=name&sort_ascending=true`)\r\n // console.log({result});\r\n\r\n setServices(allService.output)\r\n } catch (error) {\r\n console.error(error.message)\r\n }\r\n }\r\n\r\n const getBranches = async () => {\r\n try {\r\n let allService = await (\r\n await fetch(\r\n `https://iml.npa-enterprise.com/NpaGhGovCheckoutAPI/api/v1/Checkout/SearchMdaBranches?current_page=0&results_per_page=10000&sort_by=name&sort_ascending=true`\r\n )\r\n ).json()\r\n\r\n setSupportBranches(allService.output)\r\n } catch (error) {\r\n console.error(error.message)\r\n }\r\n }\r\n\r\n //handle on chage event for service type\r\n const handleServiceType = (e) => {\r\n let selectedSeviceType = services.find(\r\n (service) => service.name === e.target.value\r\n )\r\n\r\n setFormData({\r\n ...formData,\r\n serviceCode: selectedSeviceType.service_code,\r\n price: selectedSeviceType.fee,\r\n invoiceType: e.target.value,\r\n quantity: 1,\r\n })\r\n\r\n // setSupportBranches(selectedSeviceType.supported_branches)\r\n }\r\n\r\n const dispatch = useDispatch()\r\n\r\n useEffect(() => {\r\n //console.log('Form Data in Form: ', formData)\r\n //console.log('Grid Data in Form: ', gridData)\r\n console.log('Invoice List: ', draftData[0])\r\n getServices()\r\n getBranches()\r\n return () => {\r\n //cleanup\r\n }\r\n }, [])\r\n\r\n const addRecordToData = (item) => {\r\n const tot = item.quantity * item.price\r\n const obj = { ...item, ext: tot }\r\n //console.log('item:', obj)\r\n gridData.push(obj)\r\n setGridData(gridData)\r\n console.log(gridData)\r\n //console.log('GridData:', gridData)\r\n //reset form\r\n setFormData({\r\n customerName: formData.customerName,\r\n invoiceType: formData.invoiceType,\r\n businessUnit: formData.businessUnit,\r\n serviceCode: formData.serviceCode,\r\n description: formData.invoiceType,\r\n quantity: '',\r\n price: '',\r\n // supportedBranch:'',\r\n // businessUnit:'',\r\n // invoiceType: '',\r\n // customerName: '',\r\n })\r\n }\r\n\r\n const savePendingInvoice = async () => {\r\n //console.log('saving ...')\r\n\r\n let invoice = {\r\n status: 'pending',\r\n invoiceNum: Math.floor(Math.random(1) * 1000000),\r\n customer: formData.customerName,\r\n type: formData.invoiceType,\r\n serviceCode: formData.serviceCode,\r\n comments: formData.comments,\r\n total: gridData.reduce((total, item) => total + item.ext, 0),\r\n gridInfo: gridData,\r\n }\r\n\r\n setShowDraftDetails(false)\r\n }\r\n\r\n const saveDraftInvoice = async () => {\r\n //console.log('saving ...')\r\n\r\n let invoice = {\r\n status: 'draft',\r\n invoiceNum: Math.floor(Math.random(1) * 1000000),\r\n customer: formData.customerName,\r\n type: formData.invoiceType,\r\n serviceCode: formData.serviceCode,\r\n comments: formData.comments,\r\n total: gridData.reduce((total, item) => total + item.ext, 0),\r\n gridInfo: gridData,\r\n }\r\n\r\n setShowDraftDetails(false)\r\n }\r\n\r\n return (\r\n + Add Item
\r\n \r\n \r\n \r\n\r\n
\r\n \r\n \r\n .default})
\r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
\r\n
\r\n\r\n \r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
Adj. Petroleum Commission\r\n
\r\n Dzorwulu Accra.\r\n
\r\n \r\n
\r\n INVOICE
\r\n {/*#OMC2111005
*/}\r\n\r\n Issued on:{' '}\r\n {new Date(draftData[0].docDate).toDateString().substring(3)}\r\n
\r\n\r\n Due Date:{' '}\r\n {new Date(draftData[0].dueDate).toDateString().substring(3)}\r\n
\r\n\r\n
\r\n\r\n Invoice for
\r\n{draftData[0].customerName}
\r\n{draftData[0].businessUnit}
\r\n\r\n \r\n \r\n
\r\n
\r\n | \r\n {' '}\r\n Code\r\n | \r\n\r\n Description\r\n | \r\n\r\n Qty\r\n | \r\n\r\n Price\r\n | \r\n\r\n Amount\r\n | \r\n
|---|---|---|---|---|
| {item.itemCode} | \r\n\r\n {item.itemDescription}\r\n | \r\n\r\n {item.quantity}\r\n | \r\n\r\n {moneyInTxt(item.price)}\r\n | \r\n\r\n {moneyInTxt(item.quantity * item.price)}\r\n | \r\n
\r\n
\r\n \r\n
\r\n \r\n Total (GHS)\r\n {moneyInTxt(draftData[0].totalAmount)}\r\n
\r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nconst styles = {\r\n header: {\r\n display: 'flex',\r\n height: '20%',\r\n marginBottom: 20,\r\n },\r\n bottomcomments: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n },\r\n leftHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-start',\r\n //border: '1px solid blue',\r\n },\r\n rightHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-end',\r\n //border: '1px solid green',\r\n },\r\n title: {\r\n height: '14%',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: 10,\r\n marginBottom: 25,\r\n },\r\n body: {\r\n marginTop: 0,\r\n height: '280px',\r\n maxHeight: '280px',\r\n overflow: 'auto',\r\n },\r\n footer: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n marginTop: 10,\r\n height: '10%',\r\n overflow: 'auto',\r\n },\r\n total: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: '100%',\r\n marginLeft: '40%',\r\n borderTop: '1px solid #e3e3e3',\r\n paddingTop: 10,\r\n //paddingRight: 50,\r\n marginTop: 10,\r\n },\r\n comments: {\r\n height: 100,\r\n width: '47%',\r\n overflow: 'auto',\r\n flexDirection: 'row',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: 10,\r\n color: '#cecece',\r\n marginTop: 40,\r\n },\r\n\r\n tablehead: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n alignItems: 'flex-end',\r\n },\r\n}\r\n\r\nexport default InvoicePreviewDraft\r\n","import InvoiceFormDraft from 'components/InvoiceFormDraft'\r\nimport InvoicePreviewDraft from 'components/InvoicePreviewDraft'\r\nimport React, { useState, createContext } from 'react'\r\nimport { Modal } from 'reactstrap'\r\n\r\nexport const FormContext = createContext(null)\r\n\r\nfunction InvoiceDraft({ setShowDraftDetails, draftData, setdraftData }) {\r\n return (\r\n <>\r\n \r\n
\r\n {draftData[0].comments}
\r\n\r\n setShowDraftDetails(false)}\r\n >\r\n ×\r\n \r\n
\r\n \r\n Draft\r\n
\r\n\r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nexport default InvoiceDraft\r\n","import { Card } from 'reactstrap'\r\nconst InvoiceSuggestionsList = ({\r\n filteredSuggestions,\r\n activeSuggestionIndex,\r\n onClick,\r\n}) => {\r\n \r\n\r\n return filteredSuggestions.length ? (\r\n - onClick(suggestion)}>\r\n { suggestion?.invoiceNo} - {\"\"}\r\n {suggestion.customerName}\r\n
\r\n {/* Invoice not found on the list */}\r\n
\r\n )\r\n}\r\n\r\nexport default InvoiceSuggestionsList\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { Col, Input, InputGroup, InputGroupAddon, InputGroupText } from \"reactstrap\";\r\nimport InvoiceSuggestionsList from \"./InvoiceSuggestionsList\";\r\nimport { toast } from \"react-toastify\";\r\n\r\nconst InvoiceAutocomplete = ({\r\n suggestions,\r\n formData,\r\n setFormData,\r\n setFailedGHGHOVInvoices,\r\n prevData,\r\n setPaginationDetails,\r\n getInvoices,\r\n setError,\r\n}) => {\r\n const [filteredSuggestions, setFilteredSuggestions] = useState([]);\r\n const [activeSuggestionIndex, setActiveSuggestionIndex] = useState(0);\r\n const [showSuggestions, setShowSuggestions] = useState(false);\r\n const [input, setInput] = useState(\"\");\r\n const [invoices, setInvoices] = useState([]);\r\n const [previousData, setPreviousData] = useState([]);\r\n\r\n const onChange = (e) => {\r\n const userInput = e.target.value;\r\n setPaginationDetails((prev) => { return {...prev, filter : userInput}})\r\n\r\n // Filter our suggestions that don't contain the user's input\r\n\r\n const unLinked = suggestions?.filter((suggestion) =>\r\n suggestion?.invoiceNo?.includes(userInput)\r\n );\r\n\r\n setInput(e.target.value);\r\n\r\n setFormData({ ...formData, invoiceNo: userInput });\r\n setFilteredSuggestions(unLinked);\r\n setActiveSuggestionIndex(0);\r\n setShowSuggestions(true);\r\n\r\n setPreviousData(prevData);\r\n };\r\n\r\n const onGetInvoices = (event) =>{\r\n if(!input || input.length===0){\r\n return toast.info(\"Please enter text in search box\")\r\n }\r\n \r\n if (!/[a-zA-Z0-9]/.test(input) && input !== \"*\") {\r\n return toast(\"Please enter valid search text\")\r\n } \r\n\r\n return getInvoices()\r\n\r\n }\r\n\r\n const onClick = (suggestion) => {\r\n setPreviousData(prevData);\r\n setInvoices(suggestion);\r\n\r\n setFilteredSuggestions([]);\r\n setInput(suggestion.invoiceNo);\r\n setFormData({\r\n ...formData,\r\n customerName: suggestion?.customerName,\r\n type: suggestion?.invoiceItems?.type,\r\n customerCode: suggestion?.code,\r\n invoiceNo: suggestion?.invoiceItems?.invoiceNo,\r\n serviceCode: suggestion?.invoiceItems?.itemCode,\r\n invoiceItems: suggestion?.invoiceItems.totalAmount,\r\n });\r\n setActiveSuggestionIndex(0);\r\n setShowSuggestions(false);\r\n\r\n // setFailedGHGHOVInvoices(invoices)\r\n handleSetFailedInvoice(suggestion);\r\n };\r\n\r\n const handleSetFailedInvoice = (e) => {\r\n setFailedGHGHOVInvoices([e]);\r\n };\r\n\r\n useEffect(() => {\r\n if (input.length === 0) {\r\n setFailedGHGHOVInvoices(prevData);\r\n }\r\n }, [input]);\r\n\r\n return (\r\n <>\r\n Session Timeout
\r\n \r\n\r\n
\r\n \r\n )}\r\n \r\n )\r\n}\r\nexport default IdleTimer\r\n","import { useState, useEffect, useLayoutEffect, createContext } from 'react'\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport { increment, decrement, loadInvoice, saveInvoice } from '../actions'\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport axios from 'axios'\r\nimport { ToastContainer, toast } from 'react-toastify'\r\nimport 'react-toastify/dist/ReactToastify.css'\r\nimport FailureModal from '../components/Modals/FailureModal'\r\n\r\n// reactstrap components\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n Table,\r\n Container,\r\n Row,\r\n Col,\r\n Badge,\r\n FormGroup,\r\n} from 'reactstrap'\r\n\r\nimport Header from 'components/Headers/Header.js'\r\nimport NewInvoice from 'components/Modals/NewInvoice'\r\nimport InvoiceDraft from 'components/Modals/InvoiceDraft'\r\nimport Loader from 'components/Modals/Loader'\r\nimport Autocomplete from 'components/Autocomplete'\r\nimport InvoiceAutocomplete from 'components/InvoiceAutocomplete'\r\nimport SweetAlert from 'react-bootstrap-sweetalert'\r\nimport moment from 'moment'\r\nimport IdleTimer from 'components/IdleTimer'\r\n\r\n\r\nconst currency = (amount) => {\r\n return amount.toLocaleString('en-US', {\r\n style: 'currency',\r\n currency: 'GHS',\r\n })\r\n}\r\n\r\nexport const moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n })\r\n return nf.format(Number(value) ? value : 0.0)\r\n}\r\nconst init={\r\n name: \"\",\r\n serviceProviderId: \"\",\r\n duration: \"\",\r\n startDate: \"\",\r\n currency:\"\",\r\n supportedBranch:\"\"\r\n\r\n}\r\n\r\nexport const AppContext = createContext(null)\r\n\r\n// if (process.env.NODE_ENV === 'production') {\r\n// console.log('production')\r\n// } else {\r\n// console.log(process.env.NODE_ENV )\r\n// }\r\n//console.log({url:process.env.REACT_APP_NPASERVICES_API});\r\nconst Index = (props) => {\r\n //select redux store states\r\n const masterInvoiceList = useSelector((state) => state.masterInvoiceList)\r\n //const counter = useSelector((state) => state.counter);\r\n const [failedGHGOVInvoices, setFailedGHGHOVInvoices] = useState([])\r\n\r\n const [showNewInvoiceModal, setShowNewInvoiceModal] = useState(false)\r\n const [invoiceList, setInvoiceList] = useState(masterInvoiceList)\r\n const [draftData, setdraftData] = useState({})\r\n const [showDraftDetails, setShowDraftDetails] = useState(false)\r\n const [supportBranches, setSupportBranches] = useState([\r\n { name: '', branch_code: '' },\r\n ])\r\n const [customerTypes, setCustomerTypes] = useState([])\r\n const [declineReason, setDeclineReason] = useState([])\r\n const [showDeclineReason, setShowDeclineReason] = useState(false)\r\n const [showLoader, setShowLoader] = useState(false)\r\n const [isActive, setIsActive] = useState(false);\r\n const[invoiceId,setInvoiceID]=useState(\"\")\r\n\r\n const users = JSON.parse(sessionStorage.getItem('user')); \r\n\r\n const getBranches = async () => {\r\n try {\r\n let allService = await (\r\n await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Checkout/SearchMdaBranches?current_page=0&results_per_page=10000&sort_by=name&sort_ascending=true`,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n )\r\n )\r\n setSupportBranches((prev) => allService.data.output)\r\n } \r\n catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n getBranches()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n \r\n }\r\n } setSupportBranches((prev) => [{ name: '', branch_code: '' }])\r\n }\r\n }\r\n\r\n const getCustomerTypes = async () => {\r\n try {\r\n let allTypes = await (\r\n await axios.get(\r\n //'https://psl-webapps/NpaServices/api/PSPType?iCompanyID=1&szFilter=*&status=4'\r\n `${process.env.REACT_APP_NPASERVICES_API}PSPType?iCompanyID=1&szFilter=*&status=4` ,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n )\r\n )\r\n // if(allTypes.statusText == \"OK\"){\r\n if(allTypes?.data){\r\n setCustomerTypes((prevState) => allTypes?.data)\r\n }\r\n \r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n getCustomerTypes()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n \r\n }\r\n }\r\n\r\n }\r\n }\r\n\r\n const handleGetFailedInvoices = async () => {\r\n // setShowLoader(true)\r\n try {\r\n let failed= await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Invoices/GetInvoicesByUserAndStatus/${users?.pkId}?status=${1}&PageNumber=${1}&PageSize=${10}&Filter=*`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n )\r\n // console.log(failed);\r\n // if(failed?.status == 200){\r\n setFailedGHGHOVInvoices(failed.data?.data)\r\n if(failed.data?.data?.length ===0) toast.info('No data found')\r\n \r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n handleGetFailedInvoices()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n }\r\n }\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n const controller = new AbortController()\r\n const signal = controller.signal\r\n getBranches()\r\n getCustomerTypes()\r\n\r\n return () => {\r\n //cleanup;\r\n if (signal.aborted === false) {\r\n controller.abort()\r\n }\r\n }\r\n }, [])\r\n\r\nconst handleDeclineforreview=(data)=>{\r\n setInvoiceID(data)\r\n setShowNewInvoiceModal(!showNewInvoiceModal)\r\n}\r\n\r\n useLayoutEffect(() => {\r\n handleGetFailedInvoices()\r\n return () => {}\r\n }, [])\r\n // failedGHGOVInvoices.map((x)=>console.log(x.status))\r\nconst handleNoPayments=()=>{\r\n setIsActive(true)\r\n}\r\n\r\n const onCancel = () => {\r\n setIsActive(false);\r\n };\r\n\r\n const getServiceList = async () => {\r\n try {\r\n const servicelist = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}NpaServices/GetServicesByDepartment/${users?.pkId}`,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n );\r\nif(servicelist?.data) {\r\n return servicelist?.data;\r\n\r\n}\r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n //console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n ).then((res)=>{\r\n if(res?.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(res.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(res.data.refreshToken))\r\n getServiceList()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n }\r\n })\r\n }\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n Your session is about to expire!
\r\nAre you still here?
\r\n \r\nLogging out in {remaining} seconds
\r\n\r\n\r\n {/* {showLoader ? \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {showNewInvoiceModal ? (\r\n \r\n \r\n \r\n ) : null}\r\n {showDraftDetails ? (\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default Index\r\n\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '450px',\r\n maxHeight: '450px',\r\n overflow: 'auto',\r\n },\r\n}\r\n","import moment from 'moment'\r\nimport React from 'react'\r\nimport { Card, Table, Form, Input, Row } from 'reactstrap'\r\n\r\nconst moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n })\r\n return nf.format(Number(value) ? value : 0.0)\r\n}\r\n\r\nexport default function DetailedView({\r\n data,\r\n selectedInvoice,\r\n setSelectedInvoice,\r\n showDecline,\r\n setDisabled,\r\n setIsTypingReason,\r\n reasonRef\r\n}) {\r\n const handleDisableButton = () => {\r\n setDisabled(false)\r\n\r\n if (selectedInvoice.declineReason) {\r\n setIsTypingReason(true)\r\n } else {\r\n setIsTypingReason(false)\r\n }\r\n }\r\n// console.log( selectedInvoice);\r\n// console.log( data);\r\n return (\r\n No payments have been made
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n {/* Card stats */}\r\n
\r\n \r\n
\r\n
\r\n \r\n Transactions
\r\n\r\n\r\n
List of all invoices
\r\n\r\n \r\n setShowNewInvoiceModal(!showNewInvoiceModal)\r\n }\r\n size='md'\r\n >\r\n + Create Invoice\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | Invoice # | \r\nDate | \r\nCustomer | \r\nCurrency | \r\nTotal Amount | \r\nStatus | \r\nActions | \r\n||||
|---|---|---|---|---|---|---|---|---|---|---|
| {invoice.invoiceNo} | \r\n{moment(invoice?.docDate,\"YYYY-MM-DD\").format(\"DD/MMM/YYYY\")} | \r\n{invoice.customerName} | \r\n{invoice.currency} | \r\n\r\n {moneyInTxt(invoice.totalAmount)}\r\n | \r\n\r\n\r\n {invoice?.status == 'Approved'?\r\n \r\n | : null}\r\n \r\n {invoice?.status == 'Sent to SAP'? \r\n \r\n | : null}\r\n {invoice?.status == 'Pending'? \r\n \r\n | : null}\r\n {invoice?.status == 'Declined'? \r\n \r\n | : null}\r\n {invoice?.status == 'Declined For Review'? \r\n \r\n | : null}\r\n \r\n handleDeclineforreview(invoice)} className='fas fa-edit text-info' />\r\n | \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
\r\n
\r\n\r\n \r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
Adj. Petroleum Commission\r\n
\r\n Dzorwulu Accra.\r\n
\r\n \r\n
\r\n INVOICE
\r\n#{data.invoiceNo}
\r\n\r\n Issued on: {moment(data.docDate,\"YYYY-MM-DD\").format(\"DD MMM YYYY\")} \r\n {/* Issued on: {new Date(data.docDate).toDateString().substring(3)} */}\r\n
\r\n\r\n Due Date: {moment(data.docDueDate,\"YYYY-MM-DD\").format(\"DD MMM YYYY\")}\r\n {/* Due Date: {new Date(data.docDueDate).toDateString().substring(3)} */}\r\n
\r\n\r\n
\r\n\r\n Invoice for: {data.customerName}
\r\n {/* \r\n{data.type}
*/}\r\n\r\n \r\n \r\n
\r\n
\r\n | \r\n {' '}\r\n Code\r\n | \r\n\r\n Description\r\n | \r\n\r\n Qty\r\n | \r\n\r\n Price\r\n | \r\n\r\n Amount\r\n | \r\n
|---|---|---|---|---|
| {item.itemCode} | \r\n\r\n {item?.quantity}\r\n | \r\n\r\n {moneyInTxt(item.price)}\r\n | \r\n\r\n {moneyInTxt(item.quantity * item.price)}\r\n | \r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n Total{data.currency? `(${data.currency})` : \"\"} {' '}\r\n
\r\n\r\n \r\n {moneyInTxt(\r\n data?.invoiceItems?.reduce(\r\n (total, item) => total + item?.quantity * item?.price,\r\n 0\r\n )\r\n )}\r\n
\r\n\r\n
\r\n {/* \r\n Balance{data.currency? `(${data.currency})` : \"\"} {' '}\r\n
\r\n{moneyInTxt(\r\n data?.balance)}\r\n
\r\n\r\n Total{data.currency? `(${data.currency})` : \"\"} {' '}\r\n {moneyInTxt(\r\n data?.invoiceItems?.reduce(\r\n (total, item) => total + item?.quantity * item?.price,\r\n 0\r\n )\r\n )}\r\n
\r\n\r\n Balance{data.currency? `(${data.currency})` : \"\"} {' '}\r\n {moneyInTxt(\r\n data?.balance)}\r\n \r\n \r\n
*/}\r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nconst styles = {\r\n header: {\r\n display: 'flex',\r\n height: '20%',\r\n marginBottom: 20,\r\n },\r\n leftHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-start',\r\n //border: '1px solid blue',\r\n },\r\n\r\n rightHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-end',\r\n //border: '1px solid green',\r\n },\r\n title: {\r\n height: '14%',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: \"5px 10px\",\r\n marginBottom: 10,\r\n marginTop:-15\r\n },\r\n body: {\r\n marginTop: 0,\r\n height: '250px',\r\n maxHeight: '250px',\r\n overflow: 'auto',\r\n },\r\n footer: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n marginTop: 5,\r\n // height: '10%',\r\n // overflow: 'auto',\r\n },\r\n total: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: '100%',\r\n marginLeft: '40%',\r\n borderTop: '1px solid #e3e3e3',\r\n paddingTop: 10,\r\n //paddingRight: 50,\r\n marginTop: 10,\r\n },\r\n comments: {\r\n height: 60,\r\n width: '47%',\r\n // overflow: 'auto',\r\n flexDirection: 'row',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: 10,\r\n color: '#cecece',\r\n marginTop: 40,\r\n fontSize:10\r\n },\r\n tablehead: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n alignItems: 'flex-end',\r\n },\r\n bottomcomments: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n marginTop:-30\r\n },\r\n decline: {\r\n height: 60,\r\n width: '47%',\r\n // overflow: 'auto',\r\n // flexDirection: 'row',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 5,\r\n // padding: 10,\r\n color: 'darkred',\r\n marginTop: 40,\r\n fontSize:11\r\n },\r\n reason: {\r\n backgroundColor: 'inherit',\r\n },\r\n}\r\n","import React, { useState, useRef, useEffect } from 'react'\r\nimport { Modal, Button, Row, Col, Dropdown, DropdownMenu, DropdownToggle, DropdownItem, UncontrolledDropdown } from 'reactstrap'\r\nimport DetailedView from 'components/DetailedView'\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport { faThumbsUp, faThumbsDown } from '@fortawesome/free-solid-svg-icons'\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport { loadInvoice } from '../../actions'\r\nimport axios from 'axios'\r\nimport Loader from './Loader'\r\n\r\nimport { ToastContainer, toast } from 'react-toastify'\r\nimport 'react-toastify/dist/ReactToastify.css'\r\n\r\nfunction ViewDetails({ setShowViewDetails, data,setMasterInvoiceList,formType }) {\r\n //const masterInvoiceList = useSelector((state) => state.masterInvoiceList)\r\n const [selectedInvoice, setSelectedInvoice] = useState(data)\r\n const [showDecline, setShowDecline] = useState(true)\r\n const [disabled, setDisabled] = useState(false)\r\n const declineRef = useRef(null)\r\n const [count, setDeclineClickCount] = useState(0)\r\n const [loading, setShowLoader] = useState(false)\r\n const [isTypingReason, setIsTypingReason] = useState(true)\r\n const [dropdownOpen, setDropdownOpen] = useState(false);\r\n const reasonRef =useRef(null)\r\n const [buttonLabe,setButtonLabels]=useState(\"\")\r\n const[hideButtton,setHideButton]=useState(false)\r\n const [checkStatus,setCheckStatus]=useState(\"\")\r\n\r\n const userDetails = JSON.parse(sessionStorage.getItem(\"user\"));\r\n const dispatch = useDispatch()\r\n\r\n const approve = async (selectedInvoice) => {\r\n \r\n console.log(formType);\r\n \r\nif(selectedInvoice.status ==\"Pending Cancellation\" || formType == \"Approval Cancellation\"){\r\n\r\nif(selectedInvoice.declineReason== undefined){\r\n toast.info(\"Enter a reason\")\r\n return;\r\n}\r\nsetShowLoader(true)\r\n let invoiceUpdate ={\r\n invoiceId: selectedInvoice?.id,\r\n invoiceNo: selectedInvoice?.invoiceNo,\r\n status: 1 ,\r\n userdId: userDetails?.pkId,\r\n remarks: selectedInvoice.declineReason,\r\n stage: formType? 2 : 1\r\n }\r\n\r\n try {\r\n const request = await axios.post(`${process.env.REACT_APP_API_ROOT_PSL}Invoices/InvoiceCancellation`, invoiceUpdate,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }})\r\n ;console.log(request.data.status);\r\n if(request.data[0].status > 0\r\n ){\r\n toast.success(\r\n 'Invoice approved succesful'\r\n )\r\n setMasterInvoiceList((current) =>\r\n current.filter((item) => item.id !==selectedInvoice.id ) )\r\n setShowLoader(false)\r\n setShowViewDetails(false)\r\n }else{\r\n toast.info(\"Failed to update invoice status, try again later\")\r\n\r\n }\r\n \r\n \r\n } catch (error) {\r\n\r\n\r\n\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n approve(selectedInvoice)\r\n }\r\n else{\r\n \r\n toast.info(\r\n 'Invoice failed try again later'\r\n )\r\n setShowLoader(false)\r\n \r\n }\r\n }\r\n\r\n\r\n\r\n\r\n }\r\n \r\n}\r\nelse{\r\n if(selectedInvoice.declineReason== undefined){\r\n toast.info(\"Enter a reason\")\r\n return;\r\n }\r\n setShowLoader(true)\r\n let invoice_to_update = {\r\n remarks: selectedInvoice.declineReason,\r\n periodId: selectedInvoice.periodId,\r\n type: selectedInvoice.type,\r\n customerName: selectedInvoice.customerName,\r\n customerCode: selectedInvoice.customerCode,\r\n businessUnit: selectedInvoice.businessUnit,\r\n branchCode: selectedInvoice.branchCode,\r\n totalAmount: selectedInvoice.totalAmount,\r\n currency: selectedInvoice.currency,\r\n userId: JSON.parse(sessionStorage.getItem('user')).pkId,\r\n status: 3,\r\n invoiceItems: selectedInvoice.invoiceItems,\r\n }\r\n\r\ntry {\r\n const request = await axios.put(`${process.env.REACT_APP_API_ROOT_PSL}Invoices/${selectedInvoice.id}`, invoice_to_update,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }})\r\n // console.log(request);\r\n if(request){\r\n toast.success(\r\n 'Invoice approved succesful'\r\n )\r\n setMasterInvoiceList((current) =>\r\n current.filter((item) => item.id !==selectedInvoice.id ) )\r\n setShowLoader(false)\r\n setShowViewDetails(false)\r\n }else{\r\n setShowViewDetails(false)\r\n\r\n toast.info(\"Failed to update invoice status, try again later\")\r\n\r\n }\r\n \r\n \r\n} catch (error) {\r\n\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n approve(selectedInvoice)\r\n }\r\n else{\r\n toast.info(\r\n 'Invoice failed try again later'\r\n )\r\n setShowLoader(false)\r\n }\r\n }\r\n\r\n\r\n\r\n\r\n\r\n}\r\n\r\n}\r\n\r\n\r\n \r\n\r\nsetShowLoader(false)\r\n \r\n }\r\n\r\n \r\n \r\n\r\n\r\n const declineInvoice = async(selectedInvoice,code) => {\r\n // console.log('Selected invoice:', selectedInvoice)\r\n // setShowViewDetails(false)\r\n \r\n \r\n if(selectedInvoice.status ==\"Pending Cancellation\" || formType == \"Approval Cancellation\"){\r\n if(selectedInvoice.declineReason== undefined){\r\n toast.info(\"Enter a reason\")\r\n return;\r\n }\r\n let invoiceUpdate ={\r\n invoiceId: selectedInvoice?.id,\r\n invoiceNo: selectedInvoice?.invoiceNo,\r\n status: 2 ,\r\n userdId: userDetails?.pkId,\r\n remarks: selectedInvoice.declineReason,\r\n stage: formType? 2 : 1\r\n }\r\n setShowLoader(true)\r\n try {\r\n const request = await axios.post(`${process.env.REACT_APP_API_ROOT_PSL}Invoices/InvoiceCancellation`, invoiceUpdate,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }})\r\n \r\n if(request.data[0].status > 0){\r\n toast.success(\r\n 'Invoice declined succesful'\r\n )\r\n setMasterInvoiceList((current) =>\r\n current.filter((item) => item.id !==selectedInvoice.id ) )\r\n setShowLoader(false)\r\n setShowViewDetails(false)\r\n }else{\r\n toast.info(\"Failed to update invoice status, try again later\")\r\n\r\n }\r\n \r\n \r\n } catch (error) {\r\n \r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n ).then((res)=>{\r\n if(res.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(res.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(res.data.refreshToken))\r\n declineInvoice(selectedInvoice,code)\r\n }\r\n else{\r\n toast.info(\r\n 'Invoice decline failed try again later'\r\n )\r\n setShowLoader(false)\r\n \r\n }})\r\n }\r\n }\r\n \r\n }else{\r\n if(selectedInvoice.declineReason== undefined){\r\n toast.info(\"Enter a reason\")\r\n return;\r\n }\r\n setShowLoader(true)\r\n let invoice_to_update = {\r\n remarks: selectedInvoice.declineReason,\r\n periodId: selectedInvoice.periodId,\r\n type: selectedInvoice.type,\r\n customerName: selectedInvoice.customerName,\r\n customerCode: selectedInvoice.customerCode,\r\n businessUnit: selectedInvoice.businessUnit,\r\n branchCode: selectedInvoice.branchCode,\r\n totalAmount: selectedInvoice.totalAmount,\r\n currency: selectedInvoice.currency,\r\n \r\n userId: JSON.parse(sessionStorage.getItem('user')).pkId,\r\n status: code,\r\n invoiceItems: selectedInvoice.invoiceItems,\r\n }\r\n \r\n try {\r\n const request = await axios.put(`${process.env.REACT_APP_API_ROOT_PSL}Invoices/${selectedInvoice.id}`, invoice_to_update,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }} )\r\n //console.log(request);\r\n if(request){\r\n toast.success('Invoice status has been updated to declined')\r\n setMasterInvoiceList((current) =>\r\n current.filter((item) => item.id !==selectedInvoice.id ) )\r\n setShowLoader(false)\r\n setShowViewDetails(false)\r\n }else{\r\n toast.info(\"Failed to update invoice status, try again later\")\r\n\r\n }\r\n \r\n \r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n ).then((res) =>{\r\n if(res?.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(res.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(res.data.refreshToken))\r\n declineInvoice(selectedInvoice,code)\r\n\r\n }\r\n else{\r\n toast.info(\"Failed to update invoice status, try again later\")\r\n setShowLoader(false)\r\n \r\n }})\r\n }\r\n\r\n\r\n\r\n \r\n // setShowViewDetails(false)\r\n }\r\n \r\n\r\n }\r\n setShowLoader(false)\r\n\r\n \r\n }\r\n\r\n\r\n\r\n\r\n \r\n \r\n\r\n\r\n\r\n\r\n const handleDecline = () => {\r\n // setDeclineClickCount(count + 1)\r\n // if (count == 0) {\r\n // setShowDecline(!showDecline)\r\n // setDisabled(!disabled)\r\n // } else {\r\n // declineInvoice(selectedInvoice,4)\r\n // }\r\n\r\ndeclineInvoice(selectedInvoice,4)\r\n\r\n \r\n }\r\n\r\n\r\nuseEffect(()=>{\r\n \r\n if(selectedInvoice.status==\"Pending Cancellation\" ){\r\n setHideButton(true)\r\n }\r\n if(formType== \"Approval Cancellation\"){\r\n setHideButton(true)\r\n }\r\n \r\n \r\n},[selectedInvoice])\r\n\r\n const handleDeclineForReview = () => {\r\n // setDeclineClickCount(count + 1)\r\n // if (count == 0) {\r\n // // console.log(count);\r\n // setShowDecline(!showDecline)\r\n // setDisabled(!disabled)\r\n // } else {\r\n // declineInvoice(selectedInvoice,1)\r\n // // setShowViewDetails(false)\r\n // }\r\n \r\n \r\n \r\n declineInvoice(selectedInvoice,1)\r\n \r\n }\r\n\r\n\r\n\r\n const toggle = () => setDropdownOpen((prevState) => !prevState);\r\n //console.log('data in view details: ', data)\r\n//console.log(selectedInvoice.declineReason);\r\n return (\r\n <>\r\n {loading ? \r\n {/*
\r\n \r\n {data.comments}
*/}\r\n{ data?.remarks }
\r\n\r\n {/* \r\n setSelectedInvoice({\r\n ...selectedInvoice,\r\n declineReason: e.target.value,\r\n })\r\n }\r\n // onKeyDown={handleDisableButton}\r\n />\r\n
\r\n \r\n Decline Reason
*/}\r\n\r\n setShowViewDetails(false)}\r\n >\r\n ×\r\n \r\n
\r\n \r\n View Details\r\n
\r\n\r\n \r\n \r\n Declined\r\n \r\n \r\n \r\n Declined for Review\r\n \r\n \r\n \r\n approve(selectedInvoice)}\r\n style={{ width: '100%' }}\r\n size='sm'\r\n >\r\n
\r\n
\r\n \r\n \r\n \r\n {showLoader ? \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {showViewDetails ? (\r\n \r\n \r\n ) : null}\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default PendingApproval\r\n\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '480px',\r\n maxHeight: '480px',\r\n },\r\n}\r\n","import React, { useState } from \"react\";\r\nimport { Table } from \"reactstrap\";\r\nimport { moneyInTxt } from \"views/Index\";\r\nimport { Pagination, PaginationItem, PaginationLink } from \"reactstrap\";\r\n\r\n\r\n\r\n\r\nexport const FormTable = ({invoiceListData , setInstallAmount, setTotalAmount, setRowData,checkedGrid, rowdata}) => {\r\n const [isCheckedAll, setIsCheckedAll] = useState(false);\r\n const [isCheck, setIsCheck] = useState([]);\r\n const [test,setTest]=useState([])\r\n\r\n\r\n // console.log({invoiceListData});\r\n \r\n\r\n const handleOnChange = (e) => {\r\n const { id, checked } = e.target;\r\n if(checked){\r\n\r\n //Set ischecked property of a checked data box to true\r\n invoiceListData.filter((x)=> x.id== id? x.isChecked = checked: null )\r\n\r\n //Adds to rowdata array to be posted\r\n invoiceListData.filter((x)=> x.id== id? handleRowdata(x): null )\r\n\r\n //Calculates total amount based on selected amount in a row data\r\n invoiceListData.filter((x)=> x.id== id? calculateTotalAmountAdd(x.totalAmount): null )\r\n\r\n \r\n\r\n }\r\n else{\r\n setIsCheckedAll(false);\r\n invoiceListData.filter((x)=> x.id== id? x.isChecked = false: null )\r\n\r\n //Removes unchecked rows from row data array\r\n if(rowdata){\r\n setRowData((current) =>\r\n current.filter((arr) => arr.id != id)\r\n )\r\n setRowData((current) =>\r\n current.filter((arr) => arr.invoiceId != id)\r\n )\r\n }\r\n\r\n // rowdata.filter((x)=>{x.i})\r\n\r\n\r\n //Subtracts from total amount and remove from array\r\n invoiceListData.filter((x)=> x.id== id? handleSubtract(x.totalAmount): null )\r\n\r\n \r\n\r\n }\r\n\r\n };\r\n\r\nconst handleRowdata=(data)=>{\r\n let handleRowdata={\r\n ichecked: data.isChecked,\r\n invoiceId: Number(data.id),\r\n outstandingAmount: Number(data.outstandingBalance),\r\n totalAmount: Number(data.totalAmount),\r\n totalPaid: Number(data.totalPaid),\r\n\r\n}\r\n setRowData(prevstate=>[...prevstate, handleRowdata])\r\n\r\n}\r\n\r\n \r\nconst calculateTotalAmountAdd=(value)=>{\r\n setTotalAmount((prevState)=> prevState + value)\r\n}\r\n\r\n//Function subtracts amount from total amount when a box is unchecked\r\nconst handleSubtract=(value)=>{\r\n setTotalAmount((prevState)=> prevState - value)\r\n}\r\n\r\n\r\n\r\n\r\nconst handleSelectAll = e => {\r\n const { id, checked } = e.target;\r\n\r\n setIsCheckedAll(!isCheckedAll);\r\n if(!isCheckedAll && rowdata.length > 0 ){\r\n setRowData(\"\")\r\n setTotalAmount(0)\r\n //Set ischecked property of a checked data box to true\r\n invoiceListData.filter((x)=> x.isChecked != checked? x.isChecked = checked: !checked )\r\n\r\n\r\n invoiceListData.filter(li =>handleRowdata(li) )\r\n\r\n\r\n //Calculates total amount based on selected amount in a row data\r\n invoiceListData.map((x)=> x.isChecked == checked? calculateTotalAmountAdd(x.totalAmount): null )\r\n \r\n\r\nreturn\r\n }\r\n\r\nif(!isCheckedAll && rowdata.length == 0){\r\n \r\n\r\n setIsCheck(invoiceListData.map((li) => li.isChecked = true));\r\n invoiceListData.map(li => li.id != rowdata.invoiceId? handleRowdata(li): null )\r\n calculateSelectedAll()\r\n \r\n }\r\n \r\n \r\n if (isCheckedAll) {\r\n setIsCheckedAll(false);\r\n\r\n\r\n setIsCheck([]);\r\n setIsCheck(invoiceListData.map(li => li.isChecked = false));\r\n\r\n \r\n // setRowData((current) =>\r\n // current.filter((arr) => arr.checked != true)\r\n // )\r\n setRowData((current) =>\r\n current.filter((arr) => arr.ichecked == false)\r\n )\r\n\r\n\r\n setTotalAmount(0)\r\n setInstallAmount(0)\r\n \r\n }\r\n};\r\n\r\nconst setRow=(li)=>{\r\n setRowData(\"\")\r\n handleRowdata(li)\r\n\r\n}\r\n\r\nvar existingInvoiceArr = []; \r\n\r\n// const existingInvoice = () => {if (invoiceListData.length > 0) \r\n// {for (let i = 0; i < invoiceListData.length; i++) { var obj = {};\r\n// obj = invoiceListData[i].id;\r\n// existingInvoiceArr.push(obj); }\r\n// const newdata = rowdata.filter((val) =>\r\n// {return !existingInvoiceArr.find((arr) =>\r\n// {return ((val.invoiceId === arr.id ) )\r\n// ;\r\n// });\r\n// });\r\n// handleRowdata(newdata);} \r\n// // else {\r\n// // setCheckedBeneficiaryTypes(relationTypes); \r\n// // } \r\n// };\r\n\r\n\r\nconst calculateSelectedAll=()=>{\r\nlet arr=[]\r\nconst initialValue = 0;\r\n invoiceListData.map(x=> arr.push(x.totalAmount))\r\n let tottal = arr.reduce(\r\n (accumulator, currentValue) => accumulator + currentValue,\r\n initialValue\r\n);\r\nsetTotalAmount(tottal)\r\n\r\n}\r\n\r\n\r\n\r\n\r\n\r\n \r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n Unapproved Invoices
\r\n\r\n
List of pending invoices
\r\n\r\n \r\n {/* { } */}\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n \r\n | Invoice # | \r\n \r\n\r\n Customer\r\n | \r\n\r\n Currency\r\n | \r\nBalance | \r\n\r\n Total Amount\r\n | \r\n \r\n\r\n\r\n Status\r\n | \r\nActions | \r\n|
|---|---|---|---|---|---|---|---|
| \r\n {invoice.invoiceNo}\r\n | \r\n\r\n {invoice.customerName}\r\n | \r\n \r\n{moment(invoice?.docDate,\"YYYY-MM-DD\").format(\"DD/MMM/YYYY\")} | \r\n \r\n\r\n {invoice?.currency}\r\n | \r\n\r\n {moneyInTxt(invoice.balance)}\r\n | \r\n\r\n\r\n \r\n {moneyInTxt(invoice.totalAmount)}\r\n | \r\n\r\n \r\n | \r\n \r\n | \r\n
\r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '450px',\r\n maxHeight: '450px',\r\n overflow: 'auto',\r\n },\r\n}\r\n","import axios from \"axios\";\r\nimport Autocomplete from \"components/Autocomplete\";\r\nimport React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from \"react\";\r\nimport { RotatingLines } from \"react-loader-spinner\";\r\nimport { toast } from \"react-toastify\";\r\nimport {\r\n Button,\r\n Col,\r\n Form,\r\n FormGroup,\r\n Input,\r\n InputGroup,\r\n InputGroupAddon,\r\n InputGroupText,\r\n Modal,\r\n Row,\r\n} from \"reactstrap\";\r\nimport { moneyInTxt } from \"views/Index\";\r\nimport { FormTable } from \"./FormTable\";\r\n\r\n\r\n// const init = {\r\n// customerName: '',\r\n// serviceProviderId: '',\r\n// customerCode: '',\r\n// invoiceType: '',\r\n \r\n// description: '',\r\n// quantity: 1,\r\n// price: '',\r\n// comments: '',\r\n// supportedBranch: '',\r\n// }\r\nconst init={\r\n name: \"\",\r\n serviceProviderId: \"\",\r\n duration: \"\",\r\n startDate: \"\",\r\n}\r\n\r\n\r\nconst post ={\r\n \"name\": \"string\",\r\n \"serviceProviderId\": 0,\r\n \"duration\": 0,\r\n \"startDate\": \"2023-02-10T12:19:56.641Z\",\r\n \"userId\": 0,\r\n \"paymentPlanDetails\": [\r\n {\r\n \"invoiceId\": 0,\r\n \"outstandingAmount\": 0,\r\n \"totalAmount\": 0,\r\n \"totalPaid\": 0\r\n }\r\n ]\r\n}\r\nconst getFormattedPrice = (price) => `${price.toFixed(2)}`;\r\nconst PaymentForm = ({ setShow,customerTypes,show }) => {\r\n const [loading, setLoading] = useState(false)\r\n const [submitData, setSubmitData]=useState(\"\")\r\n const [customers, setCustomers] = useState([])\r\n const [formData, setFormData] = useState(init)\r\n const [gridData, setGridData] = useState([])\r\n const [checkedGrid,setCheckedGrid]=useState(false)\r\n const[totalAmount,setTotalAmount] = useState(0)\r\n const [installAmount, setInstallAmount]= useState(0)\r\n const [rowData, setRowData]=useState([])\r\n const[handlePostData, setHanlePostData]=useState([])\r\n const [handleDurationChecker, setDurationChecker]=useState(\"\")\r\n const durationRef =useRef(null)\r\n const [canSave, setCanSave] = useState(false);\r\n\r\n\r\n\r\n\r\n const handleOnChange=(evnt)=>{\r\n setFormData((data) => {\r\n return { ...data, [evnt?.target?.name]: evnt?.target?.value };\r\n });\r\n if(evnt?.target?.name === \"duration\"){\r\n\r\n setDurationChecker(evnt?.target?.value)\r\n evnt?.target?.value <=0 || evnt?.target?.value > 18 ? toast.error(\"Duration Should be between 1 and 18\") \r\n : null\r\n evnt?.target?.value? setCheckedGrid(true): setCheckedGrid(false)\r\n \r\n return\r\n }\r\n \r\n\r\n } \r\n\r\n\r\n\r\n useEffect(() => {\r\n const requiredObj = {\r\n name: formData.name,\r\n serviceProviderId: formData.serviceProviderId.toString(),\r\n duration: formData.duration,\r\n startDate: formData.startDate,\r\n };\r\n setCanSave(Object.values(requiredObj).every((field) => field != \"\"));\r\n }, [formData]);\r\n\r\n\r\n\r\nconst handlePosting=()=>{\r\n let postBody={\r\n name: formData.name,\r\n serviceProviderId: Number(formData.serviceProviderId),\r\n duration: Number(formData.duration),\r\n startDate: formData.startDate,\r\n userId: 0,\r\n paymentPlanDetails: rowData\r\n}\r\nsetHanlePostData(postBody)\r\n return (postBody); \r\n}\r\n\r\nconst handleOnSubmit=()=>{\r\n try {\r\n \r\n } catch (error) {\r\n \r\n }\r\nif(!handlePosting().name || handlePosting().name ==\"\" ){\r\n toast.error('Plan name cannot be empty!')\r\nreturn\r\n}\r\nif(!handlePosting().serviceProviderId || handlePosting().serviceProviderId == \"\" ){\r\n toast.error('Customer Name cannot be empty!')\r\nreturn\r\n}\r\nif(!handlePosting().startDate || handlePosting().startDate == \"\" ){\r\n toast.error('Start date cannot be empty!')\r\nreturn\r\n}\r\nif(handlePosting().duration == 0 || handlePosting().duration == \"\" ){\r\n toast.error('Duration cannot be empty!')\r\nreturn\r\n}\r\nif(handlePosting().paymentPlanDetails.length <= 0 ){\r\n toast.error('Select payment!')\r\nreturn\r\n}\r\n\r\naxios\r\n.post(`${process.env.REACT_APP_API_ROOT_PSL}PaymentPlan`, handlePosting(),{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n}})\r\n.then(function (response) {\r\n if (response?.status < 400) {\r\n toast.success(\"Record added!\")\r\n formReset()\r\n // window.location.reload()\r\n\r\n } else {\r\n toast.warning('Something went wrong please contact admin')\r\n }\r\n\r\n})\r\n.catch(function (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n handleOnSubmit()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n \r\n }\r\n } \r\n\r\n toast.error('Failed to save payment plan')\r\n})\r\n}\r\n\r\nconst formReset=()=>{\r\n setFormData(init)\r\n setShow(false)\r\n}\r\n\r\n\r\n\r\nconsole.log(formData);\r\n\r\nconst handleGrid = async (type) => {\r\n try {\r\n let serviceProvider = Number(formData?.serviceProviderId) \r\n let allGridData =\r\n await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Invoices/GetOverdueInvoiceByPSPId/${serviceProvider}`,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n )\r\n \r\n // console.log( {allGridData}) \r\n setGridData([...allGridData?.data].map(x=>({...x, isChecked:false})))\r\n\r\n \r\n //setCustomers(allCustomers.map((customer) => customer.name))\r\n } catch (error) {\r\n \r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n handleGrid()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n\r\n }\r\n }\r\n\r\n }\r\n}\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nuseEffect(()=>{\r\n let results = Number(totalAmount) / Number(formData?.duration) \r\n\r\n setInstallAmount(parseInt(results)) \r\n \r\n},[totalAmount])\r\n\r\n\r\n\r\n\r\n\r\n const handleCustomerList = async (type) => {\r\n try {\r\n let allCustomers = \r\n await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}NpaServices/SearchCustomers/*/${type}`,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n )\r\n \r\n\r\n setCustomers(allCustomers?.data)\r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n let obj = await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n )\r\n if(obj.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(obj.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(obj.data.refreshToken))\r\n handleCustomerList()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n \r\n }\r\n }\r\n }\r\n }\r\n\r\n\r\nuseEffect(()=>{\r\n handleGrid()\r\n \r\n},[formData?.serviceProviderId])\r\n\r\n\r\n// const calculateTotalAmountAdd=(value)=>{\r\n// setTotalAmount((prevState)=> prevState + value)\r\n// }\r\n\r\n\r\n\r\n\r\n // useEffect(() => {\r\n\r\n // const init = async () => {\r\n // setLoading(true)\r\n // let results= await axios.get(\r\n // `${process.env.REACT_APP_API_ROOT_PSL}PaymentPlan/GetByPspId/${119}`,{ headers: {\r\n // 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n // }}\r\n // )\r\n // .then((res) => res.json())\r\n // .then((data) => {\r\n // }\r\n // ).finally(() => {\r\n \r\n // setLoading(false)\r\n // })\r\n\r\n // }\r\n // init()\r\n\r\n // return () => {\r\n\r\n // }\r\n // }, [])\r\n\r\n\r\n return (\r\n Payments to Include
\r\n\r\n \r\n
\r\n Select All {\"\"} \r\n 0? false : true}\r\n\r\n />\r\n
\r\n \r\n\r\n\r\n \r\n \r\n \r\n
\r\n
\r\n | Invoice # | \r\n\r\n Total Amount\r\n | \r\n\r\n Total Paid\r\n | \r\n\r\n Outstanding Amount\r\n | \r\nInclude | \r\n
|---|---|---|---|---|
| {item?.invoiceNo} | \r\n{moneyInTxt(item?.totalAmount)} | \r\n{moneyInTxt(item?.totalPaid)} | \r\n{moneyInTxt(item?.outstandingBalance)} | \r\n\r\n \r\n | \r\n
\r\n setShow(false)}\r\n >\r\n ×\r\n \r\n
\r\n \r\n Create Payment Plan\r\n
\r\n\r\n \r\n
\r\n \r\n\r\n + Save\r\n \r\n \r\n
\r\n {/* \r\n \r\n
+ Save
\r\n \r\nCancel
\r\n \r\n \r\n \r\n\r\n \r\n\r\n */}\r\n \r\n }\r\n \r\n
\r\n setShow(false)}\r\n >\r\n ×\r\n \r\n
\r\n\r\n \r\n Payments\r\n
\r\n\r\n\r\n \r\n
\r\n\r\n
\r\n \r\n | Name | \r\nDuration | \r\nStart Date | \r\n\r\n\r\n Total Amount\r\n | \r\n\r\n Installment Amount\r\n | \r\n\r\n Total Paid\r\n | \r\n \r\n
|---|---|---|---|---|---|
| {item?.name} | \r\n{item?.duration} | \r\n{moment(item?.startDate,\"MM-DD-YYYY\").format(\"DD/MMM/YYYY\")} | \r\n{moneyInTxt(item?.totalAmount)} | \r\n{moneyInTxt(item?.installAmount)} | \r\n{moneyInTxt(item?.totalPaid)} | \r\n\r\n
\r\n \r\n {/* \r\n Close\r\n */}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nconst PaymentPlanTable = () => {\r\n const [paymentPlans, setPaymentPlans] = useState([])\r\n const [showMoreDetails, setShowMoreDetails]=useState(false)\r\n const [showModal,setShowModal]=useState([])\r\n\r\n useEffect(() => {\r\n\r\n const init = async () => {\r\n try {\r\n let Payplan = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}PaymentPlan`,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n \r\n )\r\n setPaymentPlans(Payplan.data)\r\n if(Payplan?.data?.length === 0) toast.info(\"No data found\")\r\n } catch (error) {\r\n\r\n RefreshToken(error,init)\r\n \r\n }\r\n }\r\n init()\r\n\r\n return () => {\r\n\r\n }\r\n }, [])\r\n \r\n \r\n\r\n\r\n const GetTableData=async(e)=>{\r\n setShowMoreDetails(true)\r\n await fetch(\r\n `${process.env.REACT_APP_API_ROOT_PSL}PaymentPlan/${e}`\r\n )\r\n .then((res) => res.json())\r\n .then((data) =>\r\n setShowModal([...data])\r\n ).catch(e => {\r\n toast.error(\"error loading payment plans\")\r\n console.log({ e });\r\n })\r\n\r\n }\r\n\r\n\r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n
\r\n {show ?\r\n \r\n \r\n
\r\n Payment Plans
\r\n\r\n\r\n {setShow(true); getCustomerTypes() } }\r\n size=\"md\"\r\n >\r\n + Create Payment Plan\r\n \r\n
\r\n \r\n
\r\n | Invoice # | */}\r\n\r\n Payment Plan Name\r\n | \r\n\r\n Service Provider\r\n | \r\n\r\n Start Date\r\n | \r\n\r\n End Date\r\n | \r\n\r\n Installment Amount\r\n | \r\nStatus | \r\nActions | \r\n
|---|---|---|---|---|---|---|---|
| \r\n {paymentPlan.name}\r\n | \r\n\r\n {paymentPlan.serviceProviderId}\r\n | \r\n\r\n {/* {new Date(paymentPlan.startDate).toLocaleDateString(\"en-gb\")} */}\r\n {moment(paymentPlan.startDate,\"MM-DD-YYYY\").format(\"DD/MMM/YYYY\")}\r\n \r\n\r\n | \r\n\r\n {/* {new Date(paymentPlan.endDate).toLocaleDateString(\"en-gb\")} */}\r\n {moment(paymentPlan.endDate,\"MM-DD-YYYY\").format(\"DD/MMM/YYYY\")}\r\n | \r\n\r\n \r\n {moneyInTxt(paymentPlan.installAmount)}\r\n | \r\n\r\n {/* */}\r\n status\r\n | \r\n \r\n < td style={{display:\"grid\", placeContent:\"center\"}}>\r\n {GetTableData(paymentPlan?.id)}} className='fas fa-eye text-info mr-3' />\r\n {/*
\r\n \r\n \r\n
\r\n )\r\n}\r\nexport default EmptyHeader","import { BoldBI } from '@boldbi/boldbi-embedded-sdk'\r\nimport React, { useEffect, useState } from 'react'\r\nimport { Card, CardBody, Col, Container, Row } from 'reactstrap'\r\nimport EmptyHeader from './Headers/EmptyHeader'\r\nimport Loader from './Modals/Loader'\r\nimport IdleTimer from './IdleTimer'\r\n \r\n\r\n const Dashboard = () => {\r\n\r\n const environment = \"onpremise\";\r\n const siteIdentifier = \"site/site1\";\r\n const apiHost=\"http://localhost:3000/\"\r\n const rootUrl = \"http://localhost:64503/bi/\";\r\n\r\n function renderDashboard() {\r\n var boldbiEmbedInstance = BoldBI.create({\r\n dashboardSettings: {\r\n showHeader: false,\r\n showExport: true,\r\n showRefresh: true\r\n },\r\n widgetSettings: {\r\n showMaximize: true,\r\n showFilter: true\r\n }\r\n });\r\n boldbiEmbedInstance.loadDashboard();\r\n }\r\n\r\n const EmbededDashboard = () => {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\nexport default Dashboard\r\n","// import \"../node_modules/@syncfusion/ej2-base/styles/material.css\";\r\n// import \"../node_modules/@syncfusion/ej2-lists/styles/material.css\";\r\n// import \"../node_modules/@syncfusion/ej2-buttons/styles/material.css\";\r\n// import \"../node_modules/@syncfusion/ej2-inputs/styles/material.css\";\r\n// import \"../node_modules/@syncfusion/ej2-popups/styles/material.css\";\r\n// import \"../node_modules/@syncfusion/ej2-react-calendars/styles/material.css\";\r\n\r\n\r\nimport React, { useRef, useState } from 'react'\r\nimport { Card, CardHeader, Col, Container, Row } from 'reactstrap'\r\nimport { Button } from 'reactstrap'\r\nimport { ToastContainer, toast } from 'react-toastify'\r\nimport IdleTimer from '../components/IdleTimer'\r\n\r\nconst InvoiceReport = () => {\r\n const [reportType, setReportType] = useState(\"\")\r\n const [category, setCategoryType] = useState(\"\")\r\n const [startDate, setStartDate] = useState(\"\")\r\n const [endDate, setEndDate] = useState(\"\")\r\n const months =['Jan', 'Feb', 'March', \"April\", 'May', 'June', 'July', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec']\r\n const userDetails = JSON.parse(sessionStorage.getItem('user')); \r\n const handleViwReport = () => {\r\n if (!reportType && !category) {\r\n return toast.warning(\"Select report type and category\")\r\n }\r\n if (!reportType) {\r\n return toast.warning(\"Select report type \")\r\n }\r\n if (!category) {\r\n return toast.warning(\"Select report category \")\r\n }\r\n\r\n if (startDate.length === 0 || ! new Date(startDate)) {\r\n return toast.warning(\"Select valid start date \")\r\n }\r\n\r\n if (endDate.length ===0 || ! new Date(endDate)) {\r\n return toast.warning(\"Select valid end date \")\r\n }\r\n if ( !(new Date(endDate) >= new Date(startDate))) {\r\n return toast.warning(\"End date must be ahead of start date\")\r\n }\r\n\r\n if (reportType && reportTypesArr.find(ele => { return ele.name?.toString()?.toLowerCase() === reportType.toLowerCase()}) \r\n && (category &&reportCartegoryArr?.find(ele => { return ele?.value.toString().toLowerCase() === category?.toString()?.toLowerCase()}))\r\n && (endDate.length !==0 && new Date(endDate))\r\n && (startDate.length !==0 && new Date(startDate))\r\n && (new Date(endDate) >= new Date(startDate))\r\n ) {\r\n \r\n localStorage.setItem(\"reportParams\", JSON.stringify({\r\n type : reportType, \r\n category : category, \r\n startDate : `${startDate.split(\"-\")[1]}-${startDate.split(\"-\")[2]}-${startDate.split(\"-\")[0]}`, \r\n endDate: `${endDate.split(\"-\")[1]}-${endDate.split(\"-\")[2]}-${endDate.split(\"-\")[0]}`,\r\n userId : userDetails?.pkId,\r\n filter: userDetails?.pkId\r\n }\r\n )),\r\n window?.open(`${process.env.REACT_APP_BASE_ROUTE}/viewReport`, '_blank')\r\n }\r\n }\r\n\r\n const reportTypesArr = [\r\n {\r\n id: 1,\r\n name: \"Listing Report\"\r\n }\r\n ]\r\n const reportCartegoryArr = [\r\n {\r\n id: 1,\r\n name: \"Invoice Listing\",\r\n value :\"InvoiceListing\"\r\n },\r\n {\r\n id: 2,\r\n name: \"Invoice Listing By Item\",\r\n value : \"InvoiceListingByItem\"\r\n },\r\n {\r\n id: 3,\r\n name: \"Invoice Payment Listing\",\r\n value : \"InvoicePaymentListing\"\r\n }\r\n ]\r\n\r\n return (\r\n \r\n
\r\n )\r\n}\r\nexport default InvoiceReport;\r\n\r\nconst styles =\r\n{\r\n position: \"absolute\",\r\n top: \"103%\",\r\n right: '0',\r\n width: \" 120px\",\r\n transform: \"translateY(-50%)\"\r\n\r\n}","import moment from 'moment'\r\nimport React from 'react'\r\nimport { Card, Table, Form, Input, Row } from 'reactstrap'\r\n// import npa from '../../assets' \r\n\r\nconst moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n })\r\n return nf.format(Number(value) ? value : 0.0)\r\n}\r\n\r\nexport default function InvoiceDetailedView({\r\n data,\r\n selectedInvoice,\r\n setSelectedInvoice,\r\n showDecline,\r\n setDisabled,\r\n setIsTypingReason,\r\n base64Item\r\n\r\n}) {\r\n const handleDisableButton = () => {\r\n setDisabled(false)\r\n\r\n if (selectedInvoice.declineReason) {\r\n setIsTypingReason(true)\r\n } else {\r\n setIsTypingReason(false)\r\n }\r\n }\r\n//console.log(data);\r\n return (\r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n Preview Report
\r\n\r\n \r\n setReportType(e.target.value)} name=\"reportType\">\r\n \r\n {\r\n reportTypesArr.map((x, i) => ())\r\n }\r\n\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n
\r\n \r\n \r\n {startDate ? `${startDate.split(\"-\")[2] ? startDate.split(\"-\")[2] : \"\" } - ${Number(startDate.split(\"-\")[1]) ? months[Number(startDate.split(\"-\")[1])-1] : \"\"} - ${startDate.split(\"-\")[0] ? startDate.split(\"-\")[0] :\"\"}`:\"dd/mm/yyyy\"} \r\n \r\n setStartDate(e.target.value)}\r\n />\r\n
}\r\n \r\n\r\n \r\n \r\n \r\n \r\n {endDate ? `${endDate.split(\"-\")[2] ? endDate.split(\"-\")[2] : \"\" } - ${Number(endDate.split(\"-\")[1]) ? months[Number(endDate.split(\"-\")[1])-1] : \"\"} - ${endDate.split(\"-\")[0] ? endDate.split(\"-\")[0] :\"\"}` :\"dd/mm/yyyy\"} \r\n \r\n setEndDate(e.target.value)}\r\n />\r\n
}\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n .default})
\r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
\r\n
\r\n\r\n \r\n \r\n\r\n \r\n No. 6 George W. Bush Highway
Adj. Petroleum Commission\r\n
\r\n Dzorwulu Accra.\r\n
\r\n \r\n
\r\n INVOICE
\r\n#{data.invoiceNo}
\r\n\r\n Issued on: {moment(data.docDate,\"YYYY-MM-DD\").format(\"DD MMM YYYY\")} \r\n {/* Issued on: {new Date(data.docDate).toDateString().substring(3)} */}\r\n
\r\n\r\n Due Date: {moment(data.docDueDate,\"YYYY-MM-DD\").format(\"DD MMM YYYY\")}\r\n {/* Due Date: {new Date(data.docDueDate).toDateString().substring(3)} */}\r\n
\r\n\r\n
\r\n\r\n Invoice for: {data.customerName}
\r\n {/*{data.customerName}
\r\n{data.type}
*/}\r\n\r\n \r\n \r\n
\r\n
\r\n | \r\n {' '}\r\n Code\r\n | \r\n\r\n Description\r\n | \r\n\r\n Qty\r\n | \r\n\r\n Price\r\n | \r\n\r\n Amount\r\n | \r\n
|---|---|---|---|---|
| {item?.itemCode} | \r\n\r\n {item?.quantity}\r\n | \r\n\r\n {moneyInTxt(item?.price)}\r\n | \r\n\r\n {moneyInTxt(item?.quantity * item.price)}\r\n | \r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n Total{data.currency? `(${data.currency})` : \"\"} {' '}\r\n
\r\n\r\n \r\n {moneyInTxt(\r\n data?.invoiceItems?.reduce(\r\n (total, item) => total + item?.quantity * item?.price,\r\n 0\r\n )\r\n )}\r\n
\r\n\r\n
\r\n {/* \r\n Balance{data.currency? `(${data.currency})` : \"\"} {' '}\r\n
\r\n{moneyInTxt(\r\n data?.balance)}\r\n
\r\n\r\n Total{data.currency? `(${data.currency})` : \"\"} {' '}\r\n {moneyInTxt(\r\n data?.invoiceItems?.reduce(\r\n (total, item) => total + item?.quantity * item?.price,\r\n 0\r\n )\r\n )}\r\n
\r\n\r\n Balance{data.currency? `(${data.currency})` : \"\"} {' '}\r\n {moneyInTxt(\r\n data?.balance)}\r\n \r\n \r\n
*/}\r\n\r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nconst styles = {\r\n header: {\r\n display: 'flex',\r\n height: '20%',\r\n marginBottom: 20,\r\n },\r\n leftHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-start',\r\n //border: '1px solid blue',\r\n },\r\n\r\n rightHeader: {\r\n display: 'flex',\r\n width: '50%',\r\n flexDirection: 'column',\r\n alignItems: 'flex-end',\r\n //border: '1px solid green',\r\n },\r\n title: {\r\n // height: '14%',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: \"5px 10px\",\r\n marginBottom: 15,\r\n marginTop:-15\r\n },\r\n body: {\r\n marginTop: 0,\r\n height: '280px',\r\n maxHeight: '280px',\r\n overflow: 'auto',\r\n },\r\n footer: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n marginTop: 0,\r\n // height: '10%',\r\n // overflow: 'auto',\r\n },\r\n total: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: '100%',\r\n marginLeft: '65%',\r\n borderTop: '1px solid #e3e3e3',\r\n paddingTop: 10,\r\n //paddingRight: 50,\r\n marginTop: 10,\r\n },\r\n comments: {\r\n height: 60,\r\n width: '47%',\r\n overflow: 'auto',\r\n flexDirection: 'row',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: 10, \r\n color: '#cecece',\r\n marginTop: -50,\r\n },\r\n tablehead: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n alignItems: 'flex-end',\r\n },\r\n bottomcomments: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n },\r\n decline: {\r\n height: 60,\r\n width: '47%',\r\n // overflow: 'auto',\r\n // flexDirection: 'row',\r\n backgroundColor: '#eff4fd',\r\n borderRadius: 10,\r\n padding: 10,\r\n color: 'darkred',\r\n marginTop: 40,\r\n },\r\n reason: {\r\n backgroundColor: 'inherit',\r\n },\r\n}\r\n","import moment from 'moment'\r\nimport React, { useEffect, useState } from 'react'\r\n\r\nimport { Modal, Button, Table, Row, Container, Col, Card, CardHeader } from 'reactstrap'\r\nimport { moneyInTxt } from 'views/Index'\r\nfunction InvoiceViewPrint({setShowPrint,showPrint, base64Item}) {\r\n const [totalPaid,setTotalPaid]=useState(0)\r\n//console.log(base64Item);\r\n return (\r\n \r\n {/*
\r\n {showDecline ? (\r\n {data.comments}
*/}\r\n{data?.remarks}
\r\n\r\n {/* \r\n setSelectedInvoice({\r\n ...selectedInvoice,\r\n declineReason: e.target.value,\r\n })\r\n }\r\n onKeyDown={handleDisableButton}\r\n />\r\n
\r\n ) : null}\r\n Decline Reason
*/}\r\n\r\n
\r\n \r\nsetShowPrint(false)}\r\n >\r\n ×\r\n \r\n
\r\n\r\n \r\n Invoices\r\n
\r\n\r\n \r\n
\r\n\r\n \r\n\r\n
\r\n \r\n {/* \r\n \r\n */}\r\n {/* \r\n Close\r\n */}\r\n {/*
*/}\r\n ![\"Error\"](\"img/reportErrorImage.png\")
\r\n handleBase64(selectedInvoice)}\r\n >\r\n \r\n Print Invoice\r\n\r\n \r\n\r\n setShowViewDetails(false)}\r\n >\r\n ×\r\n \r\n
\r\n \r\n View Details\r\n
\r\n \r\n\r\n {/* \r\n \r\n approve(selectedInvoice)}\r\n style={{ width: '100%' }}\r\n >\r\n
*/}\r\n
\r\n \r\n \r\n {showPrint ? Are you sure you want to cancel this invoice?
*/}\r\n \r\n\r\n\r\n setShowViewDetails(false)}\r\n >\r\n ×\r\n \r\n
\r\n \r\n View Details\r\n
\r\n\r\n \r\n setShowViewDetails(false)}\r\n ref={declineRef}\r\n size='sm'\r\n >\r\n handleCancelInvoice(selectedInvoice)}\r\n style={{ width: '100%' }}\r\n size='sm'\r\n >\r\n
\r\n
\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default CancelInvoice\r\n","import { useState, useEffect, createContext, useLayoutEffect } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { loadInvoice } from \"actions\";\r\n\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n Table,\r\n Container,\r\n Row,\r\n Col,\r\n Modal,\r\n Badge,\r\n FormGroup,\r\n} from \"reactstrap\";\r\n\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faEye } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\nimport Header from \"components/Headers/Header.js\";\r\nimport IdleTimer from \"components/IdleTimer\";\r\nimport ViewOnlyDetails from \"components/Modals/ViewOnlyDetails\";\r\nimport CancelInvoice from \"components/Modals/CancelInvoice\";\r\nimport moment from \"moment\";\r\nimport Loader from \"../components/Modals/Loader\";\r\nimport { ToastContainer, toast } from \"react-toastify\";\r\nimport InvoiceAutocomplete from \"../components/InvoiceAutocomplete\";\r\nimport axios from \"axios\";\r\nimport RefreshToken from \"components/RefreshToken\";\r\nimport ListPagination from \"components/ListPagination\";\r\n\r\nconst moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n });\r\n return nf.format(Number(value) ? value : 0.0);\r\n};\r\n\r\nexport const AppContext = createContext(null);\r\n\r\nconst init = {\r\n name: \"\",\r\n serviceProviderId: \"\",\r\n duration: \"\",\r\n startDate: \"\",\r\n currency: \"\",\r\n supportedBranch: \"\",\r\n};\r\n\r\nconst InvoiceCancel = (props) => {\r\n const [showViewDetails, setShowViewDetails] = useState(false);\r\n const [prevData, setPrevData] = useState([]);\r\n const [failedGHGOVInvoices, setFailedGHGHOVInvoices] = useState([]);\r\n const [invoiceList, setInvoiceList] = useState(failedGHGOVInvoices);\r\n const [showLoader, setshowLoader] = useState(false);\r\n const [data, setData] = useState(failedGHGOVInvoices);\r\n const [formData, setFormData] = useState(init);\r\n const [error, setError] = useState(\"\");\r\n // for pagination\r\n const [paginationDetails, setPaginationDetails] = useState({page: 1, filter:\"*\", pageSize: 10, status: 4, totalCount:0})\r\n\r\n const dispatch = useDispatch();\r\n\r\n\r\n const userDetails = JSON.parse(sessionStorage.getItem(\"user\"));\r\n\r\n const handleGetInvoices = async () => {\r\n try {\r\n setshowLoader(true);\r\n let results = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Invoices/GetInvoicesByUserAndStatus/${userDetails?.pkId}?status=${paginationDetails.status}&PageNumber=${paginationDetails.page}&PageSize=${paginationDetails.pageSize}&Filter=${paginationDetails?.filter}`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n );\r\n setFailedGHGHOVInvoices(results.data?.data)\r\n if(results?.data?.data?.length === 0) toast.info(\"No data found\")\r\n setPrevData(results.data?.data);\r\n setPaginationDetails(p=> { return {...p, page: results.data?.pageNo, pageSize: results.data?.pageSize, totalCount: results.data?.totalCount}})\r\n setshowLoader(false);\r\n } catch (error) {\r\n console.log(error)\r\n RefreshToken(error, handleGetInvoices);\r\n }\r\n\r\n setshowLoader(false);\r\n };\r\n useLayoutEffect(() => {\r\n handleGetInvoices();\r\n return () => {};\r\n }, [paginationDetails?.page, paginationDetails?.pageSize]);\r\n\r\n const previewSelectedInvoice = (id) => {\r\n //console.log(id)\r\n const selectedItem = failedGHGOVInvoices.find((item) => item.id === id);\r\n // console.log('Selected Item', selectedItem)\r\n setData(selectedItem);\r\n setShowViewDetails(true);\r\n };\r\n\r\n \r\n // useEffect(() => {\r\n // const controller = new AbortController();\r\n // const signal = controller.signal;\r\n // dispatch(loadInvoice());\r\n // // console.log('Pending invoices: ', invoiceList)\r\n // return () => {\r\n // //cleanup;\r\n // if (signal.aborted === false) {\r\n // controller.abort();\r\n // }\r\n // };\r\n // }, []);\r\n const handleRow = (data) => {\r\n //console.log(data);\r\n setData(data);\r\n setShowViewDetails(true);\r\n };\r\n\r\n useEffect(()=>{\r\n if(error){\r\n setTimeout(()=>{\r\n setError(\"\")\r\n },3000)\r\n }\r\n }, [error])\r\n \r\n \r\n return (\r\n <>\r\n \r\n {showLoader ? \r\n \r\n {\" \"}\r\n {/* className='mt-5' */}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {showViewDetails ? (\r\n \r\n \r\n ) : null}\r\n \r\n
\r\n \r\n );\r\n};\r\nexport default InvoiceCancel;\r\n\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '470px',\r\n maxHeight: '470px',\r\n },\r\n}\r\n","import { useState, useEffect, createContext, useLayoutEffect } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { loadInvoice } from \"actions\";\r\nimport axios from \"axios\";\r\n\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n Table,\r\n Container,\r\n Row,\r\n Col,\r\n Modal,\r\n Badge,\r\n FormGroup,\r\n} from \"reactstrap\";\r\n\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faEye } from \"@fortawesome/free-solid-svg-icons\";\r\nimport IdleTimer from \"components/IdleTimer\";\r\nimport ViewOnlyDetails from \"components/Modals/ViewOnlyDetails\";\r\nimport moment from \"moment\";\r\nimport Loader from \"../components/Modals/Loader\";\r\nimport FailureModal from \"components/Modals/FailureModal\";\r\nimport { ToastContainer, toast } from \"react-toastify\";\r\nimport { faFileInvoice } from \"@fortawesome/free-solid-svg-icons\";\r\nimport InvoiceAutocomplete from \"../components/InvoiceAutocomplete\";\r\nimport RefreshToken from \"components/RefreshToken\";\r\nimport ListPagination from \"components/ListPagination\";\r\n\r\nconst moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n });\r\n return nf.format(Number(value) ? value : 0.0);\r\n};\r\n\r\nexport const AppContext = createContext(null);\r\nconst init = {\r\n name: \"\",\r\n serviceProviderId: \"\",\r\n duration: \"\",\r\n startDate: \"\",\r\n currency: \"\",\r\n supportedBranch: \"\",\r\n};\r\n\r\nconst ViewOnly = (props) => {\r\n // const masterInvoiceList = useSelector((state) => state.masterInvoiceList)\r\n\r\n const [showViewDetails, setShowViewDetails] = useState(false);\r\n const [GHGOVInvoices, setGHGHOVInvoices] = useState([]);\r\n const [prevData, setPrevData] = useState([]);\r\n const [invoiceList, setInvoiceList] = useState(GHGOVInvoices);\r\n const [data, setData] = useState(GHGOVInvoices);\r\n const [showLoader, setshowLoader] = useState(false);\r\n const [declineReason, setDeclineReason] = useState([]);\r\n const [showDeclineReason, setShowDeclineReason] = useState(false);\r\n const [base64Item, setBase64Item] = useState(\"\");\r\n const users = JSON.parse(sessionStorage.getItem(\"user\"));\r\n const [formData, setFormData] = useState(init);\r\n const [error, setError] = useState(\"\");\r\n // for pagination\r\n const [paginationDetails, setPaginationDetails] = useState({page: 1, filter:\"*\", pageSize: 10, status: 3, totalCount:0})\r\n\r\n const handleGetInvoices = async () => {\r\n try {\r\n setshowLoader(true);\r\n let results = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Invoices/GetInvoicesByUserAndStatus/${users?.pkId}?status=${paginationDetails.status}&PageNumber=${paginationDetails.page}&PageSize=${paginationDetails.pageSize}&Filter=${paginationDetails?.filter}`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n );\r\n setGHGHOVInvoices(results?.data?.data)\r\n if(results?.data?.data?.length === 0) toast.info(\"No data found\")\r\n setPaginationDetails((p)=>{\r\n return {...p, page: results?.data?.pageNo, pageSize: results?.data?.pageSize, totalCount: results?.data?.totalCount}\r\n })\r\n setPrevData(results?.data?.data);\r\n\r\n if(results?.data?.data?.length === 0){\r\n toast.info(\"No results found\")\r\n }\r\n } catch (error) {\r\n RefreshToken(error, handleGetInvoices);\r\n }\r\n setshowLoader(false);\r\n };\r\n\r\n useEffect(() => {\r\n handleGetInvoices();\r\n return () => {};\r\n }, [paginationDetails?.pageSize, paginationDetails.page]);\r\n\r\n const userDetails = JSON.parse(sessionStorage.getItem(\"user\"));\r\n\r\n const handleRow = (data) => {\r\n //handleBase64(data)\r\n setData(data);\r\n setShowViewDetails(true);\r\n };\r\n const handleViewFailedReason = async (id) => {\r\n try {\r\n let results = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Payment/GetPaymentByInvoiceNo?invoiceNo=${id}`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n );\r\n handleDeclinedData(results.data);\r\n } catch (error) {\r\n RefreshToken(error, handleViewFailedReason);\r\n }\r\n };\r\n const handleDeclinedData = (data) => {\r\n setDeclineReason((prev) => data);\r\n setShowDeclineReason(true);\r\n };\r\n\r\n //handling keyboard pressed\r\n useLayoutEffect(() => {\r\n if(paginationDetails?.filter?.length === 0){\r\n handleGetInvoices()\r\n }\r\n \r\n const enterKeyPressed =(event) => {\r\n if(event.key?.toString()?.toLowerCase() === \"enter\"){\r\n return handleGetInvoices()\r\n }\r\n }\r\n\r\n document?.addEventListener(\"keydown\", enterKeyPressed)\r\n return () => {\r\n document?.removeEventListener(\"keydown\", enterKeyPressed)\r\n }\r\n }, [paginationDetails.filter, paginationDetails.page, paginationDetails.pageSize])\r\n \r\n\r\n useEffect(()=>{\r\n if(error){\r\n setTimeout(()=>{\r\n setError(\"\")\r\n },3000)\r\n }\r\n }, [error])\r\n\r\n \r\n // console.log(paginationDetails)\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n
\r\n {/*
\r\n Invoices
\r\n\r\n {/*
List of pending invoices
*/}\r\n\r\n \r\n \r\n
\r\n \r\n {error && error}
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n Invoice # \r\n \r\n Date\r\n \r\n \r\n Customer\r\n \r\n \r\n Currency\r\n \r\n \r\n Balance\r\n \r\n\r\n \r\n Total Amount\r\n \r\n \r\n Status\r\n \r\n \r\n \r\n \r\n {failedGHGOVInvoices?.map((invoice, key) => (\r\n handleRow(invoice)}\r\n >\r\n {invoice.invoiceNo} \r\n \r\n {moment(invoice?.docDate, \"YYYY-MM-DD\").format(\r\n \"DD/MMM/YYYY\"\r\n )}\r\n \r\n {invoice.customerName} \r\n {invoice.currency} \r\n \r\n {moneyInTxt(invoice.balance)}\r\n \r\n\r\n \r\n {moneyInTxt(invoice.totalAmount)}\r\n \r\n\r\n \r\n \r\n {invoice?.status}\r\n \r\n \r\n\r\n \r\n ))}\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {showLoader ? \r\n \r\n {\" \"}\r\n {/* className='mt-5' */}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {showViewDetails ? (\r\n \r\n \r\n ) : null}\r\n {showDeclineReason && (\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default ViewOnly;\r\n\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '480px',\r\n maxHeight: '480px',\r\n }\r\n}\r\n","import { useState, useEffect, createContext, useLayoutEffect } from 'react'\r\nimport { useSelector, useDispatch } from 'react-redux'\r\nimport { loadInvoice } from 'actions'\r\n\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n Table,\r\n Container,\r\n Row,\r\n Col,\r\n Modal,\r\n Badge,\r\n FormGroup,\r\n} from 'reactstrap'\r\n\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport { faEye } from '@fortawesome/free-solid-svg-icons'\r\n\r\nimport Header from 'components/Headers/Header.js'\r\nimport ViewDetails from 'components/Modals/ViewDetails'\r\nimport IdleTimer from 'components/IdleTimer'\r\nimport Loader from 'components/Modals/Loader'\r\nimport { ToastContainer, toast } from 'react-toastify'\r\nimport moment from 'moment'\r\nimport InvoiceAutocomplete from 'components/InvoiceAutocomplete'\r\nimport axios from 'axios'\r\nimport RefreshToken from 'components/RefreshToken'\r\nimport ListPagination from '../components/ListPagination'\r\n\r\nconst moneyInTxt = (value, standard, dec = 2) => {\r\n var nf = new Intl.NumberFormat(standard, {\r\n minimumFractionDigits: dec,\r\n maximumFractionDigits: 2,\r\n })\r\n return nf.format(Number(value) ? value : 0.0)\r\n}\r\n\r\nexport const AppContext = createContext(null)\r\n\r\nconst init={\r\n name: \"\",\r\n serviceProviderId: \"\",\r\n duration: \"\",\r\n startDate: \"\",\r\n currency:\"\",\r\n supportedBranch:\"\"\r\n} \r\n\r\nconst ApprovalCancellation = (props) => {\r\n //const masterInvoiceList = useSelector((state) => state.masterInvoiceList)\r\nconst[masterInvoiceList,setMasterInvoiceList]=useState([])\r\n const [showViewDetails, setShowViewDetails] = useState(false)\r\n const [invoiceList, setInvoiceList] = useState(masterInvoiceList)\r\n const [data, setData] = useState({})\r\n const [showLoader, setshowLoader] = useState(false)\r\n const[formType,setFormType]=useState(\"Approval Cancellation\")\r\n const [prevData, setPrevData]=useState([])\r\n const dispatch = useDispatch()\r\n const [formData, setFormData] = useState(init)\r\n const [error, setError] = useState(\"\");\r\n\r\n // for pagination\r\n const [paginationDetails, setPaginationDetails] = useState({page: 1, filter:\"*\", pageSize: 10, status: 5, totalCount:0})\r\n const previewSelectedInvoice = (id) => {\r\n //console.log(id)\r\n const selectedItem = masterInvoiceList.find((item) => item.id == id)\r\n // console.log('Selected Item', selectedItem)\r\n setData(selectedItem)\r\n setShowViewDetails(true)\r\n }\r\n \r\n const users = JSON.parse(sessionStorage.getItem('user')); \r\n\r\n const handleGetInvoices = async () => {\r\n try {\r\n setshowLoader(true);\r\n\r\n let cancel = await axios.get(\r\n `${process.env.REACT_APP_API_ROOT_PSL}Invoices/GetInvoicesByUserAndStatus/${users?.pkId}?status=${paginationDetails.status}&PageNumber=${paginationDetails.page}&PageSize=${paginationDetails.pageSize}&Filter=${paginationDetails?.filter}`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n )\r\n setMasterInvoiceList(cancel.data?.data)\r\n if(cancel?.data?.data?.length === 0) toast.info(\"No data found\")\r\n setPrevData(cancel.data?.data)\r\n setPaginationDetails(p=> { return {...p, page: cancel.data?.pageNo, pageSize: cancel.data?.pageSize, totalCount: cancel.data?.totalCount}})\r\n setshowLoader(false)\r\n } catch (error) {\r\n RefreshToken(error,handleGetInvoices)\r\n }\r\n setshowLoader(false);\r\n }\r\n\r\n\r\n\r\n useLayoutEffect(() => {\r\n handleGetInvoices()\r\n return () => {}\r\n }, [paginationDetails?.page, paginationDetails?.pageSize])\r\n\r\n\r\n const handleRow=(data)=>{\r\n //console.log(data);\r\n setData(data);\r\n setShowViewDetails(true);\r\n }\r\n // /api/v1/Invoices/GetUnApprovedInvoices/20009\r\n //console.log(masterInvoiceList);\r\n\r\n useEffect(()=>{\r\n if(error){\r\n setTimeout(()=>{\r\n setError(\"\")\r\n },3000)\r\n }\r\n}, [error])\r\n\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n
\r\n {/*
\r\n Invoices
\r\n\r\n {/*
List of pending invoices
*/}\r\n\r\n \r\n \r\n
\r\n \r\n {error && error}
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n \r\n | Invoice # | \r\n\r\n Customer\r\n | \r\n\r\n Currency\r\n | \r\nBalance | \r\n\r\n Total Amount\r\n | \r\n\r\n\r\n Status\r\n | \r\nActions | \r\n{invoice?.invoiceNo} | \r\n\r\n {moment(invoice?.docDate, \"YYYY-MM-DD\").format(\r\n \"DD/MMM/YYYY\"\r\n )}\r\n | \r\n{invoice?.customerName} | \r\n{invoice?.currency} | \r\n\r\n {moneyInTxt(invoice.balance)}\r\n | \r\n\r\n\r\n {moneyInTxt(invoice?.totalAmount)}\r\n | \r\n {invoice?.status == \"Approved\" ? (\r\n\r\n | \r\n ) : null}\r\n\r\n {invoice?.status == \"Sent to SAP\" ? (\r\n \r\n | \r\n ) : null}\r\n\r\n {invoice?.status == \"Declined\" ? (\r\n \r\n | \r\n ) : null}\r\n {invoice?.status == \"Sent To SAP\" ? (\r\n \r\n | \r\n ) : null}\r\n {invoice?.status == \"Invoice Cancelled\" ? (\r\n \r\n | \r\n ) : null}\r\n {invoice?.status == \"\" || null ? (\r\n \r\n | \r\n ) : null}\r\n \r\n | \r\n \r\n ))}\r\n
|---|
\r\n {showLoader ? \r\n {/* className='mt-5' */}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {showViewDetails ? (\r\n \r\n \r\n ) : null}\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default ApprovalCancellation\r\n\r\nconst styles = {\r\n body: {\r\n marginTop: 0,\r\n height: '480px',\r\n maxHeight: '480px',\r\n overflow: 'auto',\r\n },\r\n}\r\n","export const CovertMonthNumbersToAlphabets = (date) => {\r\n if (!date || date.split(\"-\").length !== 3) {\r\n return date;\r\n } else {\r\n const months = [\r\n \"January\",\r\n \"February\",\r\n \"March\",\r\n \"April\",\r\n \"May\",\r\n \"June\",\r\n \"July\",\r\n \"August\",\r\n \"September\",\r\n \"October\",\r\n \"November\",\r\n \"December\",\r\n ];\r\n return `${date?.split(\"-\")[0]}-${months[Number(date.split(\"-\")[1]) - 1]}-${\r\n date?.split(\"-\")[2]\r\n }`;\r\n }\r\n};\r\n\r\nexport const convertMonthAlphabetsToNumbers = (date) => {\r\n if (!date || date.split(\"-\").length !== 3) {\r\n return date;\r\n } else {\r\n let dateMonth =\r\n date.split(\"-\")[1].toUpperCase() + date.split(\"-\")[1].slice(1);\r\n\r\n const months = [\r\n \"January\",\r\n \"February\",\r\n \"March\",\r\n \"April\",\r\n \"May\",\r\n \"June\",\r\n \"July\",\r\n \"August\",\r\n \"September\",\r\n \"October\",\r\n \"November\",\r\n \"December\",\r\n ];\r\n\r\n return `${date.split(\"-\")[0]}-${\r\n months.indexOf(dateMonth)?.toString().length < 2 ? \"0\" : \"\"\r\n }${months.indexOf(dateMonth + 1)}-${date.split(\"-\")[2]}`;\r\n }\r\n};\r\n","import { Button, Row, Input } from \"reactstrap\";\r\nimport { GiNextButton, GiPreviousButton } from \"react-icons/gi\";\r\nimport { useEffect, useRef, useState } from \"react\";\r\n\r\nconst ListPagination = ({\r\n ArrayOfItems,\r\n QuantityPerPage,\r\n setQuantityPerPage,\r\n startingPoint,\r\n setStartingPoint,\r\n endPointMultiplicator,\r\n setendPointMultiplicator,\r\n currentContent,\r\n setCurrentContent,\r\n children,\r\n}) => {\r\n const Styles = {\r\n button: {\r\n display: \"flex\",\r\n border: \"0px\",\r\n textAlign: \"\",\r\n margin: \"0px\",\r\n padding: \"2px\",\r\n height: \"100%\",\r\n backgroundColor: \"transparent\",\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n height: \"25px\",\r\n width: \"25px\",\r\n border: \"1px solid rgb(0,0,0,0.3)\",\r\n },\r\n bottonOnFocus: {\r\n backgroundColor: \"#9999ff\",\r\n color: \"white\",\r\n height: \"25px\",\r\n width: \"20px\",\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n },\r\n row: {\r\n width: \"100%\",\r\n fontSize: \"small\",\r\n padding: \"10px 0px\",\r\n backgroundColor: \"#E8E8E8\",\r\n position: \"relative\",\r\n },\r\n input: {\r\n width: \"128px\",\r\n },\r\n };\r\n\r\n const [currentNumberOfItems, setCurrentNumberOfItems] =\r\n useState(QuantityPerPage);\r\n\r\n const [feedback, setFeedback] = useState(\"\");\r\n const inputRef = useRef();\r\n\r\n let NumberOfPages = Math.floor(ArrayOfItems.length / Number(QuantityPerPage));\r\n let buttonsLabelsArray = [];\r\n\r\n for (var i = 0; i <= NumberOfPages; i++) {\r\n buttonsLabelsArray.push(i);\r\n }\r\n\r\n const [pagesNavigation, setPagesNavigations] = useState({\r\n all: buttonsLabelsArray.slice(\r\n startingPoint - 1,\r\n endPointMultiplicator * QuantityPerPage\r\n ),\r\n displayed: buttonsLabelsArray\r\n .slice(startingPoint - 1, endPointMultiplicator * QuantityPerPage)\r\n ?.slice(0, 10),\r\n hidden: buttonsLabelsArray\r\n .slice(startingPoint - 1, endPointMultiplicator * QuantityPerPage)\r\n .slice(10),\r\n previousDisplayed: [],\r\n });\r\n\r\n const moveToNext = () => {\r\n if (buttonsLabelsArray.length - Number(startingPoint) > QuantityPerPage) {\r\n setStartingPoint(QuantityPerPage * endPointMultiplicator + 1);\r\n setendPointMultiplicator(endPointMultiplicator + 1);\r\n\r\n setCurrentContent(\r\n ArrayOfItems.slice(\r\n QuantityPerPage * endPointMultiplicator * QuantityPerPage,\r\n QuantityPerPage * endPointMultiplicator * QuantityPerPage +\r\n QuantityPerPage\r\n )\r\n );\r\n\r\n setCurrentNumberOfItems(\r\n (QuantityPerPage * endPointMultiplicator + 1) * QuantityPerPage\r\n );\r\n }\r\n };\r\n\r\n const moveToPrevious = () => {\r\n if (Number(startingPoint) !== QuantityPerPage && startingPoint > 1) {\r\n setStartingPoint(startingPoint - QuantityPerPage);\r\n setendPointMultiplicator(endPointMultiplicator - 1);\r\n\r\n setCurrentContent(\r\n ArrayOfItems?.slice(\r\n ((startingPoint * QuantityPerPage - QuantityPerPage) /\r\n QuantityPerPage -\r\n QuantityPerPage +\r\n 1 -\r\n 1) *\r\n QuantityPerPage,\r\n ((startingPoint * QuantityPerPage - QuantityPerPage) /\r\n QuantityPerPage -\r\n QuantityPerPage +\r\n 1 -\r\n 1) *\r\n QuantityPerPage +\r\n QuantityPerPage\r\n )\r\n );\r\n\r\n setCurrentNumberOfItems(\r\n (startingPoint - QuantityPerPage) * QuantityPerPage\r\n );\r\n } else if (Number(startingPoint) === QuantityPerPage) {\r\n setStartingPoint(1);\r\n setendPointMultiplicator(1);\r\n }\r\n };\r\n\r\n const moveToLast = () => {\r\n setStartingPoint(\r\n Math.floor(NumberOfPages / QuantityPerPage) * QuantityPerPage + 1\r\n );\r\n\r\n setendPointMultiplicator(Math.ceil(NumberOfPages / QuantityPerPage));\r\n\r\n setCurrentContent(ArrayOfItems.slice(NumberOfPages * QuantityPerPage));\r\n\r\n setCurrentNumberOfItems(NumberOfPages * QuantityPerPage + QuantityPerPage);\r\n };\r\n\r\n const moveToFirst = () => {\r\n setStartingPoint(1);\r\n setendPointMultiplicator(1);\r\n\r\n setCurrentContent(ArrayOfItems.slice(0, QuantityPerPage));\r\n\r\n setCurrentNumberOfItems(QuantityPerPage);\r\n };\r\n\r\n const changeQuantityPerPage = () => {\r\n if (\r\n inputRef.current.value?.length > 0 &&\r\n Number(inputRef.current.value) > 0\r\n ) {\r\n setQuantityPerPage(Number(inputRef.current.value));\r\n setCurrentNumberOfItems(Number(inputRef.current.value));\r\n setStartingPoint(1);\r\n setendPointMultiplicator(1);\r\n setCurrentContent(ArrayOfItems.slice(0, Number(inputRef.current.value)));\r\n } else {\r\n setFeedback(\"Enter valid number\");\r\n }\r\n };\r\n\r\n //clear feedback\r\n useEffect(() => {\r\n if (feedback) {\r\n setTimeout(() => {\r\n setFeedback(\"\");\r\n }, 3000);\r\n }\r\n }, [feedback]);\r\n\r\n //set the navigation buttons when quatityPerPage or StartingPoint or EndPointMultiplicator changes\r\n useEffect(() => {\r\n setPagesNavigations((p) => {\r\n return {\r\n all: buttonsLabelsArray.slice(\r\n startingPoint - 1,\r\n endPointMultiplicator * QuantityPerPage\r\n ),\r\n displayed: buttonsLabelsArray\r\n .slice(startingPoint - 1, endPointMultiplicator * QuantityPerPage)\r\n ?.slice(0, 10),\r\n hidden: buttonsLabelsArray\r\n .slice(startingPoint - 1, endPointMultiplicator * QuantityPerPage)\r\n .slice(10),\r\n };\r\n });\r\n }, [QuantityPerPage, startingPoint, endPointMultiplicator]);\r\n\r\n return (\r\n <>\r\n {children}\r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n
\r\n \r\n
\r\n
\r\n Approve Invoices
\r\n\r\n
List of invoice cancellation
\r\n\r\n \r\n \r\n
\r\n \r\n {error && error}
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n | Invoice # | \r\n \r\n\r\n Customer\r\n | \r\n\r\n Currency \r\n | \r\nBalance | \r\n\r\n\r\n Total Amount\r\n | \r\n\r\n\r\n Status\r\n | \r\n {/*Actions | */}\r\n|
|---|---|---|---|---|---|---|---|
| \r\n {invoice.invoiceNo}\r\n | \r\n\r\n {invoice.customerName}\r\n | \r\n \r\n{moment(invoice?.docDate,\"YYYY-MM-DD\").format(\"DD/MMM/YYYY\")} | \r\n \r\n\r\n {invoice?.currency}\r\n | \r\n\r\n {moneyInTxt(invoice.balance)}\r\n | \r\n\r\n \r\n {moneyInTxt(invoice.totalAmount)}\r\n | \r\n\r\n \r\n | \r\n {/* \r\n | */}\r\n
\r\n \r\n .\r\n {feedback}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n setSearch(e.target.value);\r\n }}\r\n />\r\n \r\n {search &&\r\n logMessgaes\r\n ?.slice(\r\n startingPoint - 1,\r\n endPointMultiplicator * QuantityPerPage\r\n )\r\n ?.filter((log, key) => {\r\n if (search) {\r\n return (\r\n log?.transactionType\r\n ?.toLowerCase()\r\n ?.trim()\r\n .includes(search?.toLowerCase()?.trim()) ||\r\n log?.referenceNumber\r\n ?.toLowerCase()\r\n ?.trim()\r\n .includes(search?.toLowerCase()?.trim())\r\n );\r\n }\r\n }).length === 0 && (\r\n
\r\n \r\n \r\n {logMessgaes?.length > 0 && currentContent?.length > 0 && (\r\n No payments have been made
\r\n \r\n \r\n\r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n
\r\n
\r\n Business One Logs
\r\n\r\n\r\n
List of all errors
\r\n\r\n \r\n No invoice found...\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n \r\n Type \r\n Reference Number \r\n Date \r\n Time \r\n Message \r\n \r\n \r\n \r\n {currentContent\r\n ?.filter((log, key) => {\r\n if (search) {\r\n return (\r\n log?.transactionType\r\n ?.toLowerCase()\r\n ?.trim()\r\n .includes(search?.toLowerCase()?.trim()) ||\r\n log?.referenceNumber\r\n ?.toLowerCase()\r\n ?.trim()\r\n .includes(search?.toLowerCase()?.trim())\r\n );\r\n } else {\r\n return log;\r\n }\r\n })\r\n ?.map((log, key) => (\r\n \r\n {log?.transactionType} \r\n {log?.referenceNumber} \r\n \r\n {CovertMonthNumbersToAlphabets(\r\n log?.date.split(\" \")[0]\r\n )}\r\n \r\n {`${log?.date?.split(\" \")[1]} ${\r\n log?.date?.split(\" \")[2]\r\n }`} \r\n\r\n \r\n {log?.message}\r\n \r\n \r\n ))}\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n {showNewInvoiceModal ? (\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default BoldReport;\r\n","import BoldReport from \"../components/BoldReport\"\r\nimport { useEffect, useState } from \"react\"\r\n\r\nconst ViewReportInDiffTab =() =>{\r\n const [params] = useState(JSON.parse(localStorage.getItem(\"reportParams\")))\r\n const [showReport, setShowReport] = useState(false)\r\n const user = JSON.parse(sessionStorage.getItem(\"user\"));\r\n const reportParams = [\r\n {\r\n name: 'Filter',\r\n labels: [\"Filter\"],\r\n values:[`${params?.userId}`],\r\n nullable: false\r\n },\r\n {\r\n name: 'StartDate',\r\n labels: [\"Start Date\"],\r\n values:[params?.startDate],\r\n nullable: false\r\n },\r\n {\r\n name: 'EndDate',\r\n labels: ['End Date'],\r\n values:[params?.endDate],\r\n nullable: false\r\n },\r\n {\r\n name: 'Printedby',\r\n labels: ['Printed by'],\r\n value:[`${user?.szFirstName } ${user?.szLastName}`],\r\n nullable: false\r\n },\r\n {\r\n name: 'UserId',\r\n labels: [\"UserId\"],\r\n value:[`${params?.userId}`],\r\n nullable: false\r\n }\r\n ]\r\n \r\n\r\n useEffect(()=>{\r\n if(params.category.length > 0 ){\r\n setShowReport(true)\r\n }\r\n },[params])\r\n \r\n// console.log(params)\r\n return (\r\n <>\r\n {\r\n // user?.pkId?.toString()?.length > 0 ?\r\n <>\r\n {showReport && \r\n \r\n {getRoutes(routes)}\r\n {/* }> */}\r\n {/* \r\n \r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default Admin\r\n","/*!\r\n\r\n=========================================================\r\n* Argon Dashboard React - v1.2.1\r\n=========================================================\r\n\r\n* Product Page: https://www.creative-tim.com/product/argon-dashboard-react\r\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\r\n* Licensed under MIT (https://github.com/creativetimofficial/argon-dashboard-react/blob/master/LICENSE.md)\r\n\r\n* Coded by Creative Tim\r\n\r\n=========================================================\r\n\r\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\r\n\r\n*/\r\nimport { Link } from \"react-router-dom\";\r\n// reactstrap components\r\nimport {\r\n UncontrolledCollapse,\r\n NavbarBrand,\r\n Navbar,\r\n NavItem,\r\n NavLink,\r\n Nav,\r\n Container,\r\n Row,\r\n Col,\r\n} from \"reactstrap\";\r\n\r\nconst AdminNavbar = () => {\r\n return (\r\n <>\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {getRoutes(routes)}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n {/* Page content */}\r\n \r\n \r\n
\r\n
\r\n Welcome!
\r\n\r\n Use these awesome forms to login or create new account in\r\n your project for free.\r\n
\r\n \r\n\r\n \r\n
\r\n \r\n \r\n ×\r\n \r\n
\r\n \r\n Your attention is required\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {\r\n handleOnchange(e)\r\n \r\n }}\r\n\r\n />\r\n \r\n \r\n \r\n \r\n {\r\n handleOnchange(e)\r\n \r\n }}\r\n />\r\n \r\n \r\n
\r\n\r\n
\r\n Update your password
\r\n\r\n \r\n \r\n Close\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default FirstTime\r\n","import { useState } from 'react'\r\nimport { Link } from 'react-router-dom'\r\nimport axios from 'axios'\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n CardBody,\r\n FormGroup,\r\n Form,\r\n Input,\r\n InputGroupAddon,\r\n InputGroupText,\r\n InputGroup,\r\n Row,\r\n Col,\r\n} from 'reactstrap'\r\nimport { ToastContainer, toast } from 'react-toastify'\r\nimport 'react-toastify/dist/ReactToastify.css'\r\nimport Loader from '../../components/Modals/Loader'\r\nimport { useEffect } from 'react'\r\nimport FirstTime from 'components/Modals/FirstTime'\r\n\r\nconst FirstTimeLogin = () => {\r\n const [loginData, setloginData] = useState({ username: '', password: '' })\r\n const [showLoader, setshowLoader] = useState(false)\r\n const [handleKey, setHandleKey]=useState(false)\r\n const [showFirstTime,setShowFirstTime]=useState(false)\r\n \r\n const usersLogin = JSON.parse(sessionStorage.getItem('userLoginDeets')); \r\n//console.log(usersLogin);\r\n\r\n\r\n\r\n const login = async() => {\r\n if (loginData.username.trim() === '' || loginData.password.trim === '') {\r\n toast.warning('Fields cannot be empty')\r\n return\r\n } \r\n if(loginData.username.trim() !== loginData.password.trim()){\r\n toast.warning('Passwords do not match')\r\n return\r\n } else {\r\n setshowLoader(true)\r\n \r\n const postData = { \r\n szUserName: loginData.username,\r\n szClearText: loginData.password,\r\n AppId: 4017,\r\n user: 20009\r\n }\r\n \r\n\r\n const changepasswordDetails= {\r\n \"id\": usersLogin.pkId,\r\n \"firstName\": usersLogin.szFirstName,\r\n \"lastName\": usersLogin.szLastName,\r\n \"emailAddress\": usersLogin.szEmailAddress,\r\n \"password\": loginData.username\r\n }\r\n\r\n try {\r\n await axios\r\n .put(\r\n // `https://psl-webapps/AdminService/api/Users/SaveGetCredentials`,\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/UpdateChangeUserPassword`,changepasswordDetails,{ headers: {\r\n 'Authorization': `Bearer ${JSON.parse(sessionStorage.getItem(\"Token\"))}`\r\n }}\r\n )\r\n .then((res) => {\r\n \r\n if(res){\r\n toast.success(\"Your password was reset successfully\")\r\n\r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/auth/login`\r\n\r\n }\r\n\r\n \r\n // if (res.data.hasOwnProperty('ReturnType')) {\r\n // toast.error('Invalid credentials')\r\n // } else {\r\n // setloginData({ username: '', password: '' })\r\n // }\r\n })\r\n } catch (error) {\r\n if(error.message.includes('Request failed with status code 401')){\r\n console.log(\"error\");\r\n let refreshData = {\r\n token: JSON.parse(sessionStorage.getItem(\"Token\")),\r\n refreshToken: JSON.parse(sessionStorage.getItem(\"refreshToken\"))\r\n }\r\n await axios.post(\r\n `${process.env.REACT_APP_API_ROOT_PSL}UserInfo/RefreshToken`,refreshData\r\n ).then((res)=>{\r\n if(res?.data.accessToken != null){\r\n sessionStorage.setItem('Token', JSON.stringify(res.data.accessToken))\r\n sessionStorage.setItem('refreshToken', JSON.stringify(res.data.refreshToken))\r\n login()\r\n }\r\n else{\r\n toast.info(\"System failed,please try again later\")\r\n \r\n }\r\n })\r\n \r\n } setSupportBranches((prev) => [{ name: '', branch_code: '' }])\r\n }\r\n\r\n // )\r\n // .catch((error) => {\r\n // toast.warning('Error occured')\r\n // setloginData({ username: '', password: '' })\r\n // setshowLoader(false)\r\n // })\r\n }\r\n }\r\n\r\n\r\n\r\n// useEffect(() => {\r\n// let user = sessionStorage.getItem('user')\r\n \r\n// if (user) {\r\n// console.log('logged in')\r\n// // window.location = `/admin/index`\r\n \r\n// window.location = `${process.env.REACT_APP_BASE_ROUTE}/admin/index`\r\n// } else {\r\n// console.log('not logged in')\r\n// }\r\n\r\n// return () => { }\r\n// }, [])\r\n\r\n const handleKeyStroke=(e)=>{\r\n // \r\n if(e.code === \"Enter\"){\r\n login()\r\n }\r\n }\r\n \r\n return (\r\n \r\n {showLoader ? \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {showFirstTime && (
\r\n )\r\n}\r\n\r\nconst styles = {\r\n container: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n height: '100vh',\r\n background: 'rgb(37, 39, 60)',\r\n },\r\n}\r\nexport default FirstTimeLogin\r\n","import { useState } from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport axios from \"axios\";\r\nimport {\r\n Button,\r\n Card,\r\n CardHeader,\r\n CardBody,\r\n FormGroup,\r\n Form,\r\n Input,\r\n InputGroupAddon,\r\n InputGroupText,\r\n InputGroup,\r\n Row,\r\n Col,\r\n} from \"reactstrap\";\r\nimport { ToastContainer, toast } from \"react-toastify\";\r\nimport \"react-toastify/dist/ReactToastify.css\";\r\nimport Loader from \"../../components/Modals/Loader\";\r\nimport { useEffect } from \"react\";\r\nimport FirstTimeLogin from \"components/Modals/FirstTimeLogin\";\r\n\r\nconst Login = () => {\r\n const [loginData, setloginData] = useState({ username: \"\", password: \"\" });\r\n const [showLoader, setshowLoader] = useState(false);\r\n const [showFirstTime, setShowFirstTime] = useState(false);\r\n const [showLogin, setshowLogin] = useState(false);\r\n\r\n const login = async () => {\r\n if (loginData.username.trim() === \"\" || loginData.password.trim === \"\") {\r\n toast.warning(\"Username and Password required\");\r\n } else {\r\n setshowLoader(true);\r\n sessionStorage.setItem(\"usrName\", JSON.stringify(loginData.username));\r\n\r\n\r\n const tokenData = {\r\n username: loginData.username,\r\n password: loginData.password,\r\n AppId: 8,\r\n };\r\n\r\n await axios\r\n .post(`${process.env.REACT_APP_API_ROOT_PSL}UserInfo`, tokenData)\r\n .then((res) => {\r\n sessionStorage.setItem(\r\n \"userLoginDeets\",\r\n JSON.stringify(res.data.claims)\r\n );\r\n\r\n if (res.data.claims.iFirstTimeLogin == 0) {\r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/auth/changepassword`;\r\n return;\r\n }\r\n\r\n if (res.data.hasOwnProperty(\"ReturnType\")) {\r\n toast.error(\"Invalid login credentials\");\r\n } else {\r\n // console.log(res.data[0])\r\n sessionStorage.setItem(\"user\", JSON.stringify(res.data.claims));\r\n sessionStorage.setItem(\r\n \"Token\",\r\n JSON.stringify(res.data.accessToken)\r\n );\r\n sessionStorage.setItem(\r\n \"refreshToken\",\r\n JSON.stringify(res.data.refreshToken)\r\n );\r\n sessionStorage.setItem(\r\n \"businessUnit\",\r\n JSON.stringify(res.data.claims.businessUnit)\r\n );\r\n\r\n if (res.data) {\r\n // console.log(res.data);\r\n axios\r\n .get(\r\n `${process.env.REACT_APP_ADMIN_SERVICE_API}Menus/${tokenData.AppId}/en/${res.data?.claims.pkId}/LoadAllMenusByUserId`,\r\n {\r\n headers: {\r\n Authorization: `Bearer ${JSON.parse(\r\n sessionStorage.getItem(\"Token\")\r\n )}`,\r\n },\r\n }\r\n )\r\n .then((res) => {\r\n // console.log(res);\r\n sessionStorage.setItem(\"menus\", JSON.stringify(res.data));\r\n setshowLoader(false);\r\n // console.log(\"called\");\r\n // window.location =`/admin/index`\r\n\r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/admin/dashboard`;\r\n })\r\n .catch((error) => {\r\n setshowLoader(false);\r\n toast.warning(error);\r\n });\r\n }\r\n\r\n setloginData({ username: \"\", password: \"\" });\r\n }\r\n })\r\n .catch((error) => {\r\n toast.warning(\"User does not have an account\");\r\n setloginData({ username: \"\", password: \"\" });\r\n setshowLoader(false);\r\n });\r\n }\r\n };\r\n\r\n const passwordReset = () => {\r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/auth/forgotpassword`;\r\n };\r\n\r\n useEffect(() => {\r\n let user = sessionStorage.getItem(\"user\");\r\n\r\n if (user) {\r\n // window.location = `/admin/index`\r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/admin/index`;\r\n } else {\r\n }\r\n\r\n return () => { };\r\n }, []);\r\n\r\n const handleKeyStroke = (e) => {\r\n //\r\n if (e.code === \"Enter\") {\r\n login();\r\n }\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n You are required to change your password on first time login
\r\n Update your password\r\n\r\n {showLoader ? \r\n \r\n \r\n \r\n \r\n \r\n \r\n passwordReset()}\r\n >\r\n Forgot password?\r\n \r\n \r\n
\r\n \r\n {showFirstTime &&
\r\n );\r\n};\r\n\r\nconst styles = {\r\n container: {\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n height: \"100vh\",\r\n background: \"rgb(37, 39, 60)\",\r\n },\r\n};\r\nexport default Login;\r\n","const init = [\r\n {\r\n invoiceNo: 899007,\r\n ghGovRefernceNo: '',\r\n docDate: new Date().toLocaleDateString(),\r\n dueDate: new Date().toLocaleDateString(),\r\n remarks: 'no comments',\r\n periodId: 0,\r\n type: 'Licensing',\r\n customerName: 'Goil',\r\n customerCode: 0,\r\n businessUnit: 'UPPF',\r\n branchCode: 0,\r\n totalAmount: 1960000,\r\n currency: 'GHS',\r\n paymentStatus: 0,\r\n status: 2, // 1 -draft 2- pending 3- approved 4 -declined 5 -sap\r\n invoiceItems: [\r\n {\r\n price: 2400,\r\n itemCode: 91231,\r\n itemDescription: 'some description',\r\n quantity: 20,\r\n },\r\n ],\r\n },\r\n {\r\n invoiceNo: 899009,\r\n ghGovRefernceNo: '',\r\n docDate: new Date().toLocaleDateString(),\r\n dueDate: new Date().toLocaleDateString(),\r\n remarks: 'no comments',\r\n periodId: 0,\r\n type: 'Licensing',\r\n customerName: 'Alinco Oil',\r\n customerCode: 0,\r\n businessUnit: 'PPR',\r\n branchCode: 0,\r\n totalAmount: 250000,\r\n currency: 'GHS',\r\n paymentStatus: 0,\r\n status: 3, // 1 -draft 2- pending 3- approved 4 -declined 5 -sap\r\n invoiceItems: [\r\n {\r\n price: 5000,\r\n itemCode: 91231,\r\n itemDescription: 'some description',\r\n quantity: 50,\r\n },\r\n ],\r\n },\r\n {\r\n invoiceNo: 569007,\r\n ghGovRefernceNo: '',\r\n docDate: new Date().toLocaleDateString(),\r\n dueDate: new Date().toLocaleDateString(),\r\n remarks: 'no comments',\r\n periodId: 0,\r\n type: 'Licensing',\r\n customerName: 'Total',\r\n customerCode: 0,\r\n businessUnit: 'UPPF',\r\n branchCode: 0,\r\n totalAmount: 275000,\r\n currency: 'GHS',\r\n paymentStatus: 0,\r\n status: 4, // 1 -draft 2- pending 3- approved 4 -declined 5 -sap\r\n invoiceItems: [\r\n {\r\n price: 2250,\r\n itemCode: 56231,\r\n itemDescription: 'some description',\r\n quantity: 50,\r\n },\r\n ],\r\n },\r\n {\r\n invoiceNo: 639000,\r\n ghGovRefernceNo: '',\r\n docDate: new Date().toLocaleDateString(),\r\n dueDate: new Date().toLocaleDateString(),\r\n remarks: 'no comments',\r\n periodId: 0,\r\n type: 'Licensing',\r\n customerName: 'Star Oil',\r\n customerCode: 0,\r\n businessUnit: 'UPPF',\r\n branchCode: 0,\r\n totalAmount: 45900,\r\n currency: 'GHS',\r\n paymentStatus: 0,\r\n status: 5, // 1 -draft 2- pending 3- approved 4 -declined 5 -sap\r\n invoiceItems: [\r\n {\r\n price: 1500,\r\n itemCode: 91231,\r\n itemDescription: 'some description',\r\n quantity: 20,\r\n },\r\n ],\r\n },\r\n {\r\n invoiceNo: 869005,\r\n ghGovRefernceNo: '',\r\n docDate: new Date().toLocaleDateString(),\r\n dueDate: new Date().toLocaleDateString(),\r\n remarks: 'no comments',\r\n periodId: 0,\r\n type: 'Sanctions',\r\n customerName: 'Nagami Oil',\r\n customerCode: 0,\r\n businessUnit: 'UPPF',\r\n branchCode: 0,\r\n totalAmount: 45900,\r\n currency: 'GHS',\r\n paymentStatus: 0,\r\n status: 1, // 1 -draft 2- pending 3- approved 4 -declined 5 -sap\r\n invoiceItems: [\r\n {\r\n price: 1500,\r\n itemCode: 91231,\r\n itemDescription: 'some description',\r\n quantity: 20,\r\n },\r\n ],\r\n },\r\n]\r\n\r\nconst invoiceReducer = (state = [], action) => {\r\n switch (action.type) {\r\n case 'SAVE_INVOICE':\r\n //console.log('saving new invoice: ', action.payload)\r\n //console.log([...state, action.payload])\r\n return [...state, action.payload]\r\n\r\n case 'UPDATE_LIST':\r\n // console.log('updating list')\r\n //console.log(action.payload)\r\n return action.payload\r\n\r\n case 'LOAD_INVOICE_LIST':\r\n // console.log('loading list')\r\n state = action.payload\r\n return state\r\n\r\n default:\r\n //console.log('defaulting to empty')\r\n return state\r\n }\r\n}\r\n\r\nexport default invoiceReducer\r\n","const playgroundReducer = (state = 0, action) => {\r\n switch (action.type) {\r\n case \"INCREMENT\":\r\n return state + action.payload;\r\n case \"DECREMENT\":\r\n return state - action.payload;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport default playgroundReducer;\r\n","import invoiceReducer from \"./invoiceReducer\";\r\nimport playgroundReducer from \"./playgroundReducer\";\r\n\r\nimport { combineReducers } from \"redux\";\r\n\r\nconst allReducers = combineReducers({\r\n masterInvoiceList: invoiceReducer,\r\n counter: playgroundReducer,\r\n});\r\n\r\nexport default allReducers;\r\n","import React, { useEffect } from \"react\";\r\n\r\nimport { createContext, useState } from \"react\";\r\nimport { useIdleTimer } from 'react-idle-timer'\r\n\r\nconst CustomIdleTimerContext = createContext({});\r\n\r\nexport const IdleProvider = ({ children }) => {\r\n // const [suggest,setSuggest] = useState([]);\r\n const [state, setState] = useState('Active')\r\n const [count, setCount] = useState(0)\r\n const [remaining, setRemaining] = useState(0)\r\n\r\n const onIdle = () => {\r\n setState('Idle')\r\n }\r\n \r\n const onActive = () => {\r\n setState('Active')\r\n }\r\n \r\n const onAction = () => {\r\n setCount(count + 1)\r\n }\r\n \r\n const { getRemainingTime } = useIdleTimer({\r\n onIdle,\r\n onActive,\r\n onAction,\r\n timeout: 10_000,\r\n throttle: 500\r\n })\r\n\r\n useEffect(() => {\r\n const interval = setInterval(() => {\r\n setRemaining(Math.ceil(getRemainingTime() / 1000))\r\n }, 500)\r\n \r\n return () => {\r\n clearInterval(interval)\r\n }\r\n })\r\n \r\n\r\n return (\r\n \r\n
\r\n \r\n Sign in with credentials\r\n
\r\n \r\n \r\n {showLoader ? \r\n \r\n \r\n \r\n \r\n \r\n \r\n window.location = `${process.env.REACT_APP_BASE_ROUTE}/auth/login`\r\n }\r\n >\r\n Cancel\r\n \r\n \r\n\r\n
\r\n \r\n {showFirstTime && (
\r\n )\r\n}\r\n\r\nconst styles = {\r\n container: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n height: '100vh',\r\n background: 'rgb(37, 39, 60)',\r\n },\r\n}\r\nexport default ForgetPassword","import React from 'react'\r\nimport ReactDOM from 'react-dom'\r\nimport { BrowserRouter, Route, Switch, Redirect } from 'react-router-dom'\r\n\r\nimport 'assets/plugins/nucleo/css/nucleo.css'\r\nimport '@fortawesome/fontawesome-free/css/all.min.css'\r\nimport 'assets/scss/argon-dashboard-react.scss'\r\nimport './globals'\r\n\r\nimport AdminLayout from './layouts/Admin.js'\r\nimport AuthLayout from './layouts/Auth.js'\r\nimport Login from '../src/views/examples/Login.js'\r\n\r\nimport { createStore, applyMiddleware, compose } from 'redux'\r\nimport thunk from 'redux-thunk'\r\nimport allReducers from './reducers'\r\nimport { Provider } from 'react-redux'\r\nimport { IdleProvider } from 'provider/IdleProvider.js'\r\nimport FirstTimeLogin from 'components/Modals/FirstTimeLogin.js'\r\nimport ForgetPassword from 'components/Modals/ForgetPassword.js'\r\nimport ViewReportInDiffTab from 'views/ViewReportInDiffTab'\r\n\r\n// registerLicense('Ngo9BigBOggjHTQxAR8/V1NHaF5cXmVCf1FpRmJGdld5fUVHYVZUTXxaS00DNHVRdkdgWH5ecnRQRGVZVUZxV0o=')\r\n/* Things I will need for redux\r\n\r\n1. STORE --> Globalized State\r\n2. ACTION --> Describes whaat you wanna do\r\n3. REDUCER --> Modifies store based on action\r\n4. DISPATCH --> Sends action to reducer\r\n\r\n*/\r\n\r\nconst store = createStore(\r\n allReducers,\r\n compose(\r\n applyMiddleware(thunk)\r\n //window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()\r\n )\r\n)\r\n\r\nReactDOM.render(\r\n \r\n
\r\n \r\n
\r\n \r\n