init authorize contribution page

This commit is contained in:
Danil Kovtonyuk 2020-02-07 02:16:38 +10:00
parent 684a7e0a2b
commit d03f81f81f
4 changed files with 72 additions and 18 deletions

View File

@ -183,10 +183,6 @@
align-items: stretch; align-items: stretch;
} }
.button.is-fullwidth + .button.is-fullwidth {
margin-top: 1rem;
}
&-anonymous { &-anonymous {
width: 100%; width: 100%;
cursor: pointer; cursor: pointer;
@ -602,4 +598,16 @@ fieldset {
&:not(:last-child) { &:not(:last-child) {
margin-bottom: $block-spacing; margin-bottom: $block-spacing;
} }
&.authorize {
max-width: 30%;
margin-left: auto;
margin-right: auto;
}
}
.form {
.button.is-fullwidth + .button.is-fullwidth {
margin-top: 1rem;
}
} }

View File

@ -0,0 +1,43 @@
<template>
<div class="ceremony">
<h1 class="title is-size-1 is-spaced">
Hello, <span>@{{ userHandle }}</span>
</h1>
<h2 class="subtitle">
Lorem ipsum dolor sit amet, consectetur?
</h2>
<fieldset class="authorize">
<Form />
</fieldset>
<div class="buttons is-centered">
<b-button v-if="isLoggedIn" :disabled="hasErrorName.invalid" type="is-primary" outlined>
Save information
</b-button>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
import Form from '@/components/Form'
export default {
components: {
Form
},
computed: {
...mapGetters('user', ['isLoggedIn', 'hasErrorName']),
userHandle: {
get() {
return this.$store.state.user.handle
}
}
},
async mounted() {
await this.getUserData()
},
methods: {
...mapActions('user', ['getUserData'])
}
}
</script>

View File

@ -131,22 +131,10 @@ export default {
} }
}, },
async mounted() { async mounted() {
try { await this.getUserData()
const response = await fetch('/api/user_data')
const data = await response.json()
console.log('data', data)
if (data.name !== 'Anonymous') {
this.userHandle = data.handle
this.userName = data.name
// TODO check whether it's github or twitter
this.contributionType = 'twitter'
}
} catch (e) {
console.error('user_data fail', e)
}
}, },
methods: { methods: {
...mapActions('user', ['makeTweet', 'logOut']), ...mapActions('user', ['makeTweet', 'logOut', 'getUserData']),
async makeContribution({ retry = 0 } = {}) { async makeContribution({ retry = 0 } = {}) {
try { try {
this.isContributeBtnSnown = true this.isContributeBtnSnown = true

View File

@ -81,6 +81,21 @@ const actions = {
}, },
async logOut() { async logOut() {
await fetch('/api/logout') await fetch('/api/logout')
},
async getUserData({ commit }) {
try {
const response = await fetch('/api/user_data')
const data = await response.json()
console.log('data', data)
if (data.name !== 'Anonymous') {
commit('SET_HANDLE', data.handle)
commit('SET_NAME', data.name)
// TODO check whether it's github or twitter
commit('SET_CONTRIBUTION_TYPE', 'twitter')
}
} catch (e) {
console.error('user_data fail', e)
}
} }
} }