add tweet button

This commit is contained in:
Danil Kovtonyuk 2020-01-30 18:55:40 +10:00
parent 05f8e0942b
commit 036610509f
2 changed files with 18 additions and 8 deletions

View File

@ -165,7 +165,12 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
&:not(:last-child) {
margin-bottom: $block-spacing;
}
.status-spinner { .status-spinner {
margin-top: 1.5rem;
&:after { &:after {
content: ''; content: '';
display: block; display: block;
@ -177,7 +182,6 @@
} }
.status-message { .status-message {
padding-bottom: 1.5rem;
color: $primary; color: $primary;
text-align: center; text-align: center;
} }

View File

@ -34,19 +34,23 @@
</div> </div>
</div> </div>
<div v-show="status" class="status">
<div class="status-message">{{ status }}</div>
<div v-show="!isContibutionCompleted" class="status-spinner"></div>
</div>
<div class="buttons is-centered"> <div class="buttons is-centered">
<b-button <b-button
:loading="isContributeBtnDisabled" v-if="!isContributeBtnDisabled"
@click="makeContribution" @click="makeContribution"
type="is-primary" type="is-primary"
outlined outlined
>Make the contribution</b-button
> >
</div> Make the contribution
</b-button>
<div v-show="status" class="status"> <b-button v-if="isContibutionCompleted" type="is-primary" outlined>
<div class="status-message">{{ status }}</div> Tweet about your contribution
<div class="status-spinner"></div> </b-button>
</div> </div>
</div> </div>
</template> </template>
@ -63,6 +67,7 @@ export default {
data() { data() {
return { return {
isContributeBtnDisabled: false, isContributeBtnDisabled: false,
isContibutionCompleted: false,
status: '', status: '',
isLoggedIn: false isLoggedIn: false
} }
@ -95,6 +100,7 @@ export default {
if (resp.ok) { if (resp.ok) {
this.status = 'Your contribution is verified and recorded. THX BYE.' this.status = 'Your contribution is verified and recorded. THX BYE.'
this.isContibutionCompleted = true
} else if (resp.status === 422) { } else if (resp.status === 422) {
if (retry < 3) { if (retry < 3) {
console.log(`Looks like someone else uploaded contribution ahead of us, retrying`) console.log(`Looks like someone else uploaded contribution ahead of us, retrying`)