ultima gráfica
This commit is contained in:
parent
05612838c6
commit
46dce0105f
@ -31,7 +31,7 @@
|
||||
|
||||
<BotonBuscar
|
||||
columnSize="is-3"
|
||||
:buscar="obtenerPrestamos"
|
||||
:buscar="obtenerLabMovil"
|
||||
:disabled="false"
|
||||
/>
|
||||
</div>
|
||||
@ -70,9 +70,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
fechas: [],
|
||||
instituciones: [],
|
||||
tiposCarrito: [],
|
||||
idInstitucion: 0,
|
||||
fechaFin: moment().toDate(),
|
||||
fechaInicio: null,
|
||||
@ -80,16 +78,12 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
obtenerPrestamos() {
|
||||
obtenerLabMovil() {
|
||||
let query = '?'
|
||||
let fechaInicio = moment(this.fechaInicio)
|
||||
|
||||
this.updateIsLoading(true)
|
||||
this.fechas = []
|
||||
while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
|
||||
this.fechas.push(fechaInicio.format('YYYY-MM-DD'))
|
||||
fechaInicio.add(1, 'd')
|
||||
}
|
||||
this.data = []
|
||||
this.instituciones = []
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
@ -98,8 +92,6 @@ export default {
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
this.data = []
|
||||
this.instituciones = []
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/carrito-motivo/laboratorio-movil${query}`,
|
||||
@ -107,11 +99,11 @@ export default {
|
||||
)
|
||||
.then((res) => {
|
||||
const motivos = []
|
||||
const i = res.data.map((value) => {
|
||||
const ins = res.data.map((value) => {
|
||||
return value.carrito.modulo.institucion.institucion
|
||||
})
|
||||
|
||||
this.instituciones = i.filter((value, index, self) => {
|
||||
this.instituciones = ins.filter((value, index, self) => {
|
||||
if (self.indexOf(value) === index) {
|
||||
motivos.push([res.data[index]])
|
||||
return true
|
||||
@ -153,7 +145,7 @@ export default {
|
||||
if (this.hoy < moment(`${this.hoy.year()}-07-01`))
|
||||
this.fechaInicio = moment(`${this.hoy.year()}-01-01`).toDate()
|
||||
else this.fechaInicio = moment(`${this.hoy.year()}-07-01`).toDate()
|
||||
this.obtenerPrestamos()
|
||||
this.obtenerLabMovil()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
@ -31,7 +31,7 @@
|
||||
|
||||
<BotonBuscar
|
||||
columnSize="is-3"
|
||||
:buscar="obtenerPrestamos"
|
||||
:buscar="obtenerMotivos"
|
||||
:disabled="false"
|
||||
/>
|
||||
</div>
|
||||
@ -70,9 +70,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
fechas: [],
|
||||
instituciones: [],
|
||||
tiposCarrito: [],
|
||||
idInstitucion: 0,
|
||||
fechaFin: moment().toDate(),
|
||||
fechaInicio: null,
|
||||
@ -80,16 +78,12 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
obtenerPrestamos() {
|
||||
obtenerMotivos() {
|
||||
let query = '?'
|
||||
let fechaInicio = moment(this.fechaInicio)
|
||||
|
||||
this.updateIsLoading(true)
|
||||
this.fechas = []
|
||||
while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
|
||||
this.fechas.push(fechaInicio.format('YYYY-MM-DD'))
|
||||
fechaInicio.add(1, 'd')
|
||||
}
|
||||
this.data = []
|
||||
this.instituciones = []
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
@ -98,8 +92,6 @@ export default {
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
this.data = []
|
||||
this.instituciones = []
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/modulo-motivo/reporte-actividad-especial${query}`,
|
||||
@ -107,11 +99,11 @@ export default {
|
||||
)
|
||||
.then((res) => {
|
||||
const motivos = []
|
||||
const i = res.data.map((value) => {
|
||||
const ins = res.data.map((value) => {
|
||||
return value.modulo.institucion.institucion
|
||||
})
|
||||
|
||||
this.instituciones = i.filter((value, index, self) => {
|
||||
this.instituciones = ins.filter((value, index, self) => {
|
||||
if (self.indexOf(value) === index) {
|
||||
motivos.push([res.data[index]])
|
||||
return true
|
||||
@ -153,7 +145,7 @@ export default {
|
||||
if (this.hoy < moment(`${this.hoy.year()}-07-01`))
|
||||
this.fechaInicio = moment(`${this.hoy.year()}-01-01`).toDate()
|
||||
else this.fechaInicio = moment(`${this.hoy.year()}-07-01`).toDate()
|
||||
this.obtenerPrestamos()
|
||||
this.obtenerMotivos()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
@ -11,48 +11,6 @@
|
||||
v-if="admin.tipoUsuario.id_tipo_usuario === 2"
|
||||
/>
|
||||
|
||||
<SelectModulo
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idInstitucion="
|
||||
admin.institucion ? admin.institucion.id_institucion : idInstitucion
|
||||
"
|
||||
:idModuloPadre="idModulo"
|
||||
:operador="admin"
|
||||
@modulo-seleccionado="(nuevoModulo) => (idModulo = nuevoModulo)"
|
||||
/>
|
||||
|
||||
<SelectTipoCarrito
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idTipoCarritoPadre="idTipoCarrito"
|
||||
@tipo-carrito-seleccionado="
|
||||
(nuevoTipoCarrito) => (idTipoCarrito = nuevoTipoCarrito)
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectTipoUsuario
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idTipoUsuarioPadre="idTipoUsuario"
|
||||
@tipo-usuario-seleccionado="
|
||||
(nuevoTipoUsuario) => (idTipoUsuario = nuevoTipoUsuario)
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectCarrera
|
||||
columnSize="is-3"
|
||||
:idInstitucion="
|
||||
admin.institucion ? admin.institucion.id_institucion : idInstitucion
|
||||
"
|
||||
:idInstitucionCarreraPadre="idInstitucionCarrera"
|
||||
@institucion-carrera-seleccionada="
|
||||
(nuevaInstitucionCarrera) =>
|
||||
(idInstitucionCarrera = nuevaInstitucionCarrera)
|
||||
"
|
||||
:deshabilitarOptVacia="false"
|
||||
/>
|
||||
|
||||
<InputFecha
|
||||
columnSize="is-3"
|
||||
label="Fecha inicio"
|
||||
@ -78,56 +36,28 @@
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Diario :labels="fechas" :data="data" />
|
||||
<BarraPrestamos :data="data" :labels="instituciones" />
|
||||
|
||||
<BarraTipoCarrito
|
||||
:data="data"
|
||||
:labels="instituciones"
|
||||
:tiposCarrito="tiposCarrito"
|
||||
/>
|
||||
|
||||
<PieTipoCarrito :data="data" :labels="tiposCarrito" />
|
||||
|
||||
<BarraTipoUsuario
|
||||
:data="data"
|
||||
:labels="instituciones"
|
||||
:tiposUsuario="tiposUsuario"
|
||||
/>
|
||||
|
||||
<PieTipoUsuario :data="data" :labels="tiposUsuario" />
|
||||
<PiePrestamos :data="data" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import moment from 'moment'
|
||||
import BarraTipoCarrito from '@/components/admin/graficas/BarraTipoCarrito'
|
||||
import BarraTipoUsuario from '@/components/admin/graficas/BarraTipoUsuario'
|
||||
import BarraPrestamos from '@/components/admin/graficas/BarraPrestamos'
|
||||
import BotonBuscar from '@/components/botones/BotonBuscar'
|
||||
import Diario from '@/components/admin/graficas/Diario'
|
||||
import PieTipoCarrito from '@/components/admin/graficas/PieTipoCarrito'
|
||||
import PieTipoUsuario from '@/components/admin/graficas/PieTipoUsuario'
|
||||
import SelectCarrera from '@/components/selects/SelectCarrera'
|
||||
import PiePrestamos from '@/components/admin/graficas/PiePrestamos'
|
||||
import SelectInstitucion from '@/components/selects/SelectInstitucion'
|
||||
import SelectModulo from '@/components/selects/SelectModulo'
|
||||
import SelectTipoCarrito from '@/components/selects/SelectTipoCarrito'
|
||||
import SelectTipoUsuario from '@/components/selects/SelectTipoUsuario'
|
||||
import InputFecha from '@/components/inputs/InputFecha'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BarraTipoCarrito,
|
||||
BarraTipoUsuario,
|
||||
BarraPrestamos,
|
||||
BotonBuscar,
|
||||
Diario,
|
||||
InputFecha,
|
||||
PieTipoCarrito,
|
||||
PieTipoUsuario,
|
||||
SelectCarrera,
|
||||
PiePrestamos,
|
||||
SelectInstitucion,
|
||||
SelectModulo,
|
||||
SelectTipoCarrito,
|
||||
SelectTipoUsuario,
|
||||
},
|
||||
props: {
|
||||
updateIsLoading: { type: Function, required: false, default: () => {} },
|
||||
@ -136,15 +66,8 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
fechas: [],
|
||||
instituciones: [],
|
||||
tiposCarrito: [],
|
||||
tiposUsuario: [],
|
||||
idInstitucion: 0,
|
||||
idInstitucionCarrera: 0,
|
||||
idModulo: 0,
|
||||
idTipoCarrito: 0,
|
||||
idTipoUsuario: 0,
|
||||
fechaFin: moment().toDate(),
|
||||
fechaInicio: null,
|
||||
hoy: moment(),
|
||||
@ -153,28 +76,17 @@ export default {
|
||||
methods: {
|
||||
obtenerPrestamos() {
|
||||
let query = '?cancelado_operador=false&cancelado_usuario=false'
|
||||
let fechaInicio = moment(this.fechaInicio)
|
||||
|
||||
this.updateIsLoading(true)
|
||||
this.fechas = []
|
||||
while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
|
||||
this.fechas.push(fechaInicio.format('YYYY-MM-DD'))
|
||||
fechaInicio.add(1, 'd')
|
||||
}
|
||||
this.data = []
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
query += `&id_institucion=${this.idInstitucion}`
|
||||
if (this.idInstitucionCarrera)
|
||||
query += `&id_institucion_carrera=${this.idInstitucionCarrera}`
|
||||
if (this.idModulo) query += `&id_modulo=${this.idModulo}`
|
||||
if (this.idTipoCarrito) query += `&id_tipo_carrito=${this.idTipoCarrito}`
|
||||
if (this.idTipoUsuario) query += `&id_tipo_usuario=${this.idTipoUsuario}`
|
||||
if (this.fechaInicio)
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
this.data = []
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/prestamo/reporte${query}`,
|
||||
@ -182,21 +94,9 @@ export default {
|
||||
)
|
||||
.then((res) => {
|
||||
const prestamos = []
|
||||
let tc = []
|
||||
let tu = []
|
||||
const i = res.data.map((value) => {
|
||||
tc.push(value.tipo_carrito)
|
||||
tu.push(value.tipo_usuario)
|
||||
return value.institucion
|
||||
})
|
||||
const ins = res.data.map((value) => value.institucion)
|
||||
|
||||
this.tiposUsuario = tu.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
this.tiposCarrito = tc.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
this.instituciones = i.filter((value, index, self) => {
|
||||
this.instituciones = ins.filter((value, index, self) => {
|
||||
if (self.indexOf(value) === index) {
|
||||
prestamos.push([res.data[index]])
|
||||
return true
|
||||
@ -204,76 +104,14 @@ export default {
|
||||
prestamos[prestamos.length - 1].push(res.data[index])
|
||||
return false
|
||||
})
|
||||
|
||||
for (let i = 0; i < this.instituciones.length; i++) {
|
||||
const dias = []
|
||||
let m = []
|
||||
let modulos = []
|
||||
let k = 0
|
||||
|
||||
tc = []
|
||||
tu = []
|
||||
for (let j = 0; j < this.tiposCarrito.length; j++) tc.push(0)
|
||||
for (let j = 0; j < this.tiposUsuario.length; j++) tu.push(0)
|
||||
if (this.instituciones.length === 1) {
|
||||
m = prestamos[i].map((value) => value.modulo)
|
||||
modulos = m.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
m = []
|
||||
for (let j = 0; j < modulos.length; j++)
|
||||
m.push({ modulo: modulos[j], dias: [] })
|
||||
}
|
||||
for (let j = 0; j < this.fechas.length; j++) {
|
||||
const fecha = moment(this.fechas[j])
|
||||
const p = []
|
||||
|
||||
for (; k < prestamos[i].length; k++)
|
||||
if (
|
||||
moment(prestamos[i][k].fecha_inicio).dayOfYear() ===
|
||||
fecha.dayOfYear()
|
||||
) {
|
||||
for (let l = 0; l < this.tiposCarrito.length; l++)
|
||||
if (this.tiposCarrito[l] === prestamos[i][k].tipo_carrito) {
|
||||
tc[l]++
|
||||
break
|
||||
}
|
||||
for (let l = 0; l < this.tiposUsuario.length; l++)
|
||||
if (this.tiposUsuario[l] === prestamos[i][k].tipo_usuario) {
|
||||
tu[l]++
|
||||
break
|
||||
}
|
||||
p.push(prestamos[i][k])
|
||||
} else break
|
||||
if (this.instituciones.length === 1)
|
||||
for (let k = 0; k < modulos.length; k++) {
|
||||
const pm = []
|
||||
|
||||
for (let l = 0; l < p.length; l++)
|
||||
if (modulos[k] === p[l].modulo) pm.push(p[l])
|
||||
m[k].dias.push({ dia: this.fechas[j], prestamos: pm })
|
||||
}
|
||||
dias.push({ dia: this.fechas[j], prestamos: p })
|
||||
}
|
||||
if (this.instituciones.length === 1)
|
||||
for (let i = 0; i < this.instituciones.length; i++)
|
||||
this.data.push({
|
||||
prestamos: prestamos[i].length,
|
||||
institucion: this.instituciones[i],
|
||||
dias,
|
||||
tiposCarrito: tc,
|
||||
tiposUsuario: tu,
|
||||
modulos: m,
|
||||
labMovil: { prestamos: 0, motivos: [] },
|
||||
motivosModulos: { prestamos: 0, motivos: [] },
|
||||
prestamos: prestamos[i],
|
||||
})
|
||||
else
|
||||
this.data.push({
|
||||
prestamos: prestamos[i].length,
|
||||
institucion: this.instituciones[i],
|
||||
dias,
|
||||
tiposCarrito: tc,
|
||||
tiposUsuario: tu,
|
||||
})
|
||||
}
|
||||
this.updateIsLoading(false)
|
||||
return this.obtenerMotivosModulos()
|
||||
})
|
||||
.catch((err) => {
|
||||
this.updateIsLoading(false)
|
||||
@ -284,6 +122,93 @@ export default {
|
||||
)
|
||||
})
|
||||
},
|
||||
obtenerMotivosModulos() {
|
||||
let query = '?'
|
||||
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
query += `&id_institucion=${this.idInstitucion}`
|
||||
if (this.fechaInicio)
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/modulo-motivo/reporte-actividad-especial${query}`,
|
||||
this.$getToken.token()
|
||||
)
|
||||
.then((res) => {
|
||||
const ins = res.data
|
||||
.map((value) => value.modulo.institucion.institucion)
|
||||
.filter((value, index, self) => self.indexOf(value) === index)
|
||||
|
||||
for (let i = 0; i < ins.length; i++)
|
||||
if (!this.instituciones.find((element) => ins[i] === element)) {
|
||||
this.instituciones.push(ins[i])
|
||||
this.data.push({
|
||||
institucion: ins[i],
|
||||
labMovil: { prestamos: 0, motivos: [] },
|
||||
motivosModulos: { prestamos: 0, motivos: [] },
|
||||
prestamos: [],
|
||||
})
|
||||
}
|
||||
for (let i = 0; i < res.data.length; i++)
|
||||
for (let j = 0; j < this.instituciones.length; j++)
|
||||
if (
|
||||
res.data[i].modulo.institucion.institucion ===
|
||||
this.instituciones[j]
|
||||
) {
|
||||
this.data[j].motivosModulos.motivos.push(res.data[i])
|
||||
this.data[j].motivosModulos.prestamos +=
|
||||
res.data[i].numero_alumnos
|
||||
}
|
||||
return this.obtenerLabMovil()
|
||||
})
|
||||
},
|
||||
obtenerLabMovil() {
|
||||
let query = '?'
|
||||
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
query += `&id_institucion=${this.idInstitucion}`
|
||||
if (this.fechaInicio)
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/carrito-motivo/laboratorio-movil${query}`,
|
||||
this.$getToken.token()
|
||||
)
|
||||
.then((res) => {
|
||||
const ins = res.data
|
||||
.map((value) => value.operador.institucion.institucion)
|
||||
.filter((value, index, self) => self.indexOf(value) === index)
|
||||
|
||||
for (let i = 0; i < ins.length; i++)
|
||||
if (!this.instituciones.find((element) => ins[i] === element)) {
|
||||
this.instituciones.push(ins[i])
|
||||
this.data.push({
|
||||
institucion: ins[i],
|
||||
labMovil: { prestamos: 0, motivos: [] },
|
||||
motivosModulos: { prestamos: 0, motivos: [] },
|
||||
prestamos: [],
|
||||
})
|
||||
}
|
||||
for (let i = 0; i < res.data.length; i++)
|
||||
for (let j = 0; j < this.instituciones.length; j++)
|
||||
if (
|
||||
res.data[i].operador.institucion.institucion ===
|
||||
this.instituciones[j]
|
||||
) {
|
||||
this.data[j].labMovil.motivos.push(res.data[i])
|
||||
this.data[j].labMovil.prestamos += res.data[i].numero_equipos
|
||||
}
|
||||
this.updateIsLoading(false)
|
||||
})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
fechaMax() {
|
||||
@ -298,17 +223,10 @@ export default {
|
||||
return fechaMinFin.isValid() ? fechaMinFin.toDate() : moment().toDate()
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
idInstitucion() {
|
||||
this.idModulo = 0
|
||||
this.idInstitucionCarrera = 0
|
||||
},
|
||||
},
|
||||
created() {
|
||||
if (this.hoy < moment(`${this.hoy.year()}-07-01`))
|
||||
this.fechaInicio = moment(`${this.hoy.year()}-01-01`).toDate()
|
||||
else this.fechaInicio = moment(`${this.hoy.year()}-07-01`).toDate()
|
||||
|
||||
this.obtenerPrestamos()
|
||||
},
|
||||
}
|
||||
|
318
components/admin/GraficasPrestamoIndividual.vue
Normal file
318
components/admin/GraficasPrestamoIndividual.vue
Normal file
@ -0,0 +1,318 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="columns is-multiline mb-5 is-align-items-flex-end">
|
||||
<SelectInstitucion
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idInstitucionPadre="idInstitucion"
|
||||
@institucion-seleccionada="
|
||||
(nuevaInstitucion) => (idInstitucion = nuevaInstitucion)
|
||||
"
|
||||
v-if="admin.tipoUsuario.id_tipo_usuario === 2"
|
||||
/>
|
||||
|
||||
<SelectModulo
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idInstitucion="
|
||||
admin.institucion ? admin.institucion.id_institucion : idInstitucion
|
||||
"
|
||||
:idModuloPadre="idModulo"
|
||||
:operador="admin"
|
||||
@modulo-seleccionado="(nuevoModulo) => (idModulo = nuevoModulo)"
|
||||
/>
|
||||
|
||||
<SelectTipoCarrito
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idTipoCarritoPadre="idTipoCarrito"
|
||||
@tipo-carrito-seleccionado="
|
||||
(nuevoTipoCarrito) => (idTipoCarrito = nuevoTipoCarrito)
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectTipoUsuario
|
||||
columnSize="is-3"
|
||||
:deshabilitarOptVacia="false"
|
||||
:idTipoUsuarioPadre="idTipoUsuario"
|
||||
@tipo-usuario-seleccionado="
|
||||
(nuevoTipoUsuario) => (idTipoUsuario = nuevoTipoUsuario)
|
||||
"
|
||||
/>
|
||||
|
||||
<SelectCarrera
|
||||
columnSize="is-3"
|
||||
:idInstitucion="
|
||||
admin.institucion ? admin.institucion.id_institucion : idInstitucion
|
||||
"
|
||||
:idInstitucionCarreraPadre="idInstitucionCarrera"
|
||||
@institucion-carrera-seleccionada="
|
||||
(nuevaInstitucionCarrera) =>
|
||||
(idInstitucionCarrera = nuevaInstitucionCarrera)
|
||||
"
|
||||
:deshabilitarOptVacia="false"
|
||||
/>
|
||||
|
||||
<InputFecha
|
||||
columnSize="is-3"
|
||||
label="Fecha inicio"
|
||||
:fechaPadre="fechaInicio"
|
||||
:fechaMaxima="fechaMax"
|
||||
:fechaMinima="fechaMinInicio"
|
||||
@fecha="(fechaNueva) => (fechaInicio = fechaNueva)"
|
||||
/>
|
||||
|
||||
<InputFecha
|
||||
columnSize="is-3"
|
||||
label="Fecha fin"
|
||||
:fechaPadre="fechaFin"
|
||||
:fechaMaxima="fechaMax"
|
||||
:fechaMinima="fechaMinFin"
|
||||
@fecha="(fechaNueva) => (fechaFin = fechaNueva)"
|
||||
/>
|
||||
|
||||
<BotonBuscar
|
||||
columnSize="is-3"
|
||||
:buscar="obtenerPrestamos"
|
||||
:disabled="false"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Diario :labels="fechas" :data="data" />
|
||||
|
||||
<BarraTipoCarrito
|
||||
:data="data"
|
||||
:labels="instituciones"
|
||||
:tiposCarrito="tiposCarrito"
|
||||
/>
|
||||
|
||||
<PieTipoCarrito :data="data" :labels="tiposCarrito" />
|
||||
|
||||
<BarraTipoUsuario
|
||||
:data="data"
|
||||
:labels="instituciones"
|
||||
:tiposUsuario="tiposUsuario"
|
||||
/>
|
||||
|
||||
<PieTipoUsuario :data="data" :labels="tiposUsuario" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import moment from 'moment'
|
||||
import BarraTipoCarrito from '@/components/admin/graficas/BarraTipoCarrito'
|
||||
import BarraTipoUsuario from '@/components/admin/graficas/BarraTipoUsuario'
|
||||
import BotonBuscar from '@/components/botones/BotonBuscar'
|
||||
import Diario from '@/components/admin/graficas/Diario'
|
||||
import PieTipoCarrito from '@/components/admin/graficas/PieTipoCarrito'
|
||||
import PieTipoUsuario from '@/components/admin/graficas/PieTipoUsuario'
|
||||
import SelectCarrera from '@/components/selects/SelectCarrera'
|
||||
import SelectInstitucion from '@/components/selects/SelectInstitucion'
|
||||
import SelectModulo from '@/components/selects/SelectModulo'
|
||||
import SelectTipoCarrito from '@/components/selects/SelectTipoCarrito'
|
||||
import SelectTipoUsuario from '@/components/selects/SelectTipoUsuario'
|
||||
import InputFecha from '@/components/inputs/InputFecha'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BarraTipoCarrito,
|
||||
BarraTipoUsuario,
|
||||
BotonBuscar,
|
||||
Diario,
|
||||
InputFecha,
|
||||
PieTipoCarrito,
|
||||
PieTipoUsuario,
|
||||
SelectCarrera,
|
||||
SelectInstitucion,
|
||||
SelectModulo,
|
||||
SelectTipoCarrito,
|
||||
SelectTipoUsuario,
|
||||
},
|
||||
props: {
|
||||
updateIsLoading: { type: Function, required: false, default: () => {} },
|
||||
admin: { type: Object, required: true, default: () => ({}) },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
fechas: [],
|
||||
instituciones: [],
|
||||
tiposCarrito: [],
|
||||
tiposUsuario: [],
|
||||
idInstitucion: 0,
|
||||
idInstitucionCarrera: 0,
|
||||
idModulo: 0,
|
||||
idTipoCarrito: 0,
|
||||
idTipoUsuario: 0,
|
||||
fechaFin: moment().toDate(),
|
||||
fechaInicio: null,
|
||||
hoy: moment(),
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
obtenerPrestamos() {
|
||||
let query = '?cancelado_operador=false&cancelado_usuario=false'
|
||||
let fechaInicio = moment(this.fechaInicio)
|
||||
|
||||
this.updateIsLoading(true)
|
||||
this.data = []
|
||||
this.fechas = []
|
||||
this.instituciones = []
|
||||
this.tiposCarrito = []
|
||||
this.tiposUsuario = []
|
||||
while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
|
||||
this.fechas.push(fechaInicio.format('YYYY-MM-DD'))
|
||||
fechaInicio.add(1, 'd')
|
||||
}
|
||||
if (this.admin.institucion)
|
||||
query += `&id_institucion=${this.admin.institucion.id_institucion}`
|
||||
else if (this.idInstitucion)
|
||||
query += `&id_institucion=${this.idInstitucion}`
|
||||
if (this.idInstitucionCarrera)
|
||||
query += `&id_institucion_carrera=${this.idInstitucionCarrera}`
|
||||
if (this.idModulo) query += `&id_modulo=${this.idModulo}`
|
||||
if (this.idTipoCarrito) query += `&id_tipo_carrito=${this.idTipoCarrito}`
|
||||
if (this.idTipoUsuario) query += `&id_tipo_usuario=${this.idTipoUsuario}`
|
||||
if (this.fechaInicio)
|
||||
query += `&fechaInicio=${moment(this.fechaInicio).format('YYYY-MM-DD')}`
|
||||
if (this.fechaFin)
|
||||
query += `&fechaFin=${moment(this.fechaFin).format('YYYY-MM-DD')}`
|
||||
return axios
|
||||
.get(
|
||||
`${process.env.api}/prestamo/reporte${query}`,
|
||||
this.$getToken.token()
|
||||
)
|
||||
.then((res) => {
|
||||
const prestamos = []
|
||||
let tc = []
|
||||
let tu = []
|
||||
const ins = res.data.map((value) => {
|
||||
tc.push(value.tipo_carrito)
|
||||
tu.push(value.tipo_usuario)
|
||||
return value.institucion
|
||||
})
|
||||
|
||||
this.tiposUsuario = tu.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
this.tiposCarrito = tc.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
this.instituciones = ins.filter((value, index, self) => {
|
||||
if (self.indexOf(value) === index) {
|
||||
prestamos.push([res.data[index]])
|
||||
return true
|
||||
}
|
||||
prestamos[prestamos.length - 1].push(res.data[index])
|
||||
return false
|
||||
})
|
||||
|
||||
for (let i = 0; i < this.instituciones.length; i++) {
|
||||
const dias = []
|
||||
let m = []
|
||||
let modulos = []
|
||||
let k = 0
|
||||
|
||||
tc = []
|
||||
tu = []
|
||||
for (let j = 0; j < this.tiposCarrito.length; j++) tc.push(0)
|
||||
for (let j = 0; j < this.tiposUsuario.length; j++) tu.push(0)
|
||||
if (this.instituciones.length === 1) {
|
||||
m = prestamos[i].map((value) => value.modulo)
|
||||
modulos = m.filter(
|
||||
(value, index, self) => self.indexOf(value) === index
|
||||
)
|
||||
m = []
|
||||
for (let j = 0; j < modulos.length; j++)
|
||||
m.push({ modulo: modulos[j], dias: [] })
|
||||
}
|
||||
for (let j = 0; j < this.fechas.length; j++) {
|
||||
const fecha = moment(this.fechas[j])
|
||||
const p = []
|
||||
|
||||
for (; k < prestamos[i].length; k++)
|
||||
if (
|
||||
moment(prestamos[i][k].fecha_inicio).dayOfYear() ===
|
||||
fecha.dayOfYear()
|
||||
) {
|
||||
for (let l = 0; l < this.tiposCarrito.length; l++)
|
||||
if (this.tiposCarrito[l] === prestamos[i][k].tipo_carrito) {
|
||||
tc[l]++
|
||||
break
|
||||
}
|
||||
for (let l = 0; l < this.tiposUsuario.length; l++)
|
||||
if (this.tiposUsuario[l] === prestamos[i][k].tipo_usuario) {
|
||||
tu[l]++
|
||||
break
|
||||
}
|
||||
p.push(prestamos[i][k])
|
||||
} else break
|
||||
if (this.instituciones.length === 1)
|
||||
for (let k = 0; k < modulos.length; k++) {
|
||||
const pm = []
|
||||
|
||||
for (let l = 0; l < p.length; l++)
|
||||
if (modulos[k] === p[l].modulo) pm.push(p[l])
|
||||
m[k].dias.push({ dia: this.fechas[j], prestamos: pm })
|
||||
}
|
||||
dias.push({ dia: this.fechas[j], prestamos: p })
|
||||
}
|
||||
if (this.instituciones.length === 1)
|
||||
this.data.push({
|
||||
prestamos: prestamos[i].length,
|
||||
institucion: this.instituciones[i],
|
||||
dias,
|
||||
tiposCarrito: tc,
|
||||
tiposUsuario: tu,
|
||||
modulos: m,
|
||||
})
|
||||
else
|
||||
this.data.push({
|
||||
prestamos: prestamos[i].length,
|
||||
institucion: this.instituciones[i],
|
||||
dias,
|
||||
tiposCarrito: tc,
|
||||
tiposUsuario: tu,
|
||||
})
|
||||
}
|
||||
this.updateIsLoading(false)
|
||||
})
|
||||
.catch((err) => {
|
||||
this.updateIsLoading(false)
|
||||
this.$alertsGenericos.imprimirError(
|
||||
this.$buefy,
|
||||
this.$router,
|
||||
err.response.data
|
||||
)
|
||||
})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
fechaMax() {
|
||||
return moment().toDate()
|
||||
},
|
||||
fechaMinInicio() {
|
||||
return moment('2022-08-15').toDate()
|
||||
},
|
||||
fechaMinFin() {
|
||||
let fechaMinFin = moment(this.fechaInicio)
|
||||
|
||||
return fechaMinFin.isValid() ? fechaMinFin.toDate() : moment().toDate()
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
idInstitucion() {
|
||||
this.idModulo = 0
|
||||
this.idInstitucionCarrera = 0
|
||||
},
|
||||
},
|
||||
created() {
|
||||
if (this.hoy < moment(`${this.hoy.year()}-07-01`))
|
||||
this.fechaInicio = moment(`${this.hoy.year()}-01-01`).toDate()
|
||||
else this.fechaInicio = moment(`${this.hoy.year()}-07-01`).toDate()
|
||||
|
||||
this.obtenerPrestamos()
|
||||
},
|
||||
}
|
||||
</script>
|
@ -1,6 +1,8 @@
|
||||
<template>
|
||||
<div class="p-2 border border-gray-500 mt-4">
|
||||
<label class="block mb-2 font-bold">Carritos desactivados por laboratorio móvil</label>
|
||||
<label class="block mb-2 font-bold">
|
||||
Carritos desactivados por laboratorio móvil
|
||||
</label>
|
||||
|
||||
<client-only>
|
||||
<BarChart :data="chartData" />
|
||||
|
64
components/admin/graficas/BarraPrestamos.vue
Normal file
64
components/admin/graficas/BarraPrestamos.vue
Normal file
@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<div class="p-2 border border-gray-500 mt-4">
|
||||
<label class="block mb-2 font-bold">Prestamos por dependencia </label>
|
||||
|
||||
<client-only>
|
||||
<BarChart :data="chartData" />
|
||||
</client-only>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
data: { type: Array, required: true, default: () => [] },
|
||||
labels: { type: Array, required: true, default: () => [] },
|
||||
},
|
||||
methods: {
|
||||
randomRgba() {
|
||||
let o = Math.round,
|
||||
r = Math.random,
|
||||
s = 255
|
||||
|
||||
return `rgba(${o(r() * s)}, ${o(r() * s)}, ${o(r() * s)}, 1)`
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
chartData() {
|
||||
const datasets = []
|
||||
const labMovil = []
|
||||
const motivosModulos = []
|
||||
const prestamos = []
|
||||
const total = []
|
||||
|
||||
for (let i = 0; i < this.data.length; i++) {
|
||||
prestamos.push(this.data[i].prestamos.length)
|
||||
labMovil.push(this.data[i].labMovil.prestamos)
|
||||
motivosModulos.push(this.data[i].motivosModulos.prestamos)
|
||||
total.push(labMovil[i] + motivosModulos[i] + prestamos[i])
|
||||
}
|
||||
datasets.push({
|
||||
label: 'Préstamos individuales',
|
||||
backgroundColor: this.randomRgba(),
|
||||
data: prestamos,
|
||||
})
|
||||
datasets.push({
|
||||
label: 'Laboratorio móvil',
|
||||
backgroundColor: this.randomRgba(),
|
||||
data: labMovil,
|
||||
})
|
||||
datasets.push({
|
||||
label: 'Préstamos masivos',
|
||||
backgroundColor: this.randomRgba(),
|
||||
data: motivosModulos,
|
||||
})
|
||||
datasets.push({
|
||||
label: 'Total',
|
||||
backgroundColor: this.randomRgba(),
|
||||
data: total,
|
||||
})
|
||||
return { labels: this.labels, datasets }
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
57
components/admin/graficas/PiePrestamos.vue
Normal file
57
components/admin/graficas/PiePrestamos.vue
Normal file
@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<div class="p-2 border border-gray-500 mt-4">
|
||||
<label class="block mb-2 font-bold">Préstamos totales</label>
|
||||
|
||||
<client-only>
|
||||
<DoughnutChart :data="chartData" />
|
||||
</client-only>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
data: { type: Array, required: true, default: () => [] },
|
||||
},
|
||||
methods: {
|
||||
randomRgba() {
|
||||
let o = Math.round,
|
||||
r = Math.random,
|
||||
s = 255
|
||||
|
||||
return `rgba(${o(r() * s)}, ${o(r() * s)}, ${o(r() * s)}, 1)`
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
chartData() {
|
||||
const backgroundColor = [
|
||||
this.randomRgba(),
|
||||
this.randomRgba(),
|
||||
this.randomRgba(),
|
||||
]
|
||||
const data = [0, 0, 0]
|
||||
const labels = [
|
||||
'Préstamos individuales',
|
||||
'Laboratorio móvil',
|
||||
'Préstamos masivos',
|
||||
]
|
||||
|
||||
for (let i = 0; i < this.data.length; i++) {
|
||||
data[0] += this.data[i].prestamos.length
|
||||
data[1] += this.data[i].labMovil.prestamos
|
||||
data[2] += this.data[i].motivosModulos.prestamos
|
||||
}
|
||||
return {
|
||||
labels,
|
||||
datasets: [
|
||||
{
|
||||
label: 'Préstamos',
|
||||
data,
|
||||
backgroundColor,
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
@ -4,11 +4,11 @@
|
||||
icon="calendar-today"
|
||||
locale="es-MX"
|
||||
placeholder="Selecciona una fecha"
|
||||
:icon-right="fecha ? 'close-circle' : ''"
|
||||
@icon-right-click="clearDate"
|
||||
:icon-right="botonCerrar ? (fecha ? 'close-circle' : '') : ''"
|
||||
:max-date="fechaMaxima"
|
||||
:min-date="fechaMinima"
|
||||
:unselectable-days-of-week="[0, 7]"
|
||||
@icon-right-click="clearDate"
|
||||
v-model="fecha"
|
||||
icon-right-clickable
|
||||
trap-focus
|
||||
@ -20,6 +20,7 @@
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
botonCerrar: { typeof: Boolean, required: false, default: false },
|
||||
fechaMaxima: { typeof: Date, required: true, default: () => new Date() },
|
||||
fechaMinima: { typeof: Date, required: true, default: () => new Date() },
|
||||
fechaPadre: { typeof: Date, required: true, default: () => new Date() },
|
||||
|
@ -145,11 +145,19 @@
|
||||
<b-menu-item
|
||||
label="Préstamos individuales"
|
||||
:disabled="
|
||||
activo('/admin/administrador/graficas/prestamos')
|
||||
activo(
|
||||
'/admin/administrador/graficas/prestamos_individuales'
|
||||
)
|
||||
"
|
||||
:icon="
|
||||
icono(
|
||||
'/admin/administrador/graficas/prestamos_individuales'
|
||||
)
|
||||
"
|
||||
:icon="icono('/admin/administrador/graficas/prestamos')"
|
||||
@click="
|
||||
opcionMenu('/admin/administrador/graficas/prestamos')
|
||||
opcionMenu(
|
||||
'/admin/administrador/graficas/prestamos_individuales'
|
||||
)
|
||||
"
|
||||
/>
|
||||
|
||||
@ -174,6 +182,17 @@
|
||||
:icon="icono('/admin/administrador/graficas/modulos')"
|
||||
@click="opcionMenu('/admin/administrador/graficas/modulos')"
|
||||
/>
|
||||
|
||||
<b-menu-item
|
||||
label="Préstamos"
|
||||
:disabled="
|
||||
activo('/admin/administrador/graficas/prestamos')
|
||||
"
|
||||
:icon="icono('/admin/administrador/graficas/prestamos')"
|
||||
@click="
|
||||
opcionMenu('/admin/administrador/graficas/prestamos')
|
||||
"
|
||||
/>
|
||||
</b-menu-item>
|
||||
|
||||
<b-menu-item
|
||||
@ -428,7 +447,11 @@ export default {
|
||||
this.$router.push(path)
|
||||
},
|
||||
activo(ruta) {
|
||||
return window.location.pathname.indexOf(ruta) != -1
|
||||
let path = window.location.pathname
|
||||
|
||||
if (path[path.length - 1] != '/') path += '/'
|
||||
if (ruta[ruta.length - 1] != '/') ruta += '/'
|
||||
return path.indexOf(ruta) != -1
|
||||
},
|
||||
icono(ruta) {
|
||||
return this.activo(ruta) ? 'square' : 'crop-square'
|
||||
|
@ -141,6 +141,7 @@
|
||||
<InputFecha
|
||||
columnSize="is-3"
|
||||
label="Fecha inicio"
|
||||
:botonCerrar="true"
|
||||
:fechaPadre="fechaInicio"
|
||||
:fechaMaxima="fechaMax"
|
||||
:fechaMinima="fechaMinInicio"
|
||||
@ -151,6 +152,7 @@
|
||||
<InputFecha
|
||||
columnSize="is-3"
|
||||
label="Fecha fin"
|
||||
:botonCerrar="true"
|
||||
:fechaPadre="fechaFin"
|
||||
:fechaMaxima="fechaMax"
|
||||
:fechaMinima="fechaMinFin"
|
||||
@ -433,6 +435,9 @@ export default {
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
fechaInicio() {
|
||||
this.fechaFin = null
|
||||
},
|
||||
actualizarTabla() {
|
||||
if (this.actualizarTabla) {
|
||||
this.updateActualizarTabla(false)
|
||||
|
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<section>
|
||||
<Title title="Gráficas de préstamo individual" :operador="admin" />
|
||||
<Title title="Gráficas de préstamo" :operador="admin" />
|
||||
|
||||
<GraficasPrestamo :admin="admin" :updateIsLoading="updateIsLoading" />
|
||||
|
||||
|
@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<section>
|
||||
<Title title="Gráficas de préstamo individual" :operador="admin" />
|
||||
|
||||
<GraficasPrestamoIndividual
|
||||
:admin="admin"
|
||||
:updateIsLoading="updateIsLoading"
|
||||
/>
|
||||
|
||||
<b-loading :can-cancel="false" v-model="isLoading" is-full-page />
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import jwt_decode from 'jwt-decode'
|
||||
import GraficasPrestamoIndividual from '@/components/admin/GraficasPrestamoIndividual'
|
||||
import Title from '@/components/layouts/Title'
|
||||
|
||||
export default {
|
||||
components: { GraficasPrestamoIndividual, Title },
|
||||
data() {
|
||||
return { admin: {}, isLoading: false }
|
||||
},
|
||||
methods: {
|
||||
updateIsLoading(valorBooleano) {
|
||||
this.isLoading = valorBooleano
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.admin = jwt_decode(this.$getToken.tokenStr()).Operador
|
||||
if (
|
||||
this.admin.tipoUsuario.id_tipo_usuario != 2 &&
|
||||
this.admin.tipoUsuario.id_tipo_usuario != 3
|
||||
)
|
||||
this.$router.push('/prestamo_devolucion')
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
Loading…
Reference in New Issue
Block a user