add invitation types

Author: ipula

public/globals.js

@@ -1014,6 +1014,11 @@ window.pkp = {
 			"Once the user is enabled, they will regain access to OJS, and you'll be able to invite them to roles as needed.",
 		'grid.user.grid.user.disableReasonDescription':
 			"Please note that once a user is disabled, you won't be able to add them to any roles until they are enabled again.",
+		'reviewer.responseDueDate':'Review Response Date',
+		'reviewer.reviewDueDate':'Review Response Due Date',
+		'reviewer.reviewTypes':'Review Types',
+		'reviewerInvitation.modal.message':'{$email} has been invited to review the submission "{$articleTitle}"<br><br> You can be updated about the user\'s descision on the reviewer panel in the review workflow or through email and OJS notifications',
+		'reviewerInvitation.modal.button':'View submission'
 	},
 	tinyMCE: {
 		skinUrl: '/styles/tinymce',

src/pages/userInvitation/ReviewerReviewDetailsStep.vue

@@ -0,0 +1,69 @@
+<template>
+	<FieldOptions
+		:is-required="false"
+		component="field-options"
+		:all-errors="{}"
+		name="reviewTypes"
+		:label="t('reviewer.reviewTypes')"
+		type="radio"
+		:options="options"
+		@change="
+			(fieldName, propName, newValue, localeKey) =>
+				updateReviewDetails(index, fieldName, newValue)
+		"
+	/>
+	<div class="p-8">
+		<FieldText
+			name="responseDueDate"
+			:label="t('reviewer.responseDueDate')"
+			input-type="date"
+			:is-required="true"
+			value=""
+			:all-errors="{}"
+			@change="
+				(fieldName, propName, newValue, localeKey) =>
+					updateReviewDetails(index, fieldName, newValue)
+			"
+		/>
+		<FieldText
+			name="reviewDueDate"
+			:label="t('reviewer.reviewDueDate')"
+			input-type="date"
+			:is-required="true"
+			value=""
+			:all-errors="{}"
+			@change="
+				(fieldName, propName, newValue, localeKey) =>
+					updateReviewDetails(index, fieldName, newValue)
+			"
+		/>
+	</div>
+</template>
+<script setup>
+import {defineProps} from 'vue';
+import FieldOptions from '@/components/Form/fields/FieldOptions.vue';
+import FieldText from '@/components/Form/fields/FieldText.vue';
+import {useLocalize} from '@/composables/useLocalize';
+import {useUserInvitationPageStore} from './UserInvitationPageStore';
+
+defineProps({
+	validateFields: {
+		type: Array,
+		default() {
+			return null;
+		},
+	},
+});
+
+const store = useUserInvitationPageStore();
+const {t} = useLocalize();
+const options = [
+	{value: 'anonymus', label: 'Anonymus Reviewer / Anonymus Author'},
+	{value: 'disclosed', label: 'Anonymus Reviewer / Disclosed Author'},
+	{value: 'open', label: 'open'},
+];
+
+function updateReviewDetails(index, fieldName, newValue) {
+	store.updatePayload(fieldName, newValue, false);
+}
+</script>

src/pages/userInvitation/UserInvitationPageStore.js

@@ -7,6 +7,7 @@ import {useModal} from '@/composables/useModal';
 export const useUserInvitationPageStore = defineComponentStore(
 	'userInvitationPage',
 	(pageInitConfig) => {
+		const INVITATION_USER_ROLE_ASSIGNMENT = 'userRoleAssignment';
 		const {openDialog} = useModal();
 		const {t} = useLocalize();
 		/**
@@ -339,12 +340,21 @@ export const useUserInvitationPageStore = defineComponentStore(
 				if (data.value) {
 					openDialog({
 						title: t('userInvitation.modal.title'),
-						message: t('userInvitation.modal.message', {
-							email: invitationPayload.value.inviteeEmail,
-						}),
+						message:
+							invitationType.value === INVITATION_USER_ROLE_ASSIGNMENT
+								? t('userInvitation.modal.message', {
+										email: invitationPayload.value.inviteeEmail,
+									})
+								: t('reviewerInvitation.modal.message', {
+										email: invitationPayload.value.inviteeEmail,
+										articleTitle: '',
+									}),
 						actions: [
 							{
-								label: t('userInvitation.modal.button'),
+								label:
+									invitationType.value === INVITATION_USER_ROLE_ASSIGNMENT
+										? t('userInvitation.modal.button')
+										: t('reviewerInvitation.modal.button'),
 								callback: (close) => {
 									redirectToPage();
 								},