101 lines
2.6 KiB
Vue
101 lines
2.6 KiB
Vue
<template>
|
|
<div class="has-text-centered">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<b-field label="Selecciona la hora de inicio">
|
|
<b-clockpicker
|
|
type="is-info"
|
|
v-model="horaInicio"
|
|
inline
|
|
:min-time="minTime"
|
|
:max-time="maxTime"
|
|
:locale="locale"
|
|
:hour-format="hourFormat"
|
|
/>
|
|
</b-field>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<b-field label="Selecciona la hora de fin">
|
|
<b-clockpicker
|
|
type="is-info"
|
|
v-model="horaFin"
|
|
inline
|
|
:min-time="minTime"
|
|
:max-time="maxTime"
|
|
:locale="locale"
|
|
:hour-format="hourFormat"
|
|
/>
|
|
</b-field>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="has-text-centered">
|
|
<b-button
|
|
class="my-5"
|
|
type="is-success"
|
|
@click="
|
|
$alertsGenericos.imprimirWarning($buefy, mensajeWarning, funcionHora)
|
|
"
|
|
>
|
|
Guardar
|
|
</b-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import moment from 'moment'
|
|
export default {
|
|
props: {
|
|
cambiarHora: { type: Function, require: false },
|
|
crearHoraExcepcion: { type: Function, require: false },
|
|
diaSeleccion: { type: Object, require: true },
|
|
tipo: { type: String, require: true },
|
|
},
|
|
data() {
|
|
const min = new Date()
|
|
min.setHours(7)
|
|
min.setMinutes(0)
|
|
const max = new Date()
|
|
max.setHours(20)
|
|
max.setMinutes(0)
|
|
return {
|
|
minTime: min,
|
|
maxTime: max,
|
|
horaInicio: new Date(`01-01-2022 09:00`),
|
|
horaFin: new Date(`01-01-2022 17:45`),
|
|
locale: 'es-ES', // Browser locale
|
|
hourFormat: '24', // Browser locale
|
|
|
|
mensajeWarning: '',
|
|
}
|
|
},
|
|
methods: {
|
|
funcionHora() {
|
|
if (this.tipo === 'cambiarHora')
|
|
this.cambiarHora(
|
|
this.diaSeleccion,
|
|
moment(this.horaInicio).format('HH:mm'),
|
|
moment(this.horaFin).format('HH:mm')
|
|
)
|
|
else
|
|
this.crearHoraExcepcion(
|
|
this.diaSeleccion.id_institucion_dia,
|
|
moment(this.horaInicio).format('HH:mm'),
|
|
moment(this.horaFin).format('HH:mm')
|
|
)
|
|
},
|
|
},
|
|
created() {
|
|
this.horaInicio = new Date(`01-01-2022 ${this.diaSeleccion.hora_inicio}`)
|
|
this.horaFin = new Date(`01-01-2022 ${this.diaSeleccion.hora_fin}`)
|
|
if (this.tipo === 'cambiarHora')
|
|
this.mensajeWarning =
|
|
'¿Esta segur@ de querer actualizar el horario de este día?'
|
|
else
|
|
this.mensajeWarning = '¿Esta segur@ de querer crear esta hora excepción?'
|
|
},
|
|
}
|
|
</script>
|