\n
\n \n );\n};\n\nexport default SecondSection","import React, { useState } from 'react'\nimport { useNavigate } from 'react-router-dom'\nconst AccountFooter = () => {\n const [isSmallScreen]=useState(window.innerWidth<=427);\n const navigate = useNavigate();\n const currentYear = new Date().getFullYear();\n return (\n \n
\n \n \n
\n Our AMC Features
\nFrom Machines to tools to finance everything you need in one place
\n\n\n
\n \n \n {listofdata.map((product, index) => (\n \n
\n \n {React.cloneElement(productCategory, {product ,index})}\n
\n \n \n ))}\n \n
\n )\n}\n\nexport default AccountFooter","import React from 'react';\r\nimport './ErrorModal.css'; // Optional: Create a CSS file for styling\r\n\r\nconst ErrorModal = ({ messages, onClose }) => {\r\n return (\r\n \n
\n \n
\n Copyright © {currentYear} Origa, All Right Reserved
\n navigate('/legal')} >Our Policies |{isSmallScreen ?
:null} Legal Disclaimers
\n :null} Legal Disclaimers
\r\n
\r\n );\r\n };\r\n \r\n export default ErrorModal;\r\n ","import React from 'react'\n\nconst MALeftsection = ({heading,para}) => {\n return (\n \r\n
\r\n Please fill in the below
\r\n {messages.length > 0 ? (\r\n- \r\n {messages.map((msg, index) => (\r\n
- {msg} \r\n ))}\r\n
\n
\n )\n}\n\nexport default MALeftsection","import React, { useEffect, useState } from \"react\";\nimport \"./ProductBlock.css\";\nimport { Container } from \"react-bootstrap\";\nimport Button from \"../../Button/Button\";\nimport Correct from \"../../SubComponent/AllSvgs/Correct\";\nimport CorrectGreen from \"../../SubComponent/AllSvgs/CorrectGreen\";\nimport Wrong from \"../../SubComponent/AllSvgs/Wrong\";\nimport { Link, useNavigate, useLocation } from \"react-router-dom\";\nimport LoginModel from \"../../Authentication/LoginModel/LoginModel\";\nimport axios from \"axios\";\n\nconst ProductBlock = (props) => {\n const navigate = useNavigate();\n const [products, setProducts] = useState([]);\n const location = useLocation();\n const AMC_BASED_ON_TYPE = location.state?.selectedCategory?.toUpperCase();\n\n const { selectedCategory, selectedLocation,modellNo, firstname, serialNo } =\n location.state || {};\n\n console.log(\"Model No in ProductBlock .jsx : \",modellNo)\n const productData = location.state && location.state.product;\n const [isHovered, setIsHovered] = useState(false);\n const [loginPortal, setLoginPortal] = useState(false);\n const { title, price, imageUrl, id, onProductBlockNavigate, product } = props;\n const loggedIn = !!localStorage.getItem(\"userToken\");\n const onMouseEnterhandler = () => {\n setIsHovered(true);\n };\n\n let description;\n try {\n const parsedDescription = JSON.parse(product.description);\n // Extract the first element from the array if it exists\n description = parsedDescription.length > 0 ? parsedDescription[0] : \"\";\n } catch (error) {\n console.error(\"Error parsing JSON:\", error);\n description = \"\"; // Default value in case of error\n }\n\n console.log(\"Description -----------------------------> \", description);\n\n // Function to split the description into chunks of 5 words\n const splitDescription = (desc) => {\n const words = desc.split(\" \");\n let result = [];\n let currentLine = [];\n let currentLength = 0;\n const maxLength = 25; // Adjust this value based on your box width\n\n words.forEach((word) => {\n if (currentLength + word.length > maxLength) {\n result.push(currentLine.join(\" \"));\n currentLine = [word];\n currentLength = word.length;\n } else {\n currentLine.push(word);\n currentLength += word.length + 1; // +1 for the space\n }\n });\n\n if (currentLine.length > 0) {\n result.push(currentLine.join(\" \"));\n }\n\n return result;\n };\n\n const descriptionLines = splitDescription(description);\n const onMouseLeavehandler = () => {\n setIsHovered(false);\n };\n\n const onHidePortal = () => {\n setLoginPortal(false);\n };\n // const onClickhandle = () => {\n // window.scrollTo(0, 0);\n // // navigate('/product');\n // // navigate(`/productidsecond/${id}`);\n\n // console.log(id,\"Show Product\")\n // onProductBlockNavigate(product)\n // }\n const onClickhandle = (product) => {\n // Destructure the product to get the required details\n const { id, price, gst_amount, total_amount, type, name } = product;\n\n // Log the required details\n console.log(\"When Get Started button is clicked ------------------- >\");\n console.log(\"GST amount :\", gst_amount);\n console.log(\"Product Name:\", name);\n console.log(\"Product Type:\", type);\n console.log(\"Product Type:\", price);\n console.log(\"Product Total Amount:\", total_amount);\n\n // Handle the navigation if logged in\n if (!loggedIn) {\n setLoginPortal(true);\n return;\n } else {\n navigate(\"/cartpageofamc\", {\n state: {\n product,\n selectedCategory,\n firstname,\n selectedLocation,\n serialNo,\n modellNo\n },\n });\n // navigate('/cartpageofamcrough', { state: { product } });\n }\n };\n\n const getProducts = () => {\n axios\n .post(\"https://contacts.origaleasing.com/fetchAMCbasedontype\", {\n type: AMC_BASED_ON_TYPE,\n })\n .then((response) => {\n setProducts(response.data.jsondata);\n // navigate('/annual', { state: { products } });\n })\n .catch((error) => {\n // console.error('Error fetching data:', error);\n });\n };\n // console.log('Annual getProductss ==>>',products)\n\n useEffect(() => {\n getProducts();\n }, [AMC_BASED_ON_TYPE]);\n\n const learnMoreFunction = () => {\n window.scrollTo(0, 0);\n onProductBlockNavigate(product);\n };\n\n // console.log(\"See what is inside product \", products);\n // products.forEach((product) => {\n // console.log(\"Product ID:\", product.id);\n // console.log(\"Product Name:\", product.name);\n // console.log(\"Product Price:\", product.price);\n // });\n\n // console.log(\"productData---->\", productData?.productData);\n return (\n {heading}
\n {para}
\n \n
\n \n
\n \n {product.plan}\n
\n {/* \n ₹{product.price}\n
*/}\n \n ₹{product.price}\n
\n \n 
\n
\n \n
*/}\n\n {/* \n \n
\n \n onClickhandle(product)}\n />\n \n
\n \n {/*
\n\n Remote Assist
*/}\n\n {/*
\n \n Safety Checks
\n */}\n\n
\n \n
\n \n {descriptionLines.map((line, index) => (\n
\n \n {line}\n
\n ))}\n\n
\n\n \n\n \n
\n 1 Preventive Maintenance
\n\n {/*
\n {/* \n
\n {/* \n
Evolve program
*/}\n\n
\n Preventive
Maintenance
\n
*/}\n {/* Preventive
Maintenance
\n
\n Evolve program
\n\n
\n Safety Checks
\n\n\n
\n Remote Assist
\n\n
\n Quality Checks
\n\n
\n \n Preventive
Maintenance
\n
\n \n \n Updates
\n{isHovered && }
\n*/}\n\n \n \n\n {loginPortal &&
\n \n );\n};\n\nexport default ProductBlock;\n\n","import React,{useState,useEffect} from 'react'\n\nconst FifthSection = () => {\n\n const [isSmallScreen, setIsSmallScreen] = useState(window.innerWidth <= 992);\n useEffect(() => {\n const handleResize = () => {\n setIsSmallScreen(window.innerWidth <= 992);\n };\n\n window.addEventListener(\"resize\", handleResize);\n\n // Clean up the event listener when the component unmounts\n return () => {\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [window.innerWidth])\n \n return (\n <>\n \n \n \n
\n \n
\n \n
\n \n ![\"amc\"](\"/asset/amc-machine-img.png\")
\n
\n \n Annual Maintenance Contracts (AMC): Proactive Care for a Seamless Operation
\n\n
\n \n ![\"amc\"](\"/asset/safeguard-img.png\")
\n
\n \n Safeguard Your Systems, Secure Your Future: AMC Offerings
\n\n
\n \n )\n}\n\nexport default FourthSection","import React, { useState,useEffect} from 'react'\nimport { Row } from 'react-bootstrap'\n// import { TextField } from '@mui/material';\nimport Button from '../Button/Button';\n// import axios from 'axios';\nimport SuccessPopup from '../SubComponent/AllBlock/SuccessPopup';\nimport { gql } from 'graphql-tag';\nimport client from '../Services/ServicesPopup/apolloclient';\nimport Textarea from '@mui/joy/Textarea';\nconst CREATE_CONTACT_US = gql`\n mutation CreateConatctUs($contactusinput: ContactUsInput!) {\n createContactUs(contactusinput: $contactusinput) {\n contactus {\n id\n firstname\n lastname\n emailid\n reasonId {\n id\n reasonTitle\n reasonDescription\n }\n queryDescription\n }\n message\n success\n }\n }\n`;\n\nconst SevenSection = () => {\n const [email, setEmail] = useState('');\n const [firstname, setfirstname] = useState('');\n const [lastname, setlastname] = useState('');\n const [description,setDescription]=useState('');\n const [isSmallScreen, setIsSmallScreen] = useState(window.innerWidth <= 992);\n const [validation,setvalidaion]=useState({fvalidation:false,lvalidation:false,evalidation:false});\n const [showModel,setShowModel]=useState(false);\n const onHide=()=>{\n setShowModel(false)\n } \n const onEmailChange = (e) => {\n setEmail(e.target.value);\n };\n\n const onFirstnameChange = (e) => {\n\n const newInputString = e.target.value;\n const sanitizedInput = newInputString.replace(/[^a-zA-Z]/g, '');\n \n // Update the state only if the input is empty or contains valid characters\n if (newInputString === '' || sanitizedInput === newInputString) {\n setfirstname(sanitizedInput);\n }\n \n };\n const onLastname = (e) => {\n\n const newInputString = e.target.value;\n const sanitizedInput = newInputString.replace(/[^a-zA-Z]/g, '');\n \n // Update the state only if the input is empty or contains valid characters\n if (newInputString === '' || sanitizedInput === newInputString) {\n setlastname(sanitizedInput);\n }\n\n };\n const onDescriptionChange=(e)=>{\n setDescription(e.target.value);\n }\n \n\nconst onSubmitHandler=async()=>{\n if( firstname===\"\" || lastname===\"\" ){\n if(firstname===\"\"){\n setvalidaion(prev=>({...prev,\n fvalidation:true}));\n }\n\n if( lastname===\"\"){\n setvalidaion(prev=>({...prev,\n lvalidation:true}));\n \n }\n return;\n }\n\n if(email){\n if( email.length<8 ){\n setvalidaion(prev=>({...prev,\n evalidation:true}));\nreturn; \n }else{\n const emailPattern = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\\.[a-zA-Z0-9-.]+$/;\n const isValid = emailPattern.test(email);\n \n setvalidaion(prev=>({...prev,\n evalidation:!isValid}));\n if(isValid===false)return\n }\n \n }\n try {\n const { data } = await client.mutate({\n mutation:CREATE_CONTACT_US ,\n variables: { contactusinput: {\n firstname: firstname,\n lastname: lastname,\n emailid: email,\n reasonid: 1,\n queryDescription: description\n }\n }\n });\n console.log(\"API Response==>\",data);\n if(data){ //you can modife validation condition according to you\n setShowModel(true)\n setfirstname(\"\")\n setlastname(\"\")\n setEmail(\"\")\n setDescription(\"\")\n }\n \n } catch (error) {\n console.error('API Error==>', error.message);\n \n }\n}\nuseEffect(() => {\n const handleResize = () => {\n setIsSmallScreen(window.innerWidth <= 992);\n };\n\n window.addEventListener(\"resize\", handleResize);\n\n // Clean up the event listener when the component unmounts\n return () => {\n window.removeEventListener(\"resize\", handleResize);\n };\n}, [])\n\n \n return (\n <>\n {showModel ? \n
\n \n \n
\n Our AMC Features
\nFrom Machines to tools to finance everything you need in one place
\n\n\n
\n \n \n {listofdata.map((product, index) => (\n \n
\n \n {React.cloneElement(productCategory, {product ,index})}\n
\n \n \n ))}\n \n \n
\n
\n \n
\n Contact us
\nStill have some questions? Leave your contact details and our experts will get in touch with you.
\n\n\n
\n
*/}\n \n \n {/* First Name *} size='small' id=\"first-name\"\n value={firstname}\n onChange={onFirstnameChange}/> */}\n
\n \n setvalidaion(prev=>({...prev,fvalidation:false}))}/>\n \n
\n \n \n Last Name *} size='small' id=\"last-name\"\n value={lastname}\n onChange={onLastname} /> */}\n \n
\n \n setvalidaion(prev=>({...prev,lvalidation:false}))}/>\n \n \n
\n {/* \n {/* Enter Email *} size='small' id=\"email\"\n value={email}\n onChange={onEmailChange} /> */}\n
\n\n \n {/*\n setvalidaion(prev=>({...prev,evalidation:false}))}/>\n \n
\n \n \n \n
\n \n