feat: add fav/unfav control
persisted in localstorage
This commit is contained in:
@@ -239,9 +239,22 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
Vue.component('strain-card', {
|
Vue.component('strain-card', {
|
||||||
|
data() {
|
||||||
|
const favs = store.get('favorites') || [];
|
||||||
|
|
||||||
|
return {
|
||||||
|
favorite: favs.indexOf(this.strain.id) >= 0,
|
||||||
|
};
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
strain: Object,
|
strain: Object,
|
||||||
},
|
},
|
||||||
|
methods: {
|
||||||
|
toggleFavorite(id) {
|
||||||
|
this.favorite = !this.favorite;
|
||||||
|
emitter.emit('favorite', { id: this.strain.id, isFav: this.favorite });
|
||||||
|
}
|
||||||
|
},
|
||||||
template: `
|
template: `
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<header class="card-header">
|
<header class="card-header">
|
||||||
@@ -259,6 +272,11 @@
|
|||||||
<tag-list title="Conditions" :tags="strain.conditions" />
|
<tag-list title="Conditions" :tags="strain.conditions" />
|
||||||
<tag-list title="Flavors" :tags="strain.flavors" />
|
<tag-list title="Flavors" :tags="strain.flavors" />
|
||||||
</div>
|
</div>
|
||||||
|
<footer class="card-footer">
|
||||||
|
<div class="card-footer-item">
|
||||||
|
<button class="button" :class="{ 'is-success': favorite }" @click.prevent="toggleFavorite(strain.id)">Save</button>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user