pcpuma_unam_operador/components/operador/Equipo.vue

<template>
  <section class="mb-5">
    <BuscarEquipo
      :operador="operador"
      :equipo="equipo"
      :imprimirError="imprimirError"
      :imprimirWarning="imprimirWarning"
      :imprimirMensaje="imprimirMensaje"
      :updateIsLoading="updateIsLoading"
      :obtenerMotivos="obtenerMotivos"
      :updateEquipo="updateEquipo"
    />

    <b-tabs>
      <b-tab-item label="Historial">
        <TablaPrestamos
          :isLoadingTable="isLoadingTable"
          :data="dataPrestamos"
          :page="pagePrestamos"
          :onPageChange="onPrestamosPageChange"
          :total="totalPrestamos"
          :columnaNumeroCuenta="true"
          :columnaIdPrestamo="true"
          :columnaHoraRegreso="true"
          :columnaCanceladoOperador="true"
          :columnaCanceladoUsuario="true"
          :columnaOperadores="true"
          :filaActivo="true"
        />
      </b-tab-item>

      <!-- <b-tab-item label="Reportes">
        <TablaReportes
          :data="dataReportes"
          :page="pageReportes"
          :total="totalReportes"
          :isLoading="isLoadingTable"
          :onPageChange="onReportesPageChange"
        />
      </b-tab-item> -->

      <b-tab-item label="Motivos">
        <TablaMotivos
          :data="dataMotivos"
          :page="pageMotivos"
          :total="totalMotivos"
          :isLoading="isLoadingTable"
          :onPageChange="onMotivosPageChange"
        />
      </b-tab-item>
    </b-tabs>
  </section>
</template>

<script>
import axios from 'axios'
import BuscarEquipo from '@/components/operador/BuscarEquipo'
import TablaPrestamos from '@/components/operador/TablaPrestamos'
import TablaReportes from '@/components/operador/TablaReportes'
import TablaMotivos from '@/components/operador/TablaMotivos'

export default {
  components: { TablaPrestamos, BuscarEquipo, TablaReportes, TablaMotivos },
  data() {
    return {
      equipo: {
        carrito: { modulo: {}, tipoCarrito: {} },
        programa: {},
        status: {},
        tiposEntradas: {},
      },
      dataPrestamos: [],
      pagePrestamos: 1,
      totalPrestamos: 0,
      dataReportes: [],
      pageReportes: 1,
      totalReportes: 0,
      dataMotivos: [],
      pageMotivos: 1,
      totalMotivos: 0,
      isLoadingTable: false,
    }
  },
  props: {
    operador: { type: Object, required: true },
    imprimirError: { type: Function, required: true },
    imprimirWarning: { type: Function, required: true },
    imprimirMensaje: { type: Function, required: true },
    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()
    },
    updateEquipo(valorObject) {
      this.equipo = valorObject
    },
    // obtenerPrestamos() {
    //   this.isLoadingTable = true
    //   axios
    //     .get(
    //       `${process.env.api}/prestamo/historial_equipo?pagina=${this.pagePrestamos}&idEquipo=${this.equipo.idEquipo}`,
    //       this.operador.token
    //     )
    //     .then((res) => {
    //       this.dataPrestamos = res.data.rows
    //       this.totalPrestamos = res.data.count
    //       this.isLoadingTable = false
    //     })
    //     .catch((err) => {
    //       this.isLoadingTable = false
    //       this.imprimirError(err.response.data)
    //     })
    // },
    // obtenerReportes() {
    //   this.isLoadingTable = true
    //   axios
    //     .get(
    //       `${process.env.api}/multa/historial_multas_equipo?pagina=${this.pageReportes}&idEquipo=${this.equipo.idEquipo}`,
    //       this.operador.token
    //     )
    //     .then((res) => {
    //       this.dataReportes = res.data.rows
    //       this.totalReportes = res.data.count
    //       this.isLoadingTable = false
    //     })
    //     .catch((err) => {
    //       this.isLoadingTable = false
    //       this.imprimirError(err.response.data)
    //     })
    // },
    obtenerMotivos() {
      this.isLoadingTable = true
      axios
        .get(
          `${process.env.api}/motivo?pagina=${this.pageMotivos}&id_equipo=${this.equipo.id_equipo}`,
          this.operador.token
        )
        .then((res) => {
          console.log(res)
          this.dataMotivos = res.data[0]
          this.totalMotivos = res.data[1]
          this.isLoadingTable = false
        })
        .catch((err) => {
          this.isLoadingTable = false
          this.imprimirError(err.response.data)
        })
    },
  },
}
</script>

<style></style>