<?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:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
< body >
< ui:composition template = "./template/templatePlantilla.xhtml" >
< ui:define name = "top" >
INVETARIO
< / ui:define >
< ui:define name = "content" >
< div class = "card crud-demo" >
< h:form id = "form" >
< p:growl id = "messages" showDetail = "true" / >
< p:toolbar >
< p:toolbarGroup >
< p:commandButton value = "Nuevo Usuario 👥" icon = "pi pi-plus"
actionListener="#{usuariosBean.prepararNuevoUsuario()}"
update=":dialogs:manage-product-content" oncomplete="PF('manageProductDialog').show()"
styleClass="ui-button-raised ui-button-flat" style="margin-right: 0.5rem"
rendered="#{ not login.esOperador()}">
< p:resetInput target = ":dialogs:manage-product-content" / >
< / p:commandButton >
< / p:toolbarGroup >
< / p:toolbar >
< p:dataTable id = "dt-usuario" widgetVar = "dtusuario" var = "usuario" value = "#{usuariosBean.usuarios}"
reflow="true" styleClass="products-table"
rowKey="#{usuariosBean.usuario.idUsuarios}" paginator="true" rows="10" rowSelectMode="add" paginatorPosition="bottom">
< f:facet name = "header" >
< div class = "products-table-header" >
< span style = "font-weight: bold" > Usuarios< / span >
< span class = "filter-container ui-input-icon-left" > < i class = "pi pi-search" > < / i >
< p:inputText id = "globalFilter" onkeyup = "PF('dtusuario').filter()" placeholder = "Search" / >
< / span >
< / div >
< / f:facet >
< p:column headerText = "Usuario" sortBy = "#{usuario.usuario}" filterBy = "#{usuario.usuario}" >
< h:outputText value = "#{usuario.usuario}" / >
< / p:column >
< p:column headerText = "Nombre" sortBy = "#{usuario.nombre }" filterBy = "#{usuario.nombre}" >
< h:outputText value = "#{usuario.nombre} #{usuario.apaterno} #{usuario.amaterno}" / >
< / p:column >
< p:column headerText = "Domicilio" sortBy = "#{usuario.domicilio}" filterBy = "#{usuario.domicilio}" >
< h:outputText value = "#{usuario.domicilio}" / >
< / p:column >
< p:column headerText = "Telefono" sortBy = "#{usuario.telefono}" filterBy = "#{usuario.telefono}" >
< h:outputText value = "#{usuario.telefono}" / >
< / p:column >
< p:column headerText = "F.Nacimiento" sortBy = "#{usuario.fechanacimiento}" filterBy = "#{usuario.fechanacimiento}" >
< h:outputText value = "#{usuario.fechanacimiento}" >
< f:convertDateTime pattern = "dd/MM/yyyy" / >
< / h:outputText >
< / p:column >
< p:column headerText = "T. Sangre" sortBy = "#{usuario.tiposangre}" filterBy = "#{usuario.tiposangre}" >
< h:outputText value = "#{usuario.tiposangre}" / >
< / p:column >
< p:column headerText = "Rol" sortBy = "#{usuario.rolidRol.nombreRol}" filterBy = "#{usuario.rolidRol.nombreRol}" >
< h:outputText value = "#{usuario.rolidRol.nombreRol}" / >
< / p:column >
< p:column headerText = "Acciones" rendered = "#{not login.esOperador()}" >
< p:commandButton icon = "pi pi-pencil" update = ":dialogs:manage-product-content"
oncomplete="PF('manageProductDialog').show()"
styleClass="rounded-button ui-button-info" process="@this"
actionListener="#{usuariosBean.prepararEditarUsuario(usuario)}" style="margin-right: 10px;"
>
< p:resetInput target = ":dialogs:manage-product-content" / >
< / p:commandButton >
< p:commandButton styleClass = "rounded-button ui-button-danger" icon = "pi pi-trash"
process="@this"
actionListener="#{usuariosBean.prepararEditarUsuario(usuario)}"
oncomplete="PF('deleteProductDialog').show()">
< / p:commandButton >
< / p:column >
< / p:dataTable >
< / h:form >
< h:form id = "dialogs" >
< p:dialog header = "Detalles de Usuario" showEffect = "fade" modal = "true" widgetVar = "manageProductDialog"
responsive="true">
< p:outputPanel id = "manage-product-content" styleClass = "ui-fluid" >
< p:outputPanel >
< h:panelGrid columns = "2" >
< p:outputLabel value = "Usuario:" for = "usuario" / >
< p:inputText id = "usuario" value = "#{usuariosBean.usuario.usuario}" title = "Usuario" required = "true" requiredMessage = "El usuario es requerdio." validatorMessage = "Solo se pueden introducir letras y numeros" >
< f:validateRegex pattern = "[A-Za-z0-9]+" for = "usuario" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Contraseña" for = "password" / >
< p:inputText id = "password" value = "#{usuariosBean.usuario.password}" title = "Contraseña" required = "true" requiredMessage = "La Contraseña es requerida." validatorMessage = "La contraseña debe tener entre 8 y 10 caracteres, al menos una letra mayúscula, un número y un caracter especial (@$!%*?)." >
< f:validateRegex pattern = "^(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?])[A-Za-z\d@$!%*?]{8,10}$+" for = "password" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Nombre:" for = "nombre" / >
< p:inputText id = "nombre" value = "#{usuariosBean.usuario.nombre}" title = "Nombre" required = "true" requiredMessage = "El usuario es requerdio." validatorMessage = "Solo se pueden introducir letras" >
< f:validateRegex pattern = "[A-Za-z\s]+" for = "nombre" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Apellido Paterno" for = "apaterno" / >
< p:inputText id = "apaterno" value = "#{usuariosBean.usuario.apaterno}" title = "Apellido Paterno" required = "true" requiredMessage = "El Apellido es requerido" validatorMessage = "Solo se pueden introducir letras" >
< f:validateRegex pattern = "[A-Za-z\s]+" for = "apaterno" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Apellido Materno" for = "amaterno" / >
< p:inputText id = "amaterno" value = "#{usuariosBean.usuario.amaterno}" title = "Apellido Materno" required = "true" requiredMessage = "El Apellido es requerido" validatorMessage = "Solo se pueden introducir letras" >
< f:validateRegex pattern = "[A-Za-z\s]+" for = "amaterno" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Domicilio:" for = "domicilio" / >
< p:inputText id = "domicilio" value = "#{usuariosBean.usuario.domicilio}" title = "Domicilio" required = "true" requiredMessage = "El domicilio es requerido" validatorMessage = "El domicilio solo puede contener letras, números y ciertos caracteres especiales como -, ., #, y espacios." >
< f:validateRegex pattern = "^[A-Za-z0-9\s\-,.#áéíóúÁÉÍÓÚñÑ]+$" for = "domicilio" > < / f:validateRegex >
< / p:inputText >
< p:outputLabel value = "Telefono:" for = "telefono" / >
< p:inputMask id = "telefono" value = "#{usuariosBean.usuario.telefono}" mask = "(999) 999-9999" validateMask = "true" >
< / p:inputMask >
< p:outputLabel value = "Fecha de nacimiento" for = "fechanacimiento" / >
< p:inputMask id = "fechanacimiento" value = "#{usuariosBean.usuario.fechanacimiento}" mask = "99/99/9999" required = "true" >
< f:convertDateTime pattern = "dd/MM/yyyy" / >
< / p:inputMask >
< p:outputLabel value = "Tipo de sangre" for = "tiposangre" / >
< p:inputText id = "tiposangre" value = "#{usuariosBean.usuario.tiposangre}" title = "Tipo de sangre" required = "true" requiredMessage = "El tipo de sangre es requerdio" / >
< p:outputLabel value = "Rol" for = "rolidRol" / >
< p:selectOneMenu id = "rolidRol" value = "#{usuariosBean.usuario.rolidRol}" required = "true" converter = "selectOneMenuConverter" requiredMessage = "El rol es requerido" >
<!-- TODO: update below reference to list of available items -->
< f:selectItem itemLabel = "Selecciona una" itemValue = "" / >
< f:selectItems value = "#{rolBean.roles}" var = "item" itemLabel = "#{item.nombreRol}" itemValue = "#{item}" / >
< / p:selectOneMenu >
< / h:panelGrid >
< / p:outputPanel >
< / p:outputPanel >
< f:facet name = "footer" >
< div style = "text-align: center;" >
< p:commandButton value = "Guardar" icon = "pi pi-save"
styleClass="ui-button-raised ui-button-flat" actionListener="#{usuariosBean.agregarUsuario()}"
update="manage-product-content" process="manage-product-content @this" />
< / div >
< / f:facet >
< / p:dialog >
< p:confirmDialog widgetVar = "deleteProductDialog" showEffect = "fade" width = "300"
message="¿Deseas eliminar este elemento?" header="Eliminar" severity="warn">
< div style = "display: flex; justify-content: space-between;" >
< p:commandButton value = "Eliminar" icon = "pi pi-trash"
styleClass="ui-button-raised ui-button-danger ui-button-flat"
actionListener="#{usuariosBean.eliminaUsuario()}" process="@this"
oncomplete="PF('deleteProductDialog').hide()" />
< p:commandButton value = "Cancelar" type = "button"
styleClass="ui-button-raised ui-button-danger-success ui-button-flat" icon="pi pi-times"
onclick="PF('deleteProductDialog').hide()" />
< / div >
< / p:confirmDialog >
< / h:form >
< / div >
< / ui:define >
< / ui:composition >
< / body >
< / html >
