Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

peng/328 delegates page #400

Merged
merged 4 commits into from
Jan 26, 2018
Merged

peng/328 delegates page #400

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e3b1a71
init
nylira Jan 26, 2018
dac3cc3
fix tests, fix PageDelegates footer z-index
nylira Jan 26, 2018
033dc76
Merge branch 'develop' into peng/382-delegates-page
faboweb Jan 26, 2018
840d6ae
Merge branch 'develop' into peng/382-delegates-page
jbibla Jan 26, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 9 additions & 11 deletions app/src/renderer/components/staking/LiDelegate.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
<template lang='pug'>
.li-delegate(:class='styles'): .li-delegate__values
.li-delegate__value.checkbox
i.fa.fa-check-square-o(v-if='inCart' @click='rm(delegate)')
i.fa.fa-square-o(v-else @click='add(delegate)')
.li-delegate__value.name
span
router-link(v-if="config.devMode" :to="{ name: 'delegate', params: { delegate: delegate.id }}") {{ ' ' + delegate.moniker }}
Expand All @@ -14,6 +11,10 @@
.bar(:style='vpStyles')
.li-delegate__value.bonded_by_you
span {{ num.prettyInt(amountBonded(delegate.id)) }}
.li-delegate__value.checkbox#remove-from-cart(v-if="inCart" @click='rm(delegate)')
i.material-icons check_box
.li-delegate__value.checkbox#add-to-cart(v-else @click='add(delegate)')
i.material-icons check_box_outline_blank
</template>

