add warning symbol ofr ids that will lose certs

assets/css/style.scss

@@ -41,4 +41,8 @@ $close-font-weight: 500;
 .card-subtitle {
     font-style: italic;
     font-size: 90%;
+}
+
+.table-hover {
+    cursor: pointer;
 }
\ No newline at end of file

components/Graph.vue

@@ -82,8 +82,4 @@ export default {
         }
     }
 }
-</script>
-
-<style>
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

components/badge/CertifStatus.vue

+<template>
+    <span class="font-weight-normal" :class="classWarning" :title="textWarning" v-if="($options.filters.dateStatus(limitDate) != 'success') && (['MEMBER', 'MISSING'].includes(memberStatus))">⚠
+        <span class="sr-only">{{ textWarning }}</span>
+    </span>
+</template>
+
+<script>
+export default {
+    props: {
+        limitDate : {
+            type: Number,
+            default: 0
+        },
+        memberStatus : String
+    },
+    computed: {
+        classWarning: function() {
+            return {
+                'text-danger' : this.$options.filters.dateStatus(this.limitDate) == 'danger',
+                'text-warning' : this.$options.filters.dateStatus(this.limitDate) == 'warning'
+            }
+        },
+        textWarning: function() {
+            return (this.$options.filters.dateStatus(this.limitDate) == 'danger') ? 'En manque de certifications' : 'Bientôt en manque de certifications'
+        }
+    }
+}
+</script>
\ No newline at end of file

components/badge/Quality.vue

@@ -19,8 +19,4 @@ export default {
         }
     }
 }
-</script>
-
-<style>
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

components/badge/Status.vue

@@ -36,8 +36,4 @@ export default {
         }
     }
 }
-</script>
-
-<style>
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

components/certif/List.vue

 <template>
-<div class="list-group">
-    <NuxtLink
-      :to="'/membres/'+getNeighbor(certif).hash"
-      class="list-group-item list-group-item-action d-lg-flex justify-content-between align-items-center"
-      :class="'list-group-item-'+ $options.filters.dateStatus(certif.expires_on)"
-      v-for="certif in certifsTriees"
-      :key="getNeighbor(certif).uid">
-      <div>
-        {{ getNeighbor(certif).uid }}
-        <BadgeStatus :membre="getNeighbor(certif)" />
-        <BadgeQuality :quality="getNeighbor(certif).quality.ratio" />
-      </div>
-    <small>Expire le {{ certif.expires_on | formatDate }}</small>
-    </NuxtLink>
-</div>
+    <div class="table-responsive">
+        <table class="table table-striped table-hover">
+            <tbody>
+                <tr v-for="certif in certifsTriees" :key="getNeighbor(certif).uid"
+                    @click="$router.push({ path: '/membres/' + getNeighbor(certif).hash })">
+                    <th scope="row">
+                        {{ getNeighbor(certif).uid }}
+                        <BadgeCertifStatus :limitDate="getNeighbor(certif).received_certifications.limit" :memberStatus="getNeighbor(certif).status" />
+                        <BadgeStatus :membre="getNeighbor(certif)" />
+                        <BadgeQuality :quality="getNeighbor(certif).quality.ratio" />
+                    </th>
+                    <td class="text-right">
+                        <small><span class="badge" :class="'badge-'+ $options.filters.dateStatus(certif.expires_on)">Expire le {{ certif.expires_on | formatDate }}</span></small>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
 </template>
 
 <script>
@@ -43,8 +46,4 @@ export default {
         }
     }
 }
-</script>
-
-<style>
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

pages/index.vue

@@ -36,9 +36,4 @@ export default {
     $nuxt.$emit('changeRoute',this.breadcrumb)
   }
 }
-</script>
-
-<style lang="sass" scoped>
-// CSS Lié au composant
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

pages/membres/_hash.vue

@@ -10,10 +10,7 @@
       <div class="row mt-3" v-if="idFromHash.status != 'REVOKED'">
         <div class="col-12 col-md-6 mb-3">
           <h3>Certifications reçues 
-            <span :class="classWarning" v-if="(($options.filters.dateStatus(idFromHash.received_certifications.limit) == 'warning') || (!idFromHash.received_certifications.limit)) &&  idFromHash.status != 'NEWCOMER'">⚠
-              <span class="sr-only" v-if="$options.filters.dateStatus(idFromHash.received_certifications.limit) == 'danger'">En manque de certifications</span>
-              <span class="sr-only" v-else>Bientôt en manque de certifications</span>
-            </span>
+            <BadgeCertifStatus :limitDate="idFromHash.received_certifications.limit" :memberStatus="idFromHash.status" />
           </h3>
           <CertifList :certifs="idFromHash.received_certifications.certifications" type="recieved" />
         </div>
@@ -71,7 +68,6 @@ export default {
               dist_ok
             }
             received_certifications {
-              limit
               certifications {
                 from {
                   ...memberAttributes
@@ -94,6 +90,9 @@ export default {
           quality {
             ratio
           }
+          received_certifications {
+            limit
+          }
         }
       `,
       variables() {
@@ -121,8 +120,4 @@ export default {
     }
   }
 };
-</script>
-
-<style lang="sass">
-
-</style>
+</script>
\ No newline at end of file

pages/membres/index.vue

@@ -22,7 +22,11 @@
           <tbody>
             <tr v-for="member in idSearch.ids" :key="member.uid"
               @click="redirect('/membres/' + member.hash)">
-              <th scope="row">{{ member.uid }} <BadgeStatus :membre="member" /></th>
+              <th scope="row">
+                {{ member.uid }}
+                <BadgeCertifStatus :limitDate="member.received_certifications.limit" :memberStatus="member.status" />
+                <BadgeStatus :membre="member" />
+              </th>
               <td class="d-none d-xl-table-cell">{{ member.pubkey }}</td>
             </tr>
           </tbody>
@@ -73,6 +77,9 @@ export default {
             status
             hash
             limitDate
+            received_certifications {
+              limit
+            }
           }
         }
       } `,
@@ -89,11 +96,4 @@ export default {
     }
   }
 }
-</script>
-
-<style lang="sass" scoped>
-// CSS Lié au composant
-.table.table-striped tbody
-  tr
-    cursor: pointer
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file