butter/keanu-weblite
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Resolve "Polling: Updated poll admin UX"

Browse source
This commit is contained in:
N Pex 2022-06-08 18:53:50 +00:00
parent b1d11be82b
commit c01da6f420
11 changed files with 1531 additions and 1111 deletions
Download patch file Download diff file Expand all files Collapse all files

70
src/components/messages/MessageOutgoingPoll.vue
View file

@ -31,8 +31,8 @@
:class="{
'poll-answer': true,
selected: !userHasVoted && answer.id == pollTentativeAnswer,
result: userHasVoted || pollIsClosed,
winner: answer.winner,
result: userHasVoted || pollIsClosed || pollViewResults,
winner: answer.winner && (userHasVoted || pollIsClosed || pollViewResults),
}"
ma-0
pa-0
@ -42,41 +42,55 @@
><v-img class="poll-check-icon" src="@/assets/icons/ic_check.svg"
/></v-col>
<v-col
v-if="pollIsClosed || (pollIsDisclosed && userHasVoted) || pollIsAdmin"
v-if="
pollIsClosed || (pollIsDisclosed && userHasVoted) || (pollIsAdmin && (userHasVoted || pollViewResults))
"
cols="auto"
class="ma-0 pa-0 poll-answer-num-votes"
>{{ answer.percentage }}%</v-col
>
<div v-if="pollIsClosed || (pollIsDisclosed && userHasVoted) || pollIsAdmin" class="poll-percent-indicator">
<div
v-if="
pollIsClosed || (pollIsDisclosed && userHasVoted) || (pollIsAdmin && (userHasVoted || pollViewResults))
"
class="poll-percent-indicator"
>
<div class="bar" :style="{ width: `${answer.percentage}%` }"></div>
</div>
</v-row>
<v-row class="poll-status">
<v-col cols="auto" class="ma-0 pa-0 poll-status-title">
<v-row v-if="pollTentativeAnswer" class="pa-0 poll-status" justify="center">
<v-col class="ma-0 pa-0" cols="auto"
><div class="poll-submit clickable" @click.stop="pollAnswerSubmit">
{{ $t("poll_create.poll_submit") }}
</div>
</v-col>
</v-row>
<v-row v-else class="pa-0 poll-status">
<v-col class="ma-0 pa-0 poll-status-title">
{{ $t("poll_create.num_answered", { count: pollNumAnswers }) }}
</v-col>
<!-- <v-col cols="auto" class="ma-0 pa-0 poll-status-title">{{
pollIsClosed
? $t("poll_create.poll_status_closed")
: pollIsDisclosed
? userHasVoted
? $t("poll_create.poll_status_open")
: $t("poll_create.poll_status_open_not_voted")
: $t("poll_create.poll_status_disclosed")
}}</v-col> -->
<v-col
cols="auto"
class="ma-0 pa-0 poll-status-close clickable"
v-if="!pollIsClosed && userCanClosePoll"
@click.stop="pollClose"
>{{ $t("poll_create.close_poll") }}</v-col
>
</v-row>
<v-row v-if="pollTentativeAnswer" justify="center">
<v-col cols="auto" class="ma-0 pa-0 poll-submit">
<v-btn @click.stop="pollAnswerSubmit">
{{ $t("poll_create.poll_submit") }}
</v-btn>
<v-col cols="auto" class="ma-0 pa-0">
<div
:class="{ 'poll-disclose': true, clickable: true, selected: pollViewResults, 'mb-4': true }"
v-if="!pollIsClosed && userCanClosePoll && !userHasVoted"
>
{{ $t("poll_create.view_results") }}
<div class="poll-disclose-track" @click.stop="pollViewResults = !pollViewResults">
<div class="poll-disclose-knob"></div>
</div>
</div>
<div
class="poll-status-close clickable"
v-if="userCanClosePoll && (userHasVoted || pollViewResults) && !pollIsClosed"
@click.stop="pollClose"
>
{{ $t("poll_create.close_poll") }}
</div>
<div class="poll-status-closed clickable" v-else-if="pollIsAdmin && pollIsClosed" @click.stop="pollClose">
<img class="icon" src="@/assets/icons/ic_check_small.svg" />
{{ $t("poll_create.poll_status_closed") }}
</div>
</v-col>
</v-row>
</v-container>