<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <body>

        <ui:composition template="./template/PrincipalE.xhtml">

            <ui:define name="top">
                top
            </ui:define>
            
            <ui:define name="left">
                <div class="card">
                    <h:form>
                        <p:growl id="messages" showDetail="true"/>
                        <p:tieredMenu  style="width:165px" >
                            <p:submenu label="Usuarios" icon="pi pi-fw pi-user">
                                <p:submenu label="Opciones">
                                    <p:menuitem value="Lista de usuarios"  outcome="UsuariosLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:submenu label="Categorias" icon="pi pi-fw pi-tags">
                                <p:submenu label="Opciones">
                                    <p:menuitem value="Lista de categorias"  outcome="CategoriasLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:submenu label="Detalles" icon="pi pi-fw pi-file">
                                <p:submenu label="Opciones" >
                                    <p:menuitem value="Lista de detalles"  outcome="detallespLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:submenu label="Productos" icon="pi pi-fw pi-shopping-cart">
                                <p:submenu label="Opciones">
                                    <p:menuitem value="Lista de productos"  outcome="ProductosLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:submenu label="Proveedores" icon="pi pi-fw pi-users">
                                <p:submenu label="Opciones">
                                    <p:menuitem value="Lista de proveedores"  outcome="ProveedoresLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:submenu label="Pedidos" icon="pi pi-fw pi-calendar">
                                <p:submenu label="Opciones">
                                    <p:menuitem value="Lista de pedidos"  outcome="PedidosLista.xhtml" ajax="false"/>  
                                </p:submenu>       
                            </p:submenu>
                            <p:divider/>
                            <p:menuitem value="Salir" icon="pi pi-fw pi-power-off" action="#{loginDem.logout()}"/>
                        </p:tieredMenu>
                    </h:form>
                </div>
            </ui:define>

            <ui:define name="content">
                <f:view>
                    <h:form>
                        <h1><h:outputText value="#{demoBeanCategorias.titulo}"/></h1>
                        <p:panelGrid columns="2">
                            <h:outputText value="Id:"/>
                            <h:outputText value="#{demoBeanCategorias.categorias.id}" title="Id"/>
                            <h:outputText value="Nombre:"/>
                            <h:outputText value="#{demoBeanCategorias.categorias.nombre}" title="Nombre"/>
                            <h:outputText value="Descripcion:"/>
                            <h:outputText value="#{demoBeanCategorias.categorias.descripcion}" title="Descripcion"/>
                        </p:panelGrid>
                        <p:commandButton styleClass="rounded-button ui-button-danger" action="CategoriasLista.xhtml" actionListener="#{demoBeanCategorias.editarCategoria()}" value="Eliminar" ajax="false"/>
                        <p:commandButton styleClass="rounded-button ui-button-secondary" action="CategoriasLista.xhtml" value="Cancelar" immediate="true" ajax="false"/>
                    </h:form>
                </f:view>

            </ui:define>

        </ui:composition>

    </body>
</html>