feature: gradido member profil page step 1

This commit is contained in:
ogerly 2021-05-20 16:30:18 +02:00
parent 747e8b66a7
commit 09ec072d2e
4 changed files with 137 additions and 74 deletions

View File

@ -19,17 +19,25 @@
"en": "English"
},
"form": {
"cancel":"Abbrechen",
"cancel": "Abbrechen",
"reset": "Zurücksetzen",
"close":"schließen",
"close": "schließen",
"edit": "bearbeiten",
"save": "speichern",
"receiver":"Empfänger",
"sender":"Absender",
"username":"Username",
"firstname":"Vorname",
"lastname":"Nachname",
"description": "Beschreibung",
"email":"E-Mail",
"email_repeat":"eMail wiederholen",
"password":"Passwort",
"password_repeat":"Passwort wiederholen",
"password_old":"altes Passwort",
"password_new":"neues Passwort",
"password_new_repeat":"neues Passwort wiederholen",
"change": "ändern",
"amount":"Betrag",
"memo":"Nachricht für den Empfänger",
"message":"Nachricht",
@ -49,7 +57,8 @@
"validation": {
"double": "Das Feld {field} muss eine Dezimalzahl mit zwei Nachkommastellen sein",
"is-not": "Du kannst Dir selbst keine Gradidos überweisen"
}
},
"change_username_info": "Das ändern des Usernamens bedarf mehrerer Schritte."
},
"error": {
"error":"Fehler"
@ -93,7 +102,9 @@
"add_work":"neuer Gemeinschaftsbeitrag"
},
"profil": {
"transactions":"transactions",
"edit": {
},
"activity": {
"chart":"Gemeinschaftsstunden Chart",
"new":"Neue Gemeinschaftsstunden eintragen",

View File

@ -1,7 +1,7 @@
{
"message": "hello gradido !!",
"welcome":"Welcome!",
"community": "Gemeinschaft",
"community": "Community",
"logout":"Logout",
"login":"Login",
"signup": "Sign up",
@ -22,14 +22,22 @@
"cancel":"Cancel",
"reset": "Reset",
"close":"Close",
"edit": "Edit",
"save": "save",
"receiver":"Receiver",
"sender":"Sender",
"username":"Username",
"firstname":"Firstname",
"lastname":"Lastname",
"description": "Description",
"email":"Email",
"email_repeat":"Repeat Email",
"password":"Password",
"password_repeat":"Repeat password",
"password_old":"Old password",
"password_new":"New password",
"password_new_repeat":"Repeat new password",
"change": "change",
"amount":"Amount",
"memo":"Message for the recipient",
"message":"Message",
@ -49,7 +57,8 @@
"validation": {
"double": "The {field} field must be a decimal with two digits",
"is-not": "You cannot send Gradidos to yourself"
}
},
"change_username_info": "Changing the username requires several steps."
},
"error": {
"error":"Error"

View File

@ -94,11 +94,11 @@ export default {
transactionCount: 0,
pending: true,
UserProfileTestData: {
username: 'Mustermax',
name: 'Max',
lastname: 'Mustermann',
desc:
'Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. Max Mustermann seine Beschreibung. ',
img: '12345.png',
},
}
},

View File

@ -15,25 +15,25 @@
</div>
<div>
<span class="heading">{{ $n(transactionCount) }}</span>
<span class="description">Transactions</span>
<span class="description">{{ $t('transactions') }}</span>
</div>
<div>
<span class="heading">--</span>
<span class="description">Community</span>
<span class="description">{{ $t('community') }}</span>
</div>
</div>
</b-col>
</b-row>
<b-container>
<b-row class="mb-4 text-right">
<b-col class="text-right" @click="edit = !edit">
<span v-if="edit">bearbeiten</span>
<b-col class="text-right" @click="edit_userdata = !edit_userdata">
<span v-if="edit_userdata">{{ $t('form.edit') }}</span>
<div v-else>
<span>
bearbeiten
<b>abbrechen</b>
{{ $t('form.edit') }}
<b>{{ $t('form.cancel') }}</b>
</span>
<span class="ml-4 text-success display-4">speichern</span>
<span class="ml-4 text-success display-4">{{ $t('form.save') }}</span>
</div>
</b-col>
</b-row>
@ -41,27 +41,33 @@
<div>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>Vorname</small>
<small>{{ $t('form.firstname') }}</small>
</b-col>
<b-col v-if="edit_userdata" class="col-md-9 col-sm-10">
{{ UserProfileTestData.name }}
</b-col>
<b-col v-if="edit" class="col-md-9 col-sm-10">{{ UserProfileTestData.name }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-input type="text" v-model="UserProfileTestData.name"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>Nachname</small>
<small>{{ $t('form.lastname') }}</small>
</b-col>
<b-col v-if="edit_userdata" class="col-md-9 col-sm-10">
{{ UserProfileTestData.lastname }}
</b-col>
<b-col v-if="edit" class="col-md-9 col-sm-10">{{ UserProfileTestData.lastname }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-input type="text" v-model="UserProfileTestData.lastname"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>Beschreibung</small>
<small>{{ $t('form.description') }}</small>
</b-col>
<b-col v-if="edit_userdata" class="col-md-9 col-sm-10">
{{ UserProfileTestData.desc }}
</b-col>
<b-col v-if="edit" class="col-md-9 col-sm-10">{{ UserProfileTestData.desc }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-textarea
v-value="UserProfileTestData.dec"
@ -71,72 +77,107 @@
></b-textarea>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>UserBild</small>
</b-col>
<b-col v-if="edit" class="col-md-9 col-sm-10">{{ UserProfileTestData.img }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<vue-qrcode :value="$store.state.email" type="image/png"></vue-qrcode>
<b-form-file accept="image/jpeg, image/png, image/gif" v-model="UserProfileTestData.img"></b-form-file>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>E-Mail</small>
</b-col>
<b-col v-if="edit" class="col-md-9 col-sm-10">{{ $store.state.email }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-input type="text" v-model="$store.state.email"></b-input>
</b-col>
</b-row>
</div>
<hr />
<b-container>
<b-row class="mb-4 text-right">
<b-col class="text-right" @click="editpwd = !editpwd">
<span v-if="editpwd">Passwort ändern</span>
<b-col class="text-right" @click="edit_email = !edit_email">
<span v-if="edit_email">E-Mail {{ $t('form.change') }}</span>
<div v-else>
<span>
Passwort ändern
<b>abbrechen</b>
E-Mail {{ $t('form.change') }}
<b>{{ $t('form.cancel') }}</b>
</span>
<span class="ml-4 text-success display-4">speichern</span>
<span class="ml-4 text-success display-4">{{ $t('form.save') }}</span>
</div>
</b-col>
</b-row>
</b-container>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>E-Mail</small>
</b-col>
<b-col v-if="edit_email" class="col-md-9 col-sm-10">{{ $store.state.email }}</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-input type="text" v-model="$store.state.email"></b-input>
</b-col>
</b-row>
<hr />
<b-container>
<b-row class="mb-4 text-right">
<b-col class="text-right" @click="edit_username = !edit_username">
<span v-if="edit_username">{{ $t('form.username') }} {{ $t('form.change') }}</span>
<div v-else>
<span>
{{ $t('form.username') }} {{ $t('form.change') }}
<b>{{ $t('form.cancel') }}</b>
</span>
<span class="ml-4 text-success display-4">{{ $t('form.save') }}</span>
</div>
</b-col>
</b-row>
</b-container>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>{{ $t('form.username') }}</small>
</b-col>
<b-col v-if="edit_username" class="col-md-9 col-sm-10">
@{{ UserProfileTestData.username }}
</b-col>
<b-col v-else class="col-md-9 col-sm-10">
<b-input type="text" v-model="UserProfileTestData.username"></b-input>
<div>
{{ $t('form.change_username_info') }}
</div>
</b-col>
</b-row>
<hr />
<b-container>
<b-row class="mb-4 text-right">
<b-col class="text-right" @click="edit_pwd = !edit_pwd">
<span v-if="edit_pwd">{{ $t('form.password') }} {{ $t('form.change') }}</span>
<div v-else>
<span>
{{ $t('form.password') }} {{ $t('form.change') }}
<b>{{ $t('form.cancel') }}</b>
</span>
<span class="ml-4 text-success display-4">{{ $t('form.save') }}</span>
</div>
</b-col>
</b-row>
<div v-if="!editpwd">
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>altes Passwort</small>
</b-col>
<div v-if="!edit_pwd">
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>{{ $t('form.password_old') }}</small>
</b-col>
<b-col class="col-md-9 col-sm-10">
<b-input type="text" placeholder="altes Passwort"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>neues Passwort</small>
</b-col>
<b-input type="text" :placeholder="$t('form.password_old')"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>{{ $t('form.password_new') }}</small>
</b-col>
<b-col class="col-md-9 col-sm-10">
<b-input type="text" placeholder="neues Passwort"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>neues Passwort wiederholen</small>
</b-col>
<b-input type="text" :placeholder="$t('form.password_new')"></b-input>
</b-col>
</b-row>
<b-row class="mb-3">
<b-col class="col-lg-3 col-md-10 col-sm-10 text-md-left text-lg-right">
<small>{{ $t('form.password_new_repeat') }}</small>
</b-col>
<b-col class="col-md-9 col-sm-10">
<b-input type="text" placeholder="neues Passwort wiederholen"></b-input>
</b-col>
</b-row>
</div>
<b-input type="text" :placeholder="$t('form.password_new_repeat')"></b-input>
</b-col>
</b-row>
</div>
</b-container>
</b-card>
</template>
@ -150,8 +191,10 @@ export default {
},
data() {
return {
edit: true,
editpwd: true,
edit_userdata: true,
edit_pwd: true,
edit_email: true,
edit_username: true,
edit_button_text: 'edit',
}
},