From 8702aaef89dab32c48348a2692359fd69cc332f1 Mon Sep 17 00:00:00 2001
From: casnet1 <ne.castillo1607@gmail.com>
Date: Sun, 15 Nov 2020 03:44:43 -0600
Subject: [PATCH 1/7] nuevos cambios

---
 pages/responsable/nuevo/index.vue | 266 +++++++++++-------------------
 1 file changed, 95 insertions(+), 171 deletions(-)

diff --git a/pages/responsable/nuevo/index.vue b/pages/responsable/nuevo/index.vue
index 2829993..0c40cf0 100644
--- a/pages/responsable/nuevo/index.vue
+++ b/pages/responsable/nuevo/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="columns is-mobile">
     <div class="column column is-10 is-offset-1">
-      <section class="mensaje is-size-5-desktop is-size-5-widescreen is-size-5-fullhd">
+      <section class="mensaje has-text-justified is-size-6-desktop is-size-6-widescreen is-size-5-fullhd">
         <p class="block">Estimado(a) responsable de programa de servicio social:</p>
         <p class="block">
           Te solicitamos llenar cuidadosamente los campos solicitados a continuación
@@ -25,17 +25,15 @@
       </section>
 
       <section>
-        <h1 class="title is-1 my-6">
+        <h1 class="title is-1 mt-6">
           Añadir Servicio Social
         </h1>
-
-        <form>
-          <div class="columns is-variable is-1-mobile is-0-tablet is-3-desktop is-8-widescreen is-2-fullhd">
-            <div class="column is-full-mobile is-three-quarters-tablet is-two-thirds-desktop is-two-thirds-widescreen is-half-fullhd">
-
-              <b-field class="columns">
+          <div class="columns is-variable is-1-mobile is-0-tablet is-3-desktop is-8-widescreen is-2-fullhd pl-0">
+            <div class="column is-full-mobile is-three-quarters-tablet is-two-thirds-desktop is-two-thirds-widescreen is-half-fullhd pl-0">
+            <form>
+              <b-field class="column p-0 my-6 is-full">
                       <input
-                      class="input column is-two-thirds"
+                      class="input column "
                       v-model="noCuenta"
                       message="Solo numeros"
                       required="required"
@@ -44,76 +42,61 @@
                       min="0"></input>
 
                       <p class="control">
-                        <b-button class="button is-info" @click="buscar(alumno.cuenta)">Buscar</b-button>
+                        <b-button class="button is-info" @click=" simple()">Buscar</b-button>
                       </p>
               </b-field>
 
-              <b-field  label="Nombre" >
-                  <b-input :value="alumno.nombre" disabled></b-input>
+              <b-field label="Nombre">
+                <div class="input">{{ alumno.nombre }}</div>
               </b-field>
 
-              <b-field  label="Carrera" >
-                  <b-input :value="alumno.carrera"  disabled></b-input>
+              <b-field label="Carrera">
+                <div class="input">{{ alumno.carrera }}</div>
               </b-field>
 
-              <b-field label="Creditos" >
-                  <b-input :value="alumno.creditos" disabled></b-input>
+              <b-field label="Creditos">
+                <div class="input">{{ alumno.creditos }}</div>
               </b-field>
 
               <b-field label="Seleccione programa">
-                  <b-select placeholder="dependencias"  expanded v-model="programaSelected.id" @change="programaSe()">
-                     <option
+                  <b-select placeholder="programa"  expanded v-model="programaSelectedID">
+                    <option
                     v-for="programa in programas"
                     v-bind:key="programa.id"
                     :value="programa.id"
-                    @click="programaSe()"
                     >{{ programa.nombre }}</option>
 
                   </b-select>
               </b-field>
 
               <b-field label="Institucion">
-                  <b-input :value="programaSelected.institucion"  disabled></b-input>
+                <div class="input">{{ programaSelected.institucion }}</div>
               </b-field>
 
-              <b-field label="Dependencia" >
-                  <b-input :value="programaSelected.dependencia" disabled></b-input>
+                <b-field label="Dendencia">
+                <div class="input">{{ programaSelected.dependencia }}</div>
               </b-field>
 
-              <b-field label="Clave del programa" >
-                  <b-input :value="programaSelected.clave" disabled></b-input>
+                <b-field label="Clave del programa">
+                <div class="input">{{ programaSelected.clave }}</div>
               </b-field>
 
-              <b-field label="fecha de inicio">
-                  <b-datepicker
-                      ref="datepicker1"
-                      expanded
-                      placeholder="Select a date"
-                      :mobile-native="false"
-                       :min-date="minDate"
-                      v-model="dataSend.inicio">
-                  </b-datepicker>
-                  <b-button
-                      @click="$refs.datepicker1.toggle()"
-                      icon-left="calendar-today"
-                      type="is-info"
-                      />
+              <b-field label="Fecha de inicio">
+        <b-datepicker
+          placeholder="Inicio"
+          icon="calendar-today"
+          v-model="dataSend.inicio[0]"
+          :min-date="minDate1">
+        </b-datepicker>
               </b-field>
 
-              <b-field label="fecha de fin">
-                 <b-datepicker
-                      ref="datepicker2"
-                      expanded
-                      placeholder="Select a date"
-                      :mobile-native="false"
-                       :min-date="new Date(dataSend.inicio.getTime() + seisMeses)"
-                      v-model="dataSend.fin">
-                  </b-datepicker>
-                  <b-button
-                      @click="$refs.datepicker2.toggle()"
-                      icon-left="calendar-today"
-                      type="is-info"
-                       />
+              <b-field label="Fecha de fin" v-if="dataSend.inicio">
+                <b-datepicker
+                  placeholder="Fin"
+                  v-model="dataSend.fin[0]"
+                  :min-date="minDate2"
+                  icon="calendar-today">
+                </b-datepicker>
               </b-field>
 
               <b-field label="Correo">
@@ -122,80 +105,32 @@
 
               <h3 class="title is-4 mt-6">Carta de aceptación (en formato .PDF. No se aceptan fotos).</h3>
 
-              <!-- <b-field class=" file is-link" :class="{'has-name': !!file}">
-                  <b-upload v-model="dataSend.file" class="file-label">
-                      <span class="file-cta ">
-                          <b-icon class="file-icon" icon="upload"></b-icon>
-                          <span class="file-label">Click to upload</span>
-                      </span>
-                      <span class="file-name" v-if="file">
-                          {{ file.name }}
-                      </span>
+              <b-field>
+                  <b-upload v-model="dataSend.file" drag-drop expanded>
+                    <section class="section">
+                      <div class="content has-text-centered">
+                        <p>
+                          <b-icon icon="upload" size="is-large"></b-icon>
+                        </p>
+                        <p>{{ dataSend.file.name || "Arrastra aquí tu archivo o da click para buscar"}}</p>
+                      </div>
+                    </section>
                   </b-upload>
