184 lines
4.0 KiB
Vue
184 lines
4.0 KiB
Vue
<template>
|
|
<b-table
|
|
:data="data"
|
|
:loading="isLoadingTable"
|
|
class="mb-6"
|
|
show-detail-icon
|
|
paginated
|
|
detailed
|
|
>
|
|
<b-table-column field="carrito" label="Carrito" v-slot="props" centered>
|
|
<span>{{ props.row.carrito }}</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column field="modulo" label="Módulo" v-slot="props" centered>
|
|
<span>{{ props.row.Modulo.modulo }}</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column field="tipo" label="Tipo" v-slot="props" centered>
|
|
<span>{{ props.row.TipoCarrito.tipoCarrito }}</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column field="activo" label="Activo" v-slot="props" centered>
|
|
<BotonDesactivarCarrito
|
|
:operador="operador"
|
|
:carrito="props.row"
|
|
:imprimirError="imprimirError"
|
|
:imprimirMensaje="imprimirMensaje"
|
|
:imprimirWarning="imprimirWarning"
|
|
:obtenerCarritos="obtenerCarritos"
|
|
/>
|
|
</b-table-column>
|
|
|
|
<template #detail="equipos">
|
|
<b-table
|
|
:data="equipos.row.Equipos"
|
|
:per-page="15"
|
|
:selected.sync="selectedEquipo"
|
|
:row-class="(row, index) => 'pointer'"
|
|
class="mb-6"
|
|
hoverable
|
|
striped
|
|
paginated
|
|
>
|
|
<b-table-column field="equipo" label="Equipo" v-slot="props" centered>
|
|
<span>
|
|
{{ props.row.equipo }}
|
|
</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column
|
|
field="numeroInventario"
|
|
label="Número de inventario"
|
|
v-slot="props"
|
|
centered
|
|
>
|
|
<span>
|
|
{{ props.row.numeroInventario }}
|
|
</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column
|
|
field="numeroSerie"
|
|
label="Número de serie"
|
|
v-slot="props"
|
|
centered
|
|
>
|
|
<span>
|
|
{{ props.row.numeroSerie }}
|
|
</span>
|
|
</b-table-column>
|
|
|
|
<b-table-column
|
|
field="ubicacion"
|
|
label="Ubicación"
|
|
v-slot="props"
|
|
centered
|
|
>
|
|
<span
|
|
class="is-size-6 tag"
|
|
:class="choooseTag(props.row.Status.idStatus)"
|
|
>
|
|
{{ props.row.Status.status }}
|
|
</span>
|
|
</b-table-column>
|
|
</b-table>
|
|
</template>
|
|
</b-table>
|
|
</template>
|
|
|
|
<script>
|
|
import axios from 'axios'
|
|
import BotonDesactivarCarrito from '@/components/operador/BotonDesactivarCarrito.vue'
|
|
|
|
export default {
|
|
components: { BotonDesactivarCarrito },
|
|
props: {
|
|
operador: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
imprimirError: {
|
|
type: Function,
|
|
required: true,
|
|
},
|
|
imprimirMensaje: {
|
|
type: Function,
|
|
required: true,
|
|
},
|
|
imprimirWarning: {
|
|
type: Function,
|
|
required: true,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
isLoadingTable: false,
|
|
data: [],
|
|
selectedEquipo: {},
|
|
}
|
|
},
|
|
methods: {
|
|
choooseTag(idStatus) {
|
|
let style = ''
|
|
|
|
switch (idStatus) {
|
|
case 1:
|
|
style = 'is-info'
|
|
break
|
|
case 2:
|
|
style = 'is-link'
|
|
break
|
|
case 3:
|
|
style = 'is-primary'
|
|
break
|
|
case 4:
|
|
style = 'is-success'
|
|
break
|
|
case 5:
|
|
style = 'is-warning'
|
|
break
|
|
case 6:
|
|
style = 'is-danger'
|
|
break
|
|
case 7:
|
|
style = 'is-black'
|
|
break
|
|
}
|
|
return style
|
|
},
|
|
obtenerCarritos() {
|
|
this.isLoadingTable = true
|
|
axios
|
|
.get(`${process.env.api}/equipo/equipos?pagina=1`, this.operador.token)
|
|
.then((res) => {
|
|
this.data = res.data
|
|
this.isLoadingTable = false
|
|
})
|
|
.catch((err) => {
|
|
this.isLoadingTable = false
|
|
this.imprimirError(err.response.data)
|
|
})
|
|
},
|
|
},
|
|
watch: {
|
|
selectedEquipo() {
|
|
localStorage.setItem(
|
|
'numeroInventario',
|
|
this.selectedEquipo.numeroInventario
|
|
)
|
|
this.$router.push('buscar_equipo')
|
|
},
|
|
},
|
|
created() {
|
|
this.obtenerCarritos()
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.pointer {
|
|
cursor: pointer;
|
|
}
|
|
</style>
|