Added shelf template shared between shelf and post page.

This commit is contained in:
2023-06-25 20:43:42 +02:00
parent f3c8718fb2
commit 041b502776
6 changed files with 179 additions and 104 deletions

View File

@@ -5,19 +5,19 @@
class="vote bump"
:class="{ active: hasBump }"
title="Bump"
@click="vote(1)"
@click="submitVote(1)"
>+</div>
<div
class="tally"
:title="`${post.votes.total} ${post.votes.total === 1 ? 'vote' : 'votes'}`"
:title="`${post.vote.total} ${post.vote.total === 1 ? 'vote' : 'votes'}`"
>{{ tally }}</div>
<div
class="vote sink"
:class="{ active: hasSink }"
title="Sink"
@click="vote(-1)"
@click="submitVote(-1)"
>-</div>
</div>
@@ -102,12 +102,12 @@ const props = defineProps({
},
});
const tally = ref(props.post.votes.tally);
const hasBump = ref(props.post.votes.bump);
const hasSink = ref(props.post.votes.sink);
const tally = ref(props.post.vote.tally);
const hasBump = ref(props.post.vote.bump);
const hasSink = ref(props.post.vote.sink);
const voting = ref(false);
async function vote(value) {
async function submitVote(value) {
if (!me || voting.value) {
return;
}
@@ -115,11 +115,11 @@ async function vote(value) {
voting.value = true;
const undo = (value > 0 && hasBump.value) || (value < 0 && hasSink.value);
const votes = await api.post(`/posts/${props.post.id}/votes`, { value: undo ? 0 : value });
const vote = await api.post(`/posts/${props.post.id}/votes`, { value: undo ? 0 : value });
tally.value = votes.tally;
hasBump.value = votes.bump;
hasSink.value = votes.sink;
tally.value = vote.tally;
hasBump.value = vote.bump;
hasSink.value = vote.sink;
voting.value = false;
}
@@ -178,7 +178,7 @@ async function vote(value) {
}
.votes {
width: 2rem;
width: 3rem;
display: flex;
flex-direction: column;
align-items: center;