faltan tokens
This commit is contained in:
@@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<div class="full-h">
|
||||
<h2 class="has-text-centered is-size-3">Creación de premiaciones</h2>
|
||||
<div class="is-flex is-justify-content-center">
|
||||
<form class="box">
|
||||
<b-field label="Nombre de la premiación">
|
||||
<b-input
|
||||
type="text"
|
||||
placeholder="Digite el usuario"
|
||||
v-model="premiacion"
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Fecha">
|
||||
<b-datepicker
|
||||
v-model="fecha"
|
||||
locale="es-MX"
|
||||
placeholder="Seleccione"
|
||||
icon="calendar-today"
|
||||
:icon-right="fecha ? 'close-circle' : ''"
|
||||
icon-right-clickable
|
||||
trap-focus
|
||||
>
|
||||
</b-datepicker>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Hora (HH:MM, 24 horas)">
|
||||
<b-input
|
||||
v-model="hora"
|
||||
placeholder="Digite la hora"
|
||||
icon="clock"
|
||||
maxlength="5"
|
||||
>
|
||||
</b-input>
|
||||
</b-field>
|
||||
|
||||
<div class="has-text-centered">
|
||||
<b-button
|
||||
@click="confirmarEnviar()"
|
||||
type="is-success"
|
||||
:disabled="!(premiacion && fecha && hora)"
|
||||
>
|
||||
Crear premiación
|
||||
</b-button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
props: {
|
||||
updateIsLoading: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
premiacion: '',
|
||||
fecha: null,
|
||||
hora: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
confirmarEnviar() {
|
||||
this.$swal({
|
||||
title: '¿Estás seguro de querer crear esta premiación?',
|
||||
type: 'question',
|
||||
timer: 9000,
|
||||
showCancelButton: true,
|
||||
cancelButtonColor: '#d33',
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
}).then((res) => {
|
||||
if (res.value) {
|
||||
this.crear()
|
||||
}
|
||||
})
|
||||
},
|
||||
success() {
|
||||
this.$swal({
|
||||
title: 'Se ha creado la premiación con éxito.',
|
||||
type: 'success',
|
||||
timer: 5000,
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
errorMessage(err) {
|
||||
this.$swal({
|
||||
title: err,
|
||||
type: 'error',
|
||||
timer: 5000,
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
reset() {
|
||||
this.premiacion = ''
|
||||
this.fecha = null
|
||||
this.hora = null
|
||||
},
|
||||
crear() {
|
||||
this.updateIsLoading(true)
|
||||
const data = {
|
||||
premiacion: this.premiacion,
|
||||
fecha: this.fecha,
|
||||
hora: this.hora,
|
||||
activa: true
|
||||
}
|
||||
console.log(data)
|
||||
axios
|
||||
.post(`${process.env.api}/Premiacion/nueva`, data)
|
||||
.then((res) => {
|
||||
this.updateIsLoading(false)
|
||||
const info = res.data
|
||||
console.log(info)
|
||||
this.success()
|
||||
this.reset()
|
||||
})
|
||||
.catch((err) => {
|
||||
this.error = 'is-danger'
|
||||
this.updateIsLoading(false)
|
||||
this.errorMessage(err.response.data.message)
|
||||
this.reset()
|
||||
})
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
confirmarPassword() {
|
||||
if (this.password === this.confirmarPassword) this.sonIguales = true
|
||||
else this.sonIguales = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
form {
|
||||
width: 80%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<div class="full-h container">
|
||||
<b-button @click="atras()" type="is-primary"> Atrás </b-button>
|
||||
<h2 class="has-text-centered is-size-2">Creación de Operadores</h2>
|
||||
<div class="is-flex is-justify-content-center">
|
||||
<form class="box">
|
||||
<p class="is-size-4 block mr-4">
|
||||
<b>{{ premiacion }}</b>
|
||||
</p>
|
||||
<b-field :label="`Fecha: (${fecha})`">
|
||||
<b-datepicker
|
||||
v-model="fechaNueva"
|
||||
locale="es-MX"
|
||||
placeholder="Seleccione"
|
||||
icon="calendar-today"
|
||||
trap-focus
|
||||
>
|
||||
</b-datepicker>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Hora (HH:MM, 24 horas)">
|
||||
<b-input
|
||||
v-model="horaNueva"
|
||||
:placeholder="hora"
|
||||
icon="clock"
|
||||
maxlength="5"
|
||||
>
|
||||
</b-input>
|
||||
</b-field>
|
||||
|
||||
<div class="has-text-centered">
|
||||
<b-button
|
||||
@click="confirmarEnviar()"
|
||||
type="is-success"
|
||||
:disabled="!(fecha && hora)"
|
||||
>
|
||||
Editar
|
||||
</b-button>
|
||||
<b-button
|
||||
@click="confirmarEditar()"
|
||||
:type="colorBoton()"
|
||||
:disabled="!(fecha && hora)"
|
||||
>
|
||||
{{ textoBoton() }}
|
||||
</b-button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
props: {
|
||||
updateIsLoading: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
premiacion: localStorage.getItem('premiacion'),
|
||||
idPremiacion: localStorage.getItem('idPremiacion'),
|
||||
fecha: localStorage.getItem('fecha'),
|
||||
hora: localStorage.getItem('hora'),
|
||||
activa: localStorage.getItem('activa') === 'true' ? true : false,
|
||||
horaNueva: null,
|
||||
fechaNueva: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
editar() {
|
||||
const data = {
|
||||
idPremiacion: this.idPremiacion,
|
||||
hora: this.horaNueva,
|
||||
fecha: this.fechaNueva,
|
||||
}
|
||||
axios
|
||||
.put(`${process.env.api}/Premiacion/editar`, data)
|
||||
.then((res) => {
|
||||
this.updateIsLoading(false)
|
||||
let message = 'Se ha editado la premiación con éxito.'
|
||||
this.success(message)
|
||||
})
|
||||
.catch((err) => {
|
||||
this.updateIsLoading(false)
|
||||
this.errorMessage(err.response.data.message)
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
atras() {
|
||||
localStorage.removeItem('premiacion')
|
||||
localStorage.removeItem('idPremiacion')
|
||||
localStorage.removeItem('fecha')
|
||||
localStorage.removeItem('hora')
|
||||
localStorage.removeItem('activa')
|
||||
this.$router.push('/admin')
|
||||
},
|
||||
colorBoton() {
|
||||
console.log(this.activa)
|
||||
if (this.activa === true) return 'is-danger'
|
||||
return 'is-success'
|
||||
},
|
||||
textoBoton() {
|
||||
if (this.activa === true) return 'Desactivar'
|
||||
return 'Activar'
|
||||
},
|
||||
activarDesactivar() {
|
||||
this.updateIsLoading(true)
|
||||
const data = {
|
||||
idPremiacion: this.idPremiacion,
|
||||
activa: !this.activa,
|
||||
}
|
||||
console.log(data)
|
||||
axios
|
||||
.put(`${process.env.api}/Premiacion/activarDesactivar`, data)
|
||||
.then((res) => {
|
||||
this.updateIsLoading(false)
|
||||
let message =
|
||||
this.activa === true
|
||||
? 'Se ha desactivado la premiación con éxito'
|
||||
: 'Se ha desactivado la premiación con éxito'
|
||||
this.successEditar(message)
|
||||
})
|
||||
.catch((err) => {
|
||||
this.updateIsLoading(false)
|
||||
this.errorMessage(err.response.data.message)
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
confirmarEditar() {
|
||||
this.$swal({
|
||||
title: '¿Estás seguro de querer editar esta premiación?',
|
||||
type: 'question',
|
||||
timer: 9000,
|
||||
showCancelButton: true,
|
||||
cancelButtonColor: '#d33',
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
}).then((res) => {
|
||||
if (res.value) {
|
||||
this.activarDesactivar()
|
||||
}
|
||||
})
|
||||
},
|
||||
confirmarEnviar() {
|
||||
this.$swal({
|
||||
title: '¿Estás seguro de querer editar esta premiación?',
|
||||
type: 'question',
|
||||
timer: 9000,
|
||||
showCancelButton: true,
|
||||
cancelButtonColor: '#d33',
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
}).then((res) => {
|
||||
if (res.value) {
|
||||
this.editar()
|
||||
}
|
||||
})
|
||||
},
|
||||
success(text) {
|
||||
this.$swal({
|
||||
title: text,
|
||||
type: 'success',
|
||||
timer: 5000,
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
successEditar(text) {
|
||||
this.$swal({
|
||||
title: text,
|
||||
type: 'success',
|
||||
timer: 5000,
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
}).then((res) => {
|
||||
if (res.value) {
|
||||
this.$router.push("/admin")
|
||||
}
|
||||
})
|
||||
},
|
||||
errorMessage(err) {
|
||||
this.$swal({
|
||||
title: err,
|
||||
type: 'error',
|
||||
timer: 5000,
|
||||
confirmButtonText: 'Aceptar',
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
form {
|
||||
width: 80%;
|
||||
}
|
||||
</style>
|
||||
@@ -4,15 +4,29 @@
|
||||
<div class="is-flex is-justify-content-center">
|
||||
<form class="box">
|
||||
<b-field label="Usuario">
|
||||
<b-input type="text" v-model="usuario" />
|
||||
<b-input
|
||||
type="text"
|
||||
placeholder="Digite el usuario"
|
||||
v-model="usuario"
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Contraseña">
|
||||
<b-input type="password" v-model="password" password-reveal/>
|
||||
<b-input
|
||||
type="password"
|
||||
placeholder="Digite la contraseña"
|
||||
v-model="password"
|
||||
password-reveal
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Confirmar contraseña">
|
||||
<b-input type="password" v-model="confirmarPassword" password-reveal/>
|
||||
<b-input
|
||||
type="password"
|
||||
placeholder="Digite la contraseña de nuevo"
|
||||
v-model="confirmarPassword"
|
||||
password-reveal
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<div class="has-text-centered">
|
||||
@@ -73,7 +87,7 @@ export default {
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
errorMessage(err){
|
||||
errorMessage(err) {
|
||||
this.$swal({
|
||||
title: err,
|
||||
type: 'error',
|
||||
@@ -82,7 +96,7 @@ export default {
|
||||
confirmButtonColor: '#1e3c70',
|
||||
})
|
||||
},
|
||||
reset(){
|
||||
reset() {
|
||||
this.usuario = ''
|
||||
this.password = ''
|
||||
this.confirmarPassword = ''
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<CrearPremiacion :updateIsLoading="updateIsLoading"/>
|
||||
<h2 class="has-text-centered mt-5 is-size-3">Administración de premiaciones</h2>
|
||||
<TablaPremiaciones
|
||||
:data="data"
|
||||
:isLoadingTable="isLoadingTable"
|
||||
@@ -13,10 +15,19 @@
|
||||
|
||||
<script>
|
||||
import TablaPremiaciones from './TablaPremiaciones.vue'
|
||||
import CrearPremiacion from './CrearPremiacion.vue'
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
components: {
|
||||
TablaPremiaciones,
|
||||
CrearPremiacion
|
||||
},
|
||||
props: {
|
||||
updateIsLoading: {
|
||||
type: Function,
|
||||
required: true,
|
||||
default: () => {},
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -31,9 +42,6 @@ export default {
|
||||
this.page = page
|
||||
this.obtenerData()
|
||||
},
|
||||
updateIsLoading(booleanValue) {
|
||||
this.isLoading = booleanValue
|
||||
},
|
||||
obtenerData() {
|
||||
this.updateIsLoading(true)
|
||||
axios
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
>
|
||||
<b-table-column
|
||||
field="idPremiacion"
|
||||
label="Número de premiación"
|
||||
label="Id"
|
||||
v-slot="props"
|
||||
centered
|
||||
sortable
|
||||
@@ -37,7 +37,13 @@
|
||||
<span v-else>-</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="fecha" label="Fecha" v-slot="props" centered sortable>
|
||||
<b-table-column
|
||||
field="fecha"
|
||||
label="Fecha"
|
||||
v-slot="props"
|
||||
centered
|
||||
sortable
|
||||
>
|
||||
<span v-if="props.row.fecha">
|
||||
{{ fecha(props.row.fecha) }}
|
||||
</span>
|
||||
@@ -45,18 +51,20 @@
|
||||
<span v-else>-</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column
|
||||
field="activa"
|
||||
label="Activa"
|
||||
sortable
|
||||
v-slot="props"
|
||||
@click="activarDesactivar()"
|
||||
clickable
|
||||
>
|
||||
<b-table-column field="activa" label="Activa" sortable v-slot="props">
|
||||
<span class="tag" :class="type(props.row.activa)">
|
||||
{{ props.row.activa }}
|
||||
</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="editar" label="Editar" centered v-slot="props">
|
||||
<b-button
|
||||
type="is-primary"
|
||||
v-if="!props.row.folio && !props.row.monto && !props.row.fechaTicket"
|
||||
@click="editar(props.row)"
|
||||
>Editar</b-button
|
||||
>
|
||||
</b-table-column>
|
||||
</b-table>
|
||||
</template>
|
||||
|
||||
@@ -91,6 +99,14 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
editar(data){
|
||||
localStorage.setItem("premiacion", data.premiacion)
|
||||
localStorage.setItem("idPremiacion", data.idPremiacion)
|
||||
localStorage.setItem("fecha", data.fecha)
|
||||
localStorage.setItem("hora", data.hora)
|
||||
localStorage.setItem("activa", data.activa)
|
||||
this.$router.push("/admin/editarPremiacion")
|
||||
},
|
||||
fecha(date) {
|
||||
const fecha = moment(date)
|
||||
|
||||
@@ -105,27 +121,9 @@ export default {
|
||||
if (bool === false) {
|
||||
return 'is-danger'
|
||||
} else {
|
||||
return 'is-primary'
|
||||
return 'is-success'
|
||||
}
|
||||
},
|
||||
activarDesactivar(idPremiacion, activa){
|
||||
this.updateIsLoadingPage(true)
|
||||
const data = {
|
||||
idPremiacion,
|
||||
activa
|
||||
}
|
||||
axios
|
||||
.post(`${process.env.api}/Premiacion/activarDesactivar`, data)
|
||||
.then((res) => {
|
||||
this.updateIsLoadingPage(true)
|
||||
const info = res.data
|
||||
console.log(info)
|
||||
})
|
||||
.catch((err) => {
|
||||
this.updateIsLoadingPage(false)
|
||||
console.log(err)
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<section class="container mt-5">
|
||||
<EditarPremiacion :updateIsLoading="updateIsLoading" />
|
||||
<b-loading :is-full-page="true" v-model="isLoading" :can-cancel="false" />
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EditarPremiacion from '@/components/admin/EditarPremiacion.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
EditarPremiacion,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tab: '0',
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateIsLoading(booleanValue) {
|
||||
this.isLoading = booleanValue
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.full-h {
|
||||
min-height: 75vh;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.container {
|
||||
margin: 0 15px !important;
|
||||
}
|
||||
.full-h {
|
||||
min-height: 80vh;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -2,7 +2,7 @@
|
||||
<section class="container mt-5">
|
||||
<b-tabs :destroy-on-hide="true" v-model="tab" expanded>
|
||||
<b-tab-item label="Premiaciones" icon="medal" value="0">
|
||||
<Premiaciones />
|
||||
<Premiaciones :updateIsLoading="updateIsLoading"/>
|
||||
</b-tab-item>
|
||||
|
||||
<b-tab-item label="Operadores" icon="account" value="1">
|
||||
|
||||
Reference in New Issue
Block a user