<?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/principal.xhtml">

            <ui:define name="top">
                <center> <h2>P R O V E E D O R</h2></center>
            </ui:define>

             <ui:define name="left" >              
                <h:form >
                    <p:menu style="border-color: gray; margin: 1px; width: 163px; height: 600px;">

                        <p:menuitem action="ProductoLista.xhtml" value="Productos" ajax="false"  icon="pi pi-shopping-bag" iconPos="left" style="background-color: lightgray" styleClass="botonMenu" />
                        <p:menuitem action="proveedorLista.xhtml" value="Proveedores" ajax="false" icon="pi pi-id-card" iconPos="left" style="background-color: white " styleClass="botonMenu"/>
                        <p:menuitem action="marcaLista.xhtml" value="Marcas" ajax="false" icon="pi pi-tag" iconPos="left" style="background-color: lightgray" styleClass="botonMenu" />                   
                        <p:menuitem action="categoriaLista.xhtml" value="Categorias" ajax="false" icon="pi pi-star" iconPos="left" style="background-color: white" styleClass="botonMenu" />          
                        <p:menuitem action="UbicacionAlmacenLista.xhtml" value="Almacen" ajax="false" icon="pi pi-map-marker" iconPos="left" style="background-color: lightgray" styleClass="botonMenu"/>
                        <p:menuitem action="usuariosLista.xhtml" value="Usuarios" ajax="false" icon="pi pi-users" iconPos="left" style="background-color: white" styleClass="botonMenu" />
                    </p:menu>
                </h:form>
            </ui:define>
            <ui:define name="right">

            </ui:define>

            <ui:define name="content">

                <f:view>             
                    <h:form style="height: 600px;" class="form-container" >
                        <h1><h:outputText value="#{demoBeanProveedor.titulo}"/></h1>
                        <h:panelGrid id="grid" columns="3" >

                            <p:outputLabel value="Nombre:" for="nombre" style=" font-weight:bolder" />
                            <p:inputText id="nombre" value="#{demoBeanProveedor.proveedor.nombre}" title="Nombre" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="nombre"/>
  
                            <p:outputLabel value="Correo:" for="correo" style="font-weight: bolder"/>
                            <p:inputText id="correo" value="#{demoBeanProveedor.proveedor.correo}" title="Correo" required="true" validatorMessage="Correo electronico invalido" requiredMessage="Campo requerido" styleClass="formulario-elemento">
                                <f:validateRegex pattern="^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$" for="correo"/>
                            </p:inputText>
                            <p:message for="correo"/>


                            <p:outputLabel value="Telefono:" for="telefono" style=" font-weight:bolder" />
                            <p:inputText id="telefono" value="#{demoBeanProveedor.proveedor.telefono}" title="Telefono" required="true"  validatorMessage="Solo se aceptan numeros" requiredMessage="Campo requerido"  styleClass="formulario-elemento" >
                                <f:validateRegex pattern="^[0-9]{7,}" for="telefono"/>
                            </p:inputText>
                            <p:message for="telefono"/>
                            
                            <p:outputLabel value="Calle:" for="calle" style=" font-weight:bolder" />
                            <p:inputText id="calle" value="#{demoBeanProveedor.proveedor.calle}" title="Calle" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="calle"/>
                            
                            <p:outputLabel value="Numero:" for="numero" style=" font-weight:bolder" />
                            <p:inputText id="numero" value="#{demoBeanProveedor.proveedor.numero}" title="Numero" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="numero"/>
                            
                            <p:outputLabel value="CP:" for="cp" style=" font-weight:bolder" />
                            <p:inputText id="cp" value="#{demoBeanProveedor.proveedor.cp}" title="Cp" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="cp"/>
                            
                            <p:outputLabel value="Municipio:" for="municipio" style=" font-weight:bolder" />
                            <p:inputText id="municipio" value="#{demoBeanProveedor.proveedor.municipio}" title="Municipio" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="municipio"/>
                  
                            <p:outputLabel value="Estado:" for="estado" style=" font-weight:bolder" />
                            <p:inputText id="estado" value="#{demoBeanProveedor.proveedor.estado}" title="Estado" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="estado"/>
                            
                            <p:outputLabel value="Pais:" for="pais" style=" font-weight:bolder" />
                            <p:inputText id="pais" value="#{demoBeanProveedor.proveedor.pais}" title="Pais" required="true" requiredMessage="Campo requerido" styleClass="formulario-elemento" /> 
                            <p:message for="pais"/>
 
                        </h:panelGrid>

                        <div>
                            <p:commandButton action="#{demoBeanProveedor.agregarProveedor()}"  update="grid" rendered="#{demoBeanProveedor.nuevo}" ajax="false" icon="pi pi-check" style="margin-right: 10px; margin-top: 10px;  background-color: green; color:white; border-color:green;" /> 
                            <p:commandButton action="proveedorLista.xhtml" actionListener="#{demoBeanProveedor.editarProveedor()}"  update="grid" rendered="#{!demoBeanProveedor.nuevo}" ajax="false" icon="pi pi-check" style="margin-right: 10px; margin-top: 10px; background-color: green; color:white; border-color:green;" /> 
                            <p:commandButton action="proveedorLista.xhtml"  immediate="true" ajax="false" icon="pi pi-times"  style="background-color: red; color:white; border-color: red; margin-right: 15px;"/>
                        </div>

                    </h:form>
                </f:view>


            </ui:define>

        </ui:composition>

    </body>
</html>