listo para compilar

This commit is contained in:
Lemuel Marquez
2020-12-07 19:01:11 -06:00
parent 6c5f931e68
commit edb45fe414
2 changed files with 309 additions and 261 deletions
+294 -241
View File
@@ -2,42 +2,73 @@
<section>
<div class="container px-3">
<div class="progressBar my-6">
<b-steps type="is-success" size="is-large" :has-navigation="false" v-model="activeStep" >
<b-step-item :clickable="false" label="Pre Registro" icon="account-plus"></b-step-item>
<b-step-item :clickable="false" label="Registro" icon="account-clock"></b-step-item>
<b-step-item :clickable="false" label="Registro Validado" icon="account"></b-step-item>
<b-step-item :clickable="false" label="Pre Termino" icon="account-details"></b-step-item>
<b-step-item :clickable="false" label="Termino" icon="account-clock"></b-step-item>
<b-step-item :clickable="false" label="Liberacion" icon="account-check"></b-step-item>
</b-steps>
<b-steps
type="is-success"
size="is-large"
:has-navigation="false"
v-model="activeStep"
>
<b-step-item
:clickable="false"
label="Pre Registro"
icon="account-plus"
></b-step-item>
<b-step-item
:clickable="false"
label="Registro"
icon="account-clock"
></b-step-item>
<b-step-item
:clickable="false"
label="Registro Validado"
icon="account"
></b-step-item>
<b-step-item
:clickable="false"
label="Pre Termino"
icon="account-details"
></b-step-item>
<b-step-item
:clickable="false"
label="Termino"
icon="account-clock"
></b-step-item>
<b-step-item
:clickable="false"
label="Liberacion"
icon="account-check"
></b-step-item>
</b-steps>
</div>
<div class="mensajeDiv" v-for="mensaje in mensajes" :key="mensaje.status" >
<div v-if="mensaje.mensaje !='' && mensaje.status == activeStep">
<p class="mensaje has-text-justified">
<span class="block is-size-5">Estimado alumno(a): </span><br><br>
{{mensaje.mensaje}}
</p>
<div class="mensajeDiv" v-for="mensaje in mensajes" :key="mensaje.status">
<div v-if="mensaje.mensaje != '' && mensaje.status == activeStep">
<p class="mensaje has-text-justified">
<span class="block is-size-5">Estimado alumno(a): </span
><br /><br />
{{ mensaje.mensaje }}
</p>
</div>
</div>
</div>
<div class="info" >
<div class="info-programa">
<div class="info">
<div class="info-programa">
<h3 class="title is-3">Información del programa</h3>
<p><strong> Programa: </strong> {{ programa.programa }} </p>
<p><strong> Programa: </strong> {{ programa.programa }}</p>
<p><strong> Institución: </strong> {{ programa.institucion }}</p>
<p><strong> Dependencia: </strong> {{ programa.dependencia }}</p>
<p><strong> Clave del programa: </strong> {{ programa.clave }}</p>
<div v-if="programa.acatlan == true">
<p><strong> Programa Interno: </strong> {{ programa.programaInterno }}</p>
<p><strong> Profesor: </strong> {{ programa.profesor }}</p>
<p>
<strong> Programa Interno: </strong>
{{ programa.programaInterno }}
</p>
<p><strong> Profesor: </strong> {{ programa.profesor }}</p>
</div>
</div>
<div class="info-alumno mt-6">
</div>
<div class="info-alumno mt-6">
<h3 class="title is-3">Información del alumno</h3>
<p><strong> Nombre: </strong> {{ alumno.nombre }} </p>
<p><strong> Nombre: </strong> {{ alumno.nombre }}</p>
<p><strong> Número de cuenta: </strong> {{ alumno.cuenta }}</p>
<p><strong> Carrera: </strong> {{ alumno.carrera }}</p>
<p><strong> Correo: </strong> {{ alumno.correo }}</p>
@@ -45,326 +76,348 @@
<div class="mt-4 info-extra" v-if="activeStep >= 2">
<p><strong> Direccion: </strong> {{ alumno.direccion }}</p>
<p><strong> Telefono: </strong> {{ alumno.telefono }}</p>
<p><strong> Fecha de nacimiento: </strong> {{ alumno.nacimiento }}</p>
<p>
<strong> Fecha de nacimiento: </strong> {{ alumno.nacimiento }}
</p>
</div>
</div>
</div>
</div>
<div class="registro" v-if="activeStep==1">
<div class="registro" v-if="activeStep == 1">
<h3 class="title is-3 my-5">Formulario Pre-registro</h3>
<form >
<form>
<b-field label="Fecha de nacimiento">
<b-datepicker
placeholder="Fecha de nacimiento"
icon="calendar-today"
v-model="nacimiento"
>
</b-datepicker>
<b-datepicker
placeholder="Fecha de nacimiento"
icon="calendar-today"
v-model="nacimiento"
>
</b-datepicker>
</b-field>
<b-field label="Telefono">
<b-input placeholder="Telefono" maxlength="10" v-model="telefono" type="tel" >
</b-input>
<b-input
placeholder="Telefono"
maxlength="10"
v-model="telefono"
type="tel"
>
</b-input>
</b-field>
<b-field label="Direccion">
<b-input maxlength="200 " placeholder="Direccion" type="textarea" v-model="direccion"></b-input>
<b-input
maxlength="200 "
placeholder="Direccion"
type="textarea"
v-model="direccion"
></b-input>
</b-field>
</form>
<div class="my-4 mb-6">
<b-field >
<b-field>
<button
:disabled="nacimiento=='' || telefono=='' || direccion==''"
class="button is-success is-medium"
@click="enviarRegistro()"
:disabled="nacimiento == '' || telefono == '' || direccion == ''"
class="button is-success is-medium"
@click="enviarRegistro()"
>
Enviar
Enviar
</button>
</b-field>
</div>
</div>
<div class="registro-validado" v-if="activeStep==2">
</div>
<div class="registro-validado" v-if="activeStep == 2"></div>
<div class="pre-termino" v-if="activeStep==3 || activeStep==9">
<h3 class="title is-4 mt-6">Cuestionario de evaluación del programa de servicio social</h3>
<div class=" my-6" v-if="alumno.idCuestionario == null">
<b-button tag="router-link"
<div class="pre-termino" v-if="activeStep == 3 || activeStep == 9">
<h3 class="title is-4 mt-6">
Cuestionario de evaluación del programa de servicio social
</h3>
<div class="my-6" v-if="alumno.idCuestionario == null">
<b-button
tag="router-link"
to="/alumno/cuestionario"
type="is-info is-light "
icon-left="book-open"
class="border-info"
size="is-medium"
>
cuestionario
>
cuestionario
</b-button>
</div>
<div class="is-flex " v-else>
<p class="block is-size-5">Cuestionario contestado </p>
<b-icon
icon="check-bold"
size="is-small"
type="is-success">
</b-icon>
<div class="is-flex" v-else>
<p class="block is-size-5">Cuestionario contestado</p>
<b-icon icon="check-bold" size="is-small" type="is-success"> </b-icon>
</div>
<h3 class="title is-4 mt-6">Informe global de actividades (en formato .PDF. No se aceptan fotos).</h3>
<h3 class="title is-4 mt-6">
Informe global de actividades (en formato .PDF. No se aceptan fotos).
</h3>
<div v-if="alumno.informeGlobal == null">
<b-field type="black">
<b-upload v-model="file" type="black" drag-drop expanded accept="application/pdf">
<b-upload
v-model="file"
type="black"
drag-drop
expanded
accept="application/pdf"
>
<section class="section">
<div class="content has-text-centered">
<p>
<b-icon icon="upload" size="is-large"></b-icon>
</p>
<p>{{ file.name || "Arrastra aquí tu archivo o da click para buscar"}}</p>
<p>
{{
file.name ||
"Arrastra aquí tu archivo o da click para buscar"
}}
</p>
</div>
</section>
</b-upload>
</b-field>
<b-field class="derecha">
<button :disabled='file == ""'
class="button is-success is-medium mb-4"
@click="enviarInforme()"
>
Enviar
</button>
<button
:disabled="file == ''"
class="button is-success is-medium mb-4"
@click="enviarInforme()"
>
Enviar
</button>
</b-field>
</div>
<div class="is-flex " v-else>
<p class="block is-size-5">Informe contestado </p>
<b-icon
icon="check-bold"
size="is-small"
type="is-success">
</b-icon>
<div class="is-flex" v-else>
<p class="block is-size-5">Informe contestado</p>
<b-icon icon="check-bold" size="is-small" type="is-success"> </b-icon>
</div>
</div>
<div class="termino" v-if="activeStep==4">
</div>
<div class="Liberacion" v-if="activeStep==5">
</div>
<div class="termino" v-if="activeStep == 4"></div>
<div class="Liberacion" v-if="activeStep == 5"></div>
</div>
</section>
</template>
<script>
import 'buefy/dist/buefy.css'
import moment from 'moment'
import axios from 'axios'
import "buefy/dist/buefy.css";
import moment from "moment";
import axios from "axios";
export default {
data () {
data() {
return {
activeStep: '',
activeStep: "",
isFullPage: true,
file: [],
nacimiento: [],
telefono: '',
direccion: '',
telefono: "",
direccion: "",
alumno: {
carrera: '',
nombre: '',
cuenta: '',
correo: '',
direccion: '',
nacimiento: '',
telefono: '',
idCuestionario: '',
informeGlobal: '',
idAlumno: '',
idCarrera: '',
idServicio: '',
carrera: "",
nombre: "",
cuenta: "",
correo: "",
direccion: "",
nacimiento: "",
telefono: "",
idCuestionario: "",
informeGlobal: "",
idAlumno: "",
idCarrera: "",
idServicio: "",
inicio: [],
fin: []
fin: [],
},
programa: {
programa: '',
institucion: '',
dependencia: '',
clave: '',
acatlan: '',
programaInterno: '',
profesor: ''
programa: "",
institucion: "",
dependencia: "",
clave: "",
acatlan: "",
programaInterno: "",
profesor: "",
},
mensajes: [
{ status: 0, mensaje: '' },
{ status: 1, mensaje: '' },
{ status: 2, mensaje: 'Te informamos que el Área de Registro y Control de Servicio Social ha validado tu solicitud de registro de servicio social por lo que el siguiente trámite lo realizarás hasta que concluyas 480 horas en un periodo de mínimo 6 meses y obtengas tu carta de término por parte de la institución, quien se encargará de subir dicho archivo a este sistema, además de responder un cuestionario sobre tu desempeño. A su vez, deberás responder el siguiente cuestionario de evaluación del programa de servicio social en donde participaste y enviar el informe global de actividades elaborado por ti, con firma y sello de visto bueno de tu jefe inmediato. En cuanto el Área de Registro y Control de Servicio Social valide tu solicitud, podrás revisar las indicaciones del siguiente paso en el panel llamado “Liberación” Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 14:00 hrs. y de 16:00 a 20:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@acatlan.unam.mx' },
{ status: 3, mensaje: '' },
{ status: 4, mensaje: 'Espera a que tus documentos sean validados por el Departamento de Servicio Social y Bolsa de Trabajo' },
{ status: 5, mensaje: 'Te confirmamos que has concluido con los trámites necesarios para la liberación de tu servicio social por lo que ahora sólo queda esperar a que en máximo 15 días hábiles se te notifique por correo electrónico a partir de cuándo puedes recoger la copia de tu carta de liberación en las ventanillas del Área de Registro y Control de Servicio Social. Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 13:00 hrs. y de 16:00 a 19:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@apolo.acatlan.unam.mx' },
{ status: 6, mensaje: '' },
{ status: 7, mensaje: '' },
{ status: 8, mensaje: '' },
{ status: 9, mensaje: '' }
]
}
{ status: 0, mensaje: "" },
{ status: 1, mensaje: "" },
{
status: 2,
mensaje:
"Te informamos que el Área de Registro y Control de Servicio Social ha validado tu solicitud de registro de servicio social por lo que el siguiente trámite lo realizarás hasta que concluyas 480 horas en un periodo de mínimo 6 meses y obtengas tu carta de término por parte de la institución, quien se encargará de subir dicho archivo a este sistema, además de responder un cuestionario sobre tu desempeño. A su vez, deberás responder el siguiente cuestionario de evaluación del programa de servicio social en donde participaste y enviar el informe global de actividades elaborado por ti, con firma y sello de visto bueno de tu jefe inmediato. En cuanto el Área de Registro y Control de Servicio Social valide tu solicitud, podrás revisar las indicaciones del siguiente paso en el panel llamado “Liberación” Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 14:00 hrs. y de 16:00 a 20:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@acatlan.unam.mx",
},
{ status: 3, mensaje: "" },
{
status: 4,
mensaje:
"Espera a que tus documentos sean validados por el Departamento de Servicio Social y Bolsa de Trabajo",
},
{
status: 5,
mensaje:
"Te confirmamos que has concluido con los trámites necesarios para la liberación de tu servicio social por lo que ahora sólo queda esperar a que en máximo 15 días hábiles se te notifique por correo electrónico a partir de cuándo puedes recoger la copia de tu carta de liberación en las ventanillas del Área de Registro y Control de Servicio Social. Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 13:00 hrs. y de 16:00 a 19:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@apolo.acatlan.unam.mx",
},
{ status: 6, mensaje: "" },
{ status: 7, mensaje: "" },
{ status: 8, mensaje: "" },
{ status: 9, mensaje: "" },
],
};
},
methods: {
enviarRegistro () {
enviarRegistro() {
const loadingComponent = this.$buefy.loading.open({
container: this.isFullPage ? null : this.$refs.element.$el
})
container: this.isFullPage ? null : this.$refs.element.$el,
});
const data = {
idServicio: this.alumno.idServicio,
fechaNacimiento: moment(this.alumno.nacimiento),
direccion: this.alumno.direccion,
telefono: this.alumno.telefono
}
telefono: this.alumno.telefono,
};
axios.put(`${process.env.api}/servicio/registro_validado`, data)
.then(res => {
loadingComponent.close()
axios
.put(`${process.env.api}/servicio/registro_validado`, data)
.then((res) => {
loadingComponent.close();
this.$buefy.dialog.alert({
title: 'Success',
message: 'Se enviaron los datos correctamente',
type: 'is-success',
title: "Success",
message: "Se enviaron los datos correctamente",
type: "is-success",
hasIcon: true,
icon: 'checkbox-marked-circle',
iconPack: 'mdi',
ariaRole: 'alertdialog',
ariaModal: true
})
icon: "checkbox-marked-circle",
iconPack: "mdi",
ariaRole: "alertdialog",
ariaModal: true,
});
this.reset()
this.reset();
})
.catch(error => {
loadingComponent.close()
.catch((error) => {
loadingComponent.close();
this.$buefy.dialog.alert({
title: 'Error',
title: "Error",
message: error.response.data.message,
type: 'is-danger',
type: "is-danger",
hasIcon: true,
icon: 'alert-circle',
iconPack: 'mdi',
ariaRole: 'alertdialog',
ariaModal: true
})
})
icon: "alert-circle",
iconPack: "mdi",
ariaRole: "alertdialog",
ariaModal: true,
});
});
},
enviarInforme () {
enviarInforme() {
const loadingComponent = this.$buefy.loading.open({
container: this.isFullPage ? null : this.$refs.element.$el
})
container: this.isFullPage ? null : this.$refs.element.$el,
});
const data = {
idServicio: this.alumno.idServicio
idServicio: this.alumno.idServicio,
};
const formData = new FormData();
console.log(data);
formData.append("data", JSON.stringify(data));
formData.append("informeGlobal", this.file);
}
const formData = new FormData()
console.log(data)
formData.append('data', JSON.stringify(data))
formData.append('informeGlobal', this.file)
axios.put(`${process.env.api}/servicio/informe_global`, formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
})
.then(res => {
loadingComponent.close()
this.$buefy.dialog.alert({
title: 'Success',
message: 'Se enviaron los datos correctamente',
type: 'is-success',
hasIcon: true,
icon: 'checkbox-marked-circle',
iconPack: 'mdi',
ariaRole: 'alertdialog',
ariaModal: true
})
this.reset()
axios
.put(`${process.env.api}/servicio/informe_global`, formData, {
headers: {
"Content-Type": "multipart/form-data",
},
})
.catch(error => {
loadingComponent.close()
.then((res) => {
loadingComponent.close();
this.$buefy.dialog.alert({
title: 'Error',
title: "Success",
message: "Se enviaron los datos correctamente",
type: "is-success",
hasIcon: true,
icon: "checkbox-marked-circle",
iconPack: "mdi",
ariaRole: "alertdialog",
ariaModal: true,
});
this.reset();
})
.catch((error) => {
loadingComponent.close();
this.$buefy.dialog.alert({
title: "Error",
message: error.response.data.message,
type: 'is-danger',
type: "is-danger",
hasIcon: true,
icon: 'alert-circle',
iconPack: 'mdi',
ariaRole: 'alertdialog',
ariaModal: true
})
})
}
icon: "alert-circle",
iconPack: "mdi",
ariaRole: "alertdialog",
ariaModal: true,
});
});
},
},
computed: {
steps () {
const steps = [...this.baseSteps]
return steps
}
steps() {
const steps = [...this.baseSteps];
return steps;
},
},
created () {
axios.get(`${process.env.api}/servicio/alumno`, {
params: {
idUsuario: localStorage.getItem('idUsuario')
}
})
.then(resp => {
console.log(resp.data)
this.activeStep = resp.data.Status.idStatus - 1
this.programa.programa = resp.data.Programa.programa
this.programa.dependencia = resp.data.Programa.dependencia
this.programa.institucion = resp.data.Programa.institucion
this.programa.clave = resp.data.Programa.clavePrograma
this.programa.profesor = resp.data.profesor
this.programa.acatlan = resp.data.Programa.acatlan
this.programa.programaInterno = resp.data.programaInterno
this.alumno.carrera = resp.data.Carrera.carrera
this.alumno.idCarrera = resp.data.Carrera.idCarrera
this.alumno.correo = resp.data.correo
this.alumno.inicio = resp.data.fechaInicio
this.alumno.fin = resp.data.fechaFin
this.alumno.direccion = resp.data.direccion
this.alumno.nacimiento = resp.data.fechaNacimiento
this.alumno.telefono = resp.data.telefono
this.alumno.idServicio = resp.data.idServicio
this.alumno.idCuestionario = resp.data.idCuestionarioAlumno
this.alumno.informeGlobal = resp.data.informeGlobal
this.alumno.nombre = localStorage.getItem('nombre')
this.alumno.cuenta = localStorage.getItem('usuario')
created() {
axios
.get(`${process.env.api}/servicio/alumno`, {
params: {
idUsuario: localStorage.getItem("idUsuario"),
},
})
.catch(error => {
console.log(error.message)
})
}
.then((resp) => {
console.log(resp.data);
this.activeStep = resp.data.Status.idStatus - 1;
}
this.programa.programa = resp.data.Programa.programa;
this.programa.dependencia = resp.data.Programa.dependencia;
this.programa.institucion = resp.data.Programa.institucion;
this.programa.clave = resp.data.Programa.clavePrograma;
this.programa.profesor = resp.data.profesor;
this.programa.acatlan = resp.data.Programa.acatlan;
this.programa.programaInterno = resp.data.programaInterno;
this.alumno.carrera = resp.data.Carrera.carrera;
this.alumno.idCarrera = resp.data.Carrera.idCarrera;
this.alumno.correo = resp.data.correo;
this.alumno.inicio = resp.data.fechaInicio;
this.alumno.fin = resp.data.fechaFin;
this.alumno.direccion = resp.data.direccion;
this.alumno.nacimiento = resp.data.fechaNacimiento;
this.alumno.telefono = resp.data.telefono;
this.alumno.idServicio = resp.data.idServicio;
this.alumno.idCuestionario = resp.data.idCuestionarioAlumno;
this.alumno.informeGlobal = resp.data.informeGlobal;
this.alumno.nombre = localStorage.getItem("nombre");
this.alumno.cuenta = localStorage.getItem("usuario");
})
.catch((error) => {
console.log(error.message);
});
},
};
</script>
<style scoped>
.border-info{
border: 1px solid #167df0 ;
.border-info {
border: 1px solid #167df0;
}
.info-alumno p{
margin-bottom: .8rem;
.info-alumno p {
margin-bottom: 0.8rem;
}
.info-programa p{
margin-bottom: .8rem;
.info-programa p {
margin-bottom: 0.8rem;
}
.mensaje{
.mensaje {
margin: 3.5rem 0;
}
.else{
.else {
display: flex;
align-content: center !important;
}
+15 -20
View File
@@ -4,28 +4,24 @@ export default {
ssr: false,
// Target (https://go.nuxtjs.dev/config-target)
target: 'static',
target: "static",
// Global page headers (https://go.nuxtjs.dev/config-head)
head: {
title: 'servicio_social_front',
title: "servicio_social_front",
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: '' }
{ charset: "utf-8" },
{ name: "viewport", content: "width=device-width, initial-scale=1" },
{ hid: "description", name: "description", content: "" },
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
]
link: [{ rel: "icon", type: "image/x-icon", href: "/favicon.ico" }],
},
// Global CSS (https://go.nuxtjs.dev/config-css)
css: [
],
css: [],
// Plugins to run before rendering page (https://go.nuxtjs.dev/config-plugins)
plugins: [
],
plugins: [],
// Auto import components (https://go.nuxtjs.dev/config-components)
components: true,
@@ -39,21 +35,20 @@ export default {
// Modules (https://go.nuxtjs.dev/config-modules)
modules: [
// https://go.nuxtjs.dev/buefy
'nuxt-buefy',
"nuxt-buefy",
// https://go.nuxtjs.dev/axios
'@nuxtjs/axios'
"@nuxtjs/axios",
],
// Axios module configuration (https://go.nuxtjs.dev/config-axios)
axios: {},
// Build Configuration (https://go.nuxtjs.dev/config-build)
build: {
},
build: {},
env: {
// api: 'http://localhost:3000'
api: 'https://b82ccc416703.ngrok.io'
api: "tramites.ss@acatlan.unam.mx",
// api: 'https://b82ccc416703.ngrok.io'
// api: 'https//venus.acatlan.unam.mx/pruebas_pcpuma'
}
}
},
};