ссылки в левом меню
This commit is contained in:
parent
fa15d37dd9
commit
e7edfd2cc0
2
package-lock.json
generated
2
package-lock.json
generated
@ -29,7 +29,7 @@
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.3.0",
|
||||
"react-scripts": "5.0.1",
|
||||
"react-scripts": "^5.0.1",
|
||||
"styled-components": "^5.3.5",
|
||||
"typescript": "^4.8.2",
|
||||
"web-vitals": "^2.1.4",
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.3.0",
|
||||
"react-scripts": "5.0.1",
|
||||
"react-scripts": "^5.0.1",
|
||||
"styled-components": "^5.3.5",
|
||||
"typescript": "^4.8.2",
|
||||
"web-vitals": "^2.1.4",
|
||||
|
||||
@ -31,8 +31,8 @@ const ModalMini = ({open, variant, close}: MWProps ) => {
|
||||
top: "50%",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -50%)",
|
||||
width: "30%",
|
||||
height: "25%",
|
||||
width: "350px",
|
||||
height: "220px",
|
||||
bgcolor: theme.palette.menu.main,
|
||||
boxShadow: 24,
|
||||
color: theme.palette.secondary.main,
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import * as React from "react";
|
||||
import { Box } from "@mui/material";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import MenuOutlinedIcon from '@mui/icons-material/MenuOutlined';
|
||||
import PersonOutlineOutlinedIcon from '@mui/icons-material/PersonOutlineOutlined';
|
||||
import SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined';
|
||||
@ -13,6 +14,11 @@ import theme from "../../../theme";
|
||||
|
||||
|
||||
const Menu: React.FC = () => {
|
||||
const navigate = useNavigate();
|
||||
const pages = [ null, "users", "entities", "tariffs", "discounts", "promocode", null, null, "support" ];
|
||||
|
||||
const changePage = (page:number) => { navigate(`/${pages[ page ]}`); }
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Box sx={{
|
||||
@ -20,7 +26,7 @@ const Menu: React.FC = () => {
|
||||
width: "96px",
|
||||
height: "100vh",
|
||||
borderRight: "1px solid #45494c",
|
||||
overflow: "hidden"
|
||||
overflow: "auto"
|
||||
}}>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -55,7 +61,8 @@ const Menu: React.FC = () => {
|
||||
<PersonOutlineOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 1 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -69,7 +76,8 @@ const Menu: React.FC = () => {
|
||||
<SettingsOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 2 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -83,7 +91,8 @@ const Menu: React.FC = () => {
|
||||
<BathtubOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 3 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -97,7 +106,8 @@ const Menu: React.FC = () => {
|
||||
<AddPhotoAlternateOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 4 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -111,7 +121,8 @@ const Menu: React.FC = () => {
|
||||
<NaturePeopleOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 5 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -125,7 +136,8 @@ const Menu: React.FC = () => {
|
||||
<SettingsIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 6 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -138,7 +150,8 @@ const Menu: React.FC = () => {
|
||||
}}>
|
||||
<CameraIcon sx={{
|
||||
transform: "scale(1.2)"
|
||||
}} />
|
||||
}}
|
||||
onClick={ () => changePage( 7 ) } />
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "100%",
|
||||
@ -152,7 +165,8 @@ const Menu: React.FC = () => {
|
||||
<HeadsetMicOutlinedIcon sx={{
|
||||
color: theme.palette.golden.main,
|
||||
transform: "scale(1.2)"
|
||||
}}/>
|
||||
}}
|
||||
onClick={ () => changePage( 8 ) } />
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
@ -85,8 +85,8 @@ const ModalEntities = ({open}: MWProps ) => {
|
||||
top: "50%",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -50%)",
|
||||
width: "72%",
|
||||
height: "60%",
|
||||
width: "980px",
|
||||
height: "480px",
|
||||
bgcolor: theme.palette.menu.main,
|
||||
boxShadow: 24,
|
||||
color: theme.palette.secondary.main,
|
||||
@ -153,8 +153,9 @@ const ModalEntities = ({open}: MWProps ) => {
|
||||
disableSelectionOnClick
|
||||
experimentalFeatures={{ newEditingApi: true }}
|
||||
sx={{
|
||||
width: "700px",
|
||||
height: "400px",
|
||||
width: "720px",
|
||||
height: "350px",
|
||||
overflowY: "auto",
|
||||
color: theme.palette.secondary.main,
|
||||
"& .MuiDataGrid-iconSeparator": {
|
||||
display: "none"
|
||||
|
||||
@ -85,8 +85,8 @@ const ModalUser = ({open}: MWProps ) => {
|
||||
top: "50%",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -50%)",
|
||||
width: "72%",
|
||||
height: "60%",
|
||||
width: "980px",
|
||||
height: "480px",
|
||||
bgcolor: theme.palette.menu.main,
|
||||
boxShadow: 24,
|
||||
color: theme.palette.secondary.main,
|
||||
@ -153,9 +153,10 @@ const ModalUser = ({open}: MWProps ) => {
|
||||
disableSelectionOnClick
|
||||
experimentalFeatures={{ newEditingApi: true }}
|
||||
sx={{
|
||||
width: "700px",
|
||||
height: "400px",
|
||||
color: theme.palette.secondary.main,
|
||||
width: "720px",
|
||||
height: "350px",
|
||||
overflowY: "auto",
|
||||
"& .MuiDataGrid-iconSeparator": {
|
||||
display: "none"
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user