Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6632 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
7383 stevensc 1 
import React from 'react'
2 
import { axios } from '../../../utils'
6632 stevensc 3 
import Box from '@mui/material/Box'
4 
import Drawer from '@mui/material/Drawer'
5 
import List from '@mui/material/List'
6 
import ListItem from '@mui/material/ListItem'
7 
import ListItemIcon from '@mui/material/ListItemIcon'
8 
import ListItemText from '@mui/material/ListItemText'
9 
import Accordion from '@mui/material/Accordion'
10 
import AccordionSummary from '@mui/material/AccordionSummary'
11 
import AccordionDetails from '@mui/material/AccordionDetails'
12 
import Link from '@mui/material/Link'
13 
import Typography from '@mui/material/Typography'
14 
import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
15 
 
16 
function MenuDrawer({
17 
  isOpen = false,
18 
  items = [],
19 
  icons = [],
20 
  closeDrawer = () => {},
21 
}) {
22 
  return (
23 
    <Drawer anchor="right" open={isOpen} onClose={closeDrawer}>
24 
      <Box sx={{ width: 250 }} role="presentation">
25 
        <List>
26 
          {items.map((navItem, index) => {
27 
            return (
28 
              <MenuDrawer.Item
29 
                key={index}
30 
                Icon={icons[index]}
31 
                title={navItem.label}
32 
                url={navItem.href}
33 
                childs={navItem.childs}
34 
                ajaxRequest={navItem.ajax}
35 
              />
36 
            )
37 
          })}
38 
        </List>
39 
      </Box>
40 
    </Drawer>
41 
  )
42 
}
43 
 
44 
const Item = ({ Icon, title, url, childs = [], ajaxRequest }) => {
45 
  const handleAjaxRequest = async () => {
46 
    try {
47 
      const { data } = await axios.get(url)
48 
      if (data.success) {
49 
        window.open(data.data, 'backend')
50 
      }
51 
    } catch (error) {
52 
      console.log('>>: error > ', error)
53 
    }
54 
  }
55 
 
56 
  return (
57 
    <ListItem disablePadding>
58 
      {!childs.length ? (
59 
        <Link
60 
          href={`/${url}`}
61 
          display="flex"
62 
          gap=".5rem"
63 
          paddingLeft="1rem"
64 
          onClick={(e) => {
65 
            if (ajaxRequest) {
66 
              e.preventDefault()
67 
              handleAjaxRequest()
68 
            }
69 
          }}
70 
        >
71 
          <ListItemIcon>{Icon && <Icon />}</ListItemIcon>
72 
          <ListItemText primary={title} />
73 
        </Link>
74 
      ) : (
75 
        <Accordion sx={{ border: 'none', width: '100%', boxShadow: 'none' }}>
76 
          <AccordionSummary
77 
            expandIcon={<ExpandMoreIcon />}
78 
            sx={{
79 
              minHeight: 'auto !important',
80 
              margin: '0',
81 
              padding: 0,
82 
              paddingLeft: '1rem',
83 
            }}
84 
          >
85 
            {Icon && <Icon />}
86 
            <Typography margin="0">{title}</Typography>
87 
          </AccordionSummary>
88 
          <AccordionDetails sx={{ padding: 0 }}>
89 
            {childs.map((child, index) => {
90 
              if (child.childs?.length) {
91 
                return (
92 
                  <Accordion
93 
                    key={index}
94 
                    sx={{
95 
                      border: 'none',
96 
                      width: '100%',
97 
                      boxShadow: 'none',
98 
                      background: 'lightgray',
99 
                    }}
100 
                  >
101 
                    <AccordionSummary
102 
                      expandIcon={<ExpandMoreIcon />}
103 
                      sx={{ minHeight: 'auto !important', margin: '0' }}
104 
                    >
105 
                      <Typography margin="0">{child.label}</Typography>
106 
                    </AccordionSummary>
107 
                    <AccordionDetails sx={{ padding: '0 16px' }}>
108 
                      {child.childs.map((levelThree, index) => {
109 
                        return (
110 
                          <Link key={index} href={`/${levelThree.href}`}>
111 
                            <ListItemText primary={levelThree.label} />
112 
                          </Link>
113 
                        )
114 
                      })}
115 
                    </AccordionDetails>
116 
                  </Accordion>
117 
                )
118 
              }
119 
              return (
120 
                <Link
121 
                  key={index}
122 
                  href={child.href[0] === '/' ? child.href : `/${child.href}`}
123 
                >
124 
                  <ListItemText
125 
                    primary={child.label}
126 
                    sx={{ padding: '0 16px' }}
127 
                  />
128 
                </Link>
129 
              )
130 
            })}
131 
          </AccordionDetails>
132 
        </Accordion>
133 
      )}
134 
    </ListItem>
135 
  )
136 
}
137 
 
138 
MenuDrawer.Item = Item
139 
 
140 
export default MenuDrawer