xXpuma99Xx
392 lines
10 KiB
Vue
392 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
<h3 class="title">Editar información del alumno</h3>
|
|
|
|
<div>
|
|
<b-field label="Correo eletrónico del alumno">
|
|
<b-input
|
|
type="email"
|
|
:placeholder="servicio.correo"
|
|
v-model="nuevo.correo"
|
|
/>
|
|
</b-field>
|
|
|
|
<b-field label="Fecha de inicio">
|
|
<b-datepicker
|
|
icon="calendar-today"
|
|
:placeholder="fecha(servicio.fechaInicio)"
|
|
:min-date="minDate1"
|
|
v-model="fechaInicio[0]"
|
|
/>
|
|
</b-field>
|
|
|
|
<transition name="fade">
|
|
<b-field label="Fecha de fin" v-if="fechaInicio[0]">
|
|
<b-datepicker
|
|
icon="calendar-today"
|
|
:placeholder="fecha(servicio.fechaInicio)"
|
|
:min-date="minDate2"
|
|
v-model="fechaFin[0]"
|
|
/>
|
|
</b-field>
|
|
</transition>
|
|
|
|
<b-field label="Dirección" v-if="servicio.direccion">
|
|
<b-input
|
|
type="text"
|
|
:placeholder="servicio.direccion"
|
|
v-model="nuevo.direccion"
|
|
/>
|
|
</b-field>
|
|
|
|
<b-field label="Teléfono" v-if="servicio.telefono">
|
|
<b-input
|
|
type="tel"
|
|
maxlength="10"
|
|
:has-counter="false"
|
|
:placeholder="servicio.telefono"
|
|
v-model="nuevo.telefono"
|
|
/>
|
|
</b-field>
|
|
|
|
<b-field label="Fecha de nacimiento" v-if="servicio.fechaNacimiento">
|
|
<b-datepicker
|
|
icon="calendar-today"
|
|
:placeholder="fecha(servicio.fechaNacimiento)"
|
|
v-model="fechaNacimiento[0]"
|
|
/>
|
|
</b-field>
|
|
|
|
<p class="is-size-5">Carta de aceptación</p>
|
|
|
|
<b-field>
|
|
<b-upload
|
|
v-model="nuevo.cartaAceptacion"
|
|
type="is-black"
|
|
v-on:input="validarExt(1)"
|
|
accept="application/pdf"
|
|
drag-drop
|
|
expanded
|
|
>
|
|
<section class="section">
|
|
<div class="content has-text-centered">
|
|
<p>
|
|
<b-icon icon="upload" size="is-large"></b-icon>
|
|
</p>
|
|
<p>
|
|
{{
|
|
nuevo.cartaAceptacion.name ||
|
|
'Arrastra aquí tu archivo o da click para buscar'
|
|
}}
|
|
{{ nuevo.cartaAceptacion }}
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</b-upload>
|
|
</b-field>
|
|
|
|
<p class="is-size-5" v-if="servicio.cartaTermino">Carta de término</p>
|
|
|
|
<b-field v-if="servicio.cartaTermino">
|
|
<b-upload
|
|
v-model="nuevo.cartaTermino"
|
|
type="is-black"
|
|
v-on:input="validarExt(2)"
|
|
accept="application/pdf"
|
|
drag-drop
|
|
expanded
|
|
>
|
|
<section class="section">
|
|
<div class="content has-text-centered">
|
|
<p>
|
|
<b-icon icon="upload" size="is-large"></b-icon>
|
|
</p>
|
|
<p>
|
|
{{
|
|
nuevo.cartaTermino.name ||
|
|
'Arrastra aquí tu archivo o da click para buscar'
|
|
}}
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</b-upload>
|
|
</b-field>
|
|
|
|
<p class="is-size-5" v-if="servicio.informeGlobal">Informe global</p>
|
|
|
|
<b-field v-if="servicio.informeGlobal">
|
|
<b-upload
|
|
v-model="nuevo.informeGlobal"
|
|
type="is-black"
|
|
v-on:input="validarExt(3)"
|
|
accept="application/pdf"
|
|
drag-drop
|
|
expanded
|
|
>
|
|
<section class="section">
|
|
<div class="content has-text-centered">
|
|
<p>
|
|
<b-icon icon="upload" size="is-large"></b-icon>
|
|
</p>
|
|
<p>
|
|
{{
|
|
nuevo.informeGlobal.name ||
|
|
'Arrastra aquí tu archivo o da click para buscar'
|
|
}}
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</b-upload>
|
|
</b-field>
|
|
</div>
|
|
|
|
<div>
|
|
<b-button
|
|
class="is-info"
|
|
:disabled="!mostrar()"
|
|
@click="
|
|
imprimirWarning(
|
|
'¿Seguro(a) que quiere actualizar estos datos?',
|
|
actualizar
|
|
)
|
|
"
|
|
>
|
|
Actualizar Datos
|
|
</b-button>
|
|
|
|
<b-button
|
|
class="is-info"
|
|
@click="
|
|
imprimirWarning(
|
|
'¿Seguro(a) que quieres cambiar la contraseña de este alumno?',
|
|
password
|
|
)
|
|
"
|
|
>
|
|
Cambiar contraseña
|
|
</b-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import axios from 'axios'
|
|
import moment from 'moment'
|
|
import validator from 'validator'
|
|
|
|
export default {
|
|
props: {
|
|
admin: { 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 {
|
|
idServicio: null,
|
|
idStatus: Number(localStorage.getItem('idStatus')),
|
|
servicio: {},
|
|
nuevo: {
|
|
correo: '',
|
|
fechaInicioFinal: '',
|
|
fechaFinFinal: null,
|
|
direccion: null,
|
|
telefono: null,
|
|
fechaNacimientoFinal: null,
|
|
cartaAceptacion: {},
|
|
cartaTermino: {},
|
|
informeGlobal: {},
|
|
},
|
|
fechaNacimiento: [],
|
|
fechaInicio: [],
|
|
fechaFin: [],
|
|
minDate1: new Date('2020-01-01'),
|
|
padding: false,
|
|
}
|
|
},
|
|
methods: {
|
|
fecha(date) {
|
|
if (date) {
|
|
const fecha = moment(date)
|
|
|
|
return `${fecha.date() < 10 ? '0' + fecha.date() : fecha.date()}/${
|
|
fecha.month() < 9 ? '0' + (fecha.month() + 1) : fecha.month() + 1
|
|
}/${fecha.year()}`
|
|
}
|
|
return ''
|
|
},
|
|
dangerToast() {
|
|
this.$buefy.toast.open({
|
|
message: 'Asegurate de ingresar un PDF',
|
|
type: 'is-danger',
|
|
})
|
|
},
|
|
toast() {
|
|
this.$buefy.toast.open({
|
|
message: 'Se han actualizado los datos',
|
|
type: 'is-success',
|
|
})
|
|
},
|
|
mostrar() {
|
|
if (
|
|
validator.isEmail(this.nuevo.correo) ||
|
|
this.nuevo.direccion ||
|
|
this.nuevo.telefono ||
|
|
this.nuevo.fechaNacimientoFinal ||
|
|
(this.nuevo.fechaInicioFinal && this.nuevo.fechaFinFinal) ||
|
|
this.nuevo.cartaTermino.name ||
|
|
this.nuevo.cartaAceptacion.name ||
|
|
this.nuevo.informeGlobal.name
|
|
) {
|
|
if (this.nuevo.correo) {
|
|
if (validator.isEmail(this.nuevo.correo)) {
|
|
return true
|
|
} else {
|
|
return false
|
|
}
|
|
}
|
|
return true
|
|
}
|
|
},
|
|
validarExt(a) {
|
|
const extPermitidas = /(.pdf)$/i
|
|
switch (a) {
|
|
case 1:
|
|
if (!extPermitidas.exec(this.nuevo.cartaAceptacion.name)) {
|
|
this.dangerToast()
|
|
this.nuevo.cartaAceptacion = {}
|
|
}
|
|
break
|
|
case 2:
|
|
if (!extPermitidas.exec(this.nuevo.cartaTermino.name)) {
|
|
this.dangerToast()
|
|
this.nuevo.cartaTermino = {}
|
|
}
|
|
break
|
|
case 3:
|
|
if (!extPermitidas.exec(this.nuevo.informeGlobal.name)) {
|
|
this.dangerToast()
|
|
this.nuevo.informeGlobal = {}
|
|
}
|
|
break
|
|
}
|
|
},
|
|
obtenerRegistro() {
|
|
this.updateIsLoading(true)
|
|
axios
|
|
.get(
|
|
`${process.env.api}/servicio/admin?idServicio=${this.idServicio}`,
|
|
this.admin.token
|
|
)
|
|
.then((res) => {
|
|
this.servicio = res.data
|
|
if (
|
|
this.servicio.Status.idStatus === 6 ||
|
|
this.servicio.Status.idStatus === 10
|
|
)
|
|
this.$router.push('/admin/servicio')
|
|
this.updateIsLoading(false)
|
|
})
|
|
.catch((err) => {
|
|
this.updateIsLoading(false)
|
|
this.imprimirError(err.response.data)
|
|
})
|
|
},
|
|
actualizar() {
|
|
const formData = new FormData()
|
|
const data = { idServicio: this.idServicio }
|
|
|
|
this.updateIsLoading(true)
|
|
if (this.nuevo.direccion) data.direccion = this.nuevo.direccion
|
|
if (this.nuevo.correo) data.correo = this.nuevo.correo
|
|
if (this.nuevo.telefono) data.telefono = this.nuevo.telefono
|
|
if (this.nuevo.fechaInicioFinal)
|
|
data.fechaInicio = this.nuevo.fechaInicioFinal
|
|
if (this.nuevo.fechaFinFinal) data.fechaFin = this.nuevo.fechaFinFinal
|
|
if (this.nuevo.fechaNacimientoFinal)
|
|
data.fechaNacimiento = this.nuevo.fechaNacimientoFinal
|
|
formData.append('data', JSON.stringify(data))
|
|
if (this.nuevo.cartaAceptacion)
|
|
formData.append('cartaAceptacion', this.nuevo.cartaAceptacion)
|
|
if (this.nuevo.cartaTermino)
|
|
formData.append('cartaTermino', this.nuevo.cartaTermino)
|
|
if (this.nuevo.informeGlobal)
|
|
formData.append('informeGlobal', this.nuevo.informeGlobal)
|
|
axios
|
|
.put(
|
|
`${process.env.api}/servicio/update`,
|
|
formData,
|
|
this.admin.tokenArchivo
|
|
)
|
|
.then((res) => {
|
|
this.toast()
|
|
this.updateIsLoading(false)
|
|
this.$router.push('/admin/servicio')
|
|
})
|
|
.catch((err) => {
|
|
this.updateIsLoading(false)
|
|
this.imprimirError(err.response.data)
|
|
})
|
|
},
|
|
password() {
|
|
const data = { idServicio: this.idServicio }
|
|
|
|
this.updateIsLoading(true)
|
|
axios
|
|
.put(
|
|
`${process.env.api}/usuario/new_password_alumno`,
|
|
data,
|
|
this.admin.token
|
|
)
|
|
.then((res) => {
|
|
this.$buefy.toast.open({
|
|
message: 'Se ha enviado el correo con la nueva contraseña',
|
|
type: 'is-success',
|
|
})
|
|
this.updateIsLoading(false)
|
|
this.$router.push('/admin')
|
|
})
|
|
.catch((err) => {
|
|
this.updateIsLoading(false)
|
|
this.imprimirError(err.response.data)
|
|
})
|
|
},
|
|
},
|
|
computed: {
|
|
minDate2() {
|
|
const min = new Date(this.fechaInicio)
|
|
return new Date(min.getFullYear(), min.getMonth() + 6, min.getDate())
|
|
},
|
|
},
|
|
watch: {
|
|
fechaInicio: function () {
|
|
this.nuevo.fechaInicioFinal = moment(this.fechaInicio[0])
|
|
this.fechaFin[0] = null
|
|
},
|
|
fechaFin: function () {
|
|
this.nuevo.fechaFinFinal = moment(this.fechaFin[0])
|
|
},
|
|
fechaNacimiento: function () {
|
|
this.nuevo.fechaNacimientoFinal = moment(this.fechaNacimiento[0])
|
|
},
|
|
},
|
|
created() {
|
|
this.idServicio = Number(localStorage.getItem('idServicio'))
|
|
if (!this.idServicio) this.$router.push('/admin')
|
|
else this.obtenerRegistro()
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.fade-enter-active,
|
|
.fade-leave-active {
|
|
transition: opacity 0.5s;
|
|
}
|
|
.fade-enter,
|
|
.fade-leave-to {
|
|
opacity: 0;
|
|
}
|
|
</style>
|