UserProfile component lets view and edit user profile fields.
Configuration:
<ui-user-profile
:profile-fields="['avatar_id', 'firstname', 'lastname', 'birth_date', 'country_id', 'region_id', 'email', 'phone', 'password']"
password-confirm-by="email"
:editable-fields="['avatar_id', 'firstname', 'email', 'phone']"
:otp-confirm="{
'email': true,
'phone': 'optional'
}"
:input-properties="{
passwordMinLength: 6,
passwordHasCamelcase: true,
passwordHasSpecSymbols: true,
variant: 'filled',
density: 'comfortable',
rounded: false,
flat: false,
}"
override-account-title="t.fullName"
></ui-user-profile>| props | default | type | description |
| id= | "up0" | String | In-system id, required if opening settings of a module from within the online office |
| :profile-fields= | "0" | Number | array of profile fields that will be displayed |
| :editable-fields= | "['avatar_id', 'firstname', 'email', 'phone']" | String | array of properties from those displayed - which can be edited |
| :otp-confirm= | 'email': true, 'phone': 'optional' | String | determine whether email/phone confirmation is required. true - required, false - not required at all, ‘optional’ - user's choice |
| override-account-title= | "t.fullName" | String | Replacing the user ID (under the avatar) with any custom property |
Note: All of the settings can be customized either from admin panel by manually editing code or from within the back office by pressing on a cog icon in a left upper corner of the page (only accessible when "Online office admin" flag is presented).