diff --git a/src/app/submission/edit/submission-edit.component.html b/src/app/submission/edit/submission-edit.component.html index 9c0e9eae72..71702d8c7d 100644 --- a/src/app/submission/edit/submission-edit.component.html +++ b/src/app/submission/edit/submission-edit.component.html @@ -1,10 +1,10 @@
- + [submissionId]="submissionId">
diff --git a/src/app/submission/form/footer/themed-submission-form-footer.component.ts b/src/app/submission/form/footer/themed-submission-form-footer.component.ts new file mode 100644 index 0000000000..041a090f32 --- /dev/null +++ b/src/app/submission/form/footer/themed-submission-form-footer.component.ts @@ -0,0 +1,27 @@ +import { ThemedComponent } from '../../../shared/theme-support/themed.component'; +import { SubmissionFormFooterComponent } from './submission-form-footer.component'; +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'ds-themed-submission-form-footer', + styleUrls: [], + templateUrl: '../../../shared/theme-support/themed.component.html', +}) +export class ThemedSubmissionFormFooterComponent extends ThemedComponent { + @Input() submissionId: string; + + protected inAndOutputNames: (keyof SubmissionFormFooterComponent & keyof this)[] = ['submissionId']; + + protected getComponentName(): string { + return 'SubmissionFormFooterComponent'; + } + + protected importThemedComponent(themeName: string): Promise { + return import(`../../../../themes/${themeName}/app/submission/form/footer/submission-form-footer.component`); + } + + protected importUnthemedComponent(): Promise { + return import(`./submission-form-footer.component`); + } + +} diff --git a/src/app/submission/form/submission-form.component.html b/src/app/submission/form/submission-form.component.html index 802d0e1c4c..fc424ed60d 100644 --- a/src/app/submission/form/submission-form.component.html +++ b/src/app/submission/form/submission-form.component.html @@ -31,18 +31,18 @@
@if ((isLoading() | async)) { - + } @for (object of $any(submissionSections | async); track object) { - - + }
@if ((isLoading() | async) !== true) {
- +
} diff --git a/src/app/submission/form/themed-submission-form.component.ts b/src/app/submission/form/themed-submission-form.component.ts new file mode 100644 index 0000000000..96b5ecebd5 --- /dev/null +++ b/src/app/submission/form/themed-submission-form.component.ts @@ -0,0 +1,44 @@ +import { ThemedComponent } from '../../shared/theme-support/themed.component'; +import { SubmissionFormComponent } from './submission-form.component'; +import { Component, Input } from '@angular/core'; +import { Item } from '../../core/shared/item.model'; +import { WorkspaceitemSectionsObject } from '../../core/submission/models/workspaceitem-sections.model'; +import { SubmissionError } from '../objects/submission-error.model'; +import { SubmissionDefinitionsModel } from '../../core/config/models/config-submission-definitions.model'; + +@Component({ + selector: 'ds-themed-submission-form', + styleUrls: [], + templateUrl: '../../shared/theme-support/themed.component.html', +}) +export class ThemedSubmissionFormComponent extends ThemedComponent { + @Input() collectionId: string; + + @Input() item: Item; + + @Input() collectionModifiable: boolean | null = null; + + @Input() sections: WorkspaceitemSectionsObject; + + @Input() submissionErrors: SubmissionError; + + @Input() selfUrl: string; + + @Input() submissionDefinition: SubmissionDefinitionsModel; + + @Input() submissionId: string; + + protected inAndOutputNames: (keyof SubmissionFormComponent & keyof this)[] = ['collectionId', 'item', 'collectionModifiable', 'sections', 'submissionErrors', 'selfUrl', 'submissionDefinition', 'submissionId']; + + protected getComponentName(): string { + return 'SubmissionFormComponent'; + } + + protected importThemedComponent(themeName: string): Promise { + return import(`../../../themes/${themeName}/app/submission/form/submission-form.component`); + } + + protected importUnthemedComponent(): Promise { + return import(`./submission-form.component`); + } +} diff --git a/src/app/submission/sections/container/themed-section-container.component.ts b/src/app/submission/sections/container/themed-section-container.component.ts new file mode 100644 index 0000000000..11ec6b63d7 --- /dev/null +++ b/src/app/submission/sections/container/themed-section-container.component.ts @@ -0,0 +1,29 @@ +import { ThemedComponent } from '../../../shared/theme-support/themed.component'; +import { SubmissionSectionContainerComponent } from './section-container.component'; +import { Component, Input } from '@angular/core'; +import { SectionDataObject } from '../models/section-data.model'; + +@Component({ + selector: 'ds-themed-submission-section-container', + styleUrls: [], + templateUrl: '../../../shared/theme-support/themed.component.html', +}) +export class ThemedSubmissionSectionContainerComponent extends ThemedComponent { + @Input() collectionId: string; + @Input() sectionData: SectionDataObject; + @Input() submissionId: string; + + protected inAndOutputNames: (keyof SubmissionSectionContainerComponent & keyof this)[] = ['collectionId', 'sectionData', 'submissionId']; + + protected getComponentName(): string { + return 'SubmissionSectionContainerComponent'; + } + + protected importThemedComponent(themeName: string): Promise { + return import(`../../../../themes/${themeName}/app/submission/sections/container/section-container.component`); + } + + protected importUnthemedComponent(): Promise { + return import(`./section-container.component`); + } +} diff --git a/src/app/submission/submission.module.ts b/src/app/submission/submission.module.ts new file mode 100644 index 0000000000..c710b3b297 --- /dev/null +++ b/src/app/submission/submission.module.ts @@ -0,0 +1,161 @@ +import { NgModule } from '@angular/core'; +import { CoreModule } from '../core/core.module'; +import { SharedModule } from '../shared/shared.module'; + +import { SubmissionSectionFormComponent } from './sections/form/section-form.component'; +import { SectionsDirective } from './sections/sections.directive'; +import { SectionsService } from './sections/sections.service'; +import { SubmissionFormCollectionComponent } from './form/collection/submission-form-collection.component'; +import { SubmissionFormFooterComponent } from './form/footer/submission-form-footer.component'; +import { SubmissionFormComponent } from './form/submission-form.component'; +import { SubmissionFormSectionAddComponent } from './form/section-add/submission-form-section-add.component'; +import { SubmissionSectionContainerComponent } from './sections/container/section-container.component'; +import { CommonModule } from '@angular/common'; +import { Action, StoreConfig, StoreModule } from '@ngrx/store'; +import { EffectsModule } from '@ngrx/effects'; +import { submissionReducers, SubmissionState } from './submission.reducers'; +import { submissionEffects } from './submission.effects'; +import { SubmissionSectionUploadComponent } from './sections/upload/section-upload.component'; +import { SectionUploadService } from './sections/upload/section-upload.service'; +import { SubmissionUploadFilesComponent } from './form/submission-upload-files/submission-upload-files.component'; +import { SubmissionSectionLicenseComponent } from './sections/license/section-license.component'; +import { SubmissionUploadsConfigDataService } from '../core/config/submission-uploads-config-data.service'; +import { SubmissionEditComponent } from './edit/submission-edit.component'; +import { SubmissionSectionUploadFileComponent } from './sections/upload/file/section-upload-file.component'; +import { + SubmissionSectionUploadFileEditComponent +} from './sections/upload/file/edit/section-upload-file-edit.component'; +import { + SubmissionSectionUploadFileViewComponent +} from './sections/upload/file/view/section-upload-file-view.component'; +import { + SubmissionSectionUploadAccessConditionsComponent +} from './sections/upload/accessConditions/submission-section-upload-access-conditions.component'; +import { SubmissionSubmitComponent } from './submit/submission-submit.component'; +import { storeModuleConfig } from '../app.reducer'; +import { SubmissionImportExternalComponent } from './import-external/submission-import-external.component'; +import { + SubmissionImportExternalSearchbarComponent +} from './import-external/import-external-searchbar/submission-import-external-searchbar.component'; +import { + SubmissionImportExternalPreviewComponent +} from './import-external/import-external-preview/submission-import-external-preview.component'; +import { + SubmissionImportExternalCollectionComponent +} from './import-external/import-external-collection/submission-import-external-collection.component'; +import { SubmissionSectionCcLicensesComponent } from './sections/cc-license/submission-section-cc-licenses.component'; +import { JournalEntitiesModule } from '../entity-groups/journal-entities/journal-entities.module'; +import { ResearchEntitiesModule } from '../entity-groups/research-entities/research-entities.module'; +import { ThemedSubmissionEditComponent } from './edit/themed-submission-edit.component'; +import { ThemedSubmissionSubmitComponent } from './submit/themed-submission-submit.component'; +import { ThemedSubmissionImportExternalComponent } from './import-external/themed-submission-import-external.component'; +import { ThemedSubmissionSectionUploadFileComponent } from './sections/upload/file/themed-section-upload-file.component'; +import { FormModule } from '../shared/form/form.module'; +import { NgbAccordionModule, NgbCollapseModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; +import { SubmissionSectionAccessesComponent } from './sections/accesses/section-accesses.component'; +import { SubmissionAccessesConfigDataService } from '../core/config/submission-accesses-config-data.service'; +import { SectionAccessesService } from './sections/accesses/section-accesses.service'; +import { SubmissionSectionSherpaPoliciesComponent } from './sections/sherpa-policies/section-sherpa-policies.component'; +import { ContentAccordionComponent } from './sections/sherpa-policies/content-accordion/content-accordion.component'; +import { PublisherPolicyComponent } from './sections/sherpa-policies/publisher-policy/publisher-policy.component'; +import { + PublicationInformationComponent +} from './sections/sherpa-policies/publication-information/publication-information.component'; +import { UploadModule } from '../shared/upload/upload.module'; +import { + MetadataInformationComponent +} from './sections/sherpa-policies/metadata-information/metadata-information.component'; +import { SectionFormOperationsService } from './sections/form/section-form-operations.service'; +import {SubmissionSectionIdentifiersComponent} from './sections/identifiers/section-identifiers.component'; +import { ThemedSubmissionSectionContainerComponent } from './sections/container/themed-section-container.component'; +import { ThemedSubmissionFormFooterComponent } from './form/footer/themed-submission-form-footer.component'; +import { ThemedSubmissionFormComponent } from './form/themed-submission-form.component'; + +const ENTRY_COMPONENTS = [ + // put only entry components that use custom decorator + SubmissionSectionUploadComponent, + SubmissionSectionFormComponent, + SubmissionSectionLicenseComponent, + SubmissionSectionCcLicensesComponent, + SubmissionSectionAccessesComponent, + SubmissionSectionSherpaPoliciesComponent, +]; + +const DECLARATIONS = [ + ...ENTRY_COMPONENTS, + SectionsDirective, + SubmissionEditComponent, + ThemedSubmissionEditComponent, + SubmissionFormSectionAddComponent, + SubmissionFormCollectionComponent, + SubmissionFormComponent, + SubmissionFormFooterComponent, + SubmissionSubmitComponent, + ThemedSubmissionSubmitComponent, + SubmissionUploadFilesComponent, + SubmissionSectionContainerComponent, + SubmissionSectionUploadAccessConditionsComponent, + SubmissionSectionUploadFileComponent, + SubmissionSectionUploadFileEditComponent, + SubmissionSectionUploadFileViewComponent, + SubmissionSectionIdentifiersComponent, + SubmissionImportExternalComponent, + ThemedSubmissionImportExternalComponent, + SubmissionImportExternalSearchbarComponent, + SubmissionImportExternalPreviewComponent, + SubmissionImportExternalCollectionComponent, + ContentAccordionComponent, + PublisherPolicyComponent, + PublicationInformationComponent, + MetadataInformationComponent, + ThemedSubmissionSectionUploadFileComponent, + ThemedSubmissionSectionContainerComponent, + ThemedSubmissionFormFooterComponent, + ThemedSubmissionFormComponent, +]; + +@NgModule({ + imports: [ + CommonModule, + CoreModule.forRoot(), + SharedModule, + StoreModule.forFeature('submission', submissionReducers, storeModuleConfig as StoreConfig), + EffectsModule.forFeature(submissionEffects), + JournalEntitiesModule.withEntryComponents(), + ResearchEntitiesModule.withEntryComponents(), + FormModule, + NgbModalModule, + NgbCollapseModule, + NgbAccordionModule, + UploadModule, + ], + declarations: DECLARATIONS, + exports: [ + ...DECLARATIONS, + FormModule, + ], + providers: [ + SectionUploadService, + SectionsService, + SubmissionUploadsConfigDataService, + SubmissionAccessesConfigDataService, + SectionAccessesService, + SectionFormOperationsService, + ] +}) + +/** + * This module handles all components that are necessary for the submission process + */ +export class SubmissionModule { + /** + * NOTE: this method allows to resolve issue with components that using a custom decorator + * which are not loaded during SSR otherwise + */ + static withEntryComponents() { + return { + ngModule: SubmissionModule, + providers: ENTRY_COMPONENTS.map((component) => ({ provide: component })) + }; + } +} diff --git a/src/themes/custom/app/submission/form/footer/submission-form-footer.component.html b/src/themes/custom/app/submission/form/footer/submission-form-footer.component.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/form/footer/submission-form-footer.component.scss b/src/themes/custom/app/submission/form/footer/submission-form-footer.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/form/footer/submission-form-footer.component.ts b/src/themes/custom/app/submission/form/footer/submission-form-footer.component.ts new file mode 100644 index 0000000000..3a93410edf --- /dev/null +++ b/src/themes/custom/app/submission/form/footer/submission-form-footer.component.ts @@ -0,0 +1,15 @@ +import { + SubmissionFormFooterComponent as BaseComponent +} from '../../../../../../app/submission/form/footer/submission-form-footer.component'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'ds-submission-form-footer', + // styleUrls: ['./submission-form-footer.component.scss'], + styleUrls: ['../../../../../../app/submission/form/footer/submission-form-footer.component.scss'], + // templateUrl: './submission-form-footer.component.html' + templateUrl: '../../../../../../app/submission/form/footer/submission-form-footer.component.html' +}) +export class SubmissionFormFooterComponent extends BaseComponent { + +} diff --git a/src/themes/custom/app/submission/form/submission-form.component.html b/src/themes/custom/app/submission/form/submission-form.component.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/form/submission-form.component.scss b/src/themes/custom/app/submission/form/submission-form.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/form/submission-form.component.ts b/src/themes/custom/app/submission/form/submission-form.component.ts new file mode 100644 index 0000000000..15b52a2657 --- /dev/null +++ b/src/themes/custom/app/submission/form/submission-form.component.ts @@ -0,0 +1,15 @@ +import { + SubmissionFormComponent as BaseComponent +} from '../../../../../app/submission/form/submission-form.component'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'ds-submission-form', + // styleUrls: ['./submission-form.component.scss'], + styleUrls: ['../../../../../app/submission/form/submission-form.component.scss'], + // templateUrl: './submission-form.component.html' + templateUrl: '../../../../../app/submission/form/submission-form.component.html' +}) +export class SubmissionFormComponent extends BaseComponent { + +} diff --git a/src/themes/custom/app/submission/sections/container/section-container.component.html b/src/themes/custom/app/submission/sections/container/section-container.component.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/sections/container/section-container.component.scss b/src/themes/custom/app/submission/sections/container/section-container.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/themes/custom/app/submission/sections/container/section-container.component.ts b/src/themes/custom/app/submission/sections/container/section-container.component.ts new file mode 100644 index 0000000000..fcb6855f78 --- /dev/null +++ b/src/themes/custom/app/submission/sections/container/section-container.component.ts @@ -0,0 +1,15 @@ +import { + SubmissionSectionContainerComponent as BaseComponent +} from '../../../../../../app/submission/sections/container/section-container.component'; +import { Component } from '@angular/core'; + +@Component({ + selector: 'ds-submission-upload-section-file', + // styleUrls: ['./section-container.component.scss'], + styleUrls: ['../../../../../../app/submission/sections/container/section-container.component.scss'], + // templateUrl: './section-container.component.html' + templateUrl: '../../../../../../app/submission/sections/container/section-container.component.html' +}) +export class SubmissionSectionContainerComponent extends BaseComponent { + +} diff --git a/src/themes/custom/lazy-theme.module.ts b/src/themes/custom/lazy-theme.module.ts index cd677847ce..a3f4e21d07 100644 --- a/src/themes/custom/lazy-theme.module.ts +++ b/src/themes/custom/lazy-theme.module.ts @@ -108,7 +108,9 @@ import { ThumbnailComponent } from './app/thumbnail/thumbnail.component'; import { WorkflowItemDeleteComponent } from './app/workflowitems-edit-page/workflow-item-delete/workflow-item-delete.component'; import { WorkflowItemSendBackComponent } from './app/workflowitems-edit-page/workflow-item-send-back/workflow-item-send-back.component'; import { WorkspaceItemsDeletePageComponent } from './app/workspaceitems-edit-page/workspaceitems-delete-page/workspaceitems-delete-page.component'; - +import { SubmissionSectionContainerComponent } from './app/submission/sections/container/section-container.component'; +import { SubmissionFormFooterComponent } from './app/submission/form/footer/submission-form-footer.component'; +import { SubmissionFormComponent } from './app/submission/form/submission-form.component'; const DECLARATIONS = [ FileSectionComponent, @@ -204,6 +206,9 @@ const DECLARATIONS = [ AdminSearchPageComponent, AdminWorkflowPageComponent, SearchResultsSkeletonComponent, + SubmissionSectionContainerComponent, + SubmissionFormFooterComponent, + SubmissionFormComponent, ]; @NgModule({