pcpuma_unam_operador/components/operador/InputsCarritos.vue
2022-07-11 09:15:10 -05:00

95 lines
2.4 KiB
Vue

<template>
<div>
<div class="columns is-align-items-flex-end pl-0 pb-4">
<b-field class="column mb-0 pb-0" field="carrito" label="Carrito">
<b-input
placeholder="Carrito"
v-model="carrito"
rounded
@keyup.enter.native="obtenerCarritos"
/>
</b-field>
<b-field
class="column mb-0 pb-0"
field="tipoCarrito"
label="Tipo Carrito"
>
<b-select v-model="idTipoCarrito" rounded expanded>
<option disabled>Tipo carrito</option>
<option
v-for="tipo_carrito in tipoCarrito"
:value="tipo_carrito.id_tipo_carrito"
:key="tipo_carrito.id_tipo_carrito"
>
{{ tipo_carrito.tipo_carrito }}
</option>
</b-select>
</b-field>
<b-button
class="column mb-0"
type="is-info"
@click="obtenerCarritos"
rounded
expanded
>Buscar</b-button
>
</div>
<TablaCarritos
:operador="operador"
:carritos="carritos"
:isLoadingTable="isLoadingTable"
/>
</div>
</template>
<script>
import axios from 'axios'
import TablaCarritos from '@/components/operador/TablaCarritos'
export default {
components: { TablaCarritos },
props: {
operador: { type: Object, required: true },
},
data() {
return {
tipoCarrito: [
{ id_tipo_carrito: 1, tipo_carrito: 'Chromebook' },
{ id_tipo_carrito: 2, tipo_carrito: 'iPad' },
{ id_tipo_carrito: 3, tipo_carrito: 'Laptop' },
],
carritos: [],
carrito: '',
idTipoCarrito: 0,
isLoadingTable: false,
}
},
methods: {
obtenerCarritos() {
let id_tipo_carrito = ''
if (this.idTipoCarrito != 0)
id_tipo_carrito = '&id_tipo_carrito=' + this.idTipoCarrito
this.isLoadingTable = true
axios
.get(
`${process.env.api}/carrito/carritos?pagina=1&id_institucion=${this.operador.institucion.id_institucion}&carrito=${this.carrito}${id_tipo_carrito}`
)
.then(async (res) => {
this.carritos = res.data[0]
this.isLoadingTable = false
})
.catch((err) => {
this.isLoadingTable = false
this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
})
},
},
created() {
this.obtenerCarritos()
},
}
</script>