<script>
Expand Down Expand Up @@ -78,8 +79,9 @@ export default {
&:nth-of-type(2n-1)
background app-fg
&.li-delegate-active
.li-delegate__value i.fa
color mc
background alpha(hover, 17.5%)
.li-delegate__value i
color link

.li-delegate__values
display flex
Expand All @@ -91,16 +93,12 @@ export default {
align-items center
min-width 0

&:first-child
&:last-child
flex 0.5

&.number_of_votes
&.name
flex 2

&.id span
i.fa
margin-right 0.25rem

&.bar
position relative
span
Expand Down
4 changes: 2 additions & 2 deletions app/src/renderer/components/staking/PageBond.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ page.page-bond(title="Bond Atoms")
:class="bondGroupClass(delta(d.atoms, d.oldAtoms))")
.bond-group__fields
.bond-bar
label.bond-bar__label Delegate &ndash; {{ d.delegate.description.moniker }}
label.bond-bar__label {{ d.delegate.description.moniker }}
.bond-bar__input
.bond-bar-old__outer
.bond-bar-old__inner(:style="styleBondBarInner(d.oldAtoms)")
Expand Down Expand Up @@ -455,7 +455,7 @@ export default {
height 2rem - 0.25rem - 0.125rem
background txt
border-radius 1rem
z-index z(toolBar)
z-index z(listItem)

display flex
align-items center
Expand Down
33 changes: 24 additions & 9 deletions app/src/renderer/components/staking/PageDelegates.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,11 +69,11 @@ export default {
property: 'shares',
order: 'desc',
properties: [
{ id: 0, title: '', value: '' },
{ id: 1, title: 'Name', value: 'description.moniker', class: 'name' },
{ id: 2, title: '% of Vote', value: 'shares', class: 'percent_of_vote' },
{ id: 3, title: '# of Votes', value: 'voting_power', class: 'number_of_votes' },
{ id: 4, title: 'Bonded by You', value: 'bonded', class: 'bonded_by_you' }
{ id: 0, title: 'Name', value: 'description.moniker', class: 'name' },
{ id: 1, title: 'Vote %', value: 'shares', class: 'percent_of_vote' },
{ id: 2, title: 'Votes', value: 'voting_power', class: 'number_of_votes' },
{ id: 3, title: 'Your Votes', value: 'bonded', class: 'bonded_by_you' },
{ id: 4, title: '', value: '', class: 'action' }
]
}
}),
Expand All @@ -100,17 +100,32 @@ export default {
@require '~variables'

.delegates-container
flex 1
padding-bottom 6rem

.fixed-button-bar
width 100%
padding 1rem
background app-fg
padding 0.5rem 1rem
background alpha(app-bg, 90%)
display flex
justify-content space-between
position fixed
bottom 3rem + px
left 0
right 0
z-index z(toolBar)
.label
color bright
line-height 2rem
strong
font-weight bold

@media screen and (min-width: 768px)
.delegates-container
padding-bottom 7rem

.fixed-button-bar
padding 1rem

@media screen and (min-width: 1024px)
.fixed-button-bar
margin-left width-side
</style>
7 changes: 4 additions & 3 deletions app/src/renderer/components/staking/PanelSort.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,6 @@ export default {
position relative
min-width 0

&:first-child
flex 0.5

.label
font-size sm
Expand Down Expand Up @@ -86,9 +84,12 @@ export default {
&:after
color txt

&.number_of_votes
&.name
flex 2

&.action
flex 0.5

@media screen and (max-width: 768px)
.sort-by
&.id
Expand Down
4 changes: 2 additions & 2 deletions test/unit/specs/components/staking/LiDelegate.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ describe('LiDelegate', () => {
expect(wrapper.vm.shoppingCart).toEqual([])
expect(wrapper.vm.inCart).toBeFalsy()
expect(wrapper.html()).not.toContain('li-delegate-active')
wrapper.find('.fa-square-o').trigger('click')
wrapper.find('#add-to-cart').trigger('click')
expect(wrapper.vm.inCart).toBeTruthy()
expect(store.commit).toHaveBeenCalledWith('addToCart', store.state.delegates[0])
expect(wrapper.html()).toContain('li-delegate-active')
Expand All @@ -79,7 +79,7 @@ describe('LiDelegate', () => {
store.commit('addToCart', store.state.delegates[0])
wrapper.update()
expect(wrapper.vm.inCart).toBeTruthy()
wrapper.find('.fa-check-square-o').trigger('click')
wrapper.find('#remove-from-cart').trigger('click')
expect(store.commit).toHaveBeenCalledWith('removeFromCart', delegate.id)
expect(wrapper.vm.shoppingCart).toEqual([])
expect(wrapper.vm.inCart).toBeFalsy()
Expand Down
17 changes: 10 additions & 7 deletions test/unit/specs/components/staking/__snapshots__/LiDelegate.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,6 @@ exports[`LiDelegate has the expected html structure 1`] = `
<div
class="li-delegate__values"
>
<div
class="li-delegate__value checkbox"
>
<i
class="fa fa-square-o"
/>
</div>
<div
class="li-delegate__value name"
>
Expand Down Expand Up @@ -51,6 +44,16 @@ exports[`LiDelegate has the expected html structure 1`] = `
0
</span>
</div>
<div
class="li-delegate__value checkbox"
id="add-to-cart"
>
<i
class="material-icons"
>
check_box_outline_blank
</i>
</div>
</div>
</div>
`;
4 changes: 2 additions & 2 deletions test/unit/specs/components/staking/__snapshots__/PageBond.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -191,7 +191,7 @@ exports[`PageBond has the expected html structure 1`] = `
<label
class="bond-bar__label"
>
Delegate – someValidator
someValidator
</label>
<div
class="bond-bar__input"
Expand Down Expand Up @@ -261,7 +261,7 @@ exports[`PageBond has the expected html structure 1`] = `
<label
class="bond-bar__label"
>
Delegate – someOtherValidator
someOtherValidator
</label>
<div
class="bond-bar__input"
Expand Down
77 changes: 40 additions & 37 deletions test/unit/specs/components/staking/__snapshots__/PageDelegates.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,39 +43,36 @@ exports[`PageDelegates has the expected html structure 1`] = `
<div class=\\"delegates-container\\">
<div class=\\"panel-sort\\">
<div class=\\"panel-sort-container\\">
<div class=\\"sort-by\\">
<div class=\\"label\\"></div>
</div>
<div class=\\"sort-by name\\">
<div class=\\"label\\">
Name
</div>
<div class=\\"sort-by name\\">
<div class=\\"label\\">
Name
</div>
</div>
<div class=\\"sort-by percent_of_vote\\">
<div class=\\"label\\">
% of Vote
Vote %
</div>
</div>
<div class=\\"sort-by number_of_votes\\">
<div class=\\"label\\">
# of Votes
Votes
</div>
</div>
<div class=\\"sort-by bonded_by_you\\">
<div class=\\"label\\">
Bonded by You
Your Votes
</div>
</div>
<div class=\\"sort-by action\\">
<div class=\\"label\\"></div>
</div>
</div>
</div>
<div class=\\"li-delegate\\">
<div class=\\"li-delegate__values\\">
<div class=\\"li-delegate__value checkbox\\">
<i class=\\"fa fa-square-o\\"></i>
<div class=\\"li-delegate__value name\\">
<span><a href=\\"#/staking/delegates/pubkeyY\\" class=\\"\\"> candidateY</a></span>
</div>
<div class=\\"li-delegate__value name\\">
<span><a href=\\"#/staking/delegates/pubkeyY\\" class=\\"\\"> candidateY</a></span>
</div>
<div class=\\"li-delegate__value percent_of_vote\\">
<span>75%</span>
</div>
Expand All @@ -86,16 +83,16 @@ exports[`PageDelegates has the expected html structure 1`] = `
<div class=\\"li-delegate__value bonded_by_you\\">
<span>0</span>
</div>
<div id=\\"add-to-cart\\" class=\\"li-delegate__value checkbox\\">
<i class=\\"material-icons\\">check_box_outline_blank</i>
</div>
</div>
</div>
<div class=\\"li-delegate\\">
<div class=\\"li-delegate__values\\">
<div class=\\"li-delegate__value checkbox\\">
<i class=\\"fa fa-square-o\\"></i>
<div class=\\"li-delegate__value name\\">
<span><a href=\\"#/staking/delegates/pubkeyX\\" class=\\"\\"> candidateX</a></span>
</div>
<div class=\\"li-delegate__value name\\">
<span><a href=\\"#/staking/delegates/pubkeyX\\" class=\\"\\"> candidateX</a></span>
</div>
<div class=\\"li-delegate__value percent_of_vote\\">
<span>25%</span>
</div>
Expand All @@ -106,6 +103,9 @@ exports[`PageDelegates has the expected html structure 1`] = `
<div class=\\"li-delegate__value bonded_by_you\\">
<span>0</span>
</div>
<div id=\\"add-to-cart\\" class=\\"li-delegate__value checkbox\\">
<i class=\\"material-icons\\">check_box_outline_blank</i>
</div>
</div>
</div>
</div>
Expand Down Expand Up @@ -259,48 +259,48 @@ exports[`PageDelegates should filter the delegates 1`] = `
class="panel-sort-container"
>
<div
class="sort-by"
class="sort-by name"
>
<div
class="label"
>

Name
</div>
</div>
<div
class="sort-by name"
class="sort-by percent_of_vote"
>
<div
class="label"
>
Name
Vote %
</div>
</div>
<div
class="sort-by percent_of_vote"
class="sort-by number_of_votes"
>
<div
class="label"
>
% of Vote
Votes
</div>
</div>
<div
class="sort-by number_of_votes"
class="sort-by bonded_by_you"
>
<div
class="label"
>
# of Votes
Your Votes
</div>
</div>
<div
class="sort-by bonded_by_you"
class="sort-by action"
>
<div
class="label"
>
Bonded by You

</div>
</div>
</div>
Expand All @@ -311,13 +311,6 @@ exports[`PageDelegates should filter the delegates 1`] = `
<div
class="li-delegate__values"
>
<div
class="li-delegate__value checkbox"
>
<i
class="fa fa-square-o"
/>
</div>
<div
class="li-delegate__value name"
>
Expand Down Expand Up @@ -355,6 +348,16 @@ exports[`PageDelegates should filter the delegates 1`] = `
0
</span>
</div>
<div
class="li-delegate__value checkbox"
id="add-to-cart"
>
<i
class="material-icons"
>
check_box_outline_blank
</i>
</div>
</div>
</div>
</div>
Expand Down