Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 4779 | Rev 4785 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 4779 Rev 4784
Línea 1... Línea 1...
1 
import React, { useState } from 'react'
 1 
import React from 'react'
Línea 2... Línea 2...
2 
 
 2 
 
Línea 3... Línea -...
3 
const MenuItem = ({ item }) => {
 - 
 
4 
 
 - 
 
5 
    const [levelTwoShow, setLevelTwoShow] = useState(false);
 - 
 
6 
    const [levelThreeShow, setLevelThreeShow] = useState(false);
 - 
 
7 
 
 - 
 
8 
    const handleShow = (event) => {
 - 
 
9 
        setLevelThreeShow(!levelThreeShow)
 - 
 
10 
    }
 3 
const MenuItem = ({ item }) => {
11 
 
 - 
 
12 
    return (
 4 
 
13 
        <li
 - 
 
14 
            class={`nav-item`}
 - 
 
15 
            onClick={() => item.pages && setLevelTwoShow(!levelTwoShow)}
 5 
    return (
16 
        >
 6 
        <li className="nav-item">
17 
            <a href={`/${item.route}`} class="nav-link">
 7 
            <a href={`/${item.route}`} className="nav-link">
18 
                <i class={`nav-icon ${item.class}`}></i>
 8 
                <i className={`nav-icon ${item.className}`}></i>
19 
                <p>{item.label}</p>
 9 
                <p>{item.label}</p>
20 
                {
 10 
                {
21 
                    item.pages
 11 
                    item.pages
22 
                    &&
 12 
                    &&
23 
                    <i class={levelTwoShow ? "fa fa-angle-left menu_dropdown-arrow active" : "fa fa-angle-left menu_dropdown-arrow"}></i>
 13 
                    <i className="fa fa-angle-left menu_dropdown-arrow"></i>
24 
                }
 14 
                }
25 
            </a>
 15 
            </a>
26 
            {
 16 
            {
27 
                item.pages
 17 
                item.pages
28 
                &&
 18 
                &&
29 
                <ul class="nav nav-treeview">
 19 
                <ul className="nav nav-treeview">
30 
                    {
 - 
 
31 
                        item.pages.map((levelTwo) =>
 20 
                    {
32 
                            <li
 - 
 
33 
                                class={`nav-item`}
 - 
 
34 
                                onClick={(e) => levelTwo.pages && handleShow(e)}
 21 
                        item.pages.map((levelTwo) =>
35 
                            >
 22 
                            <li className="nav-item">
36 
                                {
 23 
                                {
37 
                                    levelTwo.pages
 24 
                                    levelTwo.pages
38 
                                        ?
 25 
                                        ?
39 
                                        <label class="nav-link">
 26 
                                        <label className="nav-link">
40 
                                            <i class="fa fa-circle nav-icon"></i>
 27 
                                            <i className="fa fa-circle nav-icon"></i>
41 
                                            <p>{levelTwo.label}</p>
 28 
                                            <p>{levelTwo.label}</p>
42 
                                            <i class={levelThreeShow ? "fa fa-angle-left menu_dropdown-arrow active" : "fa fa-angle-left menu_dropdown-arrow"}></i>
 29 
                                            <i className="fa fa-angle-left menu_dropdown-arrow"></i>
43 
                                        </label>
 30 
                                        </label>
44 
                                        :
 31 
                                        :
45 
                                        <a href={`/${levelTwo.route}`} class="nav-link">
 32 
                                        <a href={`/${levelTwo.route}`} className="nav-link">
46 
                                            <i class="fa fa-circle nav-icon"></i>
 33 
                                            <i className="fa fa-circle nav-icon"></i>
47 
                                            <p>{levelTwo.label}</p>
 34 
                                            <p>{levelTwo.label}</p>
48 
                                        </a>
 35 
                                        </a>
49 
                                }
 36 
                                }
50 
                                {
 37 
                                {
51 
                                    levelTwo.pages
 38 
                                    levelTwo.pages
52 
                                    &&
 39 
                                    &&
53 
                                    <ul class="nav nav-treeview">
 40 
                                    <ul className="nav nav-treeview">
54 
                                        {
 41 
                                        {
55 
                                            levelTwo.pages.map((levelThree) =>
 42 
                                            levelTwo.pages.map((levelThree) =>
56 
                                                <li class={`nav-item`}>
 43 
                                                <li className={`nav-item`}>
57 
                                                    <a href={`/${levelThree.route}`} class="nav-link">
 44 
                                                    <a href={`/${levelThree.route}`} className="nav-link">
58 
                                                        <i class="fa fa-circle-o nav-icon"></i>
 45 
                                                        <i className="fa fa-circle-o nav-icon"></i>
59 
                                                        <p>{levelThree.label}</p>
 46 
                                                        <p>{levelThree.label}</p>
60 
                                                    </a>
 47 
                                                    </a>
61 
                                                </li>)
 48 
                                                </li>)