Added extended heart button to actor component, fixed movie stash query.

This commit is contained in:
DebaucheryLibrarian 2021-03-21 03:58:13 +01:00
parent 9ff70e5578
commit 7ac64c57ae
4 changed files with 31 additions and 37 deletions

View File

@ -34,18 +34,11 @@
class="header-social" class="header-social"
/> />
<Icon <StashButton
v-show="me && stashed" :stashed-by="stashedBy"
icon="heart7" class="actor-stash light"
class="stash stashed noselect" @stash="(stash) => stashActor(stash)"
@click="unstashActor" @unstash="(stash) => unstashActor(stash)"
/>
<Icon
v-show="me && !stashed"
icon="heart8"
class="stash unstashed noselect"
@click="stashActor"
/> />
</div> </div>
@ -390,6 +383,7 @@ import Expand from '../expand/expand.vue';
import Scroll from '../scroll/scroll.vue'; import Scroll from '../scroll/scroll.vue';
import Gender from './gender.vue'; import Gender from './gender.vue';
import Social from './social.vue'; import Social from './social.vue';
import StashButton from '../stashes/button.vue';
async function fetchActor(scroll = true) { async function fetchActor(scroll = true) {
const { actor, releases, totalCount } = await this.$store.dispatch('fetchActorById', { const { actor, releases, totalCount } = await this.$store.dispatch('fetchActorById', {
@ -402,37 +396,25 @@ async function fetchActor(scroll = true) {
this.actor = actor; this.actor = actor;
this.releases = releases; this.releases = releases;
this.totalCount = totalCount; this.totalCount = totalCount;
this.stashed = this.actor.isStashed; this.stashedBy = actor.stashes;
if (this.$refs.filter && scroll) { if (this.$refs.filter && scroll) {
this.$refs.filter.$el.scrollIntoView(); this.$refs.filter.$el.scrollIntoView();
} }
} }
async function stashActor() { async function stashActor(stashId) {
this.stashed = true; this.stashedBy = await this.$store.dispatch('stashActor', {
try {
this.$store.dispatch('stashActor', {
actorId: this.actor.id, actorId: this.actor.id,
stashId: this.$store.getters.favorites.id, stashId,
}); });
} catch (error) {
this.stashed = false;
}
} }
async function unstashActor() { async function unstashActor(stashId) {
this.stashed = false; this.stashedBy = await this.$store.dispatch('unstashActor', {
try {
this.$store.dispatch('unstashActor', {
actorId: this.actor.id, actorId: this.actor.id,
stashId: this.$store.getters.favorites.id, stashId,
}); });
} catch (error) {
this.stashed = true;
}
} }
function me() { function me() {
@ -472,6 +454,7 @@ export default {
Releases, Releases,
Gender, Gender,
Social, Social,
StashButton,
}, },
data() { data() {
return { return {
@ -483,6 +466,7 @@ export default {
bioExpanded: false, bioExpanded: false,
photosExpanded: false, photosExpanded: false,
stashed: false, stashed: false,
stashedBy: [],
}; };
}, },
computed: { computed: {
@ -521,6 +505,10 @@ export default {
background: var(--profile); background: var(--profile);
} }
.actor-stash {
margin: 0 1rem 0 0;
}
.header-name { .header-name {
padding: .5rem 1rem; padding: .5rem 1rem;
margin: 0; margin: 0;

View File

@ -1,5 +1,5 @@
<template> <template>
<span> <span class="stash-container">
<Tooltip class="stash-trigger"> <Tooltip class="stash-trigger">
<Icon <Icon
v-show="me" v-show="me"
@ -73,10 +73,14 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.stash-container.light .icon {
fill: var(--lighten);
}
.stash.icon { .stash.icon {
width: 1.5rem; width: 1.5rem;
height: 1.5rem; height: 1.5rem;
padding: 0 .75rem; padding: 0 .5rem;
fill: var(--shadow); fill: var(--shadow);
&.stashed { &.stashed {

View File

@ -260,6 +260,7 @@ function initActorActions(store, router) {
id id
name name
slug slug
primary
} }
} }
} }

View File

@ -273,6 +273,7 @@ function initReleasesActions(store, router) {
id id
name name
slug slug
primary
} }
} }
} }