pkp/pkp-lib#9992 migrate workflow page to side modal

src/components/Container/WorkflowPage.vue

@@ -9,6 +9,8 @@ import PkpHeader from '@/components/Header/Header.vue';
 import LocalizeSubmission from '@/mixins/localizeSubmission.js';
 import ajaxError from '@/mixins/ajaxError';
 import dialog from '@/mixins/dialog.js';
+import SelectRevisionDecisionModal from '@/pages/workflow/SelectRevisionDecisionModal.vue';
+import {useModal} from '@/composables/useModal';
 
 export default {
 	name: 'WorkflowPage',
@@ -55,8 +57,6 @@ export default {
 			versionConfirmMessage: '',
 			versionConfirmTitle: '',
 			workingPublication: null,
-			isModalOpenedSelectRevisionDecision: false,
-			isModalOpenedSelectRevisionRecommendation: false,
 		};
 	},
 	computed: {
@@ -148,13 +148,25 @@ export default {
 		pkp.eventBus.$on('decision:revisions', (reviewRoundId) => {
 			this.components.selectRevisionDecision.hiddenFields['reviewRoundId'] =
 				reviewRoundId;
-			this.isModalOpenedSelectRevisionDecision = true;
+			const {openSideModal} = useModal();
+			openSideModal(SelectRevisionDecisionModal, {
+				activeForm: this.components.selectRevisionDecision,
+				onSet: this.set,
+				onGoToRevisionDecision: this.goToRevisionDecision,
+			});
 		});
 		pkp.eventBus.$on('recommendation:revisions', (reviewRoundId) => {
 			this.components.selectRevisionRecommendation.hiddenFields[
 				'reviewRoundId'
 			] = reviewRoundId;
-			this.isModalOpenedSelectRevisionRecommendation = true;
+
+			const {openSideModal} = useModal();
+
+			openSideModal(SelectRevisionDecisionModal, {
+				activeForm: this.components.selectRevisionRecommendation,
+				onSet: this.set,
+				onGoToRevisionDecision: this.goToRevisionDecision,
+			});
 		});
 
 		/**

src/pages/workflow/SelectRevisionDecisionModal.vue

@@ -0,0 +1,26 @@
+<template>
+	<SideModalBody>
+		<template #title>
+			{{ t('editor.submission.revisions') }}
+		</template>
+		<SideModalLayoutBasic>
+			<PkpForm
+				v-bind="activeForm"
+				@set="(...args) => emit('set', ...args)"
+				@success="(...args) => emit('goToRevisionDecision', ...args)"
+			/>
+		</SideModalLayoutBasic>
+	</SideModalBody>
+</template>
+
+<script setup>
+import SideModalBody from '@/components/Modal/SideModalBody.vue';
+import SideModalLayoutBasic from '@/components/Modal/SideModalLayoutBasic.vue';
+import PkpForm from '@/components/Form/Form.vue';
+import {useLocalize} from '@/composables/useLocalize';
+defineProps({
+	activeForm: {type: Object, required: true},
+});
+const {t} = useLocalize();
+const emit = defineEmits(['set', 'goToRevisionDecision']);
+</script>