From b7d422033bc36e774d53602efaf6801a29279231 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benoi=CC=82t=20Besnard?= <bbesnard@clever-age.com>
Date: Mon, 24 Jan 2022 12:00:46 +0100
Subject: [PATCH] Ajout tri par nom ou date
---
components/member/List.vue | 111 ++++++++++++++++++++++++++-
i18n/locales/en.json | 3 +
i18n/locales/es.json | 3 +
i18n/locales/fr.json | 3 +
pages/previsions/futures_sorties.vue | 2 -
5 files changed, 117 insertions(+), 5 deletions(-)
diff --git a/components/member/List.vue b/components/member/List.vue
index 9eb49d6..1ed5ac8 100644
--- a/components/member/List.vue
+++ b/components/member/List.vue
@@ -3,10 +3,52 @@
<table class="table table-striped table-hover">
<thead v-if="displayHead">
<tr>
- <th scope="col">UID</th>
- <th scope="col" class="d-none d-xl-table-cell" v-if="displayPubkey">
+ <th scope="col" @click="sort('uid')">
+ UID
+ <div class="d-inline-block position-absolute ml-2">
+ <div
+ class="up"
+ :class="{
+ sorted: currentSortDir == 'desc' && currentSort == 'uid',
+ invisible: currentSortDir == 'asc' && currentSort == 'uid'
+ }">
+ â–²
+ </div>
+ <div
+ class="down"
+ :class="{
+ sorted: currentSortDir == 'asc' && currentSort == 'uid',
+ invisible: currentSortDir == 'desc' && currentSort == 'uid'
+ }">
+ â–¼
+ </div>
+ </div>
+ </th>
+ <th scope="col" class="d-none d-xl-table-cell" v-if="displayPubkey && !displayOnlyDate">
{{ $t("cle.publique.title") }}
</th>
+ <th scope="col" class="d-none d-xl-table-cell"
+ @click="sort('limit_date')" v-if="displayOnlyDate">
+ {{ $t("limitDate") }}
+ <div class="d-inline-block position-absolute ml-2">
+ <div
+ class="up"
+ :class="{
+ sorted: currentSortDir == 'desc' && currentSort == 'limit_date',
+ invisible: currentSortDir == 'asc' && currentSort == 'limit_date'
+ }">
+ â–²
+ </div>
+ <div
+ class="down"
+ :class="{
+ sorted: currentSortDir == 'asc' && currentSort == 'limit_date',
+ invisible: currentSortDir == 'desc' && currentSort == 'limit_date'
+ }">
+ â–¼
+ </div>
+ </div>
+ </th>
<th scope="col" class="d-none d-sm-table-cell" v-if="displayDate">
{{ $t("membre.datelimpertestatut") }}
</th>
@@ -14,7 +56,7 @@
</thead>
<tbody>
<tr
- v-for="member in members"
+ v-for="member in membersSorted"
:key="member.uid"
@click="redirect(member.hash)">
<th scope="row">
@@ -47,6 +89,12 @@
<script>
export default {
+ data() {
+ return {
+ currentSort: "uid",
+ currentSortDir: "asc"
+ }
+ },
props: {
members: {
type: Array,
@@ -91,7 +139,64 @@ export default {
"'>" +
this.$d(new Date(date * 1000), "long") +
"</span>"
+ },
+ sort(s) {
+ if (s === this.currentSort) {
+ this.currentSortDir = this.currentSortDir === "asc" ? "desc" : "asc"
+ }
+ this.currentSort = s
+ }
+ },
+ computed: {
+ membersSorted() {
+ return this.members
+ .slice()
+ .sort((a, b) => {
+ let modifier = this.currentSortDir === "desc" ? -1 : 1
+
+ if (this.currentSort == "limit_date") {
+ if(this.adhesion) {
+ if (a["limitDate"] < b["limitDate"]) return -1 * modifier
+ if (a["limitDate"] > b["limitDate"]) return 1 * modifier
+ } else {
+ if (a["received_certifications"]["limit"] < b["received_certifications"]["limit"]) return -1 * modifier
+ if (a["received_certifications"]["limit"] > b["received_certifications"]["limit"]) return 1 * modifier
+ }
+ } else {
+ if (a["uid"].toLowerCase() < b["uid"].toLowerCase())
+ return -1 * modifier
+ if (a["uid"].toLowerCase() > b["uid"].toLowerCase())
+ return 1 * modifier
+ }
+
+ return 0
+ })
}
}
}
</script>
+
+<style lang="scss" scoped>
+thead th {
+ position: relative;
+ cursor: pointer;
+ background: var(--background-color-secondary);
+
+ &:last-child {
+ padding-right: 1.5rem;
+ text-align: right;
+ }
+}
+
+.up,
+.down {
+ line-height: 10px;
+ font-size: 1.1rem;
+ transform: scale(1.5, 1);
+ opacity: 0.3;
+}
+
+.sorted {
+ opacity: 1;
+}
+</style>
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index a93e474..a4233b1 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -74,6 +74,7 @@
"inout": "Entries and exits of the web of trust for the last 2 days",
"inpreparation": "In preparation",
"lexique": "Lexicon",
+ "limitDate": "Deadline",
"membre": {
"calculant": {
"desc": "Member using his private key to forge blocks thanks to Duniter installed on a node accessible on the Internet network",
@@ -153,6 +154,7 @@
"parmembre": "Forecasts by members",
"title": "Forecasts"
},
+ "pubkey": "Public key",
"recherche": {
"desc": "Enter the start of a nickname or public key",
"title": "Your search"
@@ -185,6 +187,7 @@
"title": "Relative Theory of Money (RTM)"
},
"type": "Type",
+ "uid": "Unique identifier",
"valeur": "Value",
"wot": {
"desc": "Set of the individuals recognized as such by their peers including the links that bind them together through certifications",
diff --git a/i18n/locales/es.json b/i18n/locales/es.json
index 85558b4..1843d38 100644
--- a/i18n/locales/es.json
+++ b/i18n/locales/es.json
@@ -74,6 +74,7 @@
"inout": "Entradas y salidas de la red de confianza en los últimos 2 dÃas",
"inpreparation": "En preparación",
"lexique": "Léxico",
+ "limitDate": "Fecha lÃmite",
"membre": {
"calculant": {
"desc": "Miembro usando su clave privada para falsificar bloques gracias a Duniter instalado en un nodo accesible en la red de Internet",
@@ -153,6 +154,7 @@
"parmembre": "Previsiones por miembros",
"title": "Pronósticos"
},
+ "pubkey": "Llave pública",
"recherche": {
"desc": "Introduce el comienzo de un pseudónimo o llave pública",
"title": "Buscar"
@@ -185,6 +187,7 @@
"title": "TeorÃa relativa del dinero (TRD)"
},
"type": "Tipo",
+ "uid": "Identificador único",
"valeur": "Valor",
"wot": {
"desc": "Conjunto de las personas reconocidas como tales por sus pares incluyendo los vÃnculos que las unen a través de certificaciones",
diff --git a/i18n/locales/fr.json b/i18n/locales/fr.json
index 03f2185..ec1178e 100644
--- a/i18n/locales/fr.json
+++ b/i18n/locales/fr.json
@@ -74,6 +74,7 @@
"inout": "Entrées et sorties de la toile de confiance des 2 derniers jours",
"inpreparation": "En préparation",
"lexique": "Lexique",
+ "limitDate": "Date limite",
"membre": {
"calculant": {
"desc": "Membre utilisant sa clé privée pour forger des blocs grâce à Duniter installé sur un noeud accessible sur le réseau Internet",
@@ -153,6 +154,7 @@
"parmembre": "Prévisions par membres",
"title": "Prévisions"
},
+ "pubkey": "Clef publique",
"recherche": {
"desc": "Saisissez le début d'un pseudo ou d'une clé publique",
"title": "Votre recherche"
@@ -185,6 +187,7 @@
"title": "Théorie Relative de la Monnaie (TRM)"
},
"type": "Type",
+ "uid": "Identifiant unique",
"valeur": "Valeur",
"wot": {
"desc": "Ensemble des membres et des certifications qui les relient entre eux",
diff --git a/pages/previsions/futures_sorties.vue b/pages/previsions/futures_sorties.vue
index 333d95f..7af5bcd 100644
--- a/pages/previsions/futures_sorties.vue
+++ b/pages/previsions/futures_sorties.vue
@@ -13,7 +13,6 @@
<MemberList
:members="wwResult['membership']"
:displayPubkey="false"
- :displayHead="false"
:displayOnlyDate="true"
:displayDate="false" />
</div>
@@ -22,7 +21,6 @@
<MemberList
:members="wwResult['outOfCerts']"
:displayPubkey="false"
- :displayHead="false"
:displayOnlyDate="true"
:displayDate="false"
:adhesion="false" />
--
GitLab