diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index a4233b1db9840006a40b658ad3e5a791d607e332..bcce32286f9e2dfe5e0e1d4aa055dd57726c59a5 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -62,6 +62,10 @@
"title": "Duniter"
},
"expire": "Expires",
+ "error": {
+ "tooSmall": "{0} is too small. It must be between {1} and {2}. The value used is {1}",
+ "tooBig": "{0} is too big. It must be between {1} and {2}. The value used is {1}"
+ },
"favoris": {
"enregistre": "Saved to favorites !",
"none": "You don't have any favorites yet",
@@ -152,6 +156,10 @@
"previsions": {
"pardate": "Forecasts by dates",
"parmembre": "Forecasts by members",
+ "period": {
+ "title": "Search period",
+ "desc": "Select the desired number of days between 1 and 30"
+ },
"title": "Forecasts"
},
"pubkey": "Public key",
diff --git a/i18n/locales/es.json b/i18n/locales/es.json
index 1843d3820a777c0499e27e261fdf9b3b2bbebb29..bc350951643454b85c70a8ddb7d11d42ad94725e 100644
--- a/i18n/locales/es.json
+++ b/i18n/locales/es.json
@@ -62,6 +62,10 @@
"title": "Duniter"
},
"expire": "Expira el",
+ "error": {
+ "tooSmall": "{0} es demasiado pequeño. Debe estar entre {1} y {2}. El valor utilizado es {1}",
+ "tooBig": "{0} es demasiado grande. Debe estar entre {1} y {2}. El valor utilizado es {1}"
+ },
"favoris": {
"enregistre": "¡Guardado en favoritos!",
"none": "Aún no tienes favoritos",
@@ -152,6 +156,10 @@
"previsions": {
"pardate": "Previsiones por fecha",
"parmembre": "Previsiones por miembros",
+ "period": {
+ "title": "PerÃodo de búsqueda",
+ "desc": "Seleccione el número de dÃas deseado entre 1 y 30"
+ },
"title": "Pronósticos"
},
"pubkey": "Llave pública",
diff --git a/i18n/locales/fr.json b/i18n/locales/fr.json
index ec1178e51a8a9a041847814406cce7aeb52a7ab4..bafd341e6e9b85ec2516ca1bdf7d3f7c9421e85f 100644
--- a/i18n/locales/fr.json
+++ b/i18n/locales/fr.json
@@ -62,6 +62,10 @@
"title": "Duniter"
},
"expire": "Expire le",
+ "error": {
+ "tooSmall": "{0} est trop petit. Il doit être compris entre {1} et {2}. La valeur utilisée est {1}",
+ "tooBig": "{0} est trop grand. Il doit être compris entre {1} et {2}. La valeur utilisée est {2}"
+ },
"favoris": {
"enregistre": "Enregistré dans les favoris !",
"none": "Vous n'avez pas encore de favoris",
@@ -152,6 +156,10 @@
"previsions": {
"pardate": "Prévisions par date",
"parmembre": "Prévisions par membres",
+ "period": {
+ "title": "Période de recherche",
+ "desc": "Sélectionnez le nombre de jours souhaités entre 1 et 30"
+ },
"title": "Prévisions"
},
"pubkey": "Clef publique",
diff --git a/pages/previsions/futures_sorties.vue b/pages/previsions/futures_sorties.vue
index 7af5bcdbb56b003bac414144ddb7340daaba5d50..ef8adfb4fe125b16586007ce0505547999b9b4bc 100644
--- a/pages/previsions/futures_sorties.vue
+++ b/pages/previsions/futures_sorties.vue
@@ -1,12 +1,28 @@
<template>
<main class="container">
+ <h2 class="text-center my-5 font-weight-light">{{ $t("futureexits") }}</h2>
+ <div class="row mb-4">
+ <div class="col-6 m-auto text-center">
+ <label for="period" class="form-label">{{ $t("previsions.period.title") }}</label>
+ <input
+ type="number"
+ class="form-control"
+ :class="{ invalid:periodIsInvalid() }"
+ id="period"
+ aria-describedby="periodHelp"
+ v-model="period"
+ autocomplete="off"
+ min="1" max="30"
+ @keyup="save" />
+ <small id="periodHelp" class="form-text text-muted">{{ $t("previsions.period.desc") }}</small>
+ </div>
+ </div>
<NavigationLoader :isLoading="$apollo.queries.wwResult.loading" />
<transition name="fade">
- <div class="alert alert-danger" v-if="error">{{ error }}</div>
+ <div class="alert alert-danger" v-if="error && !$apollo.queries.wwResult.loading">{{ error }}</div>
</transition>
<transition name="fade">
- <div v-if="wwResult">
- <h2 class="text-center my-5 font-weight-light">{{ $t("futureexits") }}</h2>
+ <div v-if="wwResult && !$apollo.queries.wwResult.loading">
<div class="row text-center">
<div class="col-md-6 col-lg-6">
<h2 class="h4 text-danger">{{ $t("statut.renew") }}</h2>
@@ -34,34 +50,38 @@
<script>
import { NEXT_EXITS } from "@/graphql/queries.js"
-const defaultPeriod = 30*24*60*60;
+const day = 24*60*60
+const defaultPeriod = 30*day
export default {
- data() {
- return {
- breadcrumb: [
- {
- text: this.$t('accueil'),
- to: '/'
- },
- {
- text: this.$t('previsions.title'),
- to: '/previsions'
- },
- {
- text: this.$t('futureexits'),
- active: true
+ data() {
+ return {
+ breadcrumb: [
+ {
+ text: this.$t('accueil'),
+ to: '/'
+ },
+ {
+ text: this.$t('previsions.title'),
+ to: '/previsions'
+ },
+ {
+ text: this.$t('futureexits'),
+ active: true
+ }
+ ],
+ error: null,
+ period: 30,
+ display: 'forecastsByNames'
}
- ],
- error: null,
- display: 'forecastsByNames'
- }
- },
- methods: {
- save() {
- localStorage.setItem('previsions_sorties', this.group)
},
- addValue(arr, val) {
+ methods: {
+ save() {
+ this.error = null
+ localStorage.setItem('previsions_sorties', this.display)
+ localStorage.setItem('previsions_period', this.getPeriod()/day)
+ },
+ addValue(arr, val) {
if (
arr.filter(function (e) {
return e.uid === val.uid
@@ -70,57 +90,80 @@ export default {
arr.push(val)
}
return arr
+ },
+ getPeriod() {
+ if( this.period != "") {
+ let tempPeriod = parseInt(this.period)
+ if(tempPeriod < 1) {
+ this.error = this.$t("error.tooSmall", [ tempPeriod, 1, 30 ])
+ return day
+ }
+ if(tempPeriod > 30) {
+ this.error = this.$t('error.tooBig', [ tempPeriod, 1, 30 ])
+ return 30 * day
+ }
+ return this.period*day
+ }
+ return defaultPeriod
+ },
+ periodIsInvalid() {
+ return this.period != "" && (this.period < 1 || this.period > 30)
}
- },
- apollo: {
- wwResult : {
- query: NEXT_EXITS,
+ },
+ apollo: {
+ wwResult : {
+ query: NEXT_EXITS,
variables() {
- return { period: defaultPeriod }
+ return { period: this.getPeriod()}
},
- update (data) {
- let result = { membership: [], outOfCerts: [] }
+ 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)
- }
+ 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')
+ this.period = localStorage.getItem('previsions_period')
}
- 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);
- }
+ background: transparent;
+ &:hover {
+ background: rgba(0, 0, 255, 0.075);
+ color: var(--text-primary-color);
+ }
}
.forecast_date {
- min-width: 150px;
+ min-width: 150px;
+}
+
+.invalid {
+ border: 4px solid #ec0404;
}
-</style>
\ No newline at end of file
+</style>