From e11810dc557e1bf9508a8bcf1e225f2e96e13ad0 Mon Sep 17 00:00:00 2001
From: eithan <ne.castillo1607@gmail.com>
Date: Tue, 12 Jan 2021 00:44:21 -0600
Subject: [PATCH] cuestionario a componentes y barrra lateral de estatus de
 error borrada

---
 components/alumno/cuestionario/A.vue          |   82 ++
 components/alumno/cuestionario/B.vue          |   98 ++
 components/alumno/cuestionario/C.vue          |  257 ++++
 components/alumno/cuestionario/D.vue          |  201 ++++
 components/alumno/cuestionario/E.vue          |  116 ++
 components/alumno/cuestionario/F.vue          |  267 +++++
 components/alumno/cuestionario/navCues.vue    |  178 +++
 components/alumno/steps.vue                   |    8 +
 components/responsable/formServicioSocial.vue |    4 +-
 pages/alumno/cuestionario/index.vue           | 1045 ++---------------
 10 files changed, 1288 insertions(+), 968 deletions(-)
 create mode 100644 components/alumno/cuestionario/A.vue
 create mode 100644 components/alumno/cuestionario/B.vue
 create mode 100644 components/alumno/cuestionario/C.vue
 create mode 100644 components/alumno/cuestionario/D.vue
 create mode 100644 components/alumno/cuestionario/E.vue
 create mode 100644 components/alumno/cuestionario/F.vue
 create mode 100644 components/alumno/cuestionario/navCues.vue

