<template lang="pug">
div
table
- tr
- th Variant
- th From
- th To
- th Cadence
- tr(v-for="c in sortedChallenges" @click="$emit('click-challenge',c)")
- td {{ c.vname }}
- td {{ c.from.name }}
- td {{ c.to }}
- td {{ c.timeControl }}
+ thead
+ tr
+ th {{ st.tr["Variant"] }}
+ th {{ st.tr["From"] }}
+ th {{ st.tr["To"] }}
+ th {{ st.tr["Cadence"] }}
+ tbody
+ tr(v-for="c in sortedChallenges" @click="$emit('click-challenge',c)")
+ td(data-label="Variant") {{ c.vname }}
+ td(data-label="From") {{ c.from.name || "@nonymous" }}
+ td(data-label="To") {{ c.to }}
+ td(data-label="Cadence") {{ c.cadence }}
</template>
<script>
import { store } from "@/store";
-
export default {
name: "my-challenge-list",
- props: ["challenges"],
+ props: ["challenges"],
data: function() {
return {
st: store.state,
},
};
</script>
-
-<style lang="sass">
-// TODO: affichage bizarre sur petits écrans <=767px
-</style>