Compare commits
22 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 eithan
|
66272ff3ef | ||
|
eithan
|
5b5c2d24ac | ||
|
eithan
|
549e0dbc90 | ||
|
eithan
|
98022ec605 | ||
|
eithan
|
3a560255dd | ||
|
eithan
|
4ff5ef55fa | ||
|
eithan
|
1b3088ed9f | ||
|
eithan
|
96c387420e | ||
|
eithan
|
02cb974be1 | ||
|
eithan
|
728922136a | ||
 Your Name
|
551c1518c0 | ||
|
Your Name
|
b39250a334 | ||
|
Your Name
|
87bfddff5a | ||
|
Your Name
|
6365291fe4 | ||
|
eithan
|
8d03b74cac | ||
|
Your Name
|
019b9a3fa5 | ||
|
Your Name
|
68e0787217 | ||
|
Tu Nombre
|
0015f9bd03 | ||
|
Tu Nombre
|
c514357032 | ||
|
Tu Nombre
|
cf286c9788 | ||
|
Tu Nombre
|
5eb9ca0d74 | ||
|
Tu Nombre
|
99f409c7c4 |
@@ -0,0 +1,16 @@
|
||||
{
|
||||
"name": "Nuxt.js Dev Container",
|
||||
"dockerFile": "../Dockerfile",
|
||||
"appPort": ["3001"],
|
||||
"runArgs": ["-p", "3001:3000"],
|
||||
"postCreateCommand": "npm install",
|
||||
"settings": {
|
||||
"terminal.integrated.defaultProfile.linux": "bash",
|
||||
"editor.formatOnSave": true
|
||||
},
|
||||
"extensions": [
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode"
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,3 +1,6 @@
|
||||
#.devcontainer
|
||||
|
||||
|
||||
# Created by .ignore support plugin (hsz.mobi)
|
||||
### Node template
|
||||
# Logs
|
||||
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
# Usa una imagen oficial de Node.js
|
||||
FROM node:16-alpine
|
||||
|
||||
# Establece el directorio de trabajo dentro del contenedor
|
||||
WORKDIR /app
|
||||
|
||||
# Copia el package.json y el package-lock.json (si existe)
|
||||
COPY package*.json ./
|
||||
|
||||
# Instala las dependencias
|
||||
RUN npm install
|
||||
|
||||
# Copia el resto de los archivos del proyecto
|
||||
COPY . .
|
||||
|
||||
# Expone el puerto de desarrollo de Nuxt.js
|
||||
EXPOSE 3000
|
||||
|
||||
# Comando por defecto al iniciar el contenedor
|
||||
CMD ["npm", "run", "dev"]
|
||||
@@ -125,7 +125,7 @@
|
||||
<b-icon
|
||||
class="tag is-success"
|
||||
icon="check"
|
||||
v-if="props.row.idCuestionarioPrograma"
|
||||
v-if="props.row.idCuestionarioPrograma || props.row.idCuestionarioPrograma2"
|
||||
/>
|
||||
|
||||
<b-button
|
||||
|
||||
@@ -14,6 +14,20 @@
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Version:">
|
||||
<b-select v-model="version" expanded>
|
||||
<option value="" disabled>Seleccione una version:</option>
|
||||
|
||||
<option value="v1">v1</option>
|
||||
|
||||
<option value="v2">
|
||||
v2
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
|
||||
|
||||
<b-field label="Año:">
|
||||
<b-select v-model="selectedYear" expanded>
|
||||
<option value="" disabled>Seleccione un año:</option>
|
||||
@@ -51,6 +65,7 @@ export default {
|
||||
return {
|
||||
selectedCuestionario: '',
|
||||
selectedYear: '',
|
||||
version:''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -58,16 +73,24 @@ export default {
|
||||
this.updateIsLoading(true)
|
||||
axios
|
||||
.get(
|
||||
`${process.env.api}/${this.selectedCuestionario}?year=${this.selectedYear}`,
|
||||
this.admin.token
|
||||
`${process.env.api}/${this.selectedCuestionario}`, {
|
||||
params: {
|
||||
year: this.selectedYear,
|
||||
version: this.version,
|
||||
},
|
||||
headers: {
|
||||
Authorization: `Bearer ${this.admin.token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
fileDownload(
|
||||
res.data,
|
||||
`${this.selectedYear}_${this.selectedCuestionario}.csv`
|
||||
`${this.selectedYear}_${this.selectedCuestionario}_${this.version}.csv`
|
||||
)
|
||||
this.selectedYear = ''
|
||||
this.selectedCuestionario = ''
|
||||
this.version = ''
|
||||
this.updateIsLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
|
||||
@@ -31,9 +31,9 @@
|
||||
<p class="input">{{ servicio.Usuario.nombre }}</p>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Fecha de nacimiento:" v-if="servicio.fechaNacimiento">
|
||||
<!-- <b-field label="Fecha de nacimiento:" v-if="servicio.fechaNacimiento">
|
||||
<p class="input">{{ fecha(servicio.fechaNacimiento) }}</p>
|
||||
</b-field>
|
||||
</b-field> -->
|
||||
|
||||
<b-field label="Carrera:">
|
||||
<p class="input">{{ servicio.Carrera.carrera }}</p>
|
||||
|
||||
@@ -0,0 +1,718 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-notification
|
||||
v-if="pendingItems.length && !isMobile"
|
||||
type="is-warning"
|
||||
class="floating-pop"
|
||||
:closable="false"
|
||||
>
|
||||
<p><strong>Te faltan contestar:</strong></p>
|
||||
<ul>
|
||||
<li v-for="(item, idx) in pendingItems" :key="idx">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</b-notification>
|
||||
|
||||
<div class="container mt-5">
|
||||
<div
|
||||
v-for="(item, index) in sortedItems"
|
||||
:key="item.id || item.idTabla"
|
||||
class="mb-4 mt-6"
|
||||
v-if="isItemVisible(item)"
|
||||
>
|
||||
<div v-if="item.tipo">
|
||||
<label :for="item.id" class="form-label">
|
||||
{{ item.numeroPregunta }}. {{ item.texto }}
|
||||
</label>
|
||||
<div v-if="item.tipo === 'seleccionUnica'">
|
||||
<div v-for="opcion in item.opciones" :key="item.id + '-' + opcion" class="SINO">
|
||||
<b-radio
|
||||
v-model="respuestas[item.id]"
|
||||
:native-value="opcion"
|
||||
type="is-info"
|
||||
@change="updateRespuestas(item.id, opcion)"
|
||||
>
|
||||
{{ opcion }}
|
||||
</b-radio>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.tipo === 'seleccionMultiple'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<input
|
||||
class="checkb"
|
||||
type="checkbox"
|
||||
:value="opcion"
|
||||
:checked="respuestas[item.id].includes(opcion)"
|
||||
@change="toggleSelection(item.id, opcion, $event)"
|
||||
/>
|
||||
{{ opcion }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.tipo === 'texto'">
|
||||
<b-input
|
||||
:id="item.id"
|
||||
v-model="respuestas[item.id]"
|
||||
:maxlength="item.limite"
|
||||
show-counter
|
||||
placeholder="Escribe tu respuesta aquí"
|
||||
></b-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-responsive" v-else>
|
||||
<template
|
||||
v-if="index === 0 || item.numeroPregunta !== sortedItems[index - 1].numeroPregunta"
|
||||
>
|
||||
<h3 class="mb-3">
|
||||
{{ item.numeroPregunta }}. {{ item.preguntaTabla }}
|
||||
</h3>
|
||||
</template>
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">
|
||||
{{ item.subPreguntaTabla }}
|
||||
</h5>
|
||||
<table class="table table-bordered text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="opcion in item.renglones[0].opciones" :key="opcion">
|
||||
{{ opcion }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="renglon in item.renglones" :key="renglon.idRenglon">
|
||||
<td>{{ renglon.textoRenglon }}</td>
|
||||
<td
|
||||
v-for="opcion in renglon.opciones"
|
||||
:key="opcion"
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
:name="`tabla-${item.idTabla}-renglon-${renglon.idRenglon}`"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.idTabla][renglon.idRenglon]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="my-6 mb-6 has-text-centered">
|
||||
<b-field>
|
||||
<button
|
||||
class="button is-success is-medium"
|
||||
@click="submitForm"
|
||||
:disabled="!isFormComplete"
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</b-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
respuestas: {},
|
||||
formulario: {
|
||||
preguntas: [
|
||||
{
|
||||
id: 'criterios',
|
||||
tipo: 'seleccionMultiple',
|
||||
numeroPregunta: 1,
|
||||
texto:
|
||||
'Señala los tres principales criterios que utilizaste para seleccionar el programa de servicio social',
|
||||
opciones: [
|
||||
'Actividades adscritas al programa',
|
||||
'Apoyo económico',
|
||||
'Asesoría académica',
|
||||
'Dependencia de la UNAM',
|
||||
'Flexibilidad en horarios',
|
||||
'Institución del sector público',
|
||||
'Institución del sector social',
|
||||
'Invitación de profesores',
|
||||
'Modalidad de titulación por servicio social',
|
||||
'Objetivo del programa',
|
||||
'Oportunidad de desarrollo de tesis',
|
||||
'Prestigio de la institución',
|
||||
'Recomendación de compañeros',
|
||||
]
|
||||
},
|
||||
{
|
||||
numeroPregunta: 2,
|
||||
id: 'inscripcion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Cómo evalúas tu proceso de inscripción?',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
numeroPregunta: 4,
|
||||
id: 'actividades',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Las actividades que realizaste fueron acordes a lo descrito en el programa?',
|
||||
opciones: ['Sí', 'No']
|
||||
},
|
||||
{
|
||||
numeroPregunta: 5,
|
||||
id: 'actividadesComentarios2',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'En caso de que las actividades que realizaste hayan sido distintas a las descritas en el programa, enlistas ¿Cuáles fueron?',
|
||||
limite: 200,
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No'
|
||||
}
|
||||
},
|
||||
{
|
||||
numeroPregunta: 6,
|
||||
id: 'espacioFisico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto:
|
||||
'¿Contaste con un espacio físico adecuado para realizar tus actividades?',
|
||||
opciones: ['Sí', 'No']
|
||||
},
|
||||
{
|
||||
numeroPregunta: 7,
|
||||
id: 'instalaciones',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'Las instalaciones en las que te desempeñaste, contaban con condiciones adecuadas para la realización de las actividades que te encomendaron',
|
||||
opciones: ['Sí', 'No']
|
||||
},
|
||||
{
|
||||
numeroPregunta: 8,
|
||||
id: 'instalacionesComentarios',
|
||||
tipo: 'texto',
|
||||
texto: 'Si respondiste NO, ¿Por qué?',
|
||||
limite: 200,
|
||||
condicional: {
|
||||
preguntaId: 'instalaciones',
|
||||
valor: 'No'
|
||||
}
|
||||
},
|
||||
{
|
||||
numeroPregunta: 9,
|
||||
id: 'materialProporcionado',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿La institución te proporciono material/equipo necesario para el desempeño de tus actividades?',
|
||||
opciones: ['Sí', 'No']
|
||||
},
|
||||
{
|
||||
numeroPregunta: 13,
|
||||
id: 'supervisor',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Quién asesoró y supervisó las actividades que realizaste?',
|
||||
opciones: [
|
||||
'Coordinador administrativo del programa',
|
||||
'Responsable directo del programa',
|
||||
'Alguien diferente a los dos anteriores',
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
numeroPregunta: 14,
|
||||
id: 'apoyoEconomico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'El apoyo económico señalado en el programa...',
|
||||
opciones: [
|
||||
'Se te otorgó de acuerdo a lo establecido',
|
||||
'Fue condicionado',
|
||||
'Se te proporcionó solo una parte',
|
||||
'No aplica'
|
||||
]
|
||||
},
|
||||
{
|
||||
numeroPregunta: 15,
|
||||
id: 'recomendacion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Recomendarías el programa en que participaste?',
|
||||
opciones: ['Sí', 'No']
|
||||
},
|
||||
{
|
||||
numeroPregunta: 16,
|
||||
id: 'actividadesComentarios3',
|
||||
tipo: 'texto',
|
||||
texto: '¿Por qué?',
|
||||
limite: 200,
|
||||
condicional: {
|
||||
preguntaId: 'recomendacion',
|
||||
valor: 'No'
|
||||
}
|
||||
},
|
||||
{
|
||||
numeroPregunta: 18,
|
||||
id: 'actividadesComentarios1',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'Menciona los conocimiento o habilidades que te ayudarían a un mejor desempeño para tu actividad profesional a futuro',
|
||||
limite: 200
|
||||
}
|
||||
],
|
||||
tablas: [
|
||||
{
|
||||
idTabla: 130,
|
||||
preguntaTabla: '¿En la entidad o programa donde realizaste tu servicio social recibiste…?',
|
||||
numeroPregunta: 3,
|
||||
renglones: [
|
||||
{ idRenglon: 1, textoRenglon: 'Asesoría', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 2, textoRenglon: 'Acompañamiento', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 3, textoRenglon: 'Supervisión', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 4, textoRenglon: 'Seguimiento', opciones: ['si', 'no'] }
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 104,
|
||||
preguntaTabla: 'El trato que recibiste fue:',
|
||||
numeroPregunta: 10,
|
||||
renglones: [
|
||||
{ idRenglon: 1, textoRenglon: 'Profesional', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 2, textoRenglon: 'Amable', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 3, textoRenglon: 'Respetuoso', opciones: ['si', 'no'] }
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 105,
|
||||
preguntaTabla: 'En tu servicio social…',
|
||||
numeroPregunta: 11,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Aplicaste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces', 'Regularmente', 'Siempre']
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Desarrollaste habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces', 'Regularmente', 'Siempre']
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Enriqueciste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces', 'Regularmente', 'Siempre']
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Fortaleciste tus habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces', 'Regularmente', 'Siempre']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 106,
|
||||
preguntaTabla: 'Con respecto a la plataforma SIASSyPP web.',
|
||||
subPreguntaTabla: 'La información que te proporcionaron sobre los programas fue:',
|
||||
numeroPregunta: 17,
|
||||
renglones: [
|
||||
{ idRenglon: 1, textoRenglon: 'Adecuada', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 2, textoRenglon: 'Suficiente', opciones: ['si', 'no'] },
|
||||
{ idRenglon: 3, textoRenglon: 'Actualizada', opciones: ['si', 'no'] }
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 101,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'A. Habilidades personales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Puntualidad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Eficiencia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Organización',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Eficacia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 102,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'B. Habilidades profesionales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Disposición',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Proactivo/anticipación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Propositivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Resolutivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 103,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'C. Habilidades sociales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Empatía',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Trabajo en equipo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Comunicación asertiva',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Receptividad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Tolerancia a la frustración',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
idTabla: 1042,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'D. Conocimientos',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Conocimientos teóricos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Conocimientos metodológicos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Pensamiento critico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Formación académica general',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Uso tecnológico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado']
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.formulario.preguntas.forEach((p) => {
|
||||
if (!(p.id in this.respuestas)) {
|
||||
if (p.tipo === 'seleccionMultiple') {
|
||||
this.$set(this.respuestas, p.id, [])
|
||||
} else {
|
||||
this.$set(this.respuestas, p.id, null)
|
||||
}
|
||||
}
|
||||
})
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
if (!(tabla.idTabla in this.respuestas)) {
|
||||
this.$set(this.respuestas, tabla.idTabla, {})
|
||||
}
|
||||
tabla.renglones.forEach((r) => {
|
||||
if (!(r.idRenglon in this.respuestas[tabla.idTabla])) {
|
||||
this.$set(this.respuestas[tabla.idTabla], r.idRenglon, null)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
|
||||
|
||||
|
||||
isMobile() {
|
||||
return window.innerWidth < 576
|
||||
},
|
||||
|
||||
|
||||
sortedItems() {
|
||||
const items = [...this.formulario.preguntas, ...this.formulario.tablas]
|
||||
return items.sort((a, b) => {
|
||||
if (a.numeroPregunta === b.numeroPregunta) {
|
||||
return (a.idTabla || 0) - (b.idTabla || 0)
|
||||
}
|
||||
return a.numeroPregunta - b.numeroPregunta
|
||||
})
|
||||
},
|
||||
pendingItems() {
|
||||
let missing = []
|
||||
this.formulario.preguntas.forEach((p) => {
|
||||
if (!this.isItemVisible(p)) return
|
||||
let answer = this.respuestas[p.id]
|
||||
let answered = false
|
||||
if (p.tipo === 'seleccionMultiple') {
|
||||
if (p.id === 'criterios') {
|
||||
answered = answer && answer.length === 3
|
||||
} else {
|
||||
answered = answer && answer.length > 0
|
||||
}
|
||||
} else {
|
||||
answered = answer !== null && answer !== ''
|
||||
}
|
||||
if (!answered) {
|
||||
missing.push(`Pregunta ${p.numeroPregunta}`)
|
||||
}
|
||||
})
|
||||
this.formulario.tablas.forEach((t) => {
|
||||
let allAnswered = t.renglones.every(
|
||||
(r) =>
|
||||
this.respuestas[t.idTabla] &&
|
||||
this.respuestas[t.idTabla][r.idRenglon] !== null
|
||||
)
|
||||
if (!allAnswered) {
|
||||
missing.push(`Tabla ${t.numeroPregunta}`)
|
||||
}
|
||||
})
|
||||
return missing
|
||||
},
|
||||
isFormComplete() {
|
||||
return this.pendingItems.length === 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
isItemVisible(item) {
|
||||
if (item.condicional) {
|
||||
const resp = this.respuestas[item.condicional.preguntaId]
|
||||
return resp === item.condicional.valor
|
||||
}
|
||||
return true
|
||||
},
|
||||
toggleSelection(id, opcion, event) {
|
||||
const selected = this.respuestas[id]
|
||||
if (event.target.checked) {
|
||||
if (selected.length >= 3) {
|
||||
event.target.checked = false
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Límite alcanzado',
|
||||
message: 'Solo puedes seleccionar hasta 3 opciones.',
|
||||
type: 'is-warning'
|
||||
})
|
||||
} else {
|
||||
selected.push(opcion)
|
||||
}
|
||||
} else {
|
||||
const index = selected.indexOf(opcion)
|
||||
if (index !== -1) {
|
||||
selected.splice(index, 1)
|
||||
}
|
||||
}
|
||||
},
|
||||
updateRespuestas(id, valor) {
|
||||
this.$set(this.respuestas, id, valor)
|
||||
},
|
||||
validateResponses() {
|
||||
for (const pregunta of this.formulario.preguntas) {
|
||||
if (!this.isItemVisible(pregunta)) continue
|
||||
const resp = this.respuestas[pregunta.id]
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
if (pregunta.id === 'criterios') {
|
||||
if (!resp || resp.length !== 3) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, selecciona exactamente 3 opciones en la pregunta ${pregunta.numeroPregunta}.`,
|
||||
type: 'is-danger'
|
||||
})
|
||||
return false
|
||||
}
|
||||
} else {
|
||||
if (!resp || resp.length === 0) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, selecciona al menos una opción en la pregunta ${pregunta.numeroPregunta}.`,
|
||||
type: 'is-danger'
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (resp === null || resp === '') {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, responde la pregunta ${pregunta.numeroPregunta}.`,
|
||||
type: 'is-danger'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if (pregunta.tipo === 'texto') {
|
||||
const limite = pregunta.limite || 200
|
||||
if (resp.length > limite) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `La respuesta de la pregunta ${pregunta.numeroPregunta} excede el límite de ${limite} caracteres.`,
|
||||
type: 'is-danger'
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
for (const tabla of this.formulario.tablas) {
|
||||
for (const renglon of tabla.renglones) {
|
||||
const respuesta = this.respuestas[tabla.idTabla]?.[renglon.idRenglon]
|
||||
if (respuesta === null) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, contesta la tabla ${tabla.numeroPregunta}, fila "${renglon.textoRenglon}".`,
|
||||
type: 'is-danger'
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
return true
|
||||
},
|
||||
submitForm() {
|
||||
if (!this.validateResponses()) return
|
||||
const respuestaFormateada = this.formatearRespuestas(this.respuestas)
|
||||
let data = {
|
||||
...respuestaFormateada,
|
||||
idServicio: localStorage.getItem('idServicio')
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then(() => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true
|
||||
})
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: error.response?.data?.message || 'Error al enviar el formulario',
|
||||
type: 'is-danger'
|
||||
})
|
||||
})
|
||||
},
|
||||
formatearRespuestas(respuestas) {
|
||||
const resultado = {}
|
||||
for (const key in respuestas) {
|
||||
const esTabla = !isNaN(Number(key))
|
||||
if (esTabla) {
|
||||
const idTabla = parseInt(key, 10)
|
||||
const tablaDef = this.formulario.tablas.find((t) => t.idTabla === idTabla)
|
||||
if (!tablaDef) continue
|
||||
const numPregunta = tablaDef.numeroPregunta
|
||||
let subLetra = ''
|
||||
if (tablaDef.subPreguntaTabla) {
|
||||
const match = tablaDef.subPreguntaTabla.match(/^([A-E])\./)
|
||||
if (match) {
|
||||
subLetra = match[1]
|
||||
}
|
||||
}
|
||||
const respuestasTabla = respuestas[key]
|
||||
for (const idRenglon in respuestasTabla) {
|
||||
const valor = respuestasTabla[idRenglon]
|
||||
let clave = `p${numPregunta}_${idRenglon}`
|
||||
if (subLetra) {
|
||||
clave = `p${numPregunta}_${subLetra}_${idRenglon}`
|
||||
}
|
||||
resultado[clave] = valor
|
||||
}
|
||||
} else {
|
||||
const preguntaDef = this.formulario.preguntas.find((p) => p.id === key)
|
||||
if (!preguntaDef) continue
|
||||
const numPregunta = preguntaDef.numeroPregunta
|
||||
const clave = `p${numPregunta}`
|
||||
resultado[clave] = respuestas[key]
|
||||
}
|
||||
}
|
||||
return resultado
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.floating-pop {
|
||||
position: fixed !important;
|
||||
bottom: 1rem;
|
||||
right: 1rem;
|
||||
z-index: 9999;
|
||||
max-width: 320px;
|
||||
animation: fadeInUp 0.4s ease;
|
||||
max-height: 60vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(40px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
@media (max-width: 576px) {
|
||||
.floating-pop {
|
||||
left: 0.5rem;
|
||||
right: 0.5rem;
|
||||
max-width: none;
|
||||
width: auto;
|
||||
max-height: 50vh;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.table-responsive {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,951 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<!-- <h1 class="text-center mb-4">{{ formulario.titulo }}</h1>
|
||||
<p class="text-center">{{ formulario.descripcion }}</p> -->
|
||||
|
||||
|
||||
<div >
|
||||
<div v-for="(item, index) in sortedItems" :key="item.id || item.idTabla" class="mb-4 mt-6">
|
||||
<div v-if="item.tipo" class="mt-6">
|
||||
|
||||
<label :for="item.id" class="form-label">{{ item.numeroPregunta }}. {{ item.texto }}</label>
|
||||
|
||||
<div v-if="item.tipo === 'seleccionUnica'" :key="item.id">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<!-- :id="item.id" -->
|
||||
<b-radio
|
||||
v-model="respuestas[item.id]"
|
||||
:key="item.id + '-' + opcion"
|
||||
:native-value="opcion"
|
||||
type="is-info"
|
||||
@change="updateRespuestas(item.id, opcion)"
|
||||
>
|
||||
{{ opcion }}
|
||||
</b-radio>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div v-if="item.tipo === 'seleccionMultiple'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<input
|
||||
class="checkb"
|
||||
type="checkbox"
|
||||
:value="opcion"
|
||||
|
||||
|
||||
:checked="respuestas[item.id].includes(opcion)"
|
||||
@change="toggleSelection(item.id, opcion, $event)"
|
||||
|
||||
/>
|
||||
{{ opcion }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- v-model="respuestas[item.id]" -->
|
||||
<div v-if="item.tipo === 'texto'">
|
||||
<b-input
|
||||
:id="item.id"
|
||||
v-model="respuestas[item.id]"
|
||||
placeholder="Escribe tu respuesta aquí"
|
||||
></b-input>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- <h3 class="mb-3">{{ item.numeroPregunta }}. {{ item.preguntaTabla }}</h3>
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">{{ item.subPreguntaTabla }}</h5>
|
||||
-->
|
||||
|
||||
<template v-if="index === 0 || item.numeroPregunta !== sortedItems[index - 1].numeroPregunta">
|
||||
<h3 class="mb-3">
|
||||
{{ item.numeroPregunta }}. {{ item.preguntaTabla }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<!-- Subtítulo (h5) siempre que exista -->
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">
|
||||
{{ item.subPreguntaTabla }}
|
||||
</h5>
|
||||
|
||||
<table class="table table-bordered text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="opcion in item.renglones[0].opciones" :key="opcion">{{ opcion }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="renglon in item.renglones" :key="renglon.idRenglon">
|
||||
<td>{{ renglon.textoRenglon }}</td>
|
||||
<td v-for="opcion in renglon.opciones" :key="opcion">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`tabla-${item.idTabla}-renglon-${renglon.idRenglon}`"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.idTabla][renglon.idRenglon]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="my-6 mb-6 has-text-centered">
|
||||
<b-field class="centro">
|
||||
<button
|
||||
class="button is-success is-medium"
|
||||
@click="() => { submitForm() }"
|
||||
:disabled="!isFormComplete"
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</b-field>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
import axios from 'axios'
|
||||
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
respuestas: {}, // Inicialización para almacenar las respuestas
|
||||
|
||||
formulario: {
|
||||
titulo: '2025 Evaluación del Universitario(a)',
|
||||
descripcion:
|
||||
'Te invitamos a compartir tu experiencia respecto al programa de servicio social en el que participaste. Tus respuestas son confidenciales.',
|
||||
preguntas: [
|
||||
{
|
||||
id: 'criterios',
|
||||
tipo: 'seleccionMultiple',
|
||||
numeroPregunta:1,
|
||||
texto:
|
||||
'Señala los tres principales criterios que utilizaste para seleccionar el programa de servicio social',
|
||||
opciones: [
|
||||
|
||||
|
||||
'Actividades adscritas al programa',
|
||||
'Apoyo económico',
|
||||
'Asesoría académica',
|
||||
'Dependencia de la UNAM',
|
||||
'Flexibilidad en horarios',
|
||||
'Institución del sector público',
|
||||
'Institución del sector social',
|
||||
'Invitación de profesores',
|
||||
'Modalidad de titulación por servicio social',
|
||||
'Objetivo del programa',
|
||||
'Oportunidad de desarrollo de tesis',
|
||||
'Prestigio de la institución',
|
||||
'Recomendación de compañeros',
|
||||
|
||||
],
|
||||
},
|
||||
{
|
||||
numeroPregunta:2,
|
||||
id: 'inscripcion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Cómo evalúas tu proceso de inscripción?',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
{
|
||||
numeroPregunta:4,
|
||||
id: 'actividades',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Las actividades que realizaste fueron acordes a lo descrito en el programa?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:5,
|
||||
id: 'actividadesComentarios2',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'En caso de que las actividades que realizaste hayan sido distintas a las descritas en el programa, enlistas ¿Cuáles fueron?',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
{
|
||||
numeroPregunta:6,
|
||||
id: 'espacioFisico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto:
|
||||
'¿Contaste con un espacio físico adecuado para realizar tus actividades?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:7,
|
||||
id: 'instalaciones',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'Las instalaciones en las que te desempeñaste, contaban con condiciones adecuadas para la realización de las actividades que te encomendaron',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:8,
|
||||
id: 'instalacionesComentarios',
|
||||
tipo: 'texto',
|
||||
texto: 'Si respondiste NO, ¿Por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'instalaciones',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
{
|
||||
numeroPregunta:9,
|
||||
id: 'materialProporcionado',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿La institución te proporciono material/equipo necesario para el desempeño de tus actividades?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
|
||||
{
|
||||
numeroPregunta:13,
|
||||
id: 'supervisor',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Quién asesoró y supervisó las actividades que realizaste?',
|
||||
opciones: [
|
||||
|
||||
|
||||
'Coordinador administrativo del programa',
|
||||
'Responsable directo del programa',
|
||||
'Alguien diferente a los dos anteriores',
|
||||
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
numeroPregunta:14,
|
||||
id: 'apoyoEconomico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'El apoyo económico señalado en el programa...',
|
||||
opciones: [
|
||||
'Se te otorgó de acuerdo a lo establecido',
|
||||
'Fue condicionado',
|
||||
'Se te proporcionó solo una parte',
|
||||
],
|
||||
},
|
||||
{
|
||||
numeroPregunta:15,
|
||||
id: 'recomendacion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Recomendarías el programa en que participaste?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
numeroPregunta:16,
|
||||
id: 'actividadesComentarios3',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'¿Por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
numeroPregunta:18,
|
||||
id: 'actividadesComentarios1',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'Enlista los conocimiento o habilidades que te ayudarían a un mejor desempeño para tu actividad profesional a futuro',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
|
||||
tablas: [
|
||||
|
||||
|
||||
{
|
||||
idTabla: 130,
|
||||
preguntaTabla: '¿En la entidad o programa donde realizaste tu servicio social recibiste…?',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 3,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Asesoría',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Acompañamiento',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Supervisión',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Seguimiento',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 104,
|
||||
preguntaTabla: 'El trato que recibiste fue:',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 10,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Profesional',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Amable',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Respetuoso',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 105,
|
||||
preguntaTabla: 'En tu servicio social…',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 11,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Aplicaste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Desarrollaste habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Enriqueciste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Fortaleciste tus habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
idTabla: 106,
|
||||
preguntaTabla: 'Con respecto a la plataforma SIASSyPP web.',
|
||||
subPreguntaTabla: 'La información que te proporcionaron sobre los programas fue:',
|
||||
numeroPregunta: 17,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Adecuada',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Suficiente',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Actualizada',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 101,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'A. Habilidades personales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Puntualidad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Eficiencia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Organización',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Eficacia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
idTabla: 102,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'B. Habilidades profesionales ',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Disposición',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Proactivo/anticipación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Propositivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Resolutivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 103,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'C. Habilidades sociales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Empatía',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Trabajo en equipo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Comunicación asertiva',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Receptividad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Tolerancia a la frustación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
idTabla: 1042,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'D. Conocimientos',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Conocimientos teóricos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Conocimientos metodológicos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Pensamiento critico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Formación académica general',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Uso tecnológico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.respuestas = this.respuestas || {};
|
||||
|
||||
this.formulario.preguntas.forEach((pregunta) => {
|
||||
if (!(pregunta.id in this.respuestas)) { // Solo inicializa si no existe
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
this.$set(this.respuestas, pregunta.id, []);
|
||||
} else {
|
||||
this.$set(this.respuestas, pregunta.id, null); // Usa null en lugar de ''
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
if (!(tabla.idTabla in this.respuestas)) {
|
||||
this.$set(this.respuestas, tabla.idTabla, {});
|
||||
}
|
||||
|
||||
tabla.renglones.forEach((renglon) => {
|
||||
if (!(renglon.idRenglon in this.respuestas[tabla.idTabla])) {
|
||||
this.$set(this.respuestas[tabla.idTabla], renglon.idRenglon, null);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
|
||||
watch: {
|
||||
respuestas: {
|
||||
handler(newVal) {
|
||||
console.log("Estado actualizado de respuestas:", newVal);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
computed: {
|
||||
sortedItems() {
|
||||
const items = [...this.formulario.preguntas, ...this.formulario.tablas]
|
||||
return items.sort((a, b) => {
|
||||
if (a.numeroPregunta === b.numeroPregunta) {
|
||||
return (a.idTabla || 0) - (b.idTabla || 0)
|
||||
}
|
||||
return a.numeroPregunta - b.numeroPregunta
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
isFormComplete() {
|
||||
// Verifica todas las preguntas individuales
|
||||
const allQuestionsAnswered = this.formulario.preguntas.every((pregunta) => {
|
||||
const respuesta = this.respuestas[pregunta.id];
|
||||
if (pregunta.tipo === "seleccionMultiple") {
|
||||
return respuesta && respuesta.length > 0; // Debe tener al menos una opción seleccionada
|
||||
}
|
||||
return respuesta !== null && respuesta !== ""; // No debe ser null ni vacío
|
||||
});
|
||||
|
||||
// Verifica todas las respuestas de la tabla
|
||||
const allTablesAnswered = this.formulario.tablas.every((tabla) => {
|
||||
return tabla.renglones.every((renglon) => {
|
||||
return this.respuestas[tabla.idTabla] && this.respuestas[tabla.idTabla][renglon.idRenglon] !== null;
|
||||
});
|
||||
});
|
||||
|
||||
return allQuestionsAnswered && allTablesAnswered;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
toggleSelection(id, opcion, event) {
|
||||
let selectedOptions = this.respuestas[id];
|
||||
|
||||
if (selectedOptions.includes(opcion)) {
|
||||
// Si ya está seleccionada, se deselecciona
|
||||
this.respuestas[id] = selectedOptions.filter(opt => opt !== opcion);
|
||||
} else {
|
||||
if (selectedOptions.length < 3) {
|
||||
// Si hay espacio, se agrega la opción
|
||||
this.respuestas[id].push(opcion);
|
||||
} else {
|
||||
// Evita la selección de más de 3 opciones
|
||||
event.preventDefault();
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Límite alcanzado",
|
||||
message: "Solo puedes seleccionar hasta 3 opciones.",
|
||||
type: "is-warning",
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
limitSelection(id, opcion, event) {
|
||||
if (this.respuestas[id].length >= 3 && !this.respuestas[id].includes(opcion)) {
|
||||
// Evita que se seleccione la opción adicional
|
||||
event.preventDefault();
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Límite alcanzado",
|
||||
message: "Solo puedes seleccionar hasta 3 opciones.",
|
||||
type: "is-warning",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
updateRespuestas(id, valor) {
|
||||
this.$set(this.respuestas, id, valor);
|
||||
console.log("Radio seleccionado:", id, valor);
|
||||
},
|
||||
|
||||
validateResponses() {
|
||||
for (const pregunta of this.formulario.preguntas) {
|
||||
const respuesta = this.respuestas[pregunta.id];
|
||||
|
||||
// Verifica que no haya respuestas vacías
|
||||
if (respuesta === null || respuesta === "") {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, responde la pregunta: "${pregunta.texto}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
// Para selección múltiple, al menos un elemento debe estar seleccionado
|
||||
if (pregunta.tipo === "seleccionMultiple" && (!respuesta || respuesta.length === 0)) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, selecciona al menos una opción en: "${pregunta.texto}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
// Validación adicional si la pregunta es de texto (evitar respuestas peligrosas)
|
||||
if (pregunta.tipo === "texto" && respuesta.length > 500) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `La respuesta de la pregunta "${pregunta.texto}" es demasiado larga.`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// Verifica que todas las respuestas en las tablas estén completas
|
||||
for (const tabla of this.formulario.tablas) {
|
||||
for (const renglon of tabla.renglones) {
|
||||
const respuesta = this.respuestas[tabla.idTabla]?.[renglon.idRenglon];
|
||||
|
||||
if (respuesta === null) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, responde la pregunta en la tabla: "${tabla.preguntaTabla}" en la fila "${renglon.textoRenglon}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
submitForm() {
|
||||
|
||||
|
||||
if (!this.validateResponses()) return; // Detiene el envío si la validación falla
|
||||
console.log('Respuestas a enviar:', this.respuestas)
|
||||
//alert('Formulario enviado. Gracias por tu participación.')
|
||||
|
||||
|
||||
// Aquí formateamos las respuestas
|
||||
const respuestaFormateada = this.formatearRespuestas(this.respuestas)
|
||||
console.log('Respuestas formateadas:', respuestaFormateada)
|
||||
// this.sendAnswers(respuestaFormateada)
|
||||
|
||||
|
||||
|
||||
let data = { ...respuestaFormateada,
|
||||
idServicio: localStorage.getItem('idServicio'), // 4,
|
||||
p1: 'respuesta1 - trabajando para que sea una string',
|
||||
}
|
||||
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token
|
||||
)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
// this.error(error.response.data.message)
|
||||
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: error.response?.data?.message || "Error al enviar el formulario",
|
||||
type: "is-danger",
|
||||
});
|
||||
|
||||
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
formatearRespuestas(respuestas) {
|
||||
// Objeto final a devolver
|
||||
const resultado = {}
|
||||
|
||||
// Recorremos todas las claves de "respuestas"
|
||||
for (const key in respuestas) {
|
||||
// Verificamos si es un ID de tabla (numérico) o un ID de pregunta (string)
|
||||
const esTabla = !isNaN(Number(key)) // true si la clave se puede convertir a número
|
||||
|
||||
if (esTabla) {
|
||||
// 1) BUSCAMOS LA DEFINICIÓN DE LA TABLA
|
||||
const idTabla = parseInt(key, 10)
|
||||
const tablaDef = this.formulario.tablas.find(t => t.idTabla === idTabla)
|
||||
if (!tablaDef) {
|
||||
// Si no se encontró la tabla, continuamos
|
||||
continue
|
||||
}
|
||||
|
||||
// 2) OBTENEMOS EL NÚMERO DE PREGUNTA Y, OPCIONALMENTE, LA LETRA (A, B, C...)
|
||||
const numPregunta = tablaDef.numeroPregunta
|
||||
|
||||
// Si quieres “sacar” la letra (A, B, C…) de algo como "A. Habilidades sociales"
|
||||
// Se puede hacer un match sencillo al principio
|
||||
let subLetra = ''
|
||||
if (tablaDef.subPreguntaTabla) {
|
||||
// Ejemplo: "A. Habilidades personales"
|
||||
const coincidencia = tablaDef.subPreguntaTabla.match(/^([A-E])\./)
|
||||
if (coincidencia) {
|
||||
subLetra = coincidencia[1] // 'A', 'B', 'C', etc.
|
||||
}
|
||||
}
|
||||
|
||||
// 3) LUEGO RECORREMOS LAS RESPUESTAS DE LA TABLA (por cada idRenglon)
|
||||
const respuestasTabla = respuestas[key] // p.ej: { "1": "Deficiente", "2": "Básico", ... }
|
||||
for (const idRenglon in respuestasTabla) {
|
||||
const valor = respuestasTabla[idRenglon]
|
||||
|
||||
// Formamos la clave final.
|
||||
// Si hay subLetra, hacemos `p3_A_1`. Sino, solo `p3_1`.
|
||||
let clave = `p${numPregunta}_${idRenglon}`
|
||||
if (subLetra) {
|
||||
clave = `p${numPregunta}_${subLetra}_${idRenglon}`
|
||||
}
|
||||
|
||||
resultado[clave] = valor
|
||||
}
|
||||
} else {
|
||||
// NO ES UNA TABLA => ES UNA PREGUNTA NORMAL
|
||||
// Buscamos su definición para obtener el numeroPregunta
|
||||
const preguntaDef = this.formulario.preguntas.find(p => p.id === key)
|
||||
if (!preguntaDef) {
|
||||
// No se encontró la definición (caso raro)
|
||||
continue
|
||||
}
|
||||
|
||||
const numPregunta = preguntaDef.numeroPregunta
|
||||
|
||||
// Creamos algo como `p2`, `p5`, etc.
|
||||
const clave = `p${numPregunta}`
|
||||
resultado[clave] = respuestas[key]
|
||||
}
|
||||
}
|
||||
|
||||
return resultado
|
||||
},
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
|
||||
<!-- respuestas de cuestionario formulario2
|
||||
todas las preguntas se guardan correctamente
|
||||
{
|
||||
"p3_A_1": "Deficiente",
|
||||
"p3_A_2": "Deficiente",
|
||||
"p3_A_3": "Deficiente",
|
||||
"p3_A_4": "Deficiente",
|
||||
"p3_B_1": "Básico",
|
||||
"p3_B_2": "Básico",
|
||||
"p3_B_3": "Básico",
|
||||
"p3_B_4": "Básico",
|
||||
"p3_C_1": "Intermedio",
|
||||
"p3_C_2": "Intermedio",
|
||||
"p3_C_3": "Intermedio",
|
||||
"p3_C_4": "Intermedio",
|
||||
"p3_C_5": "Intermedio",
|
||||
"p3_D_1": "Destacado",
|
||||
"p3_D_2": "Destacado",
|
||||
"p3_D_3": "Destacado",
|
||||
"p3_D_4": "Destacado",
|
||||
"p3_D_5": "Destacado",
|
||||
"p3_E_1": "Deficiente",
|
||||
"p1": "respuesta1",
|
||||
"p2": "Excelente",
|
||||
"p4": "respuesta4",
|
||||
"p5": "Sí",
|
||||
"p6": "respuesta 6"
|
||||
} -->
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- respuestas de cuestionario formulario alumno
|
||||
|
||||
|
||||
{
|
||||
"p12_A_1": "Deficiente",
|
||||
"p12_A_2": "Deficiente",
|
||||
"p12_A_3": "Deficiente",
|
||||
"p12_A_4": "Deficiente",
|
||||
"p12_B_1": "Básico",
|
||||
"p12_B_2": "Básico",
|
||||
"p12_B_3": "Básico",
|
||||
"p12_B_4": "Básico",
|
||||
"p12_C_1": "Intermedio",
|
||||
"p12_C_2": "Intermedio",
|
||||
"p12_C_3": "Intermedio",
|
||||
"p12_C_4": "Intermedio",
|
||||
"p10_1": "si",
|
||||
"p10_2": "si",
|
||||
"p10_3": "si",
|
||||
"p11_1": "Nunca",
|
||||
"p11_2": "Rara vez",
|
||||
"p11_3": "Algunas veces",
|
||||
"p11_4": "Siempre",
|
||||
"p17_1": "si",
|
||||
"p17_2": "no",
|
||||
"p17_3": "si",
|
||||
"p3_1": "si",
|
||||
"p3_2": "si",
|
||||
"p3_3": "si",
|
||||
"p3_4": "si",
|
||||
"p12_D_1": "Destacado",
|
||||
"p12_D_2": "Destacado",
|
||||
"p12_D_3": "Destacado",
|
||||
"p12_D_4": "Destacado",
|
||||
"p12_D_5": "Destacado",
|
||||
"p1": [
|
||||
"Dependencia de la UNAM",
|
||||
"Asesoría académica",
|
||||
"Oportunidad de desarrollo de tesis"
|
||||
],
|
||||
"p2": "Deficiente",
|
||||
"p4": "No",
|
||||
"p5": "respuesta5",
|
||||
"p6": "Sí",
|
||||
"p7": "Sí",
|
||||
"p8": "respuesta8",
|
||||
"p9": "Sí",
|
||||
"p13": "Responsable directo del programa",
|
||||
"p14": "Se te otorgó de acuerdo a lo establecido",
|
||||
"p15": "Sí",
|
||||
"p16": "respuesta 16",
|
||||
"p18": "respuesta18"
|
||||
}
|
||||
|
||||
|
||||
-->
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,951 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<!-- <h1 class="text-center mb-4">{{ formulario.titulo }}</h1>
|
||||
<p class="text-center">{{ formulario.descripcion }}</p> -->
|
||||
|
||||
|
||||
<div >
|
||||
<div v-for="(item, index) in sortedItems" :key="item.id || item.idTabla" class="mb-4 mt-6">
|
||||
<div v-if="item.tipo" class="mt-6">
|
||||
|
||||
<label :for="item.id" class="form-label">{{ item.numeroPregunta }}. {{ item.texto }}</label>
|
||||
|
||||
<div v-if="item.tipo === 'seleccionUnica'" :key="item.id">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<!-- :id="item.id" -->
|
||||
<b-radio
|
||||
v-model="respuestas[item.id]"
|
||||
:key="item.id + '-' + opcion"
|
||||
:native-value="opcion"
|
||||
type="is-info"
|
||||
@change="updateRespuestas(item.id, opcion)"
|
||||
>
|
||||
{{ opcion }}
|
||||
</b-radio>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div v-if="item.tipo === 'seleccionMultiple'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<input
|
||||
class="checkb"
|
||||
type="checkbox"
|
||||
:value="opcion"
|
||||
|
||||
|
||||
:checked="respuestas[item.id].includes(opcion)"
|
||||
@change="toggleSelection(item.id, opcion, $event)"
|
||||
|
||||
/>
|
||||
{{ opcion }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- v-model="respuestas[item.id]" -->
|
||||
<div v-if="item.tipo === 'texto'">
|
||||
<b-input
|
||||
:id="item.id"
|
||||
v-model="respuestas[item.id]"
|
||||
placeholder="Escribe tu respuesta aquí"
|
||||
></b-input>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- <h3 class="mb-3">{{ item.numeroPregunta }}. {{ item.preguntaTabla }}</h3>
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">{{ item.subPreguntaTabla }}</h5>
|
||||
-->
|
||||
|
||||
<template v-if="index === 0 || item.numeroPregunta !== sortedItems[index - 1].numeroPregunta">
|
||||
<h3 class="mb-3">
|
||||
{{ item.numeroPregunta }}. {{ item.preguntaTabla }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<!-- Subtítulo (h5) siempre que exista -->
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">
|
||||
{{ item.subPreguntaTabla }}
|
||||
</h5>
|
||||
|
||||
<table class="table table-bordered text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="opcion in item.renglones[0].opciones" :key="opcion">{{ opcion }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="renglon in item.renglones" :key="renglon.idRenglon">
|
||||
<td>{{ renglon.textoRenglon }}</td>
|
||||
<td v-for="opcion in renglon.opciones" :key="opcion">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`tabla-${item.idTabla}-renglon-${renglon.idRenglon}`"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.idTabla][renglon.idRenglon]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="my-6 mb-6" >
|
||||
<b-field class="centro">
|
||||
<button
|
||||
class="button is-success is-medium"
|
||||
@click="() => { submitForm() }"
|
||||
:disabled="!isFormComplete"
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</b-field>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
import axios from 'axios'
|
||||
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
respuestas: {}, // Inicialización para almacenar las respuestas
|
||||
|
||||
formulario: {
|
||||
titulo: '2025 Evaluación del Universitario(a)',
|
||||
descripcion:
|
||||
'Te invitamos a compartir tu experiencia respecto al programa de servicio social en el que participaste. Tus respuestas son confidenciales.',
|
||||
preguntas: [
|
||||
{
|
||||
id: 'criterios',
|
||||
tipo: 'seleccionMultiple',
|
||||
numeroPregunta:1,
|
||||
texto:
|
||||
'Señala los tres principales criterios que utilizaste para seleccionar el programa de servicio social',
|
||||
opciones: [
|
||||
|
||||
|
||||
'Actividades adscritas al programa',
|
||||
'Apoyo económico',
|
||||
'Asesoría académica',
|
||||
'Dependencia de la UNAM',
|
||||
'Flexibilidad en horarios',
|
||||
'Institución del sector público',
|
||||
'Institución del sector social',
|
||||
'Invitación de profesores',
|
||||
'Modalidad de titulación por servicio social',
|
||||
'Objetivo del programa',
|
||||
'Oportunidad de desarrollo de tesis',
|
||||
'Prestigio de la institución',
|
||||
'Recomendación de compañeros',
|
||||
|
||||
],
|
||||
},
|
||||
{
|
||||
numeroPregunta:2,
|
||||
id: 'inscripcion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Cómo evalúas tu proceso de inscripción?',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
{
|
||||
numeroPregunta:4,
|
||||
id: 'actividades',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Las actividades que realizaste fueron acordes a lo descrito en el programa?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:5,
|
||||
id: 'actividadesComentarios2',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'En caso de que las actividades que realizaste hayan sido distintas a las descritas en el programa, enlistas ¿Cuáles fueron?',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
{
|
||||
numeroPregunta:6,
|
||||
id: 'espacioFisico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto:
|
||||
'¿Contaste con un espacio físico adecuado para realizar tus actividades?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:7,
|
||||
id: 'instalaciones',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'Las instalaciones en las que te desempeñaste, contaban con condiciones adecuadas para la realización de las actividades que te encomendaron',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta:8,
|
||||
id: 'instalacionesComentarios',
|
||||
tipo: 'texto',
|
||||
texto: 'Si respondiste NO, ¿Por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'instalaciones',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
{
|
||||
numeroPregunta:9,
|
||||
id: 'materialProporcionado',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿La institución te proporciono material/equipo necesario para el desempeño de tus actividades?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
|
||||
{
|
||||
numeroPregunta:13,
|
||||
id: 'supervisor',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Quién asesoró y supervisó las actividades que realizaste?',
|
||||
opciones: [
|
||||
|
||||
|
||||
'Coordinador administrativo del programa',
|
||||
'Responsable directo del programa',
|
||||
'Alguien diferente a los dos anteriores',
|
||||
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
numeroPregunta:14,
|
||||
id: 'apoyoEconomico',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: 'El apoyo económico señalado en el programa...',
|
||||
opciones: [
|
||||
'Se te otorgó de acuerdo a lo establecido',
|
||||
'Fue condicionado',
|
||||
'Se te proporcionó solo una parte',
|
||||
],
|
||||
},
|
||||
{
|
||||
numeroPregunta:15,
|
||||
id: 'recomendacion',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Recomendarías el programa en que participaste?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
numeroPregunta:16,
|
||||
id: 'actividadesComentarios3',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'¿Por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
numeroPregunta:18,
|
||||
id: 'actividadesComentarios1',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'Enlista los conocimiento o habilidades que te ayudarían a un mejor desempeño para tu actividad profesional a futuro',
|
||||
condicional: {
|
||||
preguntaId: 'actividades',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
|
||||
tablas: [
|
||||
|
||||
|
||||
{
|
||||
idTabla: 130,
|
||||
preguntaTabla: '¿En la entidad o programa donde realizaste tu servicio social recibiste…?',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 3,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Asesoría',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Acompañamiento',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Supervisión',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Seguimiento',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 104,
|
||||
preguntaTabla: 'El trato que recibiste fue:',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 10,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Profesional',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Amable',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Respetuoso',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 105,
|
||||
preguntaTabla: 'En tu servicio social…',
|
||||
subPreguntaTabla: '',
|
||||
numeroPregunta: 11,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Aplicaste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Desarrollaste habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Enriqueciste conocimientos',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Fortaleciste tus habilidades',
|
||||
opciones: ['Nunca', 'Rara vez', 'Algunas veces','Regularmente', 'Siempre'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
idTabla: 106,
|
||||
preguntaTabla: 'Con respecto a la plataforma SIASSyPP web.',
|
||||
subPreguntaTabla: 'La información que te proporcionaron sobre los programas fue:',
|
||||
numeroPregunta: 17,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Adecuada',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Suficiente',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Actualizada',
|
||||
opciones: ['si', 'no'],
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 101,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'A. Habilidades personales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Puntualidad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Eficiencia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Organización',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Eficacia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
idTabla: 102,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'B. Habilidades profesionales ',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Disposición',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Proactivo/anticipación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Propositivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Resolutivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
{
|
||||
idTabla: 103,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'C. Habilidades sociales',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Empatía',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Trabajo en equipo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Comunicación asertiva',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Receptividad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Tolerancia a la frustación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
idTabla: 1042,
|
||||
preguntaTabla: 'Evalúa tu propio desempeño en el servicio social en relación con',
|
||||
subPreguntaTabla: 'D. Conocimientos',
|
||||
numeroPregunta: 12,
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Conocimientos teóricos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Conocimientos metodológicos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Pensamiento critico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Formación académica general',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Uso tecnológico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.respuestas = this.respuestas || {};
|
||||
|
||||
this.formulario.preguntas.forEach((pregunta) => {
|
||||
if (!(pregunta.id in this.respuestas)) { // Solo inicializa si no existe
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
this.$set(this.respuestas, pregunta.id, []);
|
||||
} else {
|
||||
this.$set(this.respuestas, pregunta.id, null); // Usa null en lugar de ''
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
if (!(tabla.idTabla in this.respuestas)) {
|
||||
this.$set(this.respuestas, tabla.idTabla, {});
|
||||
}
|
||||
|
||||
tabla.renglones.forEach((renglon) => {
|
||||
if (!(renglon.idRenglon in this.respuestas[tabla.idTabla])) {
|
||||
this.$set(this.respuestas[tabla.idTabla], renglon.idRenglon, null);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
|
||||
watch: {
|
||||
respuestas: {
|
||||
handler(newVal) {
|
||||
console.log("Estado actualizado de respuestas:", newVal);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
computed: {
|
||||
sortedItems() {
|
||||
const items = [...this.formulario.preguntas, ...this.formulario.tablas]
|
||||
return items.sort((a, b) => {
|
||||
if (a.numeroPregunta === b.numeroPregunta) {
|
||||
return (a.idTabla || 0) - (b.idTabla || 0)
|
||||
}
|
||||
return a.numeroPregunta - b.numeroPregunta
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
isFormComplete() {
|
||||
// Verifica todas las preguntas individuales
|
||||
const allQuestionsAnswered = this.formulario.preguntas.every((pregunta) => {
|
||||
const respuesta = this.respuestas[pregunta.id];
|
||||
if (pregunta.tipo === "seleccionMultiple") {
|
||||
return respuesta && respuesta.length > 0; // Debe tener al menos una opción seleccionada
|
||||
}
|
||||
return respuesta !== null && respuesta !== ""; // No debe ser null ni vacío
|
||||
});
|
||||
|
||||
// Verifica todas las respuestas de la tabla
|
||||
const allTablesAnswered = this.formulario.tablas.every((tabla) => {
|
||||
return tabla.renglones.every((renglon) => {
|
||||
return this.respuestas[tabla.idTabla] && this.respuestas[tabla.idTabla][renglon.idRenglon] !== null;
|
||||
});
|
||||
});
|
||||
|
||||
return allQuestionsAnswered && allTablesAnswered;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
toggleSelection(id, opcion, event) {
|
||||
let selectedOptions = this.respuestas[id];
|
||||
|
||||
if (selectedOptions.includes(opcion)) {
|
||||
// Si ya está seleccionada, se deselecciona
|
||||
this.respuestas[id] = selectedOptions.filter(opt => opt !== opcion);
|
||||
} else {
|
||||
if (selectedOptions.length < 3) {
|
||||
// Si hay espacio, se agrega la opción
|
||||
this.respuestas[id].push(opcion);
|
||||
} else {
|
||||
// Evita la selección de más de 3 opciones
|
||||
event.preventDefault();
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Límite alcanzado",
|
||||
message: "Solo puedes seleccionar hasta 3 opciones.",
|
||||
type: "is-warning",
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
limitSelection(id, opcion, event) {
|
||||
if (this.respuestas[id].length >= 3 && !this.respuestas[id].includes(opcion)) {
|
||||
// Evita que se seleccione la opción adicional
|
||||
event.preventDefault();
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Límite alcanzado",
|
||||
message: "Solo puedes seleccionar hasta 3 opciones.",
|
||||
type: "is-warning",
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
updateRespuestas(id, valor) {
|
||||
this.$set(this.respuestas, id, valor);
|
||||
console.log("Radio seleccionado:", id, valor);
|
||||
},
|
||||
|
||||
validateResponses() {
|
||||
for (const pregunta of this.formulario.preguntas) {
|
||||
const respuesta = this.respuestas[pregunta.id];
|
||||
|
||||
// Verifica que no haya respuestas vacías
|
||||
if (respuesta === null || respuesta === "") {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, responde la pregunta: "${pregunta.texto}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
// Para selección múltiple, al menos un elemento debe estar seleccionado
|
||||
if (pregunta.tipo === "seleccionMultiple" && (!respuesta || respuesta.length === 0)) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, selecciona al menos una opción en: "${pregunta.texto}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
// Validación adicional si la pregunta es de texto (evitar respuestas peligrosas)
|
||||
if (pregunta.tipo === "texto" && respuesta.length > 500) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `La respuesta de la pregunta "${pregunta.texto}" es demasiado larga.`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// Verifica que todas las respuestas en las tablas estén completas
|
||||
for (const tabla of this.formulario.tablas) {
|
||||
for (const renglon of tabla.renglones) {
|
||||
const respuesta = this.respuestas[tabla.idTabla]?.[renglon.idRenglon];
|
||||
|
||||
if (respuesta === null) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: `Por favor, responde la pregunta en la tabla: "${tabla.preguntaTabla}" en la fila "${renglon.textoRenglon}"`,
|
||||
type: "is-danger",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
submitForm() {
|
||||
|
||||
|
||||
if (!this.validateResponses()) return; // Detiene el envío si la validación falla
|
||||
console.log('Respuestas a enviar:', this.respuestas)
|
||||
//alert('Formulario enviado. Gracias por tu participación.')
|
||||
|
||||
|
||||
// Aquí formateamos las respuestas
|
||||
const respuestaFormateada = this.formatearRespuestas(this.respuestas)
|
||||
console.log('Respuestas formateadas:', respuestaFormateada)
|
||||
// this.sendAnswers(respuestaFormateada)
|
||||
|
||||
|
||||
|
||||
let data = { ...respuestaFormateada,
|
||||
idServicio: localStorage.getItem('idServicio'), // 4,
|
||||
p1: 'respuesta1 - trabajando para que sea una string',
|
||||
}
|
||||
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token
|
||||
)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
// this.error(error.response.data.message)
|
||||
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: "Error",
|
||||
message: error.response?.data?.message || "Error al enviar el formulario",
|
||||
type: "is-danger",
|
||||
});
|
||||
|
||||
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
formatearRespuestas(respuestas) {
|
||||
// Objeto final a devolver
|
||||
const resultado = {}
|
||||
|
||||
// Recorremos todas las claves de "respuestas"
|
||||
for (const key in respuestas) {
|
||||
// Verificamos si es un ID de tabla (numérico) o un ID de pregunta (string)
|
||||
const esTabla = !isNaN(Number(key)) // true si la clave se puede convertir a número
|
||||
|
||||
if (esTabla) {
|
||||
// 1) BUSCAMOS LA DEFINICIÓN DE LA TABLA
|
||||
const idTabla = parseInt(key, 10)
|
||||
const tablaDef = this.formulario.tablas.find(t => t.idTabla === idTabla)
|
||||
if (!tablaDef) {
|
||||
// Si no se encontró la tabla, continuamos
|
||||
continue
|
||||
}
|
||||
|
||||
// 2) OBTENEMOS EL NÚMERO DE PREGUNTA Y, OPCIONALMENTE, LA LETRA (A, B, C...)
|
||||
const numPregunta = tablaDef.numeroPregunta
|
||||
|
||||
// Si quieres “sacar” la letra (A, B, C…) de algo como "A. Habilidades sociales"
|
||||
// Se puede hacer un match sencillo al principio
|
||||
let subLetra = ''
|
||||
if (tablaDef.subPreguntaTabla) {
|
||||
// Ejemplo: "A. Habilidades personales"
|
||||
const coincidencia = tablaDef.subPreguntaTabla.match(/^([A-E])\./)
|
||||
if (coincidencia) {
|
||||
subLetra = coincidencia[1] // 'A', 'B', 'C', etc.
|
||||
}
|
||||
}
|
||||
|
||||
// 3) LUEGO RECORREMOS LAS RESPUESTAS DE LA TABLA (por cada idRenglon)
|
||||
const respuestasTabla = respuestas[key] // p.ej: { "1": "Deficiente", "2": "Básico", ... }
|
||||
for (const idRenglon in respuestasTabla) {
|
||||
const valor = respuestasTabla[idRenglon]
|
||||
|
||||
// Formamos la clave final.
|
||||
// Si hay subLetra, hacemos `p3_A_1`. Sino, solo `p3_1`.
|
||||
let clave = `p${numPregunta}_${idRenglon}`
|
||||
if (subLetra) {
|
||||
clave = `p${numPregunta}_${subLetra}_${idRenglon}`
|
||||
}
|
||||
|
||||
resultado[clave] = valor
|
||||
}
|
||||
} else {
|
||||
// NO ES UNA TABLA => ES UNA PREGUNTA NORMAL
|
||||
// Buscamos su definición para obtener el numeroPregunta
|
||||
const preguntaDef = this.formulario.preguntas.find(p => p.id === key)
|
||||
if (!preguntaDef) {
|
||||
// No se encontró la definición (caso raro)
|
||||
continue
|
||||
}
|
||||
|
||||
const numPregunta = preguntaDef.numeroPregunta
|
||||
|
||||
// Creamos algo como `p2`, `p5`, etc.
|
||||
const clave = `p${numPregunta}`
|
||||
resultado[clave] = respuestas[key]
|
||||
}
|
||||
}
|
||||
|
||||
return resultado
|
||||
},
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- respuestas de cuestionario formulario2
|
||||
todas las preguntas se guardan correctamente
|
||||
{
|
||||
"p3_A_1": "Deficiente",
|
||||
"p3_A_2": "Deficiente",
|
||||
"p3_A_3": "Deficiente",
|
||||
"p3_A_4": "Deficiente",
|
||||
"p3_B_1": "Básico",
|
||||
"p3_B_2": "Básico",
|
||||
"p3_B_3": "Básico",
|
||||
"p3_B_4": "Básico",
|
||||
"p3_C_1": "Intermedio",
|
||||
"p3_C_2": "Intermedio",
|
||||
"p3_C_3": "Intermedio",
|
||||
"p3_C_4": "Intermedio",
|
||||
"p3_C_5": "Intermedio",
|
||||
"p3_D_1": "Destacado",
|
||||
"p3_D_2": "Destacado",
|
||||
"p3_D_3": "Destacado",
|
||||
"p3_D_4": "Destacado",
|
||||
"p3_D_5": "Destacado",
|
||||
"p3_E_1": "Deficiente",
|
||||
"p1": "respuesta1",
|
||||
"p2": "Excelente",
|
||||
"p4": "respuesta4",
|
||||
"p5": "Sí",
|
||||
"p6": "respuesta 6"
|
||||
} -->
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- respuestas de cuestionario formulario alumno
|
||||
|
||||
|
||||
{
|
||||
"p12_A_1": "Deficiente",
|
||||
"p12_A_2": "Deficiente",
|
||||
"p12_A_3": "Deficiente",
|
||||
"p12_A_4": "Deficiente",
|
||||
"p12_B_1": "Básico",
|
||||
"p12_B_2": "Básico",
|
||||
"p12_B_3": "Básico",
|
||||
"p12_B_4": "Básico",
|
||||
"p12_C_1": "Intermedio",
|
||||
"p12_C_2": "Intermedio",
|
||||
"p12_C_3": "Intermedio",
|
||||
"p12_C_4": "Intermedio",
|
||||
"p10_1": "si",
|
||||
"p10_2": "si",
|
||||
"p10_3": "si",
|
||||
"p11_1": "Nunca",
|
||||
"p11_2": "Rara vez",
|
||||
"p11_3": "Algunas veces",
|
||||
"p11_4": "Siempre",
|
||||
"p17_1": "si",
|
||||
"p17_2": "no",
|
||||
"p17_3": "si",
|
||||
"p3_1": "si",
|
||||
"p3_2": "si",
|
||||
"p3_3": "si",
|
||||
"p3_4": "si",
|
||||
"p12_D_1": "Destacado",
|
||||
"p12_D_2": "Destacado",
|
||||
"p12_D_3": "Destacado",
|
||||
"p12_D_4": "Destacado",
|
||||
"p12_D_5": "Destacado",
|
||||
"p1": [
|
||||
"Dependencia de la UNAM",
|
||||
"Asesoría académica",
|
||||
"Oportunidad de desarrollo de tesis"
|
||||
],
|
||||
"p2": "Deficiente",
|
||||
"p4": "No",
|
||||
"p5": "respuesta5",
|
||||
"p6": "Sí",
|
||||
"p7": "Sí",
|
||||
"p8": "respuesta8",
|
||||
"p9": "Sí",
|
||||
"p13": "Responsable directo del programa",
|
||||
"p14": "Se te otorgó de acuerdo a lo establecido",
|
||||
"p15": "Sí",
|
||||
"p16": "respuesta 16",
|
||||
"p18": "respuesta18"
|
||||
}
|
||||
|
||||
|
||||
-->
|
||||
@@ -4,7 +4,10 @@
|
||||
Cuestionario de evaluación del programa de servicio social.
|
||||
</h3>
|
||||
|
||||
<b-field class="mb-6" v-if="!servicio.idCuestionarioAlumno">
|
||||
<b-field
|
||||
class="mb-6"
|
||||
v-if="!servicio.idCuestionarioAlumno && !servicio.idCuestionarioAlumno2"
|
||||
>
|
||||
<b-button
|
||||
type="is-info is-light"
|
||||
tag="router-link"
|
||||
|
||||
@@ -37,7 +37,7 @@ export default {
|
||||
!localStorage.getItem('token')
|
||||
)
|
||||
this.cerrarSesion()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,618 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<!-- Notificación flotante sin botón de cierre -->
|
||||
<b-notification
|
||||
v-if="pendingItems.length && !isMobile"
|
||||
type="is-warning"
|
||||
class="notification-floating"
|
||||
aria-close-label="Not applicable"
|
||||
:closable="false"
|
||||
>
|
||||
<p><strong>Te faltan contestar:</strong></p>
|
||||
<ul>
|
||||
<li v-for="(item, idx) in pendingItems" :key="idx">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</b-notification>
|
||||
|
||||
<div>
|
||||
<div
|
||||
v-for="(item, index) in sortedItems"
|
||||
:key="item.id || item.idTabla"
|
||||
class="mb-6"
|
||||
v-if="isItemVisible(item)"
|
||||
>
|
||||
<!-- PREGUNTAS (texto, selección única, selección múltiple) -->
|
||||
<div v-if="item.tipo" class="mt-6">
|
||||
<label :for="item.id" class="form-label">
|
||||
{{ item.numeroPregunta }}. {{ item.texto }}
|
||||
</label>
|
||||
|
||||
<!-- Selección Única -->
|
||||
<div v-if="item.tipo === 'seleccionUnica'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<b-radio
|
||||
v-model="respuestas[item.id]"
|
||||
:id="item.id"
|
||||
:native-value="opcion"
|
||||
type="is-info"
|
||||
>
|
||||
{{ opcion }}
|
||||
</b-radio>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Selección Múltiple -->
|
||||
<div v-if="item.tipo === 'seleccionMultiple'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<input
|
||||
class="checkb"
|
||||
type="checkbox"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.id]"
|
||||
/>
|
||||
{{ opcion }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Texto -->
|
||||
<div v-if="item.tipo === 'texto'">
|
||||
<b-input
|
||||
:id="item.id"
|
||||
v-model="respuestas[item.id]"
|
||||
|
||||
:maxlength="item.limite"
|
||||
show-counter
|
||||
placeholder="Escribe tu respuesta aquí"
|
||||
></b-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TABLAS -->
|
||||
<div class="table-responsive" v-else>
|
||||
<template
|
||||
v-if="
|
||||
index === 0 ||
|
||||
item.numeroPregunta !== sortedItems[index - 1].numeroPregunta
|
||||
"
|
||||
>
|
||||
<h3 class="mb-3">
|
||||
{{ item.numeroPregunta }}. {{ item.preguntaTabla }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">
|
||||
{{ item.subPreguntaTabla }}
|
||||
</h5>
|
||||
|
||||
<table class="table table-bordered text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="opcion in item.renglones[0].opciones" :key="opcion">
|
||||
{{ opcion }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="renglon in item.renglones" :key="renglon.idRenglon">
|
||||
<td>{{ renglon.textoRenglon }}</td>
|
||||
<td v-for="opcion in renglon.opciones" :key="opcion">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`tabla-${item.idTabla}-renglon-${renglon.idRenglon}`"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.idTabla][renglon.idRenglon]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- BOTÓN ENVIAR -->
|
||||
<div class="my-6 mb-6">
|
||||
<b-field class="centro">
|
||||
<button
|
||||
class="button is-success is-medium"
|
||||
@click="submitForm"
|
||||
:disabled="!isFormComplete"
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</b-field>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
|
||||
|
||||
props: {
|
||||
idServicio: { type: Number, required: true },
|
||||
responsable: { type: Object, required: true },
|
||||
imprimirError: { type: Function, required: true },
|
||||
imprimirMensaje: { type: Function, required: true },
|
||||
imprimirWarning: { type: Function, required: true },
|
||||
updateIsLoading: { type: Function, required: true },
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
respuestas: {},
|
||||
|
||||
formulario: {
|
||||
titulo:
|
||||
'2025 Evaluación de la institución receptora de servicio social',
|
||||
descripcion: `Estimado(a) responsable de programa de servicio social:
|
||||
Te solicitamos llenar cuidadosamente los campos solicitados a continuación para poder
|
||||
validar el término del servicio social de nuestro alumno(a).
|
||||
|
||||
Los datos están sujetos al aviso de privacidad integral que se puede consultar en el sitio web: www.acatlan.unam.mx/normatividad`,
|
||||
|
||||
preguntas: [
|
||||
{
|
||||
numeroPregunta: 1,
|
||||
id: 'actividadesUniversitario',
|
||||
tipo: 'texto',
|
||||
limite: 200,
|
||||
texto:
|
||||
'Mencione las principales actividades que realizó el/la universitario(a) en su programa de servicio social',
|
||||
},
|
||||
{
|
||||
numeroPregunta: 2,
|
||||
id: 'calificacionGeneral',
|
||||
tipo: 'seleccionUnica',
|
||||
texto:
|
||||
'Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
opciones: ['Excelente', 'Bueno', 'Regular', 'Deficiente'],
|
||||
},
|
||||
{
|
||||
numeroPregunta: 4,
|
||||
id: 'cursosComplementarios',
|
||||
tipo: 'texto',
|
||||
limite: 200,
|
||||
texto:
|
||||
'¿Qué cursos considera que complementarían la formación de nuestros egresados?',
|
||||
},
|
||||
{
|
||||
numeroPregunta: 5,
|
||||
id: 'contratariaFuturo',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Considera contratar en un futuro al universitario(a)?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta: 6,
|
||||
id: 'porqueNoContrataria',
|
||||
tipo: 'texto',
|
||||
limite: 200,
|
||||
texto:
|
||||
'Si su respuesta a la pregunta anterior fue NO, comente ¿por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'contratariaFuturo',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
tablas: [
|
||||
// ----- PREGUNTA 3, dividida en sub-secciones A, B, C, D ------
|
||||
{
|
||||
idTabla: 301,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'Haciendo una evaluación general, ¿Cómo Califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'A. Habilidades personales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Puntualidad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Eficiencia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Organizado',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Eficacia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 302,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'B. Habilidades profesionales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Disposición',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Proactivo/anticipación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Propositivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Resolutivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 303,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'C. Habilidades sociales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Empatía',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Trabajo en equipo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Comunicación asertiva',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Receptividad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Tolerancia a la frustración',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 304,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'D. Conocimientos',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Conocimientos teóricos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Conocimientos metodológicos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Pensamiento crítico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Formación académica general',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Uso tecnológico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
// Inicializa las respuestas de cada pregunta
|
||||
this.formulario.preguntas.forEach((pregunta) => {
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
this.$set(this.respuestas, pregunta.id, [])
|
||||
} else {
|
||||
this.$set(this.respuestas, pregunta.id, '')
|
||||
}
|
||||
})
|
||||
|
||||
// Inicializa las respuestas para cada tabla
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
this.$set(this.respuestas, tabla.idTabla, {})
|
||||
tabla.renglones.forEach((renglon) => {
|
||||
this.$set(this.respuestas[tabla.idTabla], renglon.idRenglon, null)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
computed: {
|
||||
|
||||
|
||||
isMobile() {
|
||||
return window.innerWidth < 576
|
||||
},
|
||||
|
||||
|
||||
// Combina preguntas y tablas en un array ordenado
|
||||
sortedItems() {
|
||||
const items = [...this.formulario.preguntas, ...this.formulario.tablas]
|
||||
return items.sort((a, b) => {
|
||||
if (a.numeroPregunta === b.numeroPregunta) {
|
||||
return (a.idTabla || 0) - (b.idTabla || 0)
|
||||
}
|
||||
return a.numeroPregunta - b.numeroPregunta
|
||||
})
|
||||
},
|
||||
|
||||
// Determina los ítems (preguntas/tablas) que siguen pendientes
|
||||
pendingItems() {
|
||||
let missing = []
|
||||
|
||||
// Revisar preguntas (solo las que estén visibles)
|
||||
this.formulario.preguntas.forEach((p) => {
|
||||
if (!this.isItemVisible(p)) return
|
||||
const answer = this.respuestas[p.id]
|
||||
let answered = false
|
||||
|
||||
if (p.tipo === 'seleccionMultiple') {
|
||||
answered = answer && answer.length > 0
|
||||
} else {
|
||||
answered = answer !== null && answer !== ''
|
||||
}
|
||||
|
||||
if (!answered) {
|
||||
missing.push(`Pregunta ${p.numeroPregunta}`)
|
||||
}
|
||||
})
|
||||
|
||||
// Revisar tablas
|
||||
this.formulario.tablas.forEach((t) => {
|
||||
let allAnswered = t.renglones.every(
|
||||
(r) =>
|
||||
this.respuestas[t.idTabla] &&
|
||||
this.respuestas[t.idTabla][r.idRenglon] !== null
|
||||
)
|
||||
if (!allAnswered) {
|
||||
missing.push(`Tabla ${t.numeroPregunta}`)
|
||||
}
|
||||
})
|
||||
|
||||
return missing
|
||||
},
|
||||
|
||||
// El formulario se considera completo si no hay ítems pendientes
|
||||
isFormComplete() {
|
||||
return this.pendingItems.length === 0
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
// Determina si un item (pregunta/tabla) debe mostrarse (condicional)
|
||||
isItemVisible(item) {
|
||||
if (item.condicional) {
|
||||
// Checa la respuesta de la pregunta 'preguntaId'
|
||||
const respuestaCond = this.respuestas[item.condicional.preguntaId]
|
||||
return respuestaCond === item.condicional.valor
|
||||
}
|
||||
return true
|
||||
},
|
||||
|
||||
submitForm() {
|
||||
if (!this.validateResponses()) {
|
||||
return
|
||||
}
|
||||
|
||||
console.log("tokens", this.responsable.token );
|
||||
|
||||
console.log('Respuestas enviadas:', this.respuestas)
|
||||
|
||||
// Convertir a formato p1, p2, p3_A_1, etc.
|
||||
const respuestaFormateada = this.formatearRespuestas(this.respuestas)
|
||||
console.log('Respuestas formateadas:', respuestaFormateada)
|
||||
|
||||
let data = {
|
||||
...respuestaFormateada,
|
||||
idServicio: localStorage.getItem('idServicio'),
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
this.isLoading = true
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_programa`, data , this.responsable.token)
|
||||
.then(() => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message:
|
||||
error.response?.data?.message || 'Error al enviar el formulario',
|
||||
type: 'is-danger',
|
||||
})
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
// Valida que las preguntas y tablas visibles estén contestadas
|
||||
validateResponses() {
|
||||
// Validar preguntas
|
||||
for (const pregunta of this.formulario.preguntas) {
|
||||
if (!this.isItemVisible(pregunta)) continue
|
||||
|
||||
const respuesta = this.respuestas[pregunta.id]
|
||||
|
||||
// Verifica que no esté vacía
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
if (!respuesta || respuesta.length === 0) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, selecciona al menos una opción en la pregunta ${pregunta.numeroPregunta}.`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
} else {
|
||||
if (respuesta === null || respuesta === '') {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, responde la pregunta ${pregunta.numeroPregunta}.`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// Si es texto y excede 500 caracteres
|
||||
if (pregunta.tipo === 'texto' && respuesta.length > 500) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `La respuesta de la pregunta ${pregunta.numeroPregunta} es demasiado larga (máx. 500 caracteres).`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// Validar tablas
|
||||
for (const tabla of this.formulario.tablas) {
|
||||
for (const renglon of tabla.renglones) {
|
||||
const respRenglon = this.respuestas[tabla.idTabla]?.[renglon.idRenglon]
|
||||
if (respRenglon === null) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, responde la tabla ${tabla.numeroPregunta}, fila "${renglon.textoRenglon}".`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
||||
// Convierte las respuestas en formato { p1: ..., p3_A_1: ..., etc. }
|
||||
formatearRespuestas(respuestas) {
|
||||
const resultado = {}
|
||||
|
||||
for (const key in respuestas) {
|
||||
const esTabla = !isNaN(Number(key))
|
||||
if (esTabla) {
|
||||
// Es una tabla
|
||||
const idTabla = parseInt(key, 10)
|
||||
const tablaDef = this.formulario.tablas.find(
|
||||
(t) => t.idTabla === idTabla
|
||||
)
|
||||
if (!tablaDef) continue
|
||||
|
||||
const numPregunta = tablaDef.numeroPregunta
|
||||
let subLetra = ''
|
||||
if (tablaDef.subPreguntaTabla) {
|
||||
const match = tablaDef.subPreguntaTabla.match(/^([A-E])\./)
|
||||
if (match) subLetra = match[1]
|
||||
}
|
||||
|
||||
const respuestasTabla = respuestas[key]
|
||||
for (const idRenglon in respuestasTabla) {
|
||||
const valor = respuestasTabla[idRenglon]
|
||||
let clave = `p${numPregunta}_${idRenglon}`
|
||||
if (subLetra) {
|
||||
clave = `p${numPregunta}_${subLetra}_${idRenglon}`
|
||||
}
|
||||
resultado[clave] = valor
|
||||
}
|
||||
} else {
|
||||
// Es una pregunta normal
|
||||
const preguntaDef = this.formulario.preguntas.find(
|
||||
(p) => p.id === key
|
||||
)
|
||||
if (!preguntaDef) continue
|
||||
|
||||
const numPregunta = preguntaDef.numeroPregunta
|
||||
const clave = `p${numPregunta}`
|
||||
resultado[clave] = respuestas[key]
|
||||
}
|
||||
}
|
||||
|
||||
return resultado
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* Notificación flotante en parte inferior derecha, sin botón de cerrar */
|
||||
.notification-floating {
|
||||
position: fixed !important;
|
||||
bottom: 2rem;
|
||||
right: 2rem;
|
||||
z-index: 9999;
|
||||
max-width: 350px;
|
||||
width: auto; /* o 90% si prefieres */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Ajustes en pantallas pequeñas (ej. < 480px) */
|
||||
@media (max-width: 480px) {
|
||||
.notification-floating {
|
||||
right: 1rem;
|
||||
left: 1rem; /* Opcional: para centrar la notificación */
|
||||
bottom: 1rem;
|
||||
max-width: none; /* Para que no se limite a 350px */
|
||||
width: auto; /* O 90%, como prefieras */
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.table-responsive {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,680 @@
|
||||
<template>
|
||||
<div class="container mt-5">
|
||||
<!--
|
||||
<h1 class="text-center mb-4">{{ formulario.titulo }}</h1>
|
||||
<p class="text-center">{{ formulario.descripcion }}</p> -->
|
||||
|
||||
<div>
|
||||
<div
|
||||
v-for="(item, index) in sortedItems"
|
||||
:key="item.id || item.idTabla"
|
||||
class="mb-6"
|
||||
>
|
||||
<div v-if="item.tipo" class="mt-6">
|
||||
<label :for="item.id" class="form-label"
|
||||
>{{ item.numeroPregunta }}. {{ item.texto }}</label
|
||||
>
|
||||
<div v-if="item.tipo === 'seleccionUnica'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<b-radio
|
||||
v-model="respuestas[item.id]"
|
||||
:id="item.id"
|
||||
:native-value="opcion"
|
||||
type="is-info"
|
||||
>
|
||||
{{ opcion }}
|
||||
</b-radio>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.tipo === 'seleccionMultiple'">
|
||||
<div v-for="opcion in item.opciones" :key="opcion" class="SINO">
|
||||
<input
|
||||
class="checkb"
|
||||
type="checkbox"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.id]"
|
||||
/>
|
||||
|
||||
{{ opcion }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.tipo === 'texto'">
|
||||
<b-input
|
||||
:id="item.id"
|
||||
v-model="respuestas[item.id]"
|
||||
placeholder="Escribe tu respuesta aquí"
|
||||
></b-input>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- <h3 class="mb-3">{{ item.numeroPregunta }}. {{ item.preguntaTabla }}</h3>
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">{{ item.subPreguntaTabla }}</h5>
|
||||
-->
|
||||
|
||||
<template
|
||||
v-if="
|
||||
index === 0 ||
|
||||
item.numeroPregunta !== sortedItems[index - 1].numeroPregunta
|
||||
"
|
||||
>
|
||||
<h3 class="mb-3">
|
||||
{{ item.numeroPregunta }}. {{ item.preguntaTabla }}
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<!-- Subtítulo (h5) siempre que exista -->
|
||||
<h5 v-if="item.subPreguntaTabla" class="mb-3">
|
||||
{{ item.subPreguntaTabla }}
|
||||
</h5>
|
||||
|
||||
<table class="table table-bordered text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th v-for="opcion in item.renglones[0].opciones" :key="opcion">
|
||||
{{ opcion }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="renglon in item.renglones" :key="renglon.idRenglon">
|
||||
<td>{{ renglon.textoRenglon }}</td>
|
||||
<td v-for="opcion in renglon.opciones" :key="opcion">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`tabla-${item.idTabla}-renglon-${renglon.idRenglon}`"
|
||||
:value="opcion"
|
||||
v-model="respuestas[item.idTabla][renglon.idRenglon]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-6 mb-6">
|
||||
<b-field class="centro">
|
||||
<button
|
||||
class="button is-success is-medium"
|
||||
@click="() => {submitForm()}"
|
||||
:disabled="!isFormComplete"
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</b-field>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
respuestas: {}, // Inicialización para almacenar las respuestas
|
||||
|
||||
formulario: {
|
||||
titulo:
|
||||
'2025 Evaluación de la institución receptora de servicio social',
|
||||
descripcion: `Estimado(a) responsable de programa de servicio social:
|
||||
Te solicitamos llenar cuidadosamente los campos solicitados a continuación para poder
|
||||
validar el término del servicio social de nuestro alumno(a).
|
||||
|
||||
|
||||
Los datos están sujetos al aviso de privacidad integral que se puede consultar en el sitio web: www.acatlan.unam.mx/normatividad`,
|
||||
|
||||
preguntas: [
|
||||
{
|
||||
numeroPregunta: 1,
|
||||
id: 'actividadesUniversitario',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'Mencione las principales actividades que realizó el/la universitario(a) en su programa de servicio social',
|
||||
},
|
||||
{
|
||||
numeroPregunta: 2,
|
||||
id: 'calificacionGeneral',
|
||||
tipo: 'seleccionUnica',
|
||||
texto:
|
||||
'Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
opciones: ['Excelente', 'Bueno', 'Regular', 'Deficiente'],
|
||||
},
|
||||
{
|
||||
numeroPregunta: 4,
|
||||
id: 'cursosComplementarios',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'¿Qué cursos considera que complementarían la formación de nuestros egresados?',
|
||||
},
|
||||
{
|
||||
numeroPregunta: 5,
|
||||
id: 'contratariaFuturo',
|
||||
tipo: 'seleccionUnica',
|
||||
texto: '¿Considera contratar en un futuro al universitario(a)?',
|
||||
opciones: ['Sí', 'No'],
|
||||
},
|
||||
{
|
||||
numeroPregunta: 6,
|
||||
id: 'porqueNoContrataria',
|
||||
tipo: 'texto',
|
||||
texto:
|
||||
'Si su respuesta a la pregunta anterior fue NO, comente ¿por qué?',
|
||||
condicional: {
|
||||
preguntaId: 'contratariaFuturo',
|
||||
valor: 'No',
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
tablas: [
|
||||
// ----- PREGUNTA 3, dividida en sub-secciones A, B, C, D, E ------
|
||||
{
|
||||
idTabla: 301,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'Haciendo una evaluación general, ¿Cómo Califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'A. Habilidades personales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Puntualidad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Eficiencia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Organizado',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Eficacia',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 302,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'B. Habilidades profesionales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Disposición',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Proactivo/anticipación',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Propositivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Resolutivo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 303,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'C. Habilidades sociales',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Empatía',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Trabajo en equipo',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Comunicación asertiva',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Receptividad',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Tolerancia a la frustración',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idTabla: 304,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'D. Conocimientos',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Conocimientos teóricos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 2,
|
||||
textoRenglon: 'Conocimientos metodológicos',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 3,
|
||||
textoRenglon: 'Pensamiento crítico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 4,
|
||||
textoRenglon: 'Formación académica general',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
{
|
||||
idRenglon: 5,
|
||||
textoRenglon: 'Uso tecnológico',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
},
|
||||
/* {
|
||||
idTabla: 305,
|
||||
numeroPregunta: 3,
|
||||
preguntaTabla:
|
||||
'3. Haciendo una evaluación general, ¿Cómo califica el desempeño del universitario(a)?',
|
||||
subPreguntaTabla: 'E. Otro',
|
||||
renglones: [
|
||||
{
|
||||
idRenglon: 1,
|
||||
textoRenglon: 'Otro',
|
||||
opciones: ['Deficiente', 'Básico', 'Intermedio', 'Destacado'],
|
||||
},
|
||||
],
|
||||
}, */
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
/* created() {
|
||||
// Inicializa las respuestas vacías para cada pregunta
|
||||
this.formulario.preguntas.forEach((pregunta) => {
|
||||
if (pregunta.tipo === 'evaluacion') {
|
||||
this.respuestas[pregunta.id] = {}
|
||||
pregunta.categorias.forEach((categoria) => {
|
||||
categoria.items.forEach((item) => {
|
||||
this.respuestas[pregunta.id][item] = ''
|
||||
})
|
||||
})
|
||||
} else if (
|
||||
pregunta.tipo === 'checkbox' ||
|
||||
pregunta.tipo === 'seleccionMultiple'
|
||||
) {
|
||||
this.respuestas[pregunta.id] = []
|
||||
} else {
|
||||
this.respuestas[pregunta.id] = ''
|
||||
}
|
||||
})
|
||||
|
||||
// Inicializa respuestas para cada tabla
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
this.$set(this.respuestas, tabla.idTabla, {}); // Asegura que exista respuestas[tabla.idTabla]
|
||||
tabla.renglones.forEach((renglon) => {
|
||||
this.$set(this.respuestas[tabla.idTabla], renglon.idRenglon, null); // Asegura que exista respuestas[tabla.idTabla][renglon.idRenglon]
|
||||
});
|
||||
});
|
||||
}, */
|
||||
|
||||
created() {
|
||||
this.formulario.preguntas.forEach((pregunta) => {
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
this.$set(this.respuestas, pregunta.id, []) // Inicializar correctamente selección múltiple
|
||||
} else {
|
||||
this.$set(this.respuestas, pregunta.id, '') // Otras preguntas como texto o selección única
|
||||
}
|
||||
})
|
||||
|
||||
// Inicializa respuestas para cada tabla
|
||||
this.formulario.tablas.forEach((tabla) => {
|
||||
this.$set(this.respuestas, tabla.idTabla, {})
|
||||
tabla.renglones.forEach((renglon) => {
|
||||
this.$set(this.respuestas[tabla.idTabla], renglon.idRenglon, null)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
computed: {
|
||||
sortedItems() {
|
||||
const items = [...this.formulario.preguntas, ...this.formulario.tablas]
|
||||
return items.sort((a, b) => {
|
||||
if (a.numeroPregunta === b.numeroPregunta) {
|
||||
return (a.idTabla || 0) - (b.idTabla || 0)
|
||||
}
|
||||
return a.numeroPregunta - b.numeroPregunta
|
||||
})
|
||||
},
|
||||
|
||||
isFormComplete() {
|
||||
// Verifica todas las preguntas individuales
|
||||
const allQuestionsAnswered = this.formulario.preguntas.every(
|
||||
(pregunta) => {
|
||||
const respuesta = this.respuestas[pregunta.id]
|
||||
if (pregunta.tipo === 'seleccionMultiple') {
|
||||
return respuesta && respuesta.length > 0 // Debe tener al menos una opción seleccionada
|
||||
}
|
||||
return respuesta !== null && respuesta !== '' // No debe ser null ni vacío
|
||||
}
|
||||
)
|
||||
|
||||
// Verifica todas las respuestas de la tabla
|
||||
const allTablesAnswered = this.formulario.tablas.every((tabla) => {
|
||||
return tabla.renglones.every((renglon) => {
|
||||
return (
|
||||
this.respuestas[tabla.idTabla] &&
|
||||
this.respuestas[tabla.idTabla][renglon.idRenglon] !== null
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
return allQuestionsAnswered && allTablesAnswered
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
if (!this.validateResponses()) {
|
||||
return // Detiene el envío si la validación falla
|
||||
}
|
||||
|
||||
console.log('Respuestas enviadas:', this.respuestas)
|
||||
//alert('Formulario enviado. Gracias por tu participación.')
|
||||
|
||||
// Aquí formateamos las respuestas
|
||||
const respuestaFormateada = this.formatearRespuestas(this.respuestas)
|
||||
console.log('Respuestas formateadas:', respuestaFormateada)
|
||||
|
||||
// this.sendAnswers(respuestaFormateada)
|
||||
|
||||
let data = {
|
||||
...respuestaFormateada,
|
||||
idServicio: localStorage.getItem('idServicio'),
|
||||
p1: 'respuesta1 - trabajando para que sea una string',
|
||||
}
|
||||
|
||||
axios
|
||||
.post(
|
||||
`${process.env.api}/cuestionario_programa`,
|
||||
data ,
|
||||
this.token
|
||||
)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
// this.error(error.response.data.message)
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message:
|
||||
error.response?.data?.message || 'Error al enviar el formulario',
|
||||
type: 'is-danger',
|
||||
})
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
formatearRespuestas(respuestas) {
|
||||
// Objeto final a devolver
|
||||
const resultado = {}
|
||||
|
||||
// Recorremos todas las claves de "respuestas"
|
||||
for (const key in respuestas) {
|
||||
// Verificamos si es un ID de tabla (numérico) o un ID de pregunta (string)
|
||||
const esTabla = !isNaN(Number(key)) // true si la clave se puede convertir a número
|
||||
|
||||
if (esTabla) {
|
||||
// 1) BUSCAMOS LA DEFINICIÓN DE LA TABLA
|
||||
const idTabla = parseInt(key, 10)
|
||||
const tablaDef = this.formulario.tablas.find(
|
||||
(t) => t.idTabla === idTabla
|
||||
)
|
||||
if (!tablaDef) {
|
||||
// Si no se encontró la tabla, continuamos
|
||||
continue
|
||||
}
|
||||
|
||||
// 2) OBTENEMOS EL NÚMERO DE PREGUNTA Y, OPCIONALMENTE, LA LETRA (A, B, C...)
|
||||
const numPregunta = tablaDef.numeroPregunta
|
||||
|
||||
// Si quieres “sacar” la letra (A, B, C…) de algo como "A. Habilidades sociales"
|
||||
// Se puede hacer un match sencillo al principio
|
||||
let subLetra = ''
|
||||
if (tablaDef.subPreguntaTabla) {
|
||||
// Ejemplo: "A. Habilidades personales"
|
||||
const coincidencia = tablaDef.subPreguntaTabla.match(/^([A-E])\./)
|
||||
if (coincidencia) {
|
||||
subLetra = coincidencia[1] // 'A', 'B', 'C', etc.
|
||||
}
|
||||
}
|
||||
|
||||
// 3) LUEGO RECORREMOS LAS RESPUESTAS DE LA TABLA (por cada idRenglon)
|
||||
const respuestasTabla = respuestas[key] // p.ej: { "1": "Deficiente", "2": "Básico", ... }
|
||||
for (const idRenglon in respuestasTabla) {
|
||||
const valor = respuestasTabla[idRenglon]
|
||||
|
||||
// Formamos la clave final.
|
||||
// Si hay subLetra, hacemos `p3_A_1`. Sino, solo `p3_1`.
|
||||
let clave = `p${numPregunta}_${idRenglon}`
|
||||
if (subLetra) {
|
||||
clave = `p${numPregunta}_${subLetra}_${idRenglon}`
|
||||
}
|
||||
|
||||
resultado[clave] = valor
|
||||
}
|
||||
} else {
|
||||
// NO ES UNA TABLA => ES UNA PREGUNTA NORMAL
|
||||
// Buscamos su definición para obtener el numeroPregunta
|
||||
const preguntaDef = this.formulario.preguntas.find(
|
||||
(p) => p.id === key
|
||||
)
|
||||
if (!preguntaDef) {
|
||||
// No se encontró la definición (caso raro)
|
||||
continue
|
||||
}
|
||||
|
||||
const numPregunta = preguntaDef.numeroPregunta
|
||||
|
||||
// Creamos algo como `p2`, `p5`, etc.
|
||||
const clave = `p${numPregunta}`
|
||||
resultado[clave] = respuestas[key]
|
||||
}
|
||||
}
|
||||
|
||||
return resultado
|
||||
},
|
||||
|
||||
validateResponses() {
|
||||
for (const pregunta of this.formulario.preguntas) {
|
||||
const respuesta = this.respuestas[pregunta.id]
|
||||
|
||||
// Verifica que no haya respuestas vacías
|
||||
if (respuesta === null || respuesta === '') {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, responde la pregunta: "${pregunta.texto}"`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
// Para selección múltiple, al menos un elemento debe estar seleccionado
|
||||
if (
|
||||
pregunta.tipo === 'seleccionMultiple' &&
|
||||
(!respuesta || respuesta.length === 0)
|
||||
) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, selecciona al menos una opción en: "${pregunta.texto}"`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
// Validación adicional si la pregunta es de texto (evitar respuestas peligrosas)
|
||||
if (pregunta.tipo === 'texto' && respuesta.length > 500) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `La respuesta de la pregunta "${pregunta.texto}" es demasiado larga.`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// Verifica que todas las respuestas en las tablas estén completas
|
||||
for (const tabla of this.formulario.tablas) {
|
||||
for (const renglon of tabla.renglones) {
|
||||
const respuesta = this.respuestas[tabla.idTabla]?.[renglon.idRenglon]
|
||||
|
||||
if (respuesta === null) {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: `Por favor, responde la pregunta en la tabla: "${tabla.preguntaTabla}" en la fila "${renglon.textoRenglon}"`,
|
||||
type: 'is-danger',
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
||||
updateRespuestas(id, valor) {
|
||||
this.$set(this.respuestas, id, valor)
|
||||
console.log('Radio seleccionado:', id, valor)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- respuestas de cuestionario formulario2
|
||||
todas las preguntas se guardan correctamente
|
||||
{
|
||||
"p3_A_1": "Deficiente",
|
||||
"p3_A_2": "Deficiente",
|
||||
"p3_A_3": "Deficiente",
|
||||
"p3_A_4": "Deficiente",
|
||||
"p3_B_1": "Básico",
|
||||
"p3_B_2": "Básico",
|
||||
"p3_B_3": "Básico",
|
||||
"p3_B_4": "Básico",
|
||||
"p3_C_1": "Intermedio",
|
||||
"p3_C_2": "Intermedio",
|
||||
"p3_C_3": "Intermedio",
|
||||
"p3_C_4": "Intermedio",
|
||||
"p3_C_5": "Intermedio",
|
||||
"p3_D_1": "Destacado",
|
||||
"p3_D_2": "Destacado",
|
||||
"p3_D_3": "Destacado",
|
||||
"p3_D_4": "Destacado",
|
||||
"p3_D_5": "Destacado",
|
||||
"p3_E_1": "Deficiente",
|
||||
"p1": "respuesta1",
|
||||
"p2": "Excelente",
|
||||
"p4": "respuesta4",
|
||||
"p5": "Sí",
|
||||
"p6": "respuesta 6"
|
||||
} -->
|
||||
|
||||
<!-- respuestas de cuestionario formulario alumno
|
||||
|
||||
|
||||
{
|
||||
"p12_A_1": "Deficiente",
|
||||
"p12_A_2": "Deficiente",
|
||||
"p12_A_3": "Deficiente",
|
||||
"p12_A_4": "Deficiente",
|
||||
"p12_B_1": "Básico",
|
||||
"p12_B_2": "Básico",
|
||||
"p12_B_3": "Básico",
|
||||
"p12_B_4": "Básico",
|
||||
"p12_C_1": "Intermedio",
|
||||
"p12_C_2": "Intermedio",
|
||||
"p12_C_3": "Intermedio",
|
||||
"p12_C_4": "Intermedio",
|
||||
"p10_1": "si",
|
||||
"p10_2": "si",
|
||||
"p10_3": "si",
|
||||
"p11_1": "Nunca",
|
||||
"p11_2": "Rara vez",
|
||||
"p11_3": "Algunas veces",
|
||||
"p11_4": "Siempre",
|
||||
"p17_1": "si",
|
||||
"p17_2": "no",
|
||||
"p17_3": "si",
|
||||
"p3_1": "si",
|
||||
"p3_2": "si",
|
||||
"p3_3": "si",
|
||||
"p3_4": "si",
|
||||
"p12_D_1": "Destacado",
|
||||
"p12_D_2": "Destacado",
|
||||
"p12_D_3": "Destacado",
|
||||
"p12_D_4": "Destacado",
|
||||
"p12_D_5": "Destacado",
|
||||
"p1": [
|
||||
"Dependencia de la UNAM",
|
||||
"Asesoría académica",
|
||||
"Oportunidad de desarrollo de tesis"
|
||||
],
|
||||
"p2": "Deficiente",
|
||||
"p4": "No",
|
||||
"p5": "respuesta5",
|
||||
"p6": "Sí",
|
||||
"p7": "Sí",
|
||||
"p8": "respuesta8",
|
||||
"p9": "Sí",
|
||||
"p13": "Responsable directo del programa",
|
||||
"p14": "Se te otorgó de acuerdo a lo establecido",
|
||||
"p15": "Sí",
|
||||
"p16": "respuesta 16",
|
||||
"p18": "respuesta18"
|
||||
}
|
||||
|
||||
|
||||
-->
|
||||
+3
-3
@@ -24,9 +24,9 @@ export default {
|
||||
axios: {},
|
||||
build: {},
|
||||
env: {
|
||||
// api: 'http://localhost:3000',
|
||||
//api: 'http://localhost:3000',
|
||||
// api: "https://890af9d598a4.ngrok.io"
|
||||
api: 'https://venus.acatlan.unam.mx/ss-pruebas',
|
||||
// api: 'https://venus.acatlan.unam.mx/serviciosocial',
|
||||
//api: 'https://venus.acatlan.unam.mx/ss-pruebas',
|
||||
api: 'https://venus.acatlan.unam.mx/serviciosocial',
|
||||
},
|
||||
}
|
||||
|
||||
@@ -42,11 +42,11 @@
|
||||
/>
|
||||
|
||||
<div>
|
||||
<p v-if="alumno.idCuestionarioPrograma" class="my-4">
|
||||
<p v-if="alumno.idCuestionarioPrograma || alumno.idCuestionarioPrograma2" class="my-4">
|
||||
<strong> Cuenta con cuestionario de programa resuelto. </strong>
|
||||
</p>
|
||||
|
||||
<p v-if="alumno.idCuestionarioAlumno" class="my-4">
|
||||
<p v-if="alumno.idCuestionarioAlumno || alumno.idCuestionarioAlumno2" class="my-4">
|
||||
<strong> Cuenta con cuestionario de alumno resuelto. </strong>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
+383
-371
@@ -1,384 +1,396 @@
|
||||
<template>
|
||||
<section class="container my-5 px-3">
|
||||
<div v-if="idCuestionario === 'null'">
|
||||
<BotonRegresar path="/alumno" />
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">Evaluación de programas de servicio social</p>
|
||||
<section class="container my-5 px-3">
|
||||
<div v-if="idCuestionario === 'null'">
|
||||
<BotonRegresar path="/alumno" />
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">2025 evaluación del universitario(a) sobre su servicio social</p>
|
||||
|
||||
<p>
|
||||
Te invitamos a compartir tu experiencia respecto del programa de
|
||||
servicio social en el que participaste, a efecto de mejorar la oferta
|
||||
de programas disponibles para los alumnos que desean liberar este
|
||||
requisito. Te recordamos qe tus respues son confidenciales.
|
||||
Te invitamos a compartir tu experiencia respecto del programa de servicio social en el que
|
||||
participaste, a efecto de mejorar la oferta de programas disponibles para los alumnos que
|
||||
desean liberar este requisito. Te recordamos que tus respuestas son confidenciales.
|
||||
Los datos están sujetos al aviso de privacidad integral que se puede consultar en el sitio
|
||||
web: <a
|
||||
href="https://www.acatlan.unam.mx/normatividad"
|
||||
class="column "
|
||||
target="_blank"> www.acatlan.unam.mx/normatividad </a>
|
||||
</p>
|
||||
</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" /> -->
|
||||
|
||||
<parteA v-show="current == 1" v-on:childAToParent="onChildA" />
|
||||
<FullCuestionario />
|
||||
|
||||
<parteB v-show="current == 2" v-on:childBToParent="onChildB" />
|
||||
</div>
|
||||
|
||||
<div v-else class="vh">
|
||||
<h2>Ya has contestado tu cuestionario :)</h2>
|
||||
</div>
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
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'
|
||||
|
||||
<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">
|
||||
<h2>Ya has contestado tu cuestionario :)</h2>
|
||||
</div>
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
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: {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
import FullCuestionario from '@/components/alumno/cuestionario2/FullCuestionario'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
parteA,
|
||||
parteB,
|
||||
parteC,
|
||||
parteD,
|
||||
parteE,
|
||||
parteF,
|
||||
navCues,
|
||||
BotonRegresar,
|
||||
FullCuestionario
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
token: {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
},
|
||||
},
|
||||
isLoading: false,
|
||||
current: 1,
|
||||
idCuestionario: "null",
|
||||
answers: {
|
||||
sexo: '',
|
||||
edad: '',
|
||||
servicioMedico: '',
|
||||
servicioMedicoOtro: '',
|
||||
servicioMedicoAux: '',
|
||||
p1: '',
|
||||
p2: '',
|
||||
p3: [], // selecciona 3 opciones
|
||||
p3Otro: '',
|
||||
p4: '',
|
||||
p5: [],
|
||||
p6: '',
|
||||
p7: '',
|
||||
p8: [],
|
||||
p9: '',
|
||||
p10: '',
|
||||
p11: '',
|
||||
p12: '',
|
||||
p13: '',
|
||||
p14: [],
|
||||
p15: [],
|
||||
p16: '',
|
||||
p17: [],
|
||||
p18: '',
|
||||
p19: '',
|
||||
p20: '',
|
||||
p21: [],
|
||||
p22: [],
|
||||
p23: [],
|
||||
p24: [],
|
||||
p25: '',
|
||||
p26: '',
|
||||
p27: '',
|
||||
p28: null,
|
||||
p29: null,
|
||||
p30: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChildA(value) {
|
||||
this.answers.servicioMedico = value.servicioMedico
|
||||
this.answers.sexo = value.sexo
|
||||
this.answers.edad = value.edad
|
||||
},
|
||||
isLoading: false,
|
||||
current: 1,
|
||||
idCuestionario: '',
|
||||
answers: {
|
||||
sexo: '',
|
||||
edad: '',
|
||||
servicioMedico: '',
|
||||
servicioMedicoOtro: '',
|
||||
servicioMedicoAux: '',
|
||||
p1: '',
|
||||
p2: '',
|
||||
p3: [], // selecciona 3 opciones
|
||||
p3Otro: '',
|
||||
p4: '',
|
||||
p5: [],
|
||||
p6: '',
|
||||
p7: '',
|
||||
p8: [],
|
||||
p9: '',
|
||||
p10: '',
|
||||
p11: '',
|
||||
p12: '',
|
||||
p13: '',
|
||||
p14: [],
|
||||
p15: [],
|
||||
p16: '',
|
||||
p17: [],
|
||||
p18: '',
|
||||
p19: '',
|
||||
p20: '',
|
||||
p21: [],
|
||||
p22: [],
|
||||
p23: [],
|
||||
p24: [],
|
||||
p25: '',
|
||||
p26: '',
|
||||
p27: '',
|
||||
p28: null,
|
||||
p29: null,
|
||||
p30: '',
|
||||
onChildB(value) {
|
||||
this.answers.p1 = value.p1
|
||||
this.answers.p2 = value.p2
|
||||
this.answers.p3 = value.p3
|
||||
this.answers.p3Otro = value.p3Otro
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChildA(value) {
|
||||
this.answers.servicioMedico = value.servicioMedico
|
||||
this.answers.sexo = value.sexo
|
||||
this.answers.edad = value.edad
|
||||
},
|
||||
onChildB(value) {
|
||||
this.answers.p1 = value.p1
|
||||
this.answers.p2 = value.p2
|
||||
this.answers.p3 = value.p3
|
||||
this.answers.p3Otro = value.p3Otro
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildD(value) {
|
||||
this.answers.p14 = value.p14
|
||||
this.answers.p15 = value.p15
|
||||
this.answers.p16 = value.p16
|
||||
this.answers.p17 = value.p17
|
||||
},
|
||||
onChildE(value) {
|
||||
this.answers.p18 = value.p18
|
||||
this.answers.p19 = value.p19
|
||||
this.answers.p20 = value.p20
|
||||
this.answers.p21 = value.p21
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildNAV(value) {
|
||||
this.current = value
|
||||
},
|
||||
error(msj) {
|
||||
let salir = false
|
||||
switch (msj) {
|
||||
case 'invalid signature':
|
||||
msj = 'Tu token no es valido, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt expired':
|
||||
msj = 'Tu sesión ha expirado, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt malformed':
|
||||
msj = 'No se encontro tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'No hay token':
|
||||
msj = 'Ocurrio un error al enviar tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
}
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: msj,
|
||||
type: 'is-danger',
|
||||
hasIcon: true,
|
||||
icon: 'alert-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
if (salir == true) {
|
||||
localStorage.clear()
|
||||
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,
|
||||
p1: this.answers.p1,
|
||||
p2: this.answers.p2,
|
||||
p3: this.answers.p3,
|
||||
p4: this.answers.p4,
|
||||
p5: this.answers.p5,
|
||||
p6: this.answers.p6,
|
||||
p7: this.answers.p7,
|
||||
p8: this.answers.p8,
|
||||
p9: this.answers.p9,
|
||||
p10: this.answers.p10,
|
||||
p11: this.answers.p11,
|
||||
p12: this.answers.p12,
|
||||
p13: this.answers.p13,
|
||||
p14: this.answers.p14,
|
||||
p15: this.answers.p15,
|
||||
p16: this.answers.p16,
|
||||
p17: this.answers.p17,
|
||||
p18: this.answers.p18,
|
||||
p19: this.answers.p19,
|
||||
p20: this.answers.p20,
|
||||
p21: this.answers.p21,
|
||||
p22: this.answers.p22,
|
||||
p23: this.answers.p23,
|
||||
p24: this.answers.p24,
|
||||
p25: this.answers.p25,
|
||||
p26: this.answers.p26,
|
||||
p27: this.answers.p27,
|
||||
p28: this.answers.p28,
|
||||
p29: this.answers.p29,
|
||||
p30: this.answers.p30,
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: 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
|
||||
},
|
||||
onChildD(value) {
|
||||
this.answers.p14 = value.p14
|
||||
this.answers.p15 = value.p15
|
||||
this.answers.p16 = value.p16
|
||||
this.answers.p17 = value.p17
|
||||
},
|
||||
onChildE(value) {
|
||||
this.answers.p18 = value.p18
|
||||
this.answers.p19 = value.p19
|
||||
this.answers.p20 = value.p20
|
||||
this.answers.p21 = value.p21
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildNAV(value) {
|
||||
this.current = value
|
||||
},
|
||||
error(msj) {
|
||||
let salir = false
|
||||
switch (msj) {
|
||||
case 'invalid signature':
|
||||
msj = 'Tu token no es valido, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt expired':
|
||||
msj = 'Tu sesión ha expirado, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt malformed':
|
||||
msj = 'No se encontro tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'No hay token':
|
||||
msj = 'Ocurrio un error al enviar tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
}
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: msj,
|
||||
type: 'is-danger',
|
||||
hasIcon: true,
|
||||
icon: 'alert-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
if (salir == true) {
|
||||
localStorage.clear()
|
||||
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,
|
||||
p1: this.answers.p1,
|
||||
p2: this.answers.p2,
|
||||
p3: this.answers.p3,
|
||||
p4: this.answers.p4,
|
||||
p5: this.answers.p5,
|
||||
p6: this.answers.p6,
|
||||
p7: this.answers.p7,
|
||||
p8: this.answers.p8,
|
||||
p9: this.answers.p9,
|
||||
p10: this.answers.p10,
|
||||
p11: this.answers.p11,
|
||||
p12: this.answers.p12,
|
||||
p13: this.answers.p13,
|
||||
p14: this.answers.p14,
|
||||
p15: this.answers.p15,
|
||||
p16: this.answers.p16,
|
||||
p17: this.answers.p17,
|
||||
p18: this.answers.p18,
|
||||
p19: this.answers.p19,
|
||||
p20: this.answers.p20,
|
||||
p21: this.answers.p21,
|
||||
p22: this.answers.p22,
|
||||
p23: this.answers.p23,
|
||||
p24: this.answers.p24,
|
||||
p25: this.answers.p25,
|
||||
p26: this.answers.p26,
|
||||
p27: this.answers.p27,
|
||||
p28: this.answers.p28,
|
||||
p29: this.answers.p29,
|
||||
p30: this.answers.p30,
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.error(error.response.data.message)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
.catch((error) => {
|
||||
this.error(error.response.data.message)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.idCuestionario = localStorage.getItem('idCuestionarioAlumno')
|
||||
},
|
||||
// data() {
|
||||
// return {
|
||||
// admin: {},
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// imprimirError(err = {}, title = '¡Hubo un error!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-danger',
|
||||
// title,
|
||||
// message: err.message,
|
||||
// confirmText: 'Entendido',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'alert-octagon',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// if (err.err && err.err === 'token error') {
|
||||
// localStorage.clear()
|
||||
// this.$router.push('/')
|
||||
// }
|
||||
// },
|
||||
// imprimirMensaje(message, title = '¡Felicidades!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-success',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Ok',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'check-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// },
|
||||
// imprimirWarning(
|
||||
// message,
|
||||
// onConfirm = () => {},
|
||||
// title = '¡Espera un minuto!',
|
||||
// onCancel = () => {}
|
||||
// ) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-warning',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Confirmar',
|
||||
// canCancel: true,
|
||||
// cancelText: 'Cancelar',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'help-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// onCancel: () => onCancel(),
|
||||
// })
|
||||
// },
|
||||
// getLocalhostInfo() {
|
||||
// this.admin.idUsuario = Number(localStorage.getItem('idUsuario'))
|
||||
// this.admin.idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
|
||||
// this.admin.tipoUsuario = localStorage.getItem('tipoUsuario')
|
||||
// this.admin.token = {
|
||||
// headers: {
|
||||
// token: localStorage.getItem('token'),
|
||||
// },
|
||||
// }
|
||||
// },
|
||||
// },
|
||||
// created() {
|
||||
// this.getLocalhostInfo()
|
||||
// if (this.admin.idTipoUsuario === 1) this.$router.push('/admin')
|
||||
// if (this.admin.idTipoUsuario === 2) this.$router.push('/responsable')
|
||||
// if (this.admin.idTipoUsuario === 4) this.$router.push('/casoEspecial')
|
||||
// },
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
/* mounted() {
|
||||
this.idCuestionario = localStorage.getItem('idCuestionarioAlumno')
|
||||
}, */
|
||||
// data() {
|
||||
// return {
|
||||
// admin: {},
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// imprimirError(err = {}, title = '¡Hubo un error!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-danger',
|
||||
// title,
|
||||
// message: err.message,
|
||||
// confirmText: 'Entendido',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'alert-octagon',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// if (err.err && err.err === 'token error') {
|
||||
// localStorage.clear()
|
||||
// this.$router.push('/')
|
||||
// }
|
||||
// },
|
||||
// imprimirMensaje(message, title = '¡Felicidades!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-success',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Ok',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'check-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// },
|
||||
// imprimirWarning(
|
||||
// message,
|
||||
// onConfirm = () => {},
|
||||
// title = '¡Espera un minuto!',
|
||||
// onCancel = () => {}
|
||||
// ) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-warning',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Confirmar',
|
||||
// canCancel: true,
|
||||
// cancelText: 'Cancelar',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'help-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// onCancel: () => onCancel(),
|
||||
// })
|
||||
// },
|
||||
// getLocalhostInfo() {
|
||||
// this.admin.idUsuario = Number(localStorage.getItem('idUsuario'))
|
||||
// this.admin.idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
|
||||
// this.admin.tipoUsuario = localStorage.getItem('tipoUsuario')
|
||||
// this.admin.token = {
|
||||
// headers: {
|
||||
// token: localStorage.getItem('token'),
|
||||
// },
|
||||
// }
|
||||
// },
|
||||
// },
|
||||
// created() {
|
||||
// this.getLocalhostInfo()
|
||||
// if (this.admin.idTipoUsuario === 1) this.$router.push('/admin')
|
||||
// if (this.admin.idTipoUsuario === 2) this.$router.push('/responsable')
|
||||
// if (this.admin.idTipoUsuario === 4) this.$router.push('/casoEspecial')
|
||||
// },
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,384 @@
|
||||
<template>
|
||||
<section class="container my-5 px-3">
|
||||
<div v-if="idCuestionario === 'null'">
|
||||
<BotonRegresar path="/alumno" />
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">Evaluación de programas de servicio social</p>
|
||||
|
||||
<p>
|
||||
Te invitamos a compartir tu experiencia respecto del programa de
|
||||
servicio social en el que participaste, a efecto de mejorar la oferta
|
||||
de programas disponibles para los alumnos que desean liberar este
|
||||
requisito. Te recordamos qe tus respues son confidenciales.
|
||||
</p>
|
||||
</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">
|
||||
<h2>Ya has contestado tu cuestionario :)</h2>
|
||||
</div>
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
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: {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
},
|
||||
},
|
||||
isLoading: false,
|
||||
current: 1,
|
||||
idCuestionario: '',
|
||||
answers: {
|
||||
sexo: '',
|
||||
edad: '',
|
||||
servicioMedico: '',
|
||||
servicioMedicoOtro: '',
|
||||
servicioMedicoAux: '',
|
||||
p1: '',
|
||||
p2: '',
|
||||
p3: [], // selecciona 3 opciones
|
||||
p3Otro: '',
|
||||
p4: '',
|
||||
p5: [],
|
||||
p6: '',
|
||||
p7: '',
|
||||
p8: [],
|
||||
p9: '',
|
||||
p10: '',
|
||||
p11: '',
|
||||
p12: '',
|
||||
p13: '',
|
||||
p14: [],
|
||||
p15: [],
|
||||
p16: '',
|
||||
p17: [],
|
||||
p18: '',
|
||||
p19: '',
|
||||
p20: '',
|
||||
p21: [],
|
||||
p22: [],
|
||||
p23: [],
|
||||
p24: [],
|
||||
p25: '',
|
||||
p26: '',
|
||||
p27: '',
|
||||
p28: null,
|
||||
p29: null,
|
||||
p30: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChildA(value) {
|
||||
this.answers.servicioMedico = value.servicioMedico
|
||||
this.answers.sexo = value.sexo
|
||||
this.answers.edad = value.edad
|
||||
},
|
||||
onChildB(value) {
|
||||
this.answers.p1 = value.p1
|
||||
this.answers.p2 = value.p2
|
||||
this.answers.p3 = value.p3
|
||||
this.answers.p3Otro = value.p3Otro
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildD(value) {
|
||||
this.answers.p14 = value.p14
|
||||
this.answers.p15 = value.p15
|
||||
this.answers.p16 = value.p16
|
||||
this.answers.p17 = value.p17
|
||||
},
|
||||
onChildE(value) {
|
||||
this.answers.p18 = value.p18
|
||||
this.answers.p19 = value.p19
|
||||
this.answers.p20 = value.p20
|
||||
this.answers.p21 = value.p21
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildNAV(value) {
|
||||
this.current = value
|
||||
},
|
||||
error(msj) {
|
||||
let salir = false
|
||||
switch (msj) {
|
||||
case 'invalid signature':
|
||||
msj = 'Tu token no es valido, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt expired':
|
||||
msj = 'Tu sesión ha expirado, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt malformed':
|
||||
msj = 'No se encontro tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'No hay token':
|
||||
msj = 'Ocurrio un error al enviar tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
}
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: msj,
|
||||
type: 'is-danger',
|
||||
hasIcon: true,
|
||||
icon: 'alert-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
if (salir == true) {
|
||||
localStorage.clear()
|
||||
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,
|
||||
p1: this.answers.p1,
|
||||
p2: this.answers.p2,
|
||||
p3: this.answers.p3,
|
||||
p4: this.answers.p4,
|
||||
p5: this.answers.p5,
|
||||
p6: this.answers.p6,
|
||||
p7: this.answers.p7,
|
||||
p8: this.answers.p8,
|
||||
p9: this.answers.p9,
|
||||
p10: this.answers.p10,
|
||||
p11: this.answers.p11,
|
||||
p12: this.answers.p12,
|
||||
p13: this.answers.p13,
|
||||
p14: this.answers.p14,
|
||||
p15: this.answers.p15,
|
||||
p16: this.answers.p16,
|
||||
p17: this.answers.p17,
|
||||
p18: this.answers.p18,
|
||||
p19: this.answers.p19,
|
||||
p20: this.answers.p20,
|
||||
p21: this.answers.p21,
|
||||
p22: this.answers.p22,
|
||||
p23: this.answers.p23,
|
||||
p24: this.answers.p24,
|
||||
p25: this.answers.p25,
|
||||
p26: this.answers.p26,
|
||||
p27: this.answers.p27,
|
||||
p28: this.answers.p28,
|
||||
p29: this.answers.p29,
|
||||
p30: this.answers.p30,
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.error(error.response.data.message)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.idCuestionario = localStorage.getItem('idCuestionarioAlumno')
|
||||
},
|
||||
// data() {
|
||||
// return {
|
||||
// admin: {},
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// imprimirError(err = {}, title = '¡Hubo un error!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-danger',
|
||||
// title,
|
||||
// message: err.message,
|
||||
// confirmText: 'Entendido',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'alert-octagon',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// if (err.err && err.err === 'token error') {
|
||||
// localStorage.clear()
|
||||
// this.$router.push('/')
|
||||
// }
|
||||
// },
|
||||
// imprimirMensaje(message, title = '¡Felicidades!', onConfirm = () => {}) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-success',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Ok',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'check-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// })
|
||||
// },
|
||||
// imprimirWarning(
|
||||
// message,
|
||||
// onConfirm = () => {},
|
||||
// title = '¡Espera un minuto!',
|
||||
// onCancel = () => {}
|
||||
// ) {
|
||||
// this.$buefy.dialog.alert({
|
||||
// ariaRole: 'alertdialog',
|
||||
// ariaModal: true,
|
||||
// type: 'is-warning',
|
||||
// title,
|
||||
// message,
|
||||
// confirmText: 'Confirmar',
|
||||
// canCancel: true,
|
||||
// cancelText: 'Cancelar',
|
||||
// hasIcon: true,
|
||||
// iconPack: 'mdi',
|
||||
// icon: 'help-circle',
|
||||
// onConfirm: () => onConfirm(),
|
||||
// onCancel: () => onCancel(),
|
||||
// })
|
||||
// },
|
||||
// getLocalhostInfo() {
|
||||
// this.admin.idUsuario = Number(localStorage.getItem('idUsuario'))
|
||||
// this.admin.idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
|
||||
// this.admin.tipoUsuario = localStorage.getItem('tipoUsuario')
|
||||
// this.admin.token = {
|
||||
// headers: {
|
||||
// token: localStorage.getItem('token'),
|
||||
// },
|
||||
// }
|
||||
// },
|
||||
// },
|
||||
// created() {
|
||||
// this.getLocalhostInfo()
|
||||
// if (this.admin.idTipoUsuario === 1) this.$router.push('/admin')
|
||||
// if (this.admin.idTipoUsuario === 2) this.$router.push('/responsable')
|
||||
// if (this.admin.idTipoUsuario === 4) this.$router.push('/casoEspecial')
|
||||
// },
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,309 @@
|
||||
<template>
|
||||
<section class="container my-5 px-3">
|
||||
<!-- <div v-if="idCuestionario === 'null'"> -->
|
||||
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">Evaluación de programas de servicio social</p>
|
||||
|
||||
<p>
|
||||
Te invitamos a compartir tu experiencia respecto del programa de
|
||||
servicio social en el que participaste, a efecto de mejorar la oferta
|
||||
de programas disponibles para los alumnos que desean liberar este
|
||||
requisito. Te recordamos qe tus respues son confidenciales.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- <parteA />
|
||||
|
||||
<parteB />
|
||||
|
||||
<parteC />
|
||||
|
||||
<parteD />
|
||||
|
||||
<parteE />
|
||||
|
||||
<parteF /> -->
|
||||
|
||||
<FullCuestionario />
|
||||
|
||||
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
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'
|
||||
|
||||
import FullCuestionario from '@/components/alumno/cuestionario2/FullCuestionario'
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
parteA,
|
||||
parteB,
|
||||
parteC,
|
||||
parteD,
|
||||
parteE,
|
||||
parteF,
|
||||
navCues,
|
||||
BotonRegresar,
|
||||
|
||||
FullCuestionario
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
token: {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
},
|
||||
},
|
||||
isLoading: false,
|
||||
current: 1,
|
||||
idCuestionario: "null",
|
||||
answers: {
|
||||
sexo: '',
|
||||
edad: '',
|
||||
servicioMedico: '',
|
||||
servicioMedicoOtro: '',
|
||||
servicioMedicoAux: '',
|
||||
p1: '',
|
||||
p2: '',
|
||||
p3: [], // selecciona 3 opciones
|
||||
p3Otro: '',
|
||||
p4: '',
|
||||
p5: [],
|
||||
p6: '',
|
||||
p7: '',
|
||||
p8: [],
|
||||
p9: '',
|
||||
p10: '',
|
||||
p11: '',
|
||||
p12: '',
|
||||
p13: '',
|
||||
p14: [],
|
||||
p15: [],
|
||||
p16: '',
|
||||
p17: [],
|
||||
p18: '',
|
||||
p19: '',
|
||||
p20: '',
|
||||
p21: [],
|
||||
p22: [],
|
||||
p23: [],
|
||||
p24: [],
|
||||
p25: '',
|
||||
p26: '',
|
||||
p27: '',
|
||||
p28: null,
|
||||
p29: null,
|
||||
p30: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChildA(value) {
|
||||
this.answers.servicioMedico = value.servicioMedico
|
||||
this.answers.sexo = value.sexo
|
||||
this.answers.edad = value.edad
|
||||
},
|
||||
onChildB(value) {
|
||||
this.answers.p1 = value.p1
|
||||
this.answers.p2 = value.p2
|
||||
this.answers.p3 = value.p3
|
||||
this.answers.p3Otro = value.p3Otro
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildD(value) {
|
||||
this.answers.p14 = value.p14
|
||||
this.answers.p15 = value.p15
|
||||
this.answers.p16 = value.p16
|
||||
this.answers.p17 = value.p17
|
||||
},
|
||||
onChildE(value) {
|
||||
this.answers.p18 = value.p18
|
||||
this.answers.p19 = value.p19
|
||||
this.answers.p20 = value.p20
|
||||
this.answers.p21 = value.p21
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildNAV(value) {
|
||||
this.current = value
|
||||
},
|
||||
error(msj) {
|
||||
let salir = false
|
||||
switch (msj) {
|
||||
case 'invalid signature':
|
||||
msj = 'Tu token no es valido, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt expired':
|
||||
msj = 'Tu sesión ha expirado, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt malformed':
|
||||
msj = 'No se encontro tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'No hay token':
|
||||
msj = 'Ocurrio un error al enviar tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
}
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: msj,
|
||||
type: 'is-danger',
|
||||
hasIcon: true,
|
||||
icon: 'alert-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
if (salir == true) {
|
||||
localStorage.clear()
|
||||
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,
|
||||
p1: this.answers.p1,
|
||||
p2: this.answers.p2,
|
||||
p3: this.answers.p3,
|
||||
p4: this.answers.p4,
|
||||
p5: this.answers.p5,
|
||||
p6: this.answers.p6,
|
||||
p7: this.answers.p7,
|
||||
p8: this.answers.p8,
|
||||
p9: this.answers.p9,
|
||||
p10: this.answers.p10,
|
||||
p11: this.answers.p11,
|
||||
p12: this.answers.p12,
|
||||
p13: this.answers.p13,
|
||||
p14: this.answers.p14,
|
||||
p15: this.answers.p15,
|
||||
p16: this.answers.p16,
|
||||
p17: this.answers.p17,
|
||||
p18: this.answers.p18,
|
||||
p19: this.answers.p19,
|
||||
p20: this.answers.p20,
|
||||
p21: this.answers.p21,
|
||||
p22: this.answers.p22,
|
||||
p23: this.answers.p23,
|
||||
p24: this.answers.p24,
|
||||
p25: this.answers.p25,
|
||||
p26: this.answers.p26,
|
||||
p27: this.answers.p27,
|
||||
p28: this.answers.p28,
|
||||
p29: this.answers.p29,
|
||||
p30: this.answers.p30,
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.error(error.response.data.message)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -89,6 +89,12 @@ export default {
|
||||
'idCuestionarioAlumno',
|
||||
res.data.idCuestionarioAlumno
|
||||
)
|
||||
|
||||
localStorage.setItem(
|
||||
'idCuestionarioAlumno2',
|
||||
res.data.idCuestionarioAlumno2
|
||||
)
|
||||
|
||||
localStorage.setItem('idServicio', res.data.idServicio)
|
||||
this.updateIsLoading(false)
|
||||
})
|
||||
|
||||
@@ -0,0 +1,333 @@
|
||||
<template>
|
||||
<section class="container my-5 px-3">
|
||||
<!-- <div v-if="idCuestionario === 'null'"> -->
|
||||
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">2025 Evaluación de la institución receptora de servicio social</p>
|
||||
|
||||
<p>
|
||||
Estimado(a) responsable de programa de servicio social:
|
||||
Te solicitamos llenar cuidadosamente los campos solicitados a continuación para poder
|
||||
validar el término del servicio social de nuestro alumno(a)
|
||||
|
||||
Los datos están sujetos al aviso de privacidad integral que se puede consultar en el sitio
|
||||
web:
|
||||
<a
|
||||
href="https://www.acatlan.unam.mx/normatividad"
|
||||
class="column "
|
||||
target="_blank"> www.acatlan.unam.mx/normatividad </a>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- <parteA />
|
||||
|
||||
<parteB />
|
||||
|
||||
<parteC />
|
||||
|
||||
<parteD />
|
||||
|
||||
<parteE />
|
||||
|
||||
<parteF /> -->
|
||||
|
||||
<!-- <FullCuestionario /> -->
|
||||
|
||||
|
||||
|
||||
<FullCuestionario
|
||||
:idServicio="idServicio"
|
||||
:responsable="responsable"
|
||||
:imprimirMensaje="imprimirMensaje"
|
||||
:imprimirWarning="imprimirWarning"
|
||||
:imprimirError="imprimirError"
|
||||
:updateIsLoading="updateIsLoading"
|
||||
/>
|
||||
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import Buefy from 'buefy'
|
||||
import 'buefy/dist/buefy.css'
|
||||
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'
|
||||
|
||||
import FullCuestionario from '@/components/responsable/CuestionarioResponsable2'
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
parteA,
|
||||
parteB,
|
||||
parteC,
|
||||
parteD,
|
||||
parteE,
|
||||
parteF,
|
||||
navCues,
|
||||
BotonRegresar,
|
||||
|
||||
FullCuestionario
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
token: {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
},
|
||||
},
|
||||
isLoading: false,
|
||||
current: 1,
|
||||
idCuestionario: "null",
|
||||
answers: {
|
||||
sexo: '',
|
||||
edad: '',
|
||||
servicioMedico: '',
|
||||
servicioMedicoOtro: '',
|
||||
servicioMedicoAux: '',
|
||||
p1: '',
|
||||
p2: '',
|
||||
p3: [], // selecciona 3 opciones
|
||||
p3Otro: '',
|
||||
p4: '',
|
||||
p5: [],
|
||||
p6: '',
|
||||
p7: '',
|
||||
p8: [],
|
||||
p9: '',
|
||||
p10: '',
|
||||
p11: '',
|
||||
p12: '',
|
||||
p13: '',
|
||||
p14: [],
|
||||
p15: [],
|
||||
p16: '',
|
||||
p17: [],
|
||||
p18: '',
|
||||
p19: '',
|
||||
p20: '',
|
||||
p21: [],
|
||||
p22: [],
|
||||
p23: [],
|
||||
p24: [],
|
||||
p25: '',
|
||||
p26: '',
|
||||
p27: '',
|
||||
p28: null,
|
||||
p29: null,
|
||||
p30: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChildA(value) {
|
||||
this.answers.servicioMedico = value.servicioMedico
|
||||
this.answers.sexo = value.sexo
|
||||
this.answers.edad = value.edad
|
||||
},
|
||||
onChildB(value) {
|
||||
this.answers.p1 = value.p1
|
||||
this.answers.p2 = value.p2
|
||||
this.answers.p3 = value.p3
|
||||
this.answers.p3Otro = value.p3Otro
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildD(value) {
|
||||
this.answers.p14 = value.p14
|
||||
this.answers.p15 = value.p15
|
||||
this.answers.p16 = value.p16
|
||||
this.answers.p17 = value.p17
|
||||
},
|
||||
onChildE(value) {
|
||||
this.answers.p18 = value.p18
|
||||
this.answers.p19 = value.p19
|
||||
this.answers.p20 = value.p20
|
||||
this.answers.p21 = value.p21
|
||||
},
|
||||
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
|
||||
},
|
||||
onChildNAV(value) {
|
||||
this.current = value
|
||||
},
|
||||
error(msj) {
|
||||
let salir = false
|
||||
switch (msj) {
|
||||
case 'invalid signature':
|
||||
msj = 'Tu token no es valido, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt expired':
|
||||
msj = 'Tu sesión ha expirado, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'jwt malformed':
|
||||
msj = 'No se encontro tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
case 'No hay token':
|
||||
msj = 'Ocurrio un error al enviar tu token, inicia sesión de nuevo.'
|
||||
salir = true
|
||||
break
|
||||
}
|
||||
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Error',
|
||||
message: msj,
|
||||
type: 'is-danger',
|
||||
hasIcon: true,
|
||||
icon: 'alert-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
if (salir == true) {
|
||||
localStorage.clear()
|
||||
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,
|
||||
p1: this.answers.p1,
|
||||
p2: this.answers.p2,
|
||||
p3: this.answers.p3,
|
||||
p4: this.answers.p4,
|
||||
p5: this.answers.p5,
|
||||
p6: this.answers.p6,
|
||||
p7: this.answers.p7,
|
||||
p8: this.answers.p8,
|
||||
p9: this.answers.p9,
|
||||
p10: this.answers.p10,
|
||||
p11: this.answers.p11,
|
||||
p12: this.answers.p12,
|
||||
p13: this.answers.p13,
|
||||
p14: this.answers.p14,
|
||||
p15: this.answers.p15,
|
||||
p16: this.answers.p16,
|
||||
p17: this.answers.p17,
|
||||
p18: this.answers.p18,
|
||||
p19: this.answers.p19,
|
||||
p20: this.answers.p20,
|
||||
p21: this.answers.p21,
|
||||
p22: this.answers.p22,
|
||||
p23: this.answers.p23,
|
||||
p24: this.answers.p24,
|
||||
p25: this.answers.p25,
|
||||
p26: this.answers.p26,
|
||||
p27: this.answers.p27,
|
||||
p28: this.answers.p28,
|
||||
p29: this.answers.p29,
|
||||
p30: this.answers.p30,
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/cuestionario_alumno`, data, this.token)
|
||||
.then((res) => {
|
||||
this.$buefy.dialog.alert({
|
||||
title: 'Success',
|
||||
message: 'Se enviaron los datos correctamente',
|
||||
type: 'is-success',
|
||||
hasIcon: true,
|
||||
icon: 'checkbox-marked-circle',
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
})
|
||||
|
||||
//this.reset()
|
||||
localStorage.removeItem('idCuestionarioAlumno')
|
||||
this.$router.push('/alumno')
|
||||
})
|
||||
.catch((error) => {
|
||||
this.error(error.response.data.message)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,13 +1,42 @@
|
||||
<template>
|
||||
<section class="container px-2 pb-6">
|
||||
<BotonRegresar
|
||||
path="/responsable"
|
||||
:deleteFromLocalStorage="['idServicio']"
|
||||
/>
|
||||
<section class="container my-5 px-3">
|
||||
<!-- <div v-if="idCuestionario === 'null'"> -->
|
||||
|
||||
<div class="my-5 mensaje">
|
||||
<p class="is-size-2">2025 Evaluación de la institución receptora de servicio social</p>
|
||||
|
||||
<p>
|
||||
Estimado(a) responsable de programa de servicio social:
|
||||
Te solicitamos llenar cuidadosamente los campos solicitados a continuación para poder
|
||||
validar el término del servicio social de nuestro alumno(a)
|
||||
|
||||
<h3 class="title">{{ alumno.nombre }} {{ alumno.usuario }}</h3>
|
||||
Los datos están sujetos al aviso de privacidad integral que se puede consultar en el sitio
|
||||
web:
|
||||
<a
|
||||
href="https://www.acatlan.unam.mx/normatividad"
|
||||
class="column "
|
||||
target="_blank"> www.acatlan.unam.mx/normatividad </a>
|
||||
|
||||
<CuestionarioResponasble
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- <parteA />
|
||||
|
||||
<parteB />
|
||||
|
||||
<parteC />
|
||||
|
||||
<parteD />
|
||||
|
||||
<parteE />
|
||||
|
||||
<parteF /> -->
|
||||
|
||||
<!-- <FullCuestionario /> -->
|
||||
|
||||
|
||||
|
||||
<FullCuestionario
|
||||
:idServicio="idServicio"
|
||||
:responsable="responsable"
|
||||
:imprimirMensaje="imprimirMensaje"
|
||||
@@ -15,25 +44,30 @@
|
||||
:imprimirError="imprimirError"
|
||||
:updateIsLoading="updateIsLoading"
|
||||
/>
|
||||
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading">
|
||||
</b-loading>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<BotonRegresar
|
||||
path="/responsable"
|
||||
:deleteFromLocalStorage="['idServicio']"
|
||||
/>
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading" />
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import BotonRegresar from '@/components/botonRegresar'
|
||||
import CuestionarioResponasble from '@/components/responsable/CuestionarioResponasble'
|
||||
|
||||
import FullCuestionario from '@/components/responsable/CuestionarioResponsable2'
|
||||
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BotonRegresar,
|
||||
CuestionarioResponasble,
|
||||
FullCuestionario
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -141,3 +175,45 @@ export default {
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
.SINO * {
|
||||
margin: 0.5rem 0 !important;
|
||||
}
|
||||
.apartado,
|
||||
.pag {
|
||||
margin: 5rem 0;
|
||||
}
|
||||
.manyInputs {
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.checkb {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.navPages {
|
||||
padding: 1rem;
|
||||
}
|
||||
.td-w {
|
||||
width: 2000px;
|
||||
}
|
||||
.active,
|
||||
.active:hover {
|
||||
background-color: #bb8800 !important;
|
||||
}
|
||||
.centro {
|
||||
text-align: center;
|
||||
}
|
||||
.vh {
|
||||
height: 75vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.vh h1 {
|
||||
font-size: 60px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<section class="container px-2 pb-6">
|
||||
<BotonRegresar
|
||||
path="/responsable"
|
||||
:deleteFromLocalStorage="['idServicio']"
|
||||
/>
|
||||
|
||||
<h3 class="title">{{ alumno.nombre }} {{ alumno.usuario }}</h3>
|
||||
|
||||
<CuestionarioResponasble
|
||||
:idServicio="idServicio"
|
||||
:responsable="responsable"
|
||||
:imprimirMensaje="imprimirMensaje"
|
||||
:imprimirWarning="imprimirWarning"
|
||||
:imprimirError="imprimirError"
|
||||
:updateIsLoading="updateIsLoading"
|
||||
/>
|
||||
|
||||
<BotonRegresar
|
||||
path="/responsable"
|
||||
:deleteFromLocalStorage="['idServicio']"
|
||||
/>
|
||||
|
||||
<b-loading :is-full-page="true" :can-cancel="false" v-model="isLoading" />
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import BotonRegresar from '@/components/botonRegresar'
|
||||
import CuestionarioResponasble from '@/components/responsable/CuestionarioResponasble'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BotonRegresar,
|
||||
CuestionarioResponasble,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
idServicio: null,
|
||||
alumno: {},
|
||||
responsable: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateIsLoading(booleanValue) {
|
||||
this.isLoading = booleanValue
|
||||
},
|
||||
obtenerRegistro() {
|
||||
this.updateIsLoading(true)
|
||||
axios
|
||||
.get(
|
||||
`${process.env.api}/servicio/admin?idServicio=${this.idServicio}`,
|
||||
this.responsable.token
|
||||
)
|
||||
.then((res) => {
|
||||
this.alumno = res.data.Usuario
|
||||
this.updateIsLoading(false)
|
||||
if (res.data.idCuestionarioPrograma) this.$router.push('/responsable')
|
||||
})
|
||||
.catch((err) => {
|
||||
this.imprimirError(err.response.data)
|
||||
})
|
||||
},
|
||||
imprimirError(err = {}, title = '¡Hubo un error!', onConfirm = () => {}) {
|
||||
this.$buefy.dialog.alert({
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
type: 'is-danger',
|
||||
title,
|
||||
message: err.message,
|
||||
confirmText: 'Entendido',
|
||||
hasIcon: true,
|
||||
iconPack: 'mdi',
|
||||
icon: 'alert-octagon',
|
||||
onConfirm: () => onConfirm(),
|
||||
})
|
||||
if (err.err && err.err === 'token error') {
|
||||
localStorage.clear()
|
||||
this.$router.push('/')
|
||||
}
|
||||
},
|
||||
imprimirMensaje(message, title = '¡Felicidades!', onConfirm = () => {}) {
|
||||
this.$buefy.dialog.alert({
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
type: 'is-success',
|
||||
title,
|
||||
message,
|
||||
confirmText: 'Ok',
|
||||
hasIcon: true,
|
||||
iconPack: 'mdi',
|
||||
icon: 'check-circle',
|
||||
onConfirm: () => onConfirm(),
|
||||
})
|
||||
},
|
||||
imprimirWarning(
|
||||
message,
|
||||
onConfirm = () => {},
|
||||
title = '¡Espera un minuto!',
|
||||
onCancel = () => {}
|
||||
) {
|
||||
this.$buefy.dialog.alert({
|
||||
ariaRole: 'alertdialog',
|
||||
ariaModal: true,
|
||||
type: 'is-warning',
|
||||
title,
|
||||
message,
|
||||
confirmText: 'Confirmar',
|
||||
canCancel: true,
|
||||
cancelText: 'Cancelar',
|
||||
hasIcon: true,
|
||||
iconPack: 'mdi',
|
||||
icon: 'help-circle',
|
||||
onConfirm: () => onConfirm(),
|
||||
onCancel: () => onCancel(),
|
||||
})
|
||||
},
|
||||
getLocalhostInfo() {
|
||||
this.responsable.idUsuario = Number(localStorage.getItem('idUsuario'))
|
||||
this.responsable.idTipoUsuario = Number(
|
||||
localStorage.getItem('idTipoUsuario')
|
||||
)
|
||||
this.responsable.tipoUsuario = localStorage.getItem('tipoUsuario')
|
||||
this.responsable.token = {
|
||||
headers: {
|
||||
token: localStorage.getItem('token'),
|
||||
},
|
||||
}
|
||||
this.idServicio = Number(localStorage.getItem('idServicio'))
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getLocalhostInfo()
|
||||
if (this.responsable.idTipoUsuario === 1) this.$router.push('/admin')
|
||||
if (this.responsable.idTipoUsuario === 3) this.$router.push('/alumno')
|
||||
if (this.responsable.idTipoUsuario === 4) this.$router.push('/casoEspecial')
|
||||
if (!this.idServicio) this.$router.push('/responsable')
|
||||
else this.obtenerRegistro()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user