-              </b-field> -->
-
-              <!-- <b-field class="file is-primary" :class="{'has-name': !!file}">
-        <b-upload v-model="file" class="file-label">
-            <span class="file-cta">
-                <b-icon class="file-icon" icon="upload"></b-icon>
-                <span class="file-label">Click to upload</span>
-            </span>
-            <span class="file-name" v-if="file">
-                {{ file.name }}
-            </span>
-        </b-upload>
-              </b-field >-->
-
-              <section class="container is-full">
-                  <b-field>
-                      <b-upload v-model="dropFiles"
-                          multiple
-                          drag-drop>
-                          <section class="section">
-                              <div class="content has-text-centered">
-                                  <p>
-                                      <b-icon
-                                          icon="upload"
-                                          size="is-large">
-                                      </b-icon>
-                                  </p>
-                                  <p>Drop your files here or click to upload</p>
-                              </div>
-                          </section>
-                      </b-upload>
-                  </b-field>
-
-                  <div class="tags is-fullwidth">
-                      <span v-for="(file, index) in dropFiles"
-                          :key="index"
-                          class="tag is-primary is-fullwidth" >
-                          {{file.name}}
-                          <button class="delete is-small is-fullwidth"
-                              type="button"
-                              @click="deleteDropFile(index)">
-                          </button>
-                      </span>
-                  </div>
-              </section>
-
-              <b-field class="derecha">
-                <button class="button is-success is-medium" @click="open" style="float: right; margin:2rem 0;">
-                    Enviar
-                </button>
               </b-field>
+
+            </form>
+           <b-field class="derecha">
+              <button :disabled='dataSend.file == "" || noCuenta == "" || dataSend.correo == "" ||  dataSend.inicio == "" || dataSend.fin == ""  ' class="button is-success is-medium" @click="open" style="float: right; margin:2rem 0;">
+                  Enviar
+              </button>
+            </b-field>
+
             </div>
           </div>
-        </form>
-       <!--  <div>
-            <b-field>
-                <button class="button is-primary is-medium" @click="open">
-                    Enviar
-                </button>
-            </b-field>
-        </div> -->
+
       </section>
 
-     <!--  <pre>
+      <!-- <pre>
         {{$data}}
       </pre> -->
     </div>
@@ -215,12 +150,14 @@ export default {
       dropFiles: [],
       minDate: new Date('January 01, 2020 03:24:00'), // "2020-01-01T06:00:00.000Z",
       seisMeses: 1000 * 60 * 60 * 24 * 7 * 4 * 6,
+      minDate1: new Date('2020-01-01'),
+      programaSelectedID: '',
       programaSelected: {
-        id: '',
-        nombre: 'acatlan',
-        institucion: 'acatlan',
-        dependencia: 'atlan',
-        clave: '215'
+
+        nombre: '',
+        institucion: '',
+        dependencia: '',
+        clave: ''
       },
       isLoading: false,
       isFullPage: true,
@@ -254,9 +191,9 @@ export default {
         }
       ],
       dataSend: {
-        file: '',
-        inicio: new Date(),
-        fin: new Date(),
+        file: [],
+        inicio: [],
+        fin: [],
         correo: ''
       }
 
