casnet1
345 lines
12 KiB
Vue
345 lines
12 KiB
Vue
<template>
|
|
<section>
|
|
<div class="container px-3">
|
|
<div class="progressBar my-6">
|
|
<b-steps type="is-success" size="is-large" :has-navigation="false" v-model="activeStep">
|
|
<b-step-item label="Pre Registro" icon="account-plus"></b-step-item>
|
|
<b-step-item label="Registro" icon="account-clock"></b-step-item>
|
|
<b-step-item label="Registro Validado" icon="account"></b-step-item>
|
|
<b-step-item label="Pre Termino" icon="account-details"></b-step-item>
|
|
<b-step-item label="Termino" icon="account-clock"></b-step-item>
|
|
<b-step-item label="Liberacion" icon="account-check"></b-step-item>
|
|
</b-steps>
|
|
</div>
|
|
|
|
<div class="info" >
|
|
<div class="info-programa">
|
|
<h3 class="title is-3">Información del programa</h3>
|
|
<p><strong> Programa: </strong> {{ programa.nombre }} </p>
|
|
<p><strong> Institución: </strong> {{ programa.institucion }}</p>
|
|
<p><strong> Dependencia: </strong> {{ programa.dependencia }}</p>
|
|
<p><strong> Clave del programa: </strong> {{ programa.clave }}</p>
|
|
</div>
|
|
<div class="info-alumno mt-6">
|
|
<h3 class="title is-3">Información del alumno</h3>
|
|
<p><strong> Nombre: </strong> {{ alumno.nombre }} </p>
|
|
<p><strong> Número de cuenta: </strong> {{ alumno.cuenta }}</p>
|
|
<p><strong> Carrera: </strong> {{ alumno.carrera }}</p>
|
|
<p><strong> Correo: </strong> {{ alumno.correo }}</p>
|
|
|
|
<div class="mt-4 info-extra" v-if="activeStep >= 2">
|
|
<p><strong> Direccion: </strong> {{ alumno.direccion }}</p>
|
|
<p><strong> Telefono: </strong> {{ alumno.telefono }}</p>
|
|
<p><strong> Fecha de nacimiento: </strong> {{ alumno.nacimiento }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="registro" v-if="activeStep==1">
|
|
<h3 class="title is-3 my-5">Formulario Pre-registro</h3>
|
|
<form >
|
|
<b-field label="Fecha de nacimiento">
|
|
<b-datepicker
|
|
placeholder="Inicio"
|
|
icon="calendar-today"
|
|
v-model="nacimiento"
|
|
>
|
|
</b-datepicker>
|
|
</b-field>
|
|
|
|
<b-field label="Telefono">
|
|
<b-input placeholder="Telefono" maxlength="10" v-model="telefono" type="tel" >
|
|
</b-input>
|
|
</b-field>
|
|
|
|
<b-field label="Direccion">
|
|
<b-input maxlength="200 " placeholder="Direccion" type="textarea" v-model="direccion"></b-input>
|
|
</b-field>
|
|
|
|
</form>
|
|
<div class="my-4 mb-6">
|
|
<b-field >
|
|
<button
|
|
:disabled="nacimiento=='' || telefono=='' || direccion==''"
|
|
class="button is-success is-medium"
|
|
@click="enviar2()"
|
|
>
|
|
Enviar
|
|
</button>
|
|
</b-field>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="registro-validado" v-if="activeStep==2">
|
|
<p class="mensaje">
|
|
<span class="block is-size-5"> Estimado alumno(a): </span> <br> <br>
|
|
Te informamos que la dependencia en donde decidiste realizar tu servicio social ya validó tu registro.
|
|
|
|
</p>
|
|
</div>
|
|
|
|
<div class="pre-termino" v-if="activeStep==3">
|
|
<h3 class="title is-4 mt-6">Cuestionario de evaluación del programa de servicio social</h3>
|
|
<div class=" my-6" v-if="alumno.cuestionario==false">
|
|
<b-button tag="router-link"
|
|
to="/alumno/cuestionario"
|
|
type="is-info is-light "
|
|
icon-left="book-open"
|
|
class="border-info"
|
|
size="is-medium"
|
|
>
|
|
cuestionario
|
|
</b-button>
|
|
</div>
|
|
<div class="is-flex " v-else>
|
|
<p class="block is-size-5">Cuestionario contestado </p>
|
|
<b-icon
|
|
icon="check-bold"
|
|
size="is-small"
|
|
type="is-success">
|
|
</b-icon>
|
|
</div>
|
|
|
|
<h3 class="title is-4 mt-6">Informe global de actividades (en formato .PDF. No se aceptan fotos).</h3>
|
|
<div v-if="alumno.informe==false">
|
|
<b-field type="black">
|
|
<b-upload v-model="file" type="black" drag-drop expanded accept="application/pdf">
|
|
<section class="section">
|
|
<div class="content has-text-centered">
|
|
<p>
|
|
<b-icon icon="upload" size="is-large"></b-icon>
|
|
</p>
|
|
<p>{{ file.name || "Arrastra aquí tu archivo o da click para buscar"}}</p>
|
|
</div>
|
|
</section>
|
|
</b-upload>
|
|
|
|
</b-field>
|
|
<b-field class="derecha">
|
|
<button :disabled='file == ""'
|
|
class="button is-success is-medium mb-4"
|
|
@click="open"
|
|
style="float: right;">
|
|
Enviar
|
|
</button>
|
|
</b-field>
|
|
</div>
|
|
<div class="is-flex " v-else>
|
|
<p class="block is-size-5">Informe contestado </p>
|
|
<b-icon
|
|
icon="check-bold"
|
|
size="is-small"
|
|
type="is-success">
|
|
</b-icon>
|
|
</div>
|
|
|
|
<p class="mensaje has-text-justified">
|
|
<span class="block is-size-5">Estimado alumno(a): </span><br><br>
|
|
Te informamos que el Área de Registro y Control de Servicio Social ha validado tu solicitud de registro de servicio social por lo que el siguiente trámite lo realizarás hasta que concluyas 480 horas en un periodo de mínimo 6 meses y obtengas tu carta de término por parte de la institución, quien se encargará de subir dicho archivo a este sistema, además de responder un cuestionario sobre tu desempeño. A su vez, deberás responder el siguiente cuestionario de evaluación del programa de servicio social en donde participaste y enviar el informe global de actividades elaborado por ti, con firma y sello de visto bueno de tu jefe inmediato. En cuanto el Área de Registro y Control de Servicio Social valide tu solicitud, podrás revisar las indicaciones del siguiente paso en el panel llamado “Liberación” Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 14:00 hrs. y de 16:00 a 20:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@acatlan.unam.mx
|
|
</p>
|
|
</div>
|
|
|
|
<div class="termino" v-if="activeStep==4">
|
|
|
|
<p class="mensaje has-text-justified">
|
|
<span class="block is-size-5">Estimado alumno(a): </span><br><br>
|
|
Espera a que tus documentos sean validados por el Departamento
|
|
de Servicio Social y Bolsa de Trabajo
|
|
</p>
|
|
</div>
|
|
|
|
<div class="Liberacion" v-if="activeStep==5">
|
|
<p></p>
|
|
|
|
<p>
|
|
</p>
|
|
<p class="mensaje has-text-justified">
|
|
<span class="block is-size-5">Estimado alumno(a): </span><br><br>
|
|
Te confirmamos que has concluido con los trámites necesarios para la liberación de tu servicio social por lo que ahora sólo queda esperar a que en máximo 15 días hábiles se te notifique por correo electrónico a partir de cuándo puedes recoger la copia de tu carta de liberación en las ventanillas del Área de Registro y Control de Servicio Social.
|
|
<br>
|
|
Cualquier duda puedes acudir al área de Registro y Control de Servicio Social en COESI de lunes a viernes de 10:00 a 13:00 hrs. y de 16:00 a 19:00 hrs. o bien, comunicarte al 5623 1686 o al correo registross@apolo.acatlan.unam.mx
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<pre class="my-6">{{$data}}</pre>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
import 'buefy/dist/buefy.css'
|
|
import validator from 'validator'
|
|
import axios from 'axios'
|
|
|
|
export default {
|
|
data () {
|
|
return {
|
|
activeStep: '',
|
|
file: [],
|
|
nacimiento: [],
|
|
telefono: '',
|
|
direccion: '',
|
|
|
|
alumno: {
|
|
carrera: '',
|
|
nombre: 'X',
|
|
cuenta: 'X',
|
|
correo: '',
|
|
direccion: '',
|
|
nacimiento: '',
|
|
telefono: '',
|
|
cuestionario: true,
|
|
informe: true,
|
|
idAlumno: '',
|
|
idCarrera: '',
|
|
idServicio: '',
|
|
inicio: [],
|
|
fin: []
|
|
|
|
},
|
|
programa: {
|
|
nombre: 'programa 1',
|
|
institucion: 'institucion 1',
|
|
dependencia: 'dependecia 1',
|
|
clave: '023'
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
open () {
|
|
const loadingComponent = this.$buefy.loading.open({
|
|
container: this.isFullPage ? null : this.$refs.element.$el
|
|
})
|
|
setTimeout(() => loadingComponent.close(), 3 * 1000)
|
|
},
|
|
enviar2 () {
|
|
const loadingComponent = this.$buefy.loading.open({
|
|
container: this.isFullPage ? null : this.$refs.element.$el
|
|
})
|
|
|
|
const data = {
|
|
idServicio: this.alumno.idServicio,
|
|
fechaNacimiento: this.alumno.nacimiento,
|
|
direccion: this.alumno.direccion,
|
|
telefono: this.alumno.telefono
|
|
}
|
|
|
|
axios.post(`${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',
|
|
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',
|
|
hasIcon: true,
|
|
icon: 'alert-circle',
|
|
iconPack: 'mdi',
|
|
ariaRole: 'alertdialog',
|
|
ariaModal: true
|
|
})
|
|
})
|
|
}
|
|
},
|
|
computed: {
|
|
baseSteps () {
|
|
return [
|
|
{
|
|
label: 'Pictures',
|
|
content: 'Pictures: Lorem ipsum dolor sit amet.',
|
|
displayed: true
|
|
},
|
|
{
|
|
label: 'Music',
|
|
content: 'Music: Lorem ipsum dolor sit amet.',
|
|
displayed: this.showMusic
|
|
},
|
|
{
|
|
label: 'Games',
|
|
content: 'Games: Lorem ipsum dolor sit amet.',
|
|
displayed: true,
|
|
visible: this.showGames
|
|
},
|
|
{
|
|
label: 'Videos',
|
|
content: 'Videos: Lorem ipsum dolor sit amet.',
|
|
displayed: true
|
|
}
|
|
]
|
|
},
|
|
steps () {
|
|
const steps = [...this.baseSteps]
|
|
return steps
|
|
}
|
|
},
|
|
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.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
|
|
})
|
|
.catch(error => {
|
|
console.log(error.message)
|
|
})
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.border-info{
|
|
border: 1px solid #167df0 ;
|
|
}
|
|
.info-alumno p{
|
|
margin-bottom: .8rem;
|
|
|
|
}
|
|
.info-programa p{
|
|
margin-bottom: .8rem;
|
|
|
|
}
|
|
.mensaje{
|
|
margin: 3.5rem 0;
|
|
}
|
|
.else{
|
|
display: flex;
|
|
align-content: center !important;
|
|
}
|
|
</style>
|