02122023
This commit is contained in:
Malai Raja
409
src/pages/nearle/accountsettings.js
Normal file
409
src/pages/nearle/accountsettings.js
Normal file
@@ -0,0 +1,409 @@
|
||||
import {
|
||||
Box, Tab, Tabs,
|
||||
Chip,
|
||||
Divider,
|
||||
Grid,
|
||||
Link,
|
||||
List,
|
||||
ListItem,
|
||||
ListItemIcon,
|
||||
ListItemSecondaryAction,
|
||||
Stack,
|
||||
Typography,
|
||||
useMediaQuery,
|
||||
Avatar,
|
||||
|
||||
} from '@mui/material';
|
||||
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';
|
||||
|
||||
|
||||
const Accountsettings = () => {
|
||||
const matchDownMD = useMediaQuery((theme) => theme.breakpoints.down('md'));
|
||||
const [info, setInfo] = useState({})
|
||||
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem('tenantid')) {
|
||||
fetchaccount(localStorage.getItem('tenantid'));
|
||||
|
||||
}
|
||||
}, []);
|
||||
|
||||
const fetchaccount = async (tid) => {
|
||||
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);
|
||||
}
|
||||
}).catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
return <>
|
||||
<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">
|
||||
{/* <Chip label="Pro" size="small" color="primary" /> */}
|
||||
</Stack>
|
||||
<Stack spacing={2.5} alignItems="center">
|
||||
<Avatar alt="Avatar 1"
|
||||
// size="xl"
|
||||
sx={{width:80,height:80}}
|
||||
// src={avatarImage(`./default.png`)}
|
||||
/>
|
||||
<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}>
|
||||
<Stack direction="row" justifyContent="space-around" alignItems="center">
|
||||
<Stack spacing={0.5} alignItems="center">
|
||||
<Typography variant="h5">86</Typography>
|
||||
<Typography color="secondary">Post</Typography>
|
||||
</Stack>
|
||||
<Divider orientation="vertical" flexItem />
|
||||
<Stack spacing={0.5} alignItems="center">
|
||||
<Typography variant="h5">40</Typography>
|
||||
<Typography color="secondary">Project</Typography>
|
||||
</Stack>
|
||||
<Divider orientation="vertical" flexItem />
|
||||
<Stack spacing={0.5} alignItems="center">
|
||||
<Typography variant="h5">4.5K</Typography>
|
||||
<Typography color="secondary">Members</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">
|
||||
{/* (+1-876) 8654 239 581 */}
|
||||
{info.primarycontact || ''}
|
||||
</Typography>
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<AimOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
<Typography align="right">
|
||||
{/* New York */}
|
||||
{info.city}
|
||||
</Typography>
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemIcon>
|
||||
<EnvironmentOutlined />
|
||||
</ListItemIcon>
|
||||
<ListItemSecondaryAction>
|
||||
{/* <Link align="right" href="https://google.com" target="_blank">
|
||||
https://anshan.dh.url
|
||||
</Link> */}
|
||||
{info.state}
|
||||
</ListItemSecondaryAction>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
{/* <Grid item xs={12}>
|
||||
<MainCard title="Skills">
|
||||
<Grid container spacing={1.25}>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">Junior</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={30} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">UX Reseacher</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={80} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">Wordpress</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={90} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">HTML</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={30} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">Graphic Design</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={95} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography color="secondary">Code Style</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<LinearWithLabel value={75} />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</MainCard>
|
||||
</Grid> */}
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item xs={12} sm={7} md={8} xl={9} >
|
||||
<Grid container spacing={3} >
|
||||
|
||||
<Grid item xs={12} >
|
||||
<MainCard title="Other Details" >
|
||||
<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">Registration No</Typography>
|
||||
<Typography>{info.registrationno || ''}</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>
|
||||
{/* (+1-876) <PatternFormat value={8654239581} displayType="text" type="text" format="#### ### ###" /> */}
|
||||
{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 item xs={12}>
|
||||
<MainCard title="Education">
|
||||
<List sx={{ py: 0 }}>
|
||||
<ListItem divider>
|
||||
<Grid container spacing={matchDownMD ? 0.5 : 3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Master Degree (Year)</Typography>
|
||||
<Typography>2014-2017</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Institute</Typography>
|
||||
<Typography>-</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem divider>
|
||||
<Grid container spacing={matchDownMD ? 0.5 : 3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Bachelor (Year)</Typography>
|
||||
<Typography>2011-2013</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Institute</Typography>
|
||||
<Typography>Imperial College London</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Grid container spacing={matchDownMD ? 0.5 : 3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">School (Year)</Typography>
|
||||
<Typography>2009-2011</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Institute</Typography>
|
||||
<Typography>School of London, England</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
</List>
|
||||
</MainCard>
|
||||
</Grid> */}
|
||||
{/* <Grid item xs={12}>
|
||||
<MainCard title="Emplyment">
|
||||
<List sx={{ py: 0 }}>
|
||||
<ListItem divider>
|
||||
<Grid container spacing={matchDownMD ? 0.5 : 3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Senior</Typography>
|
||||
<Typography color="secondary">Senior UI/UX designer (Year)</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Job Responsibility</Typography>
|
||||
<Typography>
|
||||
Perform task related to project manager with the 100+ team under my observation. Team management is key role in
|
||||
this company.
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>f
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Grid container spacing={matchDownMD ? 0.5 : 3}>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Trainee cum Project Manager (Year)</Typography>
|
||||
<Typography>2017-2019</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={6}>
|
||||
<Stack spacing={0.5}>
|
||||
<Typography color="secondary">Job Responsibility</Typography>
|
||||
<Typography>Team management is key role in this company.</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ListItem>
|
||||
</List>
|
||||
</MainCard>
|
||||
</Grid> */}
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
</MainCard>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
}
|
||||
|
||||
export default Accountsettings;
|
||||
Reference in New Issue
Block a user