You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

107 lines
2.5 KiB

<template>
<v-container>
<ui-rug-card-form :form="form">
<ui-rug-card-title>
{{
$t(
'page.researchStudies.studyId.contributors.join.title'
)
}}
</ui-rug-card-title>
<v-card-text class="flex-row mb-6 text-center">
<h1 class="mt-4 mb-4">{{ $t('page.researchStudies.studyId.contributors.join.waiting_message') }}</h1>
<v-progress-circular
v-if="joinState == -1"
indeterminate
size="48"
color="primary"
></v-progress-circular>
</v-card-text>
</ui-rug-card-form>
</v-container>
</template>
<script>
import { mapActions } from 'vuex'
import Form from '@/lib/form'
export default {
async asyncData({ store, route ,error }) {
const studyId = route.params.studyId
const key = route.query.key
try {
await store.dispatch('studies/getJoinStudy', { studyId })
return {
studyId,
key,
studyData: store.getters['studies/getActiveStudy'],
formData: {
studyId,
key
},
}
} catch(err) {
// Should this not be fixed in the axios plugin as an interceptor?
error({
statusCode: 404,
message: 'Page could not be found',
})
}
},
data() {
// const $t = this.$t.bind(this)
return {
joinState: -1,
formData: {
studyId: this.studyId,
key: this.jwtToken
},
form: new Form({
form: 'formData',
vm: this,
action: this['studies/joinContributor'],
schema: {
type: 'object',
properties: {
studyId: {
type: 'string',
},
key: {
type: 'string',
},
},
},
onResponse(response) {
// TODO: Should be a gui/client side translated text
this.vm.$toast.success( response.data.message )
this.joinState = 0
this.vm.$router.push(
this.vm.localePath(`/researchStudies/${this.vm.$route.params.studyId}`)
)
},
}),
}
},
head() {
const $t = this.$t.bind(this)
return {
title: $t('page.researchStudies.studyId.contributors.join.title'),
}
},
mounted() {
// TODO: Should it not be possible to post the form with this.form.submit() ??? Can't get the form to auto submit the correct data :(
},
methods: {
...mapActions(['studies/joinContributor']),
},
}
</script>