diff --git a/assets/css/style.scss b/assets/css/style.scss
index 4dfd2f2bc2d8dd9a8512111d67e313ad028944ef..4d6868ae25d5a7db758ec72a2dbe8b2b25b68bd8 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -14,6 +14,7 @@ $body-color: var(--text-primary-color);
$table-bg: var(--background-color-primary);
$table-color: var(--text-primary-color);
$table-head-bg: red;
+$table-hover-bg: rgba(0, 0, 255, 0.075);
// Breadcrumb
$breadcrumb-bg: var(--background-color-secondary);
diff --git a/components/badge/Status.vue b/components/badge/Status.vue
index b9fa3645f0a28c1395a302b261995a471eb10a49..8585e09260c4fd24d69bccc3377f0fa70b823c55 100644
--- a/components/badge/Status.vue
+++ b/components/badge/Status.vue
@@ -1,30 +1,38 @@
<template>
<small>
- <span class="badge badge-secondary"
- :class="{
- 'badge-danger' : statut == 'REVOKED',
- 'badge-success' : statut == 'MEMBER',
- 'badge-info' : statut == 'NEWCOMER',
- 'badge-warning' : statut == 'MISSING'
- }">{{ this.statut | formatStatus }}</span>
+ <span class="badge"
+ :class="'badge-'+ this.displayStatus(membre).class">
+ {{ this.displayStatus(membre).str }}
+ </span>
</small>
</template>
<script>
-const statuses = [
- 'NEWCOMER',
- 'MISSING',
- 'MEMBER',
- 'REVOKED'
-]
-
export default {
props: {
- statut: {
- type: String,
- required: true,
- validator: function (value) {
- return statuses.indexOf(value) !== -1
+ membre: {
+ type: Object,
+ required: true
+ }
+ },
+ methods: {
+ displayStatus: function(member){
+ console.log(member.limitDate)
+ switch (member.status) {
+ case 'NEWCOMER':
+ return {str: 'Futur membre',class: 'info'}
+ case 'MISSING':
+ return {str: 'Adhésion perdue',class: 'danger'}
+ case 'MEMBER':
+ if (this.$options.filters.dateStatus(member.limitDate) == 'warning') {
+ return {str: 'Adhésion à renouveler',class: 'warning'}
+ } else {
+ return {str: 'Membre',class: 'success'}
+ }
+ case 'REVOKED':
+ return {str: 'Membre revoqué',class: 'secondary'}
+ default:
+ return 'N/A'
}
}
}
diff --git a/components/certif/List.vue b/components/certif/List.vue
index c2f9e59cbe61df43629b44f3204486772ab49fc4..ac9c293ec7bc3cd97288ae780641306174fb544f 100644
--- a/components/certif/List.vue
+++ b/components/certif/List.vue
@@ -8,7 +8,7 @@
:key="getNeighbor(certif).uid">
<div>
{{ getNeighbor(certif).uid }}
- <BadgeStatus :statut="getNeighbor(certif).status" />
+ <BadgeStatus :membre="getNeighbor(certif)" />
</div>
<small class="text-muted">Expire le {{ certif.expires_on | formatDate }}</small>
</NuxtLink>
diff --git a/components/member/Card.vue b/components/member/Card.vue
index ab70e666b5e5a36b98b73d9a9884f9430bd8e86b..f38ffb375b1b104595a75437459e8ca5ea3586f7 100644
--- a/components/member/Card.vue
+++ b/components/member/Card.vue
@@ -3,14 +3,14 @@
<div class="card-body">
<h2 class="card-title">
{{ hash.uid }}
- <BadgeStatus :statut="hash.status" />
+ <BadgeStatus :membre="hash" />
</h2>
<div class="card-subtitle mb-2 text-muted">{{ hash.pubkey }}</div>
<table class="table table-sm table-borderless" v-if="hash.status != 'REVOKED'">
<tbody>
<tr v-if="hash.status == 'MEMBER'">
<th scope="row">Référent :</th>
- <td :class="{'list-group-item-success': isReferent, 'list-group-item-danger': !isReferent}">{{ isReferent ? 'Oui' : 'Non' }}</td>
+ <td :class="{'list-group-item-success': isReferent, 'list-group-item-warning': !isReferent}">{{ isReferent ? 'Oui' : 'Non' }}</td>
</tr>
<tr v-if="hash.status != 'NEWCOMER'">
<th scope="row">Qualité :</th>
diff --git a/layouts/default.vue b/layouts/default.vue
index 85cdfec15ef15df69519463a807474f4ae3f18ed..26bacf504c43b598545fc8d82af01d44e61f3a29 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,7 +1,7 @@
<template>
<div class="app">
<NavigationBar :breadcrumb="breadcrumb" :menus="menus" />
- <Nuxt keep-alive />
+ <Nuxt />
</div>
</template>
diff --git a/pages/hash/_hash.vue b/pages/hash/_hash.vue
index cbbb41b9dbbcf49e8d6bd2c0e15b276f390d70c1..8f84c30576bb8b03273f315afd039a4e98d2c6d5 100644
--- a/pages/hash/_hash.vue
+++ b/pages/hash/_hash.vue
@@ -7,9 +7,14 @@
<MemberCard :hash="idFromHash" />
</div>
</div>
- <div class="row mt-3" v-if="idFromHash.status != 'REVOKED' && idFromHash.status != 'NEWCOMER'">
+ <div class="row mt-3" v-if="idFromHash.status != 'REVOKED' && idFromHash.status != 'NEWCOMER'">
<div class="col-12 col-md-6 mb-3">
- <h3>Certifications reçues</h3>
+ <h3>Certifications reçues
+ <span v-if="($options.filters.dateStatus(idFromHash.received_certifications.limit) == 'warning')">âš
+ <span class="sr-only" v-if="idFromHash.status == 'MEMBER'">Bientôt en manque de certifications</span>
+ <span class="sr-only" v-else>En manque de certifications</span>
+ </span>
+ </h3>
<CertifList :certifs="idFromHash.received_certifications.certifications" type="recieved" />
</div>
<div class="col-12 col-md-6">
diff --git a/pages/membres.vue b/pages/membres.vue
index 296e5e5672b53713e2fec407d1fc140aebb309be..31dad846f837ad67cec7132c9e966f29120bae6f 100644
--- a/pages/membres.vue
+++ b/pages/membres.vue
@@ -12,26 +12,18 @@
<div class="row" v-if="idSearch && !$apollo.queries.idSearch.loading && param.length > 2">
<div class="col-8 m-auto">
<div class="table-responsive">
- <table class="table striped">
+ <table class="table table-striped table-hover">
<thead>
<tr>
<th scope="col">UID</th>
<th scope="col" class="d-none d-xl-table-cell">PUBKEY</th>
- <th scope="col" class="d-none d-sm-table-cell">STATUT</th>
</tr>
</thead>
<tbody>
<tr v-for="member in idSearch.ids" :key="member.uid"
- @click="redirect('/hash/' + member.hash)"
- :class="{
- 'table-danger' : member.status == 'REVOKED',
- 'table-success' : member.status == 'MEMBER',
- 'table-warning' : member.status == 'MISSING',
- 'table-info' : member.status == 'NEWCOMER'
- }">
- <th scope="row">{{ member.uid }}</th>
+ @click="redirect('/hash/' + member.hash)">
+ <th scope="row">{{ member.uid }} <BadgeStatus :membre="member" /></th>
<td class="d-none d-xl-table-cell">{{ member.pubkey }}</td>
- <td class="d-none d-sm-table-cell">{{ member.status | formatStatus }}</td>
</tr>
</tbody>
</table>
@@ -79,6 +71,7 @@ export default {
uid
status
hash
+ limitDate
}
}
} `,
@@ -95,7 +88,7 @@ export default {
<style lang="sass" scoped>
// CSS Lié au composant
-.table.striped tbody
+.table.table-striped tbody
color: var(--dark)
tr
opacity: .9
diff --git a/plugins/filters.js b/plugins/filters.js
index c491b1cad8244d7930e6c9c151e90f5acef8b78a..6e78a2e7d3daa39cfaf511775c713c31da3837a9 100644
--- a/plugins/filters.js
+++ b/plugins/filters.js
@@ -11,26 +11,9 @@ Vue.filter('formatDate', (val) => {
Vue.filter('dateStatus', (val) => {
const diff = val - dayjs().unix()
switch (true) {
- case diff<2592000:
- return 'danger'
case diff<5184000:
return 'warning'
case diff>=5184000:
return 'success'
}
-})
-
-Vue.filter('formatStatus', (val) => {
- switch (val) {
- case 'NEWCOMER':
- return 'Futur membre'
- case 'MISSING':
- return 'Adhésion perdue'
- case 'MEMBER':
- return 'Membre'
- case 'REVOKED':
- return 'Membre revoqué'
- default:
- return 'N/A'
- }
})
\ No newline at end of file