mirror of
https://github.com/YunoHost/yunohost-admin.git
synced 2024-09-03 20:06:15 +02:00
Add BasicForm helper component and reflect changes
This commit is contained in:
Axolotle
parent
62ba2f1a1f
commit
8de6f1070d
4 changed files with 297 additions and 282 deletions
38
app/src/components/BasicForm.vue
Normal file
38
app/src/components/BasicForm.vue
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
<template>
|
||||
<b-card :header="header" header-tag="h2" class="basic-form">
|
||||
<b-form :id="id" @submit="$emit('submit', $event)">
|
||||
<slot />
|
||||
</b-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<slot name="buttons">
|
||||
<b-button type="submit" :form="id" variant="success">
|
||||
{{ submit ? submit : $t('save') }}
|
||||
</b-button>
|
||||
</slot>
|
||||
</template>
|
||||
</b-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'BasicForm',
|
||||
|
||||
props: {
|
||||
header: { type: String, required: true },
|
||||
id: { type: String, default: 'ynh-form' },
|
||||
submit: { type: String, default: null }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.basic-form .card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
& > *:not(:first-child) {
|
||||
margin-left: .5rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,37 +1,27 @@
|
|||
<template lang="html">
|
||||
<div class="group-create">
|
||||
<b-card :header="$t('group_new')" header-tag="h2">
|
||||
<b-form id="group-create" @submit.prevent="onSubmit">
|
||||
<!-- GROUP NAME -->
|
||||
<b-form-group
|
||||
label-cols="auto"
|
||||
:label="$t('group_name')" label-for="input-groupname"
|
||||
:description="$t('group_format_name_help')"
|
||||
>
|
||||
<b-input
|
||||
id="input-groupname" :placeholder="$t('placeholder.groupname')"
|
||||
aria-describedby="groupname-feedback" required
|
||||
v-model="form.groupname" :state="isValid.groupname"
|
||||
@input="validateGroupname"
|
||||
/>
|
||||
<b-form-invalid-feedback id="groupname-feedback" :state="isValid.groupname">
|
||||
{{ this.error.groupname }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
</b-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<div class="d-flex d-flex justify-content-end">
|
||||
<b-button type="submit" form="group-create" variant="success">
|
||||
{{ $t('save') }}
|
||||
</b-button>
|
||||
</div>
|
||||
</template>
|
||||
</b-card>
|
||||
</div>
|
||||
<basic-form :header="$t('group_new')" @submit.prevent="onSubmit">
|
||||
<!-- GROUP NAME -->
|
||||
<b-form-group
|
||||
label-cols="auto"
|
||||
:label="$t('group_name')" label-for="input-groupname"
|
||||
:description="$t('group_format_name_help')"
|
||||
>
|
||||
<b-input
|
||||
id="input-groupname" :placeholder="$t('placeholder.groupname')"
|
||||
aria-describedby="groupname-feedback" required
|
||||
v-model="form.groupname" :state="isValid.groupname"
|
||||
@input="validateGroupname"
|
||||
/>
|
||||
<b-form-invalid-feedback id="groupname-feedback" :state="isValid.groupname">
|
||||
{{ this.error.groupname }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
</basic-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasicForm from '@/components/BasicForm'
|
||||
|
||||
export default {
|
||||
name: 'GroupCreate',
|
||||
|
||||
|
|
@ -75,6 +65,10 @@ export default {
|
|||
this.error.groupname = error
|
||||
this.isValid.groupname = error === '' ? null : false
|
||||
}
|
||||
},
|
||||
|
||||
components: {
|
||||
BasicForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,129 +1,118 @@
|
|||
<template lang="html">
|
||||
<div class="user-create">
|
||||
<b-card :header="$t('users_new')" header-tag="h2">
|
||||
<b-form id="user-create" @submit.prevent="onSubmit">
|
||||
<!-- USER NAME -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_username')" label-for="input-username">
|
||||
<b-input
|
||||
id="input-username" :placeholder="$t('placeholder.username')"
|
||||
aria-describedby="username-feedback" required
|
||||
v-model="form.username" :state="isValid.username"
|
||||
@input="validateUsername" @blur="populateEmail"
|
||||
/>
|
||||
<b-form-invalid-feedback id="username-feedback" :state="isValid.username">
|
||||
{{ this.error.username }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
<basic-form :header="$t('users_new')" @submit.prevent="onSubmit">
|
||||
<!-- USER NAME -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_username')" label-for="input-username">
|
||||
<b-input
|
||||
id="input-username" :placeholder="$t('placeholder.username')"
|
||||
aria-describedby="username-feedback" required
|
||||
v-model="form.username" :state="isValid.username"
|
||||
@input="validateUsername" @blur="populateEmail"
|
||||
/>
|
||||
<b-form-invalid-feedback id="username-feedback" :state="isValid.username">
|
||||
{{ this.error.username }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER FULLNAME -->
|
||||
<b-form-group label-cols="auto">
|
||||
<template v-slot:label aria-hidden="true">
|
||||
{{ $t('user_fullname') }}
|
||||
</template>
|
||||
|
||||
<div class="input-double">
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-firstname"
|
||||
>
|
||||
{{ $t('common.firstname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.firstname')"
|
||||
v-model="form.firstname" required
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-lastname"
|
||||
>
|
||||
{{ $t('common.lastname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.lastname')"
|
||||
v-model="form.lastname" required
|
||||
/>
|
||||
</b-input-group>
|
||||
</div>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER EMAIL -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_email')" label-for="input-email">
|
||||
<splitted-mail-input
|
||||
id="input-email" feedback="email-feedback"
|
||||
v-model="form.mail" :domains="domains"
|
||||
:state="isValid.mail" @input="validateEmail"
|
||||
/>
|
||||
|
||||
<b-form-invalid-feedback id="email-feedback" :state="isValid.mail">
|
||||
{{ this.error.mail }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAILBOX QUOTA -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('user_mailbox_quota')" label-for="input-mailbox-quota"
|
||||
:description="$t('mailbox_quota_description')"
|
||||
>
|
||||
<b-input-group append="M">
|
||||
<b-input
|
||||
id="input-mailbox-quota" :placeholder="$t('mailbox_quota_placeholder')"
|
||||
v-model="form.mailbox_quota" type="number" min="0"
|
||||
/>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD -->
|
||||
<b-form-group label-cols="auto" :label="$t('password')" label-for="input-password">
|
||||
<b-input
|
||||
id="input-password" placeholder="••••••••"
|
||||
aria-describedby="password-feedback" required
|
||||
v-model="form.password" type="password"
|
||||
:state="isValid.password" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="password-feedback" :state="isValid.password">
|
||||
{{ $t('passwords_too_short') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD CONFIRMATION -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('password_confirmation')" label-for="input-confirmation"
|
||||
:description="$t('good_practices_about_user_password')"
|
||||
>
|
||||
<b-input
|
||||
id="input-confirmation" placeholder="••••••••"
|
||||
aria-describedby="confirmation-feedback" required
|
||||
v-model="form.confirmation" type="password"
|
||||
:state="isValid.confirmation" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="confirmation-feedback" :state="isValid.confirmation">
|
||||
{{ $t('passwords_dont_match') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-invalid-feedback id="global-feedback" :state="server.isValid">
|
||||
{{ this.server.error }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<div class="d-flex d-flex justify-content-end">
|
||||
<b-button type="submit" form="user-create" variant="success">
|
||||
{{ $t('save') }}
|
||||
</b-button>
|
||||
</div>
|
||||
<!-- USER FULLNAME -->
|
||||
<b-form-group label-cols="auto">
|
||||
<template v-slot:label aria-hidden="true">
|
||||
{{ $t('user_fullname') }}
|
||||
</template>
|
||||
</b-card>
|
||||
</div>
|
||||
|
||||
<div class="input-double">
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-firstname"
|
||||
>
|
||||
{{ $t('common.firstname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.firstname')"
|
||||
v-model="form.firstname" required
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-lastname"
|
||||
>
|
||||
{{ $t('common.lastname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.lastname')"
|
||||
v-model="form.lastname" required
|
||||
/>
|
||||
</b-input-group>
|
||||
</div>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER EMAIL -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_email')" label-for="input-email">
|
||||
<splitted-mail-input
|
||||
id="input-email" feedback="email-feedback"
|
||||
v-model="form.mail" :domains="domains"
|
||||
:state="isValid.mail" @input="validateEmail"
|
||||
/>
|
||||
|
||||
<b-form-invalid-feedback id="email-feedback" :state="isValid.mail">
|
||||
{{ this.error.mail }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAILBOX QUOTA -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('user_mailbox_quota')" label-for="input-mailbox-quota"
|
||||
:description="$t('mailbox_quota_description')"
|
||||
>
|
||||
<b-input-group append="M">
|
||||
<b-input
|
||||
id="input-mailbox-quota" :placeholder="$t('mailbox_quota_placeholder')"
|
||||
v-model="form.mailbox_quota" type="number" min="0"
|
||||
/>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD -->
|
||||
<b-form-group label-cols="auto" :label="$t('password')" label-for="input-password">
|
||||
<b-input
|
||||
id="input-password" placeholder="••••••••"
|
||||
aria-describedby="password-feedback" required
|
||||
v-model="form.password" type="password"
|
||||
:state="isValid.password" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="password-feedback" :state="isValid.password">
|
||||
{{ $t('passwords_too_short') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD CONFIRMATION -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('password_confirmation')" label-for="input-confirmation"
|
||||
:description="$t('good_practices_about_user_password')"
|
||||
>
|
||||
<b-input
|
||||
id="input-confirmation" placeholder="••••••••"
|
||||
aria-describedby="confirmation-feedback" required
|
||||
v-model="form.confirmation" type="password"
|
||||
:state="isValid.confirmation" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="confirmation-feedback" :state="isValid.confirmation">
|
||||
{{ $t('passwords_dont_match') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-invalid-feedback id="global-feedback" :state="server.isValid">
|
||||
{{ this.server.error }}
|
||||
</b-form-invalid-feedback>
|
||||
</basic-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasicForm from '@/components/BasicForm'
|
||||
import SplittedMailInput from '@/components/SplittedMailInput'
|
||||
|
||||
export default {
|
||||
|
|
@ -220,7 +209,8 @@ export default {
|
|||
this.$store.dispatch('FETCH_ALL', [{ uri: 'domains' }, { uri: 'users' }])
|
||||
},
|
||||
components: {
|
||||
SplittedMailInput
|
||||
SplittedMailInput,
|
||||
BasicForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,138 +1,130 @@
|
|||
<template lang="html">
|
||||
<div class="user-edit">
|
||||
<b-card v-if="this.form.firstname" :header="user ? $t('user_username_edit', { name: user.username }) : ''" header-tag="h2">
|
||||
<b-form id="user-edit" @submit.prevent="onSubmit">
|
||||
<!-- USER FULLNAME -->
|
||||
<b-form-group label-cols="auto">
|
||||
<template v-slot:label aria-hidden="true">
|
||||
{{ $t('user_fullname') }}
|
||||
</template>
|
||||
|
||||
<div class="input-double">
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-firstname"
|
||||
>
|
||||
{{ $t('common.firstname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.firstname')"
|
||||
v-model="form.firstname"
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-lastname"
|
||||
>
|
||||
{{ $t('common.lastname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.lastname')"
|
||||
v-model="form.lastname"
|
||||
/>
|
||||
</b-input-group>
|
||||
</div>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER EMAIL -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_email')" label-for="input-email">
|
||||
<splitted-mail-input
|
||||
id="input-email" feedback="email-feedback"
|
||||
v-model="form.mail" :domains="domains"
|
||||
:state="isValid.mail" @input="validateEmail"
|
||||
/>
|
||||
|
||||
<b-form-invalid-feedback id="email-feedback" :state="isValid.mail">
|
||||
{{ this.error.mail }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAILBOX QUOTA -->
|
||||
<hr>
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('user_mailbox_quota')" label-for="input-mailbox-quota"
|
||||
:description="$t('mailbox_quota_description')"
|
||||
>
|
||||
<b-input-group append="M">
|
||||
<b-input
|
||||
id="input-mailbox-quota" :placeholder="$t('mailbox_quota_placeholder')"
|
||||
v-model="form['mailbox-quota']" type="number" min="0"
|
||||
/>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAIL ALIASES -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('user_emailaliases')" class="mail-list">
|
||||
<splitted-mail-input
|
||||
v-for="(alias, index) in form['mail-aliases']" :key="index"
|
||||
feedback="mail-aliases-feedback"
|
||||
v-model="form['mail-aliases'][index]" :domains="domains"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAIL FORWARD -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('user_emailforward')" class="mail-list">
|
||||
<b-input
|
||||
v-for="(forward, index) in form['mail-forward']" :key="index"
|
||||
id="input-mailbox-quota" :placeholder="$t('user_new_forward')"
|
||||
v-model="form['mail-forward'][index]" type="email"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('password')" label-for="input-password">
|
||||
<b-input
|
||||
id="input-password" placeholder="••••••••"
|
||||
aria-describedby="password-feedback"
|
||||
v-model="form.password" type="password"
|
||||
:state="isValid.password" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="password-feedback" :state="isValid.password">
|
||||
{{ $t('passwords_too_short') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD CONFIRMATION -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('password_confirmation')" label-for="input-confirmation"
|
||||
:description="$t('good_practices_about_user_password')"
|
||||
>
|
||||
<b-input
|
||||
id="input-confirmation" placeholder="••••••••"
|
||||
aria-describedby="confirmation-feedback"
|
||||
v-model="form.confirmation" type="password"
|
||||
:state="isValid.confirmation" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="confirmation-feedback" :state="isValid.confirmation">
|
||||
{{ $t('passwords_dont_match') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-invalid-feedback id="global-feedback" :state="server.isValid">
|
||||
{{ this.server.error }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form>
|
||||
|
||||
<template v-slot:footer>
|
||||
<div class="d-flex d-flex justify-content-end">
|
||||
<b-button type="submit" form="user-edit" variant="success">
|
||||
{{ $t('save') }}
|
||||
</b-button>
|
||||
</div>
|
||||
<basic-form
|
||||
v-if="user" :header="$t('user_username_edit', { name: user.username })"
|
||||
@submit.prevent="onSubmit"
|
||||
>
|
||||
<!-- USER FULLNAME -->
|
||||
<b-form-group label-cols="auto">
|
||||
<template v-slot:label aria-hidden="true">
|
||||
{{ $t('user_fullname') }}
|
||||
</template>
|
||||
</b-card>
|
||||
</div>
|
||||
|
||||
<div class="input-double">
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-firstname"
|
||||
>
|
||||
{{ $t('common.firstname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.firstname')"
|
||||
v-model="form.firstname"
|
||||
/>
|
||||
</b-input-group>
|
||||
|
||||
<b-input-group>
|
||||
<b-input-group-prepend
|
||||
tag="label" class="ssr-only" is-text
|
||||
for="input-lastname"
|
||||
>
|
||||
{{ $t('common.lastname') }}
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input
|
||||
id="input-firstname" :placeholder="$t('placeholder.lastname')"
|
||||
v-model="form.lastname"
|
||||
/>
|
||||
</b-input-group>
|
||||
</div>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER EMAIL -->
|
||||
<b-form-group label-cols="auto" :label="$t('user_email')" label-for="input-email">
|
||||
<splitted-mail-input
|
||||
id="input-email" feedback="email-feedback"
|
||||
v-model="form.mail" :domains="domains"
|
||||
:state="isValid.mail" @input="validateEmail"
|
||||
/>
|
||||
|
||||
<b-form-invalid-feedback id="email-feedback" :state="isValid.mail">
|
||||
{{ this.error.mail }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAILBOX QUOTA -->
|
||||
<hr>
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('user_mailbox_quota')" label-for="input-mailbox-quota"
|
||||
:description="$t('mailbox_quota_description')"
|
||||
>
|
||||
<b-input-group append="M">
|
||||
<b-input
|
||||
id="input-mailbox-quota" :placeholder="$t('mailbox_quota_placeholder')"
|
||||
v-model="form['mailbox-quota']" type="number" min="0"
|
||||
/>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAIL ALIASES -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('user_emailaliases')" class="mail-list">
|
||||
<splitted-mail-input
|
||||
v-for="(alias, index) in form['mail-aliases']" :key="index"
|
||||
feedback="mail-aliases-feedback"
|
||||
v-model="form['mail-aliases'][index]" :domains="domains"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<!-- MAIL FORWARD -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('user_emailforward')" class="mail-list">
|
||||
<b-input
|
||||
v-for="(forward, index) in form['mail-forward']" :key="index"
|
||||
id="input-mailbox-quota" :placeholder="$t('user_new_forward')"
|
||||
v-model="form['mail-forward'][index]" type="email"
|
||||
/>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD -->
|
||||
<hr>
|
||||
<b-form-group label-cols="auto" :label="$t('password')" label-for="input-password">
|
||||
<b-input
|
||||
id="input-password" placeholder="••••••••"
|
||||
aria-describedby="password-feedback"
|
||||
v-model="form.password" type="password"
|
||||
:state="isValid.password" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="password-feedback" :state="isValid.password">
|
||||
{{ $t('passwords_too_short') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<!-- USER PASSWORD CONFIRMATION -->
|
||||
<b-form-group
|
||||
label-cols="auto" :label="$t('password_confirmation')" label-for="input-confirmation"
|
||||
:description="$t('good_practices_about_user_password')"
|
||||
>
|
||||
<b-input
|
||||
id="input-confirmation" placeholder="••••••••"
|
||||
aria-describedby="confirmation-feedback"
|
||||
v-model="form.confirmation" type="password"
|
||||
:state="isValid.confirmation" @input="validatePassword"
|
||||
/>
|
||||
<b-form-invalid-feedback id="confirmation-feedback" :state="isValid.confirmation">
|
||||
{{ $t('passwords_dont_match') }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-invalid-feedback id="global-feedback" :state="server.isValid">
|
||||
{{ this.server.error }}
|
||||
</b-form-invalid-feedback>
|
||||
</basic-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasicForm from '@/components/BasicForm'
|
||||
import SplittedMailInput from '@/components/SplittedMailInput'
|
||||
|
||||
export default {
|
||||
|
|
@ -249,7 +241,8 @@ export default {
|
|||
})
|
||||
},
|
||||
components: {
|
||||
SplittedMailInput
|
||||
SplittedMailInput,
|
||||
BasicForm
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue