wip
This commit is contained in:
parent
359855f2cc
commit
50a6bcb693
15 changed files with 73 additions and 65 deletions
|
|
@ -1,6 +1,7 @@
|
|||
<mk-poll data-is-voted={ isVoted }>
|
||||
<template>
|
||||
<div :data-is-voted="isVoted">
|
||||
<ul>
|
||||
<li each={ poll.choices } @click="vote.bind(null, id)" class={ voted: voted } title={ !parent.isVoted ? '%i18n:common.tags.mk-poll.vote-to%'.replace('{}', text) : '' }>
|
||||
<li v-for="choice in poll.choices" @click="vote.bind(choice.id)" :class="{ voted: choice.voted }" title={ !parent.isVoted ? '%i18n:common.tags.mk-poll.vote-to%'.replace('{}', text) : '' }>
|
||||
<div class="backdrop" style={ 'width:' + (parent.result ? (votes / parent.total * 100) : 0) + '%' }></div>
|
||||
<span>
|
||||
<virtual v-if="is_voted">%fa:check%</virtual>
|
||||
|
|
@ -15,6 +16,51 @@
|
|||
<a v-if="!isVoted" @click="toggleResult">{ result ? '%i18n:common.tags.mk-poll.vote%' : '%i18n:common.tags.mk-poll.show-result%' }</a>
|
||||
<span v-if="isVoted">%i18n:common.tags.mk-poll.voted%</span>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="typescript">
|
||||
this.mixin('api');
|
||||
|
||||
this.init = post => {
|
||||
this.post = post;
|
||||
this.poll = this.post.poll;
|
||||
this.total = this.poll.choices.reduce((a, b) => a + b.votes, 0);
|
||||
this.isVoted = this.poll.choices.some(c => c.is_voted);
|
||||
this.result = this.isVoted;
|
||||
this.update();
|
||||
};
|
||||
|
||||
this.init(this.opts.post);
|
||||
|
||||
this.toggleResult = () => {
|
||||
this.result = !this.result;
|
||||
};
|
||||
|
||||
this.vote = id => {
|
||||
if (this.poll.choices.some(c => c.is_voted)) return;
|
||||
this.api('posts/polls/vote', {
|
||||
post_id: this.post.id,
|
||||
choice: id
|
||||
}).then(() => {
|
||||
this.poll.choices.forEach(c => {
|
||||
if (c.id == id) {
|
||||
c.votes++;
|
||||
c.is_voted = true;
|
||||
}
|
||||
});
|
||||
this.update({
|
||||
poll: this.poll,
|
||||
isVoted: true,
|
||||
result: true,
|
||||
total: this.total + 1
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<mk-poll data-is-voted={ isVoted }>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
:scope
|
||||
display block
|
||||
|
|
@ -67,43 +113,5 @@
|
|||
background transparent
|
||||
|
||||
</style>
|
||||
<script lang="typescript">
|
||||
this.mixin('api');
|
||||
|
||||
this.init = post => {
|
||||
this.post = post;
|
||||
this.poll = this.post.poll;
|
||||
this.total = this.poll.choices.reduce((a, b) => a + b.votes, 0);
|
||||
this.isVoted = this.poll.choices.some(c => c.is_voted);
|
||||
this.result = this.isVoted;
|
||||
this.update();
|
||||
};
|
||||
|
||||
this.init(this.opts.post);
|
||||
|
||||
this.toggleResult = () => {
|
||||
this.result = !this.result;
|
||||
};
|
||||
|
||||
this.vote = id => {
|
||||
if (this.poll.choices.some(c => c.is_voted)) return;
|
||||
this.api('posts/polls/vote', {
|
||||
post_id: this.post.id,
|
||||
choice: id
|
||||
}).then(() => {
|
||||
this.poll.choices.forEach(c => {
|
||||
if (c.id == id) {
|
||||
c.votes++;
|
||||
c.is_voted = true;
|
||||
}
|
||||
});
|
||||
this.update({
|
||||
poll: this.poll,
|
||||
isVoted: true,
|
||||
result: true,
|
||||
total: this.total + 1
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</mk-poll>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<mk-signin>
|
||||
<form class={ signing: signing } onsubmit={ onsubmit }>
|
||||
<form :class="{ signing: signing }" onsubmit={ onsubmit }>
|
||||
<label class="user-name">
|
||||
<input ref="username" type="text" pattern="^[a-zA-Z0-9-]+$" placeholder="%i18n:common.tags.mk-signin.username%" autofocus="autofocus" required="required" oninput={ oninput }/>%fa:at%
|
||||
</label>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue