This commit is contained in:
syuilo 2018-02-08 14:02:08 +09:00
parent 359855f2cc
commit 50a6bcb693
15 changed files with 73 additions and 65 deletions

View file

@ -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>

View file

@ -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>