<template>
  <b-table :data="data" detail-transition>
    <b-table-column
      label="Infracción"
      v-slot="props"
      v-if="columnaInfraccion"
      centered
      >{{ props.row.infraccion }}</b-table-column
    >
    <b-table-column
      label="Software"
      v-slot="props"
      v-if="columnaPrograma"
      centered
      >{{ props.row.programa }}</b-table-column
    >
    <b-table-column
      label="Tipo de conector"
      v-slot="props"
      v-if="columnaTipoEntrada"
      centered
      >{{ props.row.tipo_entrada }}</b-table-column
    >
    <b-table-column
      label="Tipo de carrito"
      v-slot="props"
      v-if="columnaTipoCarrito"
      centered
      >{{ props.row.tipo_carrito }}</b-table-column
    >
    <b-table-column
      label="Identificador"
      v-slot="props"
      v-if="columnaLetra"
      centered
      >{{ props.row.letra }}</b-table-column
    >
    <b-table-column
      label="Marca"
      v-slot="props"
      v-if="columnaMarcaC"
      centered
      >{{ props.row.marca }}</b-table-column
    >
    <b-table-column
      label="Módelo"
      v-slot="props"
      v-if="columnaModeloC"
      centered
      >{{ props.row.modelo }}</b-table-column
    >
    <b-table-column
      label="Marca"
      v-slot="props"
      v-if="columnaMarcaE"
      centered
      >{{ props.row.marca }}</b-table-column
    >
    <b-table-column
      label="Módelo"
      v-slot="props"
      v-if="columnaModeloE"
      centered
      >{{ props.row.modelo }}</b-table-column
    >
    <b-table-column
      label="Tipo de usuario"
      v-slot="props"
      v-if="columnaTipoUsuario"
      centered
      >{{ props.row.tipo_usuario }}</b-table-column
    >
  </b-table>
</template>

<script>
export default {
  props: {
    data: { typeof: Array, required: true },
    columnaInfraccion: { typeof: Boolean, required: false, default: false },
    columnaPrograma: { typeof: Boolean, required: false, default: false },
    columnaTipoEntrada: { typeof: Boolean, required: false, default: false },
    columnaTipoCarrito: { typeof: Boolean, required: false, default: false },
    columnaLetra: { typeof: Boolean, required: false, default: false },
    columnaMarcaC: { typeof: Boolean, required: false, default: false },
    columnaModeloC: { typeof: Boolean, required: false, default: false },
    columnaMarcaE: { typeof: Boolean, required: false, default: false },
    columnaModeloE: { typeof: Boolean, required: false, default: false },
    columnaTipoUsuario: { typeof: Boolean, required: false, default: false },
  },
  data() {
    return {}
  },
}
</script>
