Select Git revision
SSA_disks.pm
authentication.vue 4.35 KiB
<template>
<div
v-if="loggedIn">
<UserToolbar />
<v-window v-model="tab">
<v-window-item>
<v-card
:title="$t('pages.settings.subpages.authentication.title')"
:subtitle="$t('pages.settings.subpages.authentication.subtitle')"
variant="flat"
rounded="0">
<v-card-text>
<v-form
v-model="valid2">
<v-row dense>
<v-col md="6">
<v-text-field
v-model="password"
type="password"
:rules="[v => !!v || $t('validation.required')]"
required
:variant="inputVariant"
persistent-hint
:label="$t('pages.settings.subpages.authentication.password.label')"
:hint="$t('pages.settings.subpages.authentication.password.hint')" />
</v-col>
</v-row>
<v-row dense>
<v-col md="6">
<v-text-field
v-model="password2"
type="password"
:rules="[v => !!v || $t('validation.required'), v => (!!v && v) === password || $t('Not matching!')]"
required
:variant="inputVariant"
persistent-hint
:label="$t('pages.settings.subpages.authentication.confirm.label')"
:hint="$t('pages.settings.subpages.authentication.confirm.hint')" />
</v-col>
</v-row>
<v-row>
<v-col md="6">
<v-btn
size="small"
color="secondary"
:loading="loadingUpdate"
:disabled="!valid2"
variant="flat"
type="submit"
:text="$t('pages.settings.subpages.authentication.submit.text')"
@click="changePassword" />
</v-col>
</v-row>
</v-form>
</v-card-text>
</v-card>
</v-window-item>
</v-window>
<v-breadcrumbs :items="items" class="pa-0 mt-2" />
</div>
</template>
<script setup>
const { loggedIn, user } = useOidcAuth()
</script>
<script>
import UserToolbar from '@/components/user/UserToolbar.vue'
import { useCacheStore } from '@/stores/cache.js'
export default {
components: {
UserToolbar
},
data () {
return {
tab: 0,
valid1: false,
valid2: false,
loadingUpdate: false,
items: [
{
title: this.$t('navigation.user'),
to: '/user'
},
{
title: this.$t('toolbars.user.authentication'),
to: `/user/authentication`,
disabled: true
}
],
email: null,
password: null,
password2: null,
cacheStore: useCacheStore()
}
},
computed: {
cacheUser () {
return this.cacheStore.getUser
},
inputVariant () {
const runtimeConfig = useRuntimeConfig()
return this.$vuetify.theme.global.name.toLowerCase().endsWith('contrast') ? runtimeConfig.public.variant.input.contrast : runtimeConfig.public.variant.input.normal
},
buttonVariant () {
const runtimeConfig = useRuntimeConfig()
return this.$vuetify.theme.global.name.toLowerCase().endsWith('contrast') ? runtimeConfig.public.variant.button.contrast : runtimeConfig.public.variant.button.normal
}
},
methods: {
changePassword () {
this.loadingUpdate = true
const userService = useUserService()
userService.updatePassword(this.cacheUser.uid, {'password': this.password})
.then(() => {
const user = Object.assign({}, this.cacheUser)
user.setup_finished = true
this.cacheStore.setUser(user)
// fixme [mweise]: currently nuxt-oidc-auth cannot refresh the session correctly
const toast = useToastInstance()
toast.success(this.$t('success.user.password'))
this.loadingUpdate = false
})
.catch(({code, message}) => {
const toast = useToastInstance()
if (typeof code !== 'string') {
return
}
toast.error(message)
this.loadingUpdate = false
})
.finally(() => {
this.loadingUpdate = false
})
}
}
}
</script>