Ajout d'une page de prévisions de sorties

 * Prévisions des pertes d'adhésion
 * Prévisions du manque de certifications

components/badge/Date.vue

+<template>
+	<small>
+        <span
+            class="badge"
+            :class="'badge-' + $options.filters.dateStatus(date)">
+            {{ $d(new Date(date * 1000), styleDate) }}
+        </span>
+    </small>
+</template>
+
+<script>
+export default {
+	props: {
+		date: {
+			type: Number,
+			required: true
+		},
+		styleDate: {
+			type: String,
+			required: true
+		},
+    }
+}
+</script>

components/certif/List.vue

@@ -34,20 +34,12 @@
 						</div>
 					</th>
 					<td class="text-right py-1">
-						<small
-							><span
-								class="badge"
-								:class="
-									'badge-' + $options.filters.dateStatus(certif.expires_on)
-								"
-								>{{ $d(new Date(certif.expires_on * 1000), "short") }}</span
-							></small
-						>
-						<small class="d-block"
-							><span class="badge badge-secondary">{{
-								$t("traitement")
-							}}</span></small
-						>
+						<BadgeDate
+							:date="certif.expires_on"
+							:styleDate="'short'" />
+						<small class="d-block">
+							<span class="badge badge-secondary">{{ $t("traitement")}}</span>
+						</small>
 					</td>
 				</tr>
 			</tbody>
@@ -134,15 +126,9 @@
 						</div>
 					</th>
 					<td class="text-right py-1">
-						<small
-							><span
-								class="badge"
-								:class="
-									'badge-' + $options.filters.dateStatus(certif.expires_on)
-								"
-								>{{ $d(new Date(certif.expires_on * 1000), "long") }}</span
-							></small
-						>
+						<BadgeDate
+							:date="certif.expires_on"
+							:styleDate="'long'" />
 					</td>
 				</tr>
 			</tbody>

components/member/List.vue

@@ -23,9 +23,15 @@
 							:limitDate="
 								Math.min(member.received_certifications.limit, member.limitDate)
 							"
-							:memberStatus="member.status" />
-						<BadgeStatus :membre="member" />
+							:memberStatus="member.status"
+							v-if="!displayOnlyDate" />
+						<BadgeStatus :membre="member" v-if="!displayOnlyDate"/>
 					</th>
+					<td class="d-none d-xl-table-cell" v-if="displayOnlyDate">
+						<BadgeDate
+							:date="adhesion ? member.limitDate : member.received_certifications.limit"
+							:styleDate="'long'" />
+					</td>
 					<td class="d-none d-xl-table-cell" v-if="displayPubkey">
 						{{ member.pubkey.substring(0, 10) }}
 					</td>
