pcpuma_unam_operador/components/tablas/TablaCarritos.vue
2023-01-17 11:44:41 -06:00

98 lines
2.4 KiB
Vue

<template>
<b-table
class="pb-6"
:current-page="page"
:data="carritos"
:loading="isLoadingTable"
:per-page="25"
:row-class="
(row, index) =>
operador.tipoUsuario.id_tipo_usuario > 2 ? 'pointer' : ''
"
:selected.sync="carritoSeleccionado"
:total="total"
@page-change="onPageChange"
backend-pagination
detailed
hoverable
paginated
show-detail-icon
striped
>
<b-table-column
field="institucion"
label="Institucion"
v-slot="props"
centered
v-if="operador.tipoUsuario.id_tipo_usuario === 2"
>
<p>{{ props.row.modulo.institucion.institucion }}</p>
</b-table-column>
<b-table-column field="carrito" label="Carrito" v-slot="props" centered>
<p>{{ props.row.carrito }}</p>
</b-table-column>
<b-table-column
field="tipo"
label="Tipo de carrito"
v-slot="props"
centered
>
<p>{{ props.row.tipoCarrito.tipo_carrito }}</p>
</b-table-column>
<b-table-column field="modulo" label="Módulo" v-slot="props" centered>
<p>{{ props.row.modulo.modulo }}</p>
</b-table-column>
<b-table-column field="status" label="Status" v-slot="props" centered>
<p class="is-size-6 tag" :class="chooseTag(props.row.activo)">
{{ props.row.activo ? 'Activo' : 'Inactivo' }}
</p>
</b-table-column>
<template #detail="props">
<EquiposCarrito :carrito="props.row" :operador="operador" />
</template>
</b-table>
</template>
<script>
import EquiposCarrito from '@/components/tablas/EquiposCarrito'
export default {
components: { EquiposCarrito },
props: {
carritos: { type: Array, required: true, default: () => [] },
isLoadingTable: { type: Boolean, required: true, default: false },
onPageChange: { type: Function, required: true, default: () => {} },
page: { type: Number, required: true, default: 1 },
total: { type: Number, required: true, default: 0 },
operador: { type: Object, required: true, default: () => ({}) },
},
data() {
return { carritoSeleccionado: {} }
},
methods: {
chooseTag(activo) {
return activo ? 'is-success' : 'is-danger'
},
},
watch: {
carritoSeleccionado() {
if (this.operador.tipoUsuario.id_tipo_usuario > 2)
this.$router.push(
`/carritos/buscar_carrito/${this.carritoSeleccionado.id_carrito}`
)
},
},
}
</script>
<style>
.pointer {
cursor: pointer;
}
</style>