customerEdit
This commit is contained in:
joshikannan
@@ -1,7 +1,6 @@
|
||||
import React from 'react';
|
||||
import { Avatar, Pagination, Tooltip, stepContentClasses } from '@mui/material';
|
||||
import { useEffect, useRef, useState, Fragment } from 'react';
|
||||
// import { useTheme, styled } from "@mui/material/styles";
|
||||
import { useEffect, useRef, useState, Fragment, useMemo } from 'react';
|
||||
import { useTheme } from '@mui/material/styles';
|
||||
import Skeleton from '@mui/material/Skeleton';
|
||||
import HeartFilled from '@mui/icons-material/Favorite';
|
||||
@@ -9,6 +8,9 @@ import HeartFilled from '@mui/icons-material/Favorite';
|
||||
import Loader from 'components/Loader';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import { FilterList } from '@mui/icons-material';
|
||||
import { FaRegEdit } from 'react-icons/fa';
|
||||
import { RiEdit2Fill } from 'react-icons/ri';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
|
||||
import {
|
||||
Box,
|
||||
@@ -42,8 +44,13 @@ import {
|
||||
TableHead,
|
||||
TableCell,
|
||||
TableBody,
|
||||
TableRow
|
||||
TableRow,
|
||||
Autocomplete
|
||||
} from '@mui/material';
|
||||
import Geocode from 'react-geocode';
|
||||
import LocationOnIcon from '@mui/icons-material/LocationOn';
|
||||
import parse from 'autosuggest-highlight/parse';
|
||||
import { debounce } from '@mui/material/utils';
|
||||
import ClearIcon from '@mui/icons-material/Clear';
|
||||
import { MdPersonAdd } from 'react-icons/md';
|
||||
// import { MdAccountCircle } from "react-icons/md";
|
||||
@@ -53,35 +60,7 @@ import { MdPersonAddDisabled } from 'react-icons/md';
|
||||
// import { DatePicker } from "@mui/x-date-pickers/DatePicker";
|
||||
import { ThemeMode } from 'config';
|
||||
// import { FaUserLarge } from "react-icons/fa6";
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import {
|
||||
RightOutlined,
|
||||
LeftOutlined,
|
||||
AudioMutedOutlined,
|
||||
CloseOutlined,
|
||||
DeleteOutlined,
|
||||
DownloadOutlined,
|
||||
InfoCircleOutlined,
|
||||
MenuFoldOutlined,
|
||||
MenuUnfoldOutlined,
|
||||
MoreOutlined,
|
||||
PaperClipOutlined,
|
||||
PhoneOutlined,
|
||||
PictureOutlined,
|
||||
SendOutlined,
|
||||
SmileOutlined,
|
||||
SoundOutlined,
|
||||
VideoCameraOutlined,
|
||||
SearchOutlined,
|
||||
BarChartOutlined,
|
||||
UsergroupAddOutlined,
|
||||
NotificationOutlined,
|
||||
PercentageOutlined,
|
||||
CheckCircleFilled,
|
||||
ClockCircleFilled,
|
||||
MinusCircleFilled,
|
||||
DeleteFilled
|
||||
} from '@ant-design/icons';
|
||||
import { MoreOutlined, SearchOutlined, DeleteFilled } from '@ant-design/icons';
|
||||
// import ChatDrawer from "sections/apps/chat/ChatDrawer";
|
||||
// import ChatHistory from "sections/apps/chat/ChatHistory";
|
||||
// import UserAvatar from "sections/apps/chat/UserAvatar";
|
||||
@@ -93,7 +72,6 @@ import { PopupTransition } from 'components/@extended/Transitions';
|
||||
import axios from 'axios';
|
||||
// import HoverSocialCard from "../../pages/reports/HoverSocialCard";
|
||||
import HoverSocialCard from 'components/cards/statistics/HoverSocialCard';
|
||||
|
||||
// import TasksCard from "sections/widget/data/TasksCard";
|
||||
// import ApplicationSales from "sections/widget/data/ApplicationSales";
|
||||
// import Button from "themes/overrides/Button";
|
||||
@@ -139,6 +117,23 @@ const drawerWidth = 320;
|
||||
// })
|
||||
// );
|
||||
|
||||
// ==============================|| google address ||============================== //
|
||||
const GOOGLE_MAPS_API_KEY = process.env.REACT_APP_GOOGLE_MAPS_API_KEY;
|
||||
|
||||
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 BootstrapDialog = styled(Dialog)(({ theme }) => ({
|
||||
'& .MuiDialog-paperWidthSm': {
|
||||
maxWidth: '60%',
|
||||
@@ -174,6 +169,8 @@ const Clients1 = () => {
|
||||
const ref = useRef(null);
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const [open3, setOpen3] = React.useState(false);
|
||||
const [open4, setOpen4] = React.useState(false);
|
||||
const [selectedCustomer, setSelectedCustomer] = useState({}); // to edit
|
||||
|
||||
const [packDays, setPackDays] = useState(0);
|
||||
const [startDate, setStartDate] = useState('');
|
||||
@@ -198,6 +195,128 @@ const Clients1 = () => {
|
||||
const [tenid, setTenid] = useState('');
|
||||
const [loading1, setLoading1] = useState(false);
|
||||
const [currentcustomerid, setCurrentcustomerid] = useState('');
|
||||
|
||||
const [address, setAddress] = useState('');
|
||||
const [latlong, setLatlong] = useState({});
|
||||
|
||||
// ==============================|| for google address ||============================== //
|
||||
const [value, setValue] = useState(null);
|
||||
const [inputValue, setInputValue] = useState('');
|
||||
const [options, setOptions] = useState([]);
|
||||
const loaded = 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 = useMemo(
|
||||
() =>
|
||||
debounce((request, callback) => {
|
||||
autocompleteService.current.getPlacePredictions(request, callback);
|
||||
}, 400),
|
||||
[]
|
||||
);
|
||||
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]);
|
||||
|
||||
Geocode.setApiKey(process.env.REACT_APP_GOOGLE_MAPS_API_KEY);
|
||||
useEffect(() => {
|
||||
try {
|
||||
console.log('selected address =>', address);
|
||||
Geocode.fromAddress(address).then(
|
||||
(response) => {
|
||||
console.log('lat long response =>', response.results[0]);
|
||||
if (response.status == 'OK') {
|
||||
const { lat, lng } = response.results[0].geometry.location;
|
||||
setLatlong({
|
||||
lat,
|
||||
lng
|
||||
});
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
latitude: lat,
|
||||
longitude: lng
|
||||
});
|
||||
}
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
}
|
||||
);
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
}, [address]);
|
||||
|
||||
useEffect(() => {
|
||||
selectedCustomer &&
|
||||
setLatlong({
|
||||
lat: selectedCustomer.latitude,
|
||||
lng: selectedCustomer.longitude
|
||||
});
|
||||
}, [selectedCustomer]);
|
||||
|
||||
const openToast = (message, variant, duration) => {
|
||||
enqueueSnackbar(message, {
|
||||
variant: variant,
|
||||
anchorOrigin: { vertical: 'top', horizontal: 'right' },
|
||||
autoHideDuration: duration
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
console.log('selectedCustomer', selectedCustomer);
|
||||
}, [selectedCustomer]);
|
||||
|
||||
// ==============================|| for dialog ||============================== //
|
||||
|
||||
const handleClickOpen4 = () => {
|
||||
setOpen4(true);
|
||||
};
|
||||
|
||||
const handleClose4 = () => {
|
||||
setOpen4(false);
|
||||
};
|
||||
/* ============================================= || handleKeyPress (ctrl+k)| ============================================= */
|
||||
const textFieldRef = useRef(null);
|
||||
|
||||
@@ -258,12 +377,6 @@ const Clients1 = () => {
|
||||
}
|
||||
}, []);
|
||||
|
||||
// useEffect(() => {
|
||||
// if (tenid) {
|
||||
// fetchData1();
|
||||
// }
|
||||
// }, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (tenid && !search) {
|
||||
// fetchData1();
|
||||
@@ -423,6 +536,7 @@ const Clients1 = () => {
|
||||
// setArr(arr)
|
||||
// setRows([...arr])
|
||||
// setStafflist([...arr])
|
||||
setSelectedCustomer(arr[0]);
|
||||
setUsers([...arr]);
|
||||
setTempusers([...arr]);
|
||||
// if(arr[0].customerid){
|
||||
@@ -482,33 +596,6 @@ const Clients1 = () => {
|
||||
}
|
||||
};
|
||||
|
||||
// const fetchData = async (customerId) => {
|
||||
// setUsernameload(true);
|
||||
|
||||
// try {
|
||||
// const response = await axios.get(
|
||||
// `${process.env.REACT_APP_URL}/customers/summary?customerid=${customerId}`
|
||||
// );
|
||||
// if (response.data.status) {
|
||||
// setvisits(response.data.customervisits.visits);
|
||||
// setBillAmount(response.data.customervisits.billamount);
|
||||
// setPromotions(response.data.customervisits.promotions);
|
||||
// setCustVisits(response.data.customervisits);
|
||||
// setCustService(response.data.customerservices);
|
||||
// setCustMembership(response.data.customermembership);
|
||||
// console.log("customervisits", response.data.customervisits);
|
||||
// console.log("customerservices", response.data.customerservices);
|
||||
// console.log("customermembership", response.data.customermembership);
|
||||
// }
|
||||
// setLoading(false);
|
||||
// setUsernameload(false);
|
||||
// } catch (error) {
|
||||
// console.error("Error fetching data:", error);
|
||||
// setLoading(false);
|
||||
// setUsernameload(false);
|
||||
// }
|
||||
// };
|
||||
|
||||
const fetchData = async (tid) => {
|
||||
try {
|
||||
await axios
|
||||
@@ -609,6 +696,66 @@ const Clients1 = () => {
|
||||
);
|
||||
}
|
||||
|
||||
// ==============================|| updateCustomer (post)||============================== //
|
||||
const updateCustomer = async () => {
|
||||
if (!selectedCustomer.firstname) {
|
||||
openToast('Enter Door NO', 'warning', 1500);
|
||||
} else if (!selectedCustomer.contactno) {
|
||||
openToast('Enter Contact Number ', 'warning', 1500);
|
||||
} else if (!selectedCustomer.address) {
|
||||
openToast('Enter Valid Address', 'warning', 1500);
|
||||
} else if (!selectedCustomer.doorno) {
|
||||
openToast('Enter Door Number ', 'warning', 1500);
|
||||
} else if (!selectedCustomer.suburb) {
|
||||
openToast('Enter Suburb', 'warning', 1500);
|
||||
} else if (!selectedCustomer.city) {
|
||||
openToast('Enter City ', 'warning', 1500);
|
||||
} else if (!selectedCustomer.state) {
|
||||
openToast('Enter State', 'warning', 1500);
|
||||
} else if (!selectedCustomer.postcode) {
|
||||
openToast('Enter PostCode', 'warning', 1500);
|
||||
} else if (!selectedCustomer.landmark) {
|
||||
openToast('Enter Landmark', 'warning', 1500);
|
||||
} else if (!selectedCustomer.latitude) {
|
||||
openToast('Enter Latitude', 'warning', 1500);
|
||||
} else if (!selectedCustomer.longitude) {
|
||||
openToast('Enter Longitude', 'warning', 1500);
|
||||
} else {
|
||||
try {
|
||||
const postUpdateResponse = await axios.put(`${process.env.REACT_APP_URL}/customers/update`, {
|
||||
customerid: selectedCustomer.customerid,
|
||||
configid: 1,
|
||||
firstname: selectedCustomer.firstname,
|
||||
applocationid: selectedCustomer.applocationid,
|
||||
profileimage: '',
|
||||
dialcode: '+91',
|
||||
contactno: selectedCustomer.contactno,
|
||||
devicetype: '',
|
||||
deviceid: '',
|
||||
customertoken: '123',
|
||||
address: selectedCustomer.address,
|
||||
suburb: selectedCustomer.suburb,
|
||||
city: selectedCustomer.city,
|
||||
state: selectedCustomer.state,
|
||||
postcode: selectedCustomer.postcode,
|
||||
landmark: selectedCustomer.landmark,
|
||||
doorno: selectedCustomer.doorno,
|
||||
latitude: selectedCustomer.latitude.toString(),
|
||||
longitude: selectedCustomer.longitude.toString()
|
||||
});
|
||||
|
||||
console.log('postUpdateResponse', postUpdateResponse);
|
||||
if (postUpdateResponse.data.status) {
|
||||
openToast(postUpdateResponse.data.message, 'success', 1500);
|
||||
handleClose4();
|
||||
fetchtable(localStorage.getItem('tenantid'));
|
||||
}
|
||||
} catch (error) {
|
||||
console.log('postUpdate error', error);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{(loading || usernameload) && <Loader />}
|
||||
@@ -806,6 +953,7 @@ const Clients1 = () => {
|
||||
setContactno(user.contactno);
|
||||
fetchData(user.customerid);
|
||||
fetchpercentage(user.customerid);
|
||||
setSelectedCustomer(user);
|
||||
}}
|
||||
>
|
||||
<ListItemAvatar>
|
||||
@@ -1105,7 +1253,7 @@ const Clients1 = () => {
|
||||
{
|
||||
<DeleteFilled
|
||||
style={{
|
||||
fontSize: '20px',
|
||||
fontSize: '12px',
|
||||
marginRight: '15px'
|
||||
}}
|
||||
/>
|
||||
@@ -1284,6 +1432,24 @@ const Clients1 = () => {
|
||||
</DialogActions>
|
||||
</BootstrapDialog> */}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleCloseSort}>
|
||||
<Button
|
||||
variant="text"
|
||||
onClick={() => {
|
||||
handleClickOpen4();
|
||||
}}
|
||||
>
|
||||
{
|
||||
<RiEdit2Fill
|
||||
style={{
|
||||
fontSize: '12px',
|
||||
marginRight: '15px'
|
||||
}}
|
||||
/>
|
||||
}{' '}
|
||||
Edit
|
||||
</Button>
|
||||
</MenuItem>
|
||||
{/* <MenuItem onClick={handleCloseSort}>
|
||||
<Button
|
||||
variant="text"
|
||||
@@ -1309,6 +1475,254 @@ const Clients1 = () => {
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
{/* ======================================== || Edit Dialog || ======================================== */}
|
||||
<Dialog
|
||||
open={open4}
|
||||
onClose={handleClose4}
|
||||
aria-labelledby="alert-dialog-title"
|
||||
aria-describedby="alert-dialog-description"
|
||||
maxWidth="lg"
|
||||
fullWidth
|
||||
>
|
||||
<DialogTitle id="alert-dialog-title" sx={{ bgcolor: theme.palette.primary.main, color: 'white' }}>
|
||||
<Stack direction={'row'} alignItems={'center'} spacing={1}>
|
||||
<FaRegEdit style={{ fontSize: 25 }} /> <Typography variant="h3">Edit Customer</Typography>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<Grid container spacing={2} sx={{ mt: 2 }}>
|
||||
<Grid item xs={6}>
|
||||
<Typography sx={{ mb: 1 }}>Customer Name</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.firstname}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
firstname: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Contact Number</Typography>
|
||||
<Stack direction={'row'}>
|
||||
<TextField readonly variant="outlined" value={'+91'} sx={{ width: 60 }} />
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.contactno}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
contactno: e.target.value
|
||||
});
|
||||
}}
|
||||
inputProps={{
|
||||
maxLength: 10
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Address</Typography>
|
||||
<Autocomplete
|
||||
id="google-map-demo"
|
||||
sx={{}}
|
||||
fullWidth
|
||||
getOptionLabel={(option) => (typeof option === 'string' ? option : option.description)}
|
||||
filterOptions={(x) => x}
|
||||
options={options}
|
||||
autoComplete
|
||||
includeInputInList
|
||||
filterSelectedOptions
|
||||
value={selectedCustomer.address}
|
||||
noOptionsText="No locations"
|
||||
onChange={(event, newValue) => {
|
||||
setOptions(newValue ? [newValue, ...options] : options);
|
||||
setValue(newValue);
|
||||
console.log('newValue', newValue.description);
|
||||
setAddress(newValue.description);
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
address: newValue.description
|
||||
});
|
||||
}}
|
||||
onInputChange={(event, newInputValue) => {
|
||||
setInputValue(newInputValue);
|
||||
}}
|
||||
renderInput={(params) => <TextField {...params} fullWidth />}
|
||||
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 (
|
||||
<li {...props}>
|
||||
<Grid container alignItems="center">
|
||||
<Grid item sx={{ display: 'flex', width: 44 }}>
|
||||
<LocationOnIcon sx={{ color: 'text.secondary' }} />
|
||||
</Grid>
|
||||
<Grid
|
||||
item
|
||||
sx={{
|
||||
width: 'calc(100% - 44px)',
|
||||
wordWrap: 'break-word'
|
||||
}}
|
||||
>
|
||||
{parts.map((part, index) => (
|
||||
<Box
|
||||
key={index}
|
||||
component="span"
|
||||
sx={{
|
||||
fontWeight: part.highlight ? 'bold' : 'regular'
|
||||
}}
|
||||
>
|
||||
{part.text}
|
||||
</Box>
|
||||
))}
|
||||
<Typography variant="body2" color="text.secondary">
|
||||
{option.structured_formatting.secondary_text}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</li>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Door No</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.doorno}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
doorno: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
<Typography sx={{ mb: 1 }}>Suburb</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.suburb}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
suburb: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>City</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.city}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
city: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>State</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.state}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
state: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Postcode</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.postcode}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
postcode: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Landmark</Typography>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
defaultValue={selectedCustomer.landmark}
|
||||
onChange={(e) => {
|
||||
setSelectedCustomer({
|
||||
...selectedCustomer,
|
||||
landmark: e.target.value
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} sx={{ cursor: 'not-allowed' }}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Latitude</Typography>
|
||||
<TextField variant="outlined" fullWidth value={latlong.lat} sx={{ cursor: 'not-allowed' }} />
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={6} sx={{ cursor: 'not-allowed' }}>
|
||||
{' '}
|
||||
<Typography sx={{ mb: 1 }}>Longitude</Typography>
|
||||
<TextField readonly variant="outlined" fullWidth value={latlong.lng} />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</DialogContent>
|
||||
<DialogActions sx={{ mr: 2, mb: 2 }}>
|
||||
<Button onClick={handleClose4} variant="contained" color="error" sx={{ mr: 2 }}>
|
||||
Close
|
||||
</Button>
|
||||
<Button
|
||||
onClick={() => {
|
||||
updateCustomer();
|
||||
}}
|
||||
variant="contained"
|
||||
autoFocus
|
||||
>
|
||||
Update
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{/* ======================================== || Cards || ======================================== */}
|
||||
<Grid
|
||||
item
|
||||
|
||||
Reference in New Issue
Block a user