pcpuma_unam_operador/components/tablaBuscador/TablaBuscadorMultas.vue
2022-09-06 10:43:32 -05:00

123 lines
3.2 KiB
Vue

<template>
<div>
<h3 class="is-size-4 mb-3">Todas las multas</h3>
<div class="columns is-multiline mb-5 is-align-items-flex-end">
<SelectInstitucion
columnSize="is-3"
:idInstitucionPadre="idInstitucion"
@institucion-seleccionada="
(nuevaInstitucion) => (idInstitucion = nuevaInstitucion)
"
v-if="operador.tipoUsuario.id_tipo_usuario === 2"
/>
<InputNumeroCuenta
columnSize="is-3"
:numeroCuentaPadre="usuario"
:ejecutar="obtenerMultas"
@numero-cuenta="(numeroCuentaNuevo) => (usuario = numeroCuentaNuevo)"
/>
<BotonBuscar
columnSize="is-3"
:buscar="obtenerMultas"
:disabled="false"
/>
</div>
<TablaMultas
:multas="multas"
:isLoadingTable="isLoadingTable"
:obtenerMultas="obtenerMultas"
:onPageChange="onPageChange"
:total="total"
:page="page"
columnaUsuario
/>
</div>
</template>
<script>
import axios from 'axios'
import BotonBuscar from '@/components/botones/BotonBuscar'
import InputNumeroCuenta from '@/components/inputs/InputNumeroCuenta'
import SelectInstitucion from '@/components/selects/SelectInstitucion'
import TablaMultas from '@/components/tablas/TablaMultas'
export default {
components: {
BotonBuscar,
InputNumeroCuenta,
SelectInstitucion,
TablaMultas,
},
props: { operador: { type: Object, required: true } },
data() {
return {
multas: [],
isLoadingTable: false,
idInstitucion: 0,
page: 1,
total: 0,
lastSearch: {},
usuario: '',
}
},
methods: {
obtenerMultas() {
let query = ''
this.isLoadingTable = true
if (
this.usuario != this.lastSearch.usuario ||
(this.operador.institucion &&
this.operador.institucion.id_institucion !=
this.lastSearch.idInstitucion) ||
(this.operador.tipoUsuario.id_tipo_usuario === 2 &&
this.idInstitucion &&
this.idInstitucion != this.lastSearch.idInstitucion)
) {
this.page = 1
if (this.operador.institucion)
this.lastSearch.idInstitucion =
this.operador.institucion.id_institucion
else if (this.idInstitucion)
this.lastSearch.idInstitucion = this.idInstitucion
this.lastSearch.usuario = this.usuario
}
if (this.operador.institucion)
query += `&id_institucion=${this.operador.institucion.id_institucion}`
else if (this.idInstitucion)
query += `&id_institucion=${this.idInstitucion}`
if (this.usuario) query += `&usuario=${this.usuario}`
axios
.get(
`${process.env.api}/multa?pagina=${this.page}${query}`,
this.$getToken.token()
)
.then((res) => {
this.multas = res.data[0]
this.total = res.data[1]
this.isLoadingTable = false
})
.catch((err) => {
this.isLoadingTable = false
this.$alertsGenericos.imprimirError(
this.$buefy,
this.$router,
err.response.data
)
})
},
onPageChange(page) {
this.page = page
this.obtenerMultas()
},
},
created() {
this.obtenerMultas()
},
}
</script>