<template>
    <div style="margin:0 auto;width:70%">
        <Panel header="Preregistro Mi Vacuna Covid 2021">
         
           
          <span class="p-float-label">
        <InputText id="curp" type="text"  v-model="poblacion.curp"   style="width: 100%"  
        class="p-invalid" />
      <label for="curp">CURP</label>
      </span>
      <br />  
      
        <span class="p-float-label">
        <InputText id="nombre" type="text" v-model="poblacion.nombre" style="width: 100%"  
         class="p-invalid"  />
        <label for="nombre">Nombre</label>
      </span>
      <br /> 
      <span class="p-float-label">
        <InputText id="apellidoPaterno" type="text" v-model="poblacion.apellidoPaterno" style="width: 100%"  
         class="p-invalid"  />
    <label for="apellidoPaterno">Apellido Paterno</label>
      </span>
      <br />
      <span class="p-float-label">
        <InputText id="apellidoMaterno" type="text" v-model="poblacion.apellidoMaterno" style="width: 100%"  />
        <label for="apellidoMaterno">Apellido Materno</label>
      </span>
      <br />
      <span class="p-float-label">
          <InputNumber  id="edad"  v-model="poblacion.edad" class="p-invalid"   /> 
        <label for="edad">Edad</label>
         </span>

        <br />
       <span class="p-float-label">
          <InputNumber  id="codigoPostal"  v-model="poblacion.codigoPostal" 
          class="p-invalid"  />
        <label for="codigoPostal">Código Postal</label>
         </span>

        <br />
       <span class="p-float-label">
        <InputText id="email" type="text" v-model="poblacion.email" style="width: 100%"  
       class="'p-invalid" />
        <label for="email">Email</label>
      </span>
      <br />
      
       <Button label="Guardar" icon="pi pi-check" @click="guardar" />
        
     

        </Panel>






    </div>
</template>

<script>
import Poblacion2021Service from "../service/Poblacion2021Service";

    export default{
        name : "MiVacunaApp",
        data(){
            return{
             poblacion:{
                curp:null,
                nombre:null,
                apellidoPaterno:null,
                apellidoMaterno:null,
                edad:null,
                codigoPostal:null,
                email:null,
                fechaRegistro:null,
                dosisUno:false,
                fechaAplicacionUno:null,
                sedeAplicacionUno:null,
                folioAplicacionUno:null,
                laboratorioUno:null,
                dosisDos:false,
                fechaAplicacionDos:null,
                sedeAplicacionDos:null,
                folioAplicacionDos:null,
                laboratorioDos:null
             }
            };
        },
       
        poblacion2021Service:null,
        created(){
            this.poblacion2021Service=new Poblacion2021Service();
        },
        methods:{

            guardar(){
           
           if (!this.poblacion.curp){
               alert("Debes agregar el curp!");
               return;
               }	
            if (!this.poblacion.nombre){
               alert("Debes agregar el nombre!");
               return;
               } 
             if (!this.poblacion.apellidoPaterno){
               alert("Debes agregar el apellido paterno!");
               return;
               }

               if (!this.poblacion.edad){
               alert("Debes agregar la edad!");
               return;
               }

               if (!this.poblacion.codigoPostal){
               alert("Debes agregar el código postal!");
               return;
               }
               if (!this.poblacion.email){
               alert("Debes agregar el correo!");
               return;
               }


               this.poblacion2021Service.insertarPoblacion2021(this.poblacion);


               
            
               this.poblacion={
                curp:null,
                nombre:null,
                apellidoPaterno:null,
                apellidoMaterno:null,
                edad:null,
                codigoPostal:null,
                email:null,
                fechaRegistro:null,
                dosisUno:false,
                fechaAplicacionUno:null,
                sedeAplicacionUno:null,
                folioAplicacionUno:null,
                laboratorioUno:null,
                dosisDos:false,
                fechaAplicacionDos:null,
                sedeAplicacionDos:null,
                folioAplicacionDos:null,
                laboratorioDos:null
            };





           }  
            
        }

        
        };


    


</script>


  
  
  
      
   

 
  
   
  
  npm run serve