diff --git a/assets/css/style.scss b/assets/css/style.scss index 386cb976f810d6c0a9115b0a6e43d6f078a78b12..18e78744a80c6e0d7e2a6a71cba28e66aef1ccdf 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: var(--background-color-secondary); +$table-head-color: var(--text-primary-color); $table-hover-bg: rgba(0, 0, 255, 0.075); // Breadcrumb diff --git a/components/btn/Sort.vue b/components/btn/Sort.vue index 8c061a95128dc72c3cd6655fae28c682ca7c66c6..b07e1be7cd842e9dc81ce4082fd00ebfe4d34b79 100644 --- a/components/btn/Sort.vue +++ b/components/btn/Sort.vue @@ -44,9 +44,6 @@ export default { return ["asc", "desc"].indexOf(value) !== -1 } } - }, - created() { - console.log("created") } } </script> diff --git a/components/certif/List.vue b/components/certif/List.vue index e48244a50d1ed24e1155c71ac2f255747867556e..6caa5369e8332aaf2871ff4a4da7b638d84a88eb 100644 --- a/components/certif/List.vue +++ b/components/certif/List.vue @@ -76,7 +76,7 @@ "> <th scope="row" class="py-1"> <div> - <span v-if="$isFavourite(certif.uid)">★ </span> + <span v-if="$favourites.list.includes(certif.uid)">★ </span> {{ certif.uid }} <BadgeDanger :limitDate="certif.received_certifications.limit" diff --git a/components/member/Card.vue b/components/member/Card.vue index 10bae0633b529aec87e6fb7ef34b0c9f763bcda7..1af4ce2cedb895473c11d17415bf59fe0352e57a 100644 --- a/components/member/Card.vue +++ b/components/member/Card.vue @@ -4,16 +4,16 @@ id="favori" class="btn btn-light position-absolute" :class="{ - add: !isFavorite, - remove: isFavorite + add: !$favourites.list.includes(hash.uid), + remove: $favourites.list.includes(hash.uid) }" - @click="toggleFavourite"></button> + @click="$favourites.toggleFavourite(hash.uid, $event)"></button> <div class="card-body"> <h2 class="card-title text-center mb-4"> {{ hash.uid }} <BadgeStatus :membre="hash" /> </h2> - <BtnClipboard :textContent="this.hash.pubkey" /> + <BtnClipboard :textContent="hash.pubkey" /> <div class="table-responsive"> <table class="table table-sm table-borderless" @@ -136,43 +136,6 @@ export default { }, props: { hash: Object - }, - methods: { - toggleFavourite() { - let $this = this - - $("#favori").tooltip({ - title: function () { - return $this.isFavorite - ? $this.$t("favoris.supprime") - : $this.$t("favoris.enregistre") - }, - html: true, - trigger: "manual" - }) - - $("#favori").tooltip("show") - setTimeout(() => { - $("#favori").tooltip("hide") - }, 1000) - - if (!this.isFavorite) { - this.favourites.push(this.hash.uid) - } else { - this.favourites.splice(this.favourites.indexOf(this.hash.uid), 1) - } - - localStorage.favourites = JSON.stringify(this.favourites) - } - }, - computed: { - isFavorite() { - this.favourites = localStorage.favourites - ? JSON.parse(localStorage.favourites) - : [] - - return this.favourites.includes(this.hash.uid) - } } } </script> diff --git a/components/member/List.vue b/components/member/List.vue index a5e5982172afde28d6cad46d122cbe4315606059..6cf81b645b60a64b3f0c2e9a1db9cadfca85b984 100644 --- a/components/member/List.vue +++ b/components/member/List.vue @@ -32,15 +32,14 @@ :currentSort="currentSort" :currentSortDir="currentSortDir" /> </th> + <th class="position-relative"></th> </tr> </thead> <tbody> - <tr - v-for="member in membersSorted" - :key="member.uid" - @click="redirect(member.hash)"> - <th scope="row"> - <span v-if="$isFavourite(member.uid)">★ </span>{{ member.uid }} + <tr v-for="member in membersSorted" :key="member.uid"> + <th scope="row" @click="redirect(member.hash)"> + <span v-if="$favourites.list.includes(member.uid)">★ </span + >{{ member.uid }} <BadgeDanger :limitDate=" Math.min(member.received_certifications.limit, member.limitDate) @@ -48,16 +47,29 @@ :memberStatus="member.status" /> <BadgeStatus :membre="member" /> </th> - <td class="d-none d-md-table-cell" v-if="displayPubkey"> + <td + class="d-none d-md-table-cell" + v-if="displayPubkey" + @click="redirect(member.hash)"> {{ member.pubkey.substring(0, 10) }} </td> - <td class="d-none d-sm-table-cell" v-if="displayDate"> + <td + class="d-none d-sm-table-cell" + v-if="displayDate" + @click="redirect(member.hash)"> <BadgeDate :date=" Math.min(member.limitDate, member.received_certifications.limit) " - styleDate="long" - class="d-block text-center" /> + styleDate="long" /> + </td> + <td class="py-1 text-center"> + <button + class="btn btn-danger" + v-if="$favourites.list.includes(member.uid)" + @click="$favourites.toggleFavourite(member.uid, $event)"> + X + </button> </td> </tr> </tbody> diff --git a/components/navigation/menu/Sidebar.vue b/components/navigation/menu/Sidebar.vue index e938fdaef6c13f72c0d9f3177e904c30e5629403..8a7866064769a220ae59cec4ed282b8c1d328e9d 100644 --- a/components/navigation/menu/Sidebar.vue +++ b/components/navigation/menu/Sidebar.vue @@ -10,7 +10,7 @@ </nuxt-link> <div class="d-flex text-info justify-content-between align-items-baseline mt-3 mx-2"> - <div class="">v0.06</div> + <div class="">v0.07</div> <div class="small" v-if="countMax"> {{ $t("bloc.title") }} n°<span class="font-weight-bold">{{ countMax.number diff --git a/nuxt.config.js b/nuxt.config.js index 4e615b3c5f641f726e014b191cc3b7c8865a6f61..3309a36ce6064432f8eff507ba977d1af322b529 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -25,7 +25,7 @@ export default { // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins plugins: [ - "~plugins/functions.js", + "~plugins/favourites.js", "~plugins/filters.js", "~plugins/bootstrap.js" ], diff --git a/pages/favoris.vue b/pages/favoris.vue index 5ded360868129da8b88c0afb2244dce54d84fb29..1ff65ba97dfbb80a9b644f6c66e331b86bb596b4 100644 --- a/pages/favoris.vue +++ b/pages/favoris.vue @@ -3,9 +3,8 @@ <h2 class="text-center my-5 font-weight-light"> {{ $t("favoris.title") }} </h2> - <NavigationLoader :isLoading="$apollo.queries.favoris.loading" /> - <div class="row text-center"> + <div class="row"> <div class="col"> <transition name="fade"> <div class="alert alert-danger" v-if="error">{{ error }}</div> @@ -51,9 +50,7 @@ export default { query: FAVORIS, variables() { return { - group: localStorage.favourites - ? JSON.parse(localStorage.favourites) - : [] + group: this.$favourites.list } }, update(data) { diff --git a/pages/previsions/index.vue b/pages/previsions/index.vue index 61f362a2b416e9d0a5019ab2ca1c0d61f3d86639..3461e672d06d11201eb152040e88112656096812 100644 --- a/pages/previsions/index.vue +++ b/pages/previsions/index.vue @@ -60,7 +60,8 @@ ) "> <th scope="row"> - <span v-if="$isFavourite(forecast.member.uid)" + <span + v-if="$favourites.list.includes(forecast.member.uid)" >★ </span > {{ forecast.member.uid }} @@ -117,7 +118,10 @@ v-for="member in forecast.forecasts" :key="member.member.uid"> <div class="mr-3"> - <span v-if="$isFavourite(member.member.uid)" + <span + v-if=" + $favourites.list.includes(member.member.uid) + " >★ </span > {{ member.member.uid }} diff --git a/plugins/favourites.js b/plugins/favourites.js new file mode 100644 index 0000000000000000000000000000000000000000..73187ba0f3604bec6af3edd14eb7a134daa34839 --- /dev/null +++ b/plugins/favourites.js @@ -0,0 +1,42 @@ +import Vue from "vue" + +export default (context, inject) => { + let liste_favoris = localStorage.favourites + ? JSON.parse(localStorage.favourites) + : [] + + let toggleFavourite = (uid, e) => { + $(e.target).tooltip({ + title: function () { + return context.$favourites.list.includes(uid) + ? context.app.i18n.t("favoris.supprime") + : context.app.i18n.t("favoris.enregistre") + }, + html: true, + trigger: "manual" + }) + + $(e.target).tooltip("show") + setTimeout(() => { + $(e.target).tooltip("hide") + }, 600) + + if (!context.$favourites.list.includes(uid)) { + context.$favourites.list.push(uid) + } else { + context.$favourites.list = context.$favourites.list.filter( + (item) => item !== uid + ) + } + + localStorage.favourites = JSON.stringify(context.$favourites.list) + } + + inject( + "favourites", + Vue.observable({ + list: liste_favoris, + toggleFavourite: toggleFavourite + }) + ) +} diff --git a/plugins/functions.js b/plugins/functions.js deleted file mode 100644 index 0c5efdea5615beb38881aca10b874127d11d7ab6..0000000000000000000000000000000000000000 --- a/plugins/functions.js +++ /dev/null @@ -1,13 +0,0 @@ -export default (context, inject) => { - const isFavourite = (uid) => { - if (!localStorage.favourites) { - return false - } else if (JSON.parse(localStorage.favourites).includes(uid)) { - return true - } - return false - } - inject("isFavourite", isFavourite) - // For Nuxt <= 2.12, also add 👇 - // context.$hello = hello -}