multas listo
This commit is contained in:
Lemuel
parent
20dcdb5d9c
commit
4ab6eb1c61
@ -18,7 +18,7 @@
|
||||
>
|
||||
<div class="content has-text-centered">
|
||||
<p>
|
||||
<b-icon icon="upload" size="is-large"></b-icon>
|
||||
<b-icon icon="upload" size="is-large" />
|
||||
</p>
|
||||
|
||||
<p>
|
||||
|
||||
17
components/operador/Multas.vue
Normal file
17
components/operador/Multas.vue
Normal file
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<TablaBuscadorMultas :operador="operador" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Title from '@/components/layouts/Title'
|
||||
import TablaBuscadorMultas from '@/components/tablaBuscador/TablaBuscadorMultas'
|
||||
|
||||
export default {
|
||||
components: { TablaBuscadorMultas, Title },
|
||||
props: { operador: { type: Object, required: true } },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
|
||||
@ -1,136 +0,0 @@
|
||||
<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="Número de cuenta/trabajador"
|
||||
>
|
||||
<b-input
|
||||
placeholder="Número de cuenta/trabajador"
|
||||
v-model="usuario"
|
||||
rounded
|
||||
@keyup.enter.native="obtenerMultas"
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<b-field
|
||||
class="column is-4"
|
||||
label="Nombre de la Institución"
|
||||
v-if="operador.tipoUsuario.id_tipo_usuario === 2"
|
||||
>
|
||||
<b-select v-model="idInstitucion" expanded rounded>
|
||||
<option value="" disabled>Institución</option>
|
||||
<option
|
||||
v-for="institucion in instituciones"
|
||||
:value="institucion.id_institucion"
|
||||
:key="institucion.id_institucion"
|
||||
>
|
||||
{{ institucion.institucion }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<b-button
|
||||
class="column mb-0"
|
||||
type="is-info"
|
||||
@click="obtenerMultas"
|
||||
rounded
|
||||
expanded
|
||||
>Buscar</b-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<TablaMultas
|
||||
:operador="operador"
|
||||
:multas="multas"
|
||||
:isLoadingTable="isLoadingTable"
|
||||
:page="page"
|
||||
:total="total"
|
||||
:onPageChange="onPageChange"
|
||||
:columnaUsuario="true"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import TablaMultas from '@/components/operador/usuarios/TablaMultas'
|
||||
|
||||
export default {
|
||||
components: { TablaMultas },
|
||||
props: {
|
||||
operador: { type: Object, required: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
multas: [],
|
||||
instituciones: [],
|
||||
usuario: '',
|
||||
idCarrera: null,
|
||||
idInstitucion: null,
|
||||
nombre: '',
|
||||
isLoadingTable: false,
|
||||
page: 1,
|
||||
tipoUsuario: null,
|
||||
total: 0,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onPageChange(page) {
|
||||
this.page = page
|
||||
this.obtenerMultas()
|
||||
},
|
||||
updateEquipo(valorObject) {
|
||||
this.equipo = valorObject
|
||||
},
|
||||
obtenerMultas() {
|
||||
let url = `${process.env.api}`
|
||||
url += `/multa?pagina=${this.page}`
|
||||
|
||||
this.idInstitucion !== null
|
||||
? (url += `&id_institucion=${this.idInstitucion}`)
|
||||
: null
|
||||
|
||||
this.usuario !== '' ? (url += `&usuario=${this.usuario}`) : null
|
||||
|
||||
this.isLoadingTable = true
|
||||
axios
|
||||
.get(`${url}`, this.$getToken.token())
|
||||
.then(async (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
|
||||
)
|
||||
})
|
||||
},
|
||||
obtenerInstituciones() {
|
||||
axios
|
||||
.get(`${process.env.api}/institucion`, this.$getToken.token())
|
||||
.then(async (res) => {
|
||||
this.instituciones = res.data
|
||||
})
|
||||
.catch((err) => {
|
||||
this.$alertsGenericos.imprimirError(
|
||||
this.$buefy,
|
||||
this.$router,
|
||||
err.response.data
|
||||
)
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.tipoUsuario = this.operador.tipoUsuario.id_tipo_usuario
|
||||
if (this.operador.tipoUsuario.id_tipo_usuario === 2)
|
||||
this.obtenerInstituciones()
|
||||
this.obtenerMultas()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -1,127 +0,0 @@
|
||||
<template>
|
||||
<b-table
|
||||
:data="multas"
|
||||
:loading="isLoadingTable"
|
||||
:row-class="(row, index) => 'pointer'"
|
||||
class="mb-6"
|
||||
:per-page="25"
|
||||
@page-change="onPageChange"
|
||||
show-detail-icon
|
||||
paginated
|
||||
detailed
|
||||
>
|
||||
<b-table-column
|
||||
field="usuario"
|
||||
label="Número de cuenta/trabajador"
|
||||
v-slot="props"
|
||||
v-if="columnaUsuario"
|
||||
centered
|
||||
>
|
||||
<span>{{ props.row.prestamo.usuario.usuario }}</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column
|
||||
field="fechaInicio"
|
||||
label="Fecha Inicio"
|
||||
v-slot="props"
|
||||
centered
|
||||
>
|
||||
<span>{{ fechaHora(props.row.fecha_inicio) }}</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="fechaFin" label="Fecha Fin" v-slot="props" centered>
|
||||
<span>{{ fechaHora(props.row.fecha_fin) }}</span>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="operador" label="Operador" v-slot="props" centered>
|
||||
<span>{{ props.row.opeardorMulta.operador }}</span>
|
||||
</b-table-column>
|
||||
|
||||
<template #detail="props">
|
||||
<div class="columns">
|
||||
<div class="column is-1"></div>
|
||||
<div class="column has-text-centered is-size-5 detail-item">
|
||||
<b>Descripción:</b>
|
||||
</div>
|
||||
<div class="column has-text-centered is-size-5 detail-item">
|
||||
<b>Infracción extra:</b>
|
||||
</div>
|
||||
<div class="column has-text-centered is-size-5 detail-item">
|
||||
<b>Retraso:</b>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container columns">
|
||||
<div class="column is-1"></div>
|
||||
<div class="column has-text-centered is-size-6 detail-item">
|
||||
{{ props.row.descripcion }}
|
||||
</div>
|
||||
<div
|
||||
v-if="props.row.institucionInfraccion.infraccion.infraccion"
|
||||
class="column has-text-centered is-size-6 detail-item"
|
||||
>
|
||||
{{ props.row.institucionInfraccion.infraccion.infraccion }}
|
||||
</div>
|
||||
<div v-else class="column has-text-centered is-size-6 detail-item">
|
||||
No hay infracción adicional
|
||||
</div>
|
||||
<div class="column has-text-centered is-size-6 detail-item">
|
||||
<span class="is-size-6 tag" :class="choooseTag(props.row.retraso)">{{
|
||||
props.row.retraso ? 'Verdadero' : 'Falso'
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #empty>
|
||||
<div class="has-text-centered">
|
||||
<p class="is-size-6">No hay usuarios</p>
|
||||
</div>
|
||||
</template>
|
||||
</b-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
// import TablaEquiCarritos from '@/components/operador/TablaEquiCarritos'
|
||||
|
||||
export default {
|
||||
// components: { TablaEquiCarritos },
|
||||
props: {
|
||||
operador: { type: Object, required: true },
|
||||
multas: { type: Array, required: true },
|
||||
page: { type: Number, required: true },
|
||||
total: { type: Number, required: true },
|
||||
onPageChange: { type: Function, required: true },
|
||||
isLoadingTable: { type: Boolean, required: true },
|
||||
columnaUsuario: { type: Boolean, required: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selectedMulta: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
choooseTag(activo) {
|
||||
const style = {
|
||||
false: 'is-danger',
|
||||
true: 'is-success',
|
||||
}
|
||||
return style[activo]
|
||||
},
|
||||
fechaHora(date) {
|
||||
const fecha = moment(date)
|
||||
|
||||
return fecha.isValid() ? fecha.format('YYYY-MM-DD HH:mm') : ''
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -43,7 +43,7 @@
|
||||
import axios from 'axios'
|
||||
import BuscarUsuario from '@/components/operador/usuarios/BuscarUsuario'
|
||||
import TablaPrestamo from '@/components/tablas/TablaPrestamos'
|
||||
import TablaMultas from '@/components/operador/usuarios/TablaMultas'
|
||||
import TablaMultas from '@/components/tablas/TablaMultas'
|
||||
|
||||
export default {
|
||||
components: { BuscarUsuario, TablaPrestamo, TablaMultas },
|
||||
|
||||
@ -116,6 +116,7 @@ export default {
|
||||
return {
|
||||
equipos: [],
|
||||
isLoadingTable: false,
|
||||
idInstitucion: 0,
|
||||
idMarca: 0,
|
||||
idModelo: 0,
|
||||
idModulo: 0,
|
||||
|
||||
125
components/tablaBuscador/TablaBuscadorMultas.vue
Normal file
125
components/tablaBuscador/TablaBuscadorMultas.vue
Normal file
@ -0,0 +1,125 @@
|
||||
<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"
|
||||
/>
|
||||
|
||||
<b-field class="column is-3 mb-0 pb-0" label="Usuario">
|
||||
<b-input
|
||||
icon="user"
|
||||
placeholder="Usuario"
|
||||
type="text"
|
||||
@keyup.enter.native="obtenerMultas()"
|
||||
v-model="usuario"
|
||||
rounded
|
||||
/>
|
||||
</b-field>
|
||||
|
||||
<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 SelectInstitucion from '@/components/selects/SelectInstitucion'
|
||||
import TablaMultas from '@/components/tablas/TablaMultas'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BotonBuscar,
|
||||
SelectInstitucion,
|
||||
TablaMultas,
|
||||
},
|
||||
props: { operador: { type: Object, required: true } },
|
||||
data() {
|
||||
return {
|
||||
multas: [],
|
||||
isLoadingTable: false,
|
||||
idInstitucion: 0,
|
||||
page: 1,
|
||||
total: 0,
|
||||
lastSearch: {},
|
||||
usuario: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
obtenerMultas() {
|
||||
let data = ''
|
||||
|
||||
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.usuario) data += `&usuario=${this.usuario}`
|
||||
if (this.operador.institucion)
|
||||
data += `&id_institucion=${this.operador.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
data += `&id_institucion=${this.idInstitucion}`
|
||||
axios
|
||||
.get(
|
||||
`${process.env.api}/multa?pagina=${this.page}${data}`,
|
||||
this.$getToken.token()
|
||||
)
|
||||
.then((res) => {
|
||||
console.log(res.data)
|
||||
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>
|
||||
116
components/tablas/TablaMultas.vue
Normal file
116
components/tablas/TablaMultas.vue
Normal file
@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<b-table
|
||||
class="pb-6"
|
||||
:current-page="page"
|
||||
:data="multas"
|
||||
:loading="isLoadingTable"
|
||||
:per-page="25"
|
||||
:total="total"
|
||||
@page-change="onPageChange"
|
||||
backend-pagination
|
||||
detailed
|
||||
hoverable
|
||||
paginated
|
||||
show-detail-icon
|
||||
striped
|
||||
>
|
||||
<b-table-column
|
||||
field="usuario"
|
||||
label="Número de cuenta/trabajador"
|
||||
v-slot="props"
|
||||
v-if="columnaUsuario"
|
||||
centered
|
||||
>
|
||||
<p>{{ props.row.prestamo.usuario.usuario }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column
|
||||
field="fechaInicio"
|
||||
label="Fecha Inicio"
|
||||
v-slot="props"
|
||||
centered
|
||||
>
|
||||
<p>{{ fechaHora(props.row.fecha_inicio) }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="fechaFin" label="Fecha Fin" v-slot="props" centered>
|
||||
<p>{{ fechaHora(props.row.fecha_fin) }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="operador" label="Operador" v-slot="props" centered>
|
||||
<p>{{ props.row.opeardorMulta.operador || "" }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column field="activo" label="Status" v-slot="props" centered>
|
||||
<p>{{ props.row.activo ? "Vigente": "Expirada" }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<template #detail="props">
|
||||
<b-table class="pb-6" :data="[props.row]" hoverable striped>
|
||||
<b-table-column
|
||||
field="descripcion"
|
||||
label="Descripción"
|
||||
v-slot="props"
|
||||
centered
|
||||
>
|
||||
<p>{{ props.row.descripcion }}</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column
|
||||
field="infraccion"
|
||||
label="Infraccion extra"
|
||||
v-slot="props"
|
||||
centered
|
||||
>
|
||||
<p
|
||||
v-if="
|
||||
props.row.institucionInfraccion &&
|
||||
props.row.institucionInfraccion.infraccion.id_infraccion != 1
|
||||
"
|
||||
>
|
||||
{{ props.row.institucionInfraccion.infraccion.infraccion }}
|
||||
</p>
|
||||
|
||||
<p v-else>-</p>
|
||||
</b-table-column>
|
||||
|
||||
<b-table-column
|
||||
field="retraso"
|
||||
label="Retraso"
|
||||
v-slot="props"
|
||||
centered
|
||||
>
|
||||
<b-icon
|
||||
class="is-success"
|
||||
icon="check"
|
||||
size="is-large"
|
||||
v-if="props.row.retraso"
|
||||
/>
|
||||
|
||||
<p v-else>-</p>
|
||||
</b-table-column>
|
||||
</b-table>
|
||||
</template>
|
||||
</b-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
multas: { type: Array, required: true, default: () => [] },
|
||||
columnaUsuario: { type: Boolean, required: false, default: false },
|
||||
isLoadingTable: { type: Boolean, required: true, default: false },
|
||||
onPageChange: { type: Function, required: true, default: () => {} },
|
||||
page: { type: Number, required: true, default: 0 },
|
||||
total: { type: Number, required: true, default: 0 },
|
||||
},
|
||||
methods: {
|
||||
fechaHora(date) {
|
||||
return moment(date).format('YYYY-MM-DD HH:MM')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,18 +1,18 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<Title title="Todas las multas" :operador="operador" />
|
||||
<div>
|
||||
<Title title="Multas" :operador="operador" />
|
||||
|
||||
<InputsMultas :operador="operador" />
|
||||
<Multas :operador="operador" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import jwt_decode from 'jwt-decode'
|
||||
import Multas from '@/components/operador/Multas'
|
||||
import Title from '@/components/layouts/Title'
|
||||
import InputsMultas from '@/components/operador/usuarios/InputsMultas'
|
||||
|
||||
export default {
|
||||
components: { InputsMultas, Title },
|
||||
components: { Multas, Title },
|
||||
data() {
|
||||
return { operador: {} }
|
||||
},
|
||||
@ -22,8 +22,5 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
min-height: 75vh;
|
||||
}
|
||||
</style>
|
||||
<style></style>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user