flaschengeist-frontend/src/plugins/user/components/settings/Main.vue

83 lines
2.0 KiB
Vue

<template>
<q-card class="col-12">
<q-card-section class="fit row justify-start content-center items-center">
<q-input
class="col-xs-12 col-sm-6 q-pa-sm"
label="Vorname"
readonly
:value="user.firstname"
filled
/>
<q-input
class="col-xs-12 col-sm-6 q-pa-sm"
label="Nachname"
readonly
:value="user.lastname"
filled
/>
<q-input
class="col-xs-12 col-sm-6 q-pa-sm"
label="Benutzername"
readonly
:value="user.userid"
filled
/>
<q-input
class="col-xs-12 col-sm-6 q-pa-sm"
label="E-Mail"
readonly
:value="user.mail"
filled
/>
<q-select
class="col-xs-12 col-sm-6 q-pa-sm"
label="Rollen"
readonly
v-model="user.roles"
:options="user.roles"
filled
>
<template v-slot:selected-item="scope">
<q-chip v-for="(item, index) in scope.opt" :key="'item' + index">
{{ item.name }}
</q-chip>
</template>
</q-select>
</q-card-section>
<q-separator />
<q-card-section class="fit row justify-start content-center items-center">
<q-input
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
label="Password"
type="password"
filled
/>
<q-input
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
label="Neues Password"
type="password"
filled
/>
<q-input
class="col-xs-12 col-sm-6 col-md-4 q-pa-sm"
label="Wiederhole neues Password"
type="password"
filled
/>
</q-card-section>
</q-card>
</template>
<script lang="ts">
import { computed, defineComponent } from '@vue/composition-api';
export default defineComponent({
name: 'Main',
setup(_, { root: { $store } }) {
const user = computed(() => {
return $store.getters['user/user'];
});
return { user };
}
});
</script>