equipos en carritos

components/operador/Carrito.vue

@@ -6,19 +6,27 @@
       :updateIsLoading="updateIsLoading"
       :updateCarrito="updateCarrito"
     />
+
+    <TablaEquipos
+      :data="data"
+      :total="total"
+      :obtenerEquipos="obtenerEquipos"
+      :isLoadingTable="isLoadingTable"
+    />
   </section>
 </template>
 
 <script>
+import axios from 'axios'
 import BuscarCarrito from '@/components/operador/BuscarCarrito'
-import TablaPrestamos from '@/components/operador/TablaPrestamos'
+import TablaEquipos from '@/components/operador/TablaEquipos'
-import TablaReportes from '@/components/operador/TablaReportes'
-import TablaMotivos from '@/components/operador/TablaMotivos'
 
 export default {
-  components: { TablaPrestamos, BuscarCarrito, TablaReportes, TablaMotivos },
+  components: { BuscarCarrito, TablaEquipos },
   data() {
     return {
+      data: [],
+      total: 0,
       carrito: { modulo: {}, tipoCarrito: {} },
       isLoadingTable: false,
     }
@@ -28,21 +36,29 @@ export default {
     updateIsLoading: { type: Function, required: true },
   },
   methods: {
-    onPrestamosPageChange(page) {
-      this.pagePrestamos = page
-      this.obtenerPrestamos()
-    },
-    onReportesPageChange(page) {
-      this.pageReportes = page
-      this.obtenerReportes()
-    },
-    onMotivosPageChange(page) {
-      this.pageMotivos = page
-      this.obtenerMotivos()
-    },
     updateCarrito(valorObject) {
       this.carrito = valorObject
     },
+    obtenerEquipos(pagina) {
+      axios
+        .get(
+          `${process.env.api}/equipo/equipos?pagina=${pagina}&carrito=${this.carrito.carrito}`
+        )
+        .then((res) => {
+          this.data = res.data[0]
+          this.total = res.data[1]
+          this.isLoadingTable = false
+        })
+        .catch((err) => {
+          this.isLoadingTable = false
+          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
+        })
+    },
+  },
+  watch: {
+    carrito() {
+      this.obtenerEquipos(1)
+    },
   },
 }
 </script>

components/operador/TablaEquipos.vue

@@ -0,0 +1,102 @@
+<template>
+  <b-table
+    :data="data"
+    :total="total"
+    :loading="isLoadingTable"
+    @page-change="onPageChange"
+    :selected.sync="selectedEquipo"
+    :row-class="(row, index) => 'pointer'"
+    backend-pagination
+    hoverable
+    striped
+    paginated
+  >
+    <b-table-column field="equipo" label="Equipo" centered v-slot="props">
+      {{ props.row.equipo }}
+    </b-table-column>
+
+    <b-table-column
+      field="numeroInventario"
+      label="Número de Inventario"
+      centered
+      v-slot="props"
+    >
+      {{ props.row.numero_inventario }}
+    </b-table-column>
+
+    <b-table-column field="carrito" label="Carrito" centered v-slot="props">
+      {{ props.row.carrito.carrito }}
+    </b-table-column>
+
+    <b-table-column field="modulo" label="Módulo" centered v-slot="props">
+      {{ props.row.carrito.modulo.modulo }}
+    </b-table-column>
+
+    <b-table-column
+      field="tipoCarrito"
+      label="Tipo Carrito"
+      centered
+      v-slot="props"
+    >
+      {{ props.row.carrito.tipoCarrito.tipo_carrito }}
+    </b-table-column>
+
+    <b-table-column field="status" label="Status" centered v-slot="props">
+      <span
+        class="is-size-6 tag"
+        :class="choooseTag(props.row.status.id_status)"
+      >
+        {{ props.row.status.status }}
+      </span>
+    </b-table-column>
+  </b-table>
+</template>
+
+<script>
+export default {
+  props: {
+    obtenerEquipos: { type: Function, required: true },
+    data: { type: Array, required: true },
+    total: { type: Number, required: true },
+    isLoadingTable: { type: Boolean, required: true },
+  },
+  data() {
+    return {
+      selectedEquipo: {},
+      page: 1,
+    }
+  },
+  methods: {
+    onPageChange(page) {
+      this.page = page
+      this.obtenerEquipos(this.page)
+    },
+    choooseTag(idStatus) {
+      const style = {
+        1: 'is-info',
+        2: 'is-link',
+        3: 'is-primary',
+        4: 'is-success',
+        5: 'is-warning',
+        6: 'is-danger',
+        7: 'is-black',
+      }
+      return style[idStatus]
+    },
+  },
+  watch: {
+    selectedEquipo() {
+      this.$router.push(
+        '/operador/equipos/buscar_equipo/' +
+          this.selectedEquipo.numero_inventario
+      )
+    },
+  },
+}
+</script>
+
+<style>
+.pointer {
+  cursor: pointer;
+}
+</style>

components/operador/TodosEquipos.vue

@@ -29,95 +29,36 @@
       >
     </div>
 
-    <b-table
+    <TablaEquipos
       :data="data"
       :total="total"
-      :loading="isLoadingTable"
+      :obtenerEquipos="obtenerEquipos"
-      @page-change="onPageChange"
+      :isLoadingTable="isLoadingTable"
-      :selected.sync="selectedEquipo"
+    />
-      :row-class="(row, index) => 'pointer'"
-      backend-pagination
-      hoverable
-      striped
-      paginated
-    >
-      <b-table-column field="equipo" label="Equipo" centered v-slot="props">
-        {{ props.row.equipo }}
-      </b-table-column>
-
-      <b-table-column
-        field="numeroInventario"
-        label="Número de Inventario"
-        centered
-        v-slot="props"
-      >
-        {{ props.row.numero_inventario }}
-      </b-table-column>
-
-      <b-table-column field="carrito" label="Carrito" centered v-slot="props">
-        {{ props.row.carrito.carrito }}
-      </b-table-column>
-
-      <b-table-column field="modulo" label="Módulo" centered v-slot="props">
-        {{ props.row.carrito.modulo.modulo }}
-      </b-table-column>
-
-      <b-table-column
-        field="tipoCarrito"
-        label="Tipo Carrito"
-        centered
-        v-slot="props"
-      >
-        {{ props.row.carrito.tipoCarrito.tipo_carrito }}
-      </b-table-column>
-
-      <b-table-column field="status" label="Status" centered v-slot="props">
-        <span
-          class="is-size-6 tag"
-          :class="choooseTag(props.row.status.id_status)"
-        >
-          {{ props.row.status.status }}
-        </span>
-      </b-table-column>
-    </b-table>
   </div>
 </template>
 
 <script>
 import axios from 'axios'
+import TablaEquipos from '@/components/operador/TablaEquipos'
 export default {
+  components: {
+    TablaEquipos,
+  },
   props: {
-    operador: { type: Object, require: true },
+    operador: { type: Object, required: true },
   },
   data() {
     return {
       data: [],
       total: 0,
-      selectedEquipo: {},
       isLoadingTable: false,
-      page: 1,
       carrito: '',
       equipo: '',
     }
   },
   methods: {
-    onPageChange(page) {
+    obtenerEquipos(pagina) {
-      this.page = page
-      this.obtenerEquipos()
-    },
-    choooseTag(idStatus) {
-      const style = {
-        1: 'is-info',
-        2: 'is-link',
-        3: 'is-primary',
-        4: 'is-success',
-        5: 'is-warning',
-        6: 'is-danger',
-        7: 'is-black',
-      }
-      return style[idStatus]
-    },
-    obtenerEquipos() {
       let carrito = ''
       let equipo = ''
       if (this.carrito != '') carrito = '&carrito=' + this.carrito
@@ -125,7 +66,7 @@ export default {
 
       axios
         .get(
-          `${process.env.api}/equipo/equipos?pagina=${this.page}${carrito}${equipo}`
+          `${process.env.api}/equipo/equipos?pagina=${pagina}${carrito}${equipo}`
         )
         .then((res) => {
           this.data = res.data[0]
@@ -138,22 +79,8 @@ export default {
         })
     },
   },
-  watch: {
-    selectedEquipo() {
-      this.$router.push({
-        path:
-          '../equipos/buscar_equipo/' + this.selectedEquipo.numero_inventario,
-      })
-    },
-  },
   created() {
-    this.obtenerEquipos()
+    this.obtenerEquipos(1)
   },
 }
 </script>
-
-<style>
-.pointer {
-  cursor: pointer;
-}
-</style>