diff --git a/components/alumno/cuestionario/A.vue b/components/alumno/cuestionario/A.vue
new file mode 100644
index 0000000..a84128d
--- /dev/null
+++ b/components/alumno/cuestionario/A.vue
@@ -0,0 +1,82 @@
+<template>
+  <div class="A apartado" >
+        <p class="is-size-3">A.DATOS GENERALES</p>
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>Sexo</p>
+          <b-radio v-model="answers.sexo" native-value="f" type="is-info"  >
+            F
+          </b-radio>
+          <b-radio v-model="answers.sexo" native-value="m" type="is-info" >
+            M
+          </b-radio>
+        </div>
+        <b-field label="Edad">
+          <b-input
+            placeholder="Edad"
+            v-model="answers.edad"
+            type="number"
+            min="10"
+            max="80"
+            step="1"
+          >
+          </b-input>
+        </b-field>
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>¿Cuentas con algún servicio médico?</p>
+          <div v-for="Sm in servicioMedicoOptions" :key="Sm" class="SINO">
+            <b-radio
+              v-model="answers.servicioMedicoAux"
+              :native-value="Sm"
+              type="is-info"
+            >
+              {{ Sm }}
+            </b-radio>
+          </div>
+
+          <b-field>
+            <b-input
+              placeholder="Otro servicio medico"
+              :disabled="answers.servicioMedicoAux !== 'Otro'"
+              v-model="answers.servicioMedicoOtro"
+            ></b-input>
+          </b-field>
+        </div>
+      </div>  
+</template>
+<script>
+export default {
+     
+     data(){
+        return{
+            answers:{
+        sexo: "",
+        edad: "",
+        servicioMedico: "",
+        servicioMedicoOtro: "",
+        servicioMedicoAux: ""
+            },
+            servicioMedicoOptions: ["IMSS", "ISSSTE", "Ninguno", "Otro"]
+        }
+     },
+     
+     watch: {
+    "answers.servicioMedicoAux"() {
+        
+      this.answers.servicioMedicoOtro = "";
+      this.answers.servicioMedico = this.answers.servicioMedicoAux;
+    },
+    "answers.servicioMedicoOtro"() {
+      this.answers.servicioMedico = this.answers.servicioMedicoOtro;
+    },
+   "answers.sexo"(){
+     this.$emit('childAToParent', this.answers)
+    },
+    "answers.edad"(){
+      this.$emit('childAToParent', this.answers)
+    },
+   "answers.servicioMedico" (){
+      this.$emit('childAToParent', this.answers)
+    }
+  }
+}
+</script>
diff --git a/components/alumno/cuestionario/B.vue b/components/alumno/cuestionario/B.vue
new file mode 100644
index 0000000..0c5f52e
--- /dev/null
+++ b/components/alumno/cuestionario/B.vue
@@ -0,0 +1,98 @@
+<template>
+     <div class="B apartado" >
+        <p class="is-size-3">B.INFORMACIÓN GENERAL SOBRE EL SERVICIO SOCIAL</p>
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>1.¿Conoces el reglamento de servicio social vigente de la UNAM?</p>
+
+          <b-radio v-model="answers.p1" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p1" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            2.¿Conoces la normatividad vigente del servicio social de tu escuela
+            o facultad?
+          </p>
+          <b-radio v-model="answers.p2" native-value="true" type="is-info">
+            Si
+          </b-radio>
+          <b-radio v-model="answers.p2" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+        <div class="field">
+          <p>
+            3.Señala los tres principales criterios que utilizaste para
+            seleccionar el programa de servicio social:
+          </p>
+          <div v-for="(b3, index) in b3Options" :key="b3" class="SINO">
+            <input
+              class="checkb"
+              type="checkbox"
+              :value="index"
+              v-model="answers.p3"
+              :disabled="
+                (answers.p3).length >= 3 || ((answers.p3).length >= 2 && answers.p3Otro != '')
+              "
+            />
+            {{ b3 }}
+          </div>
+          <b-field>
+            <b-input
+              :disabled="(answers.p3) >= 3"
+              placeholder="Otro (especificar)"
+              v-model="answers.p3Otro"
+            ></b-input>
+          </b-field>
+        </div>
+      </div>
+</template>
+
+<script>
+export default {
+     data(){
+        return{
+            answers:{
+              p1: "",
+              p2: "",
+              p3: [], // selecciona 3 opciones
+              p3Otro: "",
+            },
+            b3Options: [
+        "Actividades descritas en el programa",
+        "Apoyo económico",
+        "Asesoría académica",
+        "Dependencia de la UNAM",
+        "Flexibilidad en horarios",
+        "Institución del sector público",
+        "Institucíon del sector social",
+        "Invitación de profesores",
+        "Modalidad de titulación por servicio social",
+        "Objetivos del programa",
+        "Oportunidad de desarrollo de tesis",
+        "Prestigio de la institución",
+        "Recomendación de compañeros",
+      ],
+        }
+     },
+     watch: {
+
+   "answers.p1"(){
+     this.$emit('childBToParent', this.answers)
+    },
+    "answers.p2"(){
+      this.$emit('childBToParent', this.answers)
+    },
+   "answers.p3" (){
+      this.$emit('childBToParent', this.answers)
+    },
+    "answers.p3Otro" (){
+      this.$emit('childBToParent', this.answers)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/alumno/cuestionario/C.vue b/components/alumno/cuestionario/C.vue
new file mode 100644
index 0000000..6e9bb57
--- /dev/null
+++ b/components/alumno/cuestionario/C.vue
@@ -0,0 +1,257 @@
+<template>
+    <div class="C apartado" >
+        <p class="is-size-4">
+          C.INFORMACIÓN SOBRE LAS CONDICIONES PARA LA PRESENTACIÓN DEL SERVICIO
+          SOCIAL EN LA INSTITUCIÓN RECEPTORA
+        </p>
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            4.Al inicio de servicio social recibiste información sobre la
+            normatividad de la institución:
+          </p>
+
+          <b-radio v-model="answers.p4" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p4" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="manyInputs">
+          <p>
+            5.Durante el servicio social, recibiste por parte de los
+            responsables:
+          </p>
+          <table class="table is-fullwidth">
+            <thead>
+              <tr>
+                <th></th>
+                <th>Si</th>
+                <th>No</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr v-for="(c5, index) in c5Options" :key="c5">
+                <td class="td-w">{{ c5 }}</td>
+                <td>
+                  <b-radio
+                    v-model="answers.p5[index]"
+                    native-value="s"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+                <td>
+                  <b-radio
+                    v-model="answers.p5[index]"
+                    native-value="n"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            6.¿las actividades que desarrollaste se realizaron con base en un
+            proyecti de trabajo de la institucion?
+          </p>
+
+          <b-radio v-model="answers.p6" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p6" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            7.¿Contaste con un espacio físico adeacuado para realizar tus
+            actividades?
+          </p>
+          <b-radio v-model="answers.p7" native-value="true" type="is-info">
+            Si
+          </b-radio>
+          <b-radio v-model="answers.p7" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="manyInputs">
+          <p>
+            8.Las instalaciones en las que te desempeñaste, cumplieron con las
+            condiciones de:
+          </p>
+          <table class="table is-fullwidth">
+            <thead>
+              <tr>
+                <th></th>
+                <th>Si</th>
+                <th>No</th>
+              </tr>
+            </thead>
+
+            <tbody>
+              <tr v-for="(c8, index) in c8Options" :key="c8">
+                <td class="td-w">{{ c8 }}</td>
+                <td>
+                  <b-radio
+                    v-model="answers.p8[index]"
+                    native-value="s"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+                <td>
+                  <b-radio
+                    v-model="answers.p8[index]"
+                    native-value="n"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            9.¿Consideras que el entorno donde se ubica la institución es
+            seguro?
+          </p>
+
+          <b-radio v-model="answers.p9" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p9" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            10.¿La institución te proporcionó el material/equipo necesario para
+            el desempeño de tus actividades?
+          </p>
+
+          <b-radio v-model="answers.p10" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p10" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            11.¿El trato que recibiste durante la realización de tu servicio
+            social fue profesional?
+          </p>
+
+          <b-radio v-model="answers.p11" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p11" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            12.¿La institucion te entregó a tiempo la documentación requerida
+            por tu facultad o escuela (carta de inicio, informes, carta de
+            termino)?
+          </p>
+
+          <b-radio v-model="answers.p12" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p12" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            13.¿La institució te dió todas las facilidades para realizar
+            tramites académicos-administrativos ante tu facultad o escuela?
+          </p>
+
+          <b-radio v-model="answers.p13" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p13" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+      </div>
+</template>
+
+<script>
+export default {
+     data(){
+        return{
+            answers:{
+              p4: "",
+        p5: [],
+        p6: "",
+        p7: "",
+        p8: [],
+        p9: "",
+        p10: "",
+        p11: "",
+        p12: "",
+        p13: ""
+            },
+      c5Options: ["ASESORIA", "ACOMPAÑAMIENTO", "SUPERVISION", "SEGUIMIENTO"],
+      c8Options: ["HIGIENE", "SEGURIDAD", "PROTECCIÓN CIVIL"],
+        }
+     },
+     watch: {
+
+   "answers.p4"(){
+     this.$emit('childCToParent', this.answers)
+    },
+    "answers.p5"(){
+      this.$emit('childCToParent', this.answers)
+    },
+   "answers.p6" (){
+      this.$emit('childCToParent', this.answers)
+    },
+    "answers.p7"(){
+     this.$emit('childCToParent', this.answers)
+    },
+    "answers.p8"(){
+      this.$emit('childCToParent', this.answers)
+    },
+   "answers.p9" (){
+      this.$emit('childCToParent', this.answers)
+    },
+    "answers.p10"(){
+     this.$emit('childCToParent', this.answers)
+    },
+    "answers.p11"(){
+      this.$emit('childCToParent', this.answers)
+    },
+   "answers.p12" (){
+      this.$emit('childCToParent', this.answers)
+    },
+    "answers.p13"(){
+     this.$emit('childCToParent', this.answers)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/alumno/cuestionario/D.vue b/components/alumno/cuestionario/D.vue
new file mode 100644
index 0000000..0a87b4a
--- /dev/null
+++ b/components/alumno/cuestionario/D.vue
@@ -0,0 +1,201 @@
+<template>
+    <div class="D apartado" >
+        <p class="is-size-3">
+          D.INFORMACIÓN SOBRE EL PROGRAMA DE SERVICIO SOCIAL
+        </p>
+        <div class="manyInputs">
+          <p>14.De acuerdo con el programa registrado:</p>
+          <table class="table is-fullwidth">
+            <thead>
+              <tr>
+                <th></th>
+                <th>Si</th>
+                <th>No</th>
+              </tr>
+            </thead>
+
+            <tbody>
+              <tr v-for="(d14, index) in d14Options" :key="d14">
+                <td class="td-w">{{ d14 }}</td>
+                <td>
+                  <b-radio
+                    v-model="answers.p14[index]"
+                    native-value="s"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+                <td>
+                  <b-radio
+                    v-model="answers.p14[index]"
+                    native-value="n"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="manyInputs">
+          <p>15.Sobre tu perfil profesional</p>
+          <table class="table is-fullwidth">
+            <thead>
+              <tr>
+                <th></th>
+                <th>Si</th>
+                <th>No</th>
+              </tr>
+            </thead>
+
+            <tbody>
+              <tr v-for="(d15, index) in d15Options" :key="d15">
+                <td class="td-w">{{ d15 }}</td>
+                <td>
+                  <b-radio
+                    v-model="answers.p15[index]"
+                    native-value="s"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+                <td>
+                  <b-radio
+                    v-model="answers.p15[index]"
+                    native-value="n"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            16.De acuerdo al desarrollo del programa en el que participaste en
+            cual de las siguientes áreas lo enmarcas (Elige solo una)
+          </p>
+          <div v-for="(d16, index) in d16Options" :key="d16">
+            <input
+              type="radio"
+              v-model="answers.p16"
+              class="checkb"
+              :value="index"
+              native-value="true"
+            />
+            {{ d16 }}
+          </div>
+        </div>
+
+        <div class="manyInputs">
+          <p>
+            17.¿Quien asesoró y supervisó las actividades que realizaste y con
+            que frecuencia?(Señala con una X la respuesta mas adecuada en el
+            recuadro correspondiente)
+          </p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr v-for="(d17, index) in d17Options" :key="d17">
+                <td class="td-w">{{ d17 }}</td>
+
+                <td>
+                  <b-field>
+                    <b-select
+                      placeholder="Frecuencia"
+                      v-model="answers.p17[index]"
+                    >
+                      <option
+                        v-for="(frec, i) in frecuencia"
+                        :value="i"
+                        :key="frec"
+                      >
+                        {{ frec }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+</template>
+
+<script>
+export default {
+     data(){
+        return{
+            answers:{
+              p14: [],
+        p15: [],
+        p16: "",
+        p17: [],
+            },
+             d14Options: [
+        "Se cumplieron los objetivos señalados",
+        "Se cumplieron las actividades decritas",
+        "Las actividades del programa son congruentes con el objetivo",
+        "Las actividades del programa retribuyen a la sociedad",
+      ],
+      d15Options: [
+        "Aplicaste conocimientos",
+        "Desarrollaste habilidades",
+        "Enriqueciste tus conocimientos",
+        "Fortaleciste tus habilidades",
+      ],
+      d16Options: [
+        "Apoyo administrativo",
+        "Arte, cultura y recreación",
+        "Ciencia, tecnología e innovación",
+        "Derechos humanos, seguridad social y jurídica",
+        "Desarrollo social",
+        "Educación",
+        "Equipamiento e infraestructura urbana y rural",
+        "Medio ambiente y desarrollo sustentable",
+        "Medio de comunicación",
+        "Modernización y automatización de la gestión administrativa",
+        "Salud",
+        "Seguridad alimentaria",
+        "Seguridad energética",
+        "Investigación",
+      ],
+      d17Options: [
+        "Coordinador administrativo del programa",
+        "Responsable directo del programa",
+        "Alguien diferente a los dos anteriores",
+      ],
+
+
+      frecuencia: [
+        "Diario",
+        "Semana",
+        "Quincena",
+        "Mes",
+        "Bimestre",
+        "Trimestre",
+        "Semestre",
+        "No recibí asesoría",
+      ],
+        
+        }
+     },
+     watch: {
+
+   "answers.p14"(){
+     this.$emit('childDToParent', this.answers)
+    },
+    "answers.p15"(){
+      this.$emit('childDToParent', this.answers)
+    },
+   "answers.p16" (){
+      this.$emit('childDToParent', this.answers)
+    },
+    "answers.p17" (){
+      this.$emit('childDToParent', this.answers)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/alumno/cuestionario/E.vue b/components/alumno/cuestionario/E.vue
new file mode 100644
index 0000000..3177f89
--- /dev/null
+++ b/components/alumno/cuestionario/E.vue
@@ -0,0 +1,116 @@
+<template>
+    <div class="E apartado" >
+        <p class="is-size-3">E.APOYOS</p>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            18.¿El programa en el que participaste ofrece apoyos académicos?
+          </p>
+
+          <b-radio v-model="answers.p18" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p18" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>19.¿El programa en el que participaste ofrece seguro de vida?</p>
+
+          <b-radio v-model="answers.p19" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p19" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>20.¿El programa en el que participaste ofrece apoyo económico?</p>
+
+          <b-radio v-model="answers.p20" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p20" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="manyInputs">
+          <p>21.Los apoyos económicos señalados en el programa:</p>
+          <table class="table is-fullwidth">
+            <thead>
+              <tr>
+                <th class="td-w"></th>
+                <th>Si</th>
+                <th>No</th>
+              </tr>
+            </thead>
+
+            <tbody>
+              <tr v-for="(e21, index) in e21Options" :key="e21">
+                <td class="td-w">{{ e21 }}</td>
+                <td>
+                  <b-radio
+                    v-model="answers.p21[index]"
+                    native-value="s"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+                <td>
+                  <b-radio
+                    v-model="answers.p21[index]"
+                    native-value="n"
+                    type="is-info"
+                  >
+                  </b-radio>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+</template>
+
+<script>
+export default {
+     data(){
+        return{
+            answers:{
+               p18: "",
+        p19: "",
+        p20: "",
+        p21: [],
+            },
+           e21Options: [
+        "Te fueron otorgados en tiempo y forma",
+        "Fueron condicionados",
+        `Hubo procedimientos transparentes
+            en la asignación y entrega`,
+        "Se te proporcionó sólo una parte",
+        "No se te proporcionó el apoyo",
+      ],
+        }
+     },
+     watch: {
+
+   "answers.p18"(){
+     this.$emit('childEToParent', this.answers)
+    },
+    "answers.p19"(){
+      this.$emit('childEToParent', this.answers)
+    },
+   "answers.p20" (){
+      this.$emit('childEToParent', this.answers)
+    },
+    "answers.p21" (){
+      this.$emit('childEToParent', this.answers)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/alumno/cuestionario/F.vue b/components/alumno/cuestionario/F.vue
new file mode 100644
index 0000000..a97b928
--- /dev/null
+++ b/components/alumno/cuestionario/F.vue
@@ -0,0 +1,267 @@
+<template>
+    <div class="F apartado" >
+        <p class="is-size-3">F.EXPERIENCIA</p>
+
+        <div class="manyInputs">
+          <p>
+            22.Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
+            mayor valor) cada uno de los siguientes aspectos
+          </p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr v-for="(f22, index) in f22Options" :key="f22">
+                <td class="td-w">{{ f22 }}</td>
+
+                <td>
+                  <b-field>
+                    <b-select
+                      placeholder="Seleccionar"
+                      v-model="answers.p22[index]"
+                    >
+                      <option v-for="i in 10" :key="i" :value="i">
+                        {{ i }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="manyInputs">
+          <p>23.Consideras que el servicio social es:</p>
+          <p>
+            Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
+            mayor valor) cada uno de los siguientes aspectos
+          </p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr v-for="(f23, index) in f23Options" :key="f23">
+                <td class="td-w">{{ f23 }}</td>
+
+                <td>
+                  <b-field>
+                    <b-select
+                      placeholder="Seleccionar"
+                      v-model="answers.p23[index]"
+                    >
+                      <option v-for="i in 10" :key="i" :value="i">
+                        {{ i }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="manyInputs">
+          <p>24.Consideras que el servicio social es:</p>
+          <p>
+            Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
+            mayor valor) cada uno de los siguientes aspectos
+          </p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr v-for="(f24, index) in f24Options" :key="f24">
+                <td class="td-w">{{ f24 }}</td>
+
+                <td>
+                  <b-field>
+                    <b-select
+                      placeholder="Seleccionar"
+                      v-model="answers.p24[index]"
+                    >
+                      <option v-for="i in 10" :key="i" :value="i">
+                        {{ i }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>
+            25.¿Retomarías tu experiencia de servicio social para desarrollar tu
+            tesis? (solo si aplica tu caso)
+          </p>
+
+          <b-radio v-model="answers.p25" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p25" native-value="false" type="is-info">
+            No
+          </b-radio>
+        </div>
+
+        <div class="field is-flex is-flex-direction-column SINO">
+          <p>26.¿Recomiendas el programa en el que participaste?</p>
+
+          <b-radio v-model="answers.p26" native-value="true" type="is-info">
+            Si
+          </b-radio>
+
+          <b-radio v-model="answers.p26" native-value="false" type="is-info">
+            No
+          </b-radio>
+          <b-field label="27.¿Por qué?">
+            <b-input placeholder="Opinion" v-model="answers.p27"></b-input>
+          </b-field>
+        </div>
+
+        <div class="manyInputs">
+          <p>28.Con respecto a tu servicio:</p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr>
+                <td class="td-w">
+                  <p>
+                    La información que te proporcionaron sobre los requisitos y
+                    trámites para el servicio social en tu escuela o facultad
+                    fue:
+                  </p>
+                </td>
+                <td>
+                  <b-field>
+                    <b-select placeholder="Seleccionar" v-model="answers.p28">
+                      <option
+                        v-for="(adj, i) in adjetivos"
+                        :key="adj"
+                        :value="i"
+                      >
+                        {{ adj }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="manyInputs">
+          <p>29.Con respecto a la plataforma SIASS web:</p>
+          <table class="table is-fullwidth">
+            <tbody>
+              <tr>
+                <td class="td-w">
+                  <p>
+                    La información que te proporcionaron sobre los programas
+                    fue:
+                  </p>
+                </td>
+                <td>
+                  <b-field>
+                    <b-select placeholder="Seleccionar" v-model="answers.p29">
+                      <option
+                        v-for="(adj, i) in adjetivos"
+                        :key="adj"
+                        :value="i"
+                      >
+                        {{ adj }}
+                      </option>
+                    </b-select>
+                  </b-field>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <b-field
+          label="30.¿Tienes algún comentario u observación respecto al diseño de este documento?"
+        >
+          <b-input placeholder="Respuesta" v-model="answers.p30"></b-input>
+        </b-field>
+
+      
+      </div>
+</template>
+<script>
+export default {
+     data(){
+        return{
+            answers:{
+             p22: [],
+        p23: [],
+        p24: [],
+        p25: "",
+        p26: "",
+        p27: "",
+        p28: null,
+        p29: null,
+        p30: "",
+            },
+          f22Options: [
+        "Alguien diferente a los dos anteriores",
+        "Contribuiste en el logro de los objetivos indicados en el programa",
+        "Adquiriste nuevos conocimientos",
+        "Fortaleciste habilidades",
+        "Obtuviste herramientas para tu inserción en el medio laboral",
+        "Fortaleciste tu formación profesional",
+        "Enriqueciste tu formación personal",
+        "Tu participación en el programa de servicio tuvo impacto social",
+      ],
+      f23Options: [
+        "Un medio para retribuir a la sociedad",
+        "La actividad que permite fortalecer habilidades y destrezas",
+        "El complemento a la formación profesional",
+      ],
+      f24Options: [
+        "Impacto social",
+        "Formación profesional",
+        "Formación personal",
+      ],
+
+      frecuencia: [
+        "Diario",
+        "Semana",
+        "Quincena",
+        "Mes",
+        "Bimestre",
+        "Trimestre",
+        "Semestre",
+        "No recibí asesoría",
+      ],
+      
+      adjetivos: ["muy mala", "mala", "regular", "buena", "excelente"],
+        }
+     },
+     watch: {
+
+   "answers.p22"(){
+     this.$emit('childFToParent', this.answers)
+    },
+    "answers.p23"(){
+      this.$emit('childFToParent', this.answers)
+    },
+   "answers.p24" (){
+      this.$emit('childFToParent', this.answers)
+    },
+    "answers.p25" (){
+      this.$emit('childFToParent', this.answers)
+    },
+    "answers.p26"(){
+     this.$emit('childFToParent', this.answers)
+    },
+    "answers.p27"(){
+      this.$emit('childFToParent', this.answers)
+    },
+   "answers.p28" (){
+      this.$emit('childFToParent', this.answers)
+    },
+    "answers.p29" (){
+      this.$emit('childFToParent', this.answers)
+    },
+    "answers.p30" (){
+      this.$emit('childFToParent', this.answers)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/alumno/cuestionario/navCues.vue b/components/alumno/cuestionario/navCues.vue
new file mode 100644
index 0000000..cfc9f99
--- /dev/null
+++ b/components/alumno/cuestionario/navCues.vue
@@ -0,0 +1,178 @@
+<template>
+<div>
+     <div class="my-6 mb-6"  v-if="current2 == 6">
+          <b-field class="centro">
+            <button
+              :disabled="available()"
+              class="button is-success is-medium"
+              @click="enviar()"
+            >
+              Enviar
+            </button>
+          </b-field>
+        </div>
+ 
+      <div class="buttons px-auto is-justify-content-center">
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 1 }"
+          @click="current2 = 1"
+        >
+          A
+        </button>
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 2 }"
+          @click="current2 = 2"
+          :disabled="navB()"
+        >
+          B
+        </button>
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 3 }"
+          @click="current2 = 3"
+          :disabled="navC()"
+        >
+          C
+        </button>
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 4 }"
+          @click="current2 = 4"
+          :disabled="navD()"
+        >
+          D
+        </button>
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 5 }"
+          @click="current2 = 5"
+          :disabled="navE()"
+        >
+          E
+        </button>
+        <button
+          class="navPages button is-info"
+          :class="{ active: current2 == 6 }"
+          @click="current2 = 6"
+          :disabled="navF()"
+        >
+          F
+        </button>
+      </div>
+      </div>
+</template>
+
+<script>
+export default {
+    data(){
+        return{
+        current2: 1
+        }
+    },
+    props:['answers'],
+    methods: {
+
+    navB() {
+      if (
+        this.answers.sexo !== "" &&
+        this.answers.edad !== "" &&
+        this.answers.servicioMedico !== ""
+      )
+        if (
+          this.answers.servicioMedico == "Otro" &&
+          !this.answers.servicioMedicoOtro
+        )
+          return true;
+        else return false;
+      else return true;
+    },
+    navC() {
+      if (
+        this.answers.p1 !== "" &&
+        this.answers.p2 !== "" &&
+        ((this.answers.p3).length == 3 ||
+          ((this.answers.p3).length == 2 && this.answers.p3Otro !== ""))
+      )
+        return false;
+      else return true;
+    },
+    navD() {
+      if (
+        this.answers.p5[0] != null &&
+        this.answers.p5[1] != null &&
+        this.answers.p5[2] != null &&
+        this.answers.p5[3] != null &&
+        this.answers.p8[0] != null &&
+        this.answers.p8[1] != null &&
+        this.answers.p8[2] != null &&
+        this.answers.p4 &&
+        this.answers.p6 &&
+        this.answers.p7 &&
+        this.answers.p9 &&
+        this.answers.p10 &&
+        this.answers.p11 &&
+        this.answers.p12 &&
+        this.answers.p13
+      )
+        return false;
+      else return true;
+    },
+    navE() {
+      if (
+        this.answers.p14[0] != null &&
+        this.answers.p14[1] != null &&
+        this.answers.p14[2] != null &&
+        this.answers.p14[3] != null &&
+        this.answers.p15[0] != null &&
+        this.answers.p15[1] != null &&
+        this.answers.p15[2] != null &&
+        this.answers.p15[3] != null &&
+        this.answers.p17.length == 3 &&
+        this.answers.p16 != null
+      )
+        return false;
+      else return true;
+    },
+    navF() {
+      if (
+        this.answers.p19 &&
+        this.answers.p18 &&
+        this.answers.p20 &&
+        this.answers.p21[0] != null &&
+        this.answers.p21[1] != null &&
+        this.answers.p21[2] != null &&
+        this.answers.p21[3] != null &&
+        this.answers.p21[4] != null
+      )
+        return false;
+      else return true;
+    },
+    available() {
+      if (
+        this.answers.p22.length == 8 &&
+        this.answers.p23.length == 3 &&
+        this.answers.p24.length == 3 &&
+        this.answers.p25 &&
+        this.answers.p26 &&
+        this.answers.p27 &&
+        this.answers.p28 !== null &&
+        this.answers.p29 !== null &&
+        this.answers.p30
+      )
+        return false;
+      // activar boton
+      else return true;
+    },
+    enviar(){
+        this.$parent.enviarCuestionario()
+    }
+},
+watch:{
+    current2 (){
+        this.$emit('childNAVToParent', this.current2)
+    }
+}
+}
+</script>
diff --git a/components/alumno/steps.vue b/components/alumno/steps.vue
index 985dcc9..ef1ea6b 100644
--- a/components/alumno/steps.vue
+++ b/components/alumno/steps.vue
@@ -85,5 +85,13 @@ export default {
     return {};
   },
   props: ["activeStep"],
+  
 };
 </script>
+<style >
+.b-steps .steps .step-items .step-item.is-danger::before, .b-steps .steps .step-items .step-item.is-danger::after{
+  display: none !important;
+  content: none !important;
+
+}
+</style>
diff --git a/components/responsable/formServicioSocial.vue b/components/responsable/formServicioSocial.vue
index 51113c9..edd8776 100644
--- a/components/responsable/formServicioSocial.vue
+++ b/components/responsable/formServicioSocial.vue
@@ -153,7 +153,7 @@
             style="float: left;"
             size="is-mediumm"
           >
-            regresar
+            Regresar
           </b-button>
           <!-- <BotonRegresar  :path="'/responsable'" /> -->
 
@@ -457,7 +457,7 @@ export default {
   mounted() {
     axios
       .get(
-        `${process.env.api}/programa?idUsuario=${localStorage.getItem(
+        `${process.env.api}/programa/programas_responsable?idUsuario=${localStorage.getItem(
           "idUsuario"
         )}`,
         this.token
diff --git a/pages/alumno/cuestionario/index.vue b/pages/alumno/cuestionario/index.vue
index ba90051..59769b2 100644
--- a/pages/alumno/cuestionario/index.vue
+++ b/pages/alumno/cuestionario/index.vue
@@ -1,16 +1,7 @@
 <template>
   <section class="container my-5 px-3">
     <div v-if="idCuestionario === 'null'">
-      <b-button
-        tag="router-link"
-        to="/alumno"
-        type="is-info is-light "
-        icon-left="arrow-left-box"
-        class="border-info my-5"
-        size="is-medium"
-      >
-        regresar
-      </b-button>
+      <BotonRegresar :path="'/alumno'" />
       <div class="my-5 mensaje">
         <p class="is-size-2">Evaluación de programas de servicio social</p>
         <p>
@@ -20,749 +11,13 @@
           requisito. Te recordamos qe tus respues son confidenciales.
         </p>
       </div>
-
-      <div class="A apartado" v-if="current == 1">
-        <p class="is-size-3">A.DATOS GENERALES</p>
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>Sexo</p>
-          <b-radio v-model="answers.sexo" native-value="f" type="is-info">
-            F
-          </b-radio>
-          <b-radio v-model="answers.sexo" native-value="m" type="is-info">
-            M
-          </b-radio>
-        </div>
-        <b-field label="Edad">
-          <b-input
-            placeholder="Edad"
-            v-model="answers.edad"
-            type="number"
-            min="10"
-            max="80"
-            step="1"
-          >
-          </b-input>
-        </b-field>
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>¿Cuentas con algún servicio médico?</p>
-          <div v-for="Sm in servicioMedicoOptions" :key="Sm" class="SINO">
-            <b-radio
-              v-model="answers.servicioMedicoAux"
-              :native-value="Sm"
-              type="is-info"
-            >
-              {{ Sm }}
-            </b-radio>
-          </div>
-
-          <b-field>
-            <b-input
-              placeholder="Otro servicio medico"
-              :disabled="answers.servicioMedicoAux !== 'Otro'"
-              v-model="answers.servicioMedicoOtro"
-            ></b-input>
-          </b-field>
-        </div>
-      </div>
-
-      <div class="B apartado" v-if="current == 2">
-        <p class="is-size-3">B.INFORMACIÓN GENERAL SOBRE EL SERVICIO SOCIAL</p>
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>1.¿Conoces el reglamento de servicio social vigente de la UNAM?</p>
-
-          <b-radio v-model="answers.p1" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p1" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            2.¿Conoces la normatividad vigente del servicio social de tu escuela
-            o facultad?
-          </p>
-          <b-radio v-model="answers.p2" native-value="true" type="is-info">
-            Si
-          </b-radio>
-          <b-radio v-model="answers.p2" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-        <div class="field">
-          <p>
-            3.Señala los tres principales criterios que utilizaste para
-            seleccionar el programa de servicio social:
-          </p>
-          <div v-for="(b3, index) in b3Options" :key="b3" class="SINO">
-            <input
-              class="checkb"
-              type="checkbox"
-              :value="index"
-              v-model="answers.p3"
-              :disabled="
-                maxCheckbox >= 3 || (maxCheckbox >= 2 && answers.p3Otro != '')
-              "
-              @change="max()"
-            />
-            {{ b3 }}
-          </div>
-          <b-field>
-            <b-input
-              @change="max()"
-              :disabled="maxCheckbox >= 3"
-              placeholder="Otro (especificar)"
-              v-model="answers.p3Otro"
-            ></b-input>
-          </b-field>
-        </div>
-      </div>
-
-      <div class="C apartado" v-if="current == 3">
-        <p class="is-size-4">
-          C.INFORMACIÓN SOBRE LAS CONDICIONES PARA LA PRESENTACIÓN DEL SERVICIO
-          SOCIAL EN LA INSTITUCIÓN RECEPTORA
-        </p>
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            4.Al inicio de servicio social recibiste información sobre la
-            normatividad de la institución:
-          </p>
-
-          <b-radio v-model="answers.p4" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p4" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="manyInputs">
-          <p>
-            5.Durante el servicio social, recibiste por parte de los
-            responsables:
-          </p>
-          <table class="table is-fullwidth">
-            <thead>
-              <tr>
-                <th></th>
-                <th>Si</th>
-                <th>No</th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr v-for="(c5, index) in c5Options" :key="c5">
-                <td class="td-w">{{ c5 }}</td>
-                <td>
-                  <b-radio
-                    v-model="answers.p5[index]"
-                    native-value="s"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-                <td>
-                  <b-radio
-                    v-model="answers.p5[index]"
-                    native-value="n"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            6.¿las actividades que desarrollaste se realizaron con base en un
-            proyecti de trabajo de la institucion?
-          </p>
-
-          <b-radio v-model="answers.p6" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p6" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            7.¿Contaste con un espacio físico adeacuado para realizar tus
-            actividades?
-          </p>
-          <b-radio v-model="answers.p7" native-value="true" type="is-info">
-            Si
-          </b-radio>
-          <b-radio v-model="answers.p7" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="manyInputs">
-          <p>
-            8.Las instalaciones en las que te desempeñaste, cumplieron con las
-            condiciones de:
-          </p>
-          <table class="table is-fullwidth">
-            <thead>
-              <tr>
-                <th></th>
-                <th>Si</th>
-                <th>No</th>
-              </tr>
-            </thead>
-
-            <tbody>
-              <tr v-for="(c8, index) in c8Options" :key="c8">
-                <td class="td-w">{{ c8 }}</td>
-                <td>
-                  <b-radio
-                    v-model="answers.p8[index]"
-                    native-value="s"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-                <td>
-                  <b-radio
-                    v-model="answers.p8[index]"
-                    native-value="n"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            9.¿Consideras que el entorno donde se ubica la institución es
-            seguro?
-          </p>
-
-          <b-radio v-model="answers.p9" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p9" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            10.¿La institución te proporcionó el material/equipo necesario para
-            el desempeño de tus actividades?
-          </p>
-
-          <b-radio v-model="answers.p10" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p10" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            11.¿El trato que recibiste durante la realización de tu servicio
-            social fue profesional?
-          </p>
-
-          <b-radio v-model="answers.p11" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p11" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            12.¿La institucion te entregó a tiempo la documentación requerida
-            por tu facultad o escuela (carta de inicio, informes, carta de
-            termino)?
-          </p>
-
-          <b-radio v-model="answers.p12" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p12" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            13.¿La institució te dió todas las facilidades para realizar
-            tramites académicos-administrativos ante tu facultad o escuela?
-          </p>
-
-          <b-radio v-model="answers.p13" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p13" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-      </div>
-
-      <div class="D apartado" v-if="current == 4">
-        <p class="is-size-3">
-          D.INFORMACIÓN SOBRE EL PROGRAMA DE SERVICIO SOCIAL
-        </p>
-        <div class="manyInputs">
-          <p>14.De acuerdo con el programa registrado:</p>
-          <table class="table is-fullwidth">
-            <thead>
-              <tr>
-                <th></th>
-                <th>Si</th>
-                <th>No</th>
-              </tr>
-            </thead>
-
-            <tbody>
-              <tr v-for="(d14, index) in d14Options" :key="d14">
-                <td class="td-w">{{ d14 }}</td>
-                <td>
-                  <b-radio
-                    v-model="answers.p14[index]"
-                    native-value="s"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-                <td>
-                  <b-radio
-                    v-model="answers.p14[index]"
-                    native-value="n"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="manyInputs">
-          <p>15.Sobre tu perfil profesional</p>
-          <table class="table is-fullwidth">
-            <thead>
-              <tr>
-                <th></th>
-                <th>Si</th>
-                <th>No</th>
-              </tr>
-            </thead>
-
-            <tbody>
-              <tr v-for="(d15, index) in d15Options" :key="d15">
-                <td class="td-w">{{ d15 }}</td>
-                <td>
-                  <b-radio
-                    v-model="answers.p15[index]"
-                    native-value="s"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-                <td>
-                  <b-radio
-                    v-model="answers.p15[index]"
-                    native-value="n"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            16.De acuerdo al desarrollo del programa en el que participaste en
-            cual de las siguientes áreas lo enmarcas (Elige solo una)
-          </p>
-          <div v-for="(d16, index) in d16Options" :key="d16">
-            <input
-              type="radio"
-              v-model="answers.p16"
-              class="checkb"
-              :value="index"
-              native-value="true"
-            />
-            {{ d16 }}
-          </div>
-        </div>
-
-        <div class="manyInputs">
-          <p>
-            17.¿Quien asesoró y supervisó las actividades que realizaste y con
-            que frecuencia?(Señala con una X la respuesta mas adecuada en el
-            recuadro correspondiente)
-          </p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr v-for="(d17, index) in d17Options" :key="d17">
-                <td class="td-w">{{ d17 }}</td>
-
-                <td>
-                  <b-field>
-                    <b-select
-                      placeholder="Frecuencia"
-                      v-model="answers.p17[index]"
-                    >
-                      <option
-                        v-for="(frec, i) in frecuencia"
-                        :value="i"
-                        :key="frec"
-                      >
-                        {{ frec }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-
-      <div class="E apartado" v-if="current == 5">
-        <p class="is-size-3">E.APOYOS</p>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            18.¿El programa en el que participaste ofrece apoyos académicos?
-          </p>
-
-          <b-radio v-model="answers.p18" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p18" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>19.¿El programa en el que participaste ofrece seguro de vida?</p>
-
-          <b-radio v-model="answers.p19" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p19" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>20.¿El programa en el que participaste ofrece apoyo económico?</p>
-
-          <b-radio v-model="answers.p20" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p20" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="manyInputs">
-          <p>21.Los apoyos económicos señalados en el programa:</p>
-          <table class="table is-fullwidth">
-            <thead>
-              <tr>
-                <th class="td-w"></th>
-                <th>Si</th>
-                <th>No</th>
-              </tr>
-            </thead>
-
-            <tbody>
-              <tr v-for="(e21, index) in e21Options" :key="e21">
-                <td class="td-w">{{ e21 }}</td>
-                <td>
-                  <b-radio
-                    v-model="answers.p21[index]"
-                    native-value="s"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-                <td>
-                  <b-radio
-                    v-model="answers.p21[index]"
-                    native-value="n"
-                    type="is-info"
-                  >
-                  </b-radio>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-
-      <div class="F apartado" v-if="current == 6">
-        <p class="is-size-3">F.EXPERIENCIA</p>
-
-        <div class="manyInputs">
-          <p>
-            22.Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
-            mayor valor) cada uno de los siguientes aspectos
-          </p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr v-for="(f22, index) in f22Options" :key="f22">
-                <td class="td-w">{{ f22 }}</td>
-
-                <td>
-                  <b-field>
-                    <b-select
-                      placeholder="Seleccionar"
-                      v-model="answers.p22[index]"
-                    >
-                      <option v-for="i in 10" :key="i" :value="i">
-                        {{ i }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="manyInputs">
-          <p>23.Consideras que el servicio social es:</p>
-          <p>
-            Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
-            mayor valor) cada uno de los siguientes aspectos
-          </p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr v-for="(f23, index) in f23Options" :key="f23">
-                <td class="td-w">{{ f23 }}</td>
-
-                <td>
-                  <b-field>
-                    <b-select
-                      placeholder="Seleccionar"
-                      v-model="answers.p23[index]"
-                    >
-                      <option v-for="i in 10" :key="i" :value="i">
-                        {{ i }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="manyInputs">
-          <p>24.Consideras que el servicio social es:</p>
-          <p>
-            Califica del 1 al 10 (en donde 1 es el de menor valor y 10 el de
-            mayor valor) cada uno de los siguientes aspectos
-          </p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr v-for="(f24, index) in f24Options" :key="f24">
-                <td class="td-w">{{ f24 }}</td>
-
-                <td>
-                  <b-field>
-                    <b-select
-                      placeholder="Seleccionar"
-                      v-model="answers.p24[index]"
-                    >
-                      <option v-for="i in 10" :key="i" :value="i">
-                        {{ i }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>
-            25.¿Retomarías tu experiencia de servicio social para desarrollar tu
-            tesis? (solo si aplica tu caso)
-          </p>
-
-          <b-radio v-model="answers.p25" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p25" native-value="false" type="is-info">
-            No
-          </b-radio>
-        </div>
-
-        <div class="field is-flex is-flex-direction-column SINO">
-          <p>26.¿Recomiendas el programa en el que participaste?</p>
-
-          <b-radio v-model="answers.p26" native-value="true" type="is-info">
-            Si
-          </b-radio>
-
-          <b-radio v-model="answers.p26" native-value="false" type="is-info">
-            No
-          </b-radio>
-          <b-field label="27.¿Por qué?">
-            <b-input placeholder="Opinion" v-model="answers.p27"></b-input>
-          </b-field>
-        </div>
-
-        <div class="manyInputs">
-          <p>28.Con respecto a tu servicio:</p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr>
-                <td class="td-w">
-                  <p>
-                    La información que te proporcionaron sobre los requisitos y
-                    trámites para el servicio social en tu escuela o facultad
-                    fue:
-                  </p>
-                </td>
-                <td>
-                  <b-field>
-                    <b-select placeholder="Seleccionar" v-model="answers.p28">
-                      <option
-                        v-for="(adj, i) in adjetivos"
-                        :key="adj"
-                        :value="i"
-                      >
-                        {{ adj }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <div class="manyInputs">
-          <p>29.Con respecto a la plataforma SIASS web:</p>
-          <table class="table is-fullwidth">
-            <tbody>
-              <tr>
-                <td class="td-w">
-                  <p>
-                    La información que te proporcionaron sobre los programas
-                    fue:
-                  </p>
-                </td>
-                <td>
-                  <b-field>
-                    <b-select placeholder="Seleccionar" v-model="answers.p29">
-                      <option
-                        v-for="(adj, i) in adjetivos"
-                        :key="adj"
-                        :value="i"
-                      >
-                        {{ adj }}
-                      </option>
-                    </b-select>
-                  </b-field>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-
-        <b-field
-          label="30.¿Tienes algún comentario u observación respecto al diseño de este documento?"
-        >
-          <b-input placeholder="Respuesta" v-model="answers.p30"></b-input>
-        </b-field>
-
-        <div class="my-6 mb-6">
-          <b-field class="centro">
-            <button
-              :disabled="available()"
-              class="button is-success is-medium"
-              @click="enviarCuestionario()"
-            >
-              Enviar
-            </button>
-          </b-field>
-        </div>
-      </div>
-
-      <div class="buttons px-auto is-justify-content-center">
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 1 }"
-          @click="current = 1"
-        >
-          A
-        </button>
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 2 }"
-          @click="current = 2"
-          :disabled="navB()"
-        >
-          B
-        </button>
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 3 }"
-          @click="current = 3"
-          :disabled="navC()"
-        >
-          C
-        </button>
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 4 }"
-          @click="current = 4"
-          :disabled="navD()"
-        >
-          D
-        </button>
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 5 }"
-          @click="current = 5"
-          :disabled="navE()"
-        >
-          E
-        </button>
-        <button
-          class="navPages button is-info"
-          :class="{ active: current == 6 }"
-          @click="current = 6"
-          :disabled="navF()"
-        >
-          F
-        </button>
-      </div>
+      <parteA v-show="current == 1" v-on:childAToParent="onChildA" />
+      <parteB v-show="current == 2" v-on:childBToParent="onChildB" />
+      <parteC v-show="current == 3" v-on:childCToParent="onChildC" />
+      <parteD v-show="current == 4" v-on:childDToParent="onChildD" />
+      <parteE v-show="current == 5" v-on:childEToParent="onChildE" />
+      <parteF v-show="current == 6" v-on:childFToParent="onChildF" />
+      <navCues :answers="answers" v-on:childNAVToParent="onChildNAV" />
     </div>
     <div v-else class="vh">
       <h1>Ya has contestado tu cuestionario :)</h1>
@@ -770,14 +25,33 @@
     <b-loading :is-full-page="true" v-model="isLoading" :can-cancel="false" />
   </section>
 </template>
-
+ 
 <script>
 import Buefy from "buefy";
 import "buefy/dist/buefy.css";
 import moment from "moment";
 import axios from "axios";
 
+import parteA from "../../../components/alumno/cuestionario/A";
+import parteB from "../../../components/alumno/cuestionario/B";
+import parteC from "../../../components/alumno/cuestionario/C";
+import parteD from "../../../components/alumno/cuestionario/D";
+import parteE from "../../../components/alumno/cuestionario/E";
+import parteF from "../../../components/alumno/cuestionario/F";
+import navCues from "../../../components/alumno/cuestionario/navCues";
+import BotonRegresar from "../../../components/botonRegresar";
+
 export default {
+  components: {
+    parteA,
+    parteB,
+    parteC,
+    parteD,
+    parteE,
+    parteF,
+    navCues,
+    BotonRegresar,
+  },
   data() {
     return {
       token: {
@@ -785,7 +59,6 @@ export default {
           token: window.localStorage.getItem("token"),
         },
       },
-      maxCheckbox: 0,
       isLoading: false,
       current: 1,
       idCuestionario: "",
@@ -827,202 +100,57 @@ export default {
         p29: null,
         p30: "",
       },
-      servicioMedicoOptions: ["IMSS", "ISSSTE", "Ninguno", "Otro"],
-
-      b3Options: [
-        "Actividades descritas en el programa",
-        "Apoyo económico",
-        "Asesoría académica",
-        "Dependencia de la UNAM",
-        "Flexibilidad en horarios",
-        "Institución del sector público",
-        "Institucíon del sector social",
-        "Invitación de profesores",
-        "Modalidad de titulación por servicio social",
-        "Objetivos del programa",
-        "Oportunidad de desarrollo de tesis",
-        "Prestigio de la institución",
-        "Recomendación de compañeros",
-      ],
-      c5Options: ["ASESORIA", "ACOMPAÑAMIENTO", "SUPERVISION", "SEGUIMIENTO"],
-      c8Options: ["HIGIENE", "SEGURIDAD", "PROTECCIÓN CIVIL"],
-      d14Options: [
-        "Se cumplieron los objetivos señalados",
-        "Se cumplieron las actividades decritas",
-        "Las actividades del programa son congruentes con el objetivo",
-        "Las actividades del programa retribuyen a la sociedad",
-      ],
-      d15Options: [
-        "Aplicaste conocimientos",
-        "Desarrollaste habilidades",
-        "Enriqueciste tus conocimientos",
-        "Fortaleciste tus habilidades",
-      ],
-      d16Options: [
-        "Apoyo administrativo",
-        "Arte, cultura y recreación",
-        "Ciencia, tecnología e innovación",
-        "Derechos humanos, seguridad social y jurídica",
-        "Desarrollo social",
-        "Educación",
-        "Equipamiento e infraestructura urbana y rural",
-        "Medio ambiente y desarrollo sustentable",
-        "Medio de comunicación",
-        "Modernización y automatización de la gestión administrativa",
-        "Salud",
-        "Seguridad alimentaria",
-        "Seguridad energética",
-        "Investigación",
-      ],
-      d17Options: [
-        "Coordinador administrativo del programa",
-        "Responsable directo del programa",
-        "Alguien diferente a los dos anteriores",
-      ],
-      frecuencia: [
-        "Diario",
-        "Semana",
-        "Quincena",
-        "Mes",
-        "Bimestre",
-        "Trimestre",
-        "Semestre",
-        "No recibí asesoría",
-      ],
-      e21Options: [
-        "Te fueron otorgados en tiempo y forma",
-        "Fueron condicionados",
-        `Hubo procedimientos transparentes
-            en la asignación y entrega`,
-        "Se te proporcionó sólo una parte",
-        "No se te proporcionó el apoyo",
-      ],
-      f22Options: [
-        "Alguien diferente a los dos anteriores",
-        "Contribuiste en el logro de los objetivos indicados en el programa",
-        "Adquiriste nuevos conocimientos",
-        "Fortaleciste habilidades",
-        "Obtuviste herramientas para tu inserción en el medio laboral",
-        "Fortaleciste tu formación profesional",
-        "Enriqueciste tu formación personal",
-        "Tu participación en el programa de servicio tuvo impacto social",
-      ],
-      f23Options: [
-        "Un medio para retribuir a la sociedad",
-        "La actividad que permite fortalecer habilidades y destrezas",
-        "El complemento a la formación profesional",
-      ],
-      f24Options: [
-        "Impacto social",
-        "Formación profesional",
-        "Formación personal",
-      ],
-      adjetivos: ["muy mala", "mala", "regular", "buena", "excelente"],
     };
   },
   methods: {
-    selectAll() {
-      this.userIds = [];
-      let user;
-      if (this.allSelected) {
-        for (user in this.users) {
-          this.userIds.push(this.users[user].id.toString());
-        }
-      }
+    onChildA(value) {
+      this.answers.servicioMedico = value.servicioMedico;
+      this.answers.sexo = value.sexo;
+      this.answers.edad = value.edad;
     },
-    max() {
-      this.maxCheckbox += 1;
+    onChildB(value) {
+      this.answers.p1 = value.p1;
+      this.answers.p2 = value.p2;
+      this.answers.p3 = value.p3;
+      this.answers.p3Otro = value.p3Otro;
     },
-    navB() {
-      if (
-        this.answers.sexo !== "" &&
-        this.answers.edad !== "" &&
-        this.answers.servicioMedico !== ""
-      )
-        if (
-          this.answers.servicioMedico == "Otro" &&
-          !this.answers.servicioMedicoOtro
-        )
-          return true;
-        else return false;
-      else return true;
+    onChildC(value) {
+      this.answers.p4 = value.p4;
+      this.answers.p5 = value.p5;
+      this.answers.p6 = value.p6;
+      this.answers.p7 = value.p7;
+      this.answers.p8 = value.p8;
+      this.answers.p9 = value.p9;
+      this.answers.p10 = value.p10;
+      this.answers.p11 = value.p11;
+      this.answers.p12 = value.p12;
+      this.answers.p13 = value.p13;
     },
-    navC() {
-      if (
-        this.answers.p1 !== "" &&
-        this.answers.p2 !== "" &&
-        (this.maxCheckbox == 3 ||
-          (this.maxCheckbox == 2 && this.answers.p3Otro !== ""))
-      )
-        return false;
-      else return true;
+    onChildD(value) {
+      this.answers.p14 = value.p14;
+      this.answers.p15 = value.p15;
+      this.answers.p16 = value.p16;
+      this.answers.p17 = value.p17;
     },
-    navD() {
-      if (
-        this.answers.p5[0] != null &&
-        this.answers.p5[1] != null &&
-        this.answers.p5[2] != null &&
-        this.answers.p5[3] != null &&
-        this.answers.p8[0] != null &&
-        this.answers.p8[1] != null &&
-        this.answers.p8[2] != null &&
-        this.answers.p4 &&
-        this.answers.p6 &&
-        this.answers.p7 &&
-        this.answers.p9 &&
-        this.answers.p10 &&
-        this.answers.p11 &&
-        this.answers.p12 &&
-        this.answers.p13
-      )
-        return false;
-      else return true;
+    onChildE(value) {
+      this.answers.p18 = value.p18;
+      this.answers.p19 = value.p19;
+      this.answers.p20 = value.p20;
+      this.answers.p21 = value.p21;
     },
-    navE() {
-      if (
-        this.answers.p14[0] != null &&
-        this.answers.p14[1] != null &&
-        this.answers.p14[2] != null &&
-        this.answers.p14[3] != null &&
-        this.answers.p15[0] != null &&
-        this.answers.p15[1] != null &&
-        this.answers.p15[2] != null &&
-        this.answers.p15[3] != null &&
-        this.answers.p17.length == 3 &&
-        this.answers.p16 != null
-      )
-        return false;
-      else return true;
+    onChildF(value) {
+      this.answers.p22 = value.p22;
+      this.answers.p23 = value.p23;
+      this.answers.p24 = value.p24;
+      this.answers.p25 = value.p25;
+      this.answers.p26 = value.p26;
+      this.answers.p27 = value.p27;
+      this.answers.p28 = value.p28;
+      this.answers.p29 = value.p29;
+      this.answers.p30 = value.p30;
     },
-    navF() {
-      if (
-        this.answers.p19 &&
-        this.answers.p18 &&
-        this.answers.p20 &&
-        this.answers.p21[0] != null &&
-        this.answers.p21[1] != null &&
-        this.answers.p21[2] != null &&
-        this.answers.p21[3] != null &&
-        this.answers.p21[4] != null
-      )
-        return false;
-      else return true;
-    },
-    available() {
-      if (
-        this.answers.p22.length == 8 &&
-        this.answers.p23.length == 3 &&
-        this.answers.p24.length == 3 &&
-        this.answers.p25 &&
-        this.answers.p26 &&
-        this.answers.p27 &&
-        this.answers.p28 !== null &&
-        this.answers.p29 !== null &&
-        this.answers.p30
-      )
-        return false;
-      // activar boton
-      else return true;
+    onChildNAV(value) {
+      this.current = value;
     },
     error(msj) {
       let salir = false;
@@ -1060,17 +188,13 @@ export default {
         this.$router.push(`/`);
       }
     },
-
     enviarCuestionario() {
       this.isLoading = true;
-
       if (this.answers.p3Otro != "" && this.maxCheckbox < 3) {
         this.answers.p3.push(this.answers.p3Otro);
       }
-
       const data = {
         idServicio: localStorage.getItem("idServicio"),
-
         sexo: this.answers.sexo,
         edad: this.answers.edad,
         servicioMedico: this.answers.servicioMedico,
@@ -1105,7 +229,6 @@ export default {
         p29: this.answers.p29,
         p30: this.answers.p30,
       };
-
       axios
         .post(`${process.env.api}/cuestionario_alumno`, data, this.token)
         .then((res) => {
@@ -1135,19 +258,9 @@ export default {
   mounted() {
     this.idCuestionario = localStorage.getItem("idCuestionarioAlumno");
   },
-  watch: {
-    "answers.servicioMedicoAux"() {
-      this.answers.servicioMedicoOtro = "";
-      this.answers.servicioMedico = this.answers.servicioMedicoAux;
-    },
-    "answers.servicioMedicoOtro"() {
-      this.answers.servicioMedico = this.answers.servicioMedicoOtro;
-    },
-  },
 };
 </script>
-
-<style scoped>
+<style >
 .SINO * {
   margin: 0.5rem 0 !important;
 }
@@ -1168,6 +281,13 @@ export default {
 .td-w {
   width: 2000px;
 }
+.active,
+.active:hover {
+  background-color: #bb8800 !important;
+}
+.centro {
+  text-align: center;
+}
 .vh {
   height: 75vh;
   display: flex;
@@ -1177,11 +297,4 @@ export default {
 .vh h1 {
   font-size: 60px;
 }
-.active,
-.active:hover {
-  background-color: #bb8800;
-}
-.centro {
-  text-align: center;
-}
-</style>
+</style>
\ No newline at end of file