Andres2908
72 lines
1.6 KiB
Vue
72 lines
1.6 KiB
Vue
<template>
|
|
<div class="columns">
|
|
<div class="column box mr-5">
|
|
<p>Cuenta: {{ datosUsuario.numeroCuenta }}</p>
|
|
<p>Nombre: {{ datosUsuario.nombre }}</p>
|
|
<p>Correo: {{ datosUsuario.numeroCuenta }}@pcpuma.unam.acatlan.mx</p>
|
|
<p>Carrera: {{ datosUsuario.carrera }}</p>
|
|
</div>
|
|
|
|
<b-table class="column box tabla" :data="inscripcionesUsuario">
|
|
<b-table-column
|
|
field="inscrito"
|
|
label="Inscrito en"
|
|
centered
|
|
v-slot="props"
|
|
>
|
|
<b-icon :icon="icono(props.row.idArea)" size="is-small"></b-icon>
|
|
{{ area(props.row.idArea) }}
|
|
</b-table-column>
|
|
|
|
<b-table-column
|
|
field="tiempo"
|
|
label="Tiempo disponible"
|
|
centered
|
|
v-slot="props"
|
|
>
|
|
{{ props.row.tiempo }} minutos(s)
|
|
</b-table-column>
|
|
|
|
<b-table-column field="status" label="Confirmo" centered v-slot="props">
|
|
{{ confirmacion(props.row.status) }}
|
|
</b-table-column>
|
|
</b-table>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
inscripcionesUsuario: { type: Array, required: true },
|
|
datosUsuario: { type: Object, required: true },
|
|
area: { type: Function, require: true },
|
|
},
|
|
data() {
|
|
return {
|
|
// datosUsuario: {},
|
|
// inscripcionesUsuario: null,
|
|
}
|
|
},
|
|
methods: {
|
|
icono(idArea) {
|
|
if (idArea === 1) return 'microsoft-windows'
|
|
return idArea === 2 ? 'apple' : 'linux'
|
|
},
|
|
confirmacion(status) {
|
|
return status === 1 ? 'Si' : 'No'
|
|
},
|
|
},
|
|
created() {
|
|
console.log(this.inscripcionesUsuario)
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.table,
|
|
.table td {
|
|
padding: 0.2em;
|
|
text-align: center;
|
|
}
|
|
</style>
|