diff --git a/package-lock.json b/package-lock.json index b037b0a..b2690c0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -30,6 +30,7 @@ "env-cmd": "^10.1.0", "formik": "^2.2.9", "framer-motion": "^10.12.4", + "geolib": "^3.3.4", "jsonwebtoken": "^9.0.0", "jwt-decode": "^3.1.2", "lodash": "^4.17.21", @@ -9901,6 +9902,11 @@ "node": ">=6.9.0" } }, + "node_modules/geolib": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/geolib/-/geolib-3.3.4.tgz", + "integrity": "sha512-EicrlLLL3S42gE9/wde+11uiaYAaeSVDwCUIv2uMIoRBfNJCn8EsSI+6nS3r4TCKDO6+RQNM9ayLq2at+oZQWQ==" + }, "node_modules/get-caller-file": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", @@ -27312,6 +27318,11 @@ "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==" }, + "geolib": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/geolib/-/geolib-3.3.4.tgz", + "integrity": "sha512-EicrlLLL3S42gE9/wde+11uiaYAaeSVDwCUIv2uMIoRBfNJCn8EsSI+6nS3r4TCKDO6+RQNM9ayLq2at+oZQWQ==" + }, "get-caller-file": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", diff --git a/package.json b/package.json index 54213f3..633fa47 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "env-cmd": "^10.1.0", "formik": "^2.2.9", "framer-motion": "^10.12.4", + "geolib": "^3.3.4", "jsonwebtoken": "^9.0.0", "jwt-decode": "^3.1.2", "lodash": "^4.17.21", diff --git a/src/pages/nearle/orders/createorder1.js b/src/pages/nearle/orders/createorder1.js index 40347eb..c7d1ac5 100644 --- a/src/pages/nearle/orders/createorder1.js +++ b/src/pages/nearle/orders/createorder1.js @@ -1,55 +1,56 @@ import { - FormControl, - InputAdornment, - Grid, - Typography, - Stack, - Box, - // Autocomplete, - Button, - // Stepper, - // Step, - // StepLabel, - TextField, - Autocomplete, - CardActions, - // CardActions, - Chip, - // AvatarGroup, - // RadioGroup, - // Radio - Avatar, - // List, - // ListItem, - // IconButton, - // ListItemAvatar, - // ListItemText, - // Menu, - // MenuItem, - // ListItemIcon, - // Link, - Divider, - Table, - TableContainer, - TableRow, - TableCell, - TableHead, - TableBody, - // FormLabel, - Tooltip, - DialogTitle, - DialogContent, - Checkbox, - DialogActions, - CircularProgress, - ButtonGroup, - FormLabel, - IconButton, - Drawer, - InputLabel, - Select, - MenuItem - // LinkOutlined + FormControl, + InputAdornment, + Grid, + Typography, + Stack, + Box, + // Autocomplete, + Button, + // Stepper, + // Step, + // StepLabel, + TextField, + Autocomplete, + CardActions, + // CardActions, + Chip, + // AvatarGroup, + // RadioGroup, + // Radio + Avatar, + // List, + // ListItem, + // IconButton, + // ListItemAvatar, + // ListItemText, + // Menu, + // MenuItem, + // ListItemIcon, + // Link, + Divider, + Table, + TableContainer, + TableRow, + TableCell, + TableHead, + TableBody, + // FormLabel, + Tooltip, + DialogTitle, + DialogContent, + Checkbox, + DialogActions, + CircularProgress, + ButtonGroup, + FormLabel, + IconButton, + Drawer, + InputLabel, + Select, + MenuItem, + Switch + // LinkOutlined } from '@mui/material'; import { useNavigate } from 'react-router'; import CheckCircleIcon from '@mui/icons-material/CheckCircle'; @@ -62,29 +63,29 @@ import SwapVertIcon from '@mui/icons-material/SwapVert'; import axios from 'axios'; import { useTheme } from '@mui/material/styles'; // import { usePlacesWidget } from "react-google-autocomplete"; -import Geocode from "react-geocode"; +import Geocode from 'react-geocode'; // import {setApi} from "react-geocode"; -import Autocomplete1 from "react-google-autocomplete"; +import Autocomplete1 from 'react-google-autocomplete'; // import logo from 'assets/images/location.png' -import Loader from 'components/Loader' +import Loader from 'components/Loader'; import { - // EditOutlined, - CloseOutlined, - PlusOutlined, - SearchOutlined + // EditOutlined, + CloseOutlined, + PlusOutlined, + SearchOutlined } from '@ant-design/icons'; -import { usePlacesWidget } from "react-google-autocomplete"; +import { usePlacesWidget } from 'react-google-autocomplete'; import { DeleteOutlined } from '@ant-design/icons'; - +import * as geolib from 'geolib'; import MainCard from 'components/MainCard'; import { - EnvironmentOutlined, - // LinkOutlined, - // MailOutlined, - // MoreOutlined, - // PhoneOutlined + EnvironmentOutlined + // LinkOutlined, + // MailOutlined, + // MoreOutlined, + // PhoneOutlined } from '@ant-design/icons'; import CheckCircleRoundedIcon from '@mui/icons-material/CheckCircleRounded'; // import VisibilityIcon from '@mui/icons-material/Visibility'; @@ -101,8 +102,10 @@ import { TimePicker } from '@mui/x-date-pickers/TimePicker'; // import DialogTitle from '@mui/material/DialogTitle'; import Dialog from '@mui/material/Dialog'; import { - useEffect, useState, Fragment - // useReducer + useEffect, + useState, + Fragment + // useReducer } from 'react'; // import { Label } from '@mui/icons-material'; import dayjs from 'dayjs'; @@ -112,1513 +115,1576 @@ import dayjs from 'dayjs'; import { enqueueSnackbar } from 'notistack'; // import { CheckBox } from '@mui/icons-material'; // dayjs.extend(utc) -var utc = require('dayjs/plugin/utc') -dayjs.extend(utc) +var utc = require('dayjs/plugin/utc'); +dayjs.extend(utc); // import GoogleMaps from './map' import LocationOnIcon from '@mui/icons-material/LocationOn'; import parse from 'autosuggest-highlight/parse'; import { debounce } from '@mui/material/utils'; - function loadScript(src, position, id) { - if (!position) { - return; - } + if (!position) { + return; + } - const script = document.createElement('script'); - script.setAttribute('async', ''); - script.setAttribute('id', id); - script.src = src; - position.appendChild(script); + const script = document.createElement('script'); + script.setAttribute('async', ''); + script.setAttribute('id', id); + script.src = src; + position.appendChild(script); } const autocompleteService = { current: null }; const Createorder1 = () => { - - Geocode.setApiKey(process.env.REACT_APP_GOOGLE_MAPS_API_KEY) - - - - function GoogleMaps() { - const [value, setValue] = React.useState(null); - const [inputValue, setInputValue] = React.useState(''); - const [options, setOptions] = React.useState([]); - const loaded = React.useRef(false); - - const [mobilenumber, setMobilenumber] = useState('') - const [emailaddress, setEmailaddress] = useState('') - const [city, setCity] = useState('') - const [zipcode, setZipcode] = useState(''); - const [state, setState] = useState(''); - const [suburb, setSuburb] = useState(''); - const [firstname, setFirstname] = useState(''); - const [doorno, setDoorno] = useState(''); - const [landmark, setLandmark] = useState(''); - const [address, setAddress] = useState(''); - const [latlong, setLatlong] = useState({}); - - - // React.useEffect(()=>{ - - // if(value){ - // console.log() - // setAddress(value.description) - // } - // },[value]) - useEffect(() => { - try { - Geocode.fromAddress(address).then( - (response) => { - if (response.status == 'OK') { - - - const { lat, lng } = response.results[0].geometry.location; - setLatlong({ - lat, lng - }) - console.log(response); - if (response.results[0].address_components) { - let place = response.results[0]; - let city1, zipcode1, state1, suburb1; - for (let i = 0; i < place.address_components.length; i++) { - for (let j = 0; j < place.address_components[i].types.length; j++) { - switch (place.address_components[i].types[j]) { - case "locality": - city1 = place.address_components[i].long_name; - break; - case "administrative_area_level_1": - state1 = place.address_components[i].long_name; - break; - case "postal_code": - zipcode1 = place.address_components[i].long_name; - break; - case "sublocality": - suburb1 = place.address_components[i].long_name; - break; - } - } - } - setCity(city1 || '') - setState(state1 || ''); - setZipcode(zipcode1 || ''); - setSuburb(suburb1 || '') - } - - - - } - - }, (error) => { - console.log(error) - } - ); - - } catch (err) { - console.log(err) - - } - - }, [address]) - - if (typeof window !== 'undefined' && !loaded.current) { - if (!document.querySelector('#google-maps')) { - loadScript( - `https://maps.googleapis.com/maps/api/js?key=${process.env.REACT_APP_GOOGLE_MAPS_API_KEY}&libraries=places`, - document.querySelector('head'), - 'google-maps', - ); - } - - loaded.current = true; - } - - const fetch = React.useMemo( - () => - debounce((request, callback) => { - autocompleteService.current.getPlacePredictions(request, callback); - }, 400), - [], - ); - - React.useEffect(() => { - let active = true; - - if (!autocompleteService.current && window.google) { - autocompleteService.current = - new window.google.maps.places.AutocompleteService(); - } - if (!autocompleteService.current) { - return undefined; - } - - if (inputValue === '') { - setOptions(value ? [value] : []); - return undefined; - } - - fetch({ input: inputValue }, (results) => { - if (active) { - let newOptions = []; - - if (value) { - newOptions = [value]; - } - - if (results) { - newOptions = [...newOptions, ...results]; - } - - setOptions(newOptions); - } - }); - - return () => { - active = false; - }; - }, [value, inputValue, fetch]); - - - const createprofile = async () => { - // console.log('res', businessname, businessno, mobilenumber, emailaddress, address, city, zipcode) - - // if (!businessname) { - // opentoast('Fill Business name') - // } else if (!businessno) { - // opentoast('Fill Registration No') - // } - // else - if (!firstname) { - opentoast('Fill Full name') - } else if (!mobilenumber) { - opentoast('Fill Mobile Number') - } - // else if (!emailaddress) { - // opentoast('Fill emailaddress') - // } - else if (!address) { - opentoast('Fill Address') - } else if (!city) { - opentoast('Fill City') - } else if (!zipcode) { - opentoast('Fill post code') - } else if (!suburb) { - opentoast('Fill suburb') - // } else if (!emailaddress) { - // opentoast('Fill emailaddress') - } - else if (!latlong.lat || !latlong.lng) { - opentoast('Choose valid address') - } - else { - let obj = { - "customerid": 0, - "configid": 1, - "firstname": firstname, - "applocationid": parseInt(localStorage.getItem('applocationid')), - "profileimage": "", - "dialcode": "+91", - "contactno": mobilenumber, - "devicetype": "", - "deviceid": "", - "customertoken": "", - "address": address, - "suburb": suburb, - "city": city, - "state": state, - "postcode": zipcode, - "landmark": landmark, - "doorno": doorno, - "latitude": latlong.lat.toString(), - "longitude": latlong.lng.toString(), - "tenantid": parseInt(localStorage.getItem('tenantid')), - "email": emailaddress, - "primaryaddress": 1 - } - - console.log(obj) - - setLoading(true) - try { - await axios.post(`${process.env.REACT_APP_URL}/customers/create`, obj) - .then((res) => { - console.log(res) - if (res.data.status) { - - enqueueSnackbar(' Created Successfully ', { - variant: 'success', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - // navigate('/customers') - // setTimeout(()=>{ - // fetchprofiledetails(localStorage.getItem('appuserid')); - - // },2000) - clientdetails(localStorage.getItem('tenantid')) - setOpen4(false) - } else if (res.data.message == "Customer Already available") { - enqueueSnackbar("Customer Already available", { - variant: 'error', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - } - setLoading(false) - }).catch((err) => { - console.log(err) - - setLoading(false) - enqueueSnackbar(err.message, { - variant: 'error', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - - }) - - } catch (err) { - console.log(err) - setLoading(false) - - } - } - } - - return ( - <> - - - - - - - - - Create Customer - - { - setOpen4(false) - }}> - - - - - } - sx={{ height: '100%' }}> - - - - - Name - setFirstname(e.target.value)} - value={firstname} - autoComplete='off' - - /> - - - - - - Phone Number - - - { - if (e.target.value.toString().length <= 10) { - setMobilenumber(e.target.value) - } - }} - value={mobilenumber} - autoComplete='off' - - sx={{ cursor: 'not-allowed' }} - /> - - - - {/* - - Email Address - setEmailaddress(e.target.value)} - value={emailaddress} - autoComplete='off' - - /> - - */} - - - - - Address - {/* setAddress(e.target.value)} - inputRef={materialRef} - /> */} - - typeof option === 'string' ? option : option.description - } - filterOptions={(x) => x} - options={options} - autoComplete - includeInputInList - filterSelectedOptions - value={value} - noOptionsText="No locations" - onChange={(event, newValue) => { - setOptions(newValue ? [newValue, ...options] : options); - setValue(newValue); - // setCity(city1 || '') - // setState(state1 || ''); - // setZipcode(zipcode1 || ''); - // setSuburb(suburb1 || '') - // setAddress(newValue) - - - - // let city1, zipcode1, state1, suburb1; - // for (let i = 0; i < place.address_components.length; i++) { - // for (let j = 0; j < place.address_components[i].types.length; j++) { - // switch (place.address_components[i].types[j]) { - // case "locality": - // city1 = place.address_components[i].long_name; - // break; - // case "administrative_area_level_1": - // state1 = place.address_components[i].long_name; - // break; - // case "postal_code": - // zipcode1 = place.address_components[i].long_name; - // break; - // case "sublocality": - // suburb1 = place.address_components[i].long_name; - // break; - // } - // } - // } - // setCity(city1 || '') - // setState(state1 || ''); - // setZipcode(zipcode1 || ''); - // setSuburb(suburb1 || '') - console.log(newValue) - setAddress(newValue.description) - }} - onInputChange={(event, newInputValue) => { - setInputValue(newInputValue); - // console.log(newInputValue) - }} - renderInput={(params) => ( - - )} - renderOption={(props, option) => { - const matches = - option.structured_formatting.main_text_matched_substrings || []; - - const parts = parse( - option.structured_formatting.main_text, - matches.map((match) => [match.offset, match.offset + match.length]), - ); - - return ( -
  • - - - - - - {parts.map((part, index) => ( - - {part.text} - - ))} - - {option.structured_formatting.secondary_text} - - - -
    • - ); - }} - /> - -     -     - - - - Location - setSuburb(e.target.value)} - value={suburb} - autoComplete='off' - - /> - - - - - City - setCity(e.target.value)} - value={city} - autoComplete='off' - - /> - - - - - - State - setState(e.target.value)} - value={state} - autoComplete='off' - - /> - - - - - Post Code - setZipcode(e.target.value)} - value={zipcode} - autoComplete='off' - - /> - - - - - - Door No - setDoorno(e.target.value)} - value={doorno} - autoComplete='off' - - /> - - - - - Landmark - setLandmark(e.target.value)} - value={landmark} - autoComplete='off' - - /> - - - -     -     - -     - - - - - - - -     -     - - ); - } - - - const navigate = useNavigate(); - const [open, setOpen] = useState({}); - const [open1, setOpen1] = useState('') - const [open2, setOpen2] = useState(false) - const [open3, setOpen3] = useState(false) - const [open4, setOpen4] = useState(false) - - const [shift, setShift] = useState(1); - const [clientlist, setClientlist] = useState([]) - const [clientdetail, setClientdetail] = useState([]); - const [eventname, setEventname] = useState(''); - - const [startdate, setStartdate] = useState(dayjs().format('MM-DD-YYYY')); - const [enddate, setEnddate] = useState(dayjs().add(1, 'day').format('MM-DD-YYYY')); - const [starttime, setStatrttime] = useState(`${dayjs().format('MM-DD-YYYY')} 08:00:00`); - const [endtime, setEndtime] = useState(`${dayjs().format('MM-DD-YYYY')} 20:00:00`); - - const [timeslotarr, setTimeslotarr] = useState([]); - const [currentsno, setCurrentsno] = useState(''); - - - - - - - const [roleoptions, setRoleoptions] = useState([]); - - const theme = useTheme(); - - const [otherinstructions, setOtherinstructions] = useState(''); - - const [attireslist, setAttireslist] = useState([]); - const [serviceaddonslist, setServiceaddonslist] = useState([]); - const [orderaddonobj, setOrderaddonobj] = useState([]); - - const [stafflist, setStafflist] = useState([]); - const [loading2, setLoading2] = useState(false); - const [loading, setLoading] = useState(false) - - - const [shiftarr, setShiftarr] = useState([]); - const [shiftarr1, setShiftarr1] = useState([]); - - const [orderarr, setOrderarr] = useState([]); - - - const [alertmessage, setAlertmessage] = useState(''); - const [tabstatus, setTabstatus] = useState('') - const [tenantinfo, setTenantinfo] = useState({}); - const [searchword, setSearchword] = useState(''); - const [clientdetailarr, setClientdetailarr] = useState([]) - const [admintoken, setAdmintoken] = useState(''); - const [tenantlocationlist, setTenantlocationlist] = useState([]) - const [tenant, setTenant] = useState({}) - const [clientinfo, setClientinfo] = useState({}) - const [selectedtime, setSelectedtime] = useState('') - - - - + Geocode.setApiKey(process.env.REACT_APP_GOOGLE_MAPS_API_KEY); + + function GoogleMaps() { + const [value, setValue] = React.useState(null); + const [inputValue, setInputValue] = React.useState(''); + const [options, setOptions] = React.useState([]); + const loaded = React.useRef(false); + + const [mobilenumber, setMobilenumber] = useState(''); + const [emailaddress, setEmailaddress] = useState(''); + const [city, setCity] = useState(''); + const [zipcode, setZipcode] = useState(''); + const [state, setState] = useState(''); + const [suburb, setSuburb] = useState(''); + const [firstname, setFirstname] = useState(''); + const [doorno, setDoorno] = useState(''); + const [landmark, setLandmark] = useState(''); + const [address, setAddress] = useState(''); + const [latlong, setLatlong] = useState({}); + + // React.useEffect(()=>{ + + // if(value){ + // console.log() + // setAddress(value.description) + // } + // },[value]) useEffect(() => { - if (localStorage.getItem('tenantid')) { - - fetchtenantlocation(localStorage.getItem('tenantid')) - clientdetails(localStorage.getItem('tenantid')) - } - }, []) - - useEffect(() => { - if (timeslotarr[0]) { - let arr = []; - timeslotarr.map((val) => { - if ((dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0)) { - arr.push(val) - } - }) - - if (arr[0]) { - setOrderarr([{ - sno: 1, - address: '', - "customerid": '', - "deliverytime": dayjs(arr[0]) || '', - "deliverylocationid": '', - "clientname": '', - "contactno": '', - "latitude": '', - "longitude": '' - }]) - } - - - - - } - }, [timeslotarr]) - - useEffect(() => { - if (searchword) { - - let arr = clientdetail.filter((val) => { - - return (val.address.toLowerCase().includes(searchword.toLowerCase()) - || val.firstname.toLowerCase().includes(searchword.toLowerCase()) - || val.contactno.toLowerCase().includes(searchword.toLowerCase()) - - - ) - }) - console.log(arr) - setClientdetailarr([...arr]) - } else { - setClientdetailarr([...clientdetail]) - - } - - }, [searchword]) - - - const { ref: materialRef } = usePlacesWidget({ - apiKey: process.env.REACT_APP_GOOGLE_MAPS_API_KEY, - onPlaceSelected: (place) => { - - console.log(place) - - // setAddress(place.formatted_address) - let city1, zipcode1, state1, suburb1; - for (let i = 0; i < place.address_components.length; i++) { - for (let j = 0; j < place.address_components[i].types.length; j++) { + try { + Geocode.fromAddress(address).then( + (response) => { + if (response.status == 'OK') { + const { lat, lng } = response.results[0].geometry.location; + setLatlong({ + lat, + lng + }); + console.log(response); + if (response.results[0].address_components) { + let place = response.results[0]; + let city1, zipcode1, state1, suburb1; + for (let i = 0; i < place.address_components.length; i++) { + for (let j = 0; j < place.address_components[i].types.length; j++) { switch (place.address_components[i].types[j]) { - case "locality": - city1 = place.address_components[i].long_name; - break; - case "administrative_area_level_1": - state1 = place.address_components[i].long_name; - break; - case "postal_code": - zipcode1 = place.address_components[i].long_name; - break; - case "sublocality": - suburb1 = place.address_components[i].long_name; - break; + case 'locality': + city1 = place.address_components[i].long_name; + break; + case 'administrative_area_level_1': + state1 = place.address_components[i].long_name; + break; + case 'postal_code': + zipcode1 = place.address_components[i].long_name; + break; + case 'sublocality': + suburb1 = place.address_components[i].long_name; + break; } + } } + setCity(city1 || ''); + setState(state1 || ''); + setZipcode(zipcode1 || ''); + setSuburb(suburb1 || ''); + } } - // setCity(city1 || '') - // setState(state1 || ''); - // setZipcode(zipcode1 || ''); - // setSuburb(suburb1 || '') + }, + (error) => { + console.log(error); + } + ); + } catch (err) { + console.log(err); + } + }, [address]); - }, + if (typeof window !== 'undefined' && !loaded.current) { + if (!document.querySelector('#google-maps')) { + loadScript( + `https://maps.googleapis.com/maps/api/js?key=${process.env.REACT_APP_GOOGLE_MAPS_API_KEY}&libraries=places`, + document.querySelector('head'), + 'google-maps' + ); + } - options: { - - types: ['address' || 'geocode'] - }, - }); - - - - const fetchtenantinfo = async (tid) => { - setLoading(true) - await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantinfo/?tenantid=${tid}`) - .then((res) => { - console.log(res) - if (res.data.status) { - - setTenant(res.data.details) - - fetchadmintoken(res.data.details.tenantid, res.data.details.partnerid) - - } - setLoading(false) - }).catch((err) => { - console.log(err) - setLoading(false) - }) + loaded.current = true; } - const fetchtenantlocation = async (tid) => { - setLoading(true) - await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantlocations/?tenantid=${tid}`) + const fetch = React.useMemo( + () => + debounce((request, callback) => { + autocompleteService.current.getPlacePredictions(request, callback); + }, 400), + [] + ); - .then((res) => { - console.log(res) - if (res.data.status) { + React.useEffect(() => { + let active = true; - let arr = [] - res.data.details.map((val) => { - arr.push({ - ...val, - label: ` ${val.locationname}` - }) - }) - setTenantlocationlist(arr) - } - setLoading(false) - }).catch((err) => { - console.log(err) - setLoading(false) - }) - } + if (!autocompleteService.current && window.google) { + autocompleteService.current = new window.google.maps.places.AutocompleteService(); + } + if (!autocompleteService.current) { + return undefined; + } - const fetchadmintoken = async (tid, pid) => { - setLoading(true) - await axios.get(`${process.env.REACT_APP_URL}/partners/getadmintoken/?tenantid=${tid}&partnerid=${pid}`) - .then((res) => { - console.log(res) - if (res.data.status) { + if (inputValue === '') { + setOptions(value ? [value] : []); + return undefined; + } - setAdmintoken(res.data.details.userfcmtokem) + fetch({ input: inputValue }, (results) => { + if (active) { + let newOptions = []; - let arr = []; - for (let i = starttime, j = 0; dayjs(endtime).diff(i, 'm') >= 0; j++, i = dayjs(i).add(30, 'm')) { - console.log(dayjs(endtime).diff(i, 'm')) - console.log(dayjs(i).format('hh:mm A')) - arr.push(i) - } - console.log(arr) - setTimeslotarr(arr) + if (value) { + newOptions = [value]; + } - } - setLoading(false) - }).catch((err) => { - console.log(err) - setLoading(false) - }) - } - - const opentoast = (message) => { - - enqueueSnackbar(message, { - variant: 'error', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - console.log(alertmessage) - - - } - - function closeAddressModal() { - setOpen2(false); - } - function closetimemodal() { - setOpen3(false); - setCurrentsno('') - } - - - const createsubmitobj1 = async () => { - let arr = [] - let timecheck = false; - let addresscheck = false; - arr = [{ - "orderheaderid": 0, - "tenantid": parseInt(localStorage.getItem('tenantid')), - // "locationid": tenant.locationid, - "locationid":(clientinfo.tenantlocationid)?clientinfo.tenantlocationid:tenantinfo.tenantlocationid, - "moduleid": tenant.moduleid, - "configid": 7, - "orderid": "", - "customerid": tenantinfo.customerid, - "orderdate": dayjs().format('YYYY-MM-DD HH:mm:ss'), - "orderstatus": "created", - "pending": "", - "processing": "", - "ready": "", - "delivered": "", - "cancellled": "", - // "promoid": 0, - // "promoname": "", - // "promoterms": "", - // "promovalue": 0, - // "promoamount": 0, - "orderamount": 0, - "taxamount": 0, - "ordercharges": 0, - "ordervalue": 0, - "itemcount": 1, - "paymenttype": 64, - "paymentstatus": 0, - "deliverycharge": 0, - "deliverytime": `${dayjs(startdate).format('YYYY-MM-DD')} ${dayjs(selectedtime.$d).format('HH:mm:ss')}`, - "deliverylocationid": clientinfo.deliverylocationid, - "deliveryaddress": clientinfo.address, - // "pickupaddress": tenantinfo.locationaddress,// - // "pickuplat": tenantinfo.locationlatitude,// - // "pickuplong": tenantinfo.locationlong,// - "pickupaddress": tenantinfo.address,// - "pickuplat": tenantinfo.latitude,// - "pickuplong": tenantinfo.longitude,// - "ordernotes": otherinstructions, - "remarks": "", - "tenantuserid": parseInt(localStorage.getItem('tenantid')), - "categoryid": tenant.categoryid, - "subcategoryid": tenant.subcategoryid, - "partnerid": tenant.partnerid, - "deliverylat": clientinfo.latitude, - "deliverylong": clientinfo.longitude, - "applocationid": parseInt(localStorage.getItem('applocationid')), - - "deliveryid":clientinfo.customerid, - "pickuplocationid":tenantinfo.deliverylocationid - - }] - // if (!tenantinfo.tenantid) { - // opentoast('Choose Location') - - // } - // else - if(!tenantinfo.address){ - opentoast('Choose Pickup Location') - - }else - if (!clientinfo.address) { - opentoast('Choose Drop Location') - - } else if (!selectedtime) { - opentoast('Choose Schedule Time') - } else { - setLoading(true) - await axios.post(`${process.env.REACT_APP_URL}/orders/createorders`, arr) - .then((res) => { - if (res.data.status) { - enqueueSnackbar('Order Created Successfully', { - variant: 'success', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - if (admintoken) { - notifyadmin(admintoken) - - } - - navigate('/orders') - } else { - opentoast(res.data.message) - - } - setLoading(false) - console.log(res) - - }).catch((err) => { - console.log(err) - opentoast(err.data.message) - setLoading(false) - - }) + if (results) { + newOptions = [...newOptions, ...results]; + } + setOptions(newOptions); } + }); - console.log(arr) - } + return () => { + active = false; + }; + }, [value, inputValue, fetch]); + const createprofile = async () => { + // console.log('res', businessname, businessno, mobilenumber, emailaddress, address, city, zipcode) + // if (!businessname) { + // opentoast('Fill Business name') + // } else if (!businessno) { + // opentoast('Fill Registration No') + // } + // else + if (!firstname) { + opentoast('Fill Full name'); + } else if (!mobilenumber) { + opentoast('Fill Mobile Number'); + } + // else if (!emailaddress) { + // opentoast('Fill emailaddress') + // } + else if (!address) { + opentoast('Fill Address'); + } else if (!city) { + opentoast('Fill City'); + } else if (!zipcode) { + opentoast('Fill post code'); + } else if (!suburb) { + opentoast('Fill suburb'); + // } else if (!emailaddress) { + // opentoast('Fill emailaddress') + } else if (!latlong.lat || !latlong.lng) { + opentoast('Choose valid address'); + } else { + let obj = { + customerid: 0, + configid: 1, + firstname: firstname, + applocationid: parseInt(localStorage.getItem('applocationid')), + profileimage: '', + dialcode: '+91', + contactno: mobilenumber, + devicetype: '', + deviceid: '', + customertoken: '', + address: address, + suburb: suburb, + city: city, + state: state, + postcode: zipcode, + landmark: landmark, + doorno: doorno, + latitude: latlong.lat.toString(), + longitude: latlong.lng.toString(), + tenantid: tenantid, + email: emailaddress, + primaryaddress: 1 + }; + console.log(obj); - useEffect(() => { - if (localStorage.getItem('tenantid')) { - - fetchtenantinfo(localStorage.getItem('tenantid')) - } - }, [clientdetail.tenantname]) - - - - - - - - - useEffect(() => { - console.log('shiftarr') - console.log(shiftarr) - - }, [shiftarr]) - - const clicked1 = (e) => { - setShift(e); - } - - const dialogopen = (i, result) => { - console.log(i, result) - setOpen({ shiftsno: result.sno, sno: i.sno }) - } - const dialogclose = () => { - - setOpen('') - } - - - - - const clientdetails = async (tid) => { - - setLoading2(true) + setLoading(true); try { - - await axios.get(`${process.env.REACT_APP_URL}/customers/getbytid/?tenantid=${tid}`) - - .then((res) => { - if (res.data.status) { - - setClientdetail(res.data.details) - // if (!searchword) { - // setClientdetailarr(res.data.details) - // } - let arr = [] - res.data.details.map((val) => { - arr.push({ - label: `${val.firstname} | ${val.contactno}`, - ...val - }) - }) - setClientdetailarr(arr) - - } - setLoading2(false) - - - }).catch((err) => { - console.log(err) - setLoading2(false) - opentoast('server error') - }) - - } catch (err) { - console.log(err); - setLoading2(false) - - - } - } - - const notifyadmin = async (id1) => { - setLoading(true) - await axios.post(`${process.env.REACT_APP_URL}/utils/notifyuser`, { - "sender": localStorage.getItem('firstname'), - "accessid": process.env.REACT_APP_RIDER_ACCESS_ID, - "notification": { - "priority": "high", - "to": id1, - "notification": { - "title": "Nearle Admin", - "body": "Orders has been placed for delivery.Kindly accept and process deliveries", - "sound": "ring" - } - } - }) + await axios + .post(`${process.env.REACT_APP_URL}/customers/create`, obj) .then((res) => { - console.log(res) - if (res.data.message == 'Success') { - enqueueSnackbar("Notification sent Successfully", { - variant: 'success', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - } - setLoading(false) - - }).catch((err) => { - console.log(err) - enqueueSnackbar(err.message, { - variant: 'error', anchorOrigin: { vertical: 'top', horizontal: 'right' }, - autoHideDuration: 2000 - }) - setLoading(false) + console.log(res); + if (res.data.status) { + enqueueSnackbar(' Created Successfully ', { + variant: 'success', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + // navigate('/customers') + // setTimeout(()=>{ + // fetchprofiledetails(localStorage.getItem('appuserid')); + // },2000) + clientdetails(tenantid); + setOpen4(false); + } else if (res.data.message == 'Customer Already available') { + enqueueSnackbar('Customer Already available', { + variant: 'error', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + } + setLoading(false); }) + .catch((err) => { + console.log(err); + + setLoading(false); + enqueueSnackbar(err.message, { + variant: 'error', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + }); + } catch (err) { + console.log(err); + setLoading(false); + } + } + }; + + return ( + <> + + + + + Create Customer + + { + setOpen4(false); + }} + > + + + + } + sx={{ height: '100%' }} + > + + + + Name + setFirstname(e.target.value)} + value={firstname} + autoComplete="off" + /> + + + + + + Phone Number + + + { + if (e.target.value.toString().length <= 10) { + setMobilenumber(e.target.value); + } + }} + value={mobilenumber} + autoComplete="off" + sx={{ cursor: 'not-allowed' }} + /> + + + + {/* + + Email Address + setEmailaddress(e.target.value)} + value={emailaddress} + autoComplete='off' + + /> + + */} + + + + Address + {/* setAddress(e.target.value)} + inputRef={materialRef} + /> */} + (typeof option === 'string' ? option : option.description)} + filterOptions={(x) => x} + options={options} + autoComplete + includeInputInList + filterSelectedOptions + value={value} + noOptionsText="No locations" + onChange={(event, newValue) => { + setOptions(newValue ? [newValue, ...options] : options); + setValue(newValue); + // setCity(city1 || '') + // setState(state1 || ''); + // setZipcode(zipcode1 || ''); + // setSuburb(suburb1 || '') + // setAddress(newValue) + + // let city1, zipcode1, state1, suburb1; + // for (let i = 0; i < place.address_components.length; i++) { + // for (let j = 0; j < place.address_components[i].types.length; j++) { + // switch (place.address_components[i].types[j]) { + // case "locality": + // city1 = place.address_components[i].long_name; + // break; + // case "administrative_area_level_1": + // state1 = place.address_components[i].long_name; + // break; + // case "postal_code": + // zipcode1 = place.address_components[i].long_name; + // break; + // case "sublocality": + // suburb1 = place.address_components[i].long_name; + // break; + // } + // } + // } + // setCity(city1 || '') + // setState(state1 || ''); + // setZipcode(zipcode1 || ''); + // setSuburb(suburb1 || '') + console.log(newValue); + setAddress(newValue.description); + }} + onInputChange={(event, newInputValue) => { + setInputValue(newInputValue); + // console.log(newInputValue) + }} + renderInput={(params) => ( + + )} + renderOption={(props, option) => { + const matches = option.structured_formatting.main_text_matched_substrings || []; + + const parts = parse( + option.structured_formatting.main_text, + matches.map((match) => [match.offset, match.offset + match.length]) + ); + + return ( +
  • + + + + + + {parts.map((part, index) => ( + + {part.text} + + ))} + + {option.structured_formatting.secondary_text} + + + +
    • + ); + }} + /> +     +     + + + + Location + setSuburb(e.target.value)} + value={suburb} + autoComplete="off" + /> + + + + + City + setCity(e.target.value)} + value={city} + autoComplete="off" + /> + + + + + + State + setState(e.target.value)} + value={state} + autoComplete="off" + /> + + + + + Post Code + setZipcode(e.target.value)} + value={zipcode} + autoComplete="off" + /> + + + + + + Door No + setDoorno(e.target.value)} + value={doorno} + autoComplete="off" + /> + + + + + Landmark + setLandmark(e.target.value)} + value={landmark} + autoComplete="off" + /> + + +     +     +     + + + + + + +     +     + + ); + } + + const navigate = useNavigate(); + const [open, setOpen] = useState({}); + const [open1, setOpen1] = useState(''); + const [open2, setOpen2] = useState(false); + const [open3, setOpen3] = useState(false); + const [open4, setOpen4] = useState(false); + + const [shift, setShift] = useState(1); + const [clientlist, setClientlist] = useState([]); + const [clientdetail, setClientdetail] = useState([]); + const [eventname, setEventname] = useState(''); + + const [startdate, setStartdate] = useState(dayjs().format('MM-DD-YYYY')); + const [enddate, setEnddate] = useState(dayjs().add(1, 'day').format('MM-DD-YYYY')); + const [starttime, setStatrttime] = useState(`${dayjs().format('MM-DD-YYYY')} 08:00:00`); + const [endtime, setEndtime] = useState(`${dayjs().format('MM-DD-YYYY')} 20:00:00`); + + const [timeslotarr, setTimeslotarr] = useState([]); + const [currentsno, setCurrentsno] = useState(''); + + const [roleoptions, setRoleoptions] = useState([]); + + const theme = useTheme(); + + const [otherinstructions, setOtherinstructions] = useState(''); + + const [attireslist, setAttireslist] = useState([]); + const [serviceaddonslist, setServiceaddonslist] = useState([]); + const [orderaddonobj, setOrderaddonobj] = useState([]); + + const [stafflist, setStafflist] = useState([]); + const [loading2, setLoading2] = useState(false); + const [loading, setLoading] = useState(false); + + const [shiftarr, setShiftarr] = useState([]); + const [shiftarr1, setShiftarr1] = useState([]); + + const [orderarr, setOrderarr] = useState([]); + + const [alertmessage, setAlertmessage] = useState(''); + const [tabstatus, setTabstatus] = useState(''); + const [tenantinfo, setTenantinfo] = useState({}); + const [searchword, setSearchword] = useState(''); + const [clientdetailarr, setClientdetailarr] = useState([]); + const [clientdetailbusinessarr, setClientdetailbusinessarr] = useState([]); + + const [admintoken, setAdmintoken] = useState(''); + const [tenantlocationlist, setTenantlocationlist] = useState([]); + const [tenant, setTenant] = useState({}); + const [clientinfo, setClientinfo] = useState({}); + const [selectedtime, setSelectedtime] = useState(''); + const [tenantlist, setTenantlist] = useState([]); + const [tenantid, setTenantid] = useState(''); + const [tenantlocation, setTenantlocation] = useState(''); + + const [pickupswitch, setPickupswitch] = useState(true); + const [dropswitch, setDropswitch] = useState(false); + const [startPoint, setStartPoint] = useState({ latitude: 0, longitude: 0 }); + const [endPoint, setEndPoint] = useState({ latitude: 0, longitude: 0 }); + const [showDistance, setShowDistance] = useState(false); + ``; + const [distance, setDistance] = useState(0); + const [basePrice, setBasePrice] = useState(0); + const [pricePerKm, setPricePerKm] = useState(0); + const [minKm, setMinKm] = useState(0); + const [totalCharge, setTotalCharge] = useState(0); + + const tid = localStorage.getItem('tenantid'); + + const fetchTenantPricing = async () => { + try { + const pricingResponse = await axios.get(`https://jupiter.nearle.app/live/api/v1/tenants/gettenantpricing/?tenantid=${tid}`); + console.log('pricingResponse', pricingResponse.data.details); + setBasePrice(pricingResponse.data.details.baseprice); + setPricePerKm(pricingResponse.data.details.priceperkm); + setMinKm(pricingResponse.data.details.minkm); + } catch (error) { + console.log('fetchTenantPricing error', error); + } + }; + + useEffect(() => { + console.log('startPoint', startPoint); + console.log('endPoint', endPoint); + if (startPoint.latitude != 0 && startPoint.longitude != 0 && endPoint.latitude != 0 && endPoint.longitude != 0) { + getDistance(); + } + }, [startPoint, endPoint]); + + const getDistance = () => { + const dist = geolib.getPreciseDistance(startPoint, endPoint, 1); + console.log(`Distance: ${dist} meters`); + const distanceInKm = (dist / 1000).toFixed(2); + const roundedDistance = Math.round(distanceInKm); + console.log('roundedDistance', roundedDistance); + setDistance(roundedDistance.toFixed(2)); + if (roundedDistance < minKm) { + setTotalCharge(basePrice); + } else { + const total = (roundedDistance - minKm) * pricePerKm + basePrice; + setTotalCharge(total); + } + setShowDistance(true); + }; + + useEffect(() => { + // if (localStorage.getItem('tenantid')) { + + // fetchtenantlocation(localStorage.getItem('tenantid')) + // clientdetails(localStorage.getItem('tenantid')) + // } + if (localStorage.getItem('partnerid')) { + fetchtenantinfolist(localStorage.getItem('partnerid')); + } + }, []); + + useEffect(() => { + fetchtenantlocation(); + clientdetails(); + clientdetailsbusiness(); + fetchtenantinfo(); + }, []); + + useEffect(() => { + if (timeslotarr[0]) { + let arr = []; + timeslotarr.map((val) => { + if (dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0) { + arr.push(val); + } + }); + + if (arr[0]) { + setOrderarr([ + { + sno: 1, + address: '', + customerid: '', + deliverytime: dayjs(arr[0]) || '', + deliverylocationid: '', + clientname: '', + contactno: '', + latitude: '', + longitude: '' + } + ]); + } + } + }, [timeslotarr]); + + useEffect(() => { + if (searchword) { + let arr = clientdetail.filter((val) => { + return ( + val.address.toLowerCase().includes(searchword.toLowerCase()) || + val.firstname.toLowerCase().includes(searchword.toLowerCase()) || + val.contactno.toLowerCase().includes(searchword.toLowerCase()) + ); + }); + console.log(arr); + setClientdetailarr([...arr]); + } else { + setClientdetailarr([...clientdetail]); + } + }, [searchword]); + + const { ref: materialRef } = usePlacesWidget({ + apiKey: process.env.REACT_APP_GOOGLE_MAPS_API_KEY, + onPlaceSelected: (place) => { + console.log(place); + + // setAddress(place.formatted_address) + let city1, zipcode1, state1, suburb1; + for (let i = 0; i < place.address_components.length; i++) { + for (let j = 0; j < place.address_components[i].types.length; j++) { + switch (place.address_components[i].types[j]) { + case 'locality': + city1 = place.address_components[i].long_name; + break; + case 'administrative_area_level_1': + state1 = place.address_components[i].long_name; + break; + case 'postal_code': + zipcode1 = place.address_components[i].long_name; + break; + case 'sublocality': + suburb1 = place.address_components[i].long_name; + break; + } + } + } + // setCity(city1 || '') + // setState(state1 || ''); + // setZipcode(zipcode1 || ''); + // setSuburb(suburb1 || '') + }, + + options: { + types: ['address' || 'geocode'] + } + }); + + const fetchtenantinfo = async () => { + setLoading(true); + console.log('tid', tid); + await axios + .get(`${process.env.REACT_APP_URL}/tenants/gettenantinfo/?tenantid=${tid}`) + .then((res) => { + console.log('fetchtenantinfo', res); + if (res.data.status) { + setTenant(res.data.details); + + fetchadmintoken(res.data.details.tenantid, res.data.details.partnerid); + } + setLoading(false); + }) + .catch((err) => { + console.log(err); + setLoading(false); + }); + }; + useEffect(() => { + fetchtenantinfo(); + fetchtenantlocation(); + }, []); + + // const fetchtenantinfolist = async () => { + // setLoading(true); + // console.log('tid', tid); + // // await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantinfo/?tenantid=${tid}`) + // await axios + // .get(`${process.env.REACT_APP_URL}/tenants/gettenants/?partnerid=${tid}&status=active`) + + // .then((res) => { + // console.log(res); + // if (res.data.status) { + // // setTenantinfo(res.data.details); + // let arr = []; + // res.data.details.map((val) => { + // arr.push({ + // ...val, + // label: `${val.tenantname}` + // }); + // }); + // setTenantlist(arr); + // } + // setLoading(false); + // }) + // .catch((err) => { + // console.log(err); + // setLoading(false); + // }); + // }; + + const fetchtenantlocation = async () => { + setLoading(true); + await axios + .get(`${process.env.REACT_APP_URL}/tenants/gettenantlocations/?tenantid=${tid}`) + .then((res) => { + console.log('fetchtenantlocation', res); + if (res.data.status) { + let arr = []; + res.data.details.map((val) => { + arr.push({ + ...val, + label: ` ${val.locationname}` + }); + }); + setTenantlocationlist(arr); + } + setLoading(false); + }) + .catch((err) => { + console.log(err); + setLoading(false); + }); + }; + + const fetchadmintoken = async (tid, pid) => { + setLoading(true); + await axios + .get(`${process.env.REACT_APP_URL}/partners/getadmintoken/?tenantid=${tid}&partnerid=${pid}`) + .then((res) => { + console.log(res); + if (res.data.status) { + setAdmintoken(res.data.details.userfcmtokem); + + let arr = []; + for (let i = starttime, j = 0; dayjs(endtime).diff(i, 'm') >= 0; j++, i = dayjs(i).add(30, 'm')) { + // console.log(dayjs(endtime).diff(i, 'm')); + // console.log(dayjs(i).format('hh:mm A')); + arr.push(i); + } + console.log(arr); + setTimeslotarr(arr); + } + setLoading(false); + }) + .catch((err) => { + console.log(err); + setLoading(false); + }); + }; + + const opentoast = (message) => { + enqueueSnackbar(message, { + variant: 'error', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + console.log(alertmessage); + }; + + function closeAddressModal() { + setOpen2(false); + } + function closetimemodal() { + setOpen3(false); + setCurrentsno(''); + } + + const createsubmitobj1 = async () => { + let arr = []; + let timecheck = false; + let addresscheck = false; + arr = [ + { + orderheaderid: 0, + tenantid: tenantid, + // "locationid": tenant.locationid, + locationid: clientinfo.tenantlocationid ? clientinfo.tenantlocationid : tenantinfo.tenantlocationid, + moduleid: tenant.moduleid, + configid: 7, + orderid: '', + customerid: tenantinfo.customerid, + orderdate: dayjs().format('YYYY-MM-DD HH:mm:ss'), + orderstatus: 'created', + pending: '', + processing: '', + ready: '', + delivered: '', + cancellled: '', + // "promoid": 0, + // "promoname": "", + // "promoterms": "", + // "promovalue": 0, + // "promoamount": 0, + orderamount: totalCharge, + taxamount: 0, + ordercharges: 0, + ordervalue: totalCharge, + itemcount: 1, + paymenttype: 64, + paymentstatus: 0, + deliverycharge: totalCharge, + deliverytime: `${dayjs(startdate).format('YYYY-MM-DD')} ${dayjs(selectedtime.$d).format('HH:mm:ss')}`, + deliverylocationid: clientinfo.deliverylocationid, + deliveryaddress: clientinfo.address, + // "pickupaddress": tenantinfo.locationaddress,// + // "pickuplat": tenantinfo.locationlatitude,// + // "pickuplong": tenantinfo.locationlong,// + pickupaddress: tenantinfo.address, // + pickuplat: startPoint.latitude, // + pickuplong: startPoint.longitude, // + ordernotes: otherinstructions, + remarks: '', + tenantuserid: parseInt(localStorage.getItem('userid')), + categoryid: tenant.categoryid, + subcategoryid: tenant.subcategoryid, + partnerid: tenant.partnerid, + deliverylat: endPoint.latitude, + deliverylong: endPoint.longitude, + applocationid: parseInt(localStorage.getItem('applocationid')), + deliveryid: clientinfo.customerid, + pickuplocationid: tenantinfo.deliverylocationid, + kms: distance + } + ]; + if (!tenantid) { + opentoast('Choose Client'); + } else if (!tenantinfo.address) { + opentoast('Choose Pickup Location'); + } else if (!clientinfo.address) { + opentoast('Choose Drop Location'); + } else if (!selectedtime) { + opentoast('Choose Schedule Time'); + } else { + setLoading(true); + await axios + .post(`${process.env.REACT_APP_URL}/orders/createorders`, arr) + .then((res) => { + if (res.data.status) { + enqueueSnackbar('Order Created Successfully', { + variant: 'success', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + if (admintoken) { + notifyadmin(admintoken); + } + + navigate('/orders'); + } else { + opentoast(res.data.message); + } + setLoading(false); + console.log(res); + }) + .catch((err) => { + console.log(err); + opentoast(err.data.message); + setLoading(false); + }); } + console.log(arr); + }; + // useEffect(() => { + // if (localStorage.getItem('tenantid')) { + // fetchtenantinfo(localStorage.getItem('tenantid')) + // } + // }, [clientdetail.tenantname]) + useEffect(() => { + console.log('shiftarr'); + console.log(shiftarr); + }, [shiftarr]); - return <> - {(loading) && + const clicked1 = (e) => { + setShift(e); + }; - + const dialogopen = (i, result) => { + console.log(i, result); + setOpen({ shiftsno: result.sno, sno: i.sno }); + }; + const dialogclose = () => { + setOpen(''); + }; + const clientdetails = async () => { + setLoading2(true); + try { + await axios + .get(`${process.env.REACT_APP_URL}/customers/getbytid/?tenantid=${tid}&locationid=0`) + .then((res) => { + console.log('clientdetails', res.data.details); + if (res.data.status) { + setClientdetail(res.data.details); + // if (!searchword) { + // setClientdetailarr(res.data.details) + // } + let arr = []; + res.data.details.map((val) => { + arr.push({ + label: `${val.firstname} | ${val.contactno}`, + ...val + }); + }); + setClientdetailarr(arr); + } + setLoading2(false); + }) + .catch((err) => { + console.log(err); + setLoading2(false); + opentoast('server error'); + }); + } catch (err) { + console.log(err); + setLoading2(false); + } + }; + + const clientdetailsbusiness = async () => { + setLoading2(true); + try { + await axios + .get(`${process.env.REACT_APP_URL}/customers/getbytid/?tenantid=${tid}&locationid=1`) + .then((res) => { + console.log('clientdetailsbusiness', res.data.details); + if (res.data.status) { + setClientdetail(res.data.details); + // if (!searchword) { + // setClientdetailarr(res.data.details) + // } + let arr = []; + res.data.details.map((val) => { + arr.push({ + label: `${val.firstname} | ${val.contactno}`, + ...val + }); + }); + setClientdetailbusinessarr(arr); + } + setLoading2(false); + }) + .catch((err) => { + console.log(err); + setLoading2(false); + opentoast('server error'); + }); + } catch (err) { + console.log(err); + setLoading2(false); + } + }; + + const notifyadmin = async (id1) => { + setLoading(true); + await axios + .post(`${process.env.REACT_APP_URL}/utils/notifyuser`, { + sender: localStorage.getItem('firstname'), + accessid: process.env.REACT_APP_RIDER_ACCESS_ID, + notification: { + priority: 'high', + to: id1, + notification: { + title: 'Nearle Admin', + body: 'Orders has been placed for delivery.Kindly accept and process deliveries', + sound: 'ring' + } } - + }) + .then((res) => { + console.log(res); + if (res.data.message == 'Success') { + enqueueSnackbar('Notification sent Successfully', { + variant: 'success', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + } + setLoading(false); + }) + .catch((err) => { + console.log(err); + enqueueSnackbar(err.message, { + variant: 'error', + anchorOrigin: { vertical: 'top', horizontal: 'right' }, + autoHideDuration: 2000 + }); + setLoading(false); + }); + }; - + {loading && } + + + + - - - Create Order - {/* */} - - - - - - - - - - - {/* - - - - */} - - - - - - - - - Pickup Location - - } - onChange={(e, val) => { - if (val) { - - - // clientdetails(val.tenantid) - if(clientinfo.customerid == val.customerid){ - opentoast('choose different Location') - setTenantinfo({}) - - }else{ - setTenantinfo(val) - - } - } else { - setTenantinfo({}) - } - - console.log(val) - }} - - disabled={(tenant.tenantid) ? false : true} - noOptionsText={ - // - - No options - - - } - /> - - - - - - {' '} - {/* {tenantinfo.locationaddress || ''} */} - {tenantinfo.address || ''} - - - - - - - {/* - - - - */} - - - Drop Location - - } - onChange={(e, val) => { - if (val) { - - if(tenantinfo.customerid == val.customerid){ - opentoast('choose different Location') - setClientinfo({}) - - }else{ - setClientinfo(val) - - } - } else { - setClientinfo({}) - } - - console.log(val) - }} - noOptionsText={ - // - - No options - - - } - // disabled={(tenant.tenantid) ? false : true} - /> - - - - - - {' '}{clientinfo.address || ''} - - - - - - - - - - - - - - - - - Date - { - let dateres11 = dayjs().diff(dayjs(`${dayjs(e).format('YYYY-MM-DD')}`), 'd'); - console.log('dateres11') - console.log(dateres11) - setSelectedtime('') - if (dateres11 <= 0) { - setStartdate(e); - setEnddate(e); - - - let arr = []; - timeslotarr.map((val) => { - if ((dayjs().diff(dayjs(`${dayjs(e).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0)) { - arr.push(val) - } - }) - if (arr[0]) { - setOrderarr([{ - sno: 1, - address: '', - "customerid": '', - "deliverytime": dayjs(arr[0]) || '', - "deliverylocationid": '', - "clientname": '', - "contactno": '', - "latitude": '', - "longitude": '' - }]) - } else { - setOrderarr([]) - } - - } else { - setAlertmessage('choose Upcoming Date'); - opentoast('choose Upcoming Date') - setStartdate(NaN) - } - - }} - value={dayjs(startdate)} - sx={{ width: '100%', mt: 2 }} - disablePast - - - /> - - - - - Time - {/*

    {dayjs(selectedtime).format('HH:mm')}

    */} - {/*

    {selectedtime}

    */} - - - - {timeslotarr.map((val) => { - if ((dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0) - // && currentsno - ) { - - return <> - - - { - // let arr = orderarr; - // arr[currentsno - 1].deliverytime = val - // setOrderarr([...arr]) - // console.log(arr) - // }} - onClick={() => { - setSelectedtime(val) - }} - /> - - - - } - - }) - - } - - - {/* - - - - - {selectedtime} - { - if (tenantinfo.tenantid) { - setOpen3(true) - - } else { - opentoast('Choose Location & Client') - } - - }} - > - - - - */} -     - - - - - {/* */} - - - setOtherinstructions(e.target.value)} /> - - - - {/* */} - - - - - -     - -     -     - - - - - - - - -     -     - - -     - - - - - - - - - - -     -     - - - - Select Time - - - - - - - {timeslotarr.map((val) => { - if ((dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0) - // && currentsno - ) { - - return <> - - - { - // let arr = orderarr; - // arr[currentsno - 1].deliverytime = val - // setOrderarr([...arr]) - // console.log(arr) - // }} - onClick={() => { - setSelectedtime(dayjs(val).format('hh:mm A')) - }} - /> - - - - } - - }) - - } + Create Order + + +     + + + + + {/* + + + + Choose Client +
    +     - - - - + + No options + {!pickupswitch && ( + + )} + + } + // disabled={tenantid ? false : true} + /> +     + + + + {/* {tenantinfo.locationaddress || ''} */} + {tenantinfo.address || ''} + + + + {/* + + + + */} + + + Drop + + Customer + { + if (val) { + setDropswitch(true); + setClientinfo({}); + } else { + setDropswitch(false); + setClientinfo({}); + } + }} + size="small" + /> + Business + + + } + onChange={(e, val) => { + if (val) { + if (tenantinfo.customerid == val.customerid) { + opentoast('choose different Location'); + setClientinfo({}); + } else { + setClientinfo(val); + } + } else { + setClientinfo({}); + } + + console.log(val); + setEndPoint({ latitude: val.latitude, longitude: val.longitude }); + }} + // disabled={(tenant.tenantid) ? false : true} + // disabled={tenantid ? false : true} + noOptionsText={ + // + + No options + {!dropswitch && ( + + )} + + } + /> + + + + + {clientinfo.address || ''} + + + + {showDistance && ( + + + + + {/* */} + {/* */} + + + )} +     + +     + + + + + + + Date + { + let dateres11 = dayjs().diff(dayjs(`${dayjs(e).format('YYYY-MM-DD')}`), 'd'); + console.log('dateres11'); + console.log(dateres11); + setSelectedtime(''); + if (dateres11 <= 0) { + setStartdate(e); + setEnddate(e); + + let arr = []; + timeslotarr.map((val) => { + if ( + dayjs().diff(dayjs(`${dayjs(e).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0 + ) { + arr.push(val); + } + }); + if (arr[0]) { + setOrderarr([ + { + sno: 1, + address: '', + customerid: '', + deliverytime: dayjs(arr[0]) || '', + deliverylocationid: '', + clientname: '', + contactno: '', + latitude: '', + longitude: '' + } + ]); + } else { + setOrderarr([]); + } + } else { + setAlertmessage('choose Upcoming Date'); + opentoast('choose Upcoming Date'); + setStartdate(NaN); + } + }} + value={dayjs(startdate)} + sx={{ width: '100%', mt: 2 }} + disablePast + /> + + + + Time + {/*

    {dayjs(selectedtime).format('HH:mm')}

    */} + {/*

    {selectedtime}

    */} + + + {timeslotarr.map((val) => { + if ( + dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0 + // && currentsno + ) { + return ( + <> + + { + // let arr = orderarr; + // arr[currentsno - 1].deliverytime = val + // setOrderarr([...arr]) + // console.log(arr) + // }} + onClick={() => { + setSelectedtime(val); + }} + /> + + + ); + } + })} + + + {/* + + + + + {selectedtime} + { + if (tenantinfo.tenantid) { + setOpen3(true) + + } else { + opentoast('Choose Location & Client') + } + + }} + > + + + + */} +     + + {/* */} + + setOtherinstructions(e.target.value)} + /> + + {/* */} + +     +     +     + + + + - - - - - - { - setOpen4(false) - - }} - + > + Create + + + +     +     + + + + + + + Select Time + + + + + + {timeslotarr.map((val) => { + if ( + dayjs().diff(dayjs(`${dayjs(startdate).format('MM-DD-YYYY')} ${dayjs(val).format('HH:mm:ss')}`), 'm') <= 0 + // && currentsno + ) { + return ( + <> + + { + // let arr = orderarr; + // arr[currentsno - 1].deliverytime = val + // setOrderarr([...arr]) + // console.log(arr) + // }} + onClick={() => { + setSelectedtime(dayjs(val).format('hh:mm A')); + }} + /> + + + ); + } + })} + + + + + + + + - + { + setOpen4(false); + }} + > + {/* {list(anchor)} */} + + + + + -} + ); +}; -export default Createorder1; \ No newline at end of file +export default Createorder1; diff --git a/yarn.lock b/yarn.lock index b43bf0b..aa42bdf 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5676,6 +5676,11 @@ fs.realpath@^1.0.0: resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz" integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= +fsevents@^2.3.2, fsevents@~2.3.2: + version "2.3.2" + resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz" + integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA== + function-bind@^1.1.1: version "1.1.1" resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz" @@ -5701,6 +5706,11 @@ gensync@^1.0.0-beta.2: resolved "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz" integrity sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg== +geolib@^3.3.4: + version "3.3.4" + resolved "https://registry.npmjs.org/geolib/-/geolib-3.3.4.tgz" + integrity sha512-EicrlLLL3S42gE9/wde+11uiaYAaeSVDwCUIv2uMIoRBfNJCn8EsSI+6nS3r4TCKDO6+RQNM9ayLq2at+oZQWQ== + get-caller-file@^2.0.5: version "2.0.5" resolved "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz"