From 57c1830fd5a696df1f138854ed0c7851e022f91f Mon Sep 17 00:00:00 2001
From: paidge <paidge_cs@hotmail.com>
Date: Wed, 29 Dec 2021 06:20:14 +0100
Subject: [PATCH] add links to members in forecasts vue
---
pages/previsions.vue | 48 ++++++++++++++++++++++++++++++--------------
1 file changed, 33 insertions(+), 15 deletions(-)
diff --git a/pages/previsions.vue b/pages/previsions.vue
index 5a442fd..1559c78 100644
--- a/pages/previsions.vue
+++ b/pages/previsions.vue
@@ -9,31 +9,32 @@
<li>{{ wwResult.permutations_nb }} permutations</li>
</ul>
</div>
- <div class="row mb-4">
- <div class="col">
+ <div class="row">
+ <div class="col-12 text-center mb-4">
<div class="form-check form-check-inline">
- <input class="form-check-input" type="radio" id="forecastsByNames" value="forecastsByNames" checked v-model="display">
+ <input class="form-check-input" type="radio" id="forecastsByNames" value="forecastsByNames" checked v-model="display" @change="save">
<label class="form-check-label" for="forecastsByNames">
Tri par membres
</label>
</div>
<div class="form-check form-check-inline">
- <input class="form-check-input" type="radio" id="forecastsByDates" value="forecastsByDates" v-model="display">
+ <input class="form-check-input" type="radio" id="forecastsByDates" value="forecastsByDates" v-model="display" @change="save">
<label class="form-check-label" for="forecastsByDates">
Tri par dates
</label>
</div>
</div>
- </div>
- <div class="row">
- <div class="col-lg-6">
+ <div class="col-lg-8 m-auto">
<div v-if="display=='forecastsByNames'">
<h3>Prévisions par membres</h3>
<div class="table-responsive">
- <table class="table table-striped">
+ <table class="table table-striped table-hover">
<tbody>
- <tr v-for="forecast in wwResult.forecastsByNames" :key="forecast.member.uid">
- <th scope="row">{{ forecast.member.uid }}</th>
+ <tr v-for="forecast in wwResult.forecastsByNames" :key="forecast.member.uid" @click="$router.push({ path: '/membres/' + forecast.member.hash })">
+ <th scope="row">
+ {{ forecast.member.uid }}
+ <BadgeStatus :membre="forecast.member" />
+ </th>
<td class="p-0">
<div class="d-flex justify-content-between p-3" v-for="date in forecast.forecasts" :key="date.date">
<div>{{ date.date | formatDateHeure }}</div>
@@ -53,9 +54,11 @@
<tr v-for="forecast in wwResult.forecastsByDates" :key="forecast.date">
<th scope="row">{{ forecast.date | formatDateHeure }}</th>
<td class="p-0">
- <div class="d-flex justify-content-between p-3" v-for="member in forecast.forecasts" :key="member.member.uid">
- <div>{{ member.member.uid }}</div>
- <div>{{ member.proba * 100 }} %</div>
+ <div class="list-group rounded-0">
+ <nuxt-link class="list-group-item list-group-item-action border-0 d-flex justify-content-between" :to="'/membres/' + member.member.hash" v-for="member in forecast.forecasts" :key="member.member.uid">
+ <div>{{ member.member.uid }} <BadgeStatus :membre="member.member" /></div>
+ <div>{{ member.proba * 100 }} %</div>
+ </nuxt-link>
</div>
</td>
</tr>
@@ -92,7 +95,9 @@ export default {
},
// Fonctions locales
methods: {
-
+ save() {
+ localStorage.setItem('previsions', this.display)
+ }
},
apollo: {
wwResult : {
@@ -178,6 +183,19 @@ export default {
mounted () {
// Mise à jour du fil d'ariane au chargement
$nuxt.$emit('changeRoute',this.breadcrumb)
+ if (localStorage.previsions) {
+ this.display = localStorage.getItem('previsions')
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.list-group-item {
+ background: transparent;
+ &:hover {
+ background: rgba(0, 0, 255, 0.075);
+ color: var(--text-primary-color);
}
}
-</script>
\ No newline at end of file
+</style>
\ No newline at end of file
--
GitLab