customers

This commit is contained in:
joshikannan
2025-11-27 18:33:08 +05:30
parent e71e44319c
commit d73c714290
19 changed files with 595 additions and 2070 deletions

View File

@@ -1,5 +1,5 @@
import PropTypes from 'prop-types';
import React, { useEffect, useState, useMemo, useRef } from 'react';
import React, { useEffect, useState, useMemo } from 'react';
import { useLocation, useNavigate } from 'react-router-dom';
// material-ui
@@ -45,8 +45,7 @@ const PopperStyled = styled(Popper)(({ theme }) => ({
left: -5,
width: 10,
height: 10,
// backgroundColor: theme.palette.background.paper,
backgroundColor: theme.palette.primary.main,
backgroundColor: theme.palette.background.paper,
transform: 'translateY(-50%) rotate(45deg)',
zIndex: 120,
borderLeft: `1px solid ${theme.palette.grey.A800}`,
@@ -117,7 +116,7 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
}
} else {
if (level === selectedLevel) {
// setOpen(false);
setOpen(false);
if (!miniMenuOpened && !drawerOpen && !selected) {
setSelected(null);
}
@@ -147,7 +146,7 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
};
useEffect(() => {
// setOpen(false);
setOpen(false);
if (!miniMenuOpened) {
setSelected(null);
}
@@ -211,23 +210,10 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
const isSelected = selected === menu.id;
const borderIcon = level === 1 ? <BorderOutlined style={{ fontSize: '1rem' }} /> : false;
const Icon = menu.icon;
const menuIcon = menu.icon ? (
<Icon
style={{
fontSize: drawerOpen ? '1rem' : '1.25rem'
// color: 'white'
}}
/>
) : (
borderIcon
);
// const textColor = theme.palette.mode === ThemeMode.DARK ? 'grey.400' : 'text.primary';
// const iconSelectedColor = theme.palette.mode === ThemeMode.DARK && drawerOpen ? theme.palette.text.primary : theme.palette.primary.main;
const menuIcon = menu.icon ? <Icon style={{ fontSize: drawerOpen ? '1rem' : '1.25rem' }} /> : borderIcon;
const iconSelectedColor = theme.palette.mode === ThemeMode.DARK && drawerOpen ? theme.palette.text.primary : theme.palette.primary.main;
const popperId = miniMenuOpened ? `collapse-pop-${menu.id}` : undefined;
const FlexBox = { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: '100%' };
const textColor = 'white';
const iconSelectedColor = 'white';
// const isSelected = true;
return (
<>
@@ -237,19 +223,13 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
disableRipple
selected={selected === menu.id}
{...(!drawerOpen && { onMouseEnter: handleClick, onMouseLeave: handleClose })}
onClick={() => {
handleClick();
if (open == true) {
setOpen(false);
}
}}
onClick={handleClick}
sx={{
pl: drawerOpen ? `${level * 28}px` : 1.5,
py: !drawerOpen && level === 1 ? 1.25 : 1,
...(drawerOpen && {
'&:hover': {
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'divider' : 'primary.lighter',
bgcolor: '#7b1fa2'
bgcolor: theme.palette.mode === ThemeMode.DARK ? 'divider' : 'primary.light'
},
'&.Mui-selected': {
bgcolor: 'transparent',
@@ -258,14 +238,14 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
}
}),
...(!drawerOpen && {
bgcolor: theme.palette.primary.main,
'&:hover': {
bgcolor: theme.palette.primary.light
bgcolor: 'primary.light'
},
'&.Mui-selected': {
'&:hover': {
bgcolor: theme.palette.primary.light
}
bgcolor: 'white'
},
bgcolor: 'white'
}
})
}}
@@ -275,27 +255,22 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
onClick={handlerIconLink}
sx={{
minWidth: 28,
// color: selected === menu.id ? 'primary.main' : textColor,
// color: selected === menu.id ? textColor : textColor,
// bgcolor:'white',
color: 'white',
color: selected === menu.id ? 'primary.main' : 'white',
...(!drawerOpen && {
borderRadius: 1.5,
width: 36,
height: 36,
alignItems: 'center',
justifyContent: 'center',
color: 'white',
'&:hover': {
bgcolor: theme.palette.primary.light
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'secondary.light' : 'secondary.lighter'
}
}),
...(!drawerOpen &&
selected === menu.id && {
bgcolor: theme.palette.primary.lighter,
color: theme.palette.primary.main,
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.900' : 'primary.lighter',
'&:hover': {
bgcolor: theme.palette.primary.lighter
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.darker' : 'primary.lighter'
}
})
}}
@@ -306,12 +281,7 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
{(drawerOpen || (!drawerOpen && level !== 1)) && (
<ListItemText
primary={
<Typography
variant="h6"
// color={selected === menu.id ? 'primary' : textColor}
// color={'white'}
color={selected === menu.id ? textColor : textColor}
>
<Typography variant="h6" color={selected === menu.id ? 'white' : 'white'}>
{menu.title}
</Typography>
}
@@ -326,22 +296,9 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
)}
{(drawerOpen || (!drawerOpen && level !== 1)) &&
(miniMenuOpened || open ? (
<UpOutlined
style={{
fontSize: '0.625rem',
marginLeft: 1,
// color: theme.palette.primary.main
color: 'white'
}}
/>
<UpOutlined style={{ fontSize: '0.625rem', marginLeft: 1, color: theme.palette.primary.main }} />
) : (
<DownOutlined
style={{
fontSize: '0.625rem',
marginLeft: 1,
color: 'white'
}}
/>
<DownOutlined style={{ fontSize: '0.625rem', marginLeft: 1, color: 'white' }} />
))}
{!drawerOpen && (
@@ -371,8 +328,8 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
mt: 1.5,
boxShadow: theme.customShadows.z1,
backgroundImage: 'none',
// border: `1px solid ${theme.palette.divider}`,
background: theme.palette.primary.main
border: `1px solid ${theme.palette.primary.main}`,
bgcolor: 'primary.main'
}}
>
<ClickAwayListener onClickAway={handleClose}>
@@ -416,14 +373,7 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
>
<Box onClick={handlerIconLink} sx={FlexBox}>
{menuIcon && (
<ListItemIcon
sx={{
my: 'auto',
minWidth: !menu.icon ? 18 : 36
// color: theme.palette.secondary.dark
// color:'white'
}}
>
<ListItemIcon sx={{ my: 'auto', minWidth: !menu.icon ? 18 : 36, color: theme.palette.secondary.dark }}>
{menuIcon}
</ListItemIcon>
)}
@@ -436,12 +386,7 @@ const NavCollapse = ({ menu, level, parentId, setSelectedItems, selectedItems, s
)}
<ListItemText
primary={
<Typography
variant="body1"
// color="inherit"
// color="white"
sx={{ my: 'auto' }}
>
<Typography variant="body1" color="inherit" sx={{ my: 'auto' }}>
{menu.title}
</Typography>
}

View File

@@ -1,5 +1,5 @@
import PropTypes from 'prop-types';
import { forwardRef, useEffect, useState } from 'react';
import { forwardRef, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux';
@@ -9,10 +9,8 @@ import { Avatar, Chip, ListItemButton, ListItemIcon, ListItemText, Typography, u
// project import
import Dot from 'components/@extended/Dot';
import { MenuOrientation, ThemeMode } from 'config';
import useConfig from 'hooks/useConfig';
// import { dispatch, useSelector } from 'store';
import { activeItem, openDrawer } from 'store/reducers/menu';
// ==============================|| NAVIGATION - LIST ITEM ||============================== //
@@ -20,9 +18,9 @@ import { activeItem, openDrawer } from 'store/reducers/menu';
const NavItem = ({ item, level }) => {
const theme = useTheme();
const dispatch = useDispatch();
const { menuOrientation } = useConfig();
const { drawerOpen, openItem } = useSelector((state) => state.menu);
const [ishover, setIshover] = useState('');
const downLG = useMediaQuery(theme.breakpoints.down('lg'));
@@ -37,13 +35,9 @@ const NavItem = ({ item, level }) => {
}
const Icon = item.icon;
const itemIcon = item.icon ? <Icon style={{ fontSize: drawerOpen ? '1rem' : '1.25rem' }} /> : false;
const isSelected = openItem.findIndex((id) => id === item.id) > -1;
const itemIcon = item.icon ? (
<Icon style={{ fontSize: drawerOpen ? '1rem' : '1.25rem', color: isSelected ? '#662582' : '#fff' }} />
) : (
false
);
// const { pathname } = useLocation();
const pathname = document.location.pathname;
@@ -68,7 +62,7 @@ const NavItem = ({ item, level }) => {
// eslint-disable-next-line
}, [pathname]);
const textColor = theme.palette.mode === ThemeMode.DARK ? 'grey.400' : '#fff';
const textColor = theme.palette.mode === ThemeMode.DARK ? 'grey.400' : 'text.primary';
const iconSelectedColor = theme.palette.mode === ThemeMode.DARK && drawerOpen ? 'text.primary' : 'primary.main';
return (
@@ -78,20 +72,14 @@ const NavItem = ({ item, level }) => {
{...listItemProps}
disabled={item.disabled}
selected={isSelected}
onMouseEnter={(e) => {
console.log(e);
}}
onMouseLeave={() => {
setIshover('');
}}
sx={{
zIndex: 1201,
pl: drawerOpen ? `${level * 28}px` : 1.5,
py: !drawerOpen && level === 1 ? 1.25 : 1,
...(drawerOpen && {
// bgcolor: 'primary.light',
'&:hover': {
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'divider' : 'primary.lighter'
bgcolor: '#7b1fa2'
bgcolor: theme.palette.mode === ThemeMode.DARK ? 'divider' : 'primary.light'
},
'&.Mui-selected': {
bgcolor: theme.palette.mode === ThemeMode.DARK ? 'divider' : 'primary.lighter',
@@ -104,9 +92,8 @@ const NavItem = ({ item, level }) => {
}
}),
...(!drawerOpen && {
bgcolor: theme.palette.primary.main,
'&:hover': {
bgcolor: theme.palette.primary.light
bgcolor: 'primary.light'
},
'&.Mui-selected': {
'&:hover': {
@@ -124,28 +111,23 @@ const NavItem = ({ item, level }) => {
<ListItemIcon
sx={{
minWidth: 28,
'&:hover': {
color: isSelected ? '#fff' : iconSelectedColor
},
color: isSelected ? iconSelectedColor : textColor,
color: isSelected ? iconSelectedColor : 'white',
...(!drawerOpen && {
// borderRadius: 1.5,
width: 36,
height: 36,
alignItems: 'center',
justifyContent: 'center',
'&:hover': {
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'secondary.light' : 'secondary.lighter'
// bgcolor: theme.palette.primary.light
}
justifyContent: 'center'
// '&:hover': {
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'secondary.light' : 'primary.lighter'
// }
}),
...(!drawerOpen &&
isSelected && {
bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.900' : 'primary.lighter',
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.900' : 'primary.lighter',
'&:hover': {
bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.darker' : 'primary.lighter'
},
borderRadius: 2
// bgcolor: theme.palette.mode === ThemeMode.DARK ? 'primary.darker' : 'primary.lighter'
}
})
}}
>
@@ -157,13 +139,9 @@ const NavItem = ({ item, level }) => {
primary={
<Typography
variant="h6"
// sx={{ color: isSelected ? iconSelectedColor : textColor }}
sx={{
color: isSelected && !drawerOpen ? theme.palette.primary.main : !isSelected ? 'white' : theme.palette.primary.main,
bgcolor: isSelected && theme.palette.primary.lighter,
padding: isSelected && !drawerOpen ? 0.8 : 'none',
borderRadius: isSelected && !drawerOpen ? 2 : 'none',
ml: isSelected && !drawerOpen ? 0.5 : 'none'
ml: 1,
color: isSelected ? theme.palette.primary.main : 'white'
}}
>
{item.title}

View File

@@ -7,13 +7,13 @@ const Footer = () => (
<Stack direction="row" justifyContent="space-between" alignItems="center" sx={{ p: '24px 16px 0px', mt: 'auto' }}>
<Typography variant="caption">&copy; All rights reserved</Typography>
<Stack spacing={1.5} direction="row" justifyContent="space-between" alignItems="center">
<Link component={RouterLink} to="#" target="_blank" variant="caption" color="textPrimary">
<Link component={RouterLink} to="https://nearle.in/aboutus" target="_blank" variant="caption" color="textPrimary">
About us
</Link>
<Link component={RouterLink} to="#" target="_blank" variant="caption" color="textPrimary">
<Link component={RouterLink} to="https://nearle.in/privacy" target="_blank" variant="caption" color="textPrimary">
Privacy
</Link>
<Link component={RouterLink} to="#" target="_blank" variant="caption" color="textPrimary">
<Link component={RouterLink} to="https://nearle.in/terms" target="_blank" variant="caption" color="textPrimary">
Terms
</Link>
</Stack>

View File

@@ -5,55 +5,31 @@ import { useState } from 'react';
import { List, ListItemButton, ListItemIcon, ListItemText } from '@mui/material';
// assets
import { EditOutlined, ProfileOutlined, LogoutOutlined, UserOutlined, WalletOutlined, CommentOutlined } from '@ant-design/icons';
import { LogoutOutlined, UserOutlined } from '@ant-design/icons';
import { useNavigate } from 'react-router';
// ==============================|| HEADER PROFILE - PROFILE TAB ||============================== //
const ProfileTab = ({ handleLogout }) => {
const [selectedIndex, setSelectedIndex] = useState(0);
const [selectedIndex, setSelectedIndex] = useState(null);
const navigate = useNavigate();
const handleListItemClick = (event, index) => {
setSelectedIndex(index);
if (index == 1) {
if (index == 0) {
navigate('/accountsettings');
}
};
return (
<List component="nav" sx={{ p: 0, '& .MuiListItemIcon-root': { minWidth: 32 } }}>
{/* <ListItemButton selected={selectedIndex === 0} onClick={(event) => handleListItemClick(event, 0)}>
<ListItemIcon>
<EditOutlined />
</ListItemIcon>
<ListItemText primary="Edit Profile" />
</ListItemButton> */}
<ListItemButton selected={selectedIndex === 0} onClick={(event) => handleListItemClick(event, 1)}>
<ListItemButton selected={selectedIndex === 0} onClick={(event) => handleListItemClick(event, 0)}>
<ListItemIcon>
<UserOutlined />
</ListItemIcon>
<ListItemText primary="View Profile" />
</ListItemButton>
{/* <ListItemButton selected={selectedIndex === 1} onClick={(event) => handleListItemClick(event, 2)}>
<ListItemIcon>
<CommentOutlined />
</ListItemIcon>
<ListItemText primary="Support Ticket" />
</ListItemButton> */}
{/* <ListItemButton selected={selectedIndex === 4} onClick={(event) => handleListItemClick(event, 4)}>
<ListItemIcon>
<WalletOutlined />
</ListItemIcon>
<ListItemText primary="Billing" />
</ListItemButton> */}
<ListItemButton
selected={selectedIndex === 1}
onClick={handleLogout}
// onClick={()=>{
// navigate('/login')
// }}
>
<ListItemButton selected={selectedIndex === 1} onClick={handleLogout}>
<ListItemIcon>
<LogoutOutlined />
</ListItemIcon>

View File

@@ -214,7 +214,7 @@ const HeaderContent = () => {
<ListItemButton
selected={location.pathname === 'nearle/customers/create'}
onClick={() => {
navigate('nearle/customers/create');
navigate('nearle/customers');
handleClickAway();
}}
>

View File

@@ -58,7 +58,7 @@ const MainLayout = () => {
>
{/* <Breadcrumbs navigation={navigation} title titleBottom card={false} divider={false} /> */}
<Outlet />
<Footer />
{/* <Footer /> */}
</Container>
</Box>
</Box>