Merge branch 'Feature--Profile-Page-Username' of github.com:gradido/gradido into Feature--Profile-Page-Username

This commit is contained in:
einhornimmond 2021-06-10 09:58:23 +02:00
commit d9fc89d2c4
2 changed files with 39 additions and 25 deletions

View File

@ -121,8 +121,6 @@ const loginAPI = {
return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload) return apiPost(CONFIG.LOGIN_API_URL + 'updateUserInfos', payload)
}, },
changeUsernameProfile: async (sessionId, email, username) => { changeUsernameProfile: async (sessionId, email, username) => {
console.log('changeUsernameProfile', username)
const payload = { const payload = {
session_id: sessionId, session_id: sessionId,
email, email,

View File

@ -1,42 +1,58 @@
<template> <template>
<b-card id="formusername" class="bg-transparent" style="background-color: #ebebeba3 !important"> <b-card id="formusername" class="bg-transparent" style="background-color: #ebebeba3 !important">
<b-container> <b-container>
<b-row class="mb-4 text-right"> <b-row class="text-right">
<b-col class="text-right"> <b-col class="mb-3">
<a href="#formusername" v-if="editUsername" @click="editUsername = !editUsername"> <b-icon
<span>{{ $t('form.username') }} {{ $t('form.change') }}</span> v-if="editUsername"
</a> @click="editUsername = !editUsername"
<div v-else> class="pointer"
<a href="#formusername" @click="editUsername = !editUsername"> icon="gear-fill"
<span> >
<b>{{ $t('form.cancel') }}</b> {{ $t('form.change') }}
</span> </b-icon>
</a>
</div> <b-icon
v-else
@click="editUsername = !editUsername"
class="pointer"
icon="x-circle"
variant="danger"
></b-icon>
</b-col> </b-col>
</b-row> </b-row>
</b-container>
<b-container v-if="editUsername">
<b-row class="mb-3"> <b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right"> <b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>{{ $t('form.username') }}</small> <small>{{ $t('form.username') }}</small>
</b-col> </b-col>
<b-col v-if="editUsername" class="col-md-9 col-sm-10">@{{ username }}</b-col> <b-col class="col-md-9 col-sm-10">@{{ username }}</b-col>
<b-col v-else class="col-md-9 col-sm-10"> </b-row>
</b-container>
<b-container v-else>
<b-row class="mb-3">
<b-col class="col-md-9 col-sm-10">
<validation-observer ref="formValidator"> <validation-observer ref="formValidator">
<b-form role="form"> <b-form role="form">
<b-form-input v-model="form.username" :placeholder="username"></b-form-input> <b-form-input v-model="form.username" :placeholder="username"></b-form-input>
<div> <div>
{{ $t('form.change_username_info') }} {{ $t('form.change_username_info') }}
</div> </div>
<div class="text-center" ref="submitButton">
<b-button type="button" @click="onSubmit" class="mt-4">
{{ $t('form.save') }}
</b-button>
</div>
</b-form> </b-form>
</validation-observer> </validation-observer>
</b-col> </b-col>
</b-row> </b-row>
<b-row class="text-right">
<b-col>
<div class="text-right" ref="submitButton">
<b-button variant="info" @click="onSubmit" class="mt-4">
{{ $t('form.save') }}
</b-button>
</div>
</b-col>
</b-row>
</b-container> </b-container>
</b-card> </b-card>
</template> </template>
@ -59,15 +75,15 @@ export default {
}, },
methods: { methods: {
async onSubmit() { async onSubmit() {
console.log('onSubmit', this.form.username)
const result = await loginAPI.changeUsernameProfile( const result = await loginAPI.changeUsernameProfile(
this.$store.state.sessionId, this.$store.state.sessionId,
this.$store.state.email, this.$store.state.email,
this.form.username, this.form.username,
) )
if (result.success) { if (result.success) {
this.$store.commit('username', this.form.username) this.$store.commit('username', this.form.username)
this.editUserdata = true this.editUserdata = this.editUsername = !this.editUsername
alert('Dein Username wurde geändert.')
} else { } else {
alert(result.result.message) alert(result.result.message)
} }