| Id | \nBatchName | \nFrom Location | \nTo Location | \nType Name | \nUnits | \nStatus | \nDate Created | \n\n | navigateToManageMovements(order)}\n style={{cursor: \"pointer\"}}>\n {order.id}\n | \n{order.batchName ?? \"N/A\"} | \n{order.fromLocationName ?? \"N/A\"} | \n{order.toLocationName ?? \"N/A\"} | \n{order.typeName ?? \"N/A\"} | \n{order.units} ({order.unitsBookedIn}) | \n{returnStatusName(order.statusId)} | \n{formatDate(order.dateCreated)} | \n\n | \n \n );\n })}\n
|---|
| Order | \nTotal Price | \nSub Total | \nTotal Tax | \n {props.itemCardWebOrderInfoType !== \"Sold\" &&Quantity | }\nFulfillment Status | \nLocation | \n\n {order.orderNumber ?? \"N/A\"}\n | \n{`£${order?.totalPrice?.toFixed(2)}` ?? \"N/A\"} | \n{`£${order?.subtotal?.toFixed(2)}` ?? \"N/A\"} | \n{`£${order?.totalTax?.toFixed(2)}` ?? \"N/A\"} | \n {props.itemCardWebOrderInfoType !== \"Sold\" && (\n{order.quantity ?? \"N/A\"} | \n )}\n{order.fulfillmentStatus ?? \"N/A\"} | \n\n {order.locationId === 0 ? \"Web\" : order.location ?? \"N/A\"}\n | \n \n );\n })}\n
|---|
{props.title}
\n
\n );\n}\n\nexport default CustomAutoComplete;\n","export const getPermission = (userPermissons, permission) => {\n const data = userPermissons?.filter((item) => item === permission);\n\n if (data?.length > 0) return data;\n\n return null;\n};\n","import React, {useState, useEffect, useMemo, useRef} from \"react\";\nimport moment from \"moment\";\nimport CustomModal from \"components/Shared/CustomModal\";\n\nimport {\n Card,\n Container,\n Row,\n Col,\n Button,\n Form,\n Tooltip,\n OverlayTrigger,\n} from \"react-bootstrap\";\nimport {useSelector} from \"react-redux\";\n\nimport DateRange from \"../../components/Shared/DateRange\";\nimport CustomSelect from \"../../components/Shared/CustomSelect\";\nimport PurchaseOrderTable from \"components/PurchaseOrder/PurchaseOrderTable\";\nimport PurchaseOrderModal from \"components/PurchaseOrder/PurchaseOrderModal\";\nimport AddEditPurchaseOrderLineModal from \"components/PurchaseOrder/AddEditPurchaseOrderLineModal\";\nimport {showSweetAlert} from \"components/Shared/CustomAlert\";\nimport Loading from \"components/Shared/Loading\";\nimport AddEditPurchaseOrderModal from \"components/PurchaseOrder/AddEditPurchaseOrderModal\";\nimport {propTypes} from \"react-bootstrap/esm/Image\";\nimport animationData from \"../../assets/animations/orange-square.json\";\nimport ItemCard from \"../../components/ItemCard/ItemCard\";\nimport InventoryModal from \"../../components/ItemCard/InventoryModal\";\n\nimport {\n PURCHASEORDER_VIEW,\n PURCHASEORDER_EDIT,\n PURCHASEORDER_DELETE,\n} from \"constants/Permissions.js\";\nimport {getPermission} from \"utils/Permissions.js\";\n\nfunction PurchaseOrder() {\n const user = useSelector((state) => state.user);\n\n // ### STATE ###\n const [originPurchaseOrder, setOriginPurchaseOrder] = useState([]);\n const [showModal, setShowModal] = useState(false);\n const [showPurchaseOrderLineModal, setPurchaseOrderLineModal] =\n useState(false);\n const handleCloseModal = () => setShowModal(false);\n const handleShowModal = () => setShowModal(true);\n const handleClosePurchaseOrderLineModal = () =>\n setPurchaseOrderLineModal(false);\n const handleShowPurchaseOrderLineModal = () =>\n setPurchaseOrderLineModal(true);\n const [status, setStatus] = useState([]);\n const [statusId, setStatusId] = useState(0);\n const [showAddModal, setShowAddModal] = useState(false);\n const handleCloseAddModal = () => setShowAddModal(false);\n const handleShowAddModal = () => setShowAddModal(true);\n const [itemCardSelectedTab, setItemCardSelectedTab] = useState(\"Detail\");\n\n const [isLoading, setIsLoading] = useState(true);\n const [PurchaseOrderLine, setPurchaseOrderLine] = useState([]);\n const [page, setPage] = useState(1);\n const [skip, setSkip] = useState(0);\n const [take, setTake] = useState(500);\n const defaultDate = new Date();\n const [dateRange, setDateRange] = useState([\n defaultDate.setMonth(defaultDate.getMonth() - 3),\n new Date(),\n ]);\n const [suppliers, setSuppliers] = useState([]);\n const [supplierId, setSupplierId] = useState(0);\n const [season, setSeason] = useState([]);\n const [brands, setBrands] = useState([]);\n const [seasonId, setseasonId] = useState(0);\n const [brandId, setBrandId] = useState(0);\n const [purchaseOrderSearch, setPurchaseOrderSearch] = useState(\"\");\n const [purchaseOrderLineSearch, setPurchaseOrderLineSearch] = useState(\"\");\n const [orderBy, setOrderBy] = useState(\"DateCreated\");\n const [descending, setDescending] = useState(true);\n const [originData, setOriginData] = useState([]);\n const [data, setData] = useState([]);\n const [currentEstimatedDeliveryDate, setCurrentEstimatedDeliveryDate] =\n useState([new Date()]);\n\n const [purchaseOrderLineChange, setPurchaseOrderLineChange] = useState([]);\n const [products, setProducts] = useState([]);\n const [purchaseOrderLineId, setPurchaseOrderLineId] = useState(0);\n const [editPurchaseOrderLineId, setEditPurchaseOrderLineId] = useState();\n const [isEdit, setIsEdit] = useState(false);\n const [error, setError] = useState({\n productId: \"\",\n quantity: \"\",\n });\n const [quantityValidate, setQuantityValidate] = useState(true);\n const [isImportLoading, setIsImportLoading] = useState(false);\n\n const [selectedPurchaseOrder, setSelectedPurchaseOrder] = useState([]);\n\n const [selectedProductId, setSelectedProductId] = useState(0);\n const [selectedInventory, setSelectedInventory] = useState([]);\n const [showItemCardModal, setShowItemCardModal] = useState(false);\n const [showInventoryModal, setShowInventoryViewModal] = useState(false);\n\n const fileInputRef = useRef(null);\n let files = \"\";\n const [validation, setvalidation] = useState({\n purchaseOrderNumber: \"\",\n brandId: \"\",\n seasonId: \"\",\n estimatedDeliveryDate: \"\",\n });\n // ### HANDLERS ###\n const [selectedDate, setSelectedDate] = useState(null);\n const [locations, setLocations] = useState([]);\n\n const handlePurchaseOrderSearchChange = (value) => {\n setPurchaseOrderSearch(value);\n };\n\n const handlePurchaseOrderLineSearchChange = (value) => {\n setPurchaseOrderLineSearch(value);\n };\n\n const clearPurchaseOrderValidation = () => {\n setvalidation({\n purchaseOrderNumber: \"\",\n brandId: \"\",\n seasonId: \"\",\n estimatedDeliveryDate: \"\",\n });\n };\n\n const clearPurchaseOrderLineValidation = () => {\n setError({\n productId: \"\",\n quantity: \"\",\n });\n };\n\n const handleDateChange = (date) => {\n validation.estimatedDeliveryDate = \"\";\n setSelectedPurchaseOrder({\n ...selectedPurchaseOrder,\n [\"estimatedDeliveryDate\"]: date,\n });\n };\n\n const handleFileUpload = (event) => {\n const file = event.target.files[0];\n const reader = new FileReader();\n reader.onload = (event) => {\n const binaryString = event.target.result;\n const base64String = btoa(binaryString);\n files = base64String;\n saveFile();\n };\n reader.readAsBinaryString(file);\n };\n\n const handleSubmit = () => {\n fileInputRef.current.click();\n };\n\n const handleExportTemplate = async () => {\n setIsLoading(true);\n try {\n const url = `PurchaseOrder/GetExportTemplate?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const base64String = await response.text();\n const binaryData = Buffer.from(base64String, \"base64\");\n const blob = new Blob([binaryData], {\n type: \"application/vnd.ms-excel.sheet.macroEnabled.12\",\n });\n\n // Save file\n const Newurl = URL.createObjectURL(blob);\n const link = document.createElement(\"a\");\n link.href = Newurl;\n link.setAttribute(\"download\", \"Export.xlsm\");\n link.click();\n setIsLoading(false);\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n const handleGetExportExcel = async (id, name) => {\n setIsLoading(true);\n try {\n const url = `PurchaseOrder/GetExportExcel?id=${id}&userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const base64String = await response.text();\n const binaryData = Buffer.from(base64String, \"base64\");\n const blob = new Blob([binaryData], {\n type: \"application/vnd.ms-excel.sheet.macroEnabled.12\",\n });\n\n // Save file\n const Newurl = URL.createObjectURL(blob);\n const link = document.createElement(\"a\");\n link.href = Newurl;\n link.setAttribute(\"download\", name + \".xlsm\");\n link.click();\n setIsLoading(false);\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n const validateInput = (name, value) => {\n setvalidation((prev) => {\n const stateObj = {...prev, [name]: \"\"};\n switch (name) {\n case \"purchaseOrderNumber\":\n if (!value) {\n stateObj[name] = \"Please enter an purchaseOrder Number.\";\n }\n break;\n case \"brandId\":\n if (!value) {\n stateObj[name] = \"Please select a brand.\";\n }\n break;\n case \"seasonId\":\n if (!value) {\n stateObj[name] = \"Please select a season.\";\n }\n break;\n case \"estimatedDeliveryDate\":\n if (!value) {\n stateObj[name] = \"Please enter an estimated delivery date.\";\n }\n break;\n case \"locationId\":\n if (!value) {\n stateObj[name] = \"Please select a location.\";\n }\n break;\n default:\n break;\n }\n return stateObj;\n });\n };\n\n const saveFile = async () => {\n // Send the base64 string to the API using fetch or axios\n try {\n setIsImportLoading(true);\n const payload = files;\n const response = await fetch(\n `PurchaseOrder/Import?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`,\n {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(payload),\n }\n );\n const body = await response.json();\n if (response.status === 200) {\n showSweetAlert(\"saveSuccess\", `Purchase Order`);\n } else {\n if (\n body ==\n \"A purchase order reference as specified in this document already exists.\"\n ) {\n showSweetAlert(\n \"warningCustomMessage\",\n `This purchase order reference already exists. Importing this sheet will update the allocations against this purchase order. Are you sure you wish to continue?`,\n () => {\n handlePurchaseOrderReallocation();\n }\n );\n } else {\n showSweetAlert(\n \"warningOkOnly\",\n body\n .split(\"\\n\")\n .map((line) => `\n props.handleAddItem(e)}\n isDisabled={props.disabled}\n withAll={props.label === \"Add Brands\" ? true : false}\n />\n
\n \n {props.selectedItems?.map((item) => (\n \n !props.disabled ? props.handleRemoveItem(item) : \"\"\n }\n >\n {item.value}\n \n \n ))}\n
\n ${line}
`)\n .join(\"\")\n );\n }\n }\n } catch {\n } finally {\n setIsImportLoading(false);\n fetchPurchaseOrderData();\n }\n };\n\n const handlePurchaseOrderReallocation = () => {\n reallocatePurchaseOrder();\n };\n\n const reallocatePurchaseOrder = async () => {\n // Send the base64 string to the API using fetch or axios\n try {\n setIsImportLoading(true);\n const payload = files;\n const response = await fetch(\n `PurchaseOrder/ImportReallocation?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`,\n {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(payload),\n }\n );\n const body = await response.json();\n if (response.status === 200) {\n if (body == \"\") {\n showSweetAlert(\"saveSuccess\", `Purchase Order`);\n } else {\n showSweetAlert(\n \"saveSuccessCustomMessage\",\n `Import complete with the following errors:
${body}`\n );\n }\n } else {\n showSweetAlert(\"serverError\");\n }\n } catch {\n } finally {\n setIsImportLoading(false);\n fetchPurchaseOrderData();\n }\n };\n\n const handlePurchaseOrderCancel = () => {\n handleCloseAddModal();\n\n if (selectedPurchaseOrder.id != 0) {\n setSelectedPurchaseOrder({\n ...selectedPurchaseOrder,\n [\"estimatedDeliveryDate\"]: currentEstimatedDeliveryDate,\n });\n handleShowModal();\n }\n };\n\n const handleDatesChange = (dates) => {\n setDateRange(dates);\n if (dates[0] && dates[1]) {\n const filterData = originData.filter((item) => {\n return moment(item.timestamp).isBetween(\n moment(dates[0], \"YYYY-MM-DDTHH:mm:ssZ\").format(\n \"YYYY-MM-DDTHH:mm:ssZ\"\n ),\n moment(dates[1], \"YYYY-MM-DDTHH:mm:ssZ\").format(\n \"YYYY-MM-DDTHH:mm:ssZ\"\n ),\n null,\n \"[]\"\n );\n });\n setData(filterData);\n }\n };\n\n const handleLineChange = (name, value) => {\n let item = {\n ...purchaseOrderLineChange,\n [name]: value,\n };\n setPurchaseOrderLineChange(item);\n validatePurchaseOrderLineInput(name, value);\n };\n\n const handleProductLineChange = async (name, event) => {\n // if productId is changed (Add only) autofill cost price\n if (name == \"productId\") {\n validatePurchaseOrderLineInput(name, event.value);\n let cost = await fetchProduct(event.value);\n let item = {\n ...purchaseOrderLineChange,\n [name]: event.value,\n costPrice: cost,\n };\n setPurchaseOrderLineChange(item);\n }\n };\n\n const validatePurchaseOrderLineInput = (name, value) => {\n setError((prev) => {\n const stateObj = {...prev, [name]: \"\"};\n switch (name) {\n case \"productId\":\n if (!value) {\n stateObj[name] = \"Please select a product.\";\n }\n break;\n case \"quantity\":\n if (value <= 0) {\n stateObj[name] = \"Quantity must be greater then 0.\";\n } else if (value < purchaseOrderLineChange.allocated) {\n stateObj[name] =\n purchaseOrderLineChange.allocated +\n \" have already been allocated. You cannot set the quantity lower than this.\";\n }\n break;\n default:\n break;\n }\n\n return stateObj;\n });\n };\n\n const handleAddPurchaseOrderLine = () => {\n clearPurchaseOrderLineValidation();\n setIsEdit(false);\n setPurchaseOrderLineChange({\n quantity: 0,\n costPrice: 0,\n discountPercentage: 0,\n discount: 0,\n purchaseOrderId: selectedPurchaseOrder.id,\n locationId: 0,\n locationName: \"\",\n SeasonId: 0,\n SeasonName: \"\",\n SupplierBarcode: 0,\n BrandCode: \"\",\n productId: 0,\n productName: \"\",\n tax: 0,\n sku: \"\",\n size: \"\",\n colour: \"\",\n totalPrice: 0,\n statusId: 0,\n warehouseAllocation: \"\",\n statusName: \"\",\n allocations: [],\n });\n handleShowPurchaseOrderLineModal();\n };\n\n const handleAllocationChange = (event, index) => {\n const {name, value} = event.target;\n const allocations = [...purchaseOrderLineChange.allocations];\n allocations[index][\"quantity\"] = parseInt(value);\n const quantity = parseInt(purchaseOrderLineChange.quantity);\n if (allocations[index][\"quantity\"] <= quantity) {\n error.quantity = \"\";\n setQuantityValidate(true);\n } else {\n error.quantity = \"Not enough to fullfil allocation\";\n setQuantityValidate(false);\n }\n setPurchaseOrderLine({...purchaseOrderLineChange, allocations});\n };\n\n const handleSearchChange = (value) => {\n const filterData = originPurchaseOrder?.filter((item) =>\n item.productName.toLowerCase().includes(value.toLowerCase())\n );\n setSearch(value);\n setPurchaseOrderLine(filterData);\n };\n var isArchived = false;\n const Check = (event) => {\n isArchived = event.target.checked;\n fetchSeason();\n fetchBrands();\n fetchPurchaseOrderData();\n };\n\n const handleDropDownChange = (label, id, idName, name) => {\n // handle the location change - need to get the name and id\n if (name === \"location\") {\n // get the location name\n const selectedLocation = locations.filter((x) => x.id === id);\n setSelectedPurchaseOrder({\n ...selectedPurchaseOrder,\n locationName: selectedLocation[0].value,\n locationId: selectedLocation[0].id,\n });\n } else {\n setSelectedPurchaseOrder({\n ...selectedPurchaseOrder,\n [name]: label,\n [idName]: id,\n });\n }\n\n validateInput(idName, id);\n };\n\n const handleChangePurchaseOrder = (name, value) => {\n setSelectedPurchaseOrder({\n ...selectedPurchaseOrder,\n [name]: value,\n });\n validateInput(name, value);\n };\n\n const handleAddModelPurchaseOrder = () => {\n clearPurchaseOrderValidation();\n\n setSelectedPurchaseOrder({\n id: 0,\n purchaseOrderNumber: \"\",\n estimatedDeliveryDate: new Date(),\n supplierId: 0,\n supplierName: \"\",\n supplierAddress: \"\",\n buyerName: \"\",\n buyerAddress: \"\",\n shippingAddress: \"\",\n userId: localStorage.getItem(\"userId\"),\n userFullName: localStorage.getItem(\"username\"),\n costPrice: 0,\n tax: 0,\n locationId: null,\n locationName: \"\",\n discount: 0,\n total: 0,\n totalQuantity: 0,\n seasonId: 0,\n season: \"\",\n statusId: 0,\n statusName: \"\",\n brandId: \"\",\n brandName: \"\",\n createdDate: new Date(),\n });\n\n handleShowAddModal();\n };\n\n const handleEditModelPurchaseOrder = () => {\n clearPurchaseOrderValidation();\n handleCloseModal();\n handleShowAddModal();\n };\n\n const handleEditPurchaseOrderLine = (id) => {\n clearPurchaseOrderLineValidation();\n setEditPurchaseOrderLineId(id);\n setIsEdit(true);\n let PurchaseOrderValue = PurchaseOrderLine.filter((x) => x.id == id);\n setPurchaseOrderLineChange(...PurchaseOrderValue);\n handleShowPurchaseOrderLineModal();\n };\n\n const handleDeletePurchaseOrderLine = (id) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to delete this purchase order line?`,\n () => {\n deletePurchaseOrderLine(id);\n }\n );\n };\n\n const deletePurchaseOrderLine = async (id) => {\n try {\n let url = `/PurchaseOrderLine/Delete?Id=${id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url, {\n method: \"DELETE\",\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"],\n ]\n });\n const body = await response.json();\n if(response.status == 400) {\n showSweetAlert(\"warningCustomMessage\", body);\n }\n fetchPurchaseOrderLine(selectedPurchaseOrder.id)\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n const handleShowInventoryModal = (item) => {\n setSelectedInventory(item);\n setShowInventoryViewModal(true);\n setShowItemCardModal(false);\n };\n\n const handleHideInventoryModal = () => {\n setShowInventoryViewModal(false);\n setShowItemCardModal(true);\n };\n\n // ### DATA FETCHES ##\n const handleAddPurchaseOrder = () => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to add this purchase order?`,\n () => {\n handleSavePurchaseOrder();\n }\n );\n };\n const handleUpdatePurchaseOrder = () => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to update the purchase order?`,\n () => {\n handleSavePurchaseOrder();\n }\n );\n };\n\n const isEmpty = (value) => {\n if (value === null || value === undefined) return true;\n if (typeof value === \"string\" && value.trim() === \"\") return true;\n return false;\n };\n\n const handleSavePurchaseOrder = async () => {\n let validationErrors = {};\n\n if (isEmpty(selectedPurchaseOrder.purchaseOrderNumber)) {\n validationErrors.purchaseOrderNumber =\n \"Please enter the purchaseOrderNumber\";\n }\n if (selectedPurchaseOrder.brandId <= 0) {\n validationErrors.brandId = \"Please select the brand\";\n }\n if (selectedPurchaseOrder.seasonId <= 0) {\n validationErrors.seasonId = \"Please select the season\";\n }\n if (isEmpty(selectedPurchaseOrder.estimatedDeliveryDate)) {\n validationErrors.estimatedDeliveryDate = \"Please select the date\";\n }\n if (selectedPurchaseOrder.locationId <= 0) {\n validationErrors.locationId = \"Please select the location\";\n }\n\n setvalidation(validationErrors);\n\n if (Object.keys(validationErrors).length > 0) {\n return;\n }\n\n // if (\n // selectedPurchaseOrder.purchaseOrderNumber === \"\" &&\n // selectedPurchaseOrder.brandId <= 0 &&\n // selectedPurchaseOrder.seasonId <= 0 &&\n // selectedPurchaseOrder.estimatedDeliveryDate === \"\"\n // ) {\n // validation.purchaseOrderNumber = \"Please enter the purchaseOrderNumber\";\n // validation.brandId = \"Please select the brand\";\n // validation.seasonId = \"Please select the season\";\n // validation.estimatedDeliveryDate = \"Please select the date\";\n // return;\n // } else {\n // if (selectedPurchaseOrder.purchaseOrderNumber === \"\") {\n // validation.purchaseOrderNumber = \"Please enter the purchaseOrderNumber\";\n // }\n // if (selectedPurchaseOrder.brandId === 0) {\n // validation.brandId = \"Please select the brand\";\n // }\n // if (selectedPurchaseOrder.seasonId === 0) {\n // validation.seasonId = \"Please select the season\";\n // }\n // if (selectedPurchaseOrder.estimatedDeliveryDate === \"\") {\n // validation.estimatedDeliveryDate = \"Please select the date\";\n // }\n // }\n\n try {\n if (selectedPurchaseOrder.id == 0) {\n let url = `PurchaseOrder/Add?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n selectedPurchaseOrder.estimatedDeliveryDate = new Date(dateRange[0]);\n let response = await fetch(url, {\n method: \"POST\",\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"],\n ],\n body: JSON.stringify(selectedPurchaseOrder),\n });\n\n if (response.status === 200) {\n showSweetAlert(\"saveSuccess\", `Purchase Order`);\n fetchPurchaseOrderData();\n handleCloseAddModal();\n } else {\n showSweetAlert(\"serverError\");\n }\n } else {\n let url = `PurchaseOrder/Update?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n let response = await fetch(url, {\n method: \"PUT\",\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"],\n ],\n body: JSON.stringify(selectedPurchaseOrder),\n });\n\n if (response.status == 200) {\n showSweetAlert(\"saveSuccess\", `Purchase Order`);\n handleCloseAddModal();\n handleShowModal();\n } else {\n showSweetAlert(\"serverError\");\n }\n }\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n // ### DATA FETCHES ##\n const fetchProductDropdown = async (brandId, seasonId) => {\n try {\n let url = `/Product/GetDropdownListWithSkuAndBarcode?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\n \"userToken\"\n )}&includeArchived=${isArchived}&brandId=${brandId}&seasonId=${seasonId}`;\n const response = await fetch(url);\n const body = await response.json();\n const data = body?.map((item) => {\n return {id: item.id, value: item.name};\n });\n setProducts(data);\n } catch (e) {\n }\n };\n\n const fetchProduct = async (id) => {\n try {\n let url = `/Product/GetSingle?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url);\n const body = await response.json();\n return body.cost;\n } catch (e) {\n }\n };\n\n const fetchPurchaseOrderData = async () => {\n try {\n let from = new Date(dateRange[0]);\n\n let url = `/PurchaseOrder/getallpaged?skip=${skip}&take=${take}&brandId=${brandId}&seasonId=${seasonId}&statusId=${statusId}&from=${moment(\n from,\n \"YYYY-MM-DD\"\n ).format(\"YYYY-MM-DD\")}&to=${\n dateRange[1] === null\n ? moment(from, \"YYYY-MM-DD\").format(\"YYYY-MM-DD\")\n : moment(dateRange[1], \"YYYY-MM-DD\").format(\"YYYY-MM-DD\")\n }&userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\n \"userToken\"\n )}&orderBy=${orderBy}&descending=${descending}`;\n\n const response = await fetch(url);\n const body = await response.json();\n setIsLoading(false);\n setOriginData(body);\n setData(body);\n } catch (err) {\n setIsLoading(false);\n }\n };\n\n useMemo(async () => {\n setPage(0);\n setOriginData([]);\n setData([]);\n setIsLoading(true);\n fetchPurchaseOrderData();\n }, [brandId, seasonId, dateRange, purchaseOrderSearch, statusId]);\n\n const fetchSeason = async () => {\n try {\n let seasonUrl = `/CategoryValue/GetDropdownList?userId=${localStorage.getItem(\n \"userId\"\n )}&&userToken=${localStorage.getItem(\n \"userToken\"\n )}&&categoryId=4&&includeArchived=${isArchived}`;\n const seasonResponse = await fetch(seasonUrl);\n const seasonBody = await seasonResponse.json();\n const seasonData = seasonBody?.map((item) => {\n return {id: item.id, value: item.name};\n });\n setSeason(seasonData);\n } catch (err) {\n }\n };\n\n const fetchBrands = async () => {\n try {\n let brandUrl = `/CategoryValue/GetDropdownList?userId=${localStorage.getItem(\n \"userId\"\n )}&&userToken=${localStorage.getItem(\n \"userToken\"\n )}&&categoryId=2&&includeArchived=${isArchived}`;\n const brandResponse = await fetch(brandUrl);\n const brandBody = await brandResponse.json();\n const brandData = brandBody?.map((item) => {\n return {id: item.id, value: item.name};\n });\n setBrands(brandData);\n } catch (err) {\n }\n };\n const PurchaseOrderLines = (purchaseOrderId) => {\n handleShowModal();\n fetchPurchaseOrderLine(purchaseOrderId);\n fetchSelectedPurchaseOrder(purchaseOrderId);\n };\n\n const downloadPdf = (base64String, filename) => {\n const decodedData = Buffer.from(base64String, \"base64\").toString(\"binary\");\n const dataArray = new Uint8Array(\n Array.from(decodedData, (char) => char.charCodeAt(0))\n );\n const blob = new Blob([dataArray], {type: \"application/pdf\"});\n const link = document.createElement(\"a\");\n link.href = window.URL.createObjectURL(blob);\n link.download = filename;\n link.click();\n };\n\n const handleGetExportPDF = async (id, name) => {\n try {\n setIsLoading(true);\n const url = `PurchaseOrder/GetExportPDF?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url);\n const base64String = await response.text();\n downloadPdf(base64String, name + \".pdf\");\n setIsLoading(false);\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n const handleGetLabelPDF = async (id, sku) => {\n try {\n const url = `PurchaseOrder/GetProductLabelsPDF?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url);\n\n if (response.status == 200) {\n const base64String = await response.text();\n\n try {\n const decodedData = Buffer.from(base64String, \"base64\").toString(\n \"binary\"\n );\n const dataArray = new Uint8Array(\n Array.from(decodedData, (char) => char.charCodeAt(0))\n );\n const blob = new Blob([dataArray], { type: \"application/pdf\" });\n\n const blobUrl = window.URL.createObjectURL(blob);\n const iframe = document.createElement(\"iframe\");\n iframe.style.display = \"none\";\n iframe.src = blobUrl;\n document.body.appendChild(iframe);\n\n iframe.onload = function () {\n try {\n iframe.contentWindow.print();\n } catch (printError) {\n console.error(\"Error in printing:\", printError);\n }\n };\n } catch (error) {\n console.error(\"Error in processing the PDF:\", error);\n }\n } else {\n const body = await response.text();\n showSweetAlert(\"warningCustomMessage\", body);\n }\n setIsLoading(false);\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n\n const handleDeletePurchaseOrder = (id) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to delete this purchase order?`,\n () => {\n deletePurchaseOrder(id);\n }\n );\n };\n\n const deletePurchaseOrder = async (id) => {\n const url = `PurchaseOrder/Delete?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url, {\n method: \"delete\",\n });\n fetchPurchaseOrderData();\n };\n\n const handleClosePurchaseOrder = (id) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to close this purchase order?`,\n () => {\n closePurchaseOrder(id);\n }\n );\n };\n const closePurchaseOrder = async (id) => {\n const url = `PurchaseOrder/ClosePurchaseOrder?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url, {\n method: \"put\",\n });\n fetchPurchaseOrderData();\n };\n\n const handleReopenPurchaseOrder = (id) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to reopen this purchase order?`,\n () => {\n reopenPurchaseOrder(id);\n }\n );\n };\n const reopenPurchaseOrder = async (id) => {\n const url = `PurchaseOrder/ReopenPurchaseOrder?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url, {\n method: \"put\",\n });\n fetchPurchaseOrderData();\n };\n\n const handleSavePurchaseOrderLine = (values) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to save this purchase order line?`,\n () => {\n handleSaveChangesPurchaseOrderLine(values);\n }\n );\n };\n\n const handleSaveChangesPurchaseOrderLine = async (values) => {\n try {\n const url = `/PurchaseOrderLine/Add?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url, {\n method: \"POST\",\n headers: [[\"Content-Type\", \"application/json\"]],\n body: JSON.stringify(values),\n });\n\n if (response.status == 200) {\n showSweetAlert(\"saveSuccess\", `Purchase Order Line`);\n handleClosePurchaseOrderLineModal();\n fetchPurchaseOrderLine(selectedPurchaseOrder.id);\n } else {\n showSweetAlert(\"errorCustomMessage\", response.data);\n handleClosePurchaseOrderLineModal();\n }\n } catch (e) {\n showSweetAlert(\"serverError\");\n }\n };\n const handleUpdatePurchaseOrderLine = (values) => {\n showSweetAlert(\n \"warning\",\n `Are you sure you want to update this purchase order line?`,\n () => {\n handleUpdateChangesPurchaseOrderLine(values);\n }\n );\n };\n\n const handleUpdateChangesPurchaseOrderLine = async (values) => {\n try {\n const url = `/PurchaseOrderLine/Update?id=${editPurchaseOrderLineId}&userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url, {\n method: \"put\",\n headers: [[\"Content-Type\", \"application/json\"]],\n body: JSON.stringify(values),\n });\n\n if (response.status == 200) {\n showSweetAlert(\"saveSuccess\", `Purchase Order Line`);\n handleClosePurchaseOrderLineModal();\n fetchPurchaseOrderLine(selectedPurchaseOrder.id);\n } else {\n const body = await response.json();\n showSweetAlert(\"errorCustomMessage\", body);\n handleClosePurchaseOrderLineModal();\n }\n } catch (e) {\n }\n };\n\n const fetchPurchaseOrderLine = async (purchaseOrderId) => {\n setPurchaseOrderLineId(purchaseOrderId);\n try {\n let url = `/PurchaseOrderLine/GetAllPaged?skip=${skip}&take=${take}&createdByUserId=${seasonId}&userId=${localStorage.getItem(\n \"userId\"\n )}&purchaseOrderId=${purchaseOrderId}&search=${purchaseOrderLineSearch}&userToken=${localStorage.getItem(\n \"userToken\"\n )}&orderBy=${orderBy}&descending=${descending}`;\n const response = await fetch(url);\n const body = await response.json();\n setOriginPurchaseOrder(body);\n setPurchaseOrderLine(body);\n } catch (err) {\n setIsLoading(false);\n }\n };\n\n const handleCancel = () => {\n handleClosePurchaseOrderLineModal();\n };\n\n //const fetchSuppliers = async () => {\n // try {\n // let url = `/supplier/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&&includeArchived=${isArchived}`;\n // const response = await fetch(url);\n // const body = await response.json();\n // const data = body?.map((item) => {\n // return { id: item.id, value: item.name };\n // });\n // setSuppliers(data);\n // } catch (err) {\n // }\n //}\n const updateData = async () => {\n try {\n let url = `/PurchaseOrder/getallpaged?skip=${\n page * take + skip\n }&take=${take}&brandId=${brandId}&seasonId=${seasonId}&statusId=${statusId}&userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\n \"userToken\"\n )}&orderBy=${orderBy}&descending=${descending}`;\n const response = await fetch(url);\n const body = await response.json();\n setTimeout(() => {\n setOriginData(originData.concat(body));\n setData(data.concat(body));\n setPage(page + 1);\n }, 500);\n } catch (err) {\n }\n };\n\n const fetchSelectedPurchaseOrder = async (id) => {\n try {\n let url = `/PurchaseOrder/GetSingle?userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}&id=${id}`;\n const response = await fetch(url);\n const body = await response.json();\n setSelectedPurchaseOrder(body);\n fetchProductDropdown(body.brandId, body.seasonId);\n setCurrentEstimatedDeliveryDate(body.estimatedDeliveryDate);\n } catch (err) {\n }\n };\n const fetchStatusDropdownList = async () => {\n try {\n let Url = `/PurchaseOrder/GetStatusDropdownList?userId=${localStorage.getItem(\n \"userId\"\n )}&&userToken=${localStorage.getItem(\"userToken\")}`;\n const Response = await fetch(Url);\n const Body = await Response.json();\n const data = Body?.map((item) => {\n return {id: item.id, value: item.name};\n });\n setStatus(data);\n } catch (err) {\n }\n };\n\n const handleGetItemCard = (id) => {\n setSelectedProductId(id);\n setShowItemCardModal(true);\n setShowModal(false);\n };\n\n const handleItemCardCloseModal = () => {\n setShowItemCardModal(false);\n setSelectedProductId(0);\n setShowModal(true);\n setItemCardSelectedTab(\"Detail\");\n };\n \n \n\n const fetchLocations = async () => {\n try {\n let globalDropdownsUrl = `/CategoryValue/GetGlobalDropdowns?userId=${localStorage.getItem(\n \"userId\"\n )}&&userToken=${localStorage.getItem(\"userToken\")}`;\n const globalDropdownsResponse = await fetch(globalDropdownsUrl);\n const globalDropdownsBody = await globalDropdownsResponse.json();\n const locationData = globalDropdownsBody?.locations?.map((item) => {\n return {id: item.id, value: item.name};\n });\n setLocations(locationData);\n } catch (error) {\n console.log(error);\n }\n };\n\n // ### HOOKS ###\n useEffect(() => {\n fetchPurchaseOrderLine(purchaseOrderLineId);\n fetchSeason();\n fetchStatusDropdownList();\n fetchBrands();\n fetchLocations();\n }, [purchaseOrderLineSearch]);\n\n return (\n <>\n {showPurchaseOrderLineModal == false && (\n
\n Include archived\n
\n \n {getPermission(user.permissions, PURCHASEORDER_EDIT) && (\n <>\n{scanned <= 0 ? \"Not scanned\" : scanned}
\n \n {\n props.stocktakeStatus !== \"Complete\" &&\n 0 ? \"pointer\" : \"not-allowed\",\n opacity: totalStock > 0 ? 1 : 0.5,\n }}\n onClick={() => {\n if (totalStock > 0) {\n setUpdatedPage(true);\n props.handleAdjustTotal(id, totalStock - 1);\n }\n }}\n />\n }\n {totalStock} (\n {difference > 0\n ? `${difference} missing`\n : difference < 0\n ? `${Math.abs(difference)} extra`\n : \"perfect\"}\n )\n {\n props.stocktakeStatus !== \"Complete\" &&\n {\n setUpdatedPage(true);\n props.handleAdjustTotal(id, totalStock + 1);\n }}\n />\n }\n
\n \n {checkRequired && (\n e.preventDefault()}\n overlay={\n {checkNotes} \n }\n >\n \n \n \n \n \n \n )}\n
\n Stocktake Lines
\n\n\n \n \n Status\n \n \n setSelectedStatusId(e.value)}\n withAll={false}\n />\n \n
\n\n \n \n handleShow0Variance()}\n />\n \n Show 0 Variance\n \n \n \n \n handleShowUnscannedProducts()}\n />\n \n Show Unscanned Products\n \n \n \n \n handleShowSoldProducts()}\n />\n \n Show Sold\n \n \n \n \n handleShowIntransitProducts()}\n />\n \n Show In Transit\n \n \n
\n\n | SKU | \nName | \nSize | \nColour | \nBrand Code | \nBarcode | \nOn Hand | \nIn Transit | \nSold | \nScanned | \nTotal | \nStatus | \n\n |
|---|
| \n | SKU | \nFulfillment Status | \nQuantity | \nColour | \nSize | \nName | \nBrandcode | \nBarcode | \nPrice | \nSubTotal | \nTotal Tax | \nPicked Status | \n\n |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| \n | \n \n | \n {line.fulfillmentStatus} | \n\n {/* todo - add onchange for the quantity thats being changed */}\n {!props.checkedLineItems.some(\n (x) => x.id === line.id\n ) ? (\n line.quantity\n ) : (\n <>\n | \n {line.colour} | \n{line.size} | \n{line.name} | \n{line.brandcode} | \n{line.barcode} | \n£{line.price?.toFixed(2)} | \n£{line.subTotal?.toFixed(2)} | \n£{line.totalTax?.toFixed(2)} | \n\n \n | \n\n | \n
Change Location
\n \n \n\n
\n \n ) : (\n <>\n {props.data && props.data.length == 0 && (\n Loading...
\nInclude archived
\n \n\n
\n \n ) : (\n <>\n {props.data && props.data.length == 0 && (\n Loading...
\nLoading more data...
\n ) : (\n \"\"\n )\n }\n height={675}\n >\n| SKU | \nProduct Name | \nBrand | \nSeason | \nGender | \nCategory | \nSize | \nColour | \nAvailable Stock | \nStatus | \n\n |
|---|
\n
\n \n ) : (\n <>\n {props.data && props.data.length == 0 && (\n Loading...
\nLoading more data...
: \"\"}\n loader=\"\"\n height={650}\n >\n| PO# | \nTo | \nBrand | \nCreated By | \nCreated On | \nCost Price | \nSeason | \nStatus | \nUnits | \nTotal | \nActions | \n
|---|
\n
\n \n \n Include archived\n
\nLoading more data...
: \"\"}\n height={650}\n >\n| Batch Id | \nFrom Location Name | \nTo Location Name | \nUnits | \nType Name | \nStatus | \nDate Created | \n
|---|
Loading more data...
\n ) : (\n \"\"\n )\n }\n >\n| Order | \nTotal Price | \nSub Total | \nTotal Tax | \nQuantity | \nOrder Date | \nFullfillment Status | \nLocation | \n
|---|
Labels
\n \n props.handleDelete()}\n >\n Delete Labels\n \n props.handlePrintLabel()}\n >\n Print Labels\n \n
\n \n\n \n
\n \n ) : props.data && props.data.length === 0 ? (\n // Render no labels found message\n Loading...
\n| Product | \n
|---|
| {label.productDescription} | \n
\n
:\n <>\n {(props.data && props.data.length == 0) &&\n (\n
\n Loading...
\nLoading more data...
: \"\"}\n height={550}\n >\n| Name | \nBrand | \n {/*Gender | */}\nItem Count | \nTotal Cost | \nTotal RRP | \nStatus | \n
|---|
\n props.handleAddProductDetail(true)}\n >\n File Browser\n \n {/* // */}\n props.handleAddProductDetail(false)}\n >\n No Image\n \n \n Cancel\n \n
\n )\n}\nexport default BuyersCollectionProductAddModal;","import React, { useState, useEffect, useRef } from \"react\";\nimport {\n Button,\n Form,\n Row,\n Col,\n Card, Table\n} from \"react-bootstrap\";\nimport CustomSelect from \"components/Shared/CustomSelect\";\nimport CurrencyInput from 'react-currency-input-field';\nfunction BuyersCollectionProductDetailModal(props) {\n const fileInputRef = useRef(null);\n\n const [localValue, setLocalValue] = useState(props.buyersCollectionProduct.colour || '');\n\n const handleInputChange = (e) => {\n const upperCaseValue = e.target.value.toUpperCase();\n setLocalValue(upperCaseValue);\n props.handleDetailChange(\"colour\", upperCaseValue);\n }\n\n const isTablet = /iPad|Android/.test(navigator.userAgent);\n\n useEffect(() => {\n if (isTablet) {\n document.documentElement.style.setProperty('--modal-height-tablet', '100vh');\n document.documentElement.style.setProperty('--modal-margin-tablet', '0');\n document.documentElement.style.setProperty('--modal-padding-top', '0');\n } else {\n document.documentElement.style.setProperty('--modal-width', '1100px');\n }\n\n // Check if props.openWithInput is true and the fileInputRef is available, then trigger the click event.\n if (props.openWithInput && fileInputRef.current) {\n fileInputRef.current.click();\n props.handleAddProductDetail(false)\n }\n }, [])\n\n const handleFocus = (event) => {\n event.target.select();\n };\n\n var productVarient = props.buyersCollectionProduct.productVariants;\n return (\n <>\n \n \n )\n}\nexport default BuyersCollectionProductDetailModal;","import React, { useState, useEffect } from \"react\";\nimport {\n Button,\n Form,\n Row,\n Col,\n Card\n} from \"react-bootstrap\";\n\nfunction ApprovalCommentsInput(props) {\n const [comment, setComment] = useState(\"\"); // Local state for the comment\n\n useEffect(() => {\n // set the width of the modal\n document.documentElement.style.setProperty('--modal-width', '500px');\n }, [])\n\n return (\n <>\n \n \n )\n}\nexport default ApprovalCommentsInput;\n","import React from \"react\";\nimport { Button, Form, Row, Col, Card, ListGroup } from \"react-bootstrap\";\nimport CustomSelect from \"components/Shared/CustomSelect\";\nfunction BuyersCollectionSizeModal(props) {\n const itemsPerColumn = Math.ceil(props.categorySizes.length / 3);\n const columnOne = props.categorySizes.slice(0, itemsPerColumn);\n const columnTwo = props.categorySizes.slice(\n itemsPerColumn,\n itemsPerColumn * 2\n );\n const columnThree = props.categorySizes.slice(itemsPerColumn * 2);\n\n return (\n \n );\n}\nexport default BuyersCollectionSizeModal;\n","import React, { useState, useEffect, useMemo, useRef } from \"react\";\nimport moment from 'moment';\nimport {\n Card,\n Container,\n Row,\n Col,\n Button,\n Form,\n} from \"react-bootstrap\";\nimport { useSelector } from 'react-redux'\n\nimport CustomSelect from '../../components/Shared/CustomSelect';\nimport { showSweetAlert } from 'components/Shared/CustomAlert';\nimport { Label } from \"reactstrap\";\n\nimport CustomModal from \"components/Shared/CustomModal\";\nimport Loading from \"components/Shared/Loading\";\nimport animationData from '../../assets/animations/orange-square.json';\n\nimport { BULKUPDATE_VIEW } from 'constants/Permissions.js';\nimport { getPermission } from 'utils/Permissions.js';\n\nfunction BulkUpdate() {\n const user = useSelector((state) => state.user);\n\n // ### STATE ###\n const [isLoading, setIsLoading] = useState(true);\n\n const [seasons, setSeasons] = useState([]);\n const [brands, setBrands] = useState([]);\n const [statuses, setStatuses] = useState([]);\n const [categories, setCategories] = useState([]);\n const [locations, setLocations] = useState([]);\n\n const [seasonId, setSeasonId] = useState(0);\n const [brandId, setBrandId] = useState(0);\n const [statusId, setStatusId] = useState(0);\n const [categoryId, setCategoryId] = useState(0);\n\n const [selectAll, setSelectAll] = useState(false);\n const [isArchived, setIsArchived] = useState(false);\n\n const [isImportLoading, setIsImportLoading] = useState(false);\n const [isExportLoading, setIsExportLoading] = useState(false);\n\n const fileInputRef = useRef(null);\n let files = \"\";\n\n const [exportFields, setExportFields] = useState({\n name: false,\n cost: false,\n price: false,\n salePrice: false,\n brandCode: false,\n supplierBarcode: false,\n sku: false,\n supplier: false,\n status: false,\n gender: false,\n brand: false,\n productCategory: false,\n season: false,\n colour: false,\n size: false,\n tags: false,\n locations: false,\n });\n\n const [selectedLocations, setSelectedLocations] = useState([]);\n\n // ### HANDLERS ###\n const handleCheckboxChange = (key) => {\n setExportFields((prevFilters) => ({\n ...prevFilters,\n [key]: !prevFilters[key],\n }));\n };\n\n const handleImport = () => {\n fileInputRef.current.click();\n }\n\n const handleFileUpload = (event) => {\n setIsImportLoading(true);\n const file = event.target.files[0];\n const reader = new FileReader();\n reader.onload = (event) => {\n const binaryString = event.target.result;\n const base64String = btoa(binaryString);\n files = base64String;\n marginCheck();\n };\n reader.readAsBinaryString(file);\n };\n\n const marginCheck = async () => {\n try {\n setIsLoading(true);\n const payload = files\n const response = await fetch(`Product/ImportProductExcelValidateMargin?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, {\n method: \"POST\",\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(payload),\n })\n const body = await response.json();\n\n if (body > 0) {\n setIsImportLoading(false);\n showSweetAlert('warningCustomMessage', `You have imported ${body} products that fall below the minimum margin. Are you sure you wish to continue?`, () => { importFile() });\n } else if (body == 0) {\n importFile();\n\n } else {\n setIsImportLoading(false);\n showSweetAlert('serverError');\n }\n }\n catch (e) {\n setIsImportLoading(false);\n showSweetAlert('serverError');\n }\n finally {\n setIsLoading(false);\n // fetchPurchaseOrderData();\n }\n }\n\n const importFile = async () => {\n try {\n setIsImportLoading(true);\n const payload = files\n const response = await fetch(`Product/ImportProductExcel?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, {\n method: \"POST\",\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(payload),\n })\n const body = await response.json();\n \n if (body.errorMessages.length > 0) {\n const message = body.errorMessages.map((error) => {\n return \"\" + error\n })\n showSweetAlert('warningOkOnly', `Bulk import imported ${body.successfulImportCount} out of ${body.successfulImportCount + body.errorMessages.length} lines.
Errors:
${message}`);\n } else {\n showSweetAlert('saveSuccess', `Bulk import successfully imported all ${body.successfulImportCount} lines`);\n }\n }\n catch (e) {\n showSweetAlert('serverError');\n }\n finally {\n setIsImportLoading(false);\n }\n }\n\n const handleExport = () => {\n showSweetAlert('warning', `Are you sure you want to export the selected items?`, () => { exportBulkUpdate() });\n }\n\n const exportBulkUpdate = async () => {\n setIsLoading(true);\n setIsExportLoading(true);\n\n try {\n // compile export model\n const productExcelExportModel = {\n filters: {\n seasonId: seasonId,\n brandId: brandId,\n statusId: statusId,\n productCategoryId: categoryId,\n },\n fields: {\n ...exportFields, locations: selectedLocations\n }\n }\n\n const url = `Product/GetProductExcelExport?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`\n const response = await fetch(url, {\n method: 'POST',\n headers: [\n [\"Content-Type\", \"application/json\"],\n ],\n body: JSON.stringify(productExcelExportModel),\n });\n\n const base64String = await response.text();\n const binaryData = Buffer.from(base64String, 'base64');\n const blob = new Blob([binaryData], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });\n\n // Save file\n const Newurl = URL.createObjectURL(blob);\n const link = document.createElement('a');\n link.href = Newurl;\n link.setAttribute('download', 'BulkExport.xlsx');\n link.click();\n setIsLoading(false)\n } catch (e) {\n showSweetAlert('serverError');\n }\n finally {\n setIsExportLoading(false);\n }\n }\n\n const handleLocationChange = (locationId) => {\n // Check if the locationId is already in the selectedLocations array\n const isSelected = selectedLocations.includes(locationId);\n\n // If the locationId is selected, remove it from the array\n if (isSelected) {\n const updatedLocations = selectedLocations.filter((id) => id !== locationId);\n setSelectedLocations(updatedLocations);\n } else {\n // If the locationId is not selected, add it to the array\n setSelectedLocations([...selectedLocations, locationId]);\n }\n };\n\n const handleSelectAll = () => {\n // If selectAll is true, deselect all exportFields\n if (selectAll) {\n const updatedFields = {};\n Object.keys(exportFields).forEach((key) => {\n updatedFields[key] = false;\n });\n setExportFields(updatedFields);\n } else {\n // If selectAll is false, select all exportFields\n const updatedFields = {};\n Object.keys(exportFields).forEach((key) => {\n updatedFields[key] = true;\n });\n setExportFields(updatedFields);\n }\n\n // Toggle the selectAll state\n setSelectAll((prevSelectAll) => !prevSelectAll);\n };\n\n //// ### DATA FETCHES ##\n //const fetchPurchaseOrderData = async () => {\n // try {\n // let from = new Date(dateRange[0]);\n\n // let url = `/PurchaseOrder/getallpaged?skip=${skip}&take=${take}&brandId=${brandId}&seasonId=${seasonId}&statusId=${statusId}&from=${moment(from, 'YYYY-MM-DD').format('YYYY-MM-DD')}&to=${dateRange[1] === null ? moment(from, 'YYYY-MM-DD').format('YYYY-MM-DD') : moment(dateRange[1], 'YYYY-MM-DD').format('YYYY-MM-DD')}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&orderBy=${orderBy}&descending=${descending}`;\n\n // const response = await fetch(url);\n // const body = await response.json();\n // setIsLoading(false);\n // setOriginData(body);\n // setData(body);\n // } catch (err) {\n // setIsLoading(false);\n // }\n //}\n\n const fetchSeasonDropdownList = async () => {\n try {\n let seasonUrl = `/CategoryValue/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=4&includeArchived=${isArchived}`;\n const seasonResponse = await fetch(seasonUrl);\n const seasonBody = await seasonResponse.json();\n const seasonData = seasonBody?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setSeasons(seasonData);\n } catch (err) {\n }\n }\n\n const fetchBrandDropdownList = async () => {\n try {\n let brandUrl = `/CategoryValue/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=2&includeArchived=${isArchived}`;\n const brandResponse = await fetch(brandUrl);\n const brandBody = await brandResponse.json();\n const brandData = brandBody?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setBrands(brandData);\n } catch (err) {\n }\n }\n\n const fetchStatusDropdownList = async () => {\n try {\n let Url = `/Product/GetStatusDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&includeArchived=${isArchived}`;\n const Response = await fetch(Url);\n const Body = await Response.json();\n const data = Body?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setStatuses(data);\n } catch (err) {\n }\n }\n\n const fetchCategoriesDropdownList = async () => {\n try {\n let categoryUrl = `/CategoryValue/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=3&includeArchived=${isArchived}`;\n const categoryResponse = await fetch(categoryUrl);\n const categoryBody = await categoryResponse.json();\n const categoryData = categoryBody?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setCategories(categoryData);\n } catch (err) {\n }\n }\n\n const fetchLocationDropdownList = async () => {\n try {\n let locationUrl = `/location/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&includeArchived=${isArchived}`;\n const locationResponse = await fetch(locationUrl);\n const locationBody = await locationResponse.json();\n const locationData = locationBody?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setLocations(locationData);\n } catch (err) {\n }\n }\n\n // ### HOOKS ###\n useEffect(() => {\n fetchSeasonDropdownList();\n fetchStatusDropdownList();\n fetchBrandDropdownList();\n fetchCategoriesDropdownList();\n fetchLocationDropdownList();\n }, []);\n\n return (\n <>\n {getPermission(user.permissions, BULKUPDATE_VIEW) &&\n
Include archived
\n \n0
\n \n {\n buyersCollectionData.map((item, index) => (\n \n {(provided, snapshot) => (\n \n \n \n props.handleEditBuyersCollectionProductDetailModal(item)}\n style={{ width: \"30px\", top: \"5px\", right: \"5px\" }} // Set the width and position\n\n >\n \n \n \n\n \n
\n \n \n \n
\n )}\n \n ))}\n {provided.placeholder}\n \n )}\n\n \n Name: \n \n \n
\n \n Code: \n \n \n
\n \n Cost: \n \n \n
\n \n RRP: \n \n \n
\n \n \n props.buyersCollectionProductAddModal()}\n >\n \n \n
\n \n \n
\n );\n}\nexport default BuyersCollectionImageGallery;","import React, { memo } from 'react'\nimport { useDrag } from 'react-dnd'\nimport {\n Button,\n Form,\n Row,\n Col,\n Card\n} from \"react-bootstrap\";\n\nimport BuyersCollectionImageGallery from '../Buyers/BuyersCollectionImageGallery'\nimport CustomSelect from '../Shared/CustomSelect';\n\nexport const Box = memo(function Box(props) {\n const { name, productData, type, key } = props;\n\n const [{ opacity }, drag] = useDrag(\n () => ({\n type,\n item: { id: productData.id },\n collect: (monitor) => ({\n opacity: monitor.isDragging() ? 0.4 : 1,\n }),\n }),\n [name, type],\n )\n return (\n <>\n \n
\n \n {productData.images?.length > 0 ?\n ![\"...\"]({require(\"assets/img/no-image.jpg\").default})
\n }\n
\n \n }\n \n \n
\n
\n fetchBuyersCollectionProducts(id, collectionId)}\n >\n {isActive\n ? \"Drop\"\n : name}\n
\n );\n});\n","export const ItemTypes = {\n PRODUCT: 'Product'\n}\n","//import update from 'immutability-helper';\nimport React, { memo, useCallback, useState, useEffect } from 'react';\nimport { NativeTypes } from 'react-dnd-html5-backend';\nimport { Box } from './Box';\nimport { Dustbin } from './Dustbin';\nimport { ItemTypes } from './ItemTypes';\nimport {\n Spinner,\n Button,\n Form,\n Row,\n Col,\n Card,\n OverlayTrigger,\n Tooltip,\n} from \"react-bootstrap\";\nimport { formatCurrency } from 'utils/FormatCurrency.js';\n\nconst style = {\n \n}\n\nexport default memo(function Container(props) {\n const [visible, setVisible] = useState(true);\n\n const [itemCardColumns, setItemCardColumns] = useState(4);\n\n useEffect(() => {\n setVisible(true);\n // Hide the message after 2 seconds (1 second solid + 1 second fade out)\n const timer = setTimeout(() => {\n setVisible(false);\n }, 2000);\n\n // Clean up the timer on unmount\n return () => clearTimeout(timer);\n }, [props.allocationMessage]);\n\n const handleDrop = useCallback(\n (index, item) => {\n props.addBuyersCollectionAllocation(index, item)\n }\n );\n\n const handleItemCardColumnChange = (event) => {\n if (isNaN(parseFloat(event.target.value)))\n setItemCardColumns(4);\n else if (event.target.value < 4)\n setItemCardColumns(4);\n else if (event.target.value > 8)\n setItemCardColumns(8);\n else\n setItemCardColumns(event.target.value);\n }\n\n return (\n \n\n \n \n
\n \n
\n \n props.handleDownloadImages(props.data.id, props.data.name)}\n >\n Download Images\n \n\n props.handleExportPDF(props.data.id, props.data.name, props.selectedLocation)}\n >\n Download PDF\n \n \n
\n \n handleDrop(0, item.id)}\n key={0}\n id={0}\n name=\"All\"\n fetchBuyersCollectionProducts={props.fetchBuyersCollectionProducts}\n collectionId={props.data.id}\n selectedLocation={props.selectedLocation}\n />\n {props.buyerCollectionLocations.map((index) => {\n return (\n handleDrop(index.id, item.id)}\n key={index.id}\n id={index.id}\n name={index.name}\n fetchBuyersCollectionProducts={props.fetchBuyersCollectionProducts}\n collectionId={props.data.id}\n selectedLocation={props.selectedLocation}\n />\n );\n })}\n \n
\n
\n );\n});","import React, { useEffect, useRef } from 'react';\nimport {\n Button,\n Form,\n Row,\n Col\n} from \"react-bootstrap\";\nimport BuyerCollectionProductList from \"./BuyerCollectionProductList\";\nimport Container from '../React-dnd/Container'\nimport { DndProvider } from 'react-dnd'\nimport { HTML5Backend } from 'react-dnd-html5-backend'\nimport { TouchBackend } from 'react-dnd-touch-backend';\n\nfunction BuyersCollectionDetailModal(props) {\n const isTablet = /iPad|Android/.test(navigator.userAgent);\n const backend = isTablet ? TouchBackend : HTML5Backend;\n\n useEffect(() => {\n if (isTablet) { \n document.documentElement.style.setProperty('--modal-height-tablet', '100vh');\n document.documentElement.style.setProperty('--modal-margin-tablet', '0');\n document.documentElement.style.setProperty('--modal-padding-top', '0');\n } else {\n document.documentElement.style.setProperty('--modal-width', '1200px');\n }\n }, []);\n\n return (\n \n {props.isLoading ?\n \n \n \n
\n \n \n \n }\n \n }\n
\n \n
\n :\n <>\n {props.buyersCollectionData && props.buyersCollectionData.map((item) => (\n \n
\n Loading...
\n\n props.buyersCollectionProductAddModal()}\n >\n \n \n
\n \n {sku}\n
\n
:\n <>\n {(props.PurchaseOrderLineData && props.PurchaseOrderLineData.length == 0) &&\n (\n \n
\n Loading...
\n| Product Name | \nQuantity | \nCost Price | \nDiscount % | \nTotal Price | \nBarcode | \nBrand Code | \nSize | \nColour | \n {props.PurchaseOrderLineData.length > 0 && props.PurchaseOrderLineData[0].allocations.length > 0 && props.PurchaseOrderLineData[0].allocations.map((allocation, index) => {\n return{allocation.locationCode} | \n })}\n\n | \n |
|---|
\n {getPermission(props.userPermissions, MOVEMENTS_MASS_BOOK_IN) && (\n e.preventDefault()}\n overlay={Mass Book In }\n >\n props.handleMassBookIn(props.SingleMovement.id)}\n >\n Mass Book In\n \n \n )}\n {props.SingleMovement.typeId === 3 && (\n e.preventDefault()}\n overlay={\n Add Movement Product \n }\n >\n props.handleAddMovementProduct()}\n >\n Add\n \n \n )}\n
\n \n
\n \n ) : (\n <>\n {props.MovementsProductData &&\n props.MovementsProductData.length == 0 && (\n Loading...
\n| Sku | \nProduct Name | \nQuantity | \nPicked | \nBooked Out | \nRecieved | \nBooked In | \n\n |
|---|
\n {!props.isEditMovement ? (\n props.handleEditMovement()}\n >\n \n \n ) : (\n <>\n \n \n props.handleSaveChangeLocations(\n props.selectedFromLocation,\n props.selectedToLocation\n )\n }\n >\n Save\n \n \n )}\n
\n \n
\n \n ) : (\n <>\n {props.orderLinesData && props.orderLinesData.length == 0 && (\n Loading...
\n| Sku | \n {/*Sku | */}\nLocation | \nFulfillment Status | \nQuantity | \nPrice | \nSub Total | \nTotal Tax | \n\n |
|---|
{props.title}
\n{props.title}
\n\n \n \n
\n \n );\n}\n","export default __webpack_public_path__ + \"static/media/no-image.e5010930.jpg\";","export default __webpack_public_path__ + \"static/media/wrapper-logo.13d2cfe3.png\";","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://cra.link/PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(/^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://cra.link/PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then((registration) => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://cra.link/PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch((error) => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then((response) => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then((registration) => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log('No internet connection found. App is running in offline mode.');\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then((registration) => {\n registration.unregister();\n })\n .catch((error) => {\n console.error(error.message);\n });\n }\n}\n","const reportWebVitals = (onPerfEntry) => {\n if (onPerfEntry && onPerfEntry instanceof Function) {\n import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n getCLS(onPerfEntry);\n getFID(onPerfEntry);\n getFCP(onPerfEntry);\n getLCP(onPerfEntry);\n getTTFB(onPerfEntry);\n });\n }\n};\n\nexport default reportWebVitals;\n","import { createStore } from 'redux'\n\nconst initialState = {\n user: {\n id: 0,\n username: \"\",\n firstName: \"\",\n lastName: \"\",\n email: \"\",\n roleId: 0,\n locationId: 0,\n permissions: [],\n avatar:\"\",\n roleName:\"\",\n },\n isFavourites: false,\n isSideBarMini: false,\n\n IsUserNameValid:false,\n IsEmailValid: false,\n\n Search:\"\",\n}\n\nconst changeState = (state = initialState, { type, ...rest }) => {\n switch (type) {\n case 'set':\n return { ...state, ...rest } \n case 'SetUsernameValid':\n return { ...state, ...rest } \n default:\n return state\n }\n}\n\nconst store = createStore(changeState)\nexport default store\n","import React from \"react\";\n\n// react-bootstrap components\nimport {\n Badge,\n Button,\n ButtonGroup,\n Card,\n Form,\n InputGroup,\n Navbar,\n Nav,\n Pagination,\n Container,\n Row,\n Col,\n} from \"react-bootstrap\";\n\nfunction Footer() {\n return (\n <>\n \n \n );\n}\n\nexport default Footer;\n","import React from \"react\";\n\n// react-bootstrap components\nimport {\n Badge,\n Button,\n Card,\n Form,\n InputGroup,\n Navbar,\n Nav,\n Container,\n Row,\n Col\n} from \"react-bootstrap\";\n\nfunction UserPage() {\n return (\n <>\n \n {/* you can change the color of the filter page using: data-color=\"blue | purple | green | orange | red | rose \" */}\n \n \n \n \n \n \n \n \n
\n \n \n \n
\n \n
\n \n \n
\n \n e.preventDefault()}>\n \n Tania Keatley \n \n
\n michael24
\n\n Hey there! As you can see,
\n it is already looking great.\n
\n
\n e.preventDefault()}\n variant=\"link\"\n >\n \n \n e.preventDefault()}\n variant=\"link\"\n >\n \n \n e.preventDefault()}\n variant=\"link\"\n >\n \n \n
\n \n \n \n
\n \n
\n| # | \nName | \nCode | \nContact Name | \nContact Number | \nAddress | \nSales Email | \nCustomer Service Email | \nActions | \n
|---|
\n
\n )}\n \n \n \n \n <>\n \n <>\n \n \n {(provided, snapshot) => (\n \n {/* Step 3: Use reorderedPriorityLocations instead of props.priorityLocations */}\n {props.priorityLocations.map((item, index) => (\n \n {(provided, snapshot) => (\n \n
\n )}\n \n ))}\n {item.name}
\n \n \n Cancel\n \n \n Save\n \n
\n \n \n );\n}\nexport default UpdateLocationPriorityModal;\n","import React from \"react\";\nimport { useEffect, useState } from 'react';\nimport { useSelector } from 'react-redux'\nimport { showSweetAlert } from 'components/Shared/CustomAlert';\nimport CustomModal from \"components/Shared/CustomModal.js\";\nimport UpdateLocationPriorityModal from \"./UpdateLocationPriorityModal.js\";\n// react-bootstrap components\nimport {\n Button,\n Card,\n Col,\n OverlayTrigger,\n Row,\n Table,\n Tooltip,\n Container\n} from \"react-bootstrap\";\n\nimport { LOCATION_EDIT, LOCATION_DELETE } from '../../constants/Permissions.js';\nimport { getPermission } from '../../utils/Permissions.js';\n\nfunction LocationsTable(props) {\n const user = useSelector((state) => state.user);\n \n\n const handlePermission = () => {\n showSweetAlert('unauthorized');\n }\n const renderTableData = (permissionEdit, permissionDelete) => {\n return props.data.map((data, index) => {\n const { id, name, code, contactNumber, addressLine1, addressLine2, city, county, postcode, email, managerEmail, assistantManagerEmail, ignoreImportExport, has4by4Printer, has2by1Printer, priorityOrder, shopifyId, sortOrder } = data\n return (\n \n
\n| # | \nName | \nCode | \nContact Number | \nAddress | \nManager Email | \nAssistant Manager Email | \nPriority | \nSort Order | \nShopify Id | \nExclude From Export | \n4 x 4 | \n2.3 x 1.3 | \nActions | \n
|---|
| # | \nUsername | \nFirst Name | \nLast Name | \nPhone Number | \nRole Name | \nLocation Name | \nActions | \n
|---|
\n handleClickImage()}\n >\n \n Change Avatar\n \n \n\n
\n \n \n \n \n {error.confirmPassword && (\n \n )}\n \n
\n \n \n Change Password\n \n props.setShowChangePassword(false)}\n >\n Cancel\n \n
\n \n );\n};\nexport default ChangePassword;\n","import React, { useState, useEffect } from \"react\";\n//import Moment from 'react-moment';\n// react component used to create charts\nimport { showSweetAlert } from 'components/Shared/CustomAlert';\n// react-bootstrap components\nimport {\n Card,\n Form,\n Container,\n Row,\n Col,\n Button\n} from \"react-bootstrap\";\nimport { useSelector } from 'react-redux'\n\nimport UserTable from '../../components/UserManagement/UserTable';\nimport UserPage from '../../components/UserManagement/UserPage';\nimport ChangePassword from '../../components/UserManagement/ChangePassword';\nimport CustomModal from \"components/Shared/CustomModal\";\nimport { ADMIN_USERMANAGEMENT_VIEW, ADMIN_USERMANAGEMENT_EDIT, ADMIN_USERMANAGEMENT_DELETE } from 'constants/Permissions.js';\nimport { getPermission } from 'utils/Permissions.js';\n\nfunction AccountManagement(props) {\n const user = useSelector((state) => state.user);\n\n // ### STATE ###\n\n const [roles, setRoles] = useState([]);\n const [locations, setLocations] = useState([]);\n const [account, setAccount] = useState(user);\n const [isEdit, setIsEdit] = useState(false);\n const [showChangePassword, setShowChangePassword] = useState(false);\n const [error, setError] = useState({\n username: '',\n email: '',\n role: ''\n })\n // ### HANDLERS ###\n\n const handleChange = (name, value) => {\n setAccount({\n ...account,\n [name]: value\n })\n validateInput(name, value)\n }\n const validateInput = (name, value) => {\n\n setError(prev => {\n const stateObj = { ...prev, [name]: \"\" };\n switch (name) {\n case \"email\":\n if (!value) {\n stateObj[name] = \"Please enter an email.\";\n }\n break;\n default:\n break;\n }\n return stateObj;\n });\n }\n const handleShowSave = () => {\n showSweetAlert('warning', `Are you sure to save the user?`, () => { hideSave() });\n }\n\n const hideSave = () => {\n\n handleSave()\n }\n\n const handleSave = async () => {\n\n const response = await fetch(`/user/update?id=${localStorage.getItem(\"userId\")}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, {\n method: 'put',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(account),\n });\n const isEdit = await response.json();\n\n if (response.status === 200) {\n await fetchUser();\n showSweetAlert('success', `Account data`);\n } else {\n showSweetAlert('serverError');\n }\n location.reload();\n };\n const handleEdit = () => {\n setIsEdit(true);\n }\n const hideAlert = () => {\n\n };\n\n\n const handlePin = async (id) => {\n try {\n const response = await fetch(`/user/generatenewpin?id=${id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, { method: 'post' });\n const data = await response.json();\n\n if (data === true) {\n showSweetAlert('saveSuccess', `User`);\n }\n\n if (body) {\n showSweetAlert('saveSuccess', `User`);\n await fetchData();\n }\n\n await fetchData();\n } catch (err) {\n }\n }\n\n // ### DATA FETCHES ###\n\n const fetchRoles = async () => {\n try {\n let url = `/user/getroles?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const body = await response.json();\n\n setRoles(body);\n } catch (err) {\n }\n }\n const fetchLocations = async () => {\n try {\n let url = `/location/getdropdownlist?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const body = await response.json();\n const data = body?.map((item) => {\n return { id: item.id, value: item.name };\n\n });\n\n setLocations(data);\n } catch (err) {\n }\n }\n const fetchUser = async () => {\n try {\n let url = `/user/getsingle?id=${localStorage.getItem(\"userId\")}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const user = await response.json();\n\n dispatch({ type: 'set', user: user });\n } catch (err) {\n }\n }\n\n const handleSavePasswordSuccess = () => {\n\n setShowChangePassword(false);\n }\n\n\n\n // ### HOOKS ###\n\n useEffect(() => {\n fetchRoles();\n fetchLocations();\n }, []);\n useEffect(() => {\n setAccount(user);\n }, [user])\n\n return (\n <>\n {alert}\n {!showChangePassword &&\n \n
\n\n
:\n <>\n {(props.data && props.data.length == 0) &&\n (\n
\n Loading...
\nLoading more data...
: \"\"}\n height={550}\n >\n| Timestamp | \nUsername | \nType Name | \nProduct Id | \nDescription | \n
|---|
Categories
\n \n e.preventDefault()}\n overlay={\n \n Add\n \n }\n >\n props.handleAdd()}\n >\n Add\n \n \n
\n \n props.handleSearchChange(e)}\n handleClear={() => props.handleSearchChange(\"\")}\n />\n
\n \n
\n| Category Name | \nActions | \n
|---|
No Group in this Category
\nValues\n setSearchKey(\"\")}\n />\n \n Add\n \n
\n | Name | \n {\n props.data[0]?.categoryId == 14 ?\nValue | \n :\nCode | \n }\n {props.requiresSupplierId &&Supplier | }\n {props.requiresSizeGroupId &&Size Group | }\nActions | \n
|---|
\n \n \n {renderTableData()}\n \n
\n
\n \n );\n}\n\nexport default CategoryValues;\n","import React, { useEffect } from \"react\";\nimport {\n Button,\n Form,\n Row,\n Col\n} from \"react-bootstrap\";\n\nfunction AddEditCategoryModal(props) {\n useEffect(() => {\n document.documentElement.style.setProperty('--modal-width', '500px');\n }, []);\n\n return (\n <>\n \n \n );\n}\n\nexport default AddEditCategoryModal;\n","import React from \"react\";\nimport {\n Button,\n Form,\n Row,\n Col\n} from \"react-bootstrap\";\n\nfunction AddEditCategoryGroupModal(props) {\n return (\n <>\n \n \n );\n}\n\nexport default AddEditCategoryGroupModal;\n","import React, { useEffect } from \"react\";\nimport {\n Button,\n Form,\n Row,\n Col\n} from \"react-bootstrap\";\nimport CustomSelect from \"components/Shared/CustomSelect\";\nfunction AddEditCategoryValueModal(props) {\n useEffect(() => {\n document.documentElement.style.setProperty('--modal-width', '500px');\n }, []);\n\n var data = props.categories.filter(x => x.id === props.categoryId);\n return (\n <>\n \n \n );\n}\n\nexport default AddEditCategoryValueModal;\n","import React, { useState, useEffect, useMemo } from \"react\";\nimport moment from 'moment';\nimport Select from \"react-select\";\nimport {\n Card,\n Container,\n Row,\n Col,\n Form\n} from \"react-bootstrap\";\nimport { useSelector } from 'react-redux'\n\nimport CustomSelect from \"components/Shared/CustomSelect\";\nimport CategoryTable from '../../components/Category/CategoryTable';\nimport CategoryGroups from '../../components/Category/CategoryGroups';\nimport CategoryValues from '../../components/Category/CategoryValues';\n\nimport { CATEGORIES_VIEW } from 'constants/Permissions.js';\nimport { getPermission } from 'utils/Permissions.js';\n\n//Modals\nimport { showSweetAlert } from 'components/Shared/CustomAlert';\nimport CustomModal from '../../components/Shared/CustomModal';\nimport AddEditCategoryModal from '../../components/Category/AddEditCategoryModal';\nimport AddEditCategoryGroupModal from '../../components/Category/AddEditCategoryGroupModal';\nimport AddEditCategoryValueModal from '../../components/Category/AddEditCategoryValueModal';\n\nfunction Category() {\n\n // ### STATE ###\n\n const user = useSelector((state) => state.user);\n\n const [showCategoryDetails, setShowCategoryDetails] = useState(false); // right hand pane\n\n const [showCategoryModal, setShowCategoryModal] = useState(false); // modals\n const [showCategoryGroupModal, setShowCategoryGroupModal] = useState(false);\n const [showCategoryValueModal, setShowCategoryValueModal] = useState(false);\n\n const [searchCategories, setSearchCategories] = useState(\"\");\n\n const [categoryId, setCategoryId] = useState(0);\n const [selectedCategory, setSelectedCategory] = useState([]);\n\n const [categoryGroupId, setCategoryGroupId] = useState(0);\n const [selectedCategoryGroup, setSelectedCategoryGroup] = useState([]);\n\n const [originCategories, setOriginCategories] = useState([]);\n const [categories, setCategories] = useState([]);\n const [categoryGroups, setCategoryGroups] = useState([]);\n const [categoryValues, setCategoryValues] = useState([]);\n const [selectedCategoryValues, setSelectedCategoryValues] = useState([]);\n\n const [categoryValueId, setCategoryValueId] = useState(0);\n const [selectedCategoryValue, setSelectedCategoryValue] = useState([]);\n const [suppliers, setSupplier] = useState([]);\n \n const [catrgorySize, setCategorySize] = useState([]);\n\n //const [nameError, SetnameError] = useState(false);\n\n // ### HANDLERS ###\n\n const handleCategoryDetailsShow = () => setShowCategoryDetails(true);\n const handleCategoryDetailsHide = () => setShowCategoryDetails(false);\n\n const handleCategoryModalShow = () => setShowCategoryModal(true);\n const handleCategoryModalHide = () => setShowCategoryModal(false);\n\n const handleCategoryGroupModalShow = () => setShowCategoryGroupModal(true);\n const handleCategoryGroupModalHide = () => setShowCategoryGroupModal(false);\n\n const handleCategoryValueModalShow = () => setShowCategoryValueModal(true);\n const handleCategoryValueModalHide = () => setShowCategoryValueModal(false);\n\n const handleCategorySearchChange = (value) => {\n const filterData = originCategories?.filter((item) => item.name.toLowerCase().includes(value.toLowerCase()));\n setSearchCategories(value);\n setCategories(filterData);\n }\n\n //const handleValidateInput = (name, value) => {\n // switch (name) {\n // case \"name\":\n // if (!value) {\n // SetnameError(true)\n // }\n // }\n //}\n\n const [error, setError] = useState({\n name: '',\n code: '',\n supplierId: '',\n sizeGroupId: ''\n })\n const clearCategoryValidation = () => {\n setError({\n name: '',\n code: '',\n supplierId: '',\n sizeGroupId: ''\n })\n };\n // --- Category ---\n const handleAddCategory = () => {\n setCategoryId(0);\n setSelectedCategory({\n id: 0,\n name: \"\",\n valueType: \"\",\n categoryGroupIds: [],\n dateCreated: \"0001-01-01T00:00:00\",\n dateAmended: \"0001-01-01T00:00:00\",\n archived: false\n });\n handleCategoryModalShow();\n }\n\n const handleEditCategory = (category) => {\n clearCategoryValidation();\n setCategoryId(category.id);\n setSelectedCategory(category);\n setShowCategoryModal(true)\n }\n\n const handleChangeCategory = (name, value) => {\n let item = {\n ...selectedCategory,\n [name]: value,\n };\n setSelectedCategory(item);\n }\n\n const handleGetSupplier = async () => {\n\n try {\n let url = `/supplier/GetDropdownList?userId=${localStorage.getItem(\"userId\")}&&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const body = await response.json();\n const Data = body?.map((item) => {\n return { id: item.id, value: item.name };\n });\n setSupplier(Data);\n } catch (e) {\n\n }\n\n }\n\n const handleSelectCategory = async (category) => {\n setCategoryId(category.id);\n setSelectedCategory({ ...category });\n setSelectedCategoryGroup(null);\n setSelectedCategoryValues([]);\n await fetchCategoryGroups(category.id);\n await fetchCategoryValues(category.id);\n setShowCategoryDetails(true);\n fetchCategorSize();\n }\n\n const handleDeleteCategory = (id, name) => {\n showSweetAlert('deleteWarning', `category`, () => { deleteCategoryHandler(id) });\n }\n\n const deleteCategoryHandler = async (index) => {\n try {\n await fetch(`/Category/Delete?id=${index}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, { method: 'delete' });\n showSweetAlert('deleteSuccess', `Category`);\n await fetchCategories();\n setShowCategoryDetails(false);\n } catch (err) {\n } finally {\n await fetchCategories();\n }\n };\n\n const saveCategoryHandler = async () => {\n if (selectedCategory.name == \"\") {\n //SetnameError(true)\n //SetCode(true)\n return\n }\n\n // Add Category\n if (categoryId === 0) {\n try {\n let url = `Category/Add?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'post',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategory),\n });\n const body = await response.json();\n if (response.status == 200) {\n showSweetAlert('saveSuccess', `Category`);\n await fetchCategories();\n setShowCategoryModal(false);\n } else {\n showSweetAlert('serverError');\n await fetchCategories();\n setShowCategoryModal(false);\n }\n } catch (err) {\n }\n }\n // Edit Category\n else {\n try {\n let url = `Category/Update?id=${selectedCategory.id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'put',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategory),\n });\n const body = await response.json();\n if (response.status === 200) {\n showSweetAlert('saveSuccess', `Category`);\n await fetchCategories();\n setShowCategoryModal(false);\n } else {\n showSweetAlert('serverError');\n await fetchCategories();\n setShowCategoryModal(false);\n }\n } catch (err) {\n\n }\n }\n await fetchCategoryGroups(selectedCategory.id);\n }\n\n // --- Category End ---\n\n // --- Category Group ---\n const handleAddCategoryGroup = () => {\n setCategoryGroupId(0);\n setSelectedCategoryGroup({\n id: 0,\n name: \"\",\n categoryId: selectedCategory.id,\n dateCreated: \"0001-01-01T00:00:00\",\n dateAmended: \"0001-01-01T00:00:00\",\n archived: false\n });\n handleCategoryGroupModalShow();\n }\n\n const handleEditCategoryGroup = () => {\n setCategoryGroupId(selectedCategoryGroup.id);\n setSelectedCategoryGroup({ ...selectedCategoryGroup });\n setShowCategoryGroupModal(true)\n }\n\n const handleChangeCategoryGroup = (name, value) => {\n let item = {\n ...selectedCategoryGroup,\n [name]: value,\n };\n setSelectedCategoryGroup(item);\n }\n\n const handleSelectCategoryGroup = (id) => {\n setCategoryGroupId(id);\n //filter groups by id\n let category = categoryGroups.filter(x => x.id == id);\n setSelectedCategoryGroup(...category);\n\n // filter category values \n if (id != 0) {\n let values = categoryValues.filter(x => x.categoryGroupId == id);\n setSelectedCategoryValues(values);\n }\n else {\n setSelectedCategoryValues(categoryValues);\n }\n }\n\n const handleDeleteCategoryGroup = (id, name) => {\n showSweetAlert('deleteWarning', `category group`, () => { deleteCategoryGroupHandler(id) });\n }\n\n const deleteCategoryGroupHandler = async (index) => {\n try {\n // todo: check that no values are attached to the group before deleting\n await fetch(`/CategoryGroup/Delete?id=${selectedCategoryGroup.id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, { method: 'delete' });\n showSweetAlert('deleteSuccess', `Category Group`);\n await fetchCategoryGroups();\n setCategoryGroupId(0);\n // refresh category values\n } catch (err) {\n } finally {\n await fetchCategories();\n await fetchCategoryGroups(selectedCategory.id);\n }\n };\n\n const saveCategoryGroupHandler = async () => {\n\n if (selectedCategoryGroup.name == \"\") {\n //SetnameError(true)\n //SetCode(true)\n return\n }\n\n // Add Category\n if (categoryGroupId === 0) {\n try {\n let url = `CategoryGroup/Add?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'post',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategoryGroup),\n });\n const body = await response.json();\n if (response.status == 200) {\n showSweetAlert('saveSuccess', `Category Group`);\n await fetchCategoryGroups();\n setShowCategoryGroupModal(false);\n } else {\n showSweetAlert('serverError');\n await fetchCategoryGroups();\n setShowCategoryGroupModal(false);\n }\n } catch (err) {\n }\n }\n // Edit Category\n else {\n try {\n let url = `CategoryGroup/Update?id=${selectedCategoryGroup.id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'put',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategoryGroup),\n });\n const body = await response.json();\n if (response.status === 200) {\n showSweetAlert('saveSuccess', `Category Group`);\n await fetchCategoryGroups();\n setShowCategoryGroupModal(false);\n } else {\n showSweetAlert('serverError');\n await fetchCategoryGroups();\n setShowCategoryGroupModal(false);\n }\n } catch (err) {\n\n }\n }\n await fetchCategories();\n await fetchCategoryGroups(selectedCategory.id);\n }\n\n // --- Category Group End ---\n\n // --- Category Values ---\n const handleAddCategoryValue = () => {\n\n setError({})\n setCategoryValueId(0);\n setSelectedCategoryValue({\n id: 0,\n name: \"\",\n code: \"\",\n value: \"\",\n requiresSupplierId: true,\n categoryId: categoryId,\n categoryGroupId: categoryGroupId,\n supplierId: 0,\n supplierName: \"\",\n requiresSizeGroupId: true,\n sizeGroupId: 0,\n sizeGroupName: \"\",\n categoryGroupName:\"\"\n });\n handleCategoryValueModalShow();\n }\n\n const handleEditCategoryValue = (id) => {\n clearCategoryValidation();\n setCategoryValueId(id);\n let val = categoryValues.filter(x => x.id == id);\n let categoryValue = val[0];\n\n if (categoryValue.supplierName === null) {\n categoryValue.supplierName = \"\";\n }\n if (categoryValue.sizeGroupName === null) {\n categoryValue.sizeGroupName = \"\";\n }\n\n\n setSelectedCategoryValue({ ...categoryValue });\n setShowCategoryValueModal(true)\n }\n const handleChangeCategoryDropdown = (name, value, label, labelName) => {\n let item = {\n ...selectedCategoryValue,\n [name]: value,\n [label]: labelName\n };\n setSelectedCategoryValue(item);\n validateInput(name, value)\n }\n const handleChangeCategoryValue = (name, value) => {\n\n let item = {\n ...selectedCategoryValue,\n [name]: value,\n };\n setSelectedCategoryValue(item);\n validateInput(name, value)\n }\n const validateInput = (name, value) => {\n\n setError(prev => {\n const stateObj = { ...prev, [name]: \"\" };\n switch (name) {\n case \"name\":\n if (!value) {\n stateObj[name] = \"Please enter a name\";\n }\n break;\n case \"code\":\n if (!value) {\n stateObj[name] = \"Please enter an code\";\n }\n break;\n case \"supplierId\":\n if (!value) {\n stateObj[name] = \"Please select the supplier\";\n }\n break;\n case \"supplierId\":\n if (!value) {\n stateObj[name] = \"Please select the Size\";\n }\n break;\n default:\n break;\n }\n return stateObj;\n });\n }\n\n\n const handleDeleteCategoryValue = (id, name) => {\n showSweetAlert('deleteWarning', `category value`, () => { deleteCategoryValueHandler(id) });\n }\n\n const deleteCategoryValueHandler = async (index) => {\n try {\n // todo: check that no values are attached to the group before deleting\n const response = await fetch(`/CategoryValue/Delete?id=${index}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`, { method: 'delete' });\n\n if (response.status == 200) {\n showSweetAlert('deleteSuccess', `Category Value`);\n await fetchCategoryValues(categoryId);\n }\n else {\n var body = await response.json();\n showSweetAlert('warningOkOnly', body);\n }\n } catch (err) {\n } finally {\n await fetchCategories();\n await fetchCategoryGroups(selectedCategory.id);\n }\n };\n const saveCategoryValueHandler = () => {\n showSweetAlert('warning', `Are you sure you want to add this category value?`, () => { handleSave() });\n }\n const handleSave = async () => {\n \n if (selectedCategoryValue.name === \"\") {\n error.name = \"Please enter a name\"\n }\n\n if (categoryValues.some(item => item.name.toLowerCase() === selectedCategoryValue.name.toLowerCase() && item.id !== categoryValueId)) {\n error.name = \"Please enter a unique name\"\n }\n\n if (selectedCategoryValue.code === \"\") {\n error.code = \"Please enter a code\"\n }\n\n if (categoryValues.some(item => item.code.toLowerCase() === selectedCategoryValue.code.toLowerCase() && item.id !== categoryValueId)) {\n error.code = \"Please enter a unique code\"\n }\n\n // This whole error coding needs moving to a better method\n if (selectedCategory.id == 14) {\n error.code = \"\"\n }\n\n if (selectedCategoryValue.supplierId === 0 && categoryId === 2) {\n error.supplierId = \"Please enter the supplier\"\n } else { error.supplierId = \"\" }\n\n if (selectedCategoryValue.sizeGroupId === 0 && categoryId === 3) {\n error.sizeGroupId = \"Please enter the size\"\n } else { error.sizeGroupId = \"\" }\n\n // Add Category value\n if (categoryValueId === 0 && error.code === \"\" && error.supplierId === \"\" && error.name === \"\" && error.sizeGroupId === \"\") {\n try {\n let url = `CategoryValue/Add?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'post',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategoryValue),\n });\n const body = await response.json();\n if (response.status == 200) {\n showSweetAlert('saveSuccess', `Category Value`);\n await fetchCategoryValues(categoryId);\n setShowCategoryValueModal(false);\n } else {\n showSweetAlert('serverError');\n await fetchCategoryValues(categoryId);\n setShowCategoryValueModal(false);\n }\n } catch (err) {\n }\n }\n // Edit Category\n else if (categoryValueId !== 0 && error.code === \"\" && error.supplierId === \"\" && error.name === \"\" && error.sizeGroupId === \"\") {\n try {\n let url = `CategoryValue/Update?id=${selectedCategoryValue.id}&userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch((url), {\n method: 'put',\n headers: [\n [\"Content-Type\", \"application/json\"],\n [\"Content-Type\", \"text/plain\"]\n ],\n body: JSON.stringify(selectedCategoryValue),\n });\n const body = await response.json();\n\n if (body == false || body.status === 400) {\n showSweetAlert('serverError');\n await fetchCategoryValues(categoryId);\n setShowCategoryValueModal(false);\n\n\n } else {\n showSweetAlert('saveSuccess', `Category Value`);\n await fetchCategoryValues(categoryId);\n setShowCategoryValueModal(false);\n }\n } catch (err) {\n\n }\n }\n await fetchCategories();\n await fetchCategoryGroups(selectedCategory.id);\n }\n\n // --- Category Values End ---\n\n const handlePermission = () => {\n showSweetAlert('unauthorized');\n }\n\n const hideAlert = () => {\n \n };\n\n // ### DATA FETCHES ##\n\n const fetchCategories = async () => {\n\n try {\n let url = `Category/GetAll?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const body = await response.json();\n setOriginCategories(body);\n setCategories(body);\n } catch (err) {\n }\n }\n\n const fetchCategoryGroups = async (id) => {\n\n try {\n let url = `CategoryGroup/GetAll?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=${id}`;\n const response = await fetch(url);\n const body = await response.json();\n const data = body?.map((item) => {\n return {\n ...item,\n value: item.name,\n }\n });\n setCategoryGroups(data);\n } catch (err) {\n }\n }\n\n\n const fetchCategorSize = async () => {\n\n try {\n let url = `CategoryGroup/GetAll?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=${6}`;\n const response = await fetch(url);\n const body = await response.json();\n const data = body?.map((item) => {\n return {\n ...item,\n value: item.name,\n }\n });\n setCategorySize(data);\n } catch (err) {\n }\n }\n\n const fetchCategoryValues = async (id) => {\n\n try {\n let url = `CategoryValue/GetAll?userId=${localStorage.getItem(\"userId\")}&userToken=${localStorage.getItem(\"userToken\")}&categoryId=${id}`;\n const response = await fetch(url);\n const body = await response.json();\n \n setCategoryValues(body);\n setSelectedCategoryValues(body);\n } catch (err) {\n }\n }\n\n // ### HOOKS ###\n\n useEffect(() => {\n fetchCategories();\n handleGetSupplier();\n fetchCategoryGroups(categoryId);\n }, []);\n\n useEffect(() => {\n fetchCategoryGroups(selectedCategory.id);\n }, [selectedCategory]);\n\n\n // ### RENDER ###\n\n return (\n <>\n {alert}\n\n {/* Add Edit Category Modal*/}\n \n \n {!passwordReset ? (\n \n
\n Mappings
\n \n props.handleAdd()}\n >\n Add\n \n
\n \n
\n| Name | \nColumn Start | \nCategory | \nFormula | \nAction | \n
|---|
| # | \nProduct Name | \nProduct Link | \nLocation | \nQuantity | \nRequested By | \nApproved By | \nPurchase Order Number | \nStatus | \n {/*Actions | */}\n
|---|
\n
\n \n ) : (\n <>\n {props.data && props.data.length == 0 && (\n Loading...
\nLoading more data...
\n ) : (\n \"\"\n )\n }\n // height={675}\n height={200}\n >\n| SKU | \nProduct Name | \nBrand | \nSeason | \nGender | \nCategory | \nSize | \nColour | \nAvailable Stock | \nQuantity | \nStatus | \n
|---|
| Note | \nCreated by | \nCreated Date | \n\n Actions\n | \n
|---|
\n props.handleShowCreateStocktakeModal()}\n >\n Create Stocktake\n \n
\n \n Loading more data...
\n ) : (\n \"\"\n )\n }\n >\n| ID | \nLocation | \nStocktake Number | \nOpened By | \nGender | \nStatus | \nStock | \nScanned | \nVariance | \nVariance Cost | \nAccuracy | \nActions | \n
|---|
\n {\n props.handleCreateStocktake();\n }}\n >\n Create\n \n
\n Loading more data...
\n ) : (\n \"\"\n )\n }\n >\n| SKU | \nName | \nBrand Code | \nColour | \nSize | \nBarcode | \nLast Scanned | \n
|---|
\n {writeOffUnits && writeOffCost ? (\n \n props.handleConfirmApproveAdjustments()}\n disabled={!props.hasConsentedToAdjustments}\n >\n Confirm\n \n
\n
\n ) : (\n \n
\n ) : additionalUnits && additionalCost ? (\n \n \n \n You are about to write off {writeOffUnits} units at a total cost of: £\n {writeOffCost.toFixed(2)}\n \n
\n \n
\n ) : (\n \n \n \n You are about to add {additionalUnits} units at a total cost of: £\n {additionalCost.toFixed(2)}\n \n
\n \n
\n )}\n\n \n There are no adjustments being made\n
\n \n \n Notes \n props.setAdjustmentNotes(e.target.value)}\n >\n \n
\n\n \n
\n\n \n \n \n \n \n I confirm these changes\n \n \n
\n \n
\n )}\n \n
\n Loading...
\n\n {getRoutes(routes)} \n \n
\n \n );\n}\n\nexport default Auth;\n","import React from \"react\";\nimport { Link, useLocation } from \"react-router-dom\";\nimport PropTypes from \"prop-types\";\nimport { useSelector, useDispatch } from \"react-redux\";\n\n// react-bootstrap components\nimport {\n Badge,\n Button,\n ButtonGroup,\n Card,\n Collapse,\n Form,\n InputGroup,\n Navbar,\n Nav,\n Pagination,\n Container,\n Row,\n Col,\n} from \"react-bootstrap\";\n\nfunction Sidebar({ routes, image, background }) {\n const dispatch = useDispatch();\n const isFavourites = useSelector((state) => state.isFavourites);\n const isSideBarMini = useSelector((state) => state.isSideBarMini);\n // to check for active links and opened collapses\n let location = useLocation();\n // this is for the user collapse\n const [userCollapseState, setUserCollapseState] = React.useState(false);\n // this is for the rest of the collapses\n const [state, setState] = React.useState({});\n React.useEffect(() => {\n setState(getCollapseStates(routes));\n }, []);\n // this creates the intial state of this component based on the collapse routes\n // that it gets through routes prop\n const getCollapseStates = (routes) => {\n let initialState = {};\n routes.map((prop, key) => {\n if (prop.collapse) {\n initialState = {\n [prop.state]: getCollapseInitialState(prop.views),\n ...getCollapseStates(prop.views),\n ...initialState,\n };\n }\n return null;\n });\n return initialState;\n };\n // this verifies if any of the collapses should be default opened on a rerender of this component\n // for example, on the refresh of the page,\n // while on the src/views/forms/RegularForms.jsx - route /admin/regular-forms\n const getCollapseInitialState = (routes) => {\n for (let i = 0; i < routes.length; i++) {\n if (routes[i].collapse && getCollapseInitialState(routes[i].views)) {\n return true;\n } else if (location.pathname === routes[i].path) {\n return true;\n }\n }\n return false;\n };\n // this function creates the links and collapses that appear in the sidebar (left menu)\n const createLinks = (routes) => {\n return routes.map((prop, key) => {\n if (prop.redirect || prop.hidden) {\n return null;\n }\n if (prop.collapse) {\n var st = {};\n st[prop[\"state\"]] = !state[prop.state];\n return (\n \n {prop.name} \n
\n \n\n \n
\n {prop.name}
\n \n ) : (\n <>\n {/* {prop.mini}*/}\n {prop.name}\n \n )}\n\n {(localStorage.getItem(\"AppName\")) !== \"Orange Square\" ? localStorage.getItem(\"AppName\") : \"\" } \n \n
\n \n \n );\n}\n\nlet linkPropTypes = {\n path: PropTypes.string,\n layout: PropTypes.string,\n name: PropTypes.string,\n component: PropTypes.oneOfType([PropTypes.func, PropTypes.element]),\n};\n\nSidebar.defaultProps = {\n image: \"\",\n background: \"fpm-dark-blue\",\n routes: [],\n};\n\nSidebar.propTypes = {\n image: PropTypes.string,\n background: PropTypes.oneOf([\n \"fpm-dark-blue\",\n \"black\",\n \"azure\",\n \"green\",\n \"orange\",\n \"red\",\n \"purple\",\n ]),\n routes: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.shape({\n ...linkPropTypes,\n icon: PropTypes.string,\n }),\n PropTypes.shape({\n collapse: true,\n path: PropTypes.string,\n name: PropTypes.string,\n state: PropTypes.string,\n icon: PropTypes.string,\n views: PropTypes.shape({\n ...linkPropTypes,\n mini: PropTypes.string,\n }),\n }),\n ])\n ),\n};\n\nexport default Sidebar;\n","import React, { useEffect, useState } from \"react\";\nimport { useHistory, useLocation } from \"react-router-dom\";\nimport { useSelector, useDispatch } from \"react-redux\";\nimport AccountManagement from \"views/Elysium/AccountManagement\";\nimport ChangePassword from \"../UserManagement/ChangePassword\";\nimport CustomModal from \"components/Shared/CustomModal\";\n// react-bootstrap components\nimport { Button, Dropdown, Navbar, Nav, Container } from \"react-bootstrap\";\n\nimport { getPermission } from \"utils/Permissions.js\";\nimport { ADMIN_USERMANAGEMENT_VIEW } from \"constants/Permissions.js\";\n\nfunction AdminNavbar() {\n const location = useLocation();\n const history = useHistory();\n const [showAccountModal, setShowAccountModal] = useState(false);\n const handleCloseAccountModal = () => setShowAccountModal(false);\n const handleShowAccountModal = () => setShowAccountModal(true);\n const [showPasswordModal, setShowPasswordModal] = useState(false);\n const handleClosePasswordModal = () => setShowPasswordModal(false);\n const handleShowPasswordModal = () => setShowPasswordModal(true);\n const dispatch = useDispatch();\n const user = useSelector((state) => state.user);\n const isSideBarMini = useSelector((state) => state.isSideBarMini);\n\n const [collapseOpen, setCollapseOpen] = useState(false);\n const onLogOut = () => {\n localStorage.removeItem(\"userId\");\n localStorage.removeItem(\"userToken\");\n localStorage.removeItem(\"username\");\n history.push(\"/auth/login\");\n };\n\n const [isAdmin, setIsAdmin] = useState(false);\n\n useEffect(() => {\n const fetchUser = async () => {\n try {\n let url = `/user/getsingle?id=${localStorage.getItem(\n \"userId\"\n )}&userId=${localStorage.getItem(\n \"userId\"\n )}&userToken=${localStorage.getItem(\"userToken\")}`;\n const response = await fetch(url);\n const user = await response.json();\n\n dispatch({ type: \"set\", user: user });\n } catch (err) { }\n };\n\n fetchUser();\n }, []);\n\n return (\n <>\n \n
\n \n
\n \n
\n \n
\n \n {\n document.body.classList.toggle(\"sidebar-mini\");\n dispatch({ type: \"set\", isSideBarMini: !isSideBarMini });\n }}\n >\n \n \n \n \n document.documentElement.classList.toggle(\"nav-open\")\n }\n >\n \n \n \n
\n \n
\n ) : (\n \n \n document.documentElement.classList.toggle(\"nav-open\")\n }\n />\n
\n \n \n \n
\n {props.title}
\n{props.title}
\n| Timestamp | \nUsername | \nType Name | \nDescription | \n
|---|---|---|---|
| {formatDate(item.timestamp)} | \n{item.username} | \n{item.typeName} | \n{item.description} | \n
| Location | \n {props.inventoryData.length > 0 && props.inventoryData[0].sizesInStockAndSold.map((size) => (\n{size.sizeName} | ))}\n|
|---|---|---|
| {item.locationName} | \n {props.inventoryData.length > 0 && props.inventoryData[i].sizesInStockAndSold.map((size, i) => {\n const handleGetWebOrdersInformation = (type, productId, locationId) => {\n props.handleGetItemCardWebOrderInfo(type, productId, locationId);\n props.handleShowWebOrdersModal();\n };\n return (\n {size.inStock} /{\" \"}\n {/* | );\n })}\n \n {props.canEdit && ( | \n
\n \n
\n \n ) : (\n Loading...
\n\n
\n