Cart
\r\n \r\n {this.state.cartItems.foodItems.map((item, key) => {\r\n return (\r\n \r\n Edit\r\n \r\n \r\n )}\r\n\r\n
\r\n );\r\n })}\r\n {this.state.tipConfiguration && this.getTipSection()}\r\n \r\n
\r\n );\r\n })}\r\n {item.customizations.length > 0 && (\r\n <>\r\n \r\n
\r\n {this.getDiscountContainerForItem(item)}\r\n {item.customizations.map((customization, key) => {\r\n return (\r\n {item.name}
\r\n{formatPrice(item.actualPrice * item.quantity)}
\r\n\r\n
\r\n {customization.name.replace(\"Select a\", \"\")}:
\r\n\r\n {customization.customizationOptions.map(\r\n (option, key) => {\r\n return (\r\n \r\n {option.name}\r\n {option.actualPrice > 0 && (\r\n \r\n {formatPrice(\r\n option.actualPrice * item.quantity\r\n )}\r\n \r\n )}\r\n \r\n {this.getDiscountContainerForItem(option)}\r\n
\r\n );\r\n }\r\n )}\r\n {customization.customizationOptions.length ===\r\n 0 && (\r\n \r\n {customization.textBoxValue}\r\n \r\n
\r\n )}\r\n \r\n \r\n this.onQuantityChange(item, e.target.value)\r\n }\r\n />\r\n this.removeItemfromCart(item)}>\r\n Remove\r\n \r\n
\r\n {item.isValid === false && (\r\n \r\n Value has to be between {item.minimumQuantity} and{\" \"}\r\n {item.maximumQuantity}.\r\n
\r\n )}\r\n \r\n
\r\n\r\n {!this.state.isOtherRestaurantFoodItemsAddedToCart && (\r\n \r\n \r\n
\r\n {this.getDiscountContainerForTotal()}\r\n Subtotal
\r\n{this.calculateSubTotal()}
\r\n\r\n
\r\n Sales Tax
\r\n{this.calculateSalesTax()}
\r\n\r\n {this.state.tipConfiguration &&\r\n this.state.tipConfiguration.tipSetup !== 1 && (\r\n <>\r\n
\r\n Tip Amount
\r\n{formatPrice(this.calculateTipAmount())}
\r\n \r\n )}\r\n\r\n
\r\n {this.state.isShowRestaurantWaitingTime\r\n ? this.state.restaurantWaitingTimeMessage\r\n : this.state.pickupTime && (\r\n Total
\r\n{this.calculateTotal()}
\r\n\r\n
\r\n )}\r\n Pickup Details: {this.state.pickupTime}
\r\n\r\n
\r\n );\r\n } else {\r\n return null;\r\n }\r\n };\r\n\r\n removeItemfromCart = (foodItem) => {\r\n this.props.checkAndRefreshScreenTime();\r\n storage.removeFoodItemWithMax4Sale(\r\n foodItem,\r\n this.removeItemSuccessCallBack,\r\n this.removeItemFailureCallBack\r\n );\r\n };\r\n\r\n removeItemFailureCallBack = (foodItem, response) => {\r\n console.log(\r\n \"Something went wrong while removing cart item from cache database!\"\r\n );\r\n console.log(\"foodItem with response \", foodItem, response);\r\n };\r\n\r\n removeItemSuccessCallBack = (foodItem) => {\r\n const nodeId = foodItem.nodeId;\r\n storage.remove(nodeId, foodItem.id);\r\n // if(foodItem.customizations.length > 0){\r\n // storage.remove(nodeId,foodItem.id);\r\n // }else{\r\n // storage.remove(nodeId);\r\n // }\r\n const cartItems = this.getItemFromStorage();\r\n this.setState({ cartItems });\r\n if (cartItems.foodItems.length === 0) {\r\n this.onCartScreenClose();\r\n }\r\n };\r\n\r\n calculateTotal = () => {\r\n const info = storage.info();\r\n if (!info.totalDiscount) {\r\n info.totalDiscount = 0;\r\n }\r\n let total = Number(\r\n info.totalPriceWithoutTax + (info.totalSalesTax - info.totalDiscount)\r\n ).toFixed(2);\r\n total = parseFloat(total);\r\n total = total + parseFloat(info.tipAmount);\r\n return formatPrice(total);\r\n };\r\n\r\n handleCustomTipDollarClick = () => {\r\n this.setState({\r\n customTipInPersentage: true,\r\n isCustomAmountDisplay: false,\r\n customTipInDollar: false,\r\n });\r\n };\r\n\r\n handleCustomTipPercentageClick = () => {\r\n this.setState({\r\n customTipInPersentage: false,\r\n isCustomAmountDisplay: false,\r\n customTipInDollar: false,\r\n });\r\n };\r\n handleDefaultTipAmount = () => {\r\n this.setState({\r\n customTipInPersentage: false,\r\n isCustomAmountDisplay: true,\r\n customTipInDollar: false,\r\n });\r\n };\r\n getTipSection = () => {\r\n return (\r\n <>\r\n {this.state.tipConfiguration.tipSetup !== 1 && (\r\n Guest Discount
\r\n\r\n {\"-\"}\r\n {formatPrice(info.totalDiscount)}\r\n
\r\n\r\n
\r\n )}\r\n \r\n );\r\n };\r\n\r\n tipPercentages() {\r\n return (\r\n <>\r\n \r\n {this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInPersentage &&\r\n !this.state.customTipInDollar && (\r\n
\r\n {this.state.isCustomAmountDisplay\r\n ? this.tipPercentages()\r\n : this.getInoutBox()}\r\n Select Tip Amount in Percentage
\r\n )}\r\n {!this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInDollar &&\r\n this.state.customTipInPersentage && (\r\nCustom Tip in Percentage
\r\n )}\r\n {!this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInPersentage &&\r\n !this.state.customTipInDollar &&Custom Tip in Dollars
}\r\n\r\n {!this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInDollar &&\r\n this.state.customTipInPersentage && (\r\nthis.handleCustomTipPercentageClick()}>\r\n Enter Custom Tips in Dollars\r\n
\r\n )}\r\n\r\n {this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInPersentage &&\r\n !this.state.customTipInDollar && (\r\nthis.handleCustomTipDollarClick()}>\r\n Enter Custom Tips in Percentage\r\n
\r\n )}\r\n\r\n {!this.state.isCustomAmountDisplay &&\r\n !this.state.customTipInPersentage &&\r\n !this.state.customTipInDollar && (\r\nthis.handleDefaultTipAmount()}>\r\n Default Tips section\r\n
\r\n )}\r\n\r\n {/* \r\n {this.state.isCustomAmountDisplay ? (\r\nthis.toggle()}>Enter Custom Amount in Dollars
\r\n ) : (\r\nthis.toggle()}>Enter Tips in Percentage
\r\n )} */}\r\n\r\n {this.state.tipConfiguration && (\r\n <>\r\n this.onTipSelect(3, 2)}\r\n >\r\n
\r\n\r\n {this.state.tipConfiguration.mondayTipPercentage} %
\r\n\r\n {parseFloat(\r\n (this.state.tipConfiguration.mondayTipPercentage / 100) *\r\n this.state.cartItems.totalPrice\r\n ).toFixed(2)}\r\n
\r\n{this.state.tipConfiguration.tuesdayTipPercentage} %
\r\n\r\n {parseFloat(\r\n (this.state.tipConfiguration.tuesdayTipPercentage / 100) *\r\n this.state.cartItems.totalPrice\r\n ).toFixed(2)}\r\n
\r\n \r\n\r\n{this.state.tipConfiguration.wednesdayTipPercentage} %
\r\n\r\n {parseFloat(\r\n (this.state.tipConfiguration.wednesdayTipPercentage / 100) *\r\n this.state.cartItems.totalPrice\r\n ).toFixed(2)}\r\n
\r\n \r\n\r\n{this.state.tipConfiguration.thursdayTipPercentage} %
\r\n\r\n {parseFloat(\r\n (this.state.tipConfiguration.thursdayTipPercentage / 100) *\r\n this.state.cartItems.totalPrice\r\n ).toFixed(2)}\r\n
\r\n \r\n \r\n )}\r\n \r\n \r\n );\r\n }\r\n\r\n // getBoxSection() {\r\n // return (\r\n //\r\n // {TipAmount.map((item) => {\r\n // return (\r\n //
\r\n // );\r\n // }\r\n\r\n getInoutBox() {\r\n return (\r\n <>\r\n {this.state.tipConfiguration && (\r\n <>\r\n \r\n //
\r\n // );\r\n // })}\r\n // {item.percentage}
\r\n //{item.amount}
\r\n //\r\n \r\n \r\n {isTimerComplete ? \"Oops!\" : \"Are you still there?\"}\r\n \r\n \r\n {!isTimerComplete && (\r\n \r\n )}\r\n \r\n {handleContent()}\r\n \r\n \r\n \r\n {\r\n handleClose();\r\n }}\r\n > \r\n { handleButtonText()}\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n","import React, { Component, useState, useRef, useReducer } from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faInfoCircle, faFlag } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { Tabs, Tab, Alert, Overlay, Tooltip } from \"react-bootstrap\";\r\nimport foodIcon from \"../../assets/images/food.png\";\r\nimport Header from \"../Header/NavigationHeader\";\r\nimport { get } from \"../../Utility/HttpService\";\r\nimport {\r\n getRestarurantItemsURL,\r\n checkCartIdExists,\r\n getSettingInfo,\r\n} from \"../../Utility/URLService\";\r\nimport {\r\n MembershipKey,\r\n RestaurantDetailsByNodeId,\r\n KIOSKSetting,\r\n TableNumber,\r\n} from \"../../Utility/Config\";\r\nimport { Storage } from \"../../Utility/Storage\";\r\nimport { MainMenu } from \"../../Models/MainMenu\";\r\nimport Spinner from \"../../Utility/Spinner\";\r\nimport { CommonResponse } from \"../../Models/CommonResponse\";\r\nimport { storage as cartStorage } from \"../../Utility/CartStorage\";\r\nimport Cart from \"../../components/Cart/Cart\";\r\nimport CartExpirationDialog from \"../../Utility/CartExpirationDialog\";\r\n\r\nconst useForceRerender = () => useReducer((state) => !state, false)[1];\r\n\r\nconst QueueToolTip = (state) => {\r\n const [show, setShow] = useState(false);\r\n const target = useRef(null);\r\n\r\n return (\r\n <>\r\n setShow(!show)}>\r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n getActiveTabNodeId = () => {\r\n const foodItemCategories = this.state.restaurantDetails.foodItemCategories;\r\n const defaultItem = foodItemCategories.find((item) => {\r\n return item.isDefaultSelection === true;\r\n });\r\n if (defaultItem) {\r\n return defaultItem.nodeId;\r\n } else {\r\n return \"\";\r\n }\r\n };\r\n onTabChange = () => {\r\n this.checkAndRefreshScreenTime();\r\n };\r\n getTab() {\r\n const activeTabNodeId = this.getActiveTabNodeId();\r\n return (\r\n \r\n
\r\n {this.state.restaurantDetails && this.getTab()}\r\n \r\n {this.state.restaurantDetails &&\r\n this.state.restaurantDetails.restaurantName}\r\n
\r\n\r\n {this.state.isShowRestaurantWaitingTime\r\n ? this.state.restaurantWaitingTimeMessage\r\n : this.state.restaurantDetails &&\r\n \"Ready \" + this.state.restaurantDetails.pickupTime}\r\n {this.state.restaurantDetails && (\r\n
\r\n \r\n {option.name}\r\n
\r\n {/* */}\r\n \r\n {/* */}\r\n
\r\n );\r\n }\r\n\r\n getFooterClasses() {\r\n let classes = \"footer\";\r\n classes += this.props.isDisplayFooter ? \" show\" : \"\";\r\n return classes;\r\n }\r\n\r\n getTotalAmount() {\r\n return formatPrice(this.props.amount); // (this.amount += Number(this.props.amount));\r\n }\r\n}\r\n\r\nexport default Footer;\r\n","import React, { Component, Fragment } from \"react\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { Link } from \"react-router-dom\";\r\nimport foodIcon from \"../../assets/images/food.png\";\r\nimport { FoodItemCategory } from \"../../Models/FoodItemCategory\";\r\nimport { CommonResponse } from \"../../Models/CommonResponse\";\r\nimport CartExpirationDialog from \"../../Utility/CartExpirationDialog\";\r\nimport { storage } from \"../../Utility/CartStorage\";\r\nimport { Storage } from \"../../Utility/Storage\";\r\nimport { formatPrice } from \"../../Utility/Common\";\r\nimport {\r\n ExpiryCheck_IntervalMinutes,\r\n KIOSKSetting,\r\n} from \"../../Utility/Config\";\r\nimport { get, post } from \"../../Utility/HttpService\";\r\nimport {\r\n getFoodItems,\r\n checkCartIdExists,\r\n getRestarurantInfo,\r\n getSettingInfo,\r\n getImage,\r\n} from \"../../Utility/URLService\";\r\nimport Header from \"../Header/NavigationHeader\";\r\nimport Footer from \"./Footer\";\r\nimport Cart from \"../../components/Cart/Cart\";\r\nimport QuantityInfoDialog from \"../QuantityInfo/QuantityInfo\";\r\nimport Spinner from \"../../Utility/Spinner\";\r\n\r\nclass ExpandedMenu extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isAvailable: false,\r\n count: 0,\r\n totalPrice: 0,\r\n navigateFrom: \"expanded-menu\",\r\n restaurantNodeId: 0, //storage.getRestaurantInfo().nodeId,\r\n menuNodeId: props.match.params.menuNodeId,\r\n Modal: {\r\n visible: false,\r\n cartRemoval: false,\r\n closeEventCallBack: this.expirationModalCloseCallback,\r\n },\r\n cartModal: {\r\n visible: false,\r\n },\r\n quantityModal: {\r\n visible: false,\r\n onCloseEventCallBack: this.quantityModalCloseCallBack,\r\n quantity: 0,\r\n },\r\n spinner: {\r\n show: false,\r\n //handleClose: \"\",\r\n },\r\n heading: \"SELECT YOUR ITEMS\",\r\n kioskSetting: JSON.parse(Storage.getItem(KIOSKSetting)),\r\n screenRefreshTime: 0,\r\n isRefreshScreen: false,\r\n };\r\n }\r\n\r\n showSpinner = (show) => {\r\n let spinner = this.state.spinner;\r\n spinner.show = show;\r\n this.setState({ spinner });\r\n };\r\n\r\n componentWillMount() {\r\n const menuNodeId = this.props.match.params.menuNodeId;\r\n if (isNaN(menuNodeId)) {\r\n this.refreshScreen(true);\r\n } else this.checkRestaurantsInfo(menuNodeId);\r\n //storage.updateMenuNodeId(menuNodeId);\r\n }\r\n\r\n checkRestaurantsInfo = (menuNodeId) => {\r\n //const info = storage.getRestaurantInfo();\r\n //if (!info) {\r\n //check restaurant info not exists in session storage\r\n get(getRestarurantInfo + menuNodeId)\r\n .then((result) => result.data)\r\n .then((data: any) => {\r\n if (data && data.status) {\r\n let restaurantInfo = data.data;\r\n Storage.updateRestaurantInfo(JSON.stringify(restaurantInfo));\r\n storage.updateMenuNodeId(menuNodeId);\r\n this.setState({ restaurantNodeId: restaurantInfo.nodeId });\r\n this.getFoodCategoryList();\r\n } else {\r\n this.refreshScreen(true);\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error && error.message);\r\n this.refreshScreen(true);\r\n });\r\n // } else {\r\n // this.setState({ restaurantNodeId: info.nodeId });\r\n // }\r\n //storage.updateMenuNodeId(menuNodeId);\r\n };\r\n\r\n quantityModalCloseCallBack = () => {\r\n let forceReload = false;\r\n let quantityModal = this.state.quantityModal;\r\n if (quantityModal.quantity === 0) forceReload = true;\r\n if (forceReload) {\r\n this.getFoodCategoryList();\r\n }\r\n quantityModal.visible = false;\r\n quantityModal.quantity = 0;\r\n this.setState({\r\n quantityModal,\r\n });\r\n };\r\n\r\n componentDidMount() {\r\n //this.getFoodCategoryList();\r\n this.cartExpiryTimeOut = setInterval(\r\n this.checkCartExpiryTimeOut,\r\n ExpiryCheck_IntervalMinutes * 60 * 1000\r\n );\r\n storage.initializeCart();\r\n this.getCartCount();\r\n this.getQueryParams();\r\n }\r\n getQueryParams = () => {\r\n if (window.location.search) {\r\n const queryParams = new URLSearchParams(window.location.search);\r\n if (queryParams) {\r\n let kioskValue = queryParams.get(\"kiosk\");\r\n if (kioskValue && kioskValue.toString().toLowerCase() === \"true\") {\r\n this.checkAndGetKioskSetting();\r\n }\r\n }\r\n } else {\r\n this.checkAndRedirectToMainPage();\r\n }\r\n };\r\n checkAndGetKioskSetting = () => {\r\n let { kioskSetting, menuNodeId } = this.state;\r\n if (kioskSetting) {\r\n kioskSetting[\"IsKioskActive\"] = true;\r\n kioskSetting[\"RedirectUrl\"] = `/food-categories/${menuNodeId}?kiosk=true`;\r\n this.SaveKIOSKInfoIntoStorage(kioskSetting);\r\n } else {\r\n this.getSettingInfo(\"kiosksetting\");\r\n }\r\n };\r\n getSettingInfo = (settingName) => {\r\n let { menuNodeId } = this.state;\r\n let url = `${getSettingInfo}${settingName}`;\r\n get(url)\r\n .then((result) => result.data)\r\n .then((data) => {\r\n if (data) {\r\n let kioskSetting = data;\r\n if (kioskSetting) {\r\n kioskSetting[\"IsKioskActive\"] = true;\r\n kioskSetting[\r\n \"RedirectUrl\"\r\n ] = `/food-categories/${menuNodeId}?kiosk=true`;\r\n this.SaveKIOSKInfoIntoStorage(kioskSetting);\r\n }\r\n }\r\n });\r\n };\r\n SaveKIOSKInfoIntoStorage = (kioskSetting) => {\r\n this.setState({ kioskSetting }, () => {\r\n this.checkAndRedirectToMainPage();\r\n });\r\n Storage.setItem(KIOSKSetting, JSON.stringify(kioskSetting));\r\n };\r\n getMealTypeAvailableConfig = () => {\r\n let isAvailable = true;\r\n const restaurantDetails = storage.getRestaurantInfo();\r\n const foodItemCategories = restaurantDetails.foodItemCategories;\r\n foodItemCategories.some((foodItemCategory) => {\r\n const foodItems = foodItemCategory.foodItems;\r\n const item = foodItems.filter((foodItem) => {\r\n return foodItem.nodeId.toString() === restaurantDetails.menuNodeId;\r\n });\r\n if (item && item.length === 1) {\r\n isAvailable = foodItemCategory.isAvailable;\r\n return true;\r\n }\r\n });\r\n this.setState({ isAvailable });\r\n };\r\n\r\n getFoodCategoryList() {\r\n this.showSpinner(true);\r\n const restaurantInfo = storage.getRestaurantInfo();\r\n if (restaurantInfo) {\r\n get(\r\n getFoodItems +\r\n \"?restaurantNodeId=\" +\r\n restaurantInfo.nodeId +\r\n \"&nodeId=\" +\r\n restaurantInfo.menuNodeId\r\n )\r\n .then((result) => result.data)\r\n .then((data) => {\r\n if (data && data.status) {\r\n this.setState({ foodItemCategory: data.data }, () => {\r\n let foodItemCategory = this.state.foodItemCategory;\r\n let foodItems = foodItemCategory.foodItems;\r\n if (foodItems && foodItems.length > 0) {\r\n foodItems.map((a) => {\r\n if (a.imagePath) {\r\n get(getImage + a.imagePath, \"blob\")\r\n .then((result) => result.data)\r\n .then((data) => {\r\n let url = window.URL.createObjectURL(new Blob([data]));\r\n a[\"imageSrc\"] = url;\r\n this.setState({ foodItemCategory });\r\n });\r\n }\r\n this.setState({ foodItemCategory });\r\n this.getMealTypeAvailableConfig();\r\n this.showSpinner(false);\r\n });\r\n } else {\r\n this.getMealTypeAvailableConfig();\r\n this.showSpinner(false);\r\n }\r\n });\r\n // this.getMealTypeAvailableConfig();\r\n // this.showSpinner(false);\r\n } else {\r\n this.refreshScreen(true);\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error && error.message);\r\n this.refreshScreen(true);\r\n });\r\n }\r\n }\r\n\r\n getCartCount = () => {\r\n let cartInfo = storage.info();\r\n this.setState({\r\n count: cartInfo.totalQuantityCount,\r\n totalPrice: cartInfo.totalPrice,\r\n });\r\n };\r\n\r\n onViewCart = () => {\r\n //this.state.screenRefreshTime > 0 && clearTimeout(this.confirmationTimer);\r\n this.checkAndRefreshScreenTime();\r\n let cartInfo = storage.info();\r\n if (cartInfo.totalCount > 0) {\r\n get(checkCartIdExists + \"?cartId=\" + cartInfo.cartId)\r\n .then((result) => result.data)\r\n .then((data: CommonResponse) => {\r\n if (data.status) {\r\n // cartId exists\r\n let cartModal = {\r\n ...this.state.cartModal,\r\n visible: true,\r\n };\r\n this.setState({ cartModal });\r\n } else {\r\n // cartId not exists\r\n this.showCartRemovalMessage();\r\n }\r\n });\r\n }\r\n };\r\n\r\n showCartRemovalMessage = () => {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: true,\r\n cartRemoval: true,\r\n };\r\n this.setState({ Modal });\r\n };\r\n confirmationTimer = () => {\r\n this.confirmationTimer = setInterval(() => {\r\n let { screenRefreshTime } = this.state;\r\n if (screenRefreshTime === 0) {\r\n this.refreshScreen();\r\n } else {\r\n screenRefreshTime = screenRefreshTime - 1;\r\n this.setState({ screenRefreshTime });\r\n }\r\n }, 1000);\r\n };\r\n checkAndRedirectToMainPage = () => {\r\n let { kioskSetting, screenRefreshTime } = this.state;\r\n if (kioskSetting && kioskSetting.IsKioskActive) {\r\n screenRefreshTime = parseInt(kioskSetting.MenuSelection);\r\n if (screenRefreshTime > 0) {\r\n this.setState({ screenRefreshTime }, () => {\r\n this.confirmationTimer();\r\n });\r\n }\r\n }\r\n };\r\n refreshScreen = (toMainUrl = false) => {\r\n let redirectURL = toMainUrl ? \"/\" : Storage.getRedirectURL();\r\n if (redirectURL && redirectURL.includes(\"/food-categories/\"))\r\n this.closeAllModal();\r\n\r\n this.setState({ isRefreshScreen: true }, () => {\r\n this.removeCartItemsFromStorage();\r\n this.props.history && this.props.history.push(redirectURL);\r\n });\r\n };\r\n removeCartItemsFromStorage = () => {\r\n storage.removeAll();\r\n };\r\n closeAllModal = () => {\r\n let { quantityModal, cartModal } = this.state;\r\n cartModal.visible = false;\r\n quantityModal.visible = false;\r\n quantityModal.quantity = 0;\r\n this.setState({ cartModal, quantityModal });\r\n };\r\n checkAndRefreshScreenTime = () => {\r\n let { screenRefreshTime, kioskSetting } = this.state;\r\n if (kioskSetting && kioskSetting.IsKioskActive) {\r\n screenRefreshTime =\r\n parseInt(kioskSetting.MenuSelection) > 0\r\n ? parseInt(kioskSetting.MenuSelection)\r\n : 0;\r\n this.setState({ screenRefreshTime });\r\n }\r\n };\r\n render() {\r\n return (\r\n {this.getTotalAmount()}
\r\n \r\n \r\n \r\n )}\r\n {this.state.count > 0 && (\r\n
\r\n );\r\n }\r\n\r\n getMenuList() {\r\n return this.state.foodItemCategory.foodItems.map((item, key) => {\r\n return (\r\n \r\n
\r\n {this.state.foodItemCategory &&\r\n this.state.foodItemCategory.foodItems &&\r\n this.getMenuList()}\r\n {this.state.cartModal.visible && (\r\n \r\n \r\n {this.state.foodItemCategory && this.state.foodItemCategory.name}\r\n
this.onViewCart()}>\r\n 0}\r\n />\r\n
\r\n )}\r\n {this.state.Modal.visible && (\r\n \r\n
\r\n \r\n \r\n {item.imageSrc && (\r\n \r\n 
\r\n \r\n )}\r\n
\r\n \r\n
\r\n {item.name}
\r\n {formatPrice(item.price)}
\r\n {item.description}
\r\n {this.state.isAvailable && this.getButtons(item)}\r\n\r\n {!item.isCustomizable && this.getAddToOrderButton(item)}\r\n {item.isCustomizable && this.getCustomizationButtons(item)}\r\n
\r\n );\r\n }\r\n\r\n handleAddtoCartClick = (foodItem) => {\r\n this.showSpinner(true);\r\n storage.verifyFoodItemWithMax4Sale(\r\n foodItem,\r\n 1,\r\n this.handleMax4SaleSuccessCallBack,\r\n this.handleMax4SaleFailureCallBack\r\n //this.addtoCartClickCount\r\n );\r\n this.checkAndRefreshScreenTime();\r\n };\r\n\r\n handleMax4SaleFailureCallBack = (response) => {\r\n if (response.message === \"cartId_unavailable\") {\r\n this.showCartRemovalMessage();\r\n } else {\r\n let quantity = 0;\r\n if (response.data) {\r\n const quantityJson = JSON.parse(response.data);\r\n quantity = quantityJson.availableQty;\r\n }\r\n let quantityModal = this.state.quantityModal;\r\n quantityModal.quantity = quantity;\r\n quantityModal.visible = true;\r\n this.setState({ quantityModal });\r\n }\r\n this.showSpinner(false);\r\n };\r\n\r\n handleMax4SaleSuccessCallBack = (foodItem, quantity) => {\r\n const storedItem = storage.getFoodItem(foodItem.nodeId);\r\n if (storedItem && storedItem.length > 0) {\r\n let selectedItem = storedItem.filter((item) => {\r\n return item.customizations.length === 0;\r\n });\r\n if (selectedItem && selectedItem.length === 1) {\r\n quantity = selectedItem[0].quantity + quantity;\r\n }\r\n }\r\n foodItem.quantity = quantity;\r\n storage.update(foodItem);\r\n this.getCartCount();\r\n this.showSpinner(false);\r\n };\r\n\r\n onCartScreenClose = () => {\r\n this.checkAndRefreshScreenTime();\r\n let cartModal = {\r\n ...this.state.cartModal,\r\n visible: false,\r\n };\r\n this.setState({ cartModal });\r\n this.getCartCount();\r\n this.getFoodCategoryList();\r\n };\r\n\r\n expirationModalCloseCallback = (type) => {\r\n if (this.state.Modal.cartRemoval) {\r\n storage.reInitCartWhenCartIdInvalid();\r\n } else {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: false,\r\n };\r\n this.setState({ Modal });\r\n this.getCartCount();\r\n }\r\n if (type === \"Expired\") {\r\n let redirectURL = Storage.getRedirectURL();\r\n this.props.history.push(redirectURL);\r\n }\r\n };\r\n\r\n componentWillUnmount() {\r\n clearInterval(this.cartExpiryTimeOut);\r\n this.state.screenRefreshTime > 0 && clearTimeout(this.confirmationTimer);\r\n }\r\n\r\n checkCartExpiryTimeOut = () => {\r\n if (!this.state.Modal.visible) {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: false,\r\n };\r\n if (storage.checkCartItemsExpiration()) {\r\n Modal.visible = true;\r\n }\r\n this.setState({ Modal });\r\n }\r\n };\r\n}\r\n\r\nexport default ExpandedMenu;\r\n","import React, { Component, Fragment } from \"react\";\r\nimport Header from \"../Header/NavigationHeader\";\r\nimport food from \"../../assets/images/food.svg\";\r\nimport { Form, Button } from \"react-bootstrap\";\r\nimport { faPlus, faMinus } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { FNBAppBaseURL, KIOSKSetting } from \"../../Utility/Config\";\r\nimport {\r\n getFoodItemWithCustomization,\r\n checkCartIdExists,\r\n} from \"../../Utility/URLService\";\r\nimport { get } from \"../../Utility/HttpService\";\r\nimport { formatPrice } from \"../../Utility/Common\";\r\nimport { storage } from \"../../Utility/CartStorage\";\r\nimport { FoodItemWithCustomization } from \"../../Models/FoodItemWithCustomization\";\r\nimport { CommonResponse } from \"../../Models/CommonResponse\";\r\nimport CartExpirationDialog from \"../../Utility/CartExpirationDialog\";\r\nimport { ExpiryCheck_IntervalMinutes } from \"../../Utility/Config\";\r\nimport QuantityInfoDialog from \"../QuantityInfo/QuantityInfo\";\r\nimport Cart from \"../../components/Cart/Cart\";\r\nimport { Storage as _storage } from \"../../Utility/Storage\";\r\n\r\nclass Customize extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.restaurantInfo = storage.getRestaurantInfo();\r\n this.state = {\r\n count: 0,\r\n navigateFrom: \"customize\",\r\n previousPath: `/food-categories/${this.restaurantInfo.menuNodeId}`,\r\n foodItemQtyCount: 0,\r\n redirect: false,\r\n foodItem: {},\r\n customizations: [],\r\n Modal: {\r\n visible: false,\r\n cartRemoval: false,\r\n closeEventCallBack: this.expirationModalCloseCallback,\r\n },\r\n cartModal: {\r\n visible: false,\r\n },\r\n heading: \"SELECT YOUR ITEMS\",\r\n quantityModal: {\r\n visible: false,\r\n onCloseEventCallBack: this.quantityModalCloseCallBack,\r\n quantity: 0,\r\n },\r\n kioskSetting: JSON.parse(_storage.getItem(KIOSKSetting)),\r\n screenRefreshTime: 0,\r\n isRefreshScreen: false,\r\n };\r\n this.getFoodItemWithCustomization(\r\n props.match.params.nodeId,\r\n props.match.params.customNodeId\r\n );\r\n }\r\n\r\n quantityModalCloseCallBack = () => {\r\n this.checkAndRefreshScreenTime();\r\n let forceReload = false;\r\n let quantityModal = this.state.quantityModal;\r\n if (quantityModal.quantity === 0) forceReload = true;\r\n if (forceReload) {\r\n //this.props.history.push(this.state.previousPath);\r\n } else {\r\n quantityModal.visible = false;\r\n quantityModal.quantity = 0;\r\n this.setState({\r\n quantityModal,\r\n });\r\n }\r\n };\r\n\r\n expirationModalCloseCallback = (type) => {\r\n if (this.state.Modal.cartRemoval) {\r\n storage.reInitCartWhenCartIdInvalid();\r\n } else {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: false,\r\n };\r\n this.setState({ Modal });\r\n this.getCartCount(true);\r\n }\r\n if (type === \"Expired\") {\r\n let redirectURL = _storage.getRedirectURL();\r\n this.props.history.push(redirectURL);\r\n }\r\n };\r\n confirmationTimer = () => {\r\n this.confirmationTimer = setInterval(() => {\r\n let { screenRefreshTime } = this.state;\r\n if (screenRefreshTime === 0) {\r\n this.refreshScreen();\r\n } else {\r\n screenRefreshTime = screenRefreshTime - 1;\r\n this.setState({ screenRefreshTime });\r\n }\r\n }, 1000);\r\n };\r\n checkAndRedirectToMainPage = () => {\r\n let { kioskSetting, screenRefreshTime } = this.state;\r\n if (kioskSetting && kioskSetting.IsKioskActive) {\r\n screenRefreshTime = parseInt(kioskSetting.MenuSelection);\r\n if (screenRefreshTime > 0) {\r\n this.setState({ screenRefreshTime }, () => {\r\n this.confirmationTimer();\r\n });\r\n }\r\n }\r\n };\r\n refreshScreen = (toMainUrl = false) => {\r\n let redirectURL = toMainUrl ? \"/\" : _storage.getRedirectURL();\r\n this.setState({ isRefreshScreen: true }, () => {\r\n this.removeCartItemsFromStorage();\r\n this.props.history && this.props.history.push(redirectURL);\r\n });\r\n };\r\n removeCartItemsFromStorage = () => {\r\n storage.removeAll();\r\n };\r\n checkAndRefreshScreenTime = () => {\r\n let { screenRefreshTime, kioskSetting } = this.state;\r\n if (kioskSetting && kioskSetting.IsKioskActive) {\r\n screenRefreshTime =\r\n parseInt(kioskSetting.MenuSelection) > 0\r\n ? parseInt(kioskSetting.MenuSelection)\r\n : 0;\r\n this.setState({ screenRefreshTime });\r\n }\r\n };\r\n componentDidMount() {\r\n this.getCartCount();\r\n this.cartExpiryTimeOut = setInterval(\r\n this.checkCartExpiryTimeOut,\r\n ExpiryCheck_IntervalMinutes * 60 * 1000\r\n );\r\n this.checkAndRedirectToMainPage();\r\n }\r\n\r\n componentWillUnmount() {\r\n clearInterval(this.cartExpiryTimeOut);\r\n this.state.screenRefreshTime > 0 && clearTimeout(this.confirmationTimer);\r\n }\r\n\r\n checkCartExpiryTimeOut = () => {\r\n if (!this.state.Modal.visible) {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: false,\r\n };\r\n if (storage.checkCartItemsExpiration()) {\r\n Modal.visible = true;\r\n }\r\n this.setState({ Modal });\r\n }\r\n };\r\n\r\n checkPreviousSelections = () => {\r\n if (this.props.match.params.id) {\r\n let selectedItem = storage.getFoodItem(null, this.props.match.params.id);\r\n // check previous selection with customization\r\n if (selectedItem && selectedItem.length === 1) {\r\n let _selectedItem = selectedItem[0];\r\n let foodItem = this.state.foodItem;\r\n foodItem.id = this.props.match.params.id;\r\n foodItem.quantity = _selectedItem.quantity;\r\n this.setState({\r\n foodItem,\r\n foodItemQtyCount: _selectedItem.quantity,\r\n });\r\n }\r\n\r\n if (\r\n selectedItem &&\r\n selectedItem.length === 1 &&\r\n selectedItem[0].customizations.length > 0\r\n ) {\r\n selectedItem = selectedItem[0];\r\n let customizations = this.state.customizations;\r\n let selectedCustomizations = selectedItem.customizations;\r\n // let foodItem = this.state.foodItem;\r\n // foodItem.quantity = selectedItem.quantity;\r\n\r\n customizations.forEach((customization) => {\r\n const customizationNodeId = customization.nodeId;\r\n let selectedCustomization = selectedCustomizations.filter((item) => {\r\n return item.nodeId.toString() === customizationNodeId.toString();\r\n });\r\n if (\r\n selectedCustomization == null ||\r\n selectedCustomization.length === 0\r\n ) {\r\n return;\r\n } else {\r\n selectedCustomization = selectedCustomization[0];\r\n }\r\n\r\n if (\r\n customization.customizationOptions.length > 0 &&\r\n selectedCustomization.customizationOptions.length > 0\r\n ) {\r\n customization.customizationOptions.filter((option) => {\r\n let optionNodeId = option.nodeId;\r\n option.isSelected = false;\r\n const selectedOption =\r\n selectedCustomization.customizationOptions.filter(\r\n (selectedOption) => {\r\n return (\r\n selectedOption.nodeId.toString() ===\r\n optionNodeId.toString()\r\n );\r\n }\r\n );\r\n if (selectedOption.length === 1) {\r\n option.isSelected = true;\r\n }\r\n return option;\r\n });\r\n } else if (selectedCustomization.hasOwnProperty(\"textBoxValue\")) {\r\n // If no customization option means, check textbox values in previous selection\r\n document.getElementById(customizationNodeId).value =\r\n selectedCustomization.textBoxValue;\r\n }\r\n });\r\n this.setState({\r\n //foodItem,\r\n customizations,\r\n //foodItemQtyCount: selectedItem.quantity,\r\n });\r\n }\r\n }\r\n };\r\n\r\n getFoodItemWithCustomization(nodeId, customizeNodeId) {\r\n get(\r\n getFoodItemWithCustomization +\r\n \"?restaurantNodeId=\" +\r\n this.restaurantInfo.nodeId +\r\n \"&menuNodeId=\" +\r\n this.restaurantInfo.menuNodeId +\r\n \"&nodeId=\" +\r\n nodeId +\r\n \"&customizeNodeId=\" +\r\n customizeNodeId\r\n )\r\n .then((result) => result.data)\r\n .then((data: FoodItemWithCustomization) => {\r\n let model = data;\r\n if (\r\n model.foodItem &&\r\n model.foodItem.hasOwnProperty(\"customizeNodeId\") &&\r\n model.customizations.length > 0\r\n ) {\r\n model.foodItem.customizeNodeId = Number(customizeNodeId);\r\n this.setState({\r\n foodItem: model.foodItem ? model.foodItem : {},\r\n customizations: model.customizations ? model.customizations : [],\r\n foodItemQtyCount: model.foodItem.minimumQuantity,\r\n });\r\n this.checkPreviousSelections();\r\n }\r\n })\r\n .catch((error) => {\r\n console.log(error && error.message);\r\n this.refreshScreen(true);\r\n });\r\n }\r\n\r\n getCartCount = () => {\r\n let cartInfo = storage.info();\r\n this.setState({\r\n count: cartInfo.totalCount,\r\n totalPrice: cartInfo.totalPrice,\r\n });\r\n };\r\n\r\n getElementType = (required, selectAllByDefault) => {\r\n let controlType = \"checkbox\";\r\n if (!selectAllByDefault && required) controlType = \"radio\";\r\n\r\n return controlType;\r\n };\r\n\r\n validateOptionSelections = () => {\r\n const customizations = this.state.customizations;\r\n let validSelections = true;\r\n customizations.forEach(function (customization) {\r\n if (validSelections) {\r\n let required = customization.required;\r\n const selectedOptions = customization.customizationOptions.filter(\r\n (option) => {\r\n return option.isSelected === true;\r\n }\r\n );\r\n if (required && selectedOptions.length === 0) validSelections = false;\r\n }\r\n });\r\n return validSelections;\r\n };\r\n\r\n customizationOptionChange = (index, optionIndex, optionNodeId) => {\r\n this.checkAndRefreshScreenTime();\r\n let customizations = this.state.customizations;\r\n let required = customizations[index].required;\r\n if (required) {\r\n // under this customization only one option is selectable\r\n customizations[index].customizationOptions.filter((item) => {\r\n if (item.nodeId === optionNodeId) item.isSelected = true;\r\n else item.isSelected = false;\r\n return item;\r\n });\r\n } else {\r\n customizations[index].customizationOptions[optionIndex].isSelected =\r\n !customizations[index].customizationOptions[optionIndex].isSelected;\r\n }\r\n this.setState({\r\n customizations,\r\n });\r\n };\r\n\r\n generateCustomization = () => {\r\n const optionsList = this.state.customizations.map((item, index) => {\r\n let customizationOptions = item.customizationOptions;\r\n let controlType = this.getElementType(\r\n item.required,\r\n item.selectAllByDefault\r\n );\r\n return (\r\n \r\n
\r\n {customizationOptions.length > 0 && (\r\n \r\n {item.name}\r\n {item.required ? Required : null}\r\n
\r\n {item.required ? (\r\nPlease Choose 1
\r\n ) : null}\r\n\r\n
\r\n ))}\r\n \r\n \r\n this.customizationOptionChange(\r\n index,\r\n optionIndex,\r\n option.nodeId\r\n )\r\n }\r\n checked={option.isSelected}\r\n />\r\n {option.price > 0 ? (\r\n
\r\n {option.description && (\r\n {\"+ \" + formatPrice(option.price)}
\r\n ) : null}\r\n{option.description}
\r\n )}\r\n \r\n
\r\n\r\n \r\n \r\n );\r\n }\r\n\r\n handleFoodItemQuantityClick = (value) => {\r\n this.checkAndRefreshScreenTime();\r\n if (\r\n value === \"I\" &&\r\n this.state.foodItem.maximumQuantity < this.state.foodItemQtyCount + 1\r\n )\r\n return false;\r\n if (\r\n value === \"D\" &&\r\n this.state.foodItem.minimumQuantity > this.state.foodItemQtyCount - 1\r\n )\r\n return false;\r\n this.setState({\r\n foodItemQtyCount:\r\n value === \"I\"\r\n ? this.state.foodItemQtyCount + 1\r\n : this.state.foodItemQtyCount - 1,\r\n });\r\n };\r\n\r\n addTocart = () => {\r\n if (this.state.foodItemQtyCount - this.state.foodItem.quantity !== 0) {\r\n storage.verifyFoodItemWithMax4Sale(\r\n this.state.foodItem,\r\n this.state.foodItemQtyCount - this.state.foodItem.quantity,\r\n this.handleMax4SaleSuccessCallBack,\r\n this.handleMax4SaleFailureCallBack\r\n );\r\n } else {\r\n this.handleMax4SaleSuccessCallBack();\r\n }\r\n };\r\n\r\n showCartRemovalMessage = () => {\r\n let Modal = {\r\n ...this.state.Modal,\r\n visible: true,\r\n cartRemoval: true,\r\n };\r\n this.setState({ Modal });\r\n };\r\n\r\n handleMax4SaleSuccessCallBack = () => {\r\n let selectedCustomizations = [];\r\n this.state.customizations.forEach((customization) => {\r\n let _customization = { ...customization };\r\n const options = _customization.customizationOptions;\r\n _customization.customizationOptions = [];\r\n\r\n if (options.length > 0) {\r\n let selectedOptions = options.filter((option) => {\r\n return option.isSelected === true;\r\n });\r\n _customization.customizationOptions = selectedOptions;\r\n } else {\r\n _customization.textBoxValue = \"\";\r\n let value = document.getElementById(_customization.nodeId).value;\r\n if (value) {\r\n _customization.textBoxValue = value;\r\n }\r\n }\r\n selectedCustomizations.push(_customization);\r\n });\r\n let foodItem = this.state.foodItem;\r\n foodItem.quantity = this.state.foodItemQtyCount;\r\n storage.update(foodItem, selectedCustomizations);\r\n this.props.history.push(this.state.previousPath);\r\n };\r\n\r\n handleMax4SaleFailureCallBack = (response) => {\r\n if (response.message === \"cartId_unavailable\") {\r\n this.showCartRemovalMessage();\r\n } else {\r\n let quantity = 0;\r\n if (response.data) {\r\n const quantityJson = JSON.parse(response.data);\r\n quantity = quantityJson.availableQty;\r\n }\r\n let quantityModal = this.state.quantityModal;\r\n quantityModal.quantity = quantity;\r\n quantityModal.visible = true;\r\n this.setState({ quantityModal });\r\n }\r\n };\r\n\r\n onViewCart = () => {\r\n this.checkAndRefreshScreenTime();\r\n let cartInfo = storage.info();\r\n if (cartInfo.totalCount > 0) {\r\n get(checkCartIdExists + \"?cartId=\" + cartInfo.cartId)\r\n .then((result) => result.data)\r\n .then((data: CommonResponse) => {\r\n if (data.status) {\r\n // cartId exists\r\n let cartModal = {\r\n ...this.state.cartModal,\r\n visible: true,\r\n };\r\n this.setState({ cartModal });\r\n } else {\r\n // cartId not exists\r\n this.showCartRemovalMessage();\r\n }\r\n });\r\n }\r\n };\r\n\r\n onCartScreenClose = () => {\r\n this.checkAndRefreshScreenTime();\r\n let cartModal = {\r\n ...this.state.cartModal,\r\n visible: false,\r\n };\r\n this.setState({ cartModal });\r\n };\r\n}\r\n\r\nexport default Customize;\r\n","import React, { Component } from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { faChevronLeft } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { Form, Button } from \"react-bootstrap\";\r\nimport { MembershipKey } from \"../../Utility/Config\";\r\nimport {validateMemberShipNumber} from \"../../Utility/URLService\";\r\nimport { get } from \"../../Utility/HttpService\";\r\nimport { Storage } from '../../Utility/Storage';\r\nimport Spinner from \"../../Utility/Spinner\";\r\n\r\nclass MembershipValidation extends Component { \r\n constructor(props, context) {\r\n super(props, context);\r\n \r\n this.state = {\r\n open: false,\r\n id: null,\r\n membershipNumber: \"\",\r\n isMembershipValid: true,\r\n membership: {},\r\n spinner: {\r\n show: false\r\n }, \r\n };\r\n }\r\n\r\n componentDidMount(){ \r\n let membership = this.getMemberShipData();\r\n membership.isValid = false; \r\n this.setState({ membership }); \r\n };\r\n\r\n showSpinner = (show) => {\r\n let spinner = this.state.spinner; \r\n spinner.show = show; \r\n this.setState({ spinner }); \r\n };\r\n\r\n getMemberShipData = () => {\r\n const _key = this.props.match.params.restaurantNodeId.toString() + MembershipKey;\r\n const membership = Storage.getItem(_key);\r\n return JSON.parse(membership);\r\n }\r\n\r\n validateMemberShip=()=> {\r\n this.showSpinner(true);\r\n return get(\r\n validateMemberShipNumber +\r\n `?membershipNumber=` +\r\n this.state.membershipNumber\r\n )\r\n .then((result) => result.data)\r\n .then((data: any) => {\r\n this.setState({isMembershipValid: data});\r\n if(data === true){\r\n let memberShipData = this.getMemberShipData();\r\n memberShipData.isValid = true;\r\n Storage.setItem(this.props.match.params.restaurantNodeId.toString() + MembershipKey, JSON.stringify(memberShipData));\r\n this.props.history.push('/pickup/'+this.props.match.params.restaurantNodeId);\r\n }\r\n this.showSpinner(false);\r\n });\r\n }\r\n\r\n handleChange(field, e) {\r\n this.setState({ membershipNumber: e.target.value });\r\n }\r\n\r\n renderMemberShipValidationDetails() {\r\n return (\r\n <>\r\n \r\n \r\n this.handleFoodItemQuantityClick(\"D\")}\r\n icon={faMinus}\r\n />\r\n this.handleFoodItemQuantityClick(\"I\")}\r\n icon={faPlus}\r\n />\r\n
\r\n {this.state.foodItemQtyCount}
\r\n{this.state.foodItem.name}
\r\n{formatPrice(this.state.foodItem.price)}
\r\n{this.state.foodItem.description}
\r\n\r\n
\r\n \r\n \r\n );\r\n }\r\n render() {\r\n return (\r\n <>\r\n {this.state.membership.headerText}
\r\n \r\n\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nexport default MembershipValidation;\r\n","import React from \"react\";\r\nimport Dialog from \"@material-ui/core/Dialog\";\r\nimport DialogActions from \"@material-ui/core/DialogActions\";\r\nimport DialogContent from \"@material-ui/core/DialogContent\";\r\nimport DialogTitle from \"@material-ui/core/DialogTitle\";\r\nimport { Button } from \"react-bootstrap\";\r\nimport { formatPrice, roundedGiftCardAmount } from \"../../Utility/Common\";\r\n\r\nexport default function UseGiftCard(props) {\r\n return (\r\n \r\n \r\n
\r\n PICKUP
\r\n {this.props.match.params.restaurantName}
\r\n \r\n {this.state.membership &&\r\n this.renderMemberShipValidationDetails()} \r\n\r\n {/* */}\r\n \r\n {/* */}\r\n
\r\n \r\n The gift card you have entered has a balance of{\" \"}\r\n {formatPrice(roundedGiftCardAmount(props.balance))}\r\n
\r\nEnter your Gift Card Information
\r\n \r\n \r\n Gift Card Number \r\n \r\n \r\n PIN \r\n \r\n
\r\n {!this.state.validation.status && (\r\n 16 Digit Number Required
\r\n4 Digit Number Required
\r\n\r\n {this.state.validation.message}\r\n
\r\n )}\r\n \r\n \r\n {this.state.toaster?.length === 1 && (\r\n
\r\n );\r\n //}\r\n }\r\n\r\n toggleIcon = () => {\r\n this.setState({ faChevronDown: !this.state.faChevronDown });\r\n };\r\n\r\n getReviewSection() {\r\n return (\r\n \r\n
\r\n );\r\n })}\r\n \r\n \r\n );\r\n })}\r\n \r\n
\r\n {this.getDiscountContainerForItem(item)}\r\n {item.customizations.map((customization, key) => {\r\n return (\r\n \r\n {item.name} ({item.quantity})\r\n
\r\n{formatPrice(item.actualPrice * item.quantity)}
\r\n\r\n
\r\n {customization.customizationOptions.length ===\r\n 0 && (\r\n {customization.name.replace(\"Select a\", \"\")}:
\r\n\r\n {customization.customizationOptions.map(\r\n (option, key) => {\r\n return (\r\n \r\n {option.name}\r\n {option.price >= 1 && (\r\n \r\n {formatPrice(\r\n option.actualPrice * item.quantity\r\n )}\r\n \r\n )}\r\n {this.getDiscountContainerForItem(option)}\r\n
\r\n );\r\n }\r\n )}\r\n \r\n {customization.textBoxValue}\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n {this.getDiscountContainerForTotal()}\r\n Subtotal
\r\n{this.calculateSubTotal()}
\r\n\r\n
\r\n Sales Tax
\r\n{this.calculateSalesTax()}
\r\n\r\n
\r\n Tip Amount
\r\n{this.getTipAmount()}
\r\n\r\n
\r\n {/* Total
\r\n{formatPrice(this.calculateTotal())}
\r\n\r\n \r\n
*/}\r\n Pickup Details: Today at 12:50pm(To-Do:Yet to work)
\r\n\r\n
\r\n );\r\n }\r\n\r\n onChangeSMSEnabled = () => {\r\n let { isSMSEnabled } = this.state;\r\n this.setState({ isSMSEnabled: !isSMSEnabled });\r\n };\r\n onChangePayAtPickupEnabled = () => {\r\n let {\r\n isPayAtPickupEnabled,\r\n cardDetails,\r\n giftCardInfo,\r\n guestGiftCards,\r\n submitOrderButtonDisabled,\r\n cardOnFile,\r\n } = this.state;\r\n guestGiftCards.map((a) => {\r\n a.usingBalance = 0;\r\n });\r\n giftCardInfo.giftCards = [];\r\n cardDetails = this.getEmptyCardDetails();\r\n CardSwipe.disable();\r\n this.checkAndRefreshScreenTime();\r\n this.setState({\r\n isPayAtPickupEnabled: !isPayAtPickupEnabled,\r\n cardDetails,\r\n submitOrderButtonDisabled:\r\n isPayAtPickupEnabled && !cardOnFile.isCardOnFileSelected ? true : false,\r\n giftCardInfo,\r\n guestGiftCards,\r\n });\r\n };\r\n\r\n getYourDetails() {\r\n return (\r\n Pickup Details
\r\n\r\n {/* Ready today by 12:50pm(To-Do) */}\r\n {this.state.isShowRestaurantWaitingTime\r\n ? this.state.restaurantWaitingTimeMessage\r\n : this.state.pickupTime &&\r\n \"Ready for pickup \" + this.state.pickupTime}\r\n
\r\n {this.state.restaurantLocation &&\r\n \"Location: \" + this.state.restaurantLocation}\r\n
\r\n\r\n \r\n \r\n First name \r\n \r\n \r\n Last name \r\n \r\n\r\n \r\n Email address \r\n \r\n \r\n Phone Number \r\n \r\n\r\n {this.state.passInfo?.phoneNumber && (\r\n \r\n this.onChangeSMSEnabled()}\r\n checked={this.state.isSMSEnabled}\r\n />\r\n {this.state.smsConditionInfo && (\r\n \r\n )}\r\n {this.state.restaurantDetails.isReservationTableEnabled && (\r\n <>\r\n \r\n {this.state.restaurantDetails.restaurant_unitid !== 1 && (\r\n \r\n this.reservationEnableRadioSelection(\"toGo\")\r\n }\r\n checked={this.state.deliverToTable === false}\r\n />\r\n )}\r\n \r\n this.reservationEnableRadioSelection(\"deliverToTable\")\r\n }\r\n checked={this.state.deliverToTable === true}\r\n />\r\n \r\n\r\n {this.state.deliverToTable && (\r\n \r\n Table Number \r\n \r\n \r\n Select Table Number\r\n \r\n {this.state.tableNumbers?.map((key) => {\r\n return (\r\n \r\n {key}\r\n \r\n );\r\n })}\r\n \r\n \r\n )}\r\n \r\n )}\r\n \r\n \r\n
\r\n )}\r\n Your Details
\r\nRequired
\r\nRequired
\r\nRequired
\r\nOptional
\r\nRequired
\r\nRequired
\r\n\r\n \r\n \r\n First name \r\n \r\n \r\n Last name \r\n \r\n {isEmailOptionalInKiosk ? (\r\n <>\r\n \r\n Phone Number \r\n \r\n \r\n Email address \r\n \r\n \r\n ) : (\r\n <>\r\n \r\n Email address \r\n \r\n \r\n Phone Number \r\n \r\n \r\n )}\r\n\r\n {this.state.passInfo.phoneNumber && (\r\n \r\n this.onChangeSMSEnabled()}\r\n checked={this.state.isSMSEnabled}\r\n />\r\n {this.state.smsConditionInfo && (\r\n \r\n )}\r\n {this.state.restaurantDetails.isReservationTableEnabled && (\r\n <>\r\n \r\n {this.state.restaurantDetails.restaurant_unitid !== 1 && (\r\n \r\n this.reservationEnableRadioSelection(\"toGo\")\r\n }\r\n checked={this.state.deliverToTable === false}\r\n />\r\n )}\r\n \r\n this.reservationEnableRadioSelection(\"deliverToTable\")\r\n }\r\n checked={this.state.deliverToTable === true}\r\n />\r\n \r\n\r\n {this.state.deliverToTable && (\r\n \r\n Table Number \r\n \r\n \r\n {this.state.tableNumbers?.map((key) => {\r\n return (\r\n \r\n {key}\r\n \r\n );\r\n })}\r\n \r\n \r\n )}\r\n \r\n )}\r\n \r\n \r\n
\r\n Your Details
\r\nRequired
\r\nRequired
\r\nRequired
\r\nOptional
\r\nRequired
\r\nOptional
\r\nRequired
\r\nRequired
\r\n\r\n
\r\n ) : null}\r\n \r\n
\r\n Your Details
\r\nthis.editYourDetails()}>Edit
\r\n\r\n {this.state.passInfo.firstName} {this.state.passInfo.lastName}\r\n
\r\n{this.state.passInfo.emailId}
\r\n{this.state.passInfo.phoneNumber}
\r\n\r\n this.handleGiftCardInfoDialog()}\r\n handleGiftCardBalance={this.handleGiftCards}\r\n handleScreenRefreshTime={this.checkAndRefreshScreenTime}\r\n />\r\n )}\r\n {this.getUsedGiftCardBalance() > 0 && (\r\n <>\r\n this.onChangePayAtPickupEnabled()}\r\n checked={this.state.isPayAtPickupEnabled}\r\n />\r\n {!this.state.isPayAtPickupEnabled && (\r\n this.handleGiftCardInfoDialog()}\r\n >\r\n
\r\n \r\n )\r\n ) : null}\r\n {this.getCreditCardForm()}\r\n \r\n );\r\n }\r\n kioskYourDetails() {\r\n this.setState({ isPaymentInfoShowing: false });\r\n }\r\n getPaymentInformationWithKiosk() {\r\n let usedGiftCardBalance = this.getUsedGiftCardBalance();\r\n let total = this.calculateTotal();\r\n let balanceDue = this.calculateBalanceDue();\r\n return (\r\n Payment Information
\r\n\r\n
{\" \"}\r\n {this.state.giftCardInfo.dialogOpen && (\r\n Total Due
\r\n{formatPrice(this.calculateTotal())}
\r\n\r\n
\r\n Gift Card Payment
\r\n {this.getUsedGiftCardBalance() >= this.calculateTotal() ? (\r\n{formatPrice(this.calculateTotal())}
\r\n ) : (\r\n{formatPrice(this.getUsedGiftCardBalance())}
\r\n )}\r\n\r\n
\r\n \r\n )}\r\n {this.state.restaurantDetails.isRestaurantPayAtPickup && (\r\n <>\r\n Remaining Balance Due
\r\n{formatPrice(this.calculateBalanceDue())}
\r\n\r\n
\r\n )}\r\n \r\n )}\r\n {!this.state.isPayAtPickupEnabled ? (\r\n this.state.guestGiftCards &&\r\n this.state.guestGiftCards.length > 0 &&\r\n this.state.passInfo.isPassApplied ? (\r\n OR
\r\n \r\n this.handleGiftCardInfoDialog()}\r\n >\r\n Enter a new gift card\r\n \r\n )}\r\n
\r\n ) : (\r\n <>\r\n Use my gift card(s)
\r\n\r\n {this.state.guestGiftCards &&\r\n this.state.guestGiftCards.length > 0 &&\r\n this.state.guestGiftCards.map((card, index) => (\r\n
\r\n {!this.getUsedGiftCardBalance() > 0 && (\r\n - \r\n
Use a Gift Card
\r\n\r\n this.onChangePayAtPickupEnabled()}\r\n checked={this.state.isPayAtPickupEnabled}\r\n />\r\n {!this.state.isPayAtPickupEnabled && (\r\n this.handleShowSwipeCard()}\r\n >\r\n {usedGiftCardBalance === 0 ? (\r\n
\r\n {this.state.showSwipeCard && (\r\n Payment Information
\r\n\r\n
\r\n {usedGiftCardBalance > 0 && (\r\n <>\r\n Total Due
\r\n{formatPrice(total)}
\r\n\r\n
\r\n Gift Card Payment
\r\n {usedGiftCardBalance >= total ? (\r\n{formatPrice(total)}
\r\n ) : (\r\n{formatPrice(usedGiftCardBalance)}
\r\n )}\r\n\r\n
\r\n \r\n )}\r\n\r\n {this.state.passInfo.isPassApplied ? (\r\n Remaining Balance Due
\r\n{formatPrice(balanceDue)}
\r\n\r\n
\r\n ) : null}\r\n\r\n {this.state.cardOnFile.isShowCardOnFile && this.getCardOnFile()}\r\n\r\n {this.state.restaurantDetails.isRestaurantPayAtPickup && (\r\n <>\r\n Use my gift card(s)
\r\n\r\n {this.state.guestGiftCards &&\r\n this.state.guestGiftCards.length > 0 &&\r\n this.state.guestGiftCards.map((card, index) => (\r\n
\r\n - \r\n
\r\n
\r\n )}\r\n \r\n )}\r\n {!this.state.isPayAtPickupEnabled\r\n ? !this.state.isCardSwiped &&\r\n !this.state.cardOnFile.isCardOnFileSelected &&\r\n balanceDue > 0 && (\r\n <>\r\n {\" \"}\r\n OR
\r\n Swipe a credit cart or gift card
\r\n ) : (\r\nSwipe a credit cart or gift card
\r\n )}\r\nManually enter a credit card
\r\n {/*\r\n Please enter valid card Number\r\n
\r\n \r\n )}\r\n \r\n Please enter valid CVC\r\n
\r\n \r\n )}\r\n Manually enter a gift card
\r\n {/*\r\n \r\n this.handleCardOnFile(true)}\r\n />\r\n \r\n {cardOnFile.isCardOnFileSelected && (\r\n <>\r\n {\r\n this.handleCardOnFile(false);\r\n }}\r\n >\r\n
\r\n );\r\n };\r\n\r\n getCreditCardForm = () => {\r\n let { cardOnFile } = this.state;\r\n return (\r\n \r\n );\r\n };\r\n handleChangeSpeciaRequest = (event) => {\r\n this.setState({ specialRequestValue: event.target.value });\r\n };\r\n handleSpecialRequest = () => {\r\n let { isShowSpecialRequest } = this.state;\r\n this.setState({ isShowSpecialRequest: !isShowSpecialRequest });\r\n };\r\n\r\n getOrderButton = () => {\r\n let { submitOrderButtonDisabled, giftCardInfo, cardOnFile, passInfo } =\r\n this.state;\r\n let isUsingGiftOrCardOnFile =\r\n (giftCardInfo?.giftCards && giftCardInfo?.giftCards.length > 0) ||\r\n cardOnFile.isCardOnFileSelected;\r\n return (\r\n \r\n Click here to enter a different card number\r\n
\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n } else {\r\n return null;\r\n }\r\n };\r\n\r\n normalizeInput = (value, previousValue) => {\r\n if (!value) return value;\r\n const currentValue = value.replace(/[^\\d]/g, \"\");\r\n const cvLength = currentValue.length;\r\n\r\n if (!previousValue || value.length > previousValue.length) {\r\n if (cvLength < 4) return currentValue;\r\n if (cvLength < 7)\r\n return `${currentValue.slice(0, 3)}- ${currentValue.slice(3)}`;\r\n return `${currentValue.slice(0, 3)}-${currentValue.slice(\r\n 3,\r\n 6\r\n )}-${currentValue.slice(6, 10)}`;\r\n }\r\n };\r\n\r\n cardNumberFormat = (value) => {\r\n if (!value) return value;\r\n const currentValue = value.replace(/[^\\d]/g, \"\");\r\n return currentValue.replace(/\\d{4}(?=.)/g, \"$&-\");\r\n };\r\n\r\n exiprationDateAndTimeFormat = (value) => {\r\n if (!value) {\r\n return value;\r\n }\r\n const currentValue = value.replace(/[^\\d]/g, \"\");\r\n const cvLength = currentValue.length;\r\n\r\n const currentMoth = moment().month() + 1;\r\n\r\n // if (!previousValue || value.length > previousValue.length) {\r\n if (cvLength <= 2) {\r\n if (cvLength === 2 && Number(currentValue) > 12) {\r\n return \"\";\r\n }\r\n if (currentValue === \"00\") {\r\n return \"\";\r\n }\r\n return currentValue;\r\n } else {\r\n const enteredYear = currentValue.slice(2, 4);\r\n const enteredMonth = currentValue.slice(0, 2);\r\n if (enteredYear.length === 2) {\r\n const currentYear = moment().year() - 2000;\r\n // if year is current year\r\n if (\r\n Number(enteredYear) === currentYear &&\r\n (Number(enteredMonth) < currentMoth || Number(enteredMonth) > 12)\r\n ) {\r\n return currentValue.slice(0, 2);\r\n }\r\n\r\n if (Number(enteredYear) < currentYear) {\r\n return currentValue.slice(0, 2);\r\n }\r\n }\r\n return `${currentValue.slice(0, 2)}/${currentValue.slice(2, 4)}`;\r\n }\r\n // }\r\n };\r\n // itemsExpirationModal: {\r\n // visible: false,\r\n // onCloseEventCallBack: this.itemsExpirationModalCloseCallBack,\r\n // message: '',\r\n // },\r\n\r\n itemsExpirationModalCloseCallBack = () => {\r\n let itemsExpirationModal = this.state.itemsExpirationModal;\r\n itemsExpirationModal.visible = false;\r\n itemsExpirationModal.message = \"\";\r\n this.setState({\r\n itemsExpirationModal: itemsExpirationModal,\r\n });\r\n };\r\n}\r\n\r\nexport default Checkout;\r\n","import { faInfoCircle } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport moment from \"moment\";\r\nimport React, { Component, useReducer, useRef, useState } from \"react\";\r\nimport { Overlay, Tooltip } from \"react-bootstrap\";\r\n// import { Redirect } from \"react-router-dom\";\r\nimport { storage } from \"../../Utility/CartStorage\";\r\nimport { formatPrice } from \"../../Utility/Common\";\r\nimport {\r\n CartItemKey,\r\n PassInfoKey,\r\n RestaurantDetailsByNodeId,\r\n OrderDetails,\r\n KIOSKSetting,\r\n} from \"../../Utility/Config\";\r\nimport { Storage } from \"../../Utility/Storage\";\r\nimport { getPickupTime } from \"../../Utility/URLService\";\r\nimport { post, get } from \"../../Utility/HttpService\";\r\n\r\nconst useForceRerender = () => useReducer((state) => !state, false)[1];\r\nconst QueueToolTip = (state) => {\r\n const [show, setShow] = useState(false);\r\n const target = useRef(null);\r\n\r\n return (\r\n <>\r\n setShow(!show)}>\r\n Guest Discount
\r\n\r\n {\"-\"}\r\n {formatPrice(info.totalDiscount)}\r\n
\r\n\r\n {this.getHeaderDetails()}\r\n {/* To-Do: Pending */}\r\n {this.pickUpDetails()}\r\n {this.getOrderDetails()}\r\n {this.otherInformation()}\r\n
\r\n );\r\n // }\r\n }\r\n\r\n getHeaderDetails = () => {\r\n return (\r\n <>\r\n {this.state.restaurantDetails.restaurantName}
\r\nYour order has been received
\r\n \r\n );\r\n };\r\n\r\n getMemberShipData = () => {};\r\n\r\n getCheckOrderStatusURL = () => {\r\n const { nodeId, salesPointName } = this.state.restaurantDetails;\r\n let url =\r\n window.ENV.FNBAppBaseURL +\r\n `orderStatus/${nodeId}/${this.state.orderDetails.OrderId}/${salesPointName}`;\r\n return url;\r\n };\r\n\r\n pickUpDetails() {\r\n //let checkStatusURL = \"\"\r\n return (\r\n\r\n \r\n Check Order Status\r\n \r\n )}\r\n
\r\n );\r\n }\r\n\r\n getOrderDetails() {\r\n return (\r\n Pickup Details
\r\n {this.state.restaurantDetails.restaurant_reqEnd !== 1 && (\r\n\r\n {/*
\r\n )}\r\n {!(\r\n this.state.kioskSetting && this.state.kioskSetting.IsKioskActive\r\n ) && (\r\n Your order will be ready:
*/}\r\n\r\n {this.state.isShowRestaurantWaitingTime\r\n ? this.state.restaurantWaitingTimeMessage\r\n : this.state.pickupTime &&\r\n \"Your order will be ready: \" + this.state.pickupTime}\r\n
Pickup Location:
\r\n\r\n {this.state.restaurantDetails.pickupDetails}\r\n
\r\n {!(\r\n this.state.kioskSetting && this.state.kioskSetting.IsKioskActive\r\n ) && (\r\n\r\n
\r\n
\r\n );\r\n }\r\n checkAndGetConfirmationSurvey = () => {\r\n let { kioskSetting, confirmationSurveyCode } = this.state;\r\n if (!(kioskSetting && kioskSetting.IsKioskActive) && confirmationSurveyCode)\r\n return (\r\n Order Details
\r\n\r\n {this.state.cartItems.foodItems.map((item, key) => {\r\n return (\r\n <>\r\n\r\n
\r\n \r\n );\r\n })}\r\n\r\n \r\n
\r\n {this.getDiscountContainerForItem(item)}\r\n {item.customizations.map((customization, key) => {\r\n return (\r\n \r\n {item.name} ({item.quantity})\r\n
\r\n{formatPrice(item.actualPrice * item.quantity)}
\r\n\r\n
\r\n );\r\n })}\r\n {customization.name.replace(\"Select a\", \"\")}:
\r\n\r\n {customization.customizationOptions.map(\r\n (option, key) => {\r\n return (\r\n
\r\n {customization.customizationOptions.length === 0 && (\r\n \r\n {option.name}\r\n {option.price >= 1 && (\r\n \r\n {formatPrice(\r\n option.actualPrice * item.quantity\r\n )}\r\n \r\n )}\r\n {this.getDiscountContainerForItem(option)}\r\n
\r\n );\r\n }\r\n )}\r\n \r\n {customization.textBoxValue}\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n {this.getDiscountContainerForTotal()}\r\n Subtotal
\r\n{this.calculateSubTotal()}
\r\n\r\n
\r\n Sales Tax
\r\n{this.calculateSalesTax()}
\r\n\r\n
\r\n Tip Amount
\r\n{this.getTipAmount()}
\r\n\r\n
\r\n {this.checkAndGetConfirmationSurvey()}\r\n Total
\r\n{formatPrice(this.calculateTotal())}
\r\n\r\n
\r\n );\r\n } else {\r\n return null;\r\n }\r\n };\r\n\r\n otherInformation() {\r\n return (\r\n Guest Discount
\r\n\r\n {\"-\"}\r\n {formatPrice(info.totalDiscount)}\r\n
\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default OrderPlaced;\r\n","import React, { Component, Fragment } from \"react\";\r\nimport waiticon from \"../../assets/images/waiticon.gif\";\r\nimport { post } from \"../../Utility/HttpService\";\r\nimport { checkOrderStatus } from \"../../Utility/URLService\";\r\nimport { KIOSKSetting } from \"../../Utility/Config\";\r\nimport { storage } from \"../../Utility/CartStorage\";\r\nimport { Storage } from \"../../Utility/Storage\";\r\nclass OrderStatus extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n kioskSetting: JSON.parse(Storage.getItem(KIOSKSetting)),\r\n screenRefreshTime: 0,\r\n isRefreshScreen: false,\r\n request: {\r\n restaurantNodeId: props.match.params.restaurantNodeId,\r\n orderId: props.match.params.orderId,\r\n salesPointName: props.match.params.salesPointName\r\n },\r\n orderInfo: {\r\n firstName: \"\",\r\n lastName: \"\",\r\n pickUpDetails: \"\",\r\n directionLink: \"\",\r\n orderStatus: \"\",\r\n orderNumber: \"\",\r\n pickupTime: \"\",\r\n },\r\n };\r\n this.getOrderStatus();\r\n }\r\n\r\n getOrderStatus = () => {\r\n const request = this.state.request;\r\n post(checkOrderStatus, request)\r\n .then((result) => result.data)\r\n .then((data) => {\r\n const orderInfo = data;\r\n this.setState({ orderInfo });\r\n });\r\n };\r\n componentWillUnmount() {\r\n this.state.isRefreshScreen && clearTimeout(this.confirmationTimer);\r\n }\r\n componentDidMount() {\r\n this.checkAndRedirectToMainPage();\r\n }\r\n confirmationTimer = () => {\r\n this.confirmationTimer = setInterval(() => {\r\n let { screenRefreshTime } = this.state;\r\n if (screenRefreshTime === 0) {\r\n this.refreshScreen();\r\n } else {\r\n screenRefreshTime = screenRefreshTime - 1;\r\n this.setState({ screenRefreshTime });\r\n }\r\n }, 1000);\r\n };\r\n checkAndRedirectToMainPage = () => {\r\n let { kioskSetting, screenRefreshTime } = this.state;\r\n if (kioskSetting && kioskSetting.IsKioskActive) {\r\n screenRefreshTime = parseInt(kioskSetting.Confirmation);\r\n if (screenRefreshTime > 0) {\r\n this.setState({ screenRefreshTime }, () => {\r\n this.confirmationTimer();\r\n });\r\n }\r\n }\r\n };\r\n refreshScreen = () => {\r\n let redirectURL = Storage.getRedirectURL();\r\n this.setState({ isRefreshScreen: true }, () => {\r\n this.removeCartItemsFromStorage();\r\n this.props.history && this.props.history.push(redirectURL);\r\n });\r\n };\r\n removeCartItemsFromStorage = () => {\r\n storage.removeAll();\r\n };\r\n\r\n render() {\r\n return (\r\n Order Date
\r\n\r\n {moment(this.state.orderDetails.OrderDate).format(\r\n \"MM/DD/yyyy hh:mm a\"\r\n )}\r\n
\r\n\r\nOrder Number
\r\n{this.state.orderDetails.OrderId}
\r\n\r\nCheck Number
\r\n{this.state.orderDetails.CheckNumber}
\r\n\r\nYour Information
\r\n\r\n {this.state.passInfo.firstName} {this.state.passInfo.lastName}\r\n
\r\n{this.state.passInfo.emailId}
\r\n{this.state.passInfo.phoneNumber}
\r\n\r\nPayment Details
\r\n{this.state.orderDetails.CreditCardText}
\r\n{this.state.orderDetails.GiftCardText}
\r\n\r\n {this.state.orderInfo.orderStatus === \"\" &&\r\n this.getOrderPlacedInformation()}\r\n {this.state.orderInfo.orderStatus !== \"\" &&\r\n this.getReadyForPickupInformation()}\r\n
\r\n );\r\n }\r\n\r\n getOrderPlacedInformation = () => {\r\n return (\r\n \r\n 
\r\n
\r\n );\r\n };\r\n getReadyForPickupInformation = () => {\r\n return (\r\n \r\n
\r\n Your Order will be ready:
\r\n {/*{this.state.orderInfo.pickupTime}
*/}\r\nCheck back soon!
\r\n\r\n
\r\n {/* Order #{this.state.orderInfo.orderNumber}
\r\n\r\n {this.state.orderInfo.firstName} {this.state.orderInfo.lastName}\r\n
\r\nReady For Pickup!
\r\n\r\n Instruction or more information if needed go here. Veggie sunt bona\r\n vobis, proinde vos postulo esse\r\n
*/}\r\n\r\n \r\n Get Directions\r\n \r\n )}\r\n
\r\n Pickup Location:
\r\n{this.state.orderInfo.pickUpDetails}
\r\n {this.state.orderInfo.directionLink && (\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default VerifyOrder;\r\n","import React, { Component } from \"react\";\r\nimport { VerifyOrderKey } from \"../../Utility/Config\";\r\nimport { Storage as _storage } from \"../../Utility/Storage\";\r\n\r\nclass OrderVerification extends Component {\r\n render() {\r\n return (\r\n \r\n Your order is not completed yet!
\r\n You are one step away from completing your order\r\n
To submit this order, please select a verification method:
\r\n \r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default OrderVerification;\r\n","import React, { Component } from \"react\";\r\nimport Spinner from \"../../Utility/Spinner\";\r\nimport Toaster, { ToasterHelper } from \"../../Utility/Toaster\";\r\nimport { verifySaleOrder } from \"../../Utility/URLService\";\r\nimport { get } from \"../../Utility/HttpService\";\r\nimport { Storage as _storage } from \"../../Utility/Storage\";\r\nimport { storage } from \"../../Utility/CartStorage\";\r\nimport {\r\n VerifyOrderKey,\r\n CartItemKey,\r\n OrderDetails,\r\n PassInfoKey,\r\n RestaurantDetailsByNodeId\r\n} from \"../../Utility/Config\";\r\n\r\nclass ValidateOrder extends Component {\r\n constructor() {\r\n super();\r\n this.state = {\r\n toaster: [],\r\n spinner: {\r\n show: true,\r\n },\r\n message: \"Please wait your order is being verified\",\r\n orderToken: this.getOrderToken(),\r\n };\r\n }\r\n getOrderToken = () => {\r\n let token = \"\";\r\n if (window.location.search) {\r\n const queryParams = new URLSearchParams(window.location.search);\r\n if (queryParams) {\r\n token = queryParams.get(\"token\");\r\n }\r\n }\r\n return token;\r\n };\r\n componentDidMount() {\r\n this.checkAndVerifyOrder();\r\n }\r\n checkAndVerifyOrder = () => {\r\n let { orderToken } = this.state;\r\n if (orderToken) {\r\n get(`${verifySaleOrder}${orderToken}`)\r\n .then((result) => result.data)\r\n .then((data) => {\r\n this.showSpinner(false);\r\n if (data.status) {\r\n var response = JSON.parse(data.data);\r\n _storage.setItem(\"temp_\" + CartItemKey, JSON.stringify(response.CartItems));\r\n _storage.setItem(OrderDetails, JSON.stringify(response.OrderDetailsResponse));\r\n _storage.setItem(PassInfoKey, JSON.stringify(response.PassInformation));\r\n _storage.setItem(RestaurantDetailsByNodeId, JSON.stringify(response.RestaurantDetails));\r\n this.props.history.push(\"/orderPlaced\");\r\n } else {\r\n this.setState({ message: \"Link expired or Invalid link\" });\r\n this.showToasterMessage(\"Invalid Link\", \"e\");\r\n }\r\n })\r\n .catch((error) => {\r\n this.showSpinner(false);\r\n this.showToasterMessage(\"Invalid Link\", \"w\");\r\n this.setState({ message: \"Link expired or Invalid link\" });\r\n });\r\n } else {\r\n this.showSpinner(false);\r\n this.showToasterMessage(\"Invalid Link\", \"e\");\r\n this.setState({ message: \"Link expired or Invalid link\" });\r\n }\r\n };\r\n showSpinner = (show) => {\r\n let { spinner } = this.state;\r\n spinner.show = show;\r\n this.setState({ spinner });\r\n };\r\n removeToasterMessage = () => {\r\n this.setState({ toaster: [] });\r\n };\r\n showToasterMessage = (message, type, time = 5000) => {\r\n const toaster = ToasterHelper.show(message, type, time);\r\n this.setState({ toaster });\r\n };\r\n render() {\r\n let { spinner, toaster, message } = this.state;\r\n return (\r\n \r\n Please click the link send to your email/phone to verify order\r\n
\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default ValidateOrder;\r\n","import React, { Component } from \"react\";\r\nimport Restaurants from \"./components/Restaurants/Restaurants\";\r\nimport DineIN from \"./components/DineIN/DineIN\";\r\nimport { BrowserRouter as Router, Switch, Route } from \"react-router-dom\";\r\nimport Pickup from \"./components/Pickup/Pickup\";\r\nimport ExpandedMenu from \"./components/ExpandedMenu/ExpandedMenu\";\r\nimport Customize from \"./components/Customize/Customize\";\r\nimport MembershipValidation from \"./components/MembershipValidation/MembershipValidation\";\r\nimport Cart from \"./components/Cart/Cart\";\r\nimport Checkout from \"./components/Checkout/Checkout\";\r\nimport OrderPlaced from \"./components/OrderPlaced/OrderPlaced\";\r\nimport OrderStatus from \"./components/OrderStatus/OrderStatus\";\r\nimport VerifyOrder from \"./components/VerifyOrder/VerifyOrder\";\r\nimport OrderVerification from \"./components/OrderVerification/OrderVerification\";\r\nimport ValidateOrder from \"./components/ValidateOrder/ValidateOrder\";\r\n\r\nclass AppRoutingComponent extends Component {\r\n state = {};\r\n render() {\r\n return (\r\n <>\r\n {message}
\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n