customers
This commit is contained in:
joshikannan
@@ -1,298 +1,151 @@
|
||||
import {
|
||||
Box, Tab, Tabs,
|
||||
Chip,
|
||||
Divider,
|
||||
Grid,
|
||||
Link,
|
||||
List,
|
||||
ListItem,
|
||||
ListItemIcon,
|
||||
ListItemSecondaryAction,
|
||||
Stack,
|
||||
Typography,
|
||||
useMediaQuery,
|
||||
Avatar,
|
||||
|
||||
} from '@mui/material';
|
||||
import { Grid, List, ListItem, Stack, Typography, useMediaQuery } from '@mui/material';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import LinearWithLabel from 'components/@extended/progress/LinearWithLabel';
|
||||
// import { PatternFormat } from 'react-number-format';
|
||||
|
||||
import axios from 'axios';
|
||||
// project import
|
||||
import MainCard from 'components/MainCard';
|
||||
import { AimOutlined, EnvironmentOutlined, MailOutlined, PhoneOutlined } from '@ant-design/icons';
|
||||
import { useEffect ,useState} from 'react';
|
||||
import { useEffect, useState } from 'react';
|
||||
import Loader from 'components/Loader';
|
||||
import Footer from 'layout/MainLayout/Footer';
|
||||
import TitleCard from './titleCard';
|
||||
|
||||
const Accountsettings = () => {
|
||||
const matchDownMD = useMediaQuery((theme) => theme.breakpoints.down('md'));
|
||||
const [info, setInfo] = useState({});
|
||||
const [loading,setLoading]=useState(false)
|
||||
const matchDownMD = useMediaQuery((theme) => theme.breakpoints.down('md'));
|
||||
const [info, setInfo] = useState({});
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem('tenantid')) {
|
||||
fetchaccount(localStorage.getItem('tenantid'));
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem('tenantid')) {
|
||||
fetchaccount(localStorage.getItem('tenantid'));
|
||||
}
|
||||
}, []);
|
||||
|
||||
const fetchaccount = 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) {
|
||||
setInfo(res.data.details);
|
||||
}
|
||||
}, []);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
enqueueSnackbar(err.message, {
|
||||
variant: 'error',
|
||||
anchorOrigin: { vertical: 'top', horizontal: 'right' },
|
||||
autoHideDuration: 2000
|
||||
});
|
||||
setLoading(false);
|
||||
});
|
||||
};
|
||||
|
||||
const fetchaccount = 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) {
|
||||
setInfo(res.data.details);
|
||||
}
|
||||
setLoading(false)
|
||||
}).catch((err) => {
|
||||
console.log(err)
|
||||
enqueueSnackbar(err.message, {
|
||||
variant: 'error', anchorOrigin: { vertical: 'top', horizontal: 'right' },
|
||||
autoHideDuration: 2000
|
||||
})
|
||||
setLoading(false)
|
||||
})
|
||||
return (
|
||||
<>
|
||||
{loading && <Loader />}
|
||||
<TitleCard title={'Profile'} />
|
||||
|
||||
|
||||
}
|
||||
|
||||
return <>
|
||||
{loading &&
|
||||
|
||||
<Loader />
|
||||
|
||||
}
|
||||
<Grid container rowSpacing={4.5} columnSpacing={2.75}>
|
||||
<Grid item xs={12} sx={{ mb: -2.25 }}>
|
||||
<Stack direction={{ xs: 'column', md: 'row' }} justifyContent='space-between' alignItems='center' spacing={2}>
|
||||
<Stack direction='column' alignItems='flex-start' spacing={1}>
|
||||
<Typography variant="h3">Account Settings</Typography>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<MainCard border={false} boxShadow sx={{height:'100%'}}>
|
||||
<Box sx={{ borderBottom: 1, borderColor: 'divider', width: '100%',height:'100%' }}>
|
||||
<Tabs value={0}
|
||||
// onChange={handleChange}
|
||||
variant="scrollable" scrollButtons="auto" aria-label="account profile tab">
|
||||
<Tab label="Account"
|
||||
// component={Link} to="/apps/profiles/account/basic" icon={<UserOutlined />} iconPosition="start"
|
||||
/>
|
||||
</Tabs>
|
||||
|
||||
|
||||
|
||||
|
||||
<Grid container spacing={3}
|
||||
sx={{ mt: 1,height:'100%'}}
|
||||
>
|
||||
{/* <Grid item xs={12} sm={5} md={4} xl={3}>
|
||||
<Grid container spacing={3} sx={{height:'100%'}}>
|
||||
<Grid item xs={12} sx={{height:'100%'}}>
|
||||
<MainCard sx={{height:'100%'}}>
|
||||
<Grid container spacing={3} sx={{height:'100%'}}>
|
||||
<Grid item xs={12} sx={{height:'100%'}}>
|
||||
<Stack direction="row" justifyContent="flex-end">
|
||||
</Stack>
|
||||
<Stack spacing={2.5} alignItems="center">
|
||||
<Avatar alt="Avatar 1"
|
||||
sx={{width:80,height:80}}
|
||||
/>
|
||||
<Stack spacing={0.5} alignItems="center">
|
||||
<Typography variant="h5">{info.companyname || ''}</Typography>
|
||||
<Typography color="secondary">{info.registrationno || ''}</Typography>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
<Grid item xs={12} sx={{height:'100%'}}>
|
||||
<List component="nav" aria-label="main mailbox folders" sx={{ py: 0, '& .MuiListItem-root': { p: 0, py: 1 } }}>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<MailOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
<Typography align="right">{info.primaryemail || ''}</Typography>
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<PhoneOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
<Typography align="right">
|
||||
{info.primarycontact || ''}
|
||||
</Typography>
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<AimOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
<Typography align="right">
|
||||
{info.city}
|
||||
</Typography>
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<EnvironmentOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
|
||||
{info.state}
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
|
||||
</Grid>
|
||||
</Grid> */}
|
||||
<Grid item
|
||||
// xs={12} sm={7} md={8} xl={9}
|
||||
xs={12}
|
||||
// sm={7} md={8} xl={9}
|
||||
|
||||
>
|
||||
<Grid container spacing={3} >
|
||||
|
||||
<Grid item xs={12} >
|
||||
<MainCard
|
||||
// title={ <Stack direction="row" alignItems="center" spacing={1} justifyContent="flex-start">
|
||||
// <Avatar
|
||||
// alt=""
|
||||
// size="sm"
|
||||
// sx={{
|
||||
// width: '25px',
|
||||
// height: '25px'
|
||||
// }}
|
||||
// >
|
||||
|
||||
// </Avatar>
|
||||
// <Stack direction="column">
|
||||
// <Typography variant="caption">{info.companyname}</Typography>
|
||||
// </Stack>
|
||||
// </Stack>}
|
||||
>
|
||||
<List sx={{ py: 0 }}>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Name</Typography>
|
||||
<Typography>{info.tenantname || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Company Name</Typography>
|
||||
<Typography>{info.companyname || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Registration No</Typography>
|
||||
<Typography>{info.registrationno || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Info</Typography>
|
||||
<Typography>{info.info || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Phone</Typography>
|
||||
<Typography>
|
||||
{info.primarycontact || ''}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">State</Typography>
|
||||
<Typography>{info.state || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Email</Typography>
|
||||
<Typography>{info.primaryemail || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">City</Typography>
|
||||
<Typography>{info.city || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Suburb</Typography>
|
||||
<Typography>{info.suburb || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Zip Code</Typography>
|
||||
<Typography>{info.postcode || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Address</Typography>
|
||||
<Typography>{info.address || ''}</Typography>
|
||||
</Stack>
|
||||
</ListItem>
|
||||
</List>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
{/* <Grid item xs={12}>
|
||||
<MainCard title="Info">
|
||||
<Typography color="secondary">
|
||||
{info.info || ''}
|
||||
</Typography>
|
||||
</MainCard>
|
||||
</Grid> */}
|
||||
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12}>
|
||||
<MainCard>
|
||||
<List sx={{ py: 0 }}>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Name</Typography>
|
||||
<Typography>{info.tenantname || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Company Name</Typography>
|
||||
<Typography>{info.companyname || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
}
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Registration No</Typography>
|
||||
<Typography>{info.registrationno || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Info</Typography>
|
||||
<Typography>{info.info || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Phone</Typography>
|
||||
<Typography>{info.primarycontact || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">State</Typography>
|
||||
<Typography>{info.state || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
|
||||
export default Accountsettings;
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Email</Typography>
|
||||
<Typography>{info.primaryemail || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">City</Typography>
|
||||
<Typography>{info.city || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider={!matchDownMD}>
|
||||
<Grid container spacing={3}>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Suburb</Typography>
|
||||
<Typography>{info.suburb || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Zip Code</Typography>
|
||||
<Typography>{info.postcode || ''}</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Address</Typography>
|
||||
<Typography>{info.address || ''}</Typography>
|
||||
</Stack>
|
||||
</ListItem>
|
||||
</List>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Accountsettings;
|
||||
|
||||
Reference in New Issue
Block a user