ultima gráfica

components/admin/GraficasLaboratorioMovil.vue

@@ -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 = []
+      this.data = []
-      while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
+      this.instituciones = []
-        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)
@@ -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>

components/admin/GraficasModulos.vue

@@ -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 = []
+      this.data = []
-      while (fechaInicio.dayOfYear() <= moment(this.fechaFin).dayOfYear()) {
+      this.instituciones = []
-        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)
@@ -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>

components/admin/GraficasPrestamo.vue

@@ -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
+    <PiePrestamos :data="data" />
-      :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 BarraPrestamos from '@/components/admin/graficas/BarraPrestamos'
-import BarraTipoUsuario from '@/components/admin/graficas/BarraTipoUsuario'
 import BotonBuscar from '@/components/botones/BotonBuscar'
-import Diario from '@/components/admin/graficas/Diario'
+import PiePrestamos from '@/components/admin/graficas/PiePrestamos'
-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,
+    BarraPrestamos,
-    BarraTipoUsuario,
     BotonBuscar,
-    Diario,
     InputFecha,
-    PieTipoCarrito,
+    PiePrestamos,
-    PieTipoUsuario,
-    SelectCarrera,
     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 = []
+      this.data = []
-      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')}`
-      this.data = []
       return axios
         .get(
           `${process.env.api}/prestamo/reporte${query}`,
@@ -182,21 +94,9 @@ export default {
         )
         .then((res) => {
           const prestamos = []
-          let tc = []
+          const ins = res.data.map((value) => value.institucion)
-          let tu = []
-          const i = res.data.map((value) => {
-            tc.push(value.tipo_carrito)
-            tu.push(value.tipo_usuario)
-            return value.institucion
-          })
 
-          this.tiposUsuario = tu.filter(
+          this.instituciones = ins.filter((value, index, self) => {
-            (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) => {
             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++)
-          for (let i = 0; i < this.instituciones.length; i++) {
+            this.data.push({
-            const dias = []
+              institucion: this.instituciones[i],
-            let m = []
+              labMovil: { prestamos: 0, motivos: [] },
-            let modulos = []
+              motivosModulos: { prestamos: 0, motivos: [] },
-            let k = 0
+              prestamos: prestamos[i],
-
+            })
-            tc = []
+          return this.obtenerMotivosModulos()
-            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)
@@ -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()
   },
 }

components/admin/GraficasPrestamoIndividual.vue

@@ -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>

components/admin/graficas/BarraLabMovil.vue

@@ -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" />

components/admin/graficas/BarraPrestamos.vue

@@ -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>

components/admin/graficas/PiePrestamos.vue

@@ -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>

components/inputs/InputFecha.vue

@@ -4,11 +4,11 @@
       icon="calendar-today"
       locale="es-MX"
       placeholder="Selecciona una fecha"
-      :icon-right="fecha ? 'close-circle' : ''"
+      :icon-right="botonCerrar ? (fecha ? 'close-circle' : '') : ''"
-      @icon-right-click="clearDate"
       :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() },

components/layouts/Menu.vue

@@ -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'

components/tablaBuscador/TablaBuscadorPrestamo.vue

@@ -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)

pages/admin/administrador/graficas/prestamos/index.vue

@@ -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" />
 

pages/admin/administrador/graficas/prestamos_individuales/index.vue

@@ -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>