<?xml version="1.0" encoding="UTF-8"?>
<!--
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/JSP_Servlet/XHtml.xhtml to edit this template
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<body>
<f:view>
<header style="display: flex; justify-content: center; font-size: 30px;"><strong>Estados</strong></header>
<p:divider/>
<main style="display: flex; justify-content: space-between; gap: 10px;">
<h:form id="formEstados">
<p:growl id="growl" showDetail="true" for="mensajePaises"/>
<p:dataTable id="tableEstados"
value="#{demoBeanEstados.estados}"
var="item"
style="width: 600px"
paginator="true"
rows="5"
rowSelectMode="add"
paginatorPosition="bottom" >
<p:column style="text-align: center;">
<f:facet name="header">
<h:outputText value="Nombre"/>
</f:facet>
<h:outputText value="#{item.nombre}"/>
</p:column>
<p:column style="text-align: center;">
<f:facet name="header">
<h:outputText value="Estatus"/>
</f:facet>
<h:outputText value="#{item.estado == 2 ? 'Activo':'Inactivo'}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Pais"/>
</f:facet>
<h:outputText value="#{item.paisesId.nombre}"/>
</p:column>
<p:column style="text-align: center;">
<f:facet name="header">
<center>
<h:outputText value="Opciones"/>
</center>
</f:facet>
<p:commandButton action="#{demoBeanEstados.eliminarEstados(item)}"
ajax="true"
icon="pi pi-trash"
styleClass="ui-button-warning"
style="margin-top: 5px; width: 50px;"
update="formPais" />
</p:column>
</p:dataTable>
</h:form>
<h:form style="margin-left: 20px; margin-top: 20px;">
<header style="display: flex; justify-content: center;">Nuevo Estado</header>
<p:divider/>
<h:panelGrid columns="2">
<p:outputLabel value="Nombre:" for="nombre" />
<p:inputText id="nombre" value="#{demoBeanEstados.estado.nombre}"
title="Nombre"
required="true"
validatorMessage="Verifique el nombre"
requiredMessage="Este campo no puede estar vacio">
<f:validateRegex pattern="\b[A-ZÁÉÍÓÚÜÑ][a-záéíóúüñ]{1,}(?:\s+[A-Za-zÁÉÍÓÚÜÑ][a-záéíóúüñ]{1,})*\b"
for="nombre" />
</p:inputText>
<p:outputLabel></p:outputLabel>
<p:message id="alertNombre" for="nombre"/>
<p:outputLabel value="Pais:" for="paisesId" />
<p:selectOneMenu id="paisesId"
value="#{demoBeanEstados.estado.paisesId}"
converter="selectOneMenuConverter"
required="true"
requiredMessage="Se necesita un pais"
filter="true"
filterMatchMode="startsWith" >
<!-- Arriba esta lo del filtro, jsjsjsjs -->
<!-- TODO: update below reference to list of available items-->
<f:selectItems value="#{demoBeanPaises.paises}"
var="item"
itemLabel="#{item.nombre}"
itemValue="#{item}"/>
</p:selectOneMenu>
<p:outputLabel></p:outputLabel>
<p:message id="alertPais" for="paisesId"/>
</h:panelGrid>
<footer style="display: flex; margin-top: 280px; justify-content: flex-end;">
<p:commandButton action="#{demoBeanEstados.agregarEstados()}"
ajax="true"
styleClass="ui-button-success"
style="width: 50px;"
icon="pi pi-save"
update="formEstados:tableEstados, nombre, paisesId,
alertNombre, alertPais, formEstados:growl" />
<p:commandButton oncomplete="PF('estado').close()"
immediate="true"
ajax="false"
style="margin-left: 5px; width: 50px; "
icon="pi pi-times"
styleClass="ui-button-danger"/>
</footer>
</h:form>
</main>
</f:view>
</body>
</html>