diff --git a/src/router/index.ts b/src/router/index.ts index 7c4188f0c4952115953da9fd261d427db063d1e6..5b0b11e881bae9c07d7492bce00f49088edd0a5a 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -31,8 +31,9 @@ const router = createRouter({ title: "Login", }, props: (route) => ({ - returnPath: route.query.return_path ?? undefined, + returnPath: route.query.next ?? undefined, loginError: route.query.login_error ?? undefined, + invitationToken: route.query.invitation_token ?? undefined, }), }, { diff --git a/src/views/LoginView.vue b/src/views/LoginView.vue index d8fff7e2c5388fac61202a07b026f88c7163eb78..497002b5f1fb62129ecfbf1e9381a5cebec048f2 100644 --- a/src/views/LoginView.vue +++ b/src/views/LoginView.vue @@ -11,6 +11,7 @@ const router = useRouter(); const props = defineProps<{ returnPath?: string; loginError?: string; + invitationToken?: string; }>(); const store = useUserStore(); @@ -24,9 +25,17 @@ onBeforeMount(() => { } }); -const returnPathQuery = computed<string>(() => - props.returnPath ? `&next=${encodeURI(props.returnPath)}` : "", -); +const loginPath = computed<string>(() => { + const loginUrl = new URL(`${OpenAPI.BASE}/auth/login?provider=lifescience`); + console.log(props); + if (props.returnPath) { + loginUrl.searchParams.append("next", encodeURI(props.returnPath)); + } + if (props.invitationToken) { + loginUrl.searchParams.append("invitation_token", props.invitationToken); + } + return loginUrl.href; +}); onMounted(() => { errorToast = new Toast("#loginErrorToast"); @@ -69,15 +78,16 @@ onMounted(() => { <div class="card text-center ms-md-auto position-fixed top-50 start-50 translate-middle shadow" > - <div class="card-header">Login</div> + <div v-if="invitationToken" class="card-header">Invitation</div> + <div v-else class="card-header">Login</div> <div class="card-body"> - <p class="card-text text-secondary"> + <p v-if="invitationToken" class="card-text text-secondary"> + Connect your CloWM account with your LifeScience account + </p> + <p v-else class="card-text text-secondary"> Login to this service with LifeScience </p> - <a - :href="`${OpenAPI.BASE}/auth/login?provider=lifescience${returnPathQuery}`" - class="m-2" - > + <a :href="loginPath" class="m-2"> <img src="/src/assets/images/ls-login.png" alt="[LS Login]" /> </a> </div>