From a8b820ea206b6bcb56cc1e7fa82c529fba04b352 Mon Sep 17 00:00:00 2001
From: Bogdan Cochior <bogdan.cochior@thinslices.com>
Date: Fri, 19 Jan 2018 13:20:21 +0200
Subject: [PATCH] Minor changes for UI
---
.../src/components/WizardStep.js | 10 +-
.../app/config/journal/submission-wizard.js | 328 ++++++++++++++++++
.../app/config/journal/submit-wizard.js | 43 ++-
3 files changed, 374 insertions(+), 7 deletions(-)
create mode 100644 packages/xpub-collabra/app/config/journal/submission-wizard.js
diff --git a/packages/component-wizard/src/components/WizardStep.js b/packages/component-wizard/src/components/WizardStep.js
index afd2ba1fe..dde7bcf9f 100644
--- a/packages/component-wizard/src/components/WizardStep.js
+++ b/packages/component-wizard/src/components/WizardStep.js
@@ -23,10 +23,12 @@ export default ({
<div className={classnames(classes.step)}>
<form className={classnames(classes.form)} onSubmit={handleSubmit}>
<h3 className={classnames(classes.title)}>{title}</h3>
- <p
- className={classnames(classes.subtitle)}
- dangerouslySetInnerHTML={{ __html: subtitle }} // eslint-disable-line
- />
+ {subtitle && (
+ <div
+ className={classnames(classes.subtitle)}
+ dangerouslySetInnerHTML={{ __html: subtitle }} // eslint-disable-line
+ />
+ )}
{stepChildren &&
stepChildren.map(
({
diff --git a/packages/xpub-collabra/app/config/journal/submission-wizard.js b/packages/xpub-collabra/app/config/journal/submission-wizard.js
new file mode 100644
index 000000000..238c25426
--- /dev/null
+++ b/packages/xpub-collabra/app/config/journal/submission-wizard.js
@@ -0,0 +1,328 @@
+import React from 'react'
+import { AbstractEditor, TitleEditor, NoteEditor } from 'xpub-edit'
+import {
+ Menu,
+ CheckboxGroup,
+ RadioGroup,
+ TextField,
+ Supplementary,
+} from '@pubsweet/ui'
+import uploadFileFn from 'xpub-upload'
+import {
+ required,
+ minChars,
+ maxChars,
+ minSize,
+ join,
+ split,
+} from 'xpub-validators'
+
+import articleTypes from './article-types'
+import articleSections from './article-sections'
+import declarations from './declarations'
+
+const minSize1 = minSize(1)
+const minChars20 = minChars(20)
+const minChars100 = minChars(100)
+const maxChars500 = maxChars(500)
+const maxChars5000 = maxChars(5000)
+const joinComma = join(',')
+const splitComma = split(',')
+
+const DeclarationInput = ({ label, ...rest }) => (
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <label style={{ display: 'inline-block', marginTop: '15px' }}>
+ {label}
+ </label>{' '}
+ <RadioGroup inline {...rest} />
+ </div>
+)
+const Spacing = () => <div style={{ width: '100%', height: '30px' }} />
+const Label = ({ label }) => (
+ <label
+ style={{ display: 'inline-block', marginTop: '15px', marginBottom: '5px' }}
+ >
+ <b>{label}</b>
+ </label>
+)
+const SubLabel = ({ label }) => (
+ <label
+ style={{ display: 'inline-block', marginTop: '10px', marginBottom: '5px' }}
+ >
+ {label}
+ </label>
+)
+
+const uploadFile = input => uploadFileFn(input)
+
+export default {
+ showProgress: false,
+ submitText: 'Submit your manuscript',
+ backText: 'Back',
+ cancelText: 'Cancel',
+ nextText: 'Next',
+ formSectionKeys: [
+ 'metadata',
+ 'declarations',
+ 'suggestions',
+ 'notes',
+ 'files',
+ ],
+ dispatchFunctions: [uploadFile],
+ steps: [
+ {
+ label: 'Submission information',
+ title: 'Submission information',
+ subtitle: `We have ingested your manuscript. To access your manuscript in an editor, please view manuscript page.
+ <br/> To complete your submission, please answer the following questions. <br/>
+ The answers will be automatically saved.`,
+ children: [
+ {
+ fieldId: 'metadata.title',
+ renderComponent: TitleEditor,
+ placeholder: 'Title',
+ title: 'Title',
+ validate: [required, minChars20, maxChars500],
+ },
+ {
+ fieldId: 'spacing-0',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'metadata.abstract',
+ renderComponent: AbstractEditor,
+ title: 'Abstract',
+ placeholder: 'Write an abstract',
+ validate: [required, minChars100, maxChars5000],
+ },
+ {
+ fieldId: 'spacing-authors',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-authors',
+ renderComponent: Label,
+ label: 'Authors',
+ },
+ {
+ fieldId: 'metadata.authors',
+ renderComponent: TextField,
+ title: 'Authors',
+ placeholder: 'Enter author names...',
+ format: join(),
+ parse: split(),
+ validate: [minSize1],
+ },
+ {
+ fieldId: 'spacing-Keywords',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-Keywords',
+ renderComponent: Label,
+ label: 'Keywords',
+ },
+ {
+ fieldId: 'metadata.keywords',
+ renderComponent: TextField,
+ title: 'Authors',
+ placeholder: 'Enter keywords...',
+ format: join(),
+ parse: split(),
+ validate: [minSize1],
+ },
+ {
+ fieldId: 'spacing-article',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-article',
+ renderComponent: Label,
+ label: 'Article Type',
+ },
+ {
+ fieldId: 'metadata.articleType',
+ renderComponent: Menu,
+ options: articleTypes,
+ validate: [required],
+ },
+ {
+ fieldId: 'spacing-section',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'metadata.articleSection',
+ renderComponent: CheckboxGroup,
+ label: 'Section',
+ options: articleSections,
+ validate: [required],
+ },
+ {
+ fieldId: 'spacing-decl',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: `declarations.${declarations.questions[0].id}`,
+ label: declarations.questions[0].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: `declarations.${declarations.questions[1].id}`,
+ label: declarations.questions[1].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: `declarations.${declarations.questions[2].id}`,
+ label: declarations.questions[2].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: `declarations.${declarations.questions[3].id}`,
+ label: declarations.questions[3].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: `declarations.${declarations.questions[4].id}`,
+ label: declarations.questions[4].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: `declarations.${declarations.questions[5].id}`,
+ label: declarations.questions[5].legend,
+ renderComponent: DeclarationInput,
+ options: [
+ { value: 'yes', label: 'Yes' },
+ { value: 'no', label: 'No' },
+ ],
+ validate: [required],
+ },
+ {
+ fieldId: 'spacing-rev',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-reviewers',
+ renderComponent: Label,
+ label: 'Reviewers',
+ },
+ {
+ fieldId: 'label-rev-suggested',
+ renderComponent: SubLabel,
+ label: 'Suggested reviewers',
+ },
+ {
+ fieldId: 'suggestions.reviewers.suggested',
+ renderComponent: TextField,
+ title: 'Suggested reviewers',
+ placeholder: 'Add reviewers names...',
+ format: joinComma,
+ parse: splitComma,
+ },
+ {
+ fieldId: 'label-rev-Opposed',
+ renderComponent: SubLabel,
+ label: 'Opposed reviewers',
+ },
+ {
+ fieldId: 'suggestions.reviewers.opposed',
+ renderComponent: TextField,
+ title: 'Opposed reviewers',
+ placeholder: 'Add opposed reviewers names...',
+ format: joinComma,
+ parse: splitComma,
+ },
+ {
+ fieldId: 'label-Editors',
+ renderComponent: Label,
+ label: 'Editors',
+ },
+ {
+ fieldId: 'label-editors-suggested',
+ renderComponent: SubLabel,
+ label: 'Suggested Editors',
+ },
+ {
+ fieldId: 'suggestions.editors.suggested',
+ renderComponent: TextField,
+ title: 'Suggested editors',
+ placeholder: 'Add editors names...',
+ format: joinComma,
+ parse: splitComma,
+ },
+ {
+ fieldId: 'label-editors-Opposed',
+ renderComponent: SubLabel,
+ label: 'Opposed Editors',
+ },
+ {
+ fieldId: 'suggestions.editors.opposed',
+ renderComponent: TextField,
+ title: 'Opposed editors',
+ placeholder: 'Add opposed editors names...',
+ format: joinComma,
+ parse: splitComma,
+ },
+ {
+ fieldId: 'spacing-funding',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'notes.fundingAcknowledgement',
+ renderComponent: NoteEditor,
+ title: 'Funding body acknowledgement (required)',
+ placeholder: 'Enter an acknowledgment...',
+ validate: [required],
+ },
+ {
+ fieldId: 'spacing-special',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'notes.specialInstructions',
+ renderComponent: NoteEditor,
+ title: 'Special instructions (confidential)',
+ placeholder: 'Enter instructions for the editor…',
+ },
+ {
+ fieldId: 'spacing-files',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-files',
+ renderComponent: Label,
+ label: 'Upload supplementary materials',
+ },
+ {
+ fieldId: 'files.supplementary',
+ label: 'Upload supplementary materials',
+ renderComponent: Supplementary,
+ },
+ ],
+ },
+ ],
+}
diff --git a/packages/xpub-faraday/app/config/journal/submit-wizard.js b/packages/xpub-faraday/app/config/journal/submit-wizard.js
index 6de83e0e5..24a8d827e 100644
--- a/packages/xpub-faraday/app/config/journal/submit-wizard.js
+++ b/packages/xpub-faraday/app/config/journal/submit-wizard.js
@@ -28,6 +28,14 @@ const yesNoWithLabel = ({ label, ...rest }) => (
<YesOrNo {...rest} />
</div>
)
+const Spacing = () => <div style={{ width: '100%', height: '15px' }} />
+const Label = ({ label }) => (
+ <label
+ style={{ display: 'inline-block', marginTop: '15px', marginBottom: '5px' }}
+ >
+ <b>{label}</b>
+ </label>
+)
const journal = {
label: 'Hindawi Faraday',
@@ -45,18 +53,26 @@ export default {
label: 'Journal details',
title: 'Journal & Field Selection',
children: [
+ {
+ fieldId: 'label-Journal',
+ renderComponent: Label,
+ label: 'Journal',
+ },
{
fieldId: 'metadata.journal',
renderComponent: Menu,
- label: 'Journal',
options: [journal],
value: journal.value,
validate: [required],
},
+ {
+ fieldId: 'label-Issue',
+ renderComponent: Label,
+ label: 'Issue',
+ },
{
fieldId: 'metadata.issue',
renderComponent: Menu,
- label: 'Issue',
options: issueTypes,
validate: [required],
},
@@ -88,13 +104,25 @@ export default {
placeholder: 'Manuscript title',
title: 'Manuscript title',
},
+ {
+ fieldId: 'spacing-title',
+ renderComponent: Spacing,
+ },
+ {
+ fieldId: 'label-manuscriptType',
+ renderComponent: Label,
+ label: 'Manuscript Type',
+ },
{
fieldId: 'metadata.type',
renderComponent: Menu,
- label: 'Manuscript type',
options: manuscriptTypes,
validate: [required],
},
+ {
+ fieldId: 'spacing-type',
+ renderComponent: Spacing,
+ },
{
fieldId: 'metadata.abstract',
renderComponent: AbstractEditor,
@@ -102,9 +130,18 @@ export default {
placeholder: 'Write an abstract',
validate: [requiredBasedOnType],
},
+ {
+ fieldId: 'spacing-abstract',
+ renderComponent: Spacing,
+ },
{
fieldId: 'authors',
renderComponent: AuthorList,
+ validate: [required],
+ },
+ {
+ fieldId: 'spacing-authors',
+ renderComponent: Spacing,
},
{
fieldId: 'conflicts.hasConflicts',
--
GitLab