@@ -57,7 +63,15 @@ export default {
 		displayDate: {
 			type: Boolean,
 			default: true
-		}
+		},
+		displayOnlyDate: {
+			type: Boolean,
+			default: false
+		},
+		adhesion: {
+			type: Boolean,
+			default: true
+		},
 	},
 	methods: {
 		redirect(hash) {

graphql/doc/graphQLschema.txt

@@ -595,7 +595,7 @@ type Forecast {
 "Entry or exit of an identity"
 type EventId {
 	
-	id: Identity!
+	member: Identity!
 	
 	"Entry or exit; true if entry"
 	inOut: Boolean!

graphql/queries.js

@@ -206,3 +206,21 @@ export const FAVORIS = gql`
 		}
 	}
 `
+
+// Pour la page index
+export const NEXT_EXITS = gql`
+	query NextExits($group: [String!], $start: Int64, $period: Int64) {
+		memEnds (group: $group, startFromNow: $start, period: $period) {
+			__typename
+			pubkey
+			uid
+			status
+			hash
+			limitDate
+			received_certifications {
+				__typename
+				limit
+			}
+		}
+	}
+`

i18n/locales/en.json

@@ -69,6 +69,7 @@
 		"title": "My favourites"
 	},
 	"futuremembers": "Future members",
+	"futureexits": "Future exits",
 	"infos": "Informations",
 	"inout": "Entries and exits of the web of trust for the last 2 days",
 	"inpreparation": "In preparation",

i18n/locales/es.json

@@ -69,6 +69,7 @@
 		"title": "Mis favoritos"
 	},
 	"futuremembers": "Futuros miembros",
+	"futureexits": "Futuras salidas",
 	"infos": "Informaciones",
 	"inout": "Entradas y salidas de la red de confianza en los últimos 2 días",
 	"inpreparation": "En preparación",

i18n/locales/fr.json

@@ -69,6 +69,7 @@
 		"title": "Mes favoris"
 	},
 	"futuremembers": "Futurs membres",
+	"futureexits": "Futures sorties",
 	"infos": "Informations",
 	"inout": "Entrées et sorties de la toile de confiance des 2 derniers jours",
 	"inpreparation": "En préparation",

layouts/default.vue

@@ -21,7 +21,10 @@ export default {
 				},
 				{
 					title: "previsions.title",
-					items: [{ path: "/previsions", title: "futuremembers" }]
+					items: [
+						{ path: "/previsions", title: "futuremembers" },
+						{ path: "/previsions/futures_sorties", title: "futureexits" },
+					]
 				},
 				{
 					title: "infos",

pages/previsions/futures_sorties.vue

+<template>
+	<main class="container">
+		<NavigationLoader :isLoading="$apollo.queries.wwResult.loading" />
+		<transition name="fade">
+			<div class="alert alert-danger" v-if="error">{{ error }}</div>
+		</transition>
+		<transition name="fade">
+			<div v-if="wwResult">
+				<h2 class="text-center my-5 font-weight-light">{{ $t("futureexits") }}</h2>
+				<div class="row text-center">
+					<div class="col-md-6 col-lg-6">
+						<h2 class="h4 text-danger">{{ $t("statut.renew") }}</h2>
+						<MemberList
+							:members="wwResult['membership']"
+							:displayPubkey="false"
+							:displayHead="false"
+							:displayOnlyDate="true"
+							:displayDate="false" />
+					</div>
+					<div class="col-md-6 col-lg-6">
+						<h2 class="h4 text-danger">{{ $t("statut.manquecertif") }}</h2>
+						<MemberList
+							:members="wwResult['outOfCerts']"
+							:displayPubkey="false"
+							:displayHead="false"
+							:displayOnlyDate="true"
+							:displayDate="false"
+							:adhesion="false" />
+					</div>
+				</div>
+			</div>
+		</transition>
+	</main>
+</template>
+
+<script>
+import { NEXT_EXITS } from "@/graphql/queries.js"
+
+const defaultPeriod = 30*24*60*60;
+
+export default {
+  data() {
+	return {
+	  breadcrumb: [
+		{
+		  text: this.$t('accueil'),
+		  to: '/'
+		},
+		{
+		  text: this.$t('previsions.title'),
+		  to: '/previsions'
+		},
+		{
+		  text: this.$t('futureexits'),
+		  active: true
+		}
+	  ],
+	  error: null,
+	  display: 'forecastsByNames'
+	}
+  },
+  methods: {
+	save() {
+	  localStorage.setItem('previsions_sorties', this.group)
+	},
+	addValue(arr, val) {
+			if (
+				arr.filter(function (e) {
+					return e.uid === val.uid
+				}).length == 0
+			) {
+				arr.push(val)
+			}
+			return arr
+		}
+  },
+  apollo: {
+	wwResult : {
+	  query: NEXT_EXITS,
+			variables() {
+				return { period: defaultPeriod }
+			},
+	  update (data) {
+		let result = { membership: [], outOfCerts: [] }
+
+		for (let i = 0; i < data.memEnds.length; i++) {
+		  let identity = data.memEnds[i]
+		  if(['danger', 'warning'].includes(this.$options.filters.dateStatus(identity.limitDate))) {
+			this.addValue(result["membership"], identity)
+		  }
+		  if(['danger', 'warning'].includes(this.$options.filters.dateStatus(identity.received_certifications.limit))) {
+			this.addValue(result["outOfCerts"], identity)
+		  }
+		}
+		return result
+	  },
+	  error (err) {this.error = err.message}
+	}
+  },
+  nuxtI18n: {
+	paths: {
+	  fr: '/previsions/futures_sorties',
+	  en: '/forecasts/future_exits',
+	  es: '/pronosticos/futuras_salidas'
+	}
+  },
+  mounted () {
+	$nuxt.$emit('changeRoute',this.breadcrumb)
+	if (localStorage.previsions_sorties) {
+	  this.display = localStorage.getItem('previsions_sorties')
+	}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.list-group-item {
+  background: transparent;
+  &:hover {
+	background: rgba(0, 0, 255, 0.075);
+	color: var(--text-primary-color);
+  }
+}
+
+.forecast_date {
+  min-width: 150px;
+}
+</style>
\ No newline at end of file