');\n\nconst PaginationToolbar = (props) => {\n const listContext = useListContext(props);\n\n return (\n
\n ${message}\n
`,\n },\n });\n};\n\nexport const EmailAnnouncement = (props) => {\n const classes = useStyles();\n const notify = useNotify();\n const [sending, setSanding] = useState(false);\n const [reloadYards, setReloadYards] = useState([]);\n const [users, setUsers] = useState([]);\n const defaultSort = { field: \"name\", order: \"ASC\" };\n const defaultPerPage = 25;\n\n useEffect(() => {\n getYardData();\n }, []);\n\n const getYardData = async () => {\n try {\n debugger;\n const input = { active: \"true\", limit: 1000 };\n let response = await API.graphql(\n graphqlOperation(queries.reloadYardByName, input)\n );\n let data = response.data.reloadYardByName.items;\n setReloadYards(data);\n\n response = await API.graphql(graphqlOperation(queries.listUsers, input));\n data = response.data.listUsers.items;\n setUsers(data);\n debugger;\n } catch (error) {\n logError(\"EmailAnnouncement:getYards\", error, notify);\n }\n };\n\n const sendEmails = async (form, listContext) => {\n console.clear();\n setSanding(true);\n const formState = form.getState();\n let yardList = reloadYards;\n debugger;\n\n try {\n if (listContext?.selectedIds?.length > 0) {\n yardList = reloadYards.filter((yard) => {\n return listContext.selectedIds.some((f) => {\n return f === yard.id;\n });\n });\n }\n\n const promiseList = [];\n yardList.forEach((yard) => {\n const userList = users.filter((user) => {\n return (\n user.reloadYardId === yard.id &&\n user.active === \"true\" &&\n user.status === UserStatus.APPROVED\n );\n });\n const ccList = userList.map((user) => user.email);\n\n promiseList.push(\n sendEmail(\n yard.email,\n ccList,\n formState.values.subject,\n formState.values.message\n )\n );\n });\n\n const results = await Promise.allSettled(promiseList);\n const errors = results.filter(\n (res) => res.status === \"rejected\" || res.value?.error\n );\n if (errors.length > 0)\n logError(\"EmailAnnouncement:sendEmails\", errors, notify);\n else notify(`Emails sent successfully.`);\n } catch (error) {\n logError(\"EmailAnnouncement:sendEmails\", error, notify);\n } finally {\n setSanding(false);\n }\n };\n\n const listContext = useList({\n ...props,\n data: reloadYards || [],\n ids: reloadYards?.map(({ id }) => id) || [],\n loaded: true,\n sort: defaultSort,\n perPage: defaultPerPage,\n basePath: \"/reloadYards\",\n resource: \"reloadYards\",\n });\n\n const CreateToolbar = (props) => {\n const form = useForm();\n\n return (\n \n \n {children}\n \n
\n ) : (\n \n {!hideActions && (\n \n \n \n \n )}\n \n {photoDisplay === \"block\" ? (\n \n {collapse ?
\n }\n \n );\n}\n","import React, { useEffect, useRef, useState } from \"react\";\nimport { useNotify } from \"react-admin\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { getInventorieTimeline } from \"../../../../graphql/inventory/custom-queries\";\nimport { getOutboundShipmentTimeline } from \"../../../../graphql/outbound/custom-queries\";\nimport { Link } from \"react-router-dom\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport {\n Button,\n CardActions,\n Divider,\n IconButton,\n CircularProgress,\n Box,\n Paper,\n Typography,\n Dialog,\n DialogTitle,\n DialogContent,\n DialogActions,\n Grid,\n useMediaQuery,\n List,\n ListItem,\n ListItemText,\n TableContainer,\n Table,\n TableHead,\n TableRow,\n TableCell,\n TableBody,\n Backdrop,\n FormControl,\n FormGroup,\n FormControlLabel,\n Checkbox,\n CardContent,\n} from \"@material-ui/core\";\nimport Timeline from \"@material-ui/lab/Timeline\";\nimport TimelineItem from \"@material-ui/lab/TimelineItem\";\nimport TimelineSeparator from \"@material-ui/lab/TimelineSeparator\";\nimport TimelineConnector from \"@material-ui/lab/TimelineConnector\";\nimport TimelineContent from \"@material-ui/lab/TimelineContent\";\nimport TimelineOppositeContent from \"@material-ui/lab/TimelineOppositeContent\";\nimport TimelineDot from \"@material-ui/lab/TimelineDot\";\nimport HighlightOffIcon from \"@material-ui/icons/HighlightOff\";\nimport NoteOutlinedIcon from \"@material-ui/icons/NoteOutlined\";\nimport CheckBoxOutlineBlankIcon from \"@material-ui/icons/CheckBoxOutlineBlank\";\nimport HistoryIcon from \"@material-ui/icons/History\";\nimport {\n ExceptionIcon,\n InboundIcon,\n OutboundIcon,\n} from \"../../../../components/common\";\nimport { format } from \"date-fns\";\nimport CheckBoxOutlineBlankOutlinedIcon from \"@material-ui/icons/CheckBoxOutlineBlankOutlined\";\nimport { logError } from \"../../../../utils/appUtils\";\nimport CrewCard from \"../../../../components/common/CrewCard\";\nimport InventoryPhotos from \"../../../../components/common/InventoryPhotos\";\nimport { CustomFieldsMobile } from \"../../../../components/common/CustomFields\";\nimport { UserType } from \"../../../../utils/constants\";\nimport { getUnitName } from \"../../../../utils/loadTypeUtils\";\n\nconst useStyles = makeStyles((theme) => ({\n backdrop: {\n zIndex: 90001,\n },\n paper: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: theme.spacing(2),\n marginBottom: theme.spacing(2),\n },\n timeLineItem: {\n maxWidth: theme.spacing(16),\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n timeLineItemMobile: {\n maxWidth: theme.spacing(10),\n paddingLeft: theme.spacing(0),\n paddingRight: theme.spacing(0.5),\n },\n historyButton: {\n maxWidth: theme.spacing(16),\n marginLeft: theme.spacing(-1),\n marginRight: theme.spacing(2),\n },\n link: {\n color: \"inherit\",\n textDecoration: \"inherit\",\n },\n}));\n\nexport const InventoryTimeline = ({ history, match }) => {\n const [headerData, setHeaderData] = useState();\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"xs\"));\n\n const handleCancel = () => {\n history.goBack();\n };\n\n return (\n \n {error && (\n {error} \n )}\n
\n - \n {dialogData?.map((itm) => (\n <>\n
\n {\" \"}\n
\n );\n};\n\nexport default Menu;\n","import React from \"react\";\nimport { makeStyles } from \"@material-ui/core\";\n\nconst useStyles = makeStyles((theme) => ({\n container: {\n margin: \"0 auto\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n}));\n\nexport const AppBarHeader = ({ children }) => {\n const classes = useStyles();\n return {children}
;\n};\n","import React, { useState, useRef, useEffect } from \"react\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { HelpIcon, SearchIcon } from \"./index\";\nimport { IconButton } from \"@material-ui/core\";\n\nconst useStyles = makeStyles({\n container: {\n display: \"flex\",\n alignItems: \"center\",\n },\n slideIn: {\n display: \"flex\",\n borderRadius: \"5px\",\n animation: \"$slideIn 0.5s ease-in-out\",\n overflow: \"hidden\",\n },\n slideOut: {\n display: \"flex\",\n borderRadius: \"5px\",\n animation: \"$slideOut 0.5s ease-in-out\",\n overflow: \"hidden\",\n },\n input: {\n border: \"1px solid #ddd\",\n padding: \"6px 10px\",\n borderRadius: \"5px\",\n fontSize: \"17px\",\n fontWeight: \"600\",\n color: \"#fff\",\n backgroundColor: \"transparent\",\n \"&::placeholder\": {\n color: \"#eee\",\n },\n \"&:focus\": {\n borderColor: \"#fff\",\n outline: \"none\",\n },\n },\n \"@keyframes slideIn\": {\n from: {\n width: \"0\",\n opacity: 0,\n },\n to: {\n width: \"250px\",\n opacity: 1,\n },\n },\n \"@keyframes slideOut\": {\n from: {\n width: \"250px\",\n opacity: 1,\n },\n to: {\n width: \"0\",\n opacity: 0,\n },\n },\n searchButton: {},\n});\n\nexport const HelpWPSearchButton = () => {\n const classes = useStyles();\n const [isVisible, setIsVisible] = useState(false);\n const [isAnimating, setIsAnimating] = useState(false);\n const [searchValue, setSearchValue] = useState(\"\");\n const inputRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (inputRef.current && !inputRef.current.contains(event.target)) {\n setIsAnimating(true);\n setTimeout(() => {\n setIsAnimating(false);\n setIsVisible(false);\n }, 500);\n }\n };\n\n if (isVisible) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isVisible]);\n\n const toggleSearchInputVisibility = () => {\n if (isVisible) {\n setIsAnimating(true);\n setTimeout(() => {\n setIsAnimating(false);\n setIsVisible(false);\n }, 500);\n } else {\n setIsVisible(true);\n }\n };\n\n const onChange = (e) => setSearchValue(e.target.value);\n\n const redirectToPage = () => {\n if (!searchValue.trim()) {\n return;\n }\n const url = `https://transloads.co/?s=${encodeURIComponent(\n searchValue.trim()\n )}&post_type=article&ignore_sticky_posts=1&order_by=relevance`;\n function openFullSizeWindow(url) {\n const screenWidth = window.screen.width / 2;\n const screenHeight = window.screen.height;\n const windowFeatures = `\n width=${screenWidth},\n height=${screenHeight},\n left=${screenWidth},\n top=0,\n toolbar=no,\n menubar=no,\n scrollbars=no,\n resizable=yes,\n location=no,\n status=no\n `;\n\n const newWindow = window.open(url, \"_blank\", windowFeatures);\n\n if (newWindow) {\n newWindow.moveTo(screenWidth, 0);\n newWindow.resizeTo(screenWidth, screenHeight);\n }\n }\n openFullSizeWindow(url);\n toggleSearchInputVisibility();\n };\n\n const handleKeyDown = (e) => {\n if (e.key === \"Enter\") {\n redirectToPage();\n }\n };\n\n return (\n \n \n {isVisible ? \"\" : \n {(isVisible || isAnimating) && (\n \n e.preventDefault()}\n onClick={redirectToPage}\n >\n
\n )}\n \n );\n};\n","import React, { Fragment } from \"react\";\nimport { Layout, AppBar, Notification } from \"react-admin\";\nimport { UserMenu, MenuItemLink } from \"react-admin\";\n\nimport {\n FormControlLabel,\n Tooltip,\n Typography,\n useMediaQuery,\n} from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport MoreVertIcon from \"@material-ui/icons/MoreVert\";\n\nimport {\n LogoutIcon,\n ProfileIcon,\n ThemeToggleIcon,\n} from \"../../components/common\";\nimport { useThemeState } from \"../../ThemeStateProvider\";\nimport { getEnv } from \"../../utils/appUtils\";\nimport MyMenu from \"./AdminMenu\";\nimport { AppBarHeader } from \"../../components/common/AppBarHeader\";\nimport { HelpWPSearchButton } from \"../../components/common/HelpWPSearchButton\";\n\nconst useStyles = makeStyles((theme) => ({\n themeLink: {\n paddingLeft: theme.spacing(3.3),\n },\n themeIcon: {\n marginRight: theme.spacing(2),\n },\n env: {\n margin: \"auto\",\n paddingTop: theme.spacing(0),\n position: \"absolute\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n },\n dev: {\n background: \"#2fbb2f\",\n },\n hotfix: {\n background: \"#FF9900\",\n },\n prod: {\n background: \"#ee2f2f\",\n },\n}));\n\nconst AdminMenu = (props) => {\n const classes = useStyles();\n const { toggleTheme } = useThemeState();\n\n return (\n \n
\n \n \n \n
\n
\n
\n \n {label && (\n \n {label}\n \n )}\n {listSwitch ? listSwitch : <>}\n {!label && !listSwitch && <> }\n {\n \n \n \n }\n
\n {modalOpened && (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n );\n};\n","import React, { useRef, useState } from \"react\";\nimport { makeStyles } from \"@material-ui/core/styles\";\n\nimport {\n TextField,\n Button,\n Chip,\n Typography,\n useMediaQuery,\n} from \"@material-ui/core\";\n\nimport { AddIcon } from \"../../../components/common\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n marginTop: theme.spacing(1),\n },\n location: {\n display: \"flex\",\n flexDirection: \"row\",\n justifyContent: \"flex-start\",\n marginTop: theme.spacing(2),\n marginBottom: theme.spacing(1),\n flexWrap: \"wrap\",\n },\n item: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n margin: theme.spacing(0.5),\n },\n input: {\n display: \"flex\",\n justifyContent: \"flex-start\",\n alignItems: \"center\",\n marginBottom: theme.spacing(2),\n },\n addField: {\n minWidth: \"16rem\",\n },\n addButton: {\n marginLeft: theme.spacing(1),\n height: \"2.5rem\",\n },\n}));\n\nexport default function AccessInput({ access, setAccess }) {\n const [accessName, setAccessName] = useState(\"\");\n const [error, setError] = useState(false);\n const locationRef = useRef();\n const classes = useStyles();\n\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"xs\"));\n\n const isDuplicate = (val) => {\n let duplicateValue = false;\n access.forEach((location) => {\n const v = location.split(\"-\");\n if (v[0] === val || (v.length > 1 && v[1] === val)) duplicateValue = true;\n });\n return duplicateValue;\n };\n\n const addAccess = (evt) => {\n debugger;\n const submitFlag = !!evt.preventDefault;\n if (submitFlag) {\n evt.preventDefault();\n }\n\n if (accessName && !isDuplicate(accessName)) {\n setAccess([...access, accessName.toUpperCase()]);\n }\n setAccessName(\"\");\n locationRef.current.focus();\n };\n\n const handleSubmit = (evt) => {\n if (evt.key === \"Enter\") {\n addAccess(\"Add\");\n }\n };\n\n const handleAccessName = (evt) => {\n if (!evt.target.value) {\n setAccessName(\"\");\n return;\n }\n let value = evt.target.value.trim().toUpperCase();\n if (isDuplicate(value)) setError(true);\n else setError(false);\n value && setAccessName(value);\n };\n\n const handleDelete = (idx) => {\n access.splice(idx, 1);\n setAccess([...access]);\n };\n\n return (\n \n
\n );\n}\n","import React, { useState } from \"react\";\n\nimport {\n Box,\n Chip,\n Divider,\n Grid,\n InputAdornment,\n makeStyles,\n Switch,\n TextField as MuiTextField,\n Typography,\n} from \"@material-ui/core\";\n\nimport {\n Labeled,\n NumberInput,\n required,\n TextField,\n TextInput,\n} from \"react-admin\";\nimport { useForm } from \"react-final-form\";\n\nimport AccessInput from \"./AccessInput\";\n\nconst useStyles = makeStyles((theme) => ({\n capacity: {\n position: \"relative\",\n marginLeft: theme.spacing(2),\n top: \"-0.5em\",\n width: \"10em\",\n height: \"1.5em\",\n },\n input: {\n paddingTop: \"7px\",\n paddingBottom: \"7px\",\n textAlign: \"right\",\n minWidth: \"8em\",\n },\n adorment: {\n marginTop: theme.spacing(0),\n },\n}));\n\nexport const Capabilities = ({\n classes,\n disabled,\n record,\n notify,\n ...props\n}) => {\n if (disabled) {\n return (\n \n addAccess(\"Add\")}\n startIcon={ addAccess(\"Add\")}\n startIcon={
\n \n {access.length === 0 ? (\n \n Enter nearest interstate, one at a time, hit ENTER / +ADD\n \n ) : (\n access.map((location, idx) => {\n return (\n
\n \n handleDelete(idx)}\n />\n
\n );\n })\n )}\n \n {record?.railHighway?.map((option) => (\n
\n \n \n {isAuthorized(AclType.INVOICES) && (\n \n \n \n \n \n \n \n )}\n \n \n \n \n \n \n \n \n \n \n \n \n {getEnv() === \"dev\" && (\n \n \n )}\n
\n );\n};\n\nconst TabPanel = ({ classes, children, value, index, ...other }) => {\n if (value !== index) return null; // Prevent inactive tab content from mounting\n\n return (\n \n \n \n {record?.areas?.items?.map((area) => (\n \n \n
\n \n {area.name} \n
\n ))}\n \n {record?.aisles\n ? record.aisles.items\n .filter((itm) => itm.areaId === area.id)\n .map((aisle, idx) => (\n
\n - \n {children}\n
setVideoId(\"\")} className={classes.videoContainer}>\n \n
\n );\n};\n","import React, { useState } from \"react\";\nimport { Grid, Button } from \"@material-ui/core\";\nimport Markdown from \"react-markdown\";\nimport NavigateBeforeIcon from \"@material-ui/icons/NavigateBefore\"; // Correct import for the icon\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { MarkdownListItem } from \"./MarkdownListItem\";\nimport { MarkdownLink } from \"./MarkdownLink\";\nimport { MarkdownList } from \"./MarkdownList\";\nimport { YTVideoModal } from \"../YTVideoModal\";\n\nconst useStyles = makeStyles((theme) => ({\n h: {\n marginBottom: theme.spacing(0),\n marginTop: theme.spacing(0),\n },\n}));\n\nconst MarkdownViewer = ({\n handleClose,\n setVideoId,\n callBack,\n md,\n hasChildren,\n}) => {\n const classes = useStyles();\n return (\n \n {children} \n
\n ),\n li: MarkdownListItem,\n h1: ({ children }) => {children}
,\n h2: ({ children }) =>{children}
,\n h3: ({ children }) =>{children}
,\n h4: ({ children }) =>{children}
,\n h5: ({ children }) =>{children}
,\n }}\n >\n {`${md}${hasChildren ? \"\\n\\n [More](custom/-)\" : \"\"}`}\n \n );\n};\n\nconst HelpViewer = ({ handleClose, md, children }) => {\n const [state, setState] = useState(\"main\");\n const [videoId, setVideoId] = useState(\"\");\n\n const handleBackClick = () => {\n setState(\"main\");\n };\n\n const callBack = () => {\n setState(\"customHelp\");\n };\n\n return (\n <>\n {state !== \"main\" && (\n\n \n \n \n \n \n
\n Help center
\n\n
\n {!helpPage &&\n (isEmptyChildren ? (\n \n {dynamicContentComponent}\n \n )}\n
\n \n \n );\n};\n\nexport const HelpIconButton = ({ helpClasses, children }) => {\n const classes = useStyles();\n helpClasses = helpClasses ? helpClasses : classes;\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"xs\"));\n const [anchorEl, setAnchorEl] = React.useState(null);\n\n const handleClick = (event) => {\n setAnchorEl(event.currentTarget);\n };\n\n const handleClose = () => {\n setAnchorEl(null);\n };\n\n const open = Boolean(anchorEl);\n const id = open ? \"audit-help\" : undefined;\n\n return (\n \n \n \n \n
\n );\n};\n","import React from \"react\";\nimport { FileInput, SelectInput, TextInput, useNotify } from \"react-admin\";\nimport { useForm } from \"react-final-form\";\n\nimport { Box } from \"@material-ui/core\";\nimport { AttachFileIcon } from \"../../../components/common\";\nimport { FileField } from \"../../../components/common/FileField\";\nimport {\n ACCEPTED_FILES,\n MAX_FILES,\n SubscriptionStatusChoices,\n} from \"../../../utils/constants\";\nimport { handleFileChange } from \"../../../utils/fileUtils\";\n\nconst Subscription = (props) => {\n const form = useForm();\n const notify = useNotify();\n\n return (\n \n {children}\n
\n \n Drop file(s) to upload,\n or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
- \n
- \n
\n Document Categories: Add unique document categories\n for categorizing assetts within Document Repository. Use of categories\n is optional.\n \n \n - \n
\n Logo: Attach corporate logo image to be used for\n branding your assetts. We recommend using a transparent .png file\n format.{\" \"}\n \n \n - \n
\n Yard Map: Attach image of graphical layout of the\n Reload Yard.\n \n \n
- \n
- \n
\n Name: Full business name.\n \n \n - \n
\n Phone: Primary business phone number.\n \n \n - \n
\n Email: Billing email address.\n \n \n - \n
\n Website: Business website URL, if available.\n \n \n - \n
\n Address: Physical Reload Yard address.\n \n \n - \n
\n Invoice Number Prefix: Used for generating unique\n invoice numbers (E.g. use company initials){\" \"}\n \n \n - \n
\n Tax Rates: Map the Tax Codes and Tax Rates defined in\n QuickBooks. Must have at least 1 rate defined. If Tax Code or Tax Rate\n is changed later, you will need to visit each Account and select the\n new Tax Rate Code for all services where it is used.\n \n \n
- \n
- \n
\n Commodities: Select Commodities handled. Define\n default Units of Measure for each commodity.\n \n \n - \n
\n Equipment / Capabilities: Select pieces of equipment\n in operation.\n \n \n - \n
\n Forklift: Indicate Maximum weight capacity.\n \n \n
- \n
- \n
\n Open Air Yard Capacity: Outdoors yard area / capacity\n in Acres.\n \n \n - \n
\n Covered / Warehouse Capacity: Indoors warehouse\n capacity in Square Feet.\n \n \n - \n
\n Track Capcity: Yard track length in Feet.\n \n \n - \n
\n Serving Rail Carrier: Primary rail service.\n \n \n - \n
\n Accessible Highway(s): List nearby intestates and\n major highways. Enter one at a time and press the{\" \"}\n \n\n ADD button to add to a list.\n \n
- \n
- \n
\n Areas: Add / Edit / Delete areas in your transload.\n Examples include Yard / Lot, Warehouse, Tracks.\n \n \n - \n
\n Zones: Add / Edit / Delete designated zones for each\n Area. You can drag and drop zones to re-order Zone dropdown options.\n Clicking Zone name opens Zone Edit dialog. Zone examples include\n Hazmat / Covered, Climate Control, Customer-assigned.\n \n \n - \n
\n Locations: Physical yard locations (aisles, pads,\n enclosed pans, tracks, etc.).\n \n \n - \n
\n Add Location: Enter one location at a time and\n press the \n\n ADD button or hit Enter key.\n \n - \n
\n Area: Select one of the pre-defined areas where to\n add new Location.\n \n \n - \n
\n Zone: Select one of the pre-defined zones where to\n add new Location.\n \n \n - \n
\n Aisle Layout: Select{\" \"}\n \n{\" \"}\n one-sided/end-cap/custom or{\" \"}\n double-sided aisle\n layout (sides A & B) using the toggle buttons.\n \n - \n
\n \n\n ADD: \n Press the ADD button, or hit Enter key. Adding a two-sided aisle\n location, will add two locations (A and B).\n \n - \n
\n Location List You can remove unnecessary/mistakenly\n added location by pressing \n{\" \"}\n icon next to location name. You can also re-arrange locations by\n dragging and dropping into correct order. Clicking on location name,\n opens Location Edit dialog.\n \n
- \n
\n \n \n Loading...
}>\n \n \n \n User information \n \n \n \n \n \n \n \n \n \n \n \n \n Business information \n \n \n \n \n \n \n \n \n \n \n \n Website \n \n {errors[\"website\"] ? errors[\"website\"] : \"\"}\n \n \n \n \n \n \n Business address \n \n \n \n \n \n \n \n \n \n\n \n \n {CountryList.map((option) => (\n \n ))}\n \n \n \n
\n );\n}\n","export default function reducer(state, action) {\n switch (action.type) {\n case \"YARD_INFO\":\n return {\n ...state,\n yardInfo: action.payload,\n };\n case \"ADD_ACCESS\":\n const access = state.yardInfo.accessToRailHighway\n ? state.yardInfo.accessToRailHighway\n : [];\n return {\n ...state,\n yardInfo: {\n ...state.yardInfo,\n accessToRailHighway: [...access, action.payload],\n },\n };\n case \"REMOVE_ACCESS\":\n const accessToRailHighway = state.yardInfo.accessToRailHighway.filter(\n (access) => access !== action.payload\n );\n return {\n ...state,\n yardInfo: { ...state.yardInfo, accessToRailHighway },\n };\n case \"ERROR\":\n return {\n ...state,\n errors: action.payload,\n };\n case \"CLEAR_ERROR\":\n return {\n ...state,\n errors: {},\n };\n case \"CHANGE_SERVICE\":\n debugger;\n return {\n ...state,\n services: [...action.payload],\n };\n case \"ADD_COMMODITY\":\n return {\n ...state,\n commodities: [\n ...state.commodities.map((itm) =>\n itm.id === action.payload.id ? { ...itm, active: true } : itm\n ),\n ],\n };\n case \"REMOVE_COMMODITY\":\n return {\n ...state,\n commodities: [\n ...state.commodities.map((itm) =>\n itm.id === action.payload.id ? { ...itm, active: false } : itm\n ),\n ],\n };\n case \"ADD_CAPABILITY\":\n return {\n ...state,\n capabilities: [\n ...state.capabilities.map((itm) =>\n itm.id === action.payload.id ? { ...itm, active: true } : itm\n ),\n ],\n };\n case \"SET_FORKLIFT_MAX_CAPACITY\":\n return {\n ...state,\n forkLiftMaxCapacity: action.payload,\n };\n case \"REMOVE_CAPABILITY\":\n return {\n ...state,\n capabilities: [\n ...state.capabilities.map((itm) =>\n itm.id === action.payload.id ? { ...itm, active: false } : itm\n ),\n ],\n };\n case \"NOTE\":\n return {\n ...state,\n note: action.payload,\n };\n case \"SET_PRODUCT_PRICES\":\n debugger;\n return {\n ...state,\n subscription: {\n ...state.subscription,\n priceList: action.payload,\n },\n };\n case \"SET_SUBSCRIPTION\":\n debugger;\n return {\n ...state,\n subscription: {\n ...action.payload,\n },\n };\n case \"UPDATE_STATE\":\n return {\n ...action.payload,\n validators: state.validators,\n };\n default:\n break;\n }\n return state;\n}\n","import React, { useState, useContext } from \"react\";\nimport {\n Grid,\n TextField,\n Button,\n Chip,\n InputAdornment,\n} from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport AddIcon from \"@material-ui/icons/Add\";\n\nimport { useField } from \"react-final-form\";\nimport useForm from \"../../../../utils/useForm\";\nimport SetupContext, { validateYard } from \"./context\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n marginTop: theme.spacing(4),\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(4),\n },\n selectedAccess: {\n display: \"flex\",\n flexWrap: \"wrap\",\n marginTop: theme.spacing(2),\n marginLeft: theme.spacing(2),\n \"& > *\": {\n margin: theme.spacing(0.5),\n },\n },\n addButton: {\n marginTop: theme.spacing(1.25),\n marginLeft: theme.spacing(1),\n },\n addInput: {\n marginTop: theme.spacing(1),\n\n minWidth: \"50%\",\n },\n divider: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n}));\n\nexport default function AccessAndCapacity() {\n const { state, dispatch } = useContext(SetupContext);\n const { yardInfo } = state;\n const {\n input: { onChange },\n } = useField(\"setupData\");\n const { handleChange } = useForm(state, dispatch, \"yardInfo\");\n const [newAcess, setNewAcess] = useState();\n const classes = useStyles();\n let { errors } = state;\n\n const handleRecordChange = (evt) => {\n debugger;\n onChange();\n handleChange(evt);\n };\n\n const addAccess = () => {\n debugger;\n if (!newAcess || yardInfo.accessToRailHighway?.includes(newAcess)) return;\n dispatch({ type: \"ADD_ACCESS\", payload: newAcess });\n setNewAcess(\"\");\n onChange();\n };\n\n const handleSubmit = (evt) => {\n if (evt.key === \"Enter\") {\n addAccess(\"Add\");\n }\n };\n\n const deleteAccess = (toDelete) => {\n dispatch({ type: \"REMOVE_ACCESS\", payload: toDelete });\n onChange();\n };\n\n const handleBlur = (evt) => {\n const errors = validateYard(state.yardInfo);\n dispatch({ type: \"ERROR\", payload: errors });\n };\n\n return (\n \n
\n \n
\n \n \n \n Acres\n ),\n }}\n autoFocus\n required\n margin=\"dense\"\n variant=\"outlined\"\n fullWidth\n value={yardInfo.lotCapacityAcres}\n onChange={handleRecordChange}\n onBlur={handleBlur}\n />\n \n \n SqFt\n ),\n }}\n value={yardInfo.warehouseCapacity}\n onChange={handleRecordChange}\n >\n \n \n Feet\n ),\n }}\n value={yardInfo.trackCapacity}\n onChange={handleRecordChange}\n >\n \n \n \n \n \n \n \n setNewAcess(evt.target.value.toUpperCase())}\n inputProps={{\n style: { textTransform: \"uppercase\" },\n }}\n />\n \n \n \n \n \n \n \n \n
\n );\n}\n","import React, { useContext } from \"react\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { Grid } from \"@material-ui/core\";\nimport { SelectInput } from \"react-admin\";\nimport { TextField, Typography } from \"@material-ui/core\";\nimport { useField } from \"react-final-form\";\nimport SetupContext from \"./context\";\nimport { NewCustomerStatusOptions } from \"../../../../utils/constants\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(4),\n marginTop: theme.spacing(3),\n marginBottom: theme.spacing(2),\n },\n}));\n\nexport default function Note() {\n const classes = useStyles();\n const { state, dispatch } = useContext(SetupContext);\n const {\n input: { onChange },\n } = useField(\"setupData\");\n\n const handleRecordChange = (evt) => {\n onChange();\n dispatch({ type: \"NOTE\", payload: evt.target.value });\n };\n\n return (\n \n {yardInfo?.accessToRailHighway?.map((option) => (\n alert}\n onDelete={() => deleteAccess(option)}\n />\n ))}\n
\n \n \n \n \n \n TOS Telemetry: \n cognitoId: {state.tosAccept.cognitoId} \n IP Address: {state.tosAccept.ip} \n \n \n \n \n
\n );\n}\n","import React, { useContext, useEffect, useState, useRef } from \"react\";\nimport { API } from \"aws-amplify\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { Grid, TextField, MenuItem, Typography } from \"@material-ui/core\";\nimport { useField } from \"react-final-form\";\nimport useForm from \"../../../../utils/useForm\";\nimport SetupContext, { validateSubscription } from \"./context\";\n\nimport { useNotify } from \"react-admin\";\nimport { logError } from \"../../../../utils/appUtils\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(4),\n },\n}));\n\nexport default function Subscription() {\n const classes = useStyles();\n const notify = useNotify();\n const isComponentMounted = useRef(true);\n const { state, dispatch } = useContext(SetupContext);\n const { subscription } = state;\n\n const [products, setProducts] = useState([]);\n const [prices, setPrices] = useState([]);\n const [priceList, setPriceList] = useState([]);\n\n const {\n input: { onChange },\n } = useField(\"setupData\");\n\n useEffect(() => {\n if (isComponentMounted) getData();\n return () => (isComponentMounted.current = false);\n }, []);\n\n useEffect(() => {\n if (prices && subscription) {\n const newPices = prices.filter(\n (price) => price.product === subscription.productId\n );\n setPriceList(newPices);\n }\n }, [prices, subscription]);\n\n const getData = async () => {\n try {\n const response = await API.post(\n \"transREST\",\n \"/stripe-list-products-prices\",\n {\n body: {\n active: true,\n },\n }\n );\n debugger;\n\n if (response.err)\n logError(\n \"newYardData:Subscription:getData:response\",\n response.err,\n notify\n );\n else {\n setProducts(response.productList.products.data);\n setPrices(response.productList.prices.data);\n\n const productPrices = response.productList.prices.data.filter(\n (price) => price.product === state.subscription?.productId\n );\n setPriceList(productPrices);\n }\n } catch (err) {\n logError(\"newYardData:Subscription:getData\", err, notify);\n }\n };\n\n const { handleChange } = useForm(\n state,\n dispatch,\n \"subscription\",\n \"SET_SUBSCRIPTION\"\n );\n\n const handleRecordChange = (evt) => {\n //Set subscription.productId\n debugger;\n handleChange(evt);\n onChange();\n };\n\n const handleProduct = (evt) => {\n debugger;\n const productPrices = prices.filter(\n (price) => price.product === evt.target.value\n );\n setPriceList(productPrices);\n handleRecordChange(evt);\n dispatch({ type: \"SET_PRODUCT_PRICES\", payload: productPrices });\n };\n\n const handleBlur = (evt) => {\n const errors = validateSubscription(state.subscription);\n dispatch({ type: \"ERROR\", payload: errors });\n };\n\n let { errors } = state;\n\n return (\n \n \n \n Set Up Subscription \n \n \n \n \n {products.map((option) => (\n \n ))}\n \n \n \n Prices:\n \n \n \n \n
\n );\n}\n","import React, { useContext, useEffect, useReducer, useState } from \"react\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { updateSetupData } from \"../../../graphql/reloadyard/custom-mutations\";\nimport {\n useEditController,\n useNotify,\n useRedirect,\n DeleteButton,\n Edit,\n FormTab,\n SaveButton,\n TabbedForm,\n Toolbar,\n TopToolbar,\n} from \"react-admin\";\n\nimport { Box, makeStyles, Typography } from \"@material-ui/core\";\nimport SaveIcon from \"@material-ui/icons/Save\";\nimport CloseOutlinedIcon from \"@material-ui/icons/CloseOutlined\";\nimport CheckOutlinedIcon from \"@material-ui/icons/CheckOutlined\";\n\nimport { BackButton } from \"../../../components/common/BackButton\";\nimport YardInfo from \"./newYardData/YardInfo\";\nimport SetupContext from \"./newYardData/context\";\nimport setupReducer from \"./newYardData/reducer\";\nimport AccessAndCapacity from \"./newYardData/AccessAndCapacity\";\nimport Note from \"./newYardData/Note\";\nimport Subscription from \"./newYardData/Subscription\";\nimport { emailApprovedHTML } from \"./emailApprovedHTML\";\nimport { emailRejectedHTML } from \"./emailRejectedHTML\";\n\nimport { NewCustomerStatus } from \"../../../utils/constants\";\nimport { logError } from \"../../../utils/appUtils\";\n\nconst SetupEdit = (props) => {\n const { record } = useEditController(props);\n let initState = useContext(SetupContext);\n const [state, dispatch] = useReducer(setupReducer, initState);\n\n useEffect(() => {\n if (record?.setupData) {\n dispatch({ type: \"UPDATE_STATE\", payload: JSON.parse(record.setupData) });\n debugger;\n }\n }, [record]);\n\n const getSetupData = () => {\n return state;\n };\n\n const validateForm = (values) => {\n const validate = state.validators[0];\n let errors = validate(state.yardInfo);\n return errors;\n };\n\n return (\n - \n {priceList.map((option) => (\n
- \n {option.nickname\n ? option.nickname\n : `<< ${option.unit_amount / 100} ${option.currency} : ${\n option.type === \"one_time\"\n ? option.type\n : option.recurring.interval\n } >>`}\n \n ))}\n
\n
\n \n
\n )}\n ${toName},
${yardName} is Approved!
\n \n
\n To complete the setup process, please click on the button below to navigate to transloads.co and login using this email address:
\n ${toEmail}
\n If you're already logged in, just refresh the \"PENDING REVIEW\" page.\n
\n Once your account is activated, you will have full access to the Yard Management System.\n
\n
| \n \n SIGN IN\n \n | \n
\n
\n
\n Button not working? Try pasting this URL into your browser:
\n \n \n https://app.transloads.co/?signIn\n \n \n `;\n}\n","export function emailRejectedHTML(toName, yardName) {\n return `\n
${toName},
\n \n
\n Thank you for your interest in transloads.co\n
\n Upon review of your ${yardName} setup, the registration request has been rejected.\n
\n Mostly, that happens if this transload is already registered in our system.\n
\n if you think your request has been rejected by mistake, please contact us at:\n
\n \n \n support@transloads.co\n \n
\n OR\n
\n 1-877-TRANSLOAD\n \n
\n We apologize for any inconvenience!\n
\n Customer Success Team\n
\n transloads.co\n `;\n}\n","import React from \"react\";\n\nimport { Typography } from \"@material-ui/core\";\n\nimport {\n Labeled,\n ReferenceField,\n ReferenceInput,\n TextField,\n TextInput,\n} from \"react-admin\";\n\nimport { AppType } from \"../../../utils/constants\";\n\nexport const TenantField = ({ record, label, ...props }) => {\n return record?.tenantId === AppType.ADMIN ? (\n
- \n
- \n
\n Email: Email address is used to complete new User\n registration process. Each user must have a unique email address,\n since it is used as username to login into the platform. Email cannot\n be changed once the User record is created.\n \n \n - \n
\n Address: Home address for record keeping.\n \n \n - \n
\n Phone: Home phone number for record keeping.\n \n \n - \n
\n User Type: Manager has full system access to both\n the manager portal and crew mobile App. Crew has limited access to the\n mobile Operator App only.\n \n \n
- \n
- \n
\n Email: Email address is used to complete new User\n registration process. Each user must have a unique email address,\n since it is used as username to login into the platform. Email\n cannot be changed once the User record is created.\n \n \n - \n
\n Address: Home address for record keeping.\n \n \n - \n
\n Phone: Home phone number for record keeping.\n \n \n - \n
\n User Type: Manager has full system access to both\n the manager portal and crew mobile App. Crew has limited access to\n the mobile Operator App only.\n \n \n - \n
\n \n\n DELETE: \n Removes user's access to the platform and deletes the User from\n \"Users\" list view.\n \n
${toName},
Your transloads.co account has been deleted.
\n \n
\n This is to inform you that ${fromName} at ${yardName} has deleted your account from transloads.co.
\n If you believe this is a mistake or have any concerns, please contact your manager as soon as possible.\n
\n
\n
\n If you need assistance or have any further questions, please contact your manager.\n `;\n}\n","import { UserType, UserTypeOptions } from \"../../../utils/constants\";\n\nexport const getUserTypeDescription = (userType) => {\n const userTypeOption = UserTypeOptions.find((itm) => itm.id === userType);\n return userTypeOption ? userTypeOption.description : false;\n};\n\nexport const getUserTypeOptions = (userRecord) => {\n if (window.appUser?.type === UserType.MANAGER) {\n return UserTypeOptions; // MANAGER can edit all users\n }\n if (\n window.appUser?.type === UserType.SUPERVISOR &&\n userRecord?.type !== UserType.MANAGER\n ) {\n return UserTypeOptions.filter((itm) => itm.id !== UserType.MANAGER); // SUPERVISOR can edit CREW & SUPERVISOR\n }\n return UserTypeOptions; // SUPERVISOR editing a MANAGER, show all radio buttons disabled\n};\n\nexport const disableUserOptions = (userRecord) => {\n // return false;\n return (\n window.appUser.id === userRecord?.id ||\n (window.appUser.type !== UserType.MANAGER &&\n userRecord?.type === UserType.MANAGER)\n );\n};\n","import React from \"react\";\n\nimport {\n Card,\n CardContent,\n Grid,\n makeStyles,\n Typography,\n} from \"@material-ui/core\";\n\nimport { SelectField } from \"react-admin\";\n\nimport { UserStatuses } from \"../../../utils/constants\";\nimport { UserStatusIcon } from \"./UserStatusIcon\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n [theme.breakpoints.up(\"sm\")]: {\n width: \"14em\",\n minWidth: \"14em\",\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(0.5),\n overflow: \"initial\",\n },\n [theme.breakpoints.down(\"sm\")]: {\n display: \"none\",\n },\n },\n statusIcon: {\n marginTop: theme.spacing(-0.3),\n },\n}));\n\nexport const UserAside = ({ backPath, record, ...props }) => {\n const classes = useStyles();\n\n if (!record) return null;\n return (\n
\n {props.record.address.street} \n \n {props.record.address.city}, {props.record.address.state}{\" \"}\n {props.record.address.zipCode}\n \n
\n );\n return \"\";\n};\nAddressField.defaultProps = { addLabel: true, label: \"Address\" };\n\nconst StatusTextField = (props) => {\n if (!props.record.status) return null;\n const label = () => {\n switch (props.record.status) {\n case \"AVAILABLE\":\n return \"Available\";\n case \"TEMP_UNAVAILABLE\":\n return \"Temporarily Unavailable\";\n case \"UNAVAILABLE\":\n return \"Unavailable\";\n default:\n return \"\";\n }\n };\n\n return label();\n};\nStatusTextField.defaultProps = { addLabel: true, label: \"Availability\" };\n\nconst UserTitle = ({ record }) => {\n return {record ? `${record.fullName}` : \"\"};\n};\n\nconst AclDisplayField = (record) => {\n // Filter the UserAclOptions to include only those ACLs present in record.acl\n debugger;\n if (record.acl) {\n const displayAcl = UserAclOptions.filter((aclOption) =>\n record.acl.includes(aclOption.id)\n ).map((aclOption) => - {displayAcl}
- \n
- \n
\n Email: Email address is used to complete new User\n registration process. Each user must have a unique email address,\n since it is used as username to login into the platform. Email cannot\n be changed once the User record is created.\n \n \n - \n
\n Address: Home address for record keeping.\n \n \n - \n
\n Phone: Home phone number for record keeping.\n \n \n - \n
\n User Type: Manager has full system access to both\n the manager portal and crew mobile App. Crew has limited access to the\n crew mobile App only.\n \n \n
- \n
- \n
\n Email: Email address is used to complete new User\n registration process. Each user must have a unique email address,\n since it is used as username to login into the platform. Email\n cannot be changed once the User record is created.\n \n \n - \n
\n Address: Home address for record keeping.\n \n \n - \n
\n Phone: Home phone number for record keeping.\n \n \n - \n
\n User Type: Manager has full system access to both\n the manager portal and crew mobile App. Crew has limited access to\n the crew mobile App only.\n \n \n - \n
\n \n\n DELETE: \n Removes user's access to the platform and deletes the User from\n \"Users\" list view.\n \n
\n
\n \n {!isXSmall && (\n \n \n )}\n \n \n
\n }\n >\n {tasks?.length > 0 ? (\n - \n {tasks.map((task, idx) => {\n return (\n
\n \n \n \n \n \n \n \n handleClick(task)}>\n \n \n \n \n {idx < tasks.length - 1 ?
\n );\n })}\n \n {task.link && (\n \n )}\n \n
\n )}\n \n \n Complete Audit\n \n
\n \n {\n setSelectedAccount(newValue);\n }}\n inputValue={inputValue}\n onInputChange={(event, newInputValue) => {\n setInputValue(newInputValue);\n }}\n id=\"accounts\"\n fullWidth\n options={allAccounts}\n renderInput={(params) => (\n
\n \n \n
\n \n );\n};\n\nexport default YardLocations;\n","import React from \"react\";\n\nimport { Chip } from \"@material-ui/core\";\n\nconst OperatorsList = ({ currentAudit, locations, classes }) => {\n return currentAudit?.nextItems ? (\n \n {currentAudit.nextItems.map((item, idx) => {\n return (\n
\n ) : (\n <>\n );\n};\n\nexport default OperatorsList;\n","import React, { useEffect, useState } from \"react\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { getAisle } from \"../../graphql/reloadyard/custom-queries\";\nimport { getLocation } from \"../../graphql/queries\";\nimport { updateAisle, updateLocation } from \"../../graphql/mutations\";\nimport { Box, Slider, Typography, useMediaQuery } from \"@material-ui/core\";\nimport { useNotify } from \"react-admin\";\nimport { logError } from \"../../utils/appUtils\";\nimport { LocationType } from \"../../utils/constants\";\nimport {\n getAisleFullName,\n getLocationFullName,\n isBulkArea,\n} from \"../../utils/locationUtils\";\n\nconst LocationCapacity = ({\n aisle,\n disabled = false,\n refreshFn,\n showName = true,\n disableAisleChange,\n}) => {\n const [currentAisle, setCurrentAisle] = useState();\n const notify = useNotify();\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"sm\"));\n\n // Generate marks based on screen size\n let marks = [];\n for (let i = 0; i <= 100; i += isSmall ? 20 : 10) {\n marks.push({\n value: i,\n label: `${i}`,\n });\n }\n\n useEffect(() => {\n if (!disableAisleChange && aisle) handleAisleChange(aisle);\n }, [aisle]);\n\n const handleAisleChange = async (aisle) => {\n if (!disabled && !aisle.locations) {\n const response = await API.graphql(\n graphqlOperation(getAisle, { id: aisle.id })\n );\n setCurrentAisle(response.data.getAisle);\n } else {\n setCurrentAisle(aisle);\n }\n };\n\n const handlePercentageChange = async (event, newValue) => {\n debugger;\n currentAisle.capacityUsed = newValue;\n setCurrentAisle({ ...currentAisle });\n };\n\n const handlePercentageChangeCommit = async (event, newValue) => {\n // setCurrentAisle({...currentAisle, capacityUsed: newValue});\n const toUpdateAisle = { id: currentAisle.id, capacityUsed: newValue };\n try {\n await API.graphql(\n graphqlOperation(updateAisle, { input: toUpdateAisle })\n );\n if (currentAisle.type === LocationType.UNSTRUCTURED) {\n const toUpdateLocation = {\n capacityUsed: newValue,\n };\n if (currentAisle.locations.items) {\n toUpdateLocation.id = currentAisle.locations.items[0].id;\n } else {\n toUpdateLocation.id = currentAisle.locations[0].id;\n }\n\n await API.graphql(\n graphqlOperation(updateLocation, { input: toUpdateLocation })\n );\n }\n\n if (refreshFn) refreshFn();\n } catch (err) {\n logError(\"LocationCapacity:handleLanePercentageChange\", err, notify);\n }\n };\n\n // const capacityUsed = currentAisle?.capacityUsed || 0;\n\n const getCapacityUsed = () => {\n if (currentAisle?.capacityUsed) {\n let usedCapacity = currentAisle.capacityUsed;\n\n if (isBulkArea(currentAisle?.area) && currentAisle.bulkCapacity) {\n usedCapacity =\n (currentAisle.capacityUsed / currentAisle.bulkCapacity) * 100;\n }\n\n return usedCapacity.toLocaleString(\"en-US\", {\n minimumFractionDigits: 0,\n maximumFractionDigits: 0,\n });\n }\n return 0;\n };\n\n return (\n <>\n \n
\n );\n })}\n \n \n \n }\n showDivider={false}\n >\n \n \n \n \n \n Account: {currentInventory.accountName} \n \n \n Lot number: {currentInventory.lotNumber} \n \n \n \n \n \n {\" \"}\n {getUnitName(currentInventory.inventoryUnits)}{\" \"}\n \n ),\n }}\n />\n \n {currentInventory.productCode && (\n \n \n Product code: {currentInventory.productCode}\n \n \n )}\n \n \n {getAreaLocations()}\n \n \n {currentInventory.location && (\n \n \n )}\n \n evt.target.value && setNote(evt.target.value)}\n />\n \n {\n \n \n \n Previous notes\n \n \n \n \n \n \n }\n \n \n \n \n \n
\n );\n}\n","import React, { useState, useEffect } from \"react\";\n\nimport {\n Typography,\n Button,\n ButtonGroup,\n Grid,\n List,\n ListItem,\n ListItemAvatar,\n ListItemText,\n Avatar,\n ListItemSecondaryAction,\n IconButton,\n Divider,\n Paper,\n Menu,\n MenuItem,\n MenuList,\n LinearProgress,\n ClickAwayListener,\n Grow,\n Popper,\n} from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { orange, grey, green } from \"@material-ui/core/colors\";\n\nimport {\n CheckIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n DropDownIcon,\n ExpandMoreIcon,\n RedoIcon,\n XIcon,\n} from \"../../../components/common\";\nimport OperatorsList from \"./OperatorsList\";\nimport AuditItem from \"./AuditItem\";\n\nconst useStyles = makeStyles((theme) => ({\n listRoot: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(1),\n marginTop: theme.spacing(1),\n },\n listHeader: {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n paddingBottom: theme.spacing(1.25),\n marginLeft: theme.spacing(2),\n marginRight: theme.spacing(2.5),\n marginTop: theme.spacing(2),\n },\n headerText: {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n },\n orange: {\n color: theme.palette.getContrastText(orange[100]),\n backgroundColor: orange[100],\n },\n green: {\n color: theme.palette.getContrastText(green[200]),\n backgroundColor: green[200],\n },\n unprocessedItem: {\n color: theme.palette.getContrastText(grey[300]),\n backgroundColor: grey[300],\n },\n backToInventory: {\n display: \"flex\",\n justifyContent: \"space-between\",\n padding: theme.spacing(4),\n },\n listAuditProgress: {\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n },\n operators: {\n display: \"flex\",\n justifyContent: \"center\",\n margin: theme.spacing(2),\n flexWrap: \"wrap\",\n },\n item: {\n margin: theme.spacing(0.5),\n },\n notFound: {\n display: \"fles\",\n margin: theme.spacing(2),\n },\n}));\n\nexport const InventoryList = ({\n handleSkip,\n handleComplete,\n handleBack,\n handleNext,\n currentAudit,\n inventories,\n isCompleted,\n title,\n disableBack,\n returnToAudit,\n locations,\n completedLocations,\n setLocationMode,\n}) => {\n const [anchorEl, setAnchorEl] = useState(null);\n const [listMode, setListMode] = useState(true);\n const [currentInventory, setCurrentInventory] = useState({});\n const classes = useStyles();\n\n useEffect(() => {\n window.scrollTo(0, 0);\n });\n\n const handleClick = (event) => {\n setAnchorEl(event.currentTarget);\n };\n\n const handleClose = (item) => {\n setAnchorEl(null);\n };\n\n const getIcon = (inventory) => {\n if (\n currentAudit.processedItems.findIndex((itm) => itm.id === inventory.id) >=\n 0\n )\n return \n {currentInventory.notes &&\n currentInventory.notes\n .map((note, idx) => (\n
\n \n \n {getNoteText(note)}\n \n
\n ))\n .reverse()}\n \n \n Complete\n \n \n Skip Item\n \n
\n \n \n
\n \n \n \n \n \n
\n \n \n {title}\n \n {currentAudit.skippedItems?.length > 0 && (\n <>\n \n \n \n {currentAudit.skippedItems.map((item) => (\n handleSelect(item, true)}\n >\n {\n \n Location: {item.location.name}, Lot# {item.lotNumber}\n \n }\n \n ))}\n \n \n )}\n
\n \n
\n {currentAudit?.nextItems && (\n - \n {inventories.length > 0 ? (\n inventories.map((inventory) => {\n return (\n
\n handleSelect(inventory)}>\n \n \n {/* \n \n \n handleSelect(inventory)}\n >\n \n \n
\n );\n })\n ) : (\n \n \n
\n \n {locations.length > 0 &&\n locations.map((itm, idx) => (\n
\n ) : (\n <>\n );\n};\n\nexport default LocationsMap;\n","import React, { useState, useEffect, useRef } from \"react\";\n\nimport { useNotify, Title } from \"react-admin\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { formatDistanceToNow } from \"date-fns\";\nimport {\n TextField,\n Typography,\n Button,\n CircularProgress,\n Grid,\n MenuItem,\n Backdrop,\n} from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { getAudit } from \"../../../graphql/queries\";\nimport { AuditOutlinedIcon } from \"../../../components/common\";\nimport { HelpIconButton } from \"../../../components/common/HelpButton\";\nimport { AuditStatus } from \"../../../utils/constants\";\nimport { getNextItem, setNextItem } from \"./Audit\";\nimport OperatorsList from \"./OperatorsList\";\nimport LocationsMap from \"./LocationsMap\";\nimport { logError } from \"../../../utils/appUtils\";\nimport CrewCard from \"../../../components/common/CrewCard\";\nimport { getLocationViewName } from \"../../../utils/locationUtils\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n marginTop: theme.spacing(1),\n },\n backdrop: {\n zIndex: 90001,\n },\n auditButtonCenter: {\n display: \"flex\",\n justifyContent: \"space-between\",\n marginTop: theme.spacing(4),\n },\n listHeader: {\n marginTop: theme.spacing(1.5),\n marginLeft: theme.spacing(2),\n },\n settings: {\n marginTop: theme.spacing(2),\n },\n inventoryCardAvatar: {\n color: theme.palette.getContrastText(theme.palette.secondary.main),\n backgroundColor: theme.palette.secondary.main,\n width: theme.spacing(6),\n height: theme.spacing(6),\n },\n\n operators: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1),\n marginRight: theme.spacing(1),\n flexWrap: \"wrap\",\n },\n item: {\n margin: theme.spacing(0.5),\n },\n help: {\n margin: theme.spacing(2),\n width: 600,\n },\n helpMobile: {\n margin: theme.spacing(2),\n width: \"100%\",\n },\n}));\n\nconst ViewAudit = ({ audit, history, match, setViewState, returnToAudit }) => {\n const notify = useNotify();\n const classes = useStyles();\n const isComponentMounted = useRef(true);\n const [currentAudit, setCurrentAudit] = useState();\n const [locations, setLocations] = useState();\n const [, setCompletedLocations] = useState(0);\n const [index, setIndex] = useState(0);\n const [message, setMessage] = useState();\n const [loading, setLoading] = useState(false);\n\n useEffect(() => {\n if (isComponentMounted) {\n getSelectedAudit();\n window.scrollTo(0, 0);\n }\n }, []);\n\n const getSelectedAudit = async () => {\n try {\n debugger;\n let inProgressAudit = audit;\n if (!audit) {\n const response = await API.graphql(\n graphqlOperation(getAudit, { id: match.params.id })\n );\n inProgressAudit = response.data.getAudit;\n }\n inProgressAudit = setCurrentAuditData(inProgressAudit);\n setLocations(inProgressAudit.locations.map((itm) => itm));\n setCurrentAudit(inProgressAudit);\n const idx = getNextItem(audit);\n setIndex(idx);\n debugger;\n computeCompleted(inProgressAudit);\n setMessage(\n `Created: ${formatDistanceToNow(new Date(audit.createdAt))} ago`\n );\n } catch (err) {\n logError(\"CreateAudit:getAudits\", err, notify);\n }\n };\n\n const computeCompleted = (audit) => {\n let completedCount = 0;\n debugger;\n Object.keys(audit.processedLocations).forEach((key) => {\n if (\n audit.processedLocations[key].completed ===\n audit.processedLocations[key].total\n )\n completedCount++;\n });\n setCompletedLocations(completedCount);\n };\n\n const startAudit = () => {\n debugger;\n setNextItem(currentAudit, index);\n\n setLoading(false);\n setViewState(\"EDIT\");\n history.push(`${match.url}`);\n };\n\n const setCurrentAuditData = (audit) => {\n debugger;\n if (typeof audit.processedItems === \"string\") {\n audit.processedItems = !audit.processedItems\n ? []\n : JSON.parse(audit.processedItems);\n }\n if (typeof audit.skippedItems === \"string\") {\n audit.skippedItems = !audit.skippedItems\n ? []\n : JSON.parse(audit.skippedItems);\n }\n if (typeof audit.processedLocations === \"string\") {\n audit.processedLocations = !audit.processedLocations\n ? {}\n : JSON.parse(audit.processedLocations);\n }\n return audit;\n };\n\n const cancel = () => {\n returnToAudit(false);\n };\n\n return (\n <>\n {loading ? (\n \n
\n ))}\n \n \n \n
\n \n }\n \n )}\n \n );\n};\n\nconst AuditHelp = () => (\n <>\n \n The Audit Wizard will walk you through the Yard, guiding you from one\n Location & Inventory Item to the next. You can always skip an item, or\n pick another Location to work, if needed.\n
\n\n As you visit each Location and count each Item, the system marks them as\n completed, and keeps track of all Items that were skipped. You can come\n back to skipped location by selecting it from dropdown in top navigation\n bar. If you skipped any items, the system will display a review screen at\n the end of an Audit, allowing you re re-visit skipped locations.\n
\n\n Once all the inventory Items have been checked, the wizard will send the\n Audit results for.\n
\n \n);\n\nexport default ViewAudit;\n","import React, { useState, useEffect, useRef } from \"react\";\n\nimport { useNotify, useRedirect } from \"react-admin\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { getAudit, accountByActiveByName } from \"../../../graphql/queries\";\nimport { updateAuditInventorie } from \"../../../graphql/inventory/custom-mutations\";\nimport { AuditStatus, InventoryStatus } from \"../../../utils/constants\";\nimport { getAuditNextItems } from \"../../../graphql/audit/custom-queries\";\nimport { inventoryByStatusByLocationIdByAccountId } from \"../../../graphql/inventory/custom-queries\";\n\nimport { CircularProgress } from \"@material-ui/core\";\nimport { logError } from \"../../../utils/appUtils\";\nimport { getLocationViewName } from \"../../../utils/locationUtils\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport ErrorCard from \"../../../components/ErrorCard\";\nimport AuditSummary from \"./AuditSummary\";\nimport YardLocations from \"./YardLocations\";\nimport { InventoryList } from \"./InventoryList\";\nimport ViewAudit from \"./ViewAudit\";\nimport { getNextItem, setNextItem, saveAudit } from \"./Audit\";\n\nconst useStyles = makeStyles((theme) => ({\n progress: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n height: 300,\n },\n}));\n\nconst AuditContainer = ({ match, history }) => {\n const classes = useStyles();\n const notify = useNotify();\n const redirect = useRedirect();\n const isComponentMounted = useRef(true);\n const [inventories, setInventories] = useState([]);\n const [currentAudit, setCurrentAudit] = useState();\n const [loading, setLoading] = useState(false);\n const [completedFlag, setCompletedFlag] = useState();\n const [completedLocations, setCompletedLocations] = useState(0);\n const [locationMode, setLocationMode] = React.useState(false);\n const [accounts, setAccounts] = useState([]);\n const [invalidIdError, setInvalidIdError] = useState();\n const [locations, setLocations] = useState();\n const [viewState, setViewState] = useState(\"VIEW\");\n\n useEffect(() => {\n init();\n getAccounts();\n // let updateAuditListener;\n // Auth.currentAuthenticatedUser()\n // .then(user => {\n // updateAuditListener = API.graphql(graphqlOperation(onUpdateAudit, {\n // owner: user.username\n // })).subscribe({\n // next: auditData => {\n // let data = auditData.value.data.onUpdateAudit;\n // setCurrentAudit(setCurrentAuditData(data));\n // }\n // })\n // });\n return () => {\n isComponentMounted.current = false;\n debugger;\n // updateAuditListener.unsubscribe();\n };\n }, []);\n\n const init = async () => {\n if (loading) return;\n setLoading(true);\n try {\n debugger;\n let response = await API.graphql(\n graphqlOperation(getAudit, { id: match.params.id })\n );\n if (response.data.getAudit) {\n const audit = setCurrentAuditData(response.data.getAudit);\n setCurrentAudit(audit);\n setLocations(audit.locations);\n computeCompleted(audit);\n const nextItem = history.location.state?.index\n ? history.location.state.index\n : getNextItem(audit);\n debugger;\n // await getInventories(nextItem, audit);\n setNextItem(audit, nextItem);\n } else {\n setInvalidIdError(`Audit ID ${match.params.id} doesn't exist.`);\n }\n } catch (err) {\n logError(\"AuditContainer:init\", err, notify);\n } finally {\n setLoading(false);\n }\n };\n\n const getAccounts = async () => {\n try {\n const response = await API.graphql(\n graphqlOperation(accountByActiveByName, {\n reloadYardId: window.appUser?.reloadYardId,\n activeBusinessName: { beginsWith: { active: \"true\" } },\n })\n );\n debugger;\n setAccounts(response.data.accountByActiveByName.items);\n } catch (err) {\n logError(\"AuditContainer:getAccounts\", err, notify);\n }\n };\n\n // const getInventories = async (idx, audit) => {\n // if (!isComponentMounted) return;\n // debugger;\n // try {\n // if (idx >= audit.locations.length) {\n // setInventories([]);\n // processNextItems(audit);\n // } else {\n // const input = {\n // reloadYardId: window.appUser.reloadYardId,\n // statusLocationIdAccountId: {\n // beginsWith: {\n // status: InventoryStatus.STORED,\n // locationId: audit.locations[idx]\n // }},\n // };\n // if (audit.accountId) {\n // input.statusLocationIdAccountId.beginsWith = {\n // status: InventoryStatus.STORED,\n // locationId: audit.locations[idx],\n // accountId: audit.accountId\n // }\n // }\n\n // const response = await API.graphql(graphqlOperation(inventoryByStatusByLocationIdByAccountId, input));\n // const data = response.data.inventoryByStatusByLocationIdByAccountId;\n\n // debugger\n // if (data.items.length > 0) {\n // setInventories(data.items);\n // if (!audit) audit = currentAudit;\n // audit.processedLocations[audit.locations[idx]] = {\n // total: data.items.length,\n // completed: getCompletedItemsCount(data.items, audit)\n // }\n // } else {\n // setInventories([]);\n // processNextItems(audit);\n // }\n // }\n // } catch (err) {\n // logError(\"audit:AuditContainer:getInventories\", err, notify);\n // }\n // }\n\n const computeCompleted = (audit) => {\n let completedCount = 0;\n Object.keys(audit.processedLocations).forEach((key) => {\n if (\n audit.processedLocations[key].completed ===\n audit.processedLocations[key].total\n )\n completedCount++;\n });\n setCompletedLocations(completedCount);\n return completedCount;\n };\n\n const isCompleted = (audit) => {\n debugger;\n if (!audit) audit = currentAudit;\n const processedLocations = Object.keys(audit.processedLocations);\n if (\n processedLocations &&\n locations.length !== Object.keys(audit.processedLocations).length\n )\n return false;\n let completed = true;\n Object.keys(audit.processedLocations).forEach((key) => {\n const itm = audit.processedLocations[key];\n if (itm.completed !== itm.total) completed = itm.false;\n });\n return completed;\n };\n\n const getCompletedItemsCount = (items, audit) => {\n debugger;\n let count = 0;\n items.forEach((itm) => {\n count =\n audit.processedItems.findIndex(\n (processedItm) => processedItm.id === itm.id\n ) === -1\n ? count\n : count + 1;\n });\n return count;\n };\n\n const processNextItems = (audit) => {\n debugger;\n const completedCount = computeCompleted(audit);\n if (completedCount === audit.locations.length) {\n // XXXX changed from locations.length since it was not yet populated\n debugger;\n setCompletedFlag(true);\n } else {\n debugger;\n setLocationMode(true);\n }\n };\n\n const setCurrentAuditData = (audit) => {\n debugger;\n if (typeof audit.processedItems === \"string\") {\n audit.processedItems = !audit.processedItems\n ? []\n : JSON.parse(audit.processedItems);\n }\n if (typeof audit.skippedItems === \"string\") {\n audit.skippedItems = !audit.skippedItems\n ? []\n : JSON.parse(audit.skippedItems);\n }\n if (typeof audit.processedLocations === \"string\") {\n audit.processedLocations = !audit.processedLocations\n ? {}\n : JSON.parse(audit.processedLocations);\n }\n return audit;\n };\n\n const setNextItems = async (audit) => {\n if (loading) return;\n debugger;\n let response = await API.graphql(\n graphqlOperation(getAuditNextItems, {\n id: audit.id,\n })\n );\n const nextItems = response.data.getAudit.nextItems;\n if (response.data.getAudit.processedItems) {\n const processedItems = JSON.parse(response.data.getAudit.processedItems);\n Object.keys(processedItems).forEach((k) => {\n if (!audit.processedItems[k])\n audit.processedItems[k] = processedItems[k];\n });\n }\n const idx = audit.nextItems.findIndex(\n (itm) => itm.owner === window.appUser?.fullName\n );\n audit.nextItems = nextItems.map((itm) =>\n itm.owner !== window.appUser?.fullName ? itm : audit.nextItems[idx]\n );\n };\n\n const saveAuditData = async (audit, inventoryItem) => {\n try {\n await setNextItems(audit);\n if (!audit.startDateTime) {\n audit.startDateTime = new Date();\n }\n const updatedAudit = await saveAudit(audit);\n setCurrentAudit(setCurrentAuditData(updatedAudit));\n if (inventoryItem) {\n const toUpdateInventory = { ...inventoryItem };\n delete toUpdateInventory.location;\n delete toUpdateInventory.account;\n delete toUpdateInventory.product;\n delete toUpdateInventory.createdAt;\n delete toUpdateInventory.updatedAt;\n\n toUpdateInventory.auditId = updatedAudit.id;\n const response = await API.graphql(\n graphqlOperation(updateAuditInventorie, { input: toUpdateInventory })\n );\n const newInventory = response.data.updateAuditInventorie;\n setInventories(\n inventories.map((itm) =>\n itm.id === newInventory ? newInventory : itm\n )\n );\n debugger;\n }\n } catch (err) {\n logError(\"AuditContainer:saveAuditData\", err, notify, redirect);\n }\n };\n\n const handleCompletedLocation = (inventoryItem) => {\n debugger;\n currentAudit.processedLocations[inventoryItem.location.id].completed++;\n };\n\n const handleComplete = async (inventoryItem) => {\n const processedItmIdx = currentAudit.processedItems.findIndex(\n (itm) => itm.id === inventoryItem.id\n );\n if (processedItmIdx === -1) {\n currentAudit.processedItems = [\n ...currentAudit.processedItems,\n inventoryItem,\n ];\n handleCompletedLocation(inventoryItem);\n }\n const completedCount = computeCompleted(currentAudit);\n currentAudit.skippedItems = currentAudit.skippedItems.filter(\n (skipped) => skipped.id !== inventoryItem.id\n );\n debugger;\n let newInventories;\n\n if (inventoryItem.location.id !== locations[getNextItem(currentAudit)])\n newInventories = inventories.filter((itm) => itm.id !== inventoryItem.id);\n else\n newInventories = inventories.map((itm) =>\n itm.id === inventoryItem.id ? inventoryItem : itm\n );\n\n setCurrentAudit({ ...currentAudit });\n await saveAuditData(currentAudit, inventoryItem);\n if (completedCount === locations.length) {\n debugger;\n setCompletedFlag(true);\n } else {\n setInventories(newInventories);\n }\n };\n\n const handleSkip = async (inventoryItem) => {\n debugger;\n const skippedItmIdx = currentAudit.skippedItems.findIndex(\n (itm) => itm.id === inventoryItem.id\n );\n if (skippedItmIdx === -1) {\n currentAudit.skippedItems = [...currentAudit.skippedItems, inventoryItem];\n }\n // setInventories(remainingInventories);\n saveAuditData(currentAudit);\n const remainingInventories = inventories.filter(\n (item) => !currentAudit.skippedItems?.includes(item)\n );\n if (remainingInventories.length === 0) {\n let nextItem = getNextItem(currentAudit);\n setNextItem(currentAudit, nextItem + 1);\n const updatedAudit = { ...currentAudit };\n setCurrentAudit(updatedAudit);\n // await getInventories(nextItem + 1, updatedAudit);\n }\n };\n\n const handleAddSkipped = (inventoryItem) => {\n setInventories([inventoryItem, ...inventories]);\n };\n\n const handleBack = async () => {\n debugger;\n let nextItem = getNextItem(currentAudit);\n // await getInventories(nextItem - 1, currentAudit);\n setNextItem(currentAudit, nextItem - 1);\n await setNextItems(currentAudit);\n setCurrentAudit({ ...currentAudit });\n debugger;\n };\n\n const handleLocation = async (idx) => {\n debugger;\n // await getInventories(idx, currentAudit);\n setNextItem(currentAudit, idx);\n setCurrentAudit({ ...currentAudit });\n setLocationMode(false);\n };\n\n const handleNext = async () => {\n let nextItem = getNextItem(currentAudit);\n setNextItem(currentAudit, nextItem + 1);\n // nextItem < locations.length && await getInventories(nextItem + 1, currentAudit);\n };\n\n const finishAudit = async (audit) => {\n if (!isCompleted()) return;\n try {\n debugger;\n const updatedAudit = {\n ...audit,\n status: AuditStatus.PENDING_REVIEW,\n endDateTime: new Date(),\n };\n await saveAudit(updatedAudit);\n setInventories([]);\n setCompletedFlag(false);\n returnToAudit(false);\n } catch (err) {\n logError(\"AuditContainer:finishAudit\", err, notify, redirect);\n }\n };\n\n const returnToAudit = async (saveFlag = true) => {\n if (saveFlag) {\n saveAuditData(currentAudit);\n }\n debugger;\n history.push(\"/processAudit\");\n };\n\n const returnList = () => {\n debugger;\n setLocationMode(false);\n };\n\n return loading ? (\n\n
\n ) : invalidIdError ? (\n - \n {audits.map((audit, idx) => {\n return (\n
\n \n handleSelect(audit)}>\n \n \n \n \n \n {audit.accountName} \n \n {audit.assignedTo}\n \n \n }\n secondary={format(\n new Date(audit.createDateTime),\n \"MM/dd/yyyy hh:mm a\"\n )}\n />\n \n handleSelect(audit)}\n >\n \n \n \n {idx < audits.length - 1 ?
\n );\n })}\n \n {logoURL && (\n
\n );\n};\n\nexport const InfoBlock = ({ record }) => {\n const outboundCustomFields = (\n record?.account?.outboundCustomFields || []\n ).filter((field) => field.display.includes(CustomFieldsDisplay.POS));\n\n return (\n \n
\n )}\n \n
\n \n
\n \n OUTBOUND MANIFEST \n
\n\n \n
\n \n
\n \n
\n {getCustomFieldsTable(outboundCustomFields, record.customFields)}\n
\n );\n};\n\nconst LineItemsBlock = ({ record, posPickList }) => {\n const inventoryCustomFields = (\n record?.account?.inventoryCustomFields || []\n ).filter((field) => field.display.includes(CustomFieldsDisplay.POS));\n const showProductCodeColumn = record.shipmentLineItems.items.some(\n (lineItem) =>\n lineItem.inventory.productCode && lineItem.inventory.productCode.trim()\n );\n\n return (\n \n \n
\n
\n );\n};\n\nconst TotalsBlock = ({ record, posPickList }) => {\n // PCS Totals and Flags\n let totalPCS = 0;\n let allMissingPCS = true;\n let somePCSNull = false;\n\n posPickList.forEach((lineItem) => {\n // PCS Calculation\n if (lineItem.inventory.pcs == null) {\n somePCSNull = true;\n } else {\n allMissingPCS = false;\n if (record.totalUnits === Unit.UNIT) {\n totalPCS += lineItem.inventory.pcs * lineItem.totalQuantityToPick;\n } else {\n totalPCS += lineItem.inventory.pcs;\n }\n }\n });\n\n return (\n \n INVENTORY SHIPPED \n
\n\n \n
\n
\n );\n};\n\nexport const AttachmentsBlock = ({ record }) => {\n const attachments =\n record.attachments?.length > 0 ? record.attachments : null;\n const bol = record.bolFile;\n\n if (!attachments && !bol) return <>;\n return (\n \n \n
\n
\n );\n};\n\nexport const PhotosBlock = ({ record }) => {\n const rowSize = 3;\n const photosRows = [];\n const photos = record.photos ? record.photos : [];\n for (var i = 0; i < photos.length; i += rowSize) {\n photosRows.push(photos.slice(i, i + rowSize));\n }\n\n return (\n \n
\n \n \n
\n
\n );\n};\n\nexport const SealsBlock = ({ record }) => {\n const showSeals = record?.account?.trackOutboundSeals;\n if (!showSeals) return null;\n\n const sealBarCodes = record.seals?.items?.map((seal) => seal.barcode) || [];\n\n const renderSeals = () => {\n if (sealBarCodes.length === 0) {\n return (\n \n
\n \n \n
\n
\n );\n};\n\nexport const NotesBlock = ({ record }) => {\n const filteredNotes = record.notes?.filter((note) => note.public);\n if (!filteredNotes || filteredNotes?.length === 0) return null;\n\n return (\n \n SEALS\n
\n\n \n
\n
\n );\n};\n\nexport const OutboundPOSBody = ({ record, enclosePhotos, encloseDocs }) => {\n const posPickList = record.shipmentLineItems.items.map((lineItem) => {\n return {\n ...lineItem,\n inventory: {\n ...lineItem.inventory,\n pcs:\n lineItem.inventory.pcs != null\n ? lineItem.inventory.pcs\n : lineItem.inventory.product?.pcs,\n },\n };\n });\n\n return (\n \n NOTES \n
\n\n \n
\n
\n );\n};\n\nconst TotalsBlock = ({ record, posPickList }) => {\n // PCS Totals and Flags\n let totalPCS = 0;\n let allMissingPCS = true;\n let somePCSNull = false;\n\n // MBF Totals and Flags\n let totalMBF = 0;\n let allMissingMBF = true;\n let someMBFNull = false;\n\n // SF Totals and Flags\n let totalSF = 0;\n let allMissingSF = true;\n let someSFNull = false;\n\n posPickList.forEach((lineItem) => {\n // PCS Calculation\n if (lineItem.inventory.pcs == null) {\n somePCSNull = true;\n } else {\n allMissingPCS = false;\n if (record.totalUnits === Unit.UNIT) {\n totalPCS += lineItem.inventory.pcs * lineItem.totalQuantityToPick;\n } else {\n totalPCS += lineItem.inventory.pcs;\n }\n }\n\n // Footage Calculations\n if (lineItem.inventory.footageUOM === Unit.MBF) {\n if (lineItem.inventory.footage == null) {\n someMBFNull = true;\n } else {\n allMissingMBF = false;\n totalMBF += lineItem.inventory.footage * lineItem.totalQuantityToPick;\n }\n } else if (lineItem.inventory.footageUOM === Unit.SF) {\n if (lineItem.inventory.footage == null) {\n someSFNull = true;\n } else {\n allMissingSF = false;\n totalSF += lineItem.inventory.footage * lineItem.totalQuantityToPick;\n }\n }\n });\n\n return (\n \n INVENTORY SHIPPED \n
\n\n \n
\n
\n );\n};\n\nexport const LumberPOSBody = ({ record, enclosePhotos, encloseDocs }) => {\n const posPickList = record.shipmentLineItems.items.map((lineItem) => {\n const loadType =\n lineItem.inventory?.reloadYardCommodityId || record.reloadYardCommodityId;\n\n let footage = null;\n let footageUOM = \"\";\n\n if (isLumberCommodity(loadType)) {\n footage = calculateMbf(lineItem.inventory);\n footageUOM = Unit.MBF;\n } else if (isPanelsCommodity(loadType)) {\n footage = calculateSqf(lineItem.inventory);\n footageUOM = Unit.SF;\n }\n\n return {\n ...lineItem,\n inventory: {\n ...lineItem.inventory,\n pcs:\n lineItem.inventory.pcs != null\n ? lineItem.inventory.pcs\n : lineItem.inventory.product?.pcs,\n footage,\n footageUOM,\n },\n };\n });\n\n return (\n \n
\n );\n};\n\nexport const ShipmentItemCreateActionButtons = (props) => {\n const classes = useStyles();\n\n return (\n \n
\n );\n};\n\nconst RemoveInventoryButton = ({\n record,\n inventories,\n setInventories,\n ...props\n}) => {\n const handleDelete = () => {\n const newInventories = inventories.items.filter(\n (itm) => itm.sortKey !== record.sortKey\n );\n setInventories(newInventories);\n };\n\n return (\n \n handleReorder(index, index - 1)}\n >\n = max - 1}\n onClick={() => handleReorder(index, index + 1)}\n >\n
\n );\n};\n\nconst RemoveItemButton = ({\n rowIndex,\n record,\n inventories,\n setInventories,\n ...props\n}) => {\n const handleLocationRemove = (event) => {\n const newInventories = [];\n\n inventories.items.forEach((inv) => {\n if (inv.inventoryId === record.inventoryId) {\n const newInventoryItems = inv.inventoryItems.items.filter(\n (_, locIndex) => locIndex !== rowIndex\n );\n const newTotal = newInventoryItems.reduce(\n (total, loc) => total + loc.quantityToPick,\n 0\n );\n if (newTotal !== 0)\n newInventories.push({\n ...inv,\n totalQuantityToPick: newTotal,\n inventoryItems: { items: newInventoryItems },\n });\n } else {\n newInventories.push(inv);\n }\n });\n setInventories(newInventories);\n };\n\n return (\n \n );\n};\n\nexport const InventoryItemsEditGridInput = ({\n record,\n inventories,\n setInventories,\n ...props\n}) => {\n return record.status === ShipmentLineItemStatus.NEW ? (\n - \n {currentInventory.inventoryItems?.items.map((itm, idx) => (\n
\n handleOpenInventoryItem(itm)}>\n \n \n {getIcon(itm)}\n \n \n \n handleOpenInventoryItem(itm)}\n >\n \n \n {idx < currentInventory.inventoryItems.items.length - 1 ? (\n
\n ))}\n \n \n {`Bay ${\n (bayIdx + 1 < 10 ? \" 0\" : \" \") + (bayIdx + 1)\n }`} \n \n
\n ))}\n \n \n {level.map((location) => (\n
\n ))}\n \n setTerm(evt.target.value)}\n value={term}\n placeholder=\"Search\"\n className={isSmall ? classes.searchFieldMobile : classes.searchField}\n onKeyDown={handleSubmit}\n InputProps={{\n endAdornment: (\n \n \n \n \n ),\n }}\n />\n {isSmall ? (\n \n
\n );\n};\n\nexport default SearchInput;\n","import React, { useEffect, useState } from \"react\";\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport { searchOutboundShipmentsDropDown } from \"../../../graphql/outbound/custom-queries\";\nimport { getLocation } from \"../../../graphql/queries\";\n\nimport {\n Button,\n Grid,\n TextField,\n MenuItem,\n InputAdornment,\n} from \"@material-ui/core\";\nimport SaveAltOutlinedIcon from \"@material-ui/icons/SaveAltOutlined\";\n\nimport { useNotify } from \"react-admin\";\n\nimport {\n AclType,\n CarrierType,\n InventoryStatus,\n OutboundStatus,\n originDamageList,\n} from \"../../../utils/constants\";\nimport { isAuthorized, logError } from \"../../../utils/appUtils\";\nimport {\n getLocationFullName,\n isTruckToRail,\n} from \"../../../utils/locationUtils\";\nimport { useInboundContext } from \"./context\";\n\nexport const TrackAisleControl = ({ handleSave, classes }) => {\n const { state, dispatch } = useInboundContext();\n const {\n currentInventory,\n selectedInventoryItem,\n selectedOutbound,\n currentShipment,\n disableSelection,\n } = state;\n const [outbounds, setOutbounds] = useState([]);\n const notify = useNotify();\n\n useEffect(() => {\n debugger;\n dispatch({\n type: \"SET_SELECTED_INVENTORY_ITEM\",\n payload: selectedInventoryItem,\n });\n }, []);\n\n useEffect(() => {\n if (isTruckToRail(currentInventory.areaId, currentShipment)) {\n getOutboundData();\n }\n }, [currentInventory, currentShipment]);\n\n const getOutboundData = async () => {\n debugger;\n try {\n const searchInput = {\n filter: {\n carrierType: { eq: CarrierType.RAIL },\n isCollected: { eq: false },\n trackId: { gte: \"\" },\n status: { ne: OutboundStatus.RELEASED },\n },\n limit: 1000,\n };\n let response = await API.graphql(\n graphqlOperation(searchOutboundShipmentsDropDown, searchInput)\n );\n const outbounds = response.data.searchOutboundShipments.items;\n setOutbounds(outbounds);\n if (selectedInventoryItem.outboundShipmentId) {\n const outbound = outbounds.find(\n (itm) => itm.id === selectedInventoryItem.outboundShipmentId\n );\n dispatch({ type: \"SET_SELECTED_OUTBOUND\", payload: outbound });\n }\n } catch (err) {\n logError(\n \"processInboundShipments:TrackAisleControl:getOutbounds\",\n err,\n notify\n );\n }\n };\n\n const setQuantity = (value) => {\n if (!value) value = 0;\n const quantity = Number(value);\n selectedInventoryItem.quantityOnHand = quantity;\n\n // const newInventoryItem = {...selectedInventoryItem, quantityOnHand: quantity};\n dispatch({\n type: \"SET_SELECTED_INVENTORY_ITEM\",\n payload: selectedInventoryItem,\n });\n };\n\n const doHandleSave = async () => {\n await handleSave();\n // handleClose();\n };\n\n const handleKeyDown = (event) => {\n const key = event.key;\n const keyCode = event.keyCode || event.which; // Handle different browser behaviors\n // Allow digits, backspace (8), and delete (46)\n if (!/^\\d$/.test(key) && keyCode !== 8 && keyCode !== 46) {\n event.preventDefault();\n return;\n }\n };\n\n const getQuantity = () => {\n return selectedInventoryItem?.quantityOnHand\n ? selectedInventoryItem.quantityOnHand\n : \"\";\n };\n\n const isSaveButtonDisabled = () => {\n if (!selectedInventoryItem?.quantityOnHand) return true;\n if (\n !isAuthorized(AclType.ASSIGN_LOCATION) &&\n selectedInventoryItem.status !== InventoryStatus.IN_TRANSIT\n ) {\n return true;\n }\n return false;\n };\n\n const isQuantityDisabled = () => {\n if (!isAuthorized(AclType.ASSIGN_LOCATION)) {\n return true;\n }\n return false;\n };\n\n const setIsDamaged = (value) => {\n debugger;\n const inventoryItem = selectedInventoryItem\n ? { ...selectedInventoryItem }\n : {};\n if (value) {\n inventoryItem.isDamaged = true;\n inventoryItem.originOfDamage = value;\n inventoryItem.hasException = true;\n } else {\n inventoryItem.isDamaged = false;\n inventoryItem.originOfDamage = \"\";\n inventoryItem.hasException = false;\n }\n dispatch({ type: \"SET_SELECTED_INVENTORY_ITEM\", payload: inventoryItem });\n };\n\n const handleOutboundChange = async (outboundShipmentId) => {\n debugger;\n const outbound = outbounds.find((itm) => itm.id === outboundShipmentId);\n dispatch({ type: \"SET_SELECTED_OUTBOUND\", payload: outbound });\n const location = await getOutboundLocation(outbound);\n const newInventoryItem = { ...selectedInventoryItem, outboundShipmentId };\n newInventoryItem.inventoryId = currentInventory.id;\n newInventoryItem.areaId = location.areaId;\n newInventoryItem.zoneId = location.zoneId;\n newInventoryItem.aisleId = location.aisleId;\n newInventoryItem.locationId = location.id;\n newInventoryItem.location = location;\n newInventoryItem.locationFullName = getLocationFullName(location);\n dispatch({\n type: \"SET_SELECTED_INVENTORY_ITEM\",\n payload: newInventoryItem,\n });\n };\n\n const getOutboundLocation = async (outboundShipment) => {\n try {\n const response = await API.graphql(\n graphqlOperation(getLocation, { id: outboundShipment.trackId })\n );\n const location = response.data.getLocation;\n return location;\n } catch (err) {\n logError(\n \"processInboundShipments:TrackAisleControl:getOutboundLocation\",\n err,\n notify\n );\n }\n };\n\n return (\n \n {processedCars.map((itm, idx) => (\n drag(evt, idx)}\n onDragOver={(evt) => allowDrop(evt, idx)}\n onDrop={(evt) => drop(evt, idx)}\n >\n openShipment(itm)}\n >\n {getShipmentIcon(itm)}\n {`${idx + 1}.`} {`${itm.railCarNumber}`}\n \n \n {canDelete(itm) && (\n handleDeleteConfirm(idx)}>\n \n )}\n removeFromTrack(idx)}>\n \n {isXSmall ? (\n addItem(idx)}>\n \n ) : (\n \n \n )}\n \n
\n ))}\n \n \n \n \n handleTrackChange(evt.target.value)}\n >\n {tracks.map((track) => (\n \n ))}\n \n \n \n \n setSelectedShipment(evt.target.value)}\n >\n {newCars.map((shipment) => (\n \n ))}\n \n \n \n \n addItem(-1)}\n disabled={!canAdd}\n startIcon={ \n \n
\n );\n};\n\nconst useStylesLegend = makeStyles((theme) => ({\n greenIcon: {\n color: green[600],\n },\n redIcon: {\n color: red[600],\n },\n greyIcon: {\n color: grey[600],\n },\n whiteIcon: {\n color: grey[100],\n },\n greenCircle: {\n color: green[600],\n width: theme.spacing(3),\n height: theme.spacing(3),\n },\n redCircle: {\n color: red[600],\n width: theme.spacing(3),\n height: theme.spacing(3),\n },\n greyCircle: {\n color: grey[600],\n width: theme.spacing(3),\n height: theme.spacing(3),\n },\n whiteCircle: {\n color: grey[100],\n width: theme.spacing(3),\n height: theme.spacing(3),\n },\n legendContainer: {\n display: \"flex\",\n justifyContent: \"flex-end\",\n marginTop: theme.spacing(1),\n },\n legendContainerMobile: {\n display: \"flex\",\n justifyContent: \"center\",\n },\n legendBox: {\n display: \"flex\",\n alignItems: \"center\",\n marginRight: theme.spacing(2),\n fontSize: 12,\n },\n}));\n\nexport const TrackLegend = ({ selectedTrack }) => {\n const classes = useStylesLegend();\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"sm\"));\n\n return (\n \n \n {getShipmentIcon(itm)}\n {`${idx + 1}.`} {`${itm.railCarNumber}`}\n \n
\n );\n };\n\n return (\n \n {processedCars.map((itm, idx) => getTrackLocationContent(itm, idx))}\n
\n \n {bay.map((level, idx) => (\n
\n ))}\n \n \n {level.map((location) => {\n return (\n
\n ))}\n \n refreshFn(false) : handleCancel\n }\n >\n \n \n \n \n \n \n \n \n Lot number: {currentInventory.lotNumber}\n \n \n \n \n PO number: {currentInventory.poNumber}\n \n \n \n {`Area: ${currentShipment?.area?.name}`} \n \n \n \n Zone: \n \n {currentShipment?.zone?.name}\n \n \n \n {currentInventory.productCode && (\n \n \n Product code: {currentInventory.productCode}\n \n \n )}\n {currentInventory.customFields && (\n \n \n )}\n \n \n \n \n toggleChecked(\n currentInventory.verificationRequired === \"true\"\n ? \"false\"\n : \"true\"\n )\n }\n disabled={currentInventory.hasException}\n />\n }\n label={isXSmall ? \"Approval\" : \"Request approval\"}\n />\n \n \n \n setIsExceptionDialogOpen(true)}\n startIcon={\n currentInventory.hasException ? \n \n \n \n \n \n \n {\n setNote(evt.target.value)}\n />\n \n \n \n\n \n \n \n {getRightButtonText()}\n \n \n \n )}\n {isExceptionDialogOpen && (\n \n )}\n \n
\n );\n};\n\nconst ExceptionDialog = ({\n currentShipment,\n currentInventory,\n handleSaveExceptions,\n isExceptionDialogOpen,\n setIsExceptionDialogOpen,\n classes,\n}) => {\n const [inventory] = useState({ ...currentInventory });\n const [overShipment, setOverShipment] = useState(inventory.overShipment);\n const [overShipmentNote, setOverShipmentNote] = useState(\n inventory.overShipmentNote\n );\n const [underShipment, setUnderShipment] = useState(inventory.underShipment);\n const [underShipmentNote, setUnderShipmentNote] = useState(\n inventory.underShipmentNote\n );\n const [otherException, setOtherException] = useState(\n inventory.otherException\n );\n const [otherExceptionNote, setOtherExceptionNote] = useState(\n inventory.otherExceptionNote\n );\n const [otherExceptionNoteError, setOtherExceptionNoteError] = useState();\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"sm\"));\n\n const handleSave = () => {\n if (!validate()) return;\n debugger;\n inventory.overShipment = overShipment;\n inventory.underShipment = underShipment;\n inventory.otherException = otherException;\n inventory.overShipmentNote = overShipmentNote;\n inventory.underShipmentNote = underShipmentNote;\n inventory.otherExceptionNote = otherExceptionNote;\n if (!overShipment) inventory.overShipmentQuantity = 0;\n if (!underShipment) inventory.underShipmentQuantity = 0;\n if (\n inventory.overShipment ||\n inventory.underShipment ||\n inventory.otherException\n ) {\n inventory.hasException = true;\n } else {\n inventory.hasException = false;\n }\n handleSaveExceptions(inventory);\n setIsExceptionDialogOpen(false);\n };\n\n const validate = () => {\n clear();\n let isValid = true;\n if (otherException) {\n isValid = isValid && otherExceptionNote;\n !otherExceptionNote &&\n setOtherExceptionNoteError(\"A note is required for other exceptions\");\n }\n return isValid;\n };\n\n const handleChange = (evt) => {\n const type = evt.target.name;\n const value = evt.target.checked;\n debugger;\n if (type === \"overShipment\") {\n setOverShipment(value);\n if (value) {\n setUnderShipment(!value);\n setUnderShipmentNote(\"\");\n } else {\n setOverShipmentNote(\"\");\n }\n } else if (type === \"underShipment\") {\n setUnderShipment(value);\n if (value) {\n setOverShipment(!value);\n setOverShipmentNote(\"\");\n } else {\n setUnderShipmentNote(\"\");\n }\n } else {\n setOtherException(value);\n if (!value) {\n setOtherExceptionNote(\"\");\n setOtherExceptionNoteError(\"\");\n }\n }\n };\n\n const clear = () => {\n setOtherExceptionNoteError(\"\");\n };\n\n return (\n {currentShipment.railCarNumber}
\n ) : (\n ` - ${currentShipment.railCarNumber}`\n )}\n \n Overshipment \n setOverShipmentNote(evt.target.value)}\n />\n
\n )}\n {underShipment && (\n \n Undershipment \n setUnderShipmentNote(evt.target.value)}\n />\n
\n )}\n {otherException && (\n \n Other \n setOtherExceptionNote(evt.target.value)}\n />\n
\n )}\n - \n {checklistItems &&\n getFilteredChecklistItems().map((itm) => (\n
\n \n \n \n {validated ? \n \n \n onDeleteSeal({ id, barcode })}>\n \n \n \n {idx < sealsList.length - 1 ?
\n );\n };\n\n return (\n <>\n \n - \n
- \n {\" \"}\n Preapare a Manifest spreadsheet with columns and values for all\n required Tally Sheet fields.{\" \"}\n \n
- \n {\" \"}\n If Manifest includes PO Number entries, only rows with a PO Number\n matching that of the Inbound Shipment will be imported.{\" \"}\n \n
- \n {\" \"}\n Save as a comma-seperated-values (.CSV) file and upload here{\" \"}\n \n
- \n {\" \"}\n If errors are found, review, correct the errors and re-upload{\" \"}\n \n
- For help, contact us at 877-TRANSLOAD / 877-872-6756 \n
Drop a CSV File to\n upload, or click to select it.\n \n }\n accept=\".csv\"\n onChange={handleCSVFile}\n helperText={false}\n >\n
- \n {csvErrors.map((error) => (\n
- {error} {\" \"}\n
\n {logoURL && (\n
\n );\n};\n\nexport const InfoBlock = ({ record }) => {\n const inboundCustomFields = (\n record?.account?.inboundCustomFields || []\n ).filter((field) => field.display.includes(CustomFieldsDisplay.POD));\n\n return (\n \n
\n )}\n \n
\n \n
\n \n INBOUND MANIFEST \n
\n\n \n
\n \n
\n {getCustomFieldsTable(inboundCustomFields, record.customFields)}\n
\n );\n};\n\nconst LineItemsBlock = ({ record, podInventories }) => {\n const inventoryCustomFields = (\n record?.account?.inventoryCustomFields || []\n ).filter((field) => field.display.includes(CustomFieldsDisplay.POD));\n const showProductCodeColumn = record.inventories.items.some(\n (lineItem) => lineItem.productCode && lineItem.productCode.trim()\n );\n const showPCSColumn = podInventories.some((lineItem) => lineItem.pcs != null);\n const pcsColumnName = record.totalUnits === Unit.UNIT ? \"PPU\" : \"Pieces\";\n\n return (\n \n \n
\n
\n );\n};\n\nconst TotalsBlock = ({ record, podInventories }) => {\n // PCS Totals and Flags\n let totalPCS = 0;\n let allMissingPCS = true;\n let somePCSNull = false;\n\n podInventories.forEach((lineItem) => {\n // PCS Calculation\n if (lineItem.pcs == null) {\n somePCSNull = true;\n } else {\n allMissingPCS = false;\n if (record.totalUnits === Unit.UNIT) {\n totalPCS += lineItem.pcs * lineItem.quantityDelivered;\n } else {\n totalPCS += lineItem.pcs;\n }\n }\n });\n\n return (\n \n INVENTORY RECEIVED \n
\n\n \n
\n
\n );\n};\n\nexport const AttachmentsBlock = ({ record }) => {\n const attachments =\n record.attachments?.length > 0 ? record.attachments : null;\n const receipt = record.receiptFile;\n\n if (!attachments && !receipt) return <>;\n return (\n \n \n
\n
\n );\n};\n\nexport const PhotosBlock = ({ record }) => {\n const rowSize = 3;\n const photosRows = [];\n const photos = record.photos ? record.photos : [];\n for (var i = 0; i < photos.length; i += rowSize) {\n photosRows.push(photos.slice(i, i + rowSize));\n }\n\n return (\n \n
\n \n \n
\n
\n );\n};\n\nexport const SealsBlock = ({ record }) => {\n const showSeals =\n record?.account?.trackInboundSeals || record.seals?.items?.length > 0;\n if (!showSeals) return null;\n\n const sealBarCodes = record.seals?.items?.map((seal) => seal.barcode) || [];\n\n const renderSeals = () => {\n if (sealBarCodes.length === 0) {\n return (\n \n
\n \n \n
\n
\n );\n};\n\nexport const NotesBlock = ({ record }) => {\n const filteredNotes = record.notes?.filter((note) => note.public);\n if (!filteredNotes || filteredNotes?.length === 0) return null;\n\n return (\n \n SEALS\n
\n\n \n
\n
\n );\n};\n\nexport const InboundPODBody = ({\n record,\n enclosePhotos,\n encloseAttachments,\n}) => {\n const podInventories = record.inventories.items.map((lineItem) => {\n return {\n ...lineItem,\n pcs: lineItem.pcs != null ? lineItem.pcs : lineItem.product?.pcs,\n };\n });\n\n return (\n \n NOTES \n
\n\n \n
\n
\n );\n};\n\nconst TotalsBlock = ({ record, podInventories }) => {\n // PCS Totals and Flags\n let totalPCS = 0;\n let allMissingPCS = true;\n let somePCSNull = false;\n\n // MBF Totals and Flags\n let totalMBF = 0;\n let allMissingMBF = true;\n let someMBFNull = false;\n\n // SF Totals and Flags\n let totalSF = 0;\n let allMissingSF = true;\n let someSFNull = false;\n\n podInventories.forEach((lineItem) => {\n // PCS Calculation\n if (lineItem.pcs == null) {\n somePCSNull = true;\n } else {\n allMissingPCS = false;\n if (record.totalUnits === Unit.UNIT) {\n totalPCS += lineItem.pcs * lineItem.quantityDelivered;\n } else {\n totalPCS += lineItem.pcs;\n }\n }\n\n // Board Footage Calculations\n if (lineItem.footageUOM === Unit.MBF) {\n if (lineItem.footage == null) {\n someMBFNull = true;\n } else {\n allMissingMBF = false;\n totalMBF += lineItem.footage * lineItem.quantityDelivered;\n }\n } else if (lineItem.footageUOM === Unit.SF) {\n if (lineItem.footage == null) {\n someSFNull = true;\n } else {\n allMissingSF = false;\n totalSF += lineItem.footage * lineItem.quantityDelivered;\n }\n }\n });\n\n return (\n \n INVENTORY RECEIVED \n
\n\n \n
\n
\n );\n};\n\nexport const LumberPODBody = ({\n record,\n enclosePhotos,\n encloseAttachments,\n}) => {\n const podInventories = record.inventories.items.map((lineItem) => {\n // Determine loadType to calculate appropriate values\n const loadType =\n lineItem.reloadYardCommodityId || record.reloadYardCommodityId;\n\n let footage = null;\n let footageUOM = \"\";\n\n if (isLumberCommodity(loadType)) {\n footage = calculateMbf(lineItem);\n footageUOM = Unit.MBF;\n } else if (isPanelsCommodity(loadType)) {\n footage = calculateSqf(lineItem);\n footageUOM = Unit.SF;\n }\n\n return {\n ...lineItem,\n pcs: lineItem.pcs != null ? lineItem.pcs : lineItem.product?.pcs,\n footage,\n footageUOM,\n };\n });\n\n return (\n \n backHandler(true)}>\n \n \n \n \n {isUploadEnabled() && (\n \n \n )}\n \n \n {label} \n \n );\n })}\n \n \n \n \n Lot Number: {currentShipment.lotNumber} \n \n \n \n \n PO Number: {currentShipment.poNumber} \n \n \n {currentShipment.customFields && (\n \n \n )}\n {currentShipment.instructions && (\n \n \n Instructinos: {currentShipment.instructions}\n \n \n )}\n \n {/* */}\n {/* setIsExceptionDialogOpen(true)}\n startIcon={currentShipment.hasException ? */}\n \n toggleChecked(\n currentShipment.verificationRequired === \"true\"\n ? \"false\"\n : \"true\"\n )\n }\n />\n }\n label=\"Request approval\"\n />\n {/* */}\n {/* */}\n {isExceptionDialogOpen && (\n \n )}\n {isSealDialogOpen && (\n \n )}\n \n \n {isChecklistDialogOpen && (\n \n )}\n \n \n setShipmentNote(evt.target.value)}\n />\n {noteErrorMsg && (\n \n {currentShipment.inventories?.items.length > 0 ? (\n \n No inventories shipments found.\n \n )}\n \n \n \n handleSave(false)}\n disabled={loading}\n >\n {getLeftButtonText()}\n \n handleSave(true)}\n disabled={isCompleteDisabled()}\n color=\"primary\"\n >\n {getRightButtonText()}\n \n \n \n
\n );\n};\n\nconst InventoryList = ({\n classes,\n currentShipment,\n clonableInventoriesByProductName,\n clonableInventoriesByProductId,\n handleClone,\n match,\n history,\n disabled,\n}) => {\n const [searchInventories, setSearchInventories] = useState([]);\n const [term, setTerm] = useState(\"\");\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"xs\"));\n\n useEffect(() => {\n setSearchInventories([...currentShipment.inventories.items]);\n }, [\n currentShipment,\n clonableInventoriesByProductName,\n clonableInventoriesByProductId,\n ]);\n\n const getIcon = (inventory) => {\n if (inventory.verificationRequired === \"true\")\n return \n \n {photosErrorMsg}\n \n
\n )}\n \n \n {noteErrorMsg}\n \n
\n )}\n \n {primaryField.label} : {primaryField.value}\n \n );\n\n return
- \n {searchInventories.map((inventory, idx) => {\n return (\n
\n {disabled ? (\n {getListItem(inventory)} \n ) : (\n handleSelect(inventory)}>\n \n \n {getIcon(inventory)}\n \n \n {getListItem(inventory)}\n \n {getLisItemAction(inventory)}\n \n \n )}\n {idx < searchInventories.length - 1 ?
\n );\n })}\n {currentShipment.railCarNumber}
\n ) : (\n ` - ${currentShipment.railCarNumber}`\n )}\n \n Unsafe Shipment \n \n setNote(\"unsafeShipmentNote\", evt.target.value)\n }\n />\n
\n )}\n {currentShipment.brokenSeal && (\n \n Broken Seal \n setNote(\"brokenSealNote\", evt.target.value)}\n />\n
\n )}\n {currentShipment.otherException && (\n \n Other \n \n setNote(\"otherExceptionNote\", evt.target.value)\n }\n />\n
\n )}\n \n \n \n
\n }\n >\n - \n {visibleShipments ? (\n visibleShipments.map((shipment, idx) => {\n return (\n
\n \n \n {`Area: ${lineItemInventoryItem.inventoryItem.location.area?.name}`} \n \n \n \n Zone: \n \n {lineItemInventoryItem.inventoryItem.location.zone?.name}\n \n \n \n \n {`Aisle: ${lineItemInventoryItem.inventoryItem.location.aisle.name}`} \n \n \n \n {\n \n \n
\n \n \n }\n \n \n
\n \n \n {bayList.map((location) => (\n \n \n \n {getLocationViewName(location)}\n \n \n {\" \"}\n {location.id ===\n lineItemInventoryItem.inventoryItem.location\n .id &&\n getInventoryPrimaryField(\n currentShipment.account,\n currentLineItem.inventory,\n lineItemInventoryItem\n )?.value}\n \n
\n \n ))}\n \n \n \n \n \n \n {`Area: ${lineItemInventoryItem.inventoryItem.location.area?.name}`} \n \n {isMedium && (\n \n {\" \"}\n \n )}\n \n \n Zone: \n \n {lineItemInventoryItem.inventoryItem.location.zone?.name}\n \n \n \n {isMedium && (\n \n {\" \"}\n \n )}\n \n {`Aisle: ${lineItemInventoryItem.inventoryItem.location.aisle.name}`} \n \n\n {!isMedium && (\n \n {\" \"}\n \n )}\n \n \n {\" \"}\n {`Bay: ${lineItemInventoryItem.inventoryItem.location.bay}`}\n \n \n {isMedium && (\n \n {\" \"}\n \n )}\n \n {`Position: ${lineItemInventoryItem.inventoryItem.location.position}`} \n \n \n {`Level: ${lineItemInventoryItem.inventoryItem.location.level}`} \n \n \n {\" \"}\n \n {!isFlat && (\n \n
\n \n )}\n \n \n
\n \n \n {`Bay ${\n (bayIdx + 1 < 10 ? \" 0\" : \" \") + (bayIdx + 1)\n }`} \n \n
\n ))}\n \n \n {level.map((location) => {\n return (\n \n \n \n {getLocationViewName(location)}\n \n \n {\" \"}\n {location.id ===\n lineItemInventoryItem.inventoryItem.location\n .id &&\n getInventoryPrimaryField(\n currentShipment.account,\n currentLineItem.inventory,\n lineItemInventoryItem\n )?.value}\n \n
\n \n );\n })}\n \n \n \n // \n ,\n ]}\n showDivider={false}\n >\n \n \n \n \n \n {currentLineItem?.inventory.photos?.length > 0 && (\n \n \n \n {`Quantity: ${\n lineItemInventoryItem?.quantityToPick || \"\"\n } ${getUnitName(currentShipment?.totalUnits)}`}\n \n \n {showWeight(\n currentShipment.account,\n currentLineItem?.inventory\n ) && (\n \n \n {`Weight: ${currentLineItem?.inventory.weight} ${currentLineItem?.inventory.weightUnits}/${currentLineItem?.inventory.inventoryUnits}`}\n \n \n )}\n {currentLineItem?.inventory.poNumber && (\n \n \n {`PO Number: ${currentLineItem?.inventory.poNumber}`}\n \n \n )}\n {currentLineItem?.inventory.lotNumber && (\n \n \n {`Lot Number: ${currentLineItem?.inventory.lotNumber}`}\n \n \n )}\n {currentLineItem?.inventory.productCode && (\n \n \n {`Product code: ${currentLineItem?.inventory.productCode}`}\n \n \n )}\n {currentShipment.trackId && (\n \n \n {`Location: ${getLocationFullName(currentShipment.location)}`}\n \n \n )}\n {currentLineItem?.inventory.customFields && (\n \n \n )}\n \n \n \n {expectedBarcode !== null && !isValidBarcode && (\n \n \n {exceptionInputChoices.map((itm) => (\n \n {itm.name}\n \n ))}\n \n \n )}\n \n \n The scanned barcode: \"{barcode}\" does not match our\n records.\n
\n Click PROCEED to log this as an exception. CANCEL to try\n again.\n \n ) : (\n <>\n No barcode was scanned. Click PROCEED to log this as an\n exception. CANCEL to try again.\n \n )\n }\n onConfirm={() => handleCreateException()}\n onClose={handleExceptionDialogClose}\n />\n )}\n {isSealValidationRequired() && (\n\n setScanSealOpen(true)}\n >\n {isValidating ? \"Validate Seals\" : \"Manage Seals\"}\n \n \n )}\n {scanSealOpen && (\n \n {getLocationView()}\n \n {lineItemInventoryItem?.inventoryItem.location.aisle.type ===\n LocationType.STRUCTURED &&\n isCapacitySliderVisible(\n lineItemInventoryItem?.inventoryItem.location\n ) ? (\n \n \n ) : (\n isCapacitySliderVisible(\n lineItemInventoryItem?.inventoryItem.location\n ) && (\n \n \n \n \n )\n )}\n \n setNote(evt.target.value)}\n />\n \n {/* \n \n \n {getCardActions()}\n \n \n
\n );\n};\n\nexport default InventoryItemCard;\n","import React, { useState, useRef } from \"react\";\nimport {\n Box,\n Button,\n Typography,\n Dialog,\n DialogActions,\n DialogContent,\n TextField,\n Grid,\n CircularProgress,\n} from \"@material-ui/core\";\nimport CancelOutlinedIcon from \"@material-ui/icons/CancelOutlined\";\nimport { QrBarcodeScanner } from \"../../../../components/common/QrBarcodeScanner/QrBarcodeScanner\";\nimport { beep } from \"../../../../utils/utils\";\nimport { logError } from \"../../../../utils/appUtils\";\nimport { useNotify } from \"react-admin\";\n\nexport const SealsCreate = ({ cancel, saveSeal, saving, addedSeals }) => {\n const [isScannerOpen, setIsScannerOpen] = useState(true);\n const [sealBarCode, setSealBarCode] = useState(\"\");\n const [notes, setNotes] = useState(\"\");\n const [sealError, setSealError] = useState(\"\");\n const [isScanned, setIsScanned] = useState(false);\n const [alreadyAddedDialogOpen, setAlreadyAddedDialogOpen] = useState(false);\n const [notInSealsNumberDialogOpen, setNotInSealsNumberDialogOpen] =\n useState(false);\n const notify = useNotify();\n const ref = useRef();\n\n const save = async () => {\n try {\n if (!sealBarCode) {\n setSealError(\"Required\");\n return;\n }\n\n if (addedSeals?.includes(sealBarCode)) {\n setAlreadyAddedDialogOpen(true);\n return;\n }\n\n await saveSeal({ sealBarCode, notes, validated: true, isScanned });\n cancel();\n } catch (error) {\n logError(\"OutboundShipments:Seals:SealsCreate:save\", error, notify);\n }\n };\n\n const handleScanSuccess = (barcode) => {\n debugger;\n if (barcode !== ref.current.value) {\n beep(100, 520, 200);\n }\n setSealBarCode(barcode);\n setIsScannerOpen(false);\n setIsScanned(true);\n };\n\n const handleAlreadyAddedDialogClose = () => {\n setAlreadyAddedDialogOpen(false);\n setIsScanned(false);\n setSealBarCode(\"\");\n };\n\n const handleNotInSealsNumberDialogClose = () => {\n setNotInSealsNumberDialogOpen(false);\n setIsScanned(false);\n setSealBarCode(\"\");\n };\n\n const handleSaveAnyway = async () => {\n await saveSeal({\n sealBarCode,\n notes,\n validated: false,\n scanned: isScanned,\n });\n handleNotInSealsNumberDialogClose();\n cancel();\n };\n\n const onBarcodeInputChange = (e) => {\n if (e.target.value) {\n setSealError(\"\");\n } else {\n setSealError(\"Required\");\n }\n setSealBarCode(e.target.value);\n setIsScanned(false);\n };\n\n return (\n <>\n \n\n \n Click PROCEED to log this as an exception. CANCEL to try\n again.\n \n ) : (\n <>\n No barcode was scanned. Click PROCEED to log this as an\n exception. CANCEL to try again.\n \n )\n }\n onConfirm={() => handleCreateException()}\n onClose={handleExceptionDialogClose}\n />\n )}\n {isSealValidationRequired() && (\n
\n \n \n \n {validated ? \n \n \n onDeleteSeal({ id, barcode })}>\n \n \n \n {idx < sealsList.length - 1 ?
\n );\n };\n\n return (\n <>\n \n \n \n \n \n \n \n \n \n {!currentShipment?.skipSignature &&\n isAuthorized(AclType.OUTBOUND_SIGN) && (\n \n \n \n handleClickOpen(\"yardSignatureKey\")}\n variant=\"outlined\"\n size=\"large\"\n disabled={!isUploadEnabled()}\n endIcon={\n currentShipment.yardSignatureKey ? (\n
\n \n \n {photosErrorMsg && (\n \n {photosErrorMsg}\n \n )}\n
\n \n {\n setSignaturePad(ref);\n }}\n />\n
\n \n {invalidSigMsg} \n
\n \n \n \n \n \n Pick List\n \n \n \n \n \n setShowAll(!showAll)}\n name=\"show-loaded\"\n />\n }\n label=\"Show all\"\n />\n \n \n \n
\n );\n};\n\nconst SealsConfirmationDialog = ({ open, onClose, onConfirm }) => {\n return (\n \n );\n};\n","import React from \"react\";\nimport {\n ListItem,\n ListItemAvatar,\n ListItemText,\n Avatar,\n ListItemSecondaryAction,\n IconButton,\n Divider,\n makeStyles,\n} from \"@material-ui/core\";\nimport KeyboardArrowRightIcon from \"@material-ui/icons/KeyboardArrowRight\";\nimport CheckIcon from \"@material-ui/icons/Check\";\nimport DoubleCheckIcon from \"@material-ui/icons/DoneAll\";\nimport CloseOutlinedIcon from \"@material-ui/icons/CloseOutlined\";\nimport { useOutboundContext } from \"./context\";\nimport { Link } from \"react-router-dom\";\nimport {\n CarrierType,\n OutboundStatus,\n OutboundState,\n} from \"../../../utils/constants\";\nimport { amber, grey } from \"@material-ui/core/colors\";\n\nconst useStyles = makeStyles((theme) => ({\n amber: {\n color: theme.palette.getContrastText(amber[500]),\n backgroundColor: amber[500],\n },\n unprocessedItem: {\n color: theme.palette.getContrastText(grey[300]),\n backgroundColor: grey[300],\n },\n link: {\n color: \"inherit\",\n textDecoration: \"inherit\",\n },\n}));\n\nexport const ProcessOutboundShipmentItem = ({\n shipment,\n match,\n idx,\n searchShipments,\n}) => {\n const classes = useStyles();\n const { dispatch } = useOutboundContext();\n const secondaryText = shipment.transfer\n ? `Transfer to: ${shipment.transferToAccountName} - PO No: ${shipment.poNumber}`\n : shipment.carrierType === CarrierType.RAIL\n ? `Railcar No: ${shipment.railCarNumber} - PO No: ${shipment.poNumber}`\n : shipment.carrierType === CarrierType.TRUCK\n ? `Pickup No: ${shipment.pickupNumber} - PO No: ${shipment.poNumber}`\n : `PO No: ${shipment.poNumber}`;\n\n const getIcon = (shipment) => {\n if (shipment.status === OutboundStatus.LOADED) {\n if (shipment.state === OutboundState.COMPLETED)\n return - \n {getViewInventoryItems().map((lineItm) => {\n return (\n
\n \n handleSelect(lineItm)}>\n \n \n {getIcon(lineItm)}\n \n \n {lineItm.inventory.productName}\n }\n secondary={\n <>\n \n Location: {lineItm.inventoryItem.locationFullName}\n \n \n {getListDisplay(currentShipment, lineItm)}\n \n \n }\n />\n \n handleSelect(lineItm)}\n >\n \n \n \n
\n );\n })}\n \n \n \n
\n }\n >\n - \n {searchShipments.map((shipment, idx) => (\n
\n \n {`Bay ${\n (bayIdx + 1 < 10 ? \" 0\" : \" \") + (bayIdx + 1)\n }`} \n \n
\n ))}\n \n ))}\n \n \n {level.map((location) => {\n return (\n handleSelectLocation(location)}\n >\n \n {getFullName(location)}\n \n \n {getCapcityUsedText(location)}\n \n {searchInventoryItemsMap[location.id] && (\n
\n );\n })}\n \n \n \n }\n showDivider={false}\n >\n \n \n \n \n \n \n \n Lot number: {currentInventory.lotNumber} \n \n \n \n Lot type: {LotTypeNames[currentInventory.lotType]}\n \n \n\n \n \n Quantity onhand: {currentInventory.quantityOnHand}\n \n \n \n \n Date received:{\" \"}\n {currentInventory.deliveryDateTime &&\n currentInventory.deliveryDateTime &&\n `${format(\n new Date(currentInventory.deliveryDateTime),\n \"MM/dd/yyyy\"\n )}`}\n \n \n {currentInventory.productCode && (\n \n \n Product code: {currentInventory.productCode}\n \n \n )}\n {currentInventory.customFields && (\n \n \n )}\n {selectedArea && (\n <>\n \n \n {getRelocateText()}\n \n )}\n \n setNote(evt.target.value)}\n helperText={false}\n SelectProps={{\n native: true,\n }}\n />\n \n \n \n Notes and History \n \n \n \n \n \n\n \n {currentInventory.notes?.length > 0 && (\n \n \n )}\n \n \n {selectedInventoryItem?.history?.length > 0 && (\n \n \n )}\n \n \n \n \n \n \n \n \n \n Save\n \n \n \n \n
\n );\n};\n\nconst TabPanel = (props) => {\n const { children, value, index, ...other } = props;\n\n return (\n - \n {currentInventory.notes &&\n currentInventory.notes\n .map((note, idx) => (\n
- \n {selectedInventoryItem.history\n .map((note, idx) => (\n
\n
\n \n
\n \n
\n \n option.businessName}\n onChange={(event, newValue) =>\n setSelectedAccount(newValue, locations)\n }\n onInputChange={setAccountInputValue}\n className={classes.searchField}\n renderInput={(params) => (\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Reports \n \n \n \n {/*\n \n \n*/}\n \n \n \n \n \n \n \n \n \n \n
\n );\n};\n\nexport default Reports;\n","import React from \"react\";\nimport {\n Paper,\n Table,\n TableCell,\n TableHead,\n TableContainer,\n TableRow,\n TableBody,\n useMediaQuery,\n Box,\n Typography,\n} from \"@material-ui/core\";\nimport { getUnitName } from \"../../../utils/loadTypeUtils\";\n\nexport const LocationInventories = ({ inventoryItems }) => {\n const isSmall = useMediaQuery((theme) => theme.breakpoints.down(\"xs\"));\n\n return inventoryItems.length === 0 ? (\n \n
\n \n \n \n \n \n
\n ) : (\n \n \n {`Bay ${\n (bayIdx + 1 < 10 ? \" 0\" : \" \") + (bayIdx + 1)\n }`} \n \n {bay.map((level) => (\n
\n ))}\n \n ))}\n \n \n {level.map((location) => {\n return (\n handleSelectLocation(location)}\n >\n \n {getFullName(location)}\n \n {`${\n location.capacityUsed ? location.capacityUsed : 0\n }%`} \n
\n );\n })}\n \n
\n ) : (\n - \n
\n handleSelect(itm)}>\n \n \n \n \n \n {itm.displayName +\n (itm.category ? \" - \" + itm.category : \"\")}\n \n }\n secondary={\n \"Created \" +\n formatDistanceToNow(new Date(itm.contentDate)) +\n \" ago\"\n }\n />\n \n handleSelect(itm)}>\n \n \n \n {idx < docs.length - 1 &&
\n ))}\n \n \n
\n \n Your internet connectino is unstable. Please check your connection and\n try again.\n \n\n
\n \n );\n};\n\nexport default NetworkError;\n","import React, { useEffect, useState } from \"react\";\nimport { useHistory } from \"react-router-dom\";\nimport { keyBy } from \"lodash\";\n\nimport { API, graphqlOperation } from \"aws-amplify\";\nimport {\n areaBySortKey,\n searchInboundShipments,\n searchOutboundShipments,\n} from \"../../../graphql/queries\";\nimport { aisleByActiveByAreaBySortKeyLocations } from \"../../../graphql/reloadyard/custom-queries\";\nimport {\n updateInboundShipment,\n updateOutboundShipment,\n} from \"../../../graphql/mutations\";\n\nimport { Card, Chip, Grid, Typography } from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { blueGrey, green, grey, red } from \"@material-ui/core/colors\";\n\nimport {\n Confirm,\n FilterButton,\n ListToolbar,\n Loading,\n RefreshButton,\n Title,\n TopToolbar,\n useNotify,\n useRedirect,\n} from \"react-admin\";\n\nimport { ForceTitle } from \"../../../components/common/ForceTitle\";\nimport { SearchField } from \"../../../components/common/SearchField\";\nimport { logError } from \"../../../utils/appUtils\";\nimport {\n DeleteIcon,\n InboundIcon,\n OutboundIcon,\n SearchIcon,\n} from \"../../../components/common\";\nimport { BackButton } from \"../../../components/common/BackButton\";\nimport {\n AreaType,\n CarrierType,\n InboundState,\n InboundStatus,\n} from \"../../../utils/constants\";\nimport { getAisleFullName, sortLinkedCars } from \"../../../utils/locationUtils\";\nimport { deepRedirect, getBackPath } from \"../../../utils/utils\";\n\nconst useStyles = makeStyles((theme) => ({\n list: {\n marginRight: 0,\n },\n locationTitle: {\n marginTop: theme.spacing(2),\n marginLeft: theme.spacing(1),\n },\n trackContainer: {\n padding: theme.spacing(2),\n },\n track: {\n display: \"flex\",\n flexDirection: \"column\",\n justifyContent: \"flex-start\",\n padding: theme.spacing(2),\n minHeight: theme.spacing(12),\n minWidth: theme.spacing(25),\n border: \"1px dashed\",\n borderRadius: theme.spacing(1),\n borderColor: grey[400],\n },\n item: {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n margin: theme.spacing(0.5),\n },\n}));\n\nconst ListSearchField = ({\n setSearchTerm,\n processedCars,\n setFoundCarMap,\n ...props\n}) => {\n const handleSearch = (value) => {\n if (value) {\n const searchTerm = value?.toLowerCase() || \"\";\n debugger;\n const foundCars =\n processedCars?.filter((itm) =>\n itm.railCarNumber?.toLowerCase().includes(searchTerm)\n ) || [];\n const foundCarMap = foundCars ? keyBy(foundCars, \"id\") : {};\n setFoundCarMap(foundCarMap);\n setSearchTerm(searchTerm);\n } else setFoundCarMap({});\n };\n\n return (\n \n
\n \n Network Error\n
\n\n
\n \n \n \n
\n );\n};\n\nconst TrackGrid = ({\n loading,\n setLoading,\n processedCars,\n setProcessedCars,\n processedCarsMap,\n setProcessedCarsMap,\n outboundMap,\n foundCarMap,\n backPath,\n ...props\n}) => {\n const classes = useStyles();\n const history = useHistory();\n const notify = useNotify();\n const redirect = useRedirect();\n const [open, setOpen] = useState(false);\n const [selectedShipment, setSelectedShipment] = useState();\n const [selectedShipmentIdx, setSelectedShipmentIdx] = useState();\n const [deleteConfirmMessage, setDeleteConfirmMessage] = useState(\"\");\n const [tracks, setTracks] = useState([]);\n\n useEffect(() => {\n getTracks();\n }, []);\n\n const getTracks = async () => {\n debugger;\n try {\n let response = await API.graphql(\n graphqlOperation(areaBySortKey, {\n reloadYardId: window.appUser.reloadYardId,\n })\n );\n const areas = response.data.areaBySortKey.items.filter(\n (itm) => itm.active === \"true\" && itm.areaType === AreaType.TRACK\n );\n const area = areas[0];\n\n if (area) {\n response = await API.graphql(\n graphqlOperation(aisleByActiveByAreaBySortKeyLocations, {\n areaId: area.id,\n activeSortKey: { beginsWith: { active: \"true\" } },\n limit: 1000,\n })\n );\n let tracks = response.data.aisleByActiveByAreaBySortKey.items;\n setTracks(tracks);\n }\n } catch (err) {\n logError(\"inboundShipment:inboundTrackManagement:getTracks\", err, notify);\n }\n };\n\n const isOutbound = (shipment) => {\n return outboundMap[shipment.id] ? true : false;\n };\n\n const saveShipment = (toUpdateShipment) => {\n if (isOutbound(toUpdateShipment)) return saveOutbound(toUpdateShipment);\n else return saveInbound(toUpdateShipment);\n };\n\n const saveInbound = (toUpdateShipment) => {\n toUpdateShipment = { ...toUpdateShipment };\n delete toUpdateShipment.account;\n delete toUpdateShipment.area;\n delete toUpdateShipment.createdAt;\n delete toUpdateShipment.inventories;\n delete toUpdateShipment.invoice;\n delete toUpdateShipment.location;\n delete toUpdateShipment.reloadYardCommodity;\n delete toUpdateShipment.seals;\n delete toUpdateShipment.timeslot;\n delete toUpdateShipment.updatedAt;\n delete toUpdateShipment.zone;\n\n return API.graphql(\n graphqlOperation(updateInboundShipment, {\n input: toUpdateShipment,\n })\n );\n };\n\n const saveOutbound = (toUpdateShipment) => {\n toUpdateShipment = { ...toUpdateShipment };\n\n delete toUpdateShipment.account;\n delete toUpdateShipment.area;\n delete toUpdateShipment.createdAt;\n delete toUpdateShipment.invoice;\n delete toUpdateShipment.location;\n delete toUpdateShipment.reloadYardCommodity;\n delete toUpdateShipment.seals;\n delete toUpdateShipment.shipmentLineItems;\n delete toUpdateShipment.timeslot;\n delete toUpdateShipment.updatedAt;\n\n return API.graphql(\n graphqlOperation(updateOutboundShipment, {\n input: toUpdateShipment,\n })\n );\n };\n\n const canDelete = (itm) => itm.status === InboundStatus.RELEASED;\n\n const deleteItem = (shipment, idx) => {\n setOpen(true);\n setSelectedShipmentIdx(idx);\n setSelectedShipment(shipment);\n setDeleteConfirmMessage(\n `This will mark railcar ${shipment.railCarNumber} as collected and permanently remove it from Track Management. Proceed?`\n );\n };\n const handleDialogClose = () => setOpen(false);\n\n const handleDeleteItem = async () => {\n try {\n debugger;\n setLoading(true);\n const carsOnTrack = processedCarsMap[selectedShipment.trackId];\n const toDeleteShipment = selectedShipment;\n const promiseList = [];\n\n if (selectedShipmentIdx < carsOnTrack.length - 1) {\n const bottomCar = carsOnTrack[selectedShipmentIdx + 1];\n bottomCar.previousCar = toDeleteShipment.previousCar;\n promiseList.push(saveShipment(bottomCar));\n }\n toDeleteShipment.trackId = null;\n toDeleteShipment.previousCar = null;\n toDeleteShipment.isCollected = true;\n toDeleteShipment.collectedDateTime = new Date().toISOString();\n promiseList.push(saveShipment(toDeleteShipment));\n await Promise.all(promiseList);\n\n carsOnTrack.splice(selectedShipmentIdx, 1);\n processedCarsMap[selectedShipment.trackId] = carsOnTrack;\n setProcessedCarsMap(processedCarsMap);\n setProcessedCars(\n processedCars.filter((itm) => itm.id !== selectedShipment.id)\n );\n } catch (err) {\n logError(\n \"inboundShipment:inboundTrackManagement:deleteItem\",\n err,\n notify,\n redirect\n );\n } finally {\n setLoading(false);\n setOpen(false);\n setSelectedShipmentIdx(null);\n setSelectedShipment(null);\n }\n };\n\n const openShipment = (itm) => {\n if (outboundMap[itm.id]) {\n const toPath = `/outboundShipments/${itm.id}`;\n deepRedirect(history, toPath, props.location.pathname, backPath, {});\n } else {\n const toPath = `/inboundShipments/${itm.id}`;\n deepRedirect(history, toPath, props.location.pathname, backPath, {});\n }\n };\n\n const getShipmentColor = (itm) => {\n if (itm.status === InboundStatus.RELEASED) return red[500];\n if (itm.state === InboundState.COMPLETED) return green[500];\n return blueGrey[600];\n };\n\n const getShipmentRadius = (itm) => {\n if (outboundMap[itm.id]) return 50;\n return 2;\n };\n\n if (loading) return \n {processedCarsMap[track.locations.items[0].id]?.map(\n (shipment, idx) => {\n return (\n
\n \n {foundCarMap[shipment.id] ? \n {`${idx + 1}`} {\" \"}\n {`${shipment.railCarNumber}`}\n \n }\n draggable=\"false\"\n clickable\n icon={\n isOutbound(shipment) ? (\n
\n );\n }\n )}\n \n
\n \n 
\n
\n \n \n \n
\n \n \n \n \n \n {isMultiTenant() ? (\n \n \n \n \n \n \n
\n );\n};\n\nconst ReloadYardCard = ({ appUser, classes, ...props }) => {\n const [reloadYard] = useState(appUser?.reloadYard);\n\n if (!reloadYard) return <>;\n return (\n \n \n \n \n {summary.rolling}\n \n \n \n \n In Transit\n \n \n \n \n {summary.notified}\n \n \n \n \n Notified\n \n \n \n \n {summary.placed}\n \n \n \n \n Placed\n \n \n \n
\n \n \n \n \n {summary.pending}\n \n \n \n \n Pending\n \n \n \n \n {summary.arrived}\n \n \n \n \n Arrived\n \n \n \n \n {summary.loaded}\n \n \n \n \n Loaded\n \n \n \n
\n Note: {item.serviceNote}\n \n ) : null}\n \n
\n \n
\n
\n );\n};\n\nconst LedgerBlock = ({ record, services, ...props }) => {\n // using Grid instead of table does not require classes for text\n return (\n \n \n
\n
\n );\n};\n\nconst PrintableInvoiceBlock = ({\n record,\n services,\n encloseAttachments,\n ...props\n}) => {\n const classes = useStyles();\n\n if (!record) return null;\n return (\n \n
\n \n
\n
\n
\n
\n
\n );\n};\n\nconst ShipmentSetupTab = ({ gteMedium, ...props }) => {\n const { record } = props;\n\n return (\n - \n
- \n
\n PO Number: \n Purchase Order number provided by Customer.\n \n \n - \n
\n Carrier Name: \n Rail line / truck line name.\n \n \n - \n
\n Carrier Type: \n Select carrier type - determines \"Pickup Number\" or\n \"Railcar Number\".\n \n \n - \n
\n Pickup Number: Required if Carrier Type\n = \"Truck\".\n \n \n - \n
\n Railcar Number: \n Required if shipping by Rail and Carrier Type = \"Rail\".\n \n \n - \n
\n Must Tarp: \n Required if Carrier Type = \"Truck\". Indicate if load needs\n to be covered with tarp.\n \n \n - \n
\n Destination Name & Address: \n Optional - can be left blank for \"Blind Shipments\". If\n Destination entered, address is required.\n \n \n - \n
\n Attachments: \n Attach the original PO from customer.\n \n \n - \n
\n Custom Fields\n \n\n User-defined in Account setup. These fields are\n Account-specific, so they may differ from one inbound to\n another.\n \n \n
- \n
- \n
\n Product Name: \n Product name as displayed in the Inventories. Items linked\n to Product Catalog will have an{\" \"}\n \nInfo Bubble\n in the right corner. Those not linked to a Product, will\n display broken\n link icon.\n \n - \n
\n Qty. On Hand: Stock quantity in storage.\n \n \n - \n
\n Qty. Committed: \n Stock quantity Reserved across all Outbound Shipments,\n including this one - dynamically updated.\n \n \n - \n
\n Qty. Available: \n Stock quantity available of Outbound Shipment, inclusive\n of Qty. Committed in this shipment.\n \n \n - \n
\n Qty. Outbound: Stock quantity Reserved\n for this shipment.\n \n \n - \n
\n Custom Fields\n \n\n User-defined in Account setup or Product Catalog. These\n fields are Account- and Product-specific, so they may\n differ from one inbound to another.\n \n \n - \n
\n \n\n ADD: \n Add new Line Item to Pick List. Launches \"Inventory\n Search\" dialog. Account must be selected on Shipment Setup\n Tab to enable the Add button. Inventory Search dialog\n allows you to search for All Inventories by hitting the\n Search button, or narrowing down results by product name,\n or lot number.\n \n - \n
\n \n\n REMOVE: \n Remove selected Pick List Line Item and adjust global\n Inventory counts.\n \n - \n
\n Total Quantity & Shipping Units: \n Sum total of Qty. Outbound. Indicate units of measure for\n counting Qty shipped.\n \n \n - \n
\n Bill Quantity & Units: \n Total Qty. Outbound and Units used for invoicing customer.\n If Billing Units = Weight Units, the measured truck weight\n will be used for invoicing.\n \n \n
- \n
- \n
\n \n\n ADD: Add new Note Line Item.\n \n - \n
\n \n\n REMOVE: \n Remove selected Note Line Item - this info will be\n permanently lost.\n \n
- \n
- \n
\n Carrier Name: \n Rail line / truck line name.\n \n \n - \n
\n Carrier Type: \n Select carrier type - determines \"Pickup Number\" or\n \"Railcar Number\".\n \n \n - \n
\n Pickup Number: Required if Carrier Type\n = \"Truck\".\n \n \n - \n
\n Railcar Number: \n Required if shipping by Rail and Carrier Type = \"Rail\".\n \n \n - \n
\n Must Tarp: \n Required if Carrier Type = \"Truck\". Indicate if load needs\n to be covered with tarp.\n \n \n - \n
\n Destination Name & Address: \n Optional - can be left blank for \"Blind Shipments\". If\n Destination entered, address is required.\n \n \n - \n
\n Attachemnts: \n Attach the original PO from customer.\n \n \n - \n
\n Custom Fields\n \n\n User-defined in Account setup. These fields are\n Account-specific, so they may differ from one inbound to\n another.\n \n \n - \n
\n \n\n INVOICE: Generate new Invoice for this\n Outbound Shipment.\n \n
- \n
- \n
\n Product Name: \n Product name as displayed in the Inventories. Items linked\n to Product Catalog will have an{\" \"}\n \nInfo Bubble\n in the right corner. Those not linked to a Product, will\n display broken\n link icon.\n \n - \n
\n Qty. On Hand: Stock quantity in storage.\n \n \n - \n
\n Qty. Committed: \n Stock quantity Reserved across all Outbound Shipments,\n including this one - dynamically updated.\n \n \n - \n
\n Qty. Available: \n Stock quantity available of Outbound Shipment, inclusive\n of Qty. Committed in this shipment.\n \n \n - \n
\n Qty. Outbound: Stock quantity Reserved\n for this shipment.\n \n \n - \n
\n Custom Fields\n \n\n User-defined in Account setup or Product Catalog. These\n fields are Account- and Product-specific, so they may\n differ from one inbound to another.\n \n \n - \n
\n \n\n ADD: \n Add new Line Item to Pick List. Launches \"Inventory\n Search\" dialog. Account must be selected on Shipment Setup\n Tab to enable the Add button. Inventory Search dialog\n allows you to search for All Inventories by hitting the\n Search button, or narrowing down results by product name,\n or lot number.\n \n - \n
\n \n\n REMOVE: \n Remove selected Pick List Line Item and adjust global\n Inventory counts.\n \n - \n
\n \n\n EDIT: \n Edit Qty. Outbound of selected Line Item. After saving or\n cancelling changes, you will be brought back to this\n screen.\n \n - \n
\n Total Quantity & Shipping Units: \n Sum total of Qty. Outbound. Indicate units of measure for\n counting Qty shipped.\n \n \n - \n
\n Bill Quantity & Units: \n Total Qty. Outbound and Units used for invoicing customer.\n If Billing Units = Weight Units, the measured truck weight\n will be used for invoicing.\n \n \n
- \n
- \n
\n Date Created: \n Date customer advised of Outbound Shipment.\n \n \n - \n
\n Time Placed: \n Time of Arrival when the Carrier arrives and checks in\n with the Yard.\n \n \n - \n
\n Empty Weight & Units: \n Empty truck weight at time of Arrival. Used for invoicing\n if Units = Billing Units.\n \n \n - \n
\n Load Start Time: Time when Crew started\n loading outbound inventory.\n \n \n - \n
\n Load End Time: Time when Crew finished\n loading outbound inventory.\n \n \n - \n
\n Time Released: Time shipment was approved\n and Released.\n \n \n - \n
\n Loaded Weight & Units: \n Loaded truck weight at time of Departure. Used for\n invoicing if Units = Billing Units.\n \n \n - \n
\n Seal Number: \n Seal tag number for shipments that require sealing.\n \n \n
- \n
- \n
\n \n\n ADD: Add new Note Line Item.\n \n - \n
\n \n\n REMOVE: \n Remove selected Note Line Item - this info will be\n permanently lost.\n \n
Drop files to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
Drop BOL file\n to upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n onChange={(value) =>\n handleFileChange(\"bolFile\", value, form, notify)\n }\n >\n
\n
\n
\n
\n
\n
\n
Drop files to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
Drop a BOL\n File to upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n onChange={(value) =>\n handleFileChange(\"bolFile\", value, form, notify)\n }\n disabled={false}\n helperText={false}\n >\n
\n \n
\n
\n
\n
\n
\n
\n
\n
- \n
- \n
\n Product Name: Descriptive product name. If product\n comes as a UNIT/Bundle, we commend adding # of PIECES in product\n name.\n \n \n - \n
\n Product Code: a unique, manufacturer-provided SKU,\n Product Code, or UPC registered with GS1 US. Once product is created\n or uploaded, a Product Code cannot be modified.\n \n \n - \n
\n Load Type: Select from pre-configured set of\n product Load Types.\n \n \n - \n
\n Commodity Category: Custom Product / commodity\n categorization.\n \n \n - \n
\n Low Inventory Alert: Inventory quantity threshold\n at which the \n\"Low\n Inventory Alert\" is triggered.\n \n - \n
\n UOM: Units of measure used to count/measure\n inventory levels. A corresponding unit of measure should be filled\n with \"1\" as a unit-to-unit conversion base.\n \n \n - \n
\n Billing Units: Units of measure used to\n count/measure inventory for billing purposes. Can be different from\n Default UOM. For excample, you can measure inventory in Gallons, but\n bill customer in Lbs. A corresponding unit of measure should be\n filled with amount corresponding to 1 Default Unit.\n \n \n - \n
\n CUSTOM FIELDS: \n \n\n Product Catalog supports definition of Custom Fields to extend the\n capabilities of the platform. Custom Fields can be added directly\n through a Product Catalog upload, and defined in Account \"CUSTOM\n SETTINGS\" tab. To add a new Custom Field, navigate to the \"INVENTORY\n FIELDS\" section and enter it there.\n \n \n
- \n
- \n
\n Product Name: Descriptive product name. If product\n comes as a UNIT/Bundle, we commend adding # of PIECES in product\n name.\n \n \n - \n
\n Product Code: a unique, manufacturer-provided SKU,\n Product Code, or UPC registered with GS1 US. Once product is created\n or uploaded, a Product Code cannot be modified.\n \n \n - \n
\n Load Type: Select from pre-configured set of\n product Load types.\n \n \n - \n
\n Commodity Category: Custom Product / commodity\n categorization.\n \n \n - \n
\n Low Inventory Alert: Inventory quantity threshold\n at which the \n\"Low\n Inventory Alert\" is triggered.\n \n - \n
\n UOM: Units of measure used to count/measure\n inventory levels. A corresponding unit of measure should be filled\n with \"1\" as a unit-to-unit conversion base.\n \n \n - \n
\n Billing Units: Units of measure used to\n count/measure inventory for billing purposes. Can be different from\n Default UOM. For excample, you can measure inventory in Gallons, but\n bill customer in Lbs. A corresponding unit of measure should be\n filled with amount corresponding to 1 Default Unit.\n \n \n - \n
\n CUSTOM FIELDS: \n \n\n Product Catalog supports definition of Custom Fields to extend the\n capabilities of the platform. Custom Fields can be added directly\n through a Product Catalog upload, and defined in Account \"CUSTOM\n SETTINGS\" tab. To add a new Custom Field, navigate to the \"INVENTORY\n FIELDS\" section and enter it there.\n \n \n - \n
\n \n\n CLONE: \n Copy current record to create a new Product. Cloned product needs to\n have a unique Product Code added.\n \n - \n
\n \n\n DELETE: \n Removes the Product from the platform making it unavailable for\n future use. It does not affect past inventory records linked to this\n Product.\n \n
\n {isAuthorized(AclType.ACCOUNTS) ? (\n
\n
\n
- \n
- \n
\n Task Type: \n \n- \n
- \n
\n Generic: Assign custom Yard duties or resources.\n \n \n - \n
\n Inventory Audit: Assign Inventory Audit.\n Displays an \"Audit\" drop-down field with list of active Audits.\n \n \n - \n
\n Accept Inbound Shipment: \n Assign an Inbound Shipment to select Crew member. Displays a\n \"Shipment\" drop-down field with list of Placed shipments.\n \n \n - \n
\n Load Outbound Shipment: \n Assign an Outbound Shipment to select Crew member. Displays a\n \"Shipment\" drop-down field with list of available shipments.\n \n \n
\n - \n
- \n
\n Shipment: Select from list of available shipments.\n Visible only when assigning Inbound / Outbound Shipment.\n \n \n - \n
\n Due Date: Specify when the Task is due.\n \n \n - \n
\n Late Date: Specify when the Task will be marked as\n late.\n \n \n
- \n
- \n
\n Task Type: \n \n- \n
- \n
\n Generic: Assign custom Yard duties or\n resources.\n \n \n - \n
\n Inventory Audit: Assign Inventory Audit.\n \n \n - \n
\n Accept Inbound Shipment: Assign an Inbound\n Shipment to select Crew member.\n \n \n - \n
\n Load Outbound Shipment: Assign an Outbound\n Shipment to select Crew member.\n \n \n - \n
\n \n\n OPEN: \n Open corresponding Audit / Shipment record.\n \n
\n - \n
- \n
\n Due Date: Specify when the Task is due.\n \n \n - \n
\n Late Date: Specify when the Task will be marked as\n late.\n \n \n - \n
\n \n\n DELETE: \n Removes user's access to the platform and deletes the User from\n \"Users\" list view.\n \n
Drop file(s) to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
\n
\n Drop file(s) to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
Customer Access Cancelled
\n \n
\n ${fromName} at ${accountName} has deleted their User account on transloads.co.
\n If you believe this was done by mistake, please contact this user at their email address:
\n ${fromEmail}
\n You can always re-activate their account by sending them a new invite from Users > Customers.
\n
\n `;\n}\n","import React, { useState } from \"react\";\n\nimport {\n Dialog,\n DialogTitle,\n DialogContent,\n DialogActions,\n Grid,\n IconButton,\n MenuItem,\n TextField,\n Typography,\n} from \"@material-ui/core\";\n\nimport {\n Button,\n Confirm,\n useNotify,\n useRedirect,\n useRefresh,\n} from \"react-admin\";\n\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport { alpha } from \"@material-ui/core/styles/colorManipulator\";\nimport classnames from \"classnames\";\n\nimport { CancelIcon, CloseIcon, DeleteIcon } from \"../../../components/common\";\nimport { logError } from \"../../../utils/appUtils\";\nimport {\n deactivateReloadYardAccounts,\n doUpdateReloadYardAccount,\n sendEmails,\n} from \"../../../managerApp/resources/customers/customerUtils\";\nimport { emailDeleteHTML } from \"./emailDeleteHTML\";\n\nconst useStyles = makeStyles(\n (theme) => ({\n dialogTitle: {\n display: \"flex\",\n paddingTop: theme.spacing(0),\n paddingBottom: theme.spacing(0),\n justifyContent: \"space-between\",\n },\n title: {\n paddingTop: theme.spacing(1),\n },\n dialogContent: {\n // https://stackoverflow.com/questions/47698037/how-can-i-set-a-height-to-a-dialog-in-material-ui\n minHeight: \"50vh\",\n },\n deleteButton: {\n color: theme.palette.error.main,\n \"&:hover\": {\n backgroundColor: alpha(theme.palette.error.main, 0.12),\n // Reset on mouse devices\n \"@media (hover: none)\": {\n backgroundColor: \"transparent\",\n },\n },\n },\n }),\n { name: \"RaDeleteWithConfirmButton\" }\n);\n\nexport const DeleteYardButton = ({\n record,\n appUser,\n setAppUser,\n className,\n ...props\n}) => {\n const notify = useNotify();\n const refresh = useRefresh();\n const classes = useStyles();\n const [isOpen, setIsOpen] = useState(false);\n const [loading, setLoading] = useState(false);\n const [reloadYards, setReloadYards] = useState(\n appUser.reloadYardAccounts.items.map((item) => item.reloadYard)\n );\n const [selectedYardId, setSelectedRYardId] = useState(\"\");\n\n const handleDialogOpen = () => setIsOpen(true);\n const handleDialogClose = () => setIsOpen(false);\n\n const handleDelete = async () => {\n setLoading(true);\n try {\n debugger;\n // Update customer active = \"false\", tirggers lambda function \"/processCustomer\"\n const reloadYardAccount = appUser.reloadYardAccounts.items.find(\n (account) => account.reloadYardId === selectedYardId\n );\n reloadYardAccount.active = \"false\";\n reloadYardAccount.firstName = appUser.firstName;\n await doUpdateReloadYardAccount(reloadYardAccount);\n\n // send silently don't await\n sendEmails(reloadYardAccount, emailDeleteHTML);\n\n // update appUser\n const newReloadYardAccounts = appUser.reloadYardAccounts.items.filter(\n (account) => account.reloadYardId !== selectedYardId\n );\n setReloadYards(newReloadYardAccounts.map((item) => item.reloadYard));\n setAppUser({\n ...appUser,\n reloadYardAccounts: {\n items: newReloadYardAccounts,\n },\n });\n\n notify(\"Removed access successfully\");\n } catch (error) {\n logError(\n \"custoemrApp:customers:DeleteYardButton:handleDelete\",\n error,\n notify\n );\n } finally {\n setLoading(false);\n setIsOpen(false);\n refresh();\n }\n };\n\n return (\n <>\n
\n You will lose access to all transloads!
\n Use DELETE TRANSLOAD to remove access to a single transload.\n \n }\n onConfirm={handleDelete}\n onClose={handleDialogClose}\n />\n \n );\n};\n","import React from \"react\";\n\nimport { Grid } from \"@material-ui/core\";\n\nimport {\n Edit,\n FormDataConsumer,\n maxLength,\n minLength,\n regex,\n required,\n SimpleForm,\n TextInput,\n Toolbar,\n TopToolbar,\n useEditController,\n useRedirect,\n} from \"react-admin\";\n\nimport { useUser } from \"../../../authenticatorApp/UserContext\";\nimport { BackButton } from \"../../../components/common/BackButton\";\nimport { ForceTitle } from \"../../../components/common/ForceTitle\";\nimport { AclType, REGEX_PHONE } from \"../../../utils/constants\";\nimport { getBackPath } from \"../../../utils/utils\";\nimport { ValidateSaveButton } from \"./ValidateSaveButton\";\nimport { DeleteAccountButton, DeleteYardButton } from \"./DeepDeleteButton\";\nimport { CustomerAside } from \"./CustomerAside\";\n\nconst validateRequired = required();\nconst validatePhone = [\n regex(REGEX_PHONE, \"Must be valid Phone No.\"),\n minLength(10),\n maxLength(20),\n];\n\nconst CustomerEditForm = ({ record, ...props }) => {\n return (\n
\n \n
\n \n \n
\n \n \n \n \n \n \n {/* \n\t\t\t\t\t */}\n \n \n \n
\n );\n};\n\nconst InboundCard = ({ classes, portalType }) => {\n const [loaded, setLoaded] = useState();\n const [summary, setSummary] = useState({\n rolling: 0,\n notified: 0,\n placed: 0,\n });\n const notify = useNotify();\n\n useEffect(() => {\n !loaded && init();\n }, []);\n\n const init = async () => {\n setLoaded(true);\n try {\n const queryList = [];\n queryList[0] = API.graphql(\n graphqlOperation(countInboundShipments, {\n filter: {\n reloadYardId: { eq: window.appUser?.reloadYardId },\n status: { eq: InboundStatus.IN_TRANSIT },\n },\n })\n );\n\n queryList[1] = API.graphql(\n graphqlOperation(countInboundShipments, {\n filter: {\n reloadYardId: { eq: window.appUser?.reloadYardId },\n status: { eq: InboundStatus.ARRIVED },\n },\n })\n );\n\n queryList[2] = API.graphql(\n graphqlOperation(countInboundShipments, {\n filter: {\n reloadYardId: { eq: window.appUser?.reloadYardId },\n status: { eq: InboundStatus.PLACED },\n },\n })\n );\n\n const promiseResults = await Promise.all(queryList);\n\n let rollingCount = promiseResults[0].data.searchInboundShipments.total;\n let notifiedCount = promiseResults[1].data.searchInboundShipments.total;\n let placedCount = promiseResults[2].data.searchInboundShipments.total;\n\n setSummary({\n rolling: rollingCount ? rollingCount : 0,\n notified: notifiedCount ? notifiedCount : 0,\n placed: placedCount ? placedCount : 0,\n });\n } catch (err) {\n logError(\"components:Dashboard:InboundCard:init\", err, notify);\n }\n };\n\n return (\n \n \n \n \n {summary.rolling}\n \n \n \n \n In Transit\n \n \n \n \n {summary.notified}\n \n \n \n \n Notified\n \n \n \n \n {summary.placed}\n \n \n \n \n Placed\n \n \n \n
\n \n \n \n \n {summary.pending}\n \n \n \n \n Pending\n \n \n \n \n {summary.arrived}\n \n \n \n \n Arrived\n \n \n \n \n {summary.loaded}\n \n \n \n \n Loaded\n \n \n \n
\n \n {summary.matchCount ? (\n \n \n \n {summary.total}\n \n \n \n \n Total\n \n \n \n \n {summary.noMatchCount}\n \n \n \n \n Discrepancies\n \n \n \n ) : (\n No Audit found \n )}\n
\n - \n
- \n
\n Account Name & Address: \n Required Fields.\n \n \n - \n
\n Email: \n Primary contact Email must be unique to this Account.\n \n \n
- \n
- \n
\n Inbound / Outbound Fields: \n \n- \n
- \n
\n Field Name: \n Custom Fileld Name to be added to Inbound / Outbound Shipment\n form.\n \n \n - \n
\n Display On: \n Select whether to display on the mobile Operator App, or Manager\n portal only.\n \n \n
\n - \n
- \n
\n Inventory Fields: \n \n- \n
- \n
\n Field Name: \n Custom Fileld Name to be added to Tally Sheet form of an Inbound\n Shipment. This fild name will carry over to Stored Inventory, and\n Outbound Pick List items. Custom inventory Fields can be defined\n here and also added directly into Product Catalog. In order for\n the filed to be visible / selectable in Inventory, Product Catalog\n Search, and Inventory Search Lists, it must be defined here.\n \n \n - \n
\n Display On: \n Select whether to display on the mobile Operator App / Manager\n portal only, and Tally Sheet by default. When editing the Tally\n Sheet, you can override the show/hide settings, by selecting\n custom fields to display.\n \n \n
\n - \n
- \n
\n Document Templates: \n \n- \n
- \n
\n Bill Of Lading Template: \n Upload a custom BOL template to override default document\n generation template. Follow instructions to download, customize,\n and upload the template file.\n \n \n
\n - \n
- \n
- \n
\n Lot No. Prefix: \n Lot Number Prefix must be unique to this account. Used for generating\n Lot Numbers.\n \n \n - \n
\n Account Type: \n Account business categorization.\n \n \n - \n
\n External Acct. Number: \n External reference account number from CRM or other system.\n \n \n - \n
\n Inventory Storage Alert (Days): \n Days of free storage before Storage charges will be applied. Once\n inventory exceeds this Day limit in storage, the inventory item will\n be marked as Stale Inventory.\n \n \n - \n
\n Billing Units: \n Default billing units of measure for this Account. Can be overridden\n in Product Catalog, or an individual Inbound/Outbound/Invoice record.\n \n \n - \n
\n Payment Terms: \n Used for defaulting payment terms in Invoicing.\n \n \n - \n
\n Billing Address: \n \n\n {\" \"}\n Fill out if different from contact address, otherwise use{\" \"}\n Copy Account Contact Info to auto-populate. This\n address will be used for Invoicing.\n \n \n - \n
\n Billing Contacts: \n \n\n Specific contacts for billing purposes. Invoices will be address Attn.\n of such billing contact.\n \n \n
- \n
- \n
\n Inventory Level Icon: \n Each product row is marked with an Icon indicating either{\" \"}\n \nLow Inventory\n Level, or healthy Inventory Levels\n \n - \n
\n \n\n CREATE PRODUCT: \n Manually add a single, new Product to the Catalog.\n \n - \n
\n \n\n UPLOAD CATALOG: \n Opens an Upload Catalog dialog allowing you to upload a .CSV file\n populated with product info obtained from your customers. Follow\n instructions in the dialog window to complete the upload.\n \n - \n
\n \n\n EXPORT: \n Export existing Products into a .CSV file. Exported file can be edited\n and re-uploaded to bulk update all products.\n \n - \n
\n \n\n CLONE: \n Copy a single existing Product to create a new, similar product. Edit\n pre-populated inputs as needed and save.\n \n - \n
\n \n\n EDIT: \n Update an existing Product.\n \n
- \n
- \n
\n Download Product_Catalog_Template.xlsx spreadsheet, and fill it out\n following the instructions on the Download Page.\n \n \n - \n
\n Drop the filled-out .CSV file onto the upload zone or click the{\" \"}\n \nicon to select the file.\n \n
- \n
- \n
\n Service Name: \n Short name of service / goods / consumables.\n \n \n - \n
\n Description: \n Brief specification of services / goods.\n \n \n - \n
\n Tax Rate: \n Select an applicable tax rate to be applied to each service / goods.\n Tax Rates are configured in My Yard setup.\n \n \n - \n
\n Service Rates: \n Enter applicable service rates per units utilized for billing of a\n given commodity.\n \n \n - \n
\n \n\n ADD: \n Add a new, custom Service definition.\n \n - \n
\n \n\n REMOVE: \n Remove selected Service Item - this info will be permanently lost. No\n other reccords will be affected. Accessorial Charges, Inside Handling,\n and Outside Handling cannot be removed as they are integral to proper\n functioning of the platform.\n \n
- \n
- \n {\" \"}\n Download{\" \"}\n
- \n {\" \"}\n Fill out following the instructinos and excamples on the download\n page{\" \"}\n \n
- \n {\" \"}\n Save as a comma-seperated-values (.CSV) file and upload here{\" \"}\n \n
- \n {\" \"}\n If errors are found, review, correct the errors and re-upload{\" \"}\n \n
- For help, contact us at 877-TRANSLOAD / 877-872-6756 \n
Drop a CSV File to\n upload, or click to select it.\n \n }\n accept=\".csv\"\n onChange={handleCSVFile}\n helperText={false}\n >\n
- \n {csvErrors.map((error) => (\n
- {error} {\" \"}\n
\n \n \n \n {isOpen && (\n \n )}\n
\n );\n};\n\nconst InlineEdit = ({ form, formData, classes }) => {\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Instructions\n \n \n \n \n
Drop a DOCX\n file to upload, or click to select it.\n \n }\n accept=\".docx\"\n onChange={(value) =>\n handleFileChange(\"receiptTemplate\", value, form, notify)\n }\n >\n \n \n \n
Drop a DOCX\n file to upload, or click to select it.\n \n }\n accept=\".docx\"\n onChange={(value) =>\n handleFileChange(\"bolTemplate\", value, form, notify)\n }\n >\n \n \n \n \n \n
\n )}\n - \n
- \n {\" \"}\n Download{\" \"}\n
- \n {\" \"}\n Customize following the instructinos and excamples on the\n download page{\" \"}\n \n
- Save as a .docx file and upload here \n
- \n {\" \"}\n If errors are found, review, correct the errors and\n re-upload{\" \"}\n \n
- \n {\" \"}\n For help, contact us at 877-TRANSLOAD / 877-872-6756{\" \"}\n \n
Drop a DOCX\n file to upload, or click to select it.\n \n }\n accept=\".docx\"\n onChange={(value) =>\n handleFileChange(\"receiptTemplate\", value, form, notify)\n }\n >\n
Drop a DOCX\n file to upload, or click to select it.\n \n }\n accept=\".docx\"\n onChange={(value) =>\n handleFileChange(\"bolTemplate\", value, form, notify)\n }\n >\n
Drop file(s) to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
\n Are you sure you want to archive this account?\n \n }\n onClose={handleDialogClose}\n />\n \n );\n};\n","import React, { useState } from \"react\";\nimport { useHistory } from \"react-router-dom\";\n\nimport { Backdrop, CircularProgress } from \"@material-ui/core\";\nimport { makeStyles } from \"@material-ui/core/styles\";\n\nimport { useNotify, Confirm, SaveButton } from \"react-admin\";\nimport { useForm } from \"react-final-form\";\n\nimport { getCustomFieldId } from \"../../../components/common/CustomFields\";\nimport { logError } from \"../../../utils/appUtils\";\nimport { FilePaths } from \"../../../utils/constants\";\nimport { saveRemoveFile, saveRemoveFiles } from \"../../../utils/fileUtils\";\nimport { deepRedirect, historyAutoGen } from \"../../../utils/utils\";\nimport * as utils from \"./AccountUtils\";\n\nconst useStyles = makeStyles((theme) => ({\n backdrop: {\n zIndex: theme.zIndex.drawer + 1,\n },\n}));\n\nconst validateUnsavedChanges = (services) => {\n let message = null;\n if (services) {\n services.forEach((element) => {\n if (element && !element.id)\n message =\n \"You have un-saved Services Rates. Un-salved changes will be lost! \" +\n \"Proceed without committing changes?\";\n });\n }\n return message;\n};\n\nexport const DialogSaveButton = (props) => {\n const classes = useStyles();\n const form = useForm();\n const notify = useNotify();\n const history = useHistory();\n const { basePath, backPath, record } = props;\n const [open, setOpen] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n const [allMessages, setAllMessages] = useState([]);\n const [confirmMessageIdx, setConfirmMessageIdx] = useState();\n\n const handleSave = async () => {\n const formState = form.getState();\n const formData = formState.values;\n const newMessages = [];\n debugger;\n\n const unsavedWarning = validateUnsavedChanges(\n formData?.activeServices?.items\n );\n if (unsavedWarning) newMessages.push(unsavedWarning);\n\n if (formState.dirtyFields.email) {\n const emailWarning = await utils.validateEmailUnicity(\n formData.email,\n formData\n );\n if (emailWarning) newMessages.push(emailWarning.message);\n }\n\n if (newMessages.length > 0) {\n setAllMessages(newMessages);\n setConfirmMessageIdx(1);\n setOpen(true);\n } else {\n setConfirmMessageIdx(null);\n handleValidateSave();\n }\n };\n\n const handleValidateSave = async () => {\n debugger;\n setOpen(false);\n\n if (allMessages[confirmMessageIdx]) {\n setConfirmMessageIdx(confirmMessageIdx + 1);\n setOpen(true);\n } else {\n await utils.formValidate(form, notify);\n\n props.handleSubmit();\n }\n };\n\n const handleDialogClose = () => setOpen(false);\n\n const transform = async (data) => {\n setIsSaving(true);\n data = { ...data };\n debugger;\n const includeArrayList = [\n \"inboundCustomFields.name\",\n \"inventoryCustomFields.name\",\n \"outboundCustomFields.name\",\n ];\n data.history = historyAutoGen(form, data, [], includeArrayList);\n\n data.email = data.email.toLowerCase();\n if (data.address?.state)\n data.address.state = data.address.state.toUpperCase();\n if (data.address?.zipCode)\n data.address.zipCode = data.address.zipCode.toUpperCase();\n data.addressState = data.address?.state ? data.address.state : \" \";\n delete data.address?.name;\n\n if (data.billingEmail) data.billingEmail = data.billingEmail.toLowerCase();\n if (data.billingAddress?.state)\n data.billingAddress.state = data.billingAddress.state.toUpperCase();\n if (data.billingAddress?.zipCode)\n data.billingAddress.zipCode = data.billingAddress.zipCode.toUpperCase();\n\n // cleanup GridEdit side-effects\n data.addressBook = data.addressBook?.map(({ id, ...rest }) => rest);\n\n if (data.inboundCustomFields?.length > 0) {\n data.inboundCustomFields.forEach(\n (itm) => (itm.id = itm.id ? itm.id : getCustomFieldId(itm.name))\n );\n }\n if (data.outboundCustomFields?.length > 0) {\n data.outboundCustomFields.forEach(\n (itm) => (itm.id = itm.id ? itm.id : getCustomFieldId(itm.name))\n );\n }\n if (data.inventoryCustomFields?.length > 0) {\n data.inventoryCustomFields.forEach(\n (itm) => (itm.id = itm.id ? itm.id : getCustomFieldId(itm.name))\n );\n }\n\n data.inboundPhotos = data.inboundPhotos || 0;\n data.outboundPhotos = data.outboundPhotos || 0;\n data.inventoryPhotos = data.inventoryPhotos || 0;\n\n try {\n await saveRemoveFiles(\n record,\n data,\n \"attachments\",\n `${FilePaths.ACCOUNT}/${data.id}`\n );\n await saveRemoveFile(\n record,\n data,\n \"bolTemplate\",\n `${FilePaths.ACCOUNT}/${data.id}`\n );\n await saveRemoveFile(\n record,\n data,\n \"receiptTemplate\",\n `${FilePaths.ACCOUNT}/${data.id}`\n );\n } catch (err) {\n logError(\"accounts:DialogSaveButton:saveRemoveFile\", err, notify);\n return Promise.reject();\n }\n\n delete data.activeServices;\n delete data.checklists;\n delete data.productFile;\n delete data.products;\n delete data.services;\n\n return data;\n };\n\n const onSuccess = (data) => {\n notify(`Account updated successfully.`);\n deepRedirect(history, backPath ? backPath : basePath);\n setIsSaving(false);\n };\n\n const onFailure = (error) => {\n setIsSaving(false);\n logError(\n \"accounts:DialogSaveButton:onFailure:Account Update\",\n error,\n notify\n );\n };\n\n const isPristine = () => {\n const formState = form.getState();\n return formState.pristine;\n };\n\n return (\n <>\n
Drop file(s) to\n upload, or click to select.\n \n }\n accept={ACCEPTED_FILES}\n multiple\n maxFiles={MAX_FILES}\n options={{ maxFiles: MAX_FILES }}\n onChange={(value) =>\n handleFileChange(\"attachments\", value, form, notify)\n }\n >\n
\n \n
\n );\n};\n\nconst ServiceAddButton = ({ form, formData, backPath, history, ...props }) => {\n const [open, setOpen] = useState(false);\n const [confirmTitle, setConfirmTitle] = useState(\"\");\n const [confirmContent, setConfirmContent] = useState(\"\");\n\n const toPath = \"/services/create\";\n\n const handleConfirmAdd = (evt) => {\n const formState = form.getState();\n\n if (formState.dirty) {\n evt.preventDefault();\n setConfirmTitle(\"Un-saved Data Confirmation\");\n setConfirmContent(\n \"You have un-saved Account changes. If you continue, the changes may be lost. Proceed?\"\n );\n setOpen(true);\n } else {\n handleConfirmRedirect();\n }\n };\n\n const handleConfirmClose = () => setOpen(false);\n const handleConfirmRedirect = () => {\n deepRedirect(history, toPath, props.location.pathname, backPath, {\n account: formData,\n });\n };\n\n return (\n \n \n
\n );\n};\n\nconst CatalogTab = ({\n backPath,\n record,\n csvErrors,\n setCSVErrors,\n ...props\n}) => {\n const form = useForm();\n const notify = useNotify();\n const classes = useStyles();\n const redirect = useRedirect();\n const [csvData, setCSVData] = useState({});\n const [uploadOpen, setUploadOpen] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n\n form.registerField(\n \"products.items\",\n (fieldState) => {\n const { blur, change, focus, ...rest } = fieldState;\n },\n { active: true, dirty: true, touched: true, valid: true, value: true }\n );\n\n const handleCatalogUpload = async () => {\n if (csvData.products?.length > 0) {\n try {\n debugger;\n setIsSaving(true);\n const oldProductMap =\n record?.products?.items?.length > 0\n ? keyBy(record.products.items, \"productCode\")\n : {};\n const unitEntries = UnitOptions.filter(\n (e) => e.id !== Unit.CAR && e.id !== Unit.TL\n );\n const customHeaders = getCustomHeaders(csvData.products[0]);\n\n const results = await Promise.allSettled(\n csvData.products.map((item) => {\n // check old vs new products\n const oldProduct = oldProductMap[item[\"productCode\"]];\n if (oldProduct) {\n const input = { ...oldProduct, ...item };\n\n input.lowInventoryThreshold = Number(\n item[\"lowInventoryThreshold\"]\n ); // Number parse to 0\n input.pcsHeight = parseFloat(item[\"pcsHeight\"]);\n input.pcsWidth = parseFloat(item[\"pcsWidth\"]);\n input.pcsLength = parseFloat(item[\"pcsLength\"]);\n input.height = parseFloat(item[\"height\"]);\n input.width = parseFloat(item[\"width\"]);\n input.length = parseFloat(item[\"length\"]);\n\n unitEntries.forEach((unit) => {\n input[unit.column] = parseFloat(item[unit.column]);\n });\n\n input.lowInventoryAlert =\n input.totalInventoryQuantity <= input.lowInventoryThreshold;\n\n input.history = [\n ...oldProduct.history,\n {\n text: `Product bulk update`,\n type: NoteType.GENERIC,\n date: new Date(),\n by: window.appUser?.fullName,\n },\n ];\n\n if (customHeaders.length > 0) {\n input.customFields = [];\n customHeaders.forEach((header) => {\n input.customFields.push(`${header}||${item[header]}`);\n delete input[header];\n });\n }\n\n delete input.commodityCateory;\n delete input.createdAt;\n delete input.error;\n return API.graphql(graphqlOperation(updateProduct, { input }));\n } else {\n const input = {\n active: \"true\",\n groups: record.groups,\n reloadYardId: record.reloadYardId,\n accountId: record.id,\n };\n\n input.productCode = item[\"productCode\"];\n input.name = item[\"name\"];\n input.reloadYardCommodityId = item.reloadYardCommodityId;\n input.category = item[\"category\"] ? item[\"category\"] : null;\n input.defaultUnits = item[\"defaultUnits\"];\n input.defaultWeightUnits = item[\"defaultWeightUnits\"]\n ? item[\"defaultWeightUnits\"]\n : null;\n input.inboundBillingUnits = item[\"inboundBillingUnits\"];\n input.outboundBillingUnits = item[\"outboundBillingUnits\"];\n input.lowInventoryThreshold = Number(\n item[\"lowInventoryThreshold\"]\n ); // Number parse to 0\n input.height = parseFloat(item[\"height\"]);\n input.width = parseFloat(item[\"width\"]);\n input.length = parseFloat(item[\"length\"]);\n\n unitEntries.forEach(({ column }) => {\n input[column] = parseFloat(item[column]);\n });\n\n input.totalInventoryQuantity = 0;\n input.lowInventoryAlert = false;\n\n input.history = [\n {\n text: `Product Created`,\n type: NoteType.GENERIC,\n date: new Date(),\n by: window.appUser?.fullName,\n },\n ];\n\n if (customHeaders.length > 0) {\n input.customFields = [];\n customHeaders.forEach((header) => {\n input.customFields.push(`${header}||${item[header]}`);\n });\n }\n\n return API.graphql(graphqlOperation(createProduct, { input }));\n }\n })\n );\n\n const resError = results.find((itm) => itm.status === \"rejected\");\n if (resError) throw resError.reason;\n\n const newProducts = [];\n const updatedProductMap = {};\n results.forEach(\n (result) =>\n result.value.data.createProduct &&\n newProducts.push(result.value.data.createProduct)\n );\n results.forEach((result) => {\n if (result.value.data.updateProduct)\n updatedProductMap[result.value.data.updateProduct.id] =\n result.value.data.updateProduct;\n });\n\n let newProductList = record.products.items.map((itm) =>\n updatedProductMap[itm.id] ? updatedProductMap[itm.id] : itm\n );\n newProductList = [...newProductList, ...newProducts];\n form.change(\"products.items\", newProductList);\n\n customHeadersToInventoryFields(form, customHeaders, record);\n\n notify(\"Products created successfully\");\n } catch (error) {\n logError(\n \"accounts:AccountEdit:handleCatalogUpload\",\n error,\n notify,\n redirect\n );\n } finally {\n setIsSaving(false);\n }\n }\n handleClose();\n };\n\n const handleClose = () => {\n setCSVData({});\n setCSVErrors(null);\n setUploadOpen(false);\n };\n\n return (\n \n
\n - \n
- \n
\n Account: Specifies which Accounts should be\n inventoried. You can inventory the entire yard, or select a specific\n Account.\n \n \n - \n
\n \n\n SET ACCOUNT: \n Opens up an Inventory Map dialog, allowing you to select an Account\n and inspect locations.\n \n - \n
\n Notes: Add special instructions for the Crew\n performing the Audit.\n \n \n
- \n
- \n
\n Notes: Update notes or instructions for the\n Crew.\n \n \n - \n
\n \n\n DELETE: \n Permanently removes unwanted Audit records. Does not affect\n Inventory levels.\n \n - \n
\n \n\n MARK COMPLETE: \n Visible only for Audits that are \"Pending Review\". Sets record\n status to \"Completed\" and clears the record from \"Pending\n Review\" List.\n \n
- \n
- \n
\n Qty. On Hand: \n Quantity expected to be present based on all prior Inventory\n activities.\n \n \n - \n
\n Qty. Physical: \n Physical quantity count of inventoried product.\n \n \n - \n
\n Reco. On Hand: \n Adjusted / reconciled quantity On Hand.\n \n \n - \n
\n Reco. Physical: \n Adjusted / reconciled Physical quantity.\n \n \n - \n
\n Notes: \n \nOpen the record to\n inspect latest Audit notes.\n \n - \n
\n \n\n EDIT: \n Opens up corresponding Inventory record. Update either Qty. On\n Hand, or Qty. Physical to bring caunts to match. You can see\n all prior inventory activity in the right-hand sidebar, the\n Notes Tab or, the History Tab. Remember to document resolution\n in the Notes tab. Saving the record, will bring you back to\n this page.\n \n
- \n
- \n
\n Group By: \n Select report format. Switch between listing by Lot Number, or\n grouping by Product Code.\n \n \n - \n
\n \n\n EXPORT: \n Each roport format can be exported independently into Excel\n using the EXPORT button.\n \n
\n
\n
\n
\n
\n
\n {record.status === AuditStatus.IN_PROGRESS && \n
\n
- \n
- \n
\n Account: \n Account must be selected first to enable other fields.\n \n \n - \n
\n Point Of Contact: \n Billing point of contact, if any. Will be displayed as Attn. in Bill\n To address.\n \n \n - \n
\n PO Number: \n Automatically populated from Inbound/Outbound Shipment. Enter custom\n PO number for ad-hoc charges.\n \n \n - \n
\n Service Date: \n Automatically set to Inbount / Outbound Release date if available.\n Otherwise, select date of service.\n \n \n - \n
\n Due Date: \n Automatically set to Pyment Terms specified in Account Billing Setup.\n Change if needed to any future date.\n \n \n - \n
\n Invoice Notes: \n Notes applicable to the entire invoice - not specific to individual\n charges.\n \n \n
- \n
- \n
\n Account: \n Account must be selected first to enable other fields.\n \n \n - \n
\n Point Of Contact: \n Billing point of contact, if any. Will be displayed as Attn. in Bill\n To address.\n \n \n - \n
\n PO Number: \n Automatically populated from Inbound/Outbound Shipment. Enter custom\n PO number for ad-hoc charges.\n \n \n - \n
\n Service Date: \n Automatically set to Inbount / Outbound Release date if available.\n Otherwise, select date of service.\n \n \n - \n
\n Due Date: \n Automatically set to Pyment Terms specified in Account Billing Setup.\n Change if needed to any future date.\n \n \n - \n
\n Invoice Notes: \n Notes applicable to the entire invoice - not specific to individual\n charges.\n \n \n - \n
\n \n\n MARK SETTLED: \n Mark invoice settled, reset balance to zero, and move to \"SETTLED\"\n tab. Visible if invoice is pending.\n \n - \n
\n \n\n REOPEN: \n Mark invoice as not settled, and move to \"NEW\" tab. Visible if invoice\n is settled.\n \n - \n
\n \n\n EXPORT: \n Download and Excel export of current invoice. To learn how to impoirt\n into QuickBooks, please visit\n \n - \n
\n \n\n PREVIEW: \n Show printable invoice. From the new view, you can print, save as PDF\n or email the invoice to the customer.\n \n
- \n
- \n
\n Service: \n Select Services / goods / consumables provided.\n \n \n - \n
\n Service Note: \n Notes specific to this Service item.\n \n \n - \n
\n Quantity / Units: \n Units and Quanity of Units handled for the Service. For \"Accessorial\n Charges\" use 1 PIECE or 1 UNIT.\n \n \n - \n
\n Unit Price: \n Price per 1 Unit of measure.\n \n \n - \n
\n Service Charge: \n TotalQuantity * Unit Price.\n \n \n - \n
\n Tax Rate & Tax: \n Select a pre-configured Tax Rate - setup in My Yard config. Rate is\n automatically applied when configured for a given service.\n \n \n - \n
\n \n\n ADD: \n Add new Service Line Item to the tally.\n \n - \n
\n \n\n REMOVE: \n Remove selected Service Line Item.\n \n - \n
\n Subtotal: \n Sum of all Service Charges.\n \n \n - \n
\n Taxes: \n Calculated from Tax Rate configured during My Yard and Account\n Services setup.\n \n \n - \n
\n Total Charges: \n Subtotal + Taxes\n \n \n
- \n
- \n
\n Service: \n Select Services / goods / consumables provided.\n \n \n - \n
\n Service Note: \n Notes specific to this Service item.\n \n \n - \n
\n Quantity / Units: \n Units and Quanity of Units handled for the Service. For \"Accessorial\n Charges\" use 1 PIECE or 1 UNIT.\n \n \n - \n
\n Unit Price: \n Price per 1 Unit of measure.\n \n \n - \n
\n Service Charge: \n TotalQuantity * Unit Price.\n \n \n - \n
\n Tax Rate & Tax: \n Select a pre-configured Tax Rate - setup in My Yard config. Rate is\n automatically applied when configured for a given service.\n \n \n - \n
\n \n\n ADD: \n Add new Service Line Item to the tally.\n \n - \n
\n \n\n REMOVE: \n Remove selected Service Line Item.\n \n - \n
\n Subtotal: \n Sum of all Service Charges.\n \n \n - \n
\n Taxes: \n Calculated from Tax Rate configured during My Yard and Account\n Services setup.\n \n \n - \n
\n Total Charges: \n Subtotal + Taxes\n \n \n