Skip to content

Commit

Permalink
feat(ux): integration api
Browse files Browse the repository at this point in the history
  • Loading branch information
@evgenibir
evgenibir committed Oct 12, 2023
1 parent 0402feb commit c046c79
Show file tree
Hide file tree
Showing 4 changed files with 166 additions and 217 deletions.
74 changes: 48 additions & 26 deletions src/pages/dho/Election.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,27 @@ import formatNumber from '~/utils/formatNumber'
import I18n from '~/utils/i18n'
import { dateToStringShort } from '~/utils/TimeUtils.js'
import { mapGetters } from 'vuex'
import gql from 'graphql-tag'
const ELECTIONS_DATA = `
getDao(docId: $daoId) {
docId
ueElection {
docId
details_endDate_t
ueRound {
docId
}
ueStartrnd {
ueGroupLnk {
ueRdMemberAggregate {
count
}
}
}
}
}
`
export default {
name: 'election',
Expand All @@ -12,40 +33,37 @@ export default {
Widget: () => import('~/components/common/widget.vue')
},
apollo: {
elections: {
query: gql`query electionsQuery ($daoId: String!) { ${ELECTIONS_DATA} }`,
update: data => data.getDao.ueElection.map(election => {
return {
endDate: election.details_endDate_t,
rounds: election.ueRound.length,
participants: election.ueStartrnd[0].ueGroupLnk.reduce((sum, group) => sum + group.ueRdMemberAggregate.count, 0),
id: election.docId
}
}),
variables () {
return {
daoId: this.selectedDao.docId
}
},
skip () { return !this.selectedDao || !this.selectedDao.docId }
}
},
data () {
return {
I18n,
formatNumber,
dateToStringShort,
timeRemaining: {},
counterdown: undefined,
participants: 126, // TODO: waiting API
treasury: 1200000,
isUpVoteElectionBannerVisible: true, // TODO: waiting API
endDate: '2023-08-23',
nextElectionStartDate: '2023-08-29',
elections: [
{
endDate: '2023-08-20',
rounds: 3,
participants: 126
},
{
endDate: '2023-08-20',
rounds: 3,
participants: 126
},
{
endDate: '2023-08-20',
rounds: 3,
participants: 126
},
{
endDate: '2023-08-20',
rounds: 3,
participants: 126
}
],
slide: '1',
titles: [
this.$t('pages.dho.election.howCommunityElectionsWork'),
Expand Down Expand Up @@ -85,6 +103,10 @@ export default {
}, 1000)
},
async activated () {
await this.$apollo.queries.elections.refetch()
},
beforeDestroy () {
clearInterval(this.counterdown)
},
Expand Down Expand Up @@ -173,7 +195,7 @@ q-page.page-election
.text-secondary {{ $t('pages.dho.home.timeLeftForSigningUp') }}
.row.q-pt-md
.col.flex.justify-center(:style="{ 'border-right': '1px solid #242f5d' }")
.h-h6 {{ participants }}
//- .h-h6 {{ participants }}
.full-width.flex.justify-center.text-secondary {{ $t('pages.dho.home.participants') }}
.col.flex.justify-center
.h-h6 $ {{ formatNumber(treasury) }}
Expand All @@ -189,7 +211,7 @@ q-page.page-election
q-btn.q-px-lg.h-btn1(disable :class="{ 'q-mt-sm': $q.screen.lt.xs || $q.screen.xs }" no-caps rounded unelevated :label="$t('pages.dho.home.nextElection', { date: dateToStringShort(nextElectionStartDate) })" color="white" text-color="primary")
.row
.col-9.q-mr-md
template(v-for="election, index in elections")
template(v-for="election in elections")
q-card.full-width.q-pa-xl.rounded.q-mb-md(flat)
.row.flex.items-center
.col.flex.justify-start
Expand All @@ -199,7 +221,7 @@ q-page.page-election
.col.flex.justify-center.text-black(:style="{ 'font-size': '17px' }")
div {{ election.participants }} {{ $t('pages.dho.election.participants') }}
.col.flex.justify-end
q-btn.q-px-lg.h-btn1(@click="$router.push({ path: `/${selectedDao.name}/election/${index}` })" :class="{ 'q-mt-sm': $q.screen.lt.xs || $q.screen.xs }" no-caps rounded unelevated :label="$t('pages.dho.election.seeResults')" color="primary" text-color="white")
q-btn.q-px-lg.h-btn1(@click="$router.push({ path: `/${selectedDao.name}/election/${election.id}` })" :class="{ 'q-mt-sm': $q.screen.lt.xs || $q.screen.xs }" no-caps rounded unelevated :label="$t('pages.dho.election.seeResults')" color="primary" text-color="white")
.col
widget(:title="widgetTitle")
q-carousel.b2.q-mt-md(v-model="slide" swipeable="swipeable" animated="animated" navigation="navigation" :padding="false" height="240px" control-color="primary" ref="carousel")
Expand Down
12 changes: 7 additions & 5 deletions src/pages/upvote-election/GroupCard.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,20 +33,22 @@ export default {
div(v-if="!myGroup") {{ $t('pages.upvote-election.groupcard.noRecordingsYet') }}
.text-secondary.cursor-pointer.text-underline(v-else) {{ $t('pages.upvote-election.groupcard.uploadRecording') }}
template(v-for="user in users")
profile-picture.q-mr-xxs(:username="user.account" size="24px" :key="applicant")
profile-picture.q-mr-xxs(:username="user.details_member_n" size="24px" :key="applicant")
q-btn(@click="showUsers = !showUsers" flat rounded :icon="showUsers ? 'fas fa-chevron-up' : 'fas fa-chevron-down'")
q-slide-transition
div.q-mt-xl.q-pt-xl(v-show="showUsers" :style="{ 'border-top': '1px solid #CBCDD1'}")
template(v-for="user in users")
.row.flex.items-center.q-mb-md
.col-1.q-mr-xs.flex.items-center
profile-picture(:username="user.account" size="24px" :key="applicant")
profile-picture(:username="user.details_member_n" size="24px" :key="applicant")
.col
.row.text-bold.text-black {{ user.fullName }}
.row.text-bold.text-black {{ user.details_member_n }}
.row(:style="{ 'font-size': '10px' }") {{ user.telegram }}
.row.flex.items-center
template(v-for="vote in votes")
div.q-ml-xxs(:class="{ 'vote': vote.vote, 'consensus': vote.consensus, 'slot': vote.slot }" :style="{ 'width': '15px', 'height': '4px', 'border-radius': '20px'}")
div.q-ml-xxs.consensus(:class="{ 'vote': vote.details_votedId_i == user.docId }" :style="{ 'width': '15px', 'height': '4px', 'border-radius': '20px'}")
template(v-for="vote in 6 - votes.length")
div.q-ml-xxs.slot(:style="{ 'width': '15px', 'height': '4px', 'border-radius': '20px'}")
q-btn.q-ml-sm(@click="" color="primary" flat :label="$t('pages.upvote-election.groupcard.vote')" no-caps bordered rounded v-if="myGroup" :style="{'border': '1px solid #252f5d'}")
.row.q-pt-lg(:style="{ 'border-top': '1px solid #CBCDD1'}")
.col
Expand All @@ -69,7 +71,7 @@ export default {
.rounded-card
border-radius: 15px
.vote
background: #16B59B
background: #16B59B !important
.consensus
background: #CAC8D0
.slot
Expand Down
8 changes: 4 additions & 4 deletions src/pages/upvote-election/RoundCard.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export default {
},
props: {
participants: Number,
participantsCount: Number,
groups: Array,
l1DelegateBadges: String,
users: Array,
Expand Down Expand Up @@ -64,7 +64,7 @@ export default {
q-icon(name="fas fa-users" size="24px")
.col.q-ml-sm
.row
.h-h4 {{ participants }}
.h-h4 {{ participantsCount }}
.row {{ $t('pages.upvote-election.participants') }}
.col
q-card.rounded-card.q-pa-lg.applications-metric
Expand All @@ -75,7 +75,7 @@ export default {
.row
.h-h4 {{ groups.length }}
.row {{ $t('pages.upvote-election.groups') }}
.col
//- .col
q-card.rounded-card.q-pa-lg.applications-metric
.row.flex.items-center
.col-2
Expand All @@ -91,7 +91,7 @@ export default {
div.q-my-xl.q-pt-xl(v-show="showGroups" :style="{ 'border-top': '1px solid #CBCDD1'}")
.row.q-gutter-col-md
template(v-for="group, index in groups")
group-card.col-6.q-pa-xxs(:users="group.users" :groupNumber="index + 1" :myGroup="group.myGroup", :votes="group.votes")
group-card.col-6.q-pa-xxs(:users="group.members" :groupNumber="index + 1" :myGroup="group.myGroup", :votes="group.votes")
</template>

<style lang="stylus" scoped>
Expand Down
Loading

0 comments on commit c046c79

Please sign in to comment.