diff --git a/nearlexpressbuild b/nearlexpressbuild index 8088078..7bbcc45 160000 --- a/nearlexpressbuild +++ b/nearlexpressbuild @@ -1 +1 @@ -Subproject commit 808807828ad61f96a2e0a04da2f8c81af6a3297f +Subproject commit 7bbcc4548e49a186218b17e89fec283bdf8a9627 diff --git a/package-lock.json b/package-lock.json index 413a7c0..b037b0a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,6 +21,7 @@ "@reduxjs/toolkit": "^1.9.5", "@svgr/webpack": "^7.0.0", "antd": "^5.11.5", + "autosuggest-highlight": "^3.3.4", "axios": "^1.3.5", "buffer": "^6.0.3", "chance": "^1.1.11", @@ -5915,6 +5916,14 @@ "postcss": "^8.1.0" } }, + "node_modules/autosuggest-highlight": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/autosuggest-highlight/-/autosuggest-highlight-3.3.4.tgz", + "integrity": "sha512-j6RETBD2xYnrVcoV1S5R4t3WxOlWZKyDQjkwnggDPSjF5L4jV98ZltBpvPvbkM1HtoSe5o+bNrTHyjPbieGeYA==", + "dependencies": { + "remove-accents": "^0.4.2" + } + }, "node_modules/available-typed-arrays": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz", @@ -17617,6 +17626,11 @@ "node": ">= 0.10" } }, + "node_modules/remove-accents": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.4.tgz", + "integrity": "sha512-EpFcOa/ISetVHEXqu+VwI96KZBmq+a8LJnGkaeFw45epGlxIZz5dhEEnNZMsQXgORu3qaMoLX4qJCzOik6ytAg==" + }, "node_modules/renderkid": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-3.0.0.tgz", @@ -24370,6 +24384,14 @@ "postcss-value-parser": "^4.2.0" } }, + "autosuggest-highlight": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/autosuggest-highlight/-/autosuggest-highlight-3.3.4.tgz", + "integrity": "sha512-j6RETBD2xYnrVcoV1S5R4t3WxOlWZKyDQjkwnggDPSjF5L4jV98ZltBpvPvbkM1HtoSe5o+bNrTHyjPbieGeYA==", + "requires": { + "remove-accents": "^0.4.2" + } + }, "available-typed-arrays": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz", @@ -32632,6 +32654,11 @@ "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz", "integrity": "sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog==" }, + "remove-accents": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.4.tgz", + "integrity": "sha512-EpFcOa/ISetVHEXqu+VwI96KZBmq+a8LJnGkaeFw45epGlxIZz5dhEEnNZMsQXgORu3qaMoLX4qJCzOik6ytAg==" + }, "renderkid": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-3.0.0.tgz", diff --git a/package.json b/package.json index fbec81f..54213f3 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "@reduxjs/toolkit": "^1.9.5", "@svgr/webpack": "^7.0.0", "antd": "^5.11.5", + "autosuggest-highlight": "^3.3.4", "axios": "^1.3.5", "buffer": "^6.0.3", "chance": "^1.1.11", diff --git a/src/layout/MainLayout/Header/HeaderContent/Profile/index.js b/src/layout/MainLayout/Header/HeaderContent/Profile/index.js index 42888ba..af713d1 100644 --- a/src/layout/MainLayout/Header/HeaderContent/Profile/index.js +++ b/src/layout/MainLayout/Header/HeaderContent/Profile/index.js @@ -64,6 +64,7 @@ const Profile = () => { localStorage.removeItem('authname'); localStorage.removeItem('roleid'); localStorage.removeItem('tenantid'); + localStorage.clear(); navigate('/login') diff --git a/src/pages/nearle/orders/createorder1.js b/src/pages/nearle/orders/createorder1.js new file mode 100644 index 0000000..3a2cda0 --- /dev/null +++ b/src/pages/nearle/orders/createorder1.js @@ -0,0 +1,1552 @@ +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 +} from '@mui/material'; +import { useNavigate } from 'react-router'; +import CheckCircleIcon from '@mui/icons-material/CheckCircle'; +import AccessTimeOutlinedIcon from '@mui/icons-material/AccessTimeOutlined'; +import { PopupTransition } from 'components/@extended/Transitions'; +// var utc = require('dayjs/plugin/utc') +import * as React from 'react'; + +import axios from 'axios'; +import { useTheme } from '@mui/material/styles'; +// import { usePlacesWidget } from "react-google-autocomplete"; +import Geocode from "react-geocode"; +// import {setApi} from "react-geocode"; +import Autocomplete1 from "react-google-autocomplete"; +// import logo from 'assets/images/location.png' +import Loader from 'components/Loader' + +import { + // EditOutlined, + CloseOutlined, + PlusOutlined, + SearchOutlined +} from '@ant-design/icons'; +import { usePlacesWidget } from "react-google-autocomplete"; + +import { DeleteOutlined } from '@ant-design/icons'; + +import MainCard from 'components/MainCard'; +import { + EnvironmentOutlined, + // LinkOutlined, + // MailOutlined, + // MoreOutlined, + // PhoneOutlined +} from '@ant-design/icons'; +import CheckCircleRoundedIcon from '@mui/icons-material/CheckCircleRounded'; +// import VisibilityIcon from '@mui/icons-material/Visibility'; +// import AccessTimeFilledIcon from '@mui/icons-material/AccessTimeFilled'; +// import EditCalendarIcon from '@mui/icons-material/EditCalendar'; +import AccessibilityNewIcon from '@mui/icons-material/AccessibilityNew'; + +// import { PatternFormat } from 'react-number-format'; +import { DatePicker } from '@mui/x-date-pickers/DatePicker'; +import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; +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 +} from 'react'; +// import { Label } from '@mui/icons-material'; +import dayjs from 'dayjs'; +// import { useDispatch } from 'react-redux'; +// import { openSnackbar, closeSnackbar } from 'store/reducers/snackbar'; +// import {Autocompletemap} from 'pages/autocompletemap' +import { enqueueSnackbar } from 'notistack'; +// import { CheckBox } from '@mui/icons-material'; +// 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; + } + + 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('') + + + + + useEffect(() => { + if (localStorage.getItem('tenantid')) { + + fetchtenantlocation(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++) { + 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 (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) + }) + } + + const fetchtenantlocation = async (tid) => { + setLoading(true) + await axios.get(`${process.env.REACT_APP_URL}/tenants/gettenantlocations/?tenantid=${tid}`) + + .then((res) => { + console.log(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": parseInt(localStorage.getItem('tenantid')), + "locationid": tenantinfo.locationid, + "moduleid": tenantinfo.moduleid, + "configid": 7, + "orderid": "", + "customerid": clientinfo.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, + "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')) + + }] + if (!tenantinfo.tenantid) { + opentoast('Choose Location') + + } else if (!clientinfo.address) { + opentoast('Choose Customer') + + } else if (!selectedtime) { + opentoast('Choose Schedule Time') + } else { + setLoading(true) + await axios.post(`${process.env.REACT_APP_URL}/orders/createorders1`, 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]) + + 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) + 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" + } + } + }) + .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) + + }) + } + + + + + + return <> + {(loading) && + + + + } + + + + + + Create Order + + + + + + + + + + + + {/* + + + + */} + + + + + + + + + Pickup Location + + } + onChange={(e, val) => { + if (val) { + + setTenantinfo(val) + clientdetails(val.tenantid) + } else { + setTenantinfo({}) + } + + console.log(val) + }} + + disabled={(tenant.tenantid) ? false : true} + /> + + + + + + {' '}{tenantinfo.locationaddress || ''} + + + + + + + + Drop Location + + } + onChange={(e, val) => { + if (val) { + + setClientinfo(val) + } else { + setClientinfo({}) + } + + console.log(val) + }} + + // 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')) + }} + /> + + + + } + + }) + + } + + + + + + + + + + + { + setOpen4(false) + + }} + + > + {/* {list(anchor)} */} + + + + + +     + +} + +export default Createorder1; \ No newline at end of file diff --git a/src/pages/nearle/orders/map.js b/src/pages/nearle/orders/map.js new file mode 100644 index 0000000..7c4a702 --- /dev/null +++ b/src/pages/nearle/orders/map.js @@ -0,0 +1,156 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; +import TextField from '@mui/material/TextField'; +import Autocomplete from '@mui/material/Autocomplete'; +import LocationOnIcon from '@mui/icons-material/LocationOn'; +import Grid from '@mui/material/Grid'; +import Typography from '@mui/material/Typography'; +import parse from 'autosuggest-highlight/parse'; +import { debounce } from '@mui/material/utils'; + +// This key was created specifically for the demo in mui.com. +// You need to create a new one for your application. +const GOOGLE_MAPS_API_KEY ='AIzaSyCF4KatYCI3vqz1_H3kiHeyS3yCMfYToh8'; + +function loadScript(src, position, id) { + if (!position) { + return; + } + + const script = document.createElement('script'); + script.setAttribute('async', ''); + script.setAttribute('id', id); + script.src = src; + position.appendChild(script); +} + +const autocompleteService = { current: null }; + +export default function GoogleMaps() { + const [value, setValue] = React.useState(null); + const [inputValue, setInputValue] = React.useState(''); + const [options, setOptions] = React.useState([]); + const loaded = React.useRef(false); + + if (typeof window !== 'undefined' && !loaded.current) { + if (!document.querySelector('#google-maps')) { + loadScript( + `https://maps.googleapis.com/maps/api/js?key=${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]); + + return ( + + 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); + }} + onInputChange={(event, newInputValue) => { + setInputValue(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} + + + +
    • + ); + }} + /> + ); +} \ No newline at end of file diff --git a/src/routes/MainRoutes.js b/src/routes/MainRoutes.js index baa920b..208764c 100644 --- a/src/routes/MainRoutes.js +++ b/src/routes/MainRoutes.js @@ -28,6 +28,7 @@ const Accountsettings = Loadable(lazy(() => import('pages/nearle/accountsettings const Createorder = Loadable(lazy(() => import('pages/nearle/orders/createorder'))); const Createclient = Loadable(lazy(() => import('pages/nearle/clients/createclient'))); +const Createorder1 = Loadable(lazy(() => import('pages/nearle/orders/createorder1'))); @@ -72,6 +73,10 @@ const MainRoutes = { path: 'orders/create', element: }, + { + path: 'orders/create1', + element: + }, { path: 'orders/details', element:
    diff --git a/yarn.lock b/yarn.lock index 24d7991..b43bf0b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3302,6 +3302,13 @@ autoprefixer@^10.4.11: picocolors "^1.0.0" postcss-value-parser "^4.2.0" +autosuggest-highlight@^3.3.4: + version "3.3.4" + resolved "https://registry.npmjs.org/autosuggest-highlight/-/autosuggest-highlight-3.3.4.tgz" + integrity sha512-j6RETBD2xYnrVcoV1S5R4t3WxOlWZKyDQjkwnggDPSjF5L4jV98ZltBpvPvbkM1HtoSe5o+bNrTHyjPbieGeYA== + dependencies: + remove-accents "^0.4.2" + available-typed-arrays@^1.0.5: version "1.0.5" resolved "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz" @@ -9421,6 +9428,11 @@ relateurl@^0.2.7: resolved "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz" integrity sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog== +remove-accents@^0.4.2: + version "0.4.4" + resolved "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.4.tgz" + integrity sha512-EpFcOa/ISetVHEXqu+VwI96KZBmq+a8LJnGkaeFw45epGlxIZz5dhEEnNZMsQXgORu3qaMoLX4qJCzOik6ytAg== + renderkid@^3.0.0: version "3.0.0" resolved "https://registry.npmjs.org/renderkid/-/renderkid-3.0.0.tgz"