@@ -264,11 +201,14 @@ export default {
   },
   methods:
   {
-    openLoading () {
+  /*   openLoading () {
       this.isLoading = true
       setTimeout(() => {
         this.isLoading = false
       }, 10 * 1000)
+    }, */
+    simple () {
+      this.$buefy.notification.open('Something happened')
     },
     open () {
       const loadingComponent = this.$buefy.loading.open({
@@ -279,42 +219,6 @@ export default {
     deleteDropFile (index) {
       this.dropFiles.splice(index, 1)
     },
-    ClavePrograma () {
-      if (this.programa) {
-        for (let i = 0; i < this.programas.length; i++) {
-          if (this.programas[i].id === this.programaSelected) { return this.programas[i].clave }
-        }
-      }
-    },
-    Dependencia () {
-      if (this.programa) {
-        for (let i = 0; i < this.programas.length; i++) {
-          console.log(this.programaSelected + '   ' + this.programas[i].id)
-          if (this.programas[i].id === this.programaSelected) { return alert(this.programas[i].dependencia) }
-        }
-      }
-    },
-    Institucion () {
-      if (this.programa) {
-        for (let i = 0; i < this.programas.length; i++) {
-          if (this.programas[i].id === this.programaSelected) { return this.programas[i].institucion }
-        }
-      }
-    },
-    ProgramaSe () {
-      console.log('cambiar variables')
-      if (this.programaSelected.id) {
-        for (let i = 0; i < this.programas.length; i++) {
-          if (this.programas[i].id === this.programaSelected.id) {
-            this.programaSelected.nombre == this.programas[i].nombre
-            this.programaSelected.institucion == this.programas[i].institucion
-            this.programaSelected.dependencia == this.programas[i].dependencia
-            this.programaSelected.clave == this.programas[i].clave
-          }
-        }
-        return ''
-      }
-    },
     esNumero (numero) {
       const ultimaLetra = numero.length - 1
 
@@ -332,14 +236,27 @@ export default {
       this.noCuenta = Number(this.noCuenta) < 0 ? '' : this.noCuenta
       this.noCuenta = this.esNumero(this.noCuenta)
       this.noCuenta = this.maxLength(this.noCuenta, 9)
+    },
+    programaSelectedID () {
+      if (this.programaSelectedID) {
+        for (let i = 0; i < this.programas.length; i++) {
+          if (this.programas[i].id === this.programaSelectedID) {
+            this.programaSelected.nombre = this.programas[i].nombre
+            this.programaSelected.institucion = this.programas[i].institucion
+            this.programaSelected.dependencia = this.programas[i].dependencia
+            this.programaSelected.clave = this.programas[i].clave
+          }
+        }
+      }
+    }
+
+  },
+  computed: {
+    minDate2 () {
+      const min = new Date(this.dataSend.inicio)
+      return new Date(min.getFullYear(), min.getMonth() + 6, min.getDate())
     }
   }
-  /*  created () {
-    this.dataSend.inicio = null
-    this.dataSend.fin = null
-
-} */
-
 }
 </script>
 
@@ -354,5 +271,12 @@ export default {
 .file-cta{
   background-color: #167df0 !important;
 }
+.disabled {
+  cursor: help !important;
+  pointer-events: all !important;
+}
+.columns{
+  margin: 0;
+}
 
 </style>

From d4f44b3eaf428b204ece638c3e67c57b5f150790 Mon Sep 17 00:00:00 2001
From: mxrco <yosoymarco3@gmail.com>
Date: Mon, 16 Nov 2020 13:45:00 -0600
Subject: [PATCH 2/7] cuarto commit

---
 components/admin/servicio/modificar/form.vue | 59 +++++++++++++++-----
 components/admin/servicio/vistaServicio.vue  | 48 +++++++++-------
 2 files changed, 71 insertions(+), 36 deletions(-)

diff --git a/components/admin/servicio/modificar/form.vue b/components/admin/servicio/modificar/form.vue
index 69ab048..af9cece 100644
--- a/components/admin/servicio/modificar/form.vue
+++ b/components/admin/servicio/modificar/form.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <b-button class="is-info">Regresar</b-button>
+    <b-button class="is-info" @click="regresar()">Regresar</b-button>
     <br><br>
     <p class="is-size-2">Editar información del alumno</p>
     <br>
@@ -9,8 +9,7 @@
         <b-input
           type="email"
           v-model="nuevo.correo"
-          v-bind:placeholder="viejo.correo"
-          value="">
+          v-bind:placeholder="viejo.correo">
         </b-input>
       </b-field>
       <b-field label="Fecha de inicio">
@@ -22,7 +21,7 @@
         </b-datepicker>
       </b-field>
       <transition name="fade">
-        <b-field label="Fecha de fin" v-if="fechaInicio">
+        <b-field label="Fecha de fin" v-if="fechaInicio[0]">
           <b-datepicker
             v-bind:placeholder="viejo.fechaInicio"
             v-model="fechaFin[0]"
@@ -35,7 +34,7 @@
         <b-input type="text" v-model="nuevo.direccion" v-bind:placeholder="viejo.direccion"></b-input>
       </b-field>
       <b-field label="Teléfono">
-        <b-input type="number" value="" v-bind:placeholder="viejo.telefono"></b-input>
+        <b-input type="number" v-bind:placeholder="viejo.telefono" maxlength="10"></b-input>
       </b-field>
       <b-field label="Fecha de nacimiento">
         <b-datepicker
@@ -45,12 +44,12 @@
         </b-datepicker>
       </b-field>
       <b-field label="ID status">
-        <b-input type="" value="" v-bind:placeholder="viejo.idStatus"></b-input>
+        <b-input type="" v-bind:placeholder="viejo.idStatus"></b-input>
       </b-field>
       <p class="is-size-5">Carta de aceptación</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.cartaAceptacion" drag-drop expanded>
+        <b-upload v-model="nuevo.cartaAceptacion" type="is-black" v-on:input="validarExt(1)" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
@@ -64,7 +63,7 @@
       <p class="is-size-5">Carta de término</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.cartaTermino" drag-drop expanded>
+        <b-upload v-model="nuevo.cartaTermino" type="is-black" v-on:input="validarExt(2)" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
@@ -78,7 +77,7 @@
       <p class="is-size-5">Informe global</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.informeGlobal" drag-drop expanded>
+        <b-upload v-model="nuevo.informeGlobal" type="is-black" v-on:input="validarExt(3)" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
@@ -90,9 +89,9 @@
         </b-upload>
       </b-field>
       <br>
-      <b-button v-if="mostrar()" class="is-info">
-        Actualizar Datos
-      </b-button>
+      <b-button class="is-info" @click="regresar()">Regresar</b-button>
+      <b-button v-if="mostrar()" class="is-info">Actualizar Datos</b-button>
+      <b-button v-else disabled class="is-info">Actualizar Datos</b-button>
     </div>
   </div>
 </template>
@@ -128,13 +127,13 @@ export default {
       fechaNacimiento: [],
       fechaInicio: [],
       fechaFin: [],
-      minDate1: new Date('2020-01-02')
+      minDate1: new Date('2020-01-01')
     }
   },
   methods: {
     dangerToast () {
       this.$buefy.toast.open({
-        message: 'Correo invalido',
+        message: 'Asegurate de ingresar un PDF',
         type: 'is-danger'
       })
     },
@@ -151,9 +150,39 @@ export default {
         this.nuevo.informeGlobal.name ||
         this.nuevo.idStatus
       ) {
+        if (this.nuevo.correo) {
+          if (validator.isEmail(this.nuevo.correo)) {
+            return true
+          } else {
+            return false
+          }
+        }
         return true
       }
-      return false
+    },
+    validarExt (a) {
+      const extPermitidas = /(.pdf)$/i
+      switch (a) {
+        case 1: if (!extPermitidas.exec(this.nuevo.cartaAceptacion.name)) {
+          this.dangerToast()
+          this.nuevo.cartaAceptacion = {}
+        }
+          break
+        case 2: if (!extPermitidas.exec(this.nuevo.cartaTermino.name)) {
+          this.dangerToast()
+          this.nuevo.cartaTermino = {}
+        }
+          break
+        case 3: if (!extPermitidas.exec(this.nuevo.informeGlobal.name)) {
+          this.dangerToast()
+          this.nuevo.informeGlobal = {}
+        }
+          break
+      }
+    },
+    regresar () {
+      localStorage.removeItem('idRegistro')
+      this.$router.push('/admin/servicio')
     }
   },
   computed: {
diff --git a/components/admin/servicio/vistaServicio.vue b/components/admin/servicio/vistaServicio.vue
index 2bdaa59..7d2cc6e 100644
--- a/components/admin/servicio/vistaServicio.vue
+++ b/components/admin/servicio/vistaServicio.vue
@@ -1,7 +1,30 @@
 <template>
-    <div class="container">
-      <p class="h2">{{ title }}</p>
+  <div class="container">
+    <div v-if="alumno.programa">
+      <p class="is-size-4">Programa</p>
+      <p class="is-size-5"></p>
     </div>
+    <div>
+      <p class="is-size-3" v-if="alumno.idStatus == 1">
+        Pre Registro
+      </p>
+      <p class="is-size-3" v-else-if="alumno.idStatus == 2">
+        Pre Registro Válidado
+      </p>
+      <p class="is-size-3" v-else-if="alumno.idStatus == 3">
+        Registro
+      </p>
+      <p class="is-size-3" v-else-if="alumno.idStatus == 4">
+        Pre Término
+      </p>
+      <p class="is-size-3" v-else-if="alumno.idStatus == 5">
+        Término
+      </p>
+      <p class="is-size-3" v-else-if="alumno.idStatus == 6">
+          Liberación
+      </p>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -11,7 +34,7 @@ export default {
       alumno: {
         fechaInicio: '',
         fechaFin: '',
-        idStatus: 1
+        idStatus: 6
       },
       idRegistro: window.localStorage.getItem('idRegistro'),
       token: {
@@ -28,27 +51,10 @@ export default {
       mensajeCancel: '',
       spinner: false,
       vistoBueno: false,
-      acatlan: false,
-      title: 'Hola'
+      acatlan: false
     }
   },
   methods: {
-    elegirTitulo: function () {
-      switch (this.alumno.idStatus) {
-        case 1: this.title = 'Pre Registro'
-          break
-        case 2: this.title = 'Pre Registro Válido'
-          break
-        case 3: this.title = 'Registro'
-          break
-        case 4: this.title = 'Pre Término'
-          break
-        case 5: this.title = 'Termino'
-          break
-        case 6: this.title = 'Liberación'
-          break
-      }
-    }
   }
 }
 </script>

From a15f520b20521572d72ec5c7ed53dbb7996d48bd Mon Sep 17 00:00:00 2001
From: casnet1 <ne.castillo1607@gmail.com>
Date: Mon, 16 Nov 2020 14:17:06 -0600
Subject: [PATCH 3/7] container

---
 pages/responsable/nuevo/index.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/pages/responsable/nuevo/index.vue b/pages/responsable/nuevo/index.vue
index 0c40cf0..755ce19 100644
--- a/pages/responsable/nuevo/index.vue
+++ b/pages/responsable/nuevo/index.vue
@@ -1,15 +1,17 @@
 <template>
+  <div class="container">
   <div class="columns is-mobile">
-    <div class="column column is-10 is-offset-1">
+    <div class="column column is-12">
       <section class="mensaje has-text-justified is-size-6-desktop is-size-6-widescreen is-size-5-fullhd">
         <p class="block">Estimado(a) responsable de programa de servicio social:</p>
-        <p class="block">
+
+        <p class="block is-size-7">
           Te solicitamos llenar cuidadosamente los campos solicitados a continuación
           para iniciar el trámite de registro de servicio social de nuestro
           alumno(a), quien a su vez completará posteriormente el proceso en este
           mismo sistema con otros datos.
         </p>
-        <p class="block">
+        <p class="block is-size-7">
           Es muy importante escribir correctamente el correo del alumno para que el
           sistema pueda enviarle la notificación correspondiente de que ya puede
           ingresar a completar su registro. También debes tomar en cuenta que la
@@ -29,7 +31,7 @@
           Añadir Servicio Social
         </h1>
           <div class="columns is-variable is-1-mobile is-0-tablet is-3-desktop is-8-widescreen is-2-fullhd pl-0">
-            <div class="column is-full-mobile is-three-quarters-tablet is-two-thirds-desktop is-two-thirds-widescreen is-half-fullhd pl-0">
+            <div class="column  pl-0">
             <form>
               <b-field class="column p-0 my-6 is-full">
                       <input
@@ -106,7 +108,7 @@
               <h3 class="title is-4 mt-6">Carta de aceptación (en formato .PDF. No se aceptan fotos).</h3>
 
               <b-field>
-                  <b-upload v-model="dataSend.file" drag-drop expanded>
+                  <b-upload v-model="dataSend.file" drag-drop expanded accept="application/pdf">
                     <section class="section">
                       <div class="content has-text-centered">
                         <p>
@@ -135,6 +137,7 @@
       </pre> -->
     </div>
   </div>
+  </div>
 </template>
 
 <script>

From 7576a5bbfe11deae3f9e8c678183c6d1ea38c37f Mon Sep 17 00:00:00 2001
From: mxrco <yosoymarco3@gmail.com>
Date: Thu, 19 Nov 2020 16:12:38 -0600
Subject: [PATCH 4/7] tabla responsables

---
 components/admin/servicio/modificar/form.vue  |   6 +-
 .../servicio/programa/tablaResponsables.vue   | 253 ++++++++++++++++++
 components/admin/servicio/vistaServicio.vue   | 104 ++++++-
 components/alumno/ejemplo.vue                 |   4 +-
 pages/admin/programa/index.vue                |  16 ++
 pages/alumno/index.vue                        |  65 ++++-
 6 files changed, 433 insertions(+), 15 deletions(-)
 create mode 100644 components/admin/servicio/programa/tablaResponsables.vue
 create mode 100644 pages/admin/programa/index.vue

diff --git a/components/admin/servicio/modificar/form.vue b/components/admin/servicio/modificar/form.vue
index af9cece..4bbd800 100644
--- a/components/admin/servicio/modificar/form.vue
+++ b/components/admin/servicio/modificar/form.vue
@@ -49,7 +49,7 @@
       <p class="is-size-5">Carta de aceptación</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.cartaAceptacion" type="is-black" v-on:input="validarExt(1)" drag-drop expanded>
+        <b-upload v-model="nuevo.cartaAceptacion" type="is-black" v-on:input="validarExt(1)" accept="application/pdf" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
@@ -63,7 +63,7 @@
       <p class="is-size-5">Carta de término</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.cartaTermino" type="is-black" v-on:input="validarExt(2)" drag-drop expanded>
+        <b-upload v-model="nuevo.cartaTermino" type="is-black" v-on:input="validarExt(2)" accept="application/pdf" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
@@ -77,7 +77,7 @@
       <p class="is-size-5">Informe global</p>
       <br>
       <b-field>
-        <b-upload v-model="nuevo.informeGlobal" type="is-black" v-on:input="validarExt(3)" drag-drop expanded>
+        <b-upload v-model="nuevo.informeGlobal" type="is-black" v-on:input="validarExt(3)" accept="application/pdf" drag-drop expanded>
           <section class="section">
             <div class="content has-text-centered">
               <p>
diff --git a/components/admin/servicio/programa/tablaResponsables.vue b/components/admin/servicio/programa/tablaResponsables.vue
new file mode 100644
index 0000000..aa12468
--- /dev/null
+++ b/components/admin/servicio/programa/tablaResponsables.vue
@@ -0,0 +1,253 @@
+<template>
+  <!--<div class="container">
+    <div class="table-responsive-md">
+      <table class="table mt-3 table-hover">
+        <thead>
+          <tr>
+            <th>Nombre de responsable</th>
+            <th>Correo</th>
+          </tr>
+        </thead>
+        <tbody class="renglon">
+          <tr
+            v-for="responsable in responsables"
+            :key="responsable.idResponsable"
+            @click="verRegistro(responsable.idResponsable)"
+          >
+            <td>{{ responsable.nombre }}</td>
+            <td>{{ responsable.correo }}</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+
+  </div>-->
+  <section>
+    <b-table
+      class="tabla"
+      hoverable
+      :data="responsables"
+      striped
+      paginated
+      :total="total"
+      :per-page="perPage"
+      @page-change="onPageChange"
+      aria-next-label="Next page"
+      aria-previous-label="Previous page"
+      aria-page-label="Page"
+      aria-current-label="Current page">
+      <template v-for="column in columns">
+        <b-table-column :key="column.id" v-bind="column">
+        <template
+          v-if="column.searchable && !column.numeric"
+          slot="searchable"
+          slot-scope="props">
+          <b-input
+            v-model="props.filters[props.column.field]"
+            placeholder="Buscar por..."
+            icon="magnify"
+            class="busqueda"/>
+        </template>
+        <template v-slot="props">
+          <span @click="verRegistro(props.row.idResponsable)">{{ props.row[column.field] }}</span>
+        </template>
+        </b-table-column>
+      </template>
+    </b-table>
+  </section>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      page: 1,
+      perPage: 20,
+      total: 0,
+      responsables: [
+        {
+          idResponsable: 1,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 2,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 3,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 4,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 5,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 6,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 7,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 8,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 9,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 10,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 11,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 12,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 13,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 14,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 15,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 16,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 17,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 18,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 19,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 20,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 21,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 22,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 23,
+          nombre: 'Marco',
+          correo: 'correo1'
+        },
+        {
+          idResponsable: 24,
+          nombre: 'Lemuel',
+          correo: 'correo2'
+        }
+      ],
+      columns: [
+        {
+          field: 'idResponsable',
+          visible: false
+        },
+        {
+          field: 'nombre',
+          label: 'Nombre responsable',
+          searchable: true,
+          centered: true
+        },
+        {
+          field: 'correo',
+          label: 'Correo electrónico',
+          searchable: true,
+          centered: true
+        }
+      ]
+    }
+  },
+  methods: {
+    verRegistro (idResponsable) {
+      window.localStorage.setItem('idResponsable', idResponsable)
+      this.$router.push('/programa/responsableinfo')
+      console.log(idResponsable)
+    },
+    onPageChange (page) {
+      this.page = page
+      this.loadAsyncData()
+    }
+  },
+  computed: {
+    busquedaNombreResponsable () {
+      return this.responsables.filter(responsables =>
+        responsables.nombreResp.includes(this.buscarNombreResponsable)
+      )
+    }
+  },
+  watch: {
+    busquedaCorreoResponsable () {
+      this.obtenerResponsables()
+    }
+  }/* ,
+  async created () {
+    await this.obtenerResponsables()
+  } */
+}
+</script>
+
+<style scoped>
+  .renglon:hover {
+    cursor: pointer !important;
+  }
+  .busqueda {
+    width: 200%;
+    margin-left: 50%;
+  }
+  .tabla {
+    margin-top: 50px;
+    margin-bottom: 100px;
+    border: 3px solid #1b3d70;
+    border-radius: 10px;
+    padding: 20px;
+  }
+</style>
diff --git a/components/admin/servicio/vistaServicio.vue b/components/admin/servicio/vistaServicio.vue
index 7d2cc6e..72209ad 100644
--- a/components/admin/servicio/vistaServicio.vue
+++ b/components/admin/servicio/vistaServicio.vue
@@ -1,10 +1,14 @@
 <template>
   <div class="container">
-    <div v-if="alumno.programa">
-      <p class="is-size-4">Programa</p>
-      <p class="is-size-5"></p>
+    <div class="mb-5">
+      <b-button class="boton is-info" @click="$router.push('./')">
+        Regresar
+      </b-button>
+      <b-button class="boton is-info" @click="$router.push('./servicio/modificar')">
+        Editar información
+      </b-button>
     </div>
-    <div>
+    <div id="Status">
       <p class="is-size-3" v-if="alumno.idStatus == 1">
         Pre Registro
       </p>
@@ -24,6 +28,65 @@
           Liberación
       </p>
     </div>
+    <div id="programa">
+      <br>
+      <p class="is-size-4">Datos del programa</p><br>
+      <p class="is-size-5">Programa: <span> {{alumno.programa}} </span></p>
+      <p class="is-size-5">Clave del programa: <span> {{alumno.clavePrograma}} </span></p>
+      <p class="is-size-5">Dependecia: <span> {{alumno.dependecia}} </span></p>
+      <p class="is-size-5">Institución: <span> {{alumno.institucion}} </span></p>
+      <br>
+    </div>
+    <div id="datosPersonales">
+      <p class="is-size-4" >Datos personales</p><br>
+      <p class="is-size-5 mt-5" v-if="alumno.nombre">Nombre: <span> {{alumno.nombre}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.noCuenta">Número de cuenta: <span> {{alumno.noCuenta}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.carrera">Carrera: <span> {{alumno.carrera}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.correo">Correo: <span> {{alumno.correo}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.creditos">Créditos: <span> {{alumno.creditos}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.fechaInicio">Fecha de inicio: <span> {{alumno.fechaInicio}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.fechaFin">Fecha de fin: <span> {{alumno.fechaFin}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.telefono">Teléfono: <span> {{alumno.telefono}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.direccion">Dirección: <span> {{alumno.direccion}} </span></p>
+      <p class="is-size-5 mt-5" v-if="alumno.fechaNacimiento">Fecha de nacimiento: <span> {{alumno.fechaNacimiento}} </span></p>
+    </div>
+    <div id="enlaces">
+      <br>
+      <div class="level">
+        <a href="google.com" class="has-text-link link">Ver carta de aceptación</a>
+        <b-button class="is-danger" v-if="alumno.idStatus == 1">
+          Rechazar
+        </b-button>
+      </div>
+      <h3 class="is-size-4 mb-5" v-if="alumno.idStatus == 1">Confirmar el pre-registro del alumno</h3>
+      <h3 class="is-size-4 mb-5" v-if="alumno.idStatus == 4">Termino</h3>
+      <h3 class="is-size-4 mb-5" v-if="alumno.idStatus == 5">Validar el término del alumno</h3>
+      <div class="level">
+        <a href="google.com" class="has-text-link link">Ver carta de término</a>
+        <b-button class="is-danger" v-if="alumno.idStatus == 5">
+          Rechazar
+        </b-button>
+      </div>
+      <div class="level">
+        <a href="google.com" class="has-text-link link">Ver informe global de actividades</a>
+        <b-button class="is-danger" v-if="alumno.idStatus == 5">
+          Rechazar
+        </b-button>
+      </div>
+      <p v-if="alumno.cuestionarioP">Cuenta con cuestionario de programa resuelto.</p>
+      <p v-if="alumno.cuestionarioA">Cuenta con cuestionario de alumno resuelto.</p>
+    </div>
+    <div id="acciones" class="my-5">
+      <b-button class="is-success" v-if="mostrarConfirmar()">
+        Confirmar
+      </b-button>
+      <b-button class="is-danger">
+        Cancelar
+      </b-button>
+      <b-button class="is-info" @click="$router.push('./')">
+        Regresar
+      </b-button>
+    </div>
   </div>
 </template>
 
@@ -32,9 +95,9 @@ export default {
   data () {
     return {
       alumno: {
-        fechaInicio: '',
-        fechaFin: '',
-        idStatus: 6
+        fechaInicio: '14/2/2020',
+        fechaFin: '14/8/2020',
+        idStatus: 5
       },
       idRegistro: window.localStorage.getItem('idRegistro'),
       token: {
@@ -55,6 +118,33 @@ export default {
     }
   },
   methods: {
+    mostrarConfirmar () {
+      if (this.alumno.idStatus === 1) return true
+      else if (this.alumno.idStatus === 5) {
+        if (!this.alumno.acatlanContigo) return true
+        else if (this.vistoBueno) return true
+      }
+      return false
+    }
   }
 }
 </script>
+
+<style scoped>
+.boton {
+  margin-top: 2%;
+}
+.is-size-5{
+  margin-bottom: 10px;
+}
+.link-f {
+  font-size: 27px !important;
+}
+.link {
+  display: flex;
+  justify-content: flex-start;
+  font-size: 20px;
+  margin-top: 10px;
+}
+
+</style>
diff --git a/components/alumno/ejemplo.vue b/components/alumno/ejemplo.vue
index 014129f..be22198 100644
--- a/components/alumno/ejemplo.vue
+++ b/components/alumno/ejemplo.vue
@@ -1,6 +1,6 @@
 <template>
-  <section>
-    hola
+  <section class="container">
+    <p>hola</p>
   </section>
 </template>
 
diff --git a/pages/admin/programa/index.vue b/pages/admin/programa/index.vue
new file mode 100644
index 0000000..475375c
--- /dev/null
+++ b/pages/admin/programa/index.vue
@@ -0,0 +1,16 @@
+<template>
+  <div class="container">
+    <p class="is-size-2 mb-5">Programas de Servicio Social</p>
+    <b-button class="is-info">Regresar</b-button>
+    <TablaResponsables />
+  </div>
+</template>
+
+<script>
+import tablaResponsables from '../../../components/admin/servicio/programa/tablaResponsables'
+export default {
+  components: {
+    tablaResponsables
+  }
+}
+</script>
diff --git a/pages/alumno/index.vue b/pages/alumno/index.vue
index 014129f..006d05e 100644
--- a/pages/alumno/index.vue
+++ b/pages/alumno/index.vue
@@ -1,9 +1,68 @@
 <template>
-  <section>
-    hola
+  <section class="container">
+    <p class="is-size-2">Formulario</p>
+    <br>
+    <b-field label="Nombre: ">
+      <b-input
+        type="text"
+        v-model="nombre"
+        placeholder="nombre">
+      </b-input>
+    </b-field>
+    <b-field label="Ocupación: ">
+      <b-input
+        type="text"
+        v-model="ocupacion"
+        placeholder="Ocupación">
+      </b-input>
+    </b-field>
+    <b-field label="Dirección: ">
+      <b-input
+        type="text"
+        v-model="direccion"
+        placeholder="Dirección">
+      </b-input>
+    </b-field>
+    <b-field label="Código postal: ">
+      <b-input
+        type="text"
+        v-model="codigoPostal"
+        placeholder="Código postal">
+      </b-input>
+    </b-field>
+    <b-field label="Número de personas que viven en el hogar: ">
+      <b-input
+        type="text"
+        v-model="noPersonasHogar"
+        placeholder="Número de personas que viven en el hogar">
+      </b-input>
+    </b-field>
+    <b-field label="Edad del jefe de familia: ">
+      <b-input
+        type="text"
+        v-model="edadGfeFam"
+        placeholder="Edad jefe de familia">
+      </b-input>
+    </b-field>
+    <br>
+    <b-button class="is-info">
+      Enviar formulario
+    </b-button>
+    <br><br><br><br><br><br>
   </section>
 </template>
 
 <script>
-export default {}
+export default {
+  data () {
+    return {
+      nombre: '',
+      ocupacion: '',
+      direccion: '',
+      codigoPostal: null,
+      noPersonasHogar: null,
+      edadGfeFam: null
+    }
+  }
+}
 </script>

From c897295b53b5889a16c30ffa6c27721b92e58024 Mon Sep 17 00:00:00 2001
From: mxrco <yosoymarco3@gmail.com>
Date: Thu, 19 Nov 2020 16:21:02 -0600
Subject: [PATCH 5/7] regresar/localstorage

---
 components/admin/servicio/programa/tablaResponsables.vue | 2 +-
 pages/admin/programa/index.vue                           | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/components/admin/servicio/programa/tablaResponsables.vue b/components/admin/servicio/programa/tablaResponsables.vue
index aa12468..a576070 100644
--- a/components/admin/servicio/programa/tablaResponsables.vue
+++ b/components/admin/servicio/programa/tablaResponsables.vue
@@ -208,7 +208,7 @@ export default {
   },
   methods: {
     verRegistro (idResponsable) {
-      window.localStorage.setItem('idResponsable', idResponsable)
+      localStorage.setItem('idResponsable', idResponsable)
       this.$router.push('/programa/responsableinfo')
       console.log(idResponsable)
     },
diff --git a/pages/admin/programa/index.vue b/pages/admin/programa/index.vue
index 475375c..81cf115 100644
--- a/pages/admin/programa/index.vue
+++ b/pages/admin/programa/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <p class="is-size-2 mb-5">Programas de Servicio Social</p>
-    <b-button class="is-info">Regresar</b-button>
+    <b-button class="is-info" @click="regresar()">Regresar</b-button>
     <TablaResponsables />
   </div>
 </template>
@@ -11,6 +11,12 @@ import tablaResponsables from '../../../components/admin/servicio/programa/tabla
 export default {
   components: {
     tablaResponsables
+  },
+  methods: {
+    regresar () {
+      localStorage.removeItem('idRegistro')
+      this.$router.push('./')
+    }
   }
 }
 </script>

From b174d80b77bbc31859cf500e71d4396d58bfc17b Mon Sep 17 00:00:00 2001
From: casnet1 <ne.castillo1607@gmail.com>
Date: Fri, 20 Nov 2020 14:31:23 -0600
Subject: [PATCH 6/7] vistas de usuario y boton a responsable

---
 components/alumno/DataAlumno.vue  | 258 ++++++++++++++++++++++++++++++
 components/alumno/ejemplo.vue     |   9 --
 pages/alumno/index.vue            |   7 +-
 pages/responsable/nuevo/index.vue |  74 ++++++---
 4 files changed, 314 insertions(+), 34 deletions(-)
 create mode 100644 components/alumno/DataAlumno.vue
 delete mode 100644 components/alumno/ejemplo.vue

diff --git a/components/alumno/DataAlumno.vue b/components/alumno/DataAlumno.vue
new file mode 100644
index 0000000..390733e
--- /dev/null
+++ b/components/alumno/DataAlumno.vue
@@ -0,0 +1,258 @@
+<template>
+  <section>
+    <div class="container px-3">
+      <div class="progressBar my-6">
+            <b-steps type="is-success" size="is-large" :has-navigation="false" v-model="activeStep">
+              <b-step-item label="Pre Registro" icon="account-plus"></b-step-item>
+              <b-step-item label="Registro" icon="account-clock"></b-step-item>
+              <b-step-item label="Registro Validado" icon="account"></b-step-item>
+              <b-step-item label="Pre Termino" icon="account-details"></b-step-item>
+              <b-step-item label="Termino" icon="account-clock"></b-step-item>
+              <b-step-item label="Liberacion" icon="account-check"></b-step-item>
+            </b-steps>
+      </div>
+
+      <div  class="info" >
+          <div class="info-programa">
+          <h3 class="title is-3">Información del programa</h3>
+          <p><strong> Nombre: </strong> {{ alumno.nombre }} </p>
+          <p><strong> Número de cuenta: </strong> {{ alumno.cuenta }}</p>
+          <p><strong> Carrera: </strong> {{ alumno.carrera }}</p>
+          <p><strong> Correo: </strong> {{ alumno.correo }}</p>
+          </div>
+          <div class="info-alumno mt-6">
+          <h3 class="title is-3">Información del alumno</h3>
+          <p><strong> Nombre: </strong> {{ alumno.nombre }} </p>
+          <p><strong> Número de cuenta: </strong> {{ alumno.cuenta }}</p>
+          <p><strong> Carrera: </strong> {{ alumno.carrera }}</p>
+          <p><strong> Correo: </strong> {{ alumno.correo }}</p>
+
+          <div class="mt-4 info-extra" v-if="activeStep >= 2">
+            <p><strong> Direccion: </strong> {{ alumno.direccion }}</p>
+            <p><strong> Telefono: </strong> {{ alumno.telefono }}</p>
+            <p><strong> Fecha de nacimiento: </strong> {{ alumno.nacimiento }}</p>
+          </div>
+          </div>
+
+      </div>
+
+      <div class="registro" v-if="activeStep==1">
+      <h3 class="title is-3 my-5">Formulario Pre-registro</h3>
+          <form >
+            <b-field label="Fecha de nacimiento">
+                      <b-datepicker
+                        placeholder="Inicio"
+                        icon="calendar-today"
+                        v-model="nacimiento"
+                        >
+                      </b-datepicker>
+            </b-field>
+
+            <b-field label="Telefono">
+                <b-input placeholder="Telefono" maxlength="10" v-model="telefono" type="tel" >
+                </b-input>
+            </b-field>
+
+            <b-field label="Direccion">
+              <b-input maxlength="200 " placeholder="Direccion" type="textarea" v-model="direccion"></b-input>
+            </b-field>
+
+          </form>
+           <div class="my-4 mb-6">
+           <b-field >
+                <button
+                :disabled="nacimiento=='' || telefono=='' || direccion==''"
+                class="button is-success is-medium"
+                @click="open"
+                >
+                    Enviar
+                </button>
+              </b-field>
+              </div>
+
+      </div>
+
+      <div class="registro-validado"  v-if="activeStep==2">
+        <p class="mensaje">
+         <span class="block is-size-5"> Estimado alumno(a): </span> <br> <br>
+          Te informamos que la dependencia en donde decidiste realizar tu servicio social ya validó tu registro.
+
+        </p>
+      </div>
+
+      <div class="pre-termino" v-if="activeStep==3">
+        <h3 class="title is-4 mt-6">Cuestionario de evaluación del programa de servicio social</h3>
+        <div class=" my-6" v-if="alumno.cuestionario==false">
+          <b-button tag="router-link"
+            to="/alumno/cuestionario"
+            type="is-info is-light "
+            icon-left="book-open"
+            class="border-info"
+            size="is-medium"
+            >
+              cuestionario
+          </b-button>
+        </div>
+        <div class="is-flex " v-else>
+          <p class="block is-size-5">Cuestionario contestado </p>
+          <b-icon
+              icon="check-bold"
+              size="is-small"
+              type="is-success">
+          </b-icon>
+        </div>
+
+        <h3 class="title is-4 mt-6">Informe global de actividades (en formato .PDF. No se aceptan fotos).</h3>
+        <div v-if="alumno.informe==false">
+        <b-field>
+          <b-upload v-model="file" drag-drop expanded accept="application/pdf">
+            <section class="section">
+              <div class="content has-text-centered">
+                <p>
+                  <b-icon icon="upload" size="is-large"></b-icon>
+                </p>
+                <p>{{ file.name || "Arrastra aquí tu archivo o da click para buscar"}}</p>
+              </div>
+            </section>
+          </b-upload>
+
+        </b-field>
+         <b-field class="derecha">
+                <button :disabled='file == ""'
+                class="button is-success is-medium mb-4"
+                @click="open"
+                style="float: right;">
+                    Enviar
+                </button>
+              </b-field>
+        </div>
+        <div class="is-flex " v-else>
+          <p class="block is-size-5">Informe contestado </p>
+          <b-icon
+              icon="check-bold"
+              size="is-small"
+              type="is-success">
+          </b-icon>
+        </div>
+
+        <p class="mensaje has-text-justified">
+        <span class="block is-size-5">Estimado alumno(a): </span><br><br>
+        Te informamos que el Área de Registro y Control de Servicio Social ha validado tu solicitud de registro de servicio social por lo que el siguiente trámite lo realizarás hasta que concluyas 480 horas en un periodo de mínimo 6 meses y obtengas tu carta de término por parte de la institución, quien se encargará de subir dicho archivo a este sistema, además de responder un cuestionario sobre tu desempeño. A su vez, deberás responder el siguiente cuestionario de evaluación del programa de servicio social en donde participaste y enviar el informe global de actividades elaborado por ti, con firma y sello de visto bueno de tu jefe inmediato. En cuanto el Área de Registro y Control de Servicio Social valide tu solicitud, podrás revisar las indicaciones del siguiente paso en el panel llamado “Liberación” Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 14:00 hrs. y de 16:00 a 20:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@acatlan.unam.mx
+        </p>
+      </div>
+
+      <div class="termino" v-if="activeStep==4">
+
+      <p class="mensaje has-text-justified">
+        <span class="block is-size-5">Estimado alumno(a): </span><br><br>
+Espera a que tus documentos sean validados por el Departamento
+      de Servicio Social y Bolsa de Trabajo
+        </p>
+      </div>
+
+      <div class="Liberacion" v-if="activeStep==5">
+      <p></p>
+
+      <p>
+      </p>
+        <p class="mensaje has-text-justified">
+        <span class="block is-size-5">Estimado alumno(a): </span><br><br>
+Te confirmamos que has concluido con los trámites necesarios para la liberación de tu servicio social por lo que ahora sólo queda esperar a que en máximo 15 días hábiles se te notifique por correo electrónico a partir de cuándo puedes recoger la copia de tu carta de liberación en las ventanillas del Área de Registro y Control de Servicio Social.
+<br>
+ Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 13:00 hrs. y de 16:00 a 19:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@apolo.acatlan.unam.mx
+        </p>
+
+      </div>
+
+    <!--   <pre class="my-6">{{$data}}</pre> -->
+    </div>
+  </section>
+</template>
+
+<script>
+
+export default {
+  data () {
+    return {
+      activeStep: 1,
+      file: [],
+      nacimiento: '',
+      telefono: '',
+      direccion: '',
+      alumno: {
+        carrera: 'Matematicas Aplicadas',
+        nombre: 'Jose Jose Lopez Lopez',
+        cuenta: '123456789',
+        correo: 'ejmplo@eje.com',
+        direccion: 'avenida 21 estado de mexico',
+        nacimiento: [],
+        telefono: '5511223344',
+        cuestionario: true,
+        informe: true
+
+      }
+    }
+  },
+  methods: {
+    open () {
+      const loadingComponent = this.$buefy.loading.open({
+        container: this.isFullPage ? null : this.$refs.element.$el
+      })
+      setTimeout(() => loadingComponent.close(), 3 * 1000)
+    }
+  },
+  computed: {
+    baseSteps () {
+      return [
+        {
+          label: 'Pictures',
+          content: 'Pictures: Lorem ipsum dolor sit amet.',
+          displayed: true
+        },
+        {
+          label: 'Music',
+          content: 'Music: Lorem ipsum dolor sit amet.',
+          displayed: this.showMusic
+        },
+        {
+          label: 'Games',
+          content: 'Games: Lorem ipsum dolor sit amet.',
+          displayed: true,
+          visible: this.showGames
+        },
+        {
+          label: 'Videos',
+          content: 'Videos: Lorem ipsum dolor sit amet.',
+          displayed: true
+        }
+      ]
+    },
+    steps () {
+      const steps = [...this.baseSteps]
+      return steps
+    }
+  }
+
+}
+</script>
+
+<style scoped>
+.border-info{
+  border: 1px solid #167df0 ;
+}
+.info-alumno p{
+  margin-bottom: .8rem;
+
+}
+.info-programa p{
+  margin-bottom: .8rem;
+
+}
+.mensaje{
+  margin: 3.5rem 0;
+}
+.else{
+  display: flex;
+  align-content: center !important;
+}
+</style>
diff --git a/components/alumno/ejemplo.vue b/components/alumno/ejemplo.vue
deleted file mode 100644
index 014129f..0000000
--- a/components/alumno/ejemplo.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <section>
-    hola
-  </section>
-</template>
-
-<script>
-export default {}
-</script>
diff --git a/pages/alumno/index.vue b/pages/alumno/index.vue
index 014129f..bc6507d 100644
--- a/pages/alumno/index.vue
+++ b/pages/alumno/index.vue
@@ -1,9 +1,12 @@
 <template>
   <section>
-    hola
+    <DataAlumno />
   </section>
 </template>
 
 <script>
-export default {}
+import DataAlumno from '../../components/alumno/DataAlumno'
+export default {
+  components: { DataAlumno }
+}
 </script>
diff --git a/pages/responsable/nuevo/index.vue b/pages/responsable/nuevo/index.vue
index 755ce19..04c09d1 100644
--- a/pages/responsable/nuevo/index.vue
+++ b/pages/responsable/nuevo/index.vue
@@ -1,17 +1,27 @@
 <template>
   <div class="container">
   <div class="columns is-mobile">
-    <div class="column column is-12">
-      <section class="mensaje has-text-justified is-size-6-desktop is-size-6-widescreen is-size-5-fullhd">
-        <p class="block">Estimado(a) responsable de programa de servicio social:</p>
+    <div class="column ">
 
-        <p class="block is-size-7">
+      <b-button tag="router-link"
+                to="/responsable"
+                type="is-info is-light "
+                icon-left="arrow-left-box"
+                class="border-info my-5"
+                >
+                regresar
+      </b-button>
+
+      <section class="mensaje has-text-justified is-size-6 ">
+        <p class="block is-size-5">Estimado(a) responsable de programa de servicio social:</p>
+
+        <p class="block ">
           Te solicitamos llenar cuidadosamente los campos solicitados a continuación
           para iniciar el trámite de registro de servicio social de nuestro
           alumno(a), quien a su vez completará posteriormente el proceso en este
           mismo sistema con otros datos.
         </p>
-        <p class="block is-size-7">
+        <p class="block ">
           Es muy importante escribir correctamente el correo del alumno para que el
           sistema pueda enviarle la notificación correspondiente de que ya puede
           ingresar a completar su registro. También debes tomar en cuenta que la
@@ -27,13 +37,13 @@
       </section>
 
       <section>
-        <h1 class="title is-1 mt-6">
+        <h1 class="title is-1  titleAnadir">
           Añadir Servicio Social
         </h1>
           <div class="columns is-variable is-1-mobile is-0-tablet is-3-desktop is-8-widescreen is-2-fullhd pl-0">
             <div class="column  pl-0">
             <form>
-              <b-field class="column p-0 my-6 is-full">
+              <b-field class="column p-0 my-5 is-full">
                       <input
                       class="input column "
                       v-model="noCuenta"
@@ -41,7 +51,7 @@
                       required="required"
                       maxlength="9" type="number"
                       placeholder="Cuenta"
-                      min="0"></input>
+                      min="0" />
 
                       <p class="control">
                         <b-button class="button is-info" @click=" simple()">Buscar</b-button>
@@ -75,21 +85,21 @@
                 <div class="input">{{ programaSelected.institucion }}</div>
               </b-field>
 
-                <b-field label="Dendencia">
+              <b-field label="Dendencia">
                 <div class="input">{{ programaSelected.dependencia }}</div>
               </b-field>
 
-                <b-field label="Clave del programa">
+              <b-field label="Clave del programa">
                 <div class="input">{{ programaSelected.clave }}</div>
               </b-field>
 
               <b-field label="Fecha de inicio">
-        <b-datepicker
-          placeholder="Inicio"
-          icon="calendar-today"
-          v-model="dataSend.inicio[0]"
-          :min-date="minDate1">
-        </b-datepicker>
+                <b-datepicker
+                  placeholder="Inicio"
+                  icon="calendar-today"
+                  v-model="dataSend.inicio[0]"
+                  :min-date="minDate1">
+                </b-datepicker>
               </b-field>
 
               <b-field label="Fecha de fin" v-if="dataSend.inicio">
@@ -121,12 +131,27 @@
               </b-field>
 
             </form>
-           <b-field class="derecha">
-              <button :disabled='dataSend.file == "" || noCuenta == "" || dataSend.correo == "" ||  dataSend.inicio == "" || dataSend.fin == ""  ' class="button is-success is-medium" @click="open" style="float: right; margin:2rem 0;">
-                  Enviar
-              </button>
-            </b-field>
+            <div class="my-6">
+              <b-button tag="router-link"
+                  to="/responsable"
+                  type="is-info is-light "
+                  icon-left="arrow-left-box"
+                  class="border-info"
+                   style="float: left;"
+                  size="is-medium"
+                  >
+                  regresar
+              </b-button>
 
+              <b-field class="derecha">
+                <button :disabled='dataSend.file == "" || noCuenta == "" || dataSend.correo == "" ||  dataSend.inicio == "" || dataSend.fin == ""'
+                class="button is-success is-medium"
+                @click="open"
+                style="float: right;">
+                    Enviar
+                </button>
+              </b-field>
+            </div>
             </div>
           </div>
 
@@ -264,8 +289,8 @@ export default {
 </script>
 
 <style scoped>
-.mensaje,pre{
-  margin: 4rem 0;
+.titleAnadir,pre{
+  margin: 4rem 0 0rem 0;
 }
 .enviar{
   display: flex;
@@ -281,5 +306,8 @@ export default {
 .columns{
   margin: 0;
 }
+.border-info{
+  border: 1px solid #167df0 ;
+}
 
 </style>

From fc763393912b6e214191e2021c4547246f2b1d8b Mon Sep 17 00:00:00 2001
From: casnet1 <ne.castillo1607@gmail.com>
Date: Mon, 23 Nov 2020 15:03:03 -0600
Subject: [PATCH 7/7] nuxt.config api y vistas alumno

---
 components/alumno/DataAlumno.vue | 24 +++++++++++++++---------
 nuxt.config.js                   |  6 ++++++
 2 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/components/alumno/DataAlumno.vue b/components/alumno/DataAlumno.vue
index fe8c60c..7f3691e 100644
--- a/components/alumno/DataAlumno.vue
+++ b/components/alumno/DataAlumno.vue
@@ -15,10 +15,10 @@
       <div  class="info" >
           <div class="info-programa">
           <h3 class="title is-3">Información del programa</h3>
-          <p><strong> Nombre: </strong> {{ alumno.nombre }} </p>
-          <p><strong> Número de cuenta: </strong> {{ alumno.cuenta }}</p>
-          <p><strong> Carrera: </strong> {{ alumno.carrera }}</p>
-          <p><strong> Correo: </strong> {{ alumno.correo }}</p>
+          <p><strong> Programa: </strong> {{ programa.nombre }} </p>
+          <p><strong> Institución: </strong> {{ programa.institucion }}</p>
+          <p><strong> Dependencia: </strong> {{ programa.dependencia }}</p>
+          <p><strong> Clave del programa: </strong> {{ programa.clave }}</p>
           </div>
           <div class="info-alumno mt-6">
           <h3 class="title is-3">Información del alumno</h3>
@@ -104,8 +104,8 @@
 
         <h3 class="title is-4 mt-6">Informe global de actividades (en formato .PDF. No se aceptan fotos).</h3>
         <div v-if="alumno.informe==false">
-        <b-field>
-          <b-upload v-model="file" drag-drop expanded accept="application/pdf">
+        <b-field type="black">
+          <b-upload v-model="file" type="black" drag-drop expanded accept="application/pdf">
             <section class="section">
               <div class="content has-text-centered">
                 <p>
@@ -174,7 +174,7 @@ Te confirmamos que has concluido con los trámites necesarios para la liberació
 export default {
   data () {
     return {
-      activeStep: 3,
+      activeStep: 1,
       file: [],
       nacimiento: '',
       telefono: '',
@@ -185,11 +185,17 @@ export default {
         cuenta: '123456789',
         correo: 'ejmplo@eje.com',
         direccion: 'avenida 21 estado de mexico',
-        nacimiento: [],
+        nacimiento: "16/04/2000",
         telefono: '5511223344',
-        cuestionario: false,
+        cuestionario: true,
         informe: true
 
+      },
+      programa:{
+        nombre: 'programa 1',
+        institucion: 'institucion 1',
+        dependencia: 'dependecia 1',
+        clave: '023'
       }
     }
   },
diff --git a/nuxt.config.js b/nuxt.config.js
index b5b0d19..ea3e28c 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -49,5 +49,11 @@ export default {
 
   // Build Configuration (https://go.nuxtjs.dev/config-build)
   build: {
+  },
+  env: {
+    api: 'http://localhost:3000'
+    //api: 'https://5b3a8798f24a.ngrok.io'
+    //api: 'https//venus.acatlan.unam.mx/pruebas_pcpuma'
   }
+
 }