aboutsummaryrefslogtreecommitdiff
path: root/src/components/poll
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/poll')
-rw-r--r--src/components/poll/poll.vue39
-rw-r--r--src/components/poll/poll_form.vue65
2 files changed, 73 insertions, 31 deletions
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index bb67101a..0fc81b46 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -1,24 +1,33 @@
<template>
- <div class="poll" v-bind:class="containerClass">
+ <div
+ class="poll"
+ :class="containerClass"
+ >
<div
- class="poll-option"
v-for="(option, index) in options"
:key="index"
+ class="poll-option"
>
- <div v-if="showResults" :title="resultTitle(option)" class="option-result">
+ <div
+ v-if="showResults"
+ :title="resultTitle(option)"
+ class="option-result"
+ >
<div class="option-result-label">
<span class="result-percentage">
- {{percentageForOption(option.votes_count)}}%
+ {{ percentageForOption(option.votes_count) }}%
</span>
- <span>{{option.title}}</span>
+ <span>{{ option.title }}</span>
</div>
<div
class="result-fill"
:style="{ 'width': `${percentageForOption(option.votes_count)}%` }"
- >
- </div>
+ />
</div>
- <div v-else @click="activateOption(index)">
+ <div
+ v-else
+ @click="activateOption(index)"
+ >
<input
v-if="poll.multiple"
type="checkbox"
@@ -32,7 +41,7 @@
:value="index"
>
<label class="option-vote">
- <div>{{option.title}}</div>
+ <div>{{ option.title }}</div>
</label>
</div>
</div>
@@ -41,16 +50,20 @@
v-if="!showResults"
class="btn btn-default poll-vote-button"
type="button"
- @click="vote"
:disabled="isDisabled"
+ @click="vote"
>
- {{$t('polls.vote')}}
+ {{ $t('polls.vote') }}
</button>
<div class="total">
- {{totalVotesCount}} {{ $t("polls.votes") }}&nbsp;·&nbsp;
+ {{ totalVotesCount }} {{ $t("polls.votes") }}&nbsp;·&nbsp;
</div>
<i18n :path="expired ? 'polls.expired' : 'polls.expires_in'">
- <Timeago :time="this.expiresAt" :auto-update="60" :now-threshold="0" />
+ <Timeago
+ :time="this.expiresAt"
+ :auto-update="60"
+ :now-threshold="0"
+ />
</i18n>
</div>
</div>
diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue
index 0bc6006d..2bd3d058 100644
--- a/src/components/poll/poll_form.vue
+++ b/src/components/poll/poll_form.vue
@@ -1,20 +1,33 @@
<template>
- <div class="poll-form" v-if="visible">
- <div class="poll-option" v-for="(option, index) in options" :key="index">
+ <div
+ v-if="visible"
+ class="poll-form"
+ >
+ <div
+ v-for="(option, index) in options"
+ :key="index"
+ class="poll-option"
+ >
<div class="input-container">
<input
+ :id="`poll-${index}`"
+ v-model="options[index]"
class="poll-option-input"
type="text"
:placeholder="$t('polls.option')"
:maxlength="maxLength"
- :id="`poll-${index}`"
- v-model="options[index]"
@change="updatePollToParent"
@keydown.enter.stop.prevent="nextOption(index)"
>
</div>
- <div class="icon-container" v-if="options.length > 2">
- <i class="icon-cancel" @click="deleteOption(index)"></i>
+ <div
+ v-if="options.length > 2"
+ class="icon-container"
+ >
+ <i
+ class="icon-cancel"
+ @click="deleteOption(index)"
+ />
</div>
</div>
<a
@@ -26,34 +39,50 @@
{{ $t("polls.add_option") }}
</a>
<div class="poll-type-expiry">
- <div class="poll-type" :title="$t('polls.type')">
- <label for="poll-type-selector" class="select">
- <select class="select" v-model="pollType" @change="updatePollToParent">
- <option value="single">{{$t('polls.single_choice')}}</option>
- <option value="multiple">{{$t('polls.multiple_choices')}}</option>
+ <div
+ class="poll-type"
+ :title="$t('polls.type')"
+ >
+ <label
+ for="poll-type-selector"
+ class="select"
+ >
+ <select
+ v-model="pollType"
+ class="select"
+ @change="updatePollToParent"
+ >
+ <option value="single">{{ $t('polls.single_choice') }}</option>
+ <option value="multiple">{{ $t('polls.multiple_choices') }}</option>
</select>
- <i class="icon-down-open"/>
+ <i class="icon-down-open" />
</label>
</div>
- <div class="poll-expiry" :title="$t('polls.expiry')">
- <input
+ <div
+ class="poll-expiry"
+ :title="$t('polls.expiry')"
+ >
+ <input
+ v-model="expiryAmount"
type="number"
class="expiry-amount hide-number-spinner"
:min="minExpirationInCurrentUnit"
:max="maxExpirationInCurrentUnit"
- v-model="expiryAmount"
@change="expiryAmountChange"
>
<label class="expiry-unit select">
- <select
+ <select
v-model="expiryUnit"
@change="expiryAmountChange"
>
- <option v-for="unit in expiryUnits" :value="unit">
+ <option
+ v-for="unit in expiryUnits"
+ :value="unit"
+ >
{{ $t(`time.${unit}_short`, ['']) }}
</option>
</select>
- <i class="icon-down-open"/>
+ <i class="icon-down-open" />
</label>
</div>
</div>