release v2.0.0 #4
|
@ -1,94 +1,90 @@
|
||||||
<template>
|
<template>
|
||||||
<q-card class="col-12">
|
<q-card class="col-12">
|
||||||
<q-card-section class="fit row justify-start content-center items-center">
|
<q-form @submit="save" @reset="reset">
|
||||||
<q-input
|
<q-card-section class="fit row justify-start content-center items-center">
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
<q-input
|
||||||
label="Vorname"
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
v-model="firstname"
|
label="Vorname"
|
||||||
:rules="[notEmpty]"
|
:rules="[notEmpty]"
|
||||||
ref="ref_firstname"
|
v-model="firstname"
|
||||||
filled
|
filled
|
||||||
/>
|
/>
|
||||||
<q-input
|
<q-input
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
label="Nachname"
|
label="Nachname"
|
||||||
v-model="lastname"
|
:rules="[notEmpty]"
|
||||||
:rules="[notEmpty]"
|
v-model="lastname"
|
||||||
ref="ref_lastname"
|
filled
|
||||||
filled
|
/>
|
||||||
/>
|
<q-input
|
||||||
<q-input
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
label="Benutzername"
|
||||||
label="Benutzername"
|
readonly
|
||||||
readonly
|
:value="user.userid"
|
||||||
:value="user.userid"
|
filled
|
||||||
filled
|
/>
|
||||||
/>
|
<q-input
|
||||||
<q-input
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
label="E-Mail"
|
||||||
label="E-Mail"
|
:rules="[isEmail, notEmpty]"
|
||||||
v-model="mail"
|
v-model="mail"
|
||||||
:rules="[isEmail, notEmpty]"
|
filled
|
||||||
ref="ref_mail"
|
/>
|
||||||
filled
|
<q-input
|
||||||
/>
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
<q-input
|
label="Display Name"
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
:rules="[notEmpty]"
|
||||||
label="Display Name"
|
v-model="display_name"
|
||||||
v-model="display_name"
|
filled
|
||||||
:rules="[notEmpty]"
|
/>
|
||||||
ref="ref_display_name"
|
<q-select
|
||||||
filled
|
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||||
/>
|
label="Rollen"
|
||||||
<q-select
|
readonly
|
||||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
v-model="user.roles"
|
||||||
label="Rollen"
|
:options="user.roles"
|
||||||
readonly
|
filled
|
||||||
v-model="user.roles"
|
>
|
||||||
:options="user.roles"
|
<template v-slot:selected-item="scope">
|
||||||
filled
|
<q-chip v-for="(item, index) in scope.opt" :key="'item' + index">
|
||||||
>
|
{{ item.name }}
|
||||||
<template v-slot:selected-item="scope">
|
</q-chip>
|
||||||
<q-chip v-for="(item, index) in scope.opt" :key="'item' + index">
|
</template>
|
||||||
{{ item.name }}
|
</q-select>
|
||||||
</q-chip>
|
</q-card-section>
|
||||||
</template>
|
<q-separator />
|
||||||
</q-select>
|
<q-card-section class="fit row justify-start content-center items-center">
|
||||||
</q-card-section>
|
<q-input
|
||||||
<q-separator />
|
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
||||||
<q-card-section class="fit row justify-start content-center items-center">
|
label="Password"
|
||||||
<q-input
|
type="password"
|
||||||
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
hint="Password muss immer eingetragen werden"
|
||||||
label="Password"
|
:rules="[notEmpty]"
|
||||||
type="password"
|
v-model="password"
|
||||||
hint="Password muss immer eingetragen werden"
|
filled
|
||||||
v-model="password"
|
/>
|
||||||
:rules="[notEmpty]"
|
<q-input
|
||||||
ref="ref_password"
|
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
||||||
filled
|
label="Neues Password"
|
||||||
/>
|
type="password"
|
||||||
<q-input
|
v-model="new_password"
|
||||||
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
filled
|
||||||
label="Neues Password"
|
/>
|
||||||
type="password"
|
<q-input
|
||||||
v-model="new_password"
|
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
||||||
filled
|
label="Wiederhole neues Password"
|
||||||
/>
|
type="password"
|
||||||
<q-input
|
:disable="new_password.length == 0"
|
||||||
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
|
:rules="[samePassword]"
|
||||||
label="Wiederhole neues Password"
|
v-model="new_password2"
|
||||||
type="password"
|
filled
|
||||||
v-model="new_password2"
|
/>
|
||||||
:disable="new_password.length == 0"
|
</q-card-section>
|
||||||
:rules="[samePassword]"
|
<q-card-actions align="right">
|
||||||
ref="ref_new_password"
|
<q-btn label="Reset" type="reset" />
|
||||||
filled
|
<q-btn color="primary" type="submit" label="Speichern" />
|
||||||
/>
|
</q-card-actions>
|
||||||
</q-card-section>
|
</q-form>
|
||||||
<q-card-actions align="right">
|
|
||||||
<q-btn label="Reset" @click="reset" />
|
|
||||||
<q-btn color="primary" label="Speichern" @click="save" />
|
|
||||||
</q-card-actions>
|
|
||||||
</q-card>
|
</q-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -96,29 +92,31 @@
|
||||||
import { computed, defineComponent, ref } from '@vue/composition-api';
|
import { computed, defineComponent, ref } from '@vue/composition-api';
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'Main',
|
name: 'Main',
|
||||||
setup(_, { root: { $store }, refs }) {
|
setup(_, { root: { $store } }) {
|
||||||
const user = computed<FG.User>(() => {
|
const user = computed<FG.User>(() => {
|
||||||
return <FG.User>$store.getters['user/user'];
|
return <FG.User>$store.getters['user/user'];
|
||||||
});
|
});
|
||||||
|
|
||||||
const firstname = ref<string>(user.value.firstname);
|
const firstname = ref(user.value.firstname);
|
||||||
const lastname = ref<string>(user.value.lastname);
|
const lastname = ref(user.value.lastname);
|
||||||
const mail = ref<string>(user.value.mail);
|
const mail = ref(user.value.mail);
|
||||||
const display_name = ref<string>(user.value.display_name);
|
const display_name = ref(user.value.display_name);
|
||||||
|
|
||||||
const password = ref<string>('');
|
const password = ref('');
|
||||||
const new_password = ref<string>('');
|
const new_password = ref('');
|
||||||
const new_password2 = ref<string>('');
|
const new_password2 = ref('');
|
||||||
|
|
||||||
function save() {
|
function save() {
|
||||||
let change_values = {
|
let change_values: { [index: string]: string } = {
|
||||||
firstname: firstname.value,
|
firstname: firstname.value,
|
||||||
lastname: lastname.value,
|
lastname: lastname.value,
|
||||||
mail: mail.value,
|
mail: mail.value,
|
||||||
display_name: display_name.value
|
display_name: display_name.value
|
||||||
};
|
};
|
||||||
Object.keys(change_values).forEach(key => {
|
Object.keys(change_values).forEach(key => {
|
||||||
if (change_values[key] === user.value[key]) {
|
if (
|
||||||
|
change_values[key] === (<{ [index: string]: any }>user.value)[key]
|
||||||
|
) {
|
||||||
delete change_values[key];
|
delete change_values[key];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -130,14 +128,9 @@ export default defineComponent({
|
||||||
new_password: new_password.value
|
new_password: new_password.value
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (
|
$store.dispatch('user/updateUser', change_values).catch(error => {
|
||||||
Object.keys(refs).every(key => {
|
console.warn(error);
|
||||||
return refs[key].validate();
|
});
|
||||||
})
|
|
||||||
) {
|
|
||||||
$store.dispatch('user/updateUser', change_values);
|
|
||||||
resetPassword();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function reset() {
|
function reset() {
|
||||||
|
@ -148,27 +141,9 @@ export default defineComponent({
|
||||||
password.value = '';
|
password.value = '';
|
||||||
new_password.value = '';
|
new_password.value = '';
|
||||||
new_password2.value = '';
|
new_password2.value = '';
|
||||||
setTimeout(() => {
|
|
||||||
Object.keys(refs).forEach(key => {
|
|
||||||
refs[key].resetValidation();
|
|
||||||
});
|
|
||||||
}, 500);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function resetPassword() {
|
function samePassword(val: string) {
|
||||||
password.value = '';
|
|
||||||
new_password.value = '';
|
|
||||||
new_password2.value = '';
|
|
||||||
console.log(refs);
|
|
||||||
console.log(refs.ref_password);
|
|
||||||
console.log(refs.ref_new_password);
|
|
||||||
setTimeout(() => {
|
|
||||||
refs.ref_password.resetValidation();
|
|
||||||
refs.ref_new_password.resetValidation();
|
|
||||||
}, 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
function samePassword(val) {
|
|
||||||
return val == new_password.value || 'Passwörter sind nicht identisch!';
|
return val == new_password.value || 'Passwörter sind nicht identisch!';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -176,7 +151,7 @@ export default defineComponent({
|
||||||
return !!val || 'Feld darf nicht leer sein!';
|
return !!val || 'Feld darf nicht leer sein!';
|
||||||
}
|
}
|
||||||
|
|
||||||
function isEmail(val) {
|
function isEmail(val: string | null) {
|
||||||
return (
|
return (
|
||||||
!val ||
|
!val ||
|
||||||
/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w\w+)+$/.test(val) ||
|
/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w\w+)+$/.test(val) ||
|
||||||
|
|
Loading…
Reference in New Issue