Skip to content
Snippets Groups Projects
Commit 384c3ff2 authored by Petar Hristov's avatar Petar Hristov :speech_balloon: Committed by Hanna Führ
Browse files

Fix: Retrun objects for institutes and organizations (coscine/issues#1963)

parent 0a120a3c
No related branches found
No related tags found
2 merge requests!72Release: Sprint/2022 10 :robot:,!60Fix: Organization field in user profile
......@@ -62,7 +62,9 @@
<b-form-input
id="givenname"
v-model="$v.form.givenname.$model"
:state="$v.form.givenname.$dirty ? !$v.form.givenname.$error : null"
:state="
$v.form.givenname.$dirty ? !$v.form.givenname.$invalid : null
"
:placeholder="
$t('page.userprofile.form.personalInformation.givenName')
"
......@@ -81,7 +83,7 @@
<b-form-input
id="surname"
v-model="$v.form.surname.$model"
:state="$v.form.surname.$dirty ? !$v.form.surname.$error : null"
:state="$v.form.surname.$dirty ? !$v.form.surname.$invalid : null"
:placeholder="
$t('page.userprofile.form.personalInformation.surname')
"
......@@ -101,7 +103,9 @@
id="Email"
v-model="$v.form.emailAddress.$model"
:state="
$v.form.emailAddress.$dirty ? !$v.form.emailAddress.$error : null
$v.form.emailAddress.$dirty || !form.emailAddress
? !$v.form.emailAddress.$invalid
: null
"
:placeholder="$t('page.userprofile.form.personalInformation.email')"
/>
......@@ -126,8 +130,6 @@
:options="ror"
:multiple="false"
:loading="loadingOrganizations"
label="displayName"
track-by="displayName"
:show-labels="false"
:placeholder="
$t(
......@@ -136,12 +138,6 @@
"
@search-change="triggerFetchOptions"
>
<template slot="singleLabel" slot-scope="props">
{{ props.option.displayName }}
</template>
<template slot="option" slot-scope="props">
{{ props.option.displayName }}
</template>
<template slot="noOptions">
{{
$t(
......@@ -251,6 +247,7 @@
<CoscineHeadline
:headline="$t('page.userprofile.form.userPreferences.header')"
/>
<!-- Language -->
<coscine-form-group
:mandatory="true"
label-for="language"
......@@ -263,7 +260,10 @@
<b-form-radio-group
id="language"
class="bv-no-focus-ring"
:checked="form.language !== undefined ? form.language.id : false"
:checked="
form.language && form.language.id ? form.language.id : false
"
:state="form.language && form.language.id ? null : false"
:options="languages"
name="radios-stacked"
text-field="displayName"
......@@ -330,38 +330,8 @@
:disabled="$v.form.$invalid || savingProfile || !$v.form.$anyDirty"
@click.prevent="clickSave"
>
<b-iconstack
v-if="savingProfile"
animation="spin"
aria-hidden="true"
>
<b-icon
stacked
icon="dot"
aria-hidden="true"
shift-v="4"
></b-icon>
<b-icon
stacked
icon="dot"
aria-hidden="true"
shift-v="-4"
></b-icon>
<b-icon
stacked
icon="dot"
aria-hidden="true"
shift-h="4"
></b-icon>
<b-icon
stacked
icon="dot"
aria-hidden="true"
shift-h="-4"
></b-icon>
</b-iconstack>
{{ $t("buttons.save") }}</b-button
>
{{ $t("buttons.save") }}
</b-button>
</coscine-form-group>
</b-form>
</div>
......@@ -422,9 +392,15 @@ export default defineComponent({
email,
required,
},
organization: {},
institute: {},
disciplines: {},
organization: {
required,
},
institute: {
required,
},
disciplines: {
required,
},
language: {
id: {},
},
......@@ -469,11 +445,12 @@ export default defineComponent({
this.institutes.length > 0
);
},
institutes(): OrganizationObject[] {
institutes(): string[] {
if (this.memberOrganizations) {
return this.memberOrganizations.filter(
(organization) => organization.url?.indexOf("#") !== -1
);
return this.memberOrganizations
.filter((organization) => organization.url?.indexOf("#") !== -1) // If does contain "#" it's a sub level organization, otherwise top level
.map((org) => (org.displayName ? org.displayName : "")) // Extract organization display name, could contain empty strings
.filter((n) => n); // Filter out empty strings, if any;;
}
return [];
},
......@@ -493,16 +470,22 @@ export default defineComponent({
}
return false;
},
organizations(): OrganizationObject[] {
organizations(): string[] {
if (this.memberOrganizations) {
this.memberOrganizations.filter(
(organization) => !(organization.url?.indexOf("#") !== -1)
);
return this.memberOrganizations
.filter((organization) => !(organization.url?.indexOf("#") !== -1)) // If does contain "#" it's a sub level organization, otherwise top level
.map((org) => (org.displayName ? org.displayName : "")) // Extract organization display name, could contain empty strings
.filter((n) => n); // Filter out empty strings, if any;
}
return [];
},
ror(): null | OrganizationObject[] {
return this.userStore.userProfile.organizations;
ror(): null | string[] {
const organizations = this.userStore.userProfile.organizations;
if (organizations) {
return organizations
.map((org) => (org.displayName ? org.displayName : "")) // Extract organization display name, could contain empty strings
.filter((n) => n); // Filter out empty strings, if any
} else return null;
},
shibbolethConnected(): boolean {
if (this.user.externalAuthenticators) {
......@@ -552,6 +535,9 @@ export default defineComponent({
this.$v.form.$anyDirty
) {
this.savingProfile = true;
// SECTION FOR SAVING ANY EMAIL CHANGES
// SIDE EFFECT: NO OTHER FIELD CHANGE CAN BE SAVED TOGETHER WITH A CHANGE OF THE EMAIL ADDRESS
// TODO
if (
this.form.emailAddress &&
this.form.emailAddress !== this.user.emailAddress
......@@ -570,22 +556,28 @@ export default defineComponent({
).toString(),
});
}
try {
await this.userStore.updateUser(this.form);
this.$v.form.$reset();
// SECTION FOR SAVING THE REST OF THE FIELDS
const updatedUser = await this.userStore.updateUser(this.form);
if (updatedUser) {
// On Success
this.$v.form.$reset()
this.notificationStore.postNotification({
title: this.$t("toast.onSave.success.title").toString(),
body: this.$t("toast.onSave.success.message").toString(),
});
} catch {
} else {
this.savingProfile = false;
// On Failure
this.notificationStore.postNotification({
title: this.$t("toast.onSave.failure.title").toString(),
body: this.$t("toast.onSave.failure.message").toString(),
variant: "danger",
});
} finally {
this.savingProfile = false;
}
await Promise.all([
this.userStore.retrieveContactChange(),
this.userStore.retrieveUser(),
]);
}
},
triggerFetchOptions(search: string) {
......
......@@ -254,13 +254,15 @@ export const useUserStore = defineStore({
}
},
async updateUser(user: UserObject) {
async updateUser(user: UserObject): Promise<boolean> {
const notificationStore = useNotificationStore();
try {
await UserApi.userUpdateUser(user);
return true;
} catch (error) {
// Handle other Status Codes
notificationStore.postApiErrorNotification(error as AxiosError);
return false;
}
},
......
.multiselect__placeholder {
color: var(--gray) !important;
color: var(--gray);
/* Value taken from bootstrap */
font-size: 1rem;
/* All bellow is to center the gray placeholder vertically */
padding: 0px !important;
margin: 0 !important;
padding: 0px;
margin: 0;
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
......@@ -13,59 +13,64 @@
.multiselect__option--highlight {
/* Color for when an option IS NOT selected and hovered on */
background: var(--primary) !important;
background: var(--primary);
}
.multiselect__option--selected.multiselect__option--highlight,
.multiselect__option--highlight:after {
/* Color for when an option IS selected and hovered on */
background: var(--primary) !important;
background: var(--primary);
}
.multiselect__input,
.multiselect__single {
padding: 0px !important;
margin: 0px !important;
padding: 0px;
margin: 0px;
/* All bellow is to center the placeholder vertically when active */
-ms-transform: translateY(15%) !important;
transform: translateY(15%) !important;
-ms-transform: translateY(15%);
transform: translateY(15%);
}
.multiselect__tags {
/* Values taken from bootstrap */
padding-left: 0.75rem !important;
padding-top: 0.375rem !important;
padding-bottom: 0.375rem !important;
min-height: calc(1.5rem + 0.75rem + 2px) !important;
padding-left: 0.75rem;
padding-top: 0.375rem;
padding-bottom: 0.375rem;
min-height: calc(1.5rem + 0.75rem + 2px);
background-color: transparent;
}
.multiselect__tags-wrap {
margin: 0 !important;
padding: 0 !important;
margin: 0;
padding: 0;
}
.multiselect__tag {
background: var(--primary) !important;
color: var(--white) !important;
margin-bottom: 0px !important;
margin-right: 5px !important;
background: var(--primary);
color: var(--white);
margin-bottom: 0px;
margin-right: 5px;
}
.multiselect__tag-icon:after {
color: var(--secondary) !important;
color: var(--secondary);
}
.multiselect__spinner:before,
.multiselect__spinner:after {
border-color: var(--primary) transparent transparent !important;
border-color: var(--primary) transparent transparent;
}
.multiselect__tag-icon:focus,
.multiselect__tag-icon:hover {
background: transparent !important;
background: transparent;
}
.multiselect__tag-icon:focus:after,
.multiselect__tag-icon:hover:after {
color: var(--white) !important;
color: var(--white);
}
.multiselect--disabled {
border-radius: 0.25rem;
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment