Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 4687 | Rev 4777 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

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