pcpuma_unam_operador/components/admin/CrearModelo.vue
2022-07-21 14:00:56 -05:00

121 lines
2.9 KiB
Vue

<template>
<div class="box">
<dir class="columns is-align-items-flex-end pl-0 pb-4">
<b-field class="column mb-0 pb-0" label="Modelo">
<b-input
type="text"
placeholder="Modelo del carrito"
v-model="modelo"
rounded
@keyup.enter.native="
$alertsGenericos.imprimirWarning(
$buefy,
'¿Está segur@ de querer crear este modelo de carrito?',
crearModelo
)
"
/>
</b-field>
<b-button
type="is-info"
class="column is-4"
@click="
$alertsGenericos.imprimirWarning(
$buefy,
'¿Esta segur@ de querer crear este modelo de carrito?',
crearModelo
)
"
:disabled="!modelo"
expanded
rounded
>
Crear
</b-button>
</dir>
<b-collapse
aria-id="contentIdForA11y3"
class="card"
animation="slide"
v-model="active"
>
<template #trigger>
<div
class="card-header"
role="button"
aria-controls="contentIdForA11y3"
:aria-expanded="active"
>
<p class="card-header-title">Tabla de modelos de carritos</p>
<a class="card-header-icon">
<b-icon :icon="active ? 'menu-down' : 'menu-up'"> </b-icon>
</a>
</div>
</template>
<TablaOpcionesCreadas
v-if="active"
:data="modelos"
:columnaModelo="true"
/>
</b-collapse>
</div>
</template>
<script>
import axios from 'axios'
import TablaOpcionesCreadas from '@/components/admin/TablaOpcionesCreadas'
export default {
components: {
TablaOpcionesCreadas,
},
props: {
admin: { type: Object, require: true },
updateIsLoading: { type: Function, required: true },
},
data() {
return {
active: false,
modelos: [],
modelo: '',
}
},
methods: {
obtenerCatalogoModelo() {
axios
.get(`${process.env.api}/modelo/`, this.$getToken.token())
.then((res) => {
this.modelos = res.data
})
.catch((err) => {
this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
})
},
crearModelo() {
const data = {
modelo: this.modelo,
}
this.updateIsLoading(true)
axios
.post(`${process.env.api}/modelo/`, data, this.$getToken.token())
.then((res) => {
this.updateIsLoading(false)
this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
this.obtenerCatalogoModelo()
this.modelo = ''
})
.catch((err) => {
this.updateIsLoading(false)
this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
})
},
},
created() {
this.obtenerCatalogoModelo()
},
}
</script>