100 lines
2.9 KiB
Vue
100 lines
2.9 KiB
Vue
<template>
|
|
<div class="has-text-centered">
|
|
<div class="columns">
|
|
<Reloj
|
|
tipo="inicio"
|
|
:horaStr="institucionDia.hora_inicio"
|
|
@hora-seleccionada="(nuevaHoraInicio) => (horaInicio = nuevaHoraInicio)"
|
|
/>
|
|
|
|
<Reloj
|
|
tipo="fin"
|
|
:horaStr="institucionDia.hora_fin"
|
|
@hora-seleccionada="(nuevaHoraFind) => (horaFin = nuevaHoraFind)"
|
|
/>
|
|
|
|
<Reloj
|
|
tipo="extra"
|
|
:horaStr="institucionDia.hora_extra"
|
|
@hora-seleccionada="(nuevaHoraExtra) => (horaExtra = nuevaHoraExtra)"
|
|
/>
|
|
|
|
<Reloj
|
|
tipo="tope"
|
|
:horaStr="institucionDia.hora_tope"
|
|
@hora-seleccionada="(nuevaHoraTope) => (horaTope = nuevaHoraTope)"
|
|
/>
|
|
</div>
|
|
|
|
<div class="columns is-centered">
|
|
<BotonGuardar
|
|
columnSize="is-3"
|
|
msjWarning="¿Estás segur@ de querer guardar estos cambios?"
|
|
:guardar="guardar"
|
|
:disabled="false"
|
|
column
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import axios from 'axios'
|
|
import moment from 'moment'
|
|
import BotonGuardar from '@/components/botones/BotonGuardar'
|
|
import Reloj from '@/components/admin/Reloj'
|
|
|
|
export default {
|
|
components: { BotonGuardar, Reloj },
|
|
props: {
|
|
editar: { type: Function, required: true, default: () => {} },
|
|
obtenerDias: { type: Function, required: true, default: () => {} },
|
|
updateIsLoading: { type: Function, required: true, default: () => {} },
|
|
institucionDia: { type: Object, required: true, default: () => ({}) },
|
|
},
|
|
data() {
|
|
return {
|
|
horaInicio: new Date(),
|
|
horaFin: new Date(),
|
|
horaExtra: new Date(),
|
|
horaTope: new Date(),
|
|
}
|
|
},
|
|
methods: {
|
|
guardar() {
|
|
const data = {
|
|
id_institucion_dia: this.institucionDia.id_institucion_dia,
|
|
hora_inicio: moment(this.horaInicio).format('HH:mm'),
|
|
hora_fin: moment(this.horaFin).format('HH:mm'),
|
|
hora_extra: moment(this.horaExtra).format('HH:mm'),
|
|
hora_tope: moment(this.horaTope).format('HH:mm'),
|
|
}
|
|
|
|
this.updateIsLoading(true)
|
|
return axios
|
|
.put(`${process.env.api}/institucion-dia`, data, this.$getToken.token())
|
|
.then((res) => {
|
|
this.obtenerDias()
|
|
this.editar(this.institucionDia)
|
|
this.updateIsLoading(false)
|
|
this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
|
|
})
|
|
.catch((err) => {
|
|
this.updateIsLoading(false)
|
|
this.$alertsGenericos.imprimirError(
|
|
this.$buefy,
|
|
this.$router,
|
|
err.response.data
|
|
)
|
|
})
|
|
},
|
|
},
|
|
created() {
|
|
this.horaInicio = new Date(`01-01-2022 ${this.institucionDia.hora_inicio}`)
|
|
this.horaFin = new Date(`01-01-2022 ${this.institucionDia.hora_fin}`)
|
|
this.horaExtra = new Date(`01-01-2022 ${this.institucionDia.hora_extra}`)
|
|
this.horaTope = new Date(`01-01-2022 ${this.institucionDia.hora_tope}`)
|
|
},
|
|
}
|
|
</script>
|