From 8bcdfb98874ba28d5eb2c7659374b2db48fbde67 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Wed, 6 Jan 2021 18:10:28 +0200 Subject: [PATCH] Display rule sets from API --- apps/red-ui/src/app/app.module.ts | 20 ++-- .../admin-breadcrumbs.component.html | 10 +- .../admin-breadcrumbs.component.ts | 10 +- .../project-template-actions.component.ts | 37 -------- .../rule-set-actions.component.html} | 4 +- .../rule-set-actions.component.scss} | 0 .../rule-set-actions.component.ts | 37 ++++++++ .../rule-set-view-switch.component.html} | 0 .../rule-set-view-switch.component.scss} | 0 .../rule-set-view-switch.component.ts} | 16 ++-- apps/red-ui/src/app/dialogs/dialog.service.ts | 21 ++-- .../dictionary-listing-screen.component.html | 5 +- .../dictionary-listing-screen.component.ts | 13 ++- ...-edit-project-template-dialog.component.ts | 55 ----------- ...ject-templates-listing-screen.component.ts | 94 ------------------ .../add-edit-rule-set-dialog.component.html} | 6 +- .../add-edit-rule-set-dialog.component.scss} | 0 .../add-edit-rule-set-dialog.component.ts | 56 +++++++++++ .../rule-sets-listing-screen.component.html} | 33 +++---- .../rule-sets-listing-screen.component.scss} | 0 .../rule-sets-listing-screen.component.ts | 95 +++++++++++++++++++ .../rules-screen/rules-screen.component.html | 5 +- .../rules-screen/rules-screen.component.ts | 12 +-- apps/red-ui/src/app/state/app-state.guard.ts | 1 + .../red-ui/src/app/state/app-state.service.ts | 59 ++++-------- apps/red-ui/src/app/utils/sorting.service.ts | 4 +- libs/red-ui-http/src/lib/api.module.ts | 2 + 27 files changed, 291 insertions(+), 304 deletions(-) delete mode 100644 apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.ts rename apps/red-ui/src/app/components/{project-template-actions/project-template-actions.component.html => rule-set-actions/rule-set-actions.component.html} (79%) rename apps/red-ui/src/app/components/{project-template-actions/project-template-actions.component.scss => rule-set-actions/rule-set-actions.component.scss} (100%) create mode 100644 apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts rename apps/red-ui/src/app/components/{project-template-view-switch/project-template-view-switch.component.html => rule-set-view-switch/rule-set-view-switch.component.html} (100%) rename apps/red-ui/src/app/components/{project-template-view-switch/project-template-view-switch.component.scss => rule-set-view-switch/rule-set-view-switch.component.scss} (100%) rename apps/red-ui/src/app/components/{project-template-view-switch/project-template-view-switch.component.ts => rule-set-view-switch/rule-set-view-switch.component.ts} (53%) delete mode 100644 apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.ts delete mode 100644 apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.ts rename apps/red-ui/src/app/screens/admin/{project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.html => rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.html} (89%) rename apps/red-ui/src/app/screens/admin/{project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.scss => rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.scss} (100%) create mode 100644 apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts rename apps/red-ui/src/app/screens/admin/{project-templates-listing-screen/project-templates-listing-screen.component.html => rule-sets-listing-screen/rule-sets-listing-screen.component.html} (79%) rename apps/red-ui/src/app/screens/admin/{project-templates-listing-screen/project-templates-listing-screen.component.scss => rule-sets-listing-screen/rule-sets-listing-screen.component.scss} (100%) create mode 100644 apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.ts diff --git a/apps/red-ui/src/app/app.module.ts b/apps/red-ui/src/app/app.module.ts index b46078f62..b3f4625ce 100644 --- a/apps/red-ui/src/app/app.module.ts +++ b/apps/red-ui/src/app/app.module.ts @@ -98,10 +98,10 @@ import { HtmlDebugScreenComponent } from './screens/html-debug-screen/html-debug import { ReportDownloadBtnComponent } from './components/buttons/report-download-btn/report-download-btn.component'; import { ProjectListingActionsComponent } from './screens/project-listing-screen/project-listing-actions/project-listing-actions.component'; import { HasScrollbarDirective } from './utils/has-scrollbar.directive'; -import { ProjectTemplatesListingScreenComponent } from './screens/admin/project-templates-listing-screen/project-templates-listing-screen.component'; -import { AddEditProjectTemplateDialogComponent } from './screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component'; -import { ProjectTemplateActionsComponent } from './components/project-template-actions/project-template-actions.component'; -import { ProjectTemplateViewSwitchComponent } from './components/project-template-view-switch/project-template-view-switch.component'; +import { RuleSetsListingScreenComponent } from './screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component'; +import { AddEditRuleSetDialogComponent } from './screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component'; +import { RuleSetActionsComponent } from './components/rule-set-actions/rule-set-actions.component'; +import { RuleSetViewSwitchComponent } from './components/rule-set-view-switch/rule-set-view-switch.component'; import { MatSliderModule } from '@angular/material/slider'; import { PendingChangesGuard } from './utils/can-deactivate.guard'; @@ -178,14 +178,14 @@ const routes = [ children: [ { path: '', - component: ProjectTemplatesListingScreenComponent, + component: RuleSetsListingScreenComponent, canActivate: [CompositeRouteGuard], data: { routeGuards: [AuthGuard, RedRoleGuard, AppStateGuard] } }, { - path: ':templateId', + path: ':ruleSetId', children: [ { path: 'dictionaries', @@ -313,8 +313,8 @@ const matImports = [ CircleButtonComponent, ChevronButtonComponent, DictionaryListingScreenComponent, - ProjectTemplatesListingScreenComponent, - AddEditProjectTemplateDialogComponent, + RuleSetsListingScreenComponent, + AddEditRuleSetDialogComponent, SyncWidthDirective, HasScrollbarDirective, AddEditDictionaryDialogComponent, @@ -329,8 +329,8 @@ const matImports = [ HtmlDebugScreenComponent, ReportDownloadBtnComponent, ProjectListingActionsComponent, - ProjectTemplateActionsComponent, - ProjectTemplateViewSwitchComponent + RuleSetActionsComponent, + RuleSetViewSwitchComponent ], imports: [ BrowserModule, diff --git a/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.html b/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.html index 5549ff5ea..33266b062 100644 --- a/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.html +++ b/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.html @@ -5,7 +5,7 @@ [routerLinkActiveOptions]="{ exact: true }" routerLinkActive="active" translate="project-templates" - *ngIf="root || !!projectTemplate" + *ngIf="root || !!ruleSet" > - + - - {{ projectTemplate.name }} + + {{ ruleSet.name }} @@ -37,7 +37,7 @@ {{ dictionary.label }} diff --git a/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.ts b/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.ts index b4931d79d..d7b4e412c 100644 --- a/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.ts +++ b/apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.ts @@ -1,7 +1,7 @@ import { Component, Input, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { TypeValue } from '@redaction/red-ui-http'; -import { AppStateService, ProjectTemplate } from '../../state/app-state.service'; +import { RuleSetModel, TypeValue } from '@redaction/red-ui-http'; +import { AppStateService } from '../../state/app-state.service'; import { UserPreferenceService } from '../../common/service/user-preference.service'; import { PermissionsService } from '../../common/service/permissions.service'; @@ -12,7 +12,7 @@ import { PermissionsService } from '../../common/service/permissions.service'; }) export class AdminBreadcrumbsComponent implements OnInit { public dictionary: TypeValue; - public projectTemplate: ProjectTemplate; + public ruleSet: RuleSetModel; @Input() public root = false; @@ -25,8 +25,8 @@ export class AdminBreadcrumbsComponent implements OnInit { ngOnInit(): void { this._activatedRoute.params.subscribe((params) => { - if (params.templateId) { - this.projectTemplate = this._appStateService.getProjectTemplateById(params.templateId); + if (params.ruleSetId) { + this.ruleSet = this._appStateService.getRuleSetById(params.ruleSetId); } if (params.type) { this.dictionary = this._appStateService.getDictionaryTypeValue(params.type); diff --git a/apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.ts b/apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.ts deleted file mode 100644 index 7316bdd35..000000000 --- a/apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { ProjectTemplate } from '../../state/app-state.service'; -import { DialogService } from '../../dialogs/dialog.service'; -import { PermissionsService } from '../../common/service/permissions.service'; - -@Component({ - selector: 'redaction-project-template-actions', - templateUrl: './project-template-actions.component.html', - styleUrls: ['./project-template-actions.component.scss'] -}) -export class ProjectTemplateActionsComponent implements OnInit { - @Input() template: ProjectTemplate; - @Output() loadTemplatesData = new EventEmitter(); - - constructor(private readonly _dialogService: DialogService, public readonly permissionsService: PermissionsService) {} - - ngOnInit(): void {} - - openAddEditTemplateDialog(template?: ProjectTemplate) { - this._dialogService.openAddEditTemplateDialog(template, async (newTemplate) => { - if (newTemplate) { - this.loadTemplatesData.emit(); - } - }); - } - - openEditTemplateDialog($event: any, pt: ProjectTemplate) { - $event.stopPropagation(); - this.openAddEditTemplateDialog(pt); - } - - openDeleteTemplateDialog($event: any, template: ProjectTemplate) { - this._dialogService.openDeleteProjectTemplateDialog($event, template, async () => { - this.loadTemplatesData.emit(); - }); - } -} diff --git a/apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.html b/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.html similarity index 79% rename from apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.html rename to apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.html index 9b0edb1f4..04d19f2f8 100644 --- a/apps/red-ui/src/app/components/project-template-actions/project-template-actions.component.html +++ b/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.html @@ -1,6 +1,6 @@
(); + + constructor(private readonly _dialogService: DialogService, public readonly permissionsService: PermissionsService) {} + + ngOnInit(): void {} + + openAddEditRuleSetDialog(ruleSet?: RuleSetModel) { + this._dialogService.openAddEditRuleSetDialog(ruleSet, async (newRuleSet) => { + if (newRuleSet) { + this.loadRuleSetsData.emit(); + } + }); + } + + openEditRuleSetDialog($event: any, ruleSet: RuleSetModel) { + $event.stopPropagation(); + this.openAddEditRuleSetDialog(ruleSet); + } + + openDeleteRuleSetDialog($event: any, ruleSet: RuleSetModel) { + this._dialogService.openDeleteRuleSetDialog($event, ruleSet, async () => { + this.loadRuleSetsData.emit(); + }); + } +} diff --git a/apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.html b/apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.html similarity index 100% rename from apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.html rename to apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.html diff --git a/apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.scss b/apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.scss similarity index 100% rename from apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.scss rename to apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.scss diff --git a/apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.ts b/apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.ts similarity index 53% rename from apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.ts rename to apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.ts index 170a27221..c5ef646b8 100644 --- a/apps/red-ui/src/app/components/project-template-view-switch/project-template-view-switch.component.ts +++ b/apps/red-ui/src/app/components/rule-set-view-switch/rule-set-view-switch.component.ts @@ -2,26 +2,26 @@ import { Component, Input, OnInit } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; @Component({ - selector: 'redaction-project-template-view-switch', - templateUrl: './project-template-view-switch.component.html', - styleUrls: ['./project-template-view-switch.component.scss'] + selector: 'redaction-rule-set-view-switch', + templateUrl: './rule-set-view-switch.component.html', + styleUrls: ['./rule-set-view-switch.component.scss'] }) -export class ProjectTemplateViewSwitchComponent implements OnInit { +export class RuleSetViewSwitchComponent implements OnInit { @Input() public screen: 'rules' | 'dictionaries'; - private readonly _projectTemplateId: string; + private readonly _ruleSetId: string; constructor(private readonly _actr: ActivatedRoute, private _router: Router) { - this._projectTemplateId = this._actr.snapshot.params.templateId; + this._ruleSetId = this._actr.snapshot.params.ruleSetId; } ngOnInit(): void {} public switchView($event) { if ($event.value === 'dictionaries') { - this._router.navigate(['ui/admin/project-templates/' + this._projectTemplateId + '/dictionaries']); + this._router.navigate(['ui/admin/project-templates/' + this._ruleSetId + '/dictionaries']); } else { - this._router.navigate(['ui/admin/project-templates/' + this._projectTemplateId + '/rules']); + this._router.navigate(['ui/admin/project-templates/' + this._ruleSetId + '/rules']); } } } diff --git a/apps/red-ui/src/app/dialogs/dialog.service.ts b/apps/red-ui/src/app/dialogs/dialog.service.ts index 1dff8b33a..76a992b44 100644 --- a/apps/red-ui/src/app/dialogs/dialog.service.ts +++ b/apps/red-ui/src/app/dialogs/dialog.service.ts @@ -1,10 +1,17 @@ import { Injectable } from '@angular/core'; import { MatDialog, MatDialogRef } from '@angular/material/dialog'; -import { DictionaryControllerService, FileManagementControllerService, FileStatus, ManualRedactionControllerService, TypeValue } from '@redaction/red-ui-http'; +import { + DictionaryControllerService, + FileManagementControllerService, + FileStatus, + ManualRedactionControllerService, + RuleSetModel, + TypeValue +} from '@redaction/red-ui-http'; import { ConfirmationDialogComponent, ConfirmationDialogInput } from './confirmation-dialog/confirmation-dialog.component'; import { NotificationService, NotificationType } from '../notification/notification.service'; import { TranslateService } from '@ngx-translate/core'; -import { AppStateService, ProjectTemplate } from '../state/app-state.service'; +import { AppStateService } from '../state/app-state.service'; import { AddEditProjectDialogComponent } from './add-edit-project-dialog/add-edit-project-dialog.component'; import { AssignOwnerDialogComponent } from './assign-owner-dialog/assign-owner-dialog.component'; import { ManualRedactionEntryWrapper } from '../screens/file/model/manual-redaction-entry.wrapper'; @@ -13,7 +20,7 @@ import { ManualAnnotationDialogComponent } from './manual-redaction-dialog/manua import { ManualAnnotationService } from '../screens/file/service/manual-annotation.service'; import { ProjectWrapper } from '../state/model/project.wrapper'; import { AddEditDictionaryDialogComponent } from '../screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component'; -import { AddEditProjectTemplateDialogComponent } from '../screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component'; +import { AddEditRuleSetDialogComponent } from '../screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component'; import { DEFAULT_RUL_SET_UUID } from '../utils/rule-set-default'; const dialogConfig = { @@ -175,7 +182,7 @@ export class DialogService { return ref; } - public openDeleteProjectTemplateDialog($event: MouseEvent, projectTemplate: ProjectTemplate, cb?: Function): MatDialogRef { + public openDeleteRuleSetDialog($event: MouseEvent, ruleSet: RuleSetModel, cb?: Function): MatDialogRef { $event.stopPropagation(); const ref = this._dialog.open(ConfirmationDialogComponent, dialogConfig); ref.afterClosed().subscribe(async (result) => { @@ -285,10 +292,10 @@ export class DialogService { return ref; } - public openAddEditTemplateDialog(template: ProjectTemplate, cb?: Function): MatDialogRef { - const ref = this._dialog.open(AddEditProjectTemplateDialogComponent, { + public openAddEditRuleSetDialog(ruleSet: RuleSetModel, cb?: Function): MatDialogRef { + const ref = this._dialog.open(AddEditRuleSetDialogComponent, { ...dialogConfig, - data: template, + data: ruleSet, autoFocus: true }); diff --git a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.html b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.html index f67bc5685..7417f7e3b 100644 --- a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.html +++ b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.html @@ -2,11 +2,10 @@
- +
- - +
diff --git a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.ts b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.ts index 14524f4de..9335b58bd 100644 --- a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.ts +++ b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/dictionary-listing-screen.component.ts @@ -1,15 +1,14 @@ import { Component, OnInit } from '@angular/core'; import { DoughnutChartConfig } from '../../../components/simple-doughnut-chart/simple-doughnut-chart.component'; -import { DictionaryControllerService, TypeValue } from '@redaction/red-ui-http'; +import { DictionaryControllerService, RuleSetModel, TypeValue } from '@redaction/red-ui-http'; import { SortingOption, SortingService } from '../../../utils/sorting.service'; import { DialogService } from '../../../dialogs/dialog.service'; -import { AppStateService, ProjectTemplate } from '../../../state/app-state.service'; +import { AppStateService } from '../../../state/app-state.service'; import { tap } from 'rxjs/operators'; import { forkJoin } from 'rxjs'; import { PermissionsService } from '../../../common/service/permissions.service'; import { FormBuilder, FormGroup } from '@angular/forms'; import { debounce } from '../../../utils/debounce'; -import { UserPreferenceService } from '../../../common/service/user-preference.service'; import { DEFAULT_RUL_SET_UUID } from '../../../utils/rule-set-default'; import { ActivatedRoute } from '@angular/router'; @@ -24,7 +23,7 @@ export class DictionaryListingScreenComponent implements OnInit { public displayedDictionaries: TypeValue[]; public selectedDictKeys: string[] = []; public searchForm: FormGroup; - public projectTemplate: ProjectTemplate; + public ruleSet: RuleSetModel; constructor( private readonly _dialogService: DialogService, @@ -41,7 +40,7 @@ export class DictionaryListingScreenComponent implements OnInit { this.searchForm.valueChanges.subscribe((value) => this._executeSearch(value)); - this.projectTemplate = this._appStateService.getProjectTemplateById(this._actr.snapshot.params.templateId); + this.ruleSet = this._appStateService.getRuleSetById(this._actr.snapshot.params.ruleSetId); } ngOnInit(): void { @@ -147,7 +146,7 @@ export class DictionaryListingScreenComponent implements OnInit { }); } - public loadProjectTemplatesData(): void { - console.log('load project templates data'); + public loadRuleSetsData(): void { + console.log('load rule sets data'); } } diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.ts b/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.ts deleted file mode 100644 index b4495ba82..000000000 --- a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.ts +++ /dev/null @@ -1,55 +0,0 @@ -import { Component, Inject } from '@angular/core'; -import { AppStateService, ProjectTemplate } from '../../../../state/app-state.service'; -import { FormBuilder, FormGroup, Validators } from '@angular/forms'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import * as moment from 'moment'; - -@Component({ - selector: 'redaction-add-edit-project-template-dialog', - templateUrl: './add-edit-project-template-dialog.component.html', - styleUrls: ['./add-edit-project-template-dialog.component.scss'] -}) -export class AddEditProjectTemplateDialogComponent { - public templateForm: FormGroup; - public hasValidFrom: boolean; - - constructor( - private readonly _appStateService: AppStateService, - private readonly _formBuilder: FormBuilder, - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public template: ProjectTemplate - ) { - this.templateForm = this._formBuilder.group({ - name: [this.template?.name, Validators.required], - description: [this.template?.description], - validFrom: [this.template?.validFrom], - validTo: [this.template?.validTo] - }); - this.hasValidFrom = !!this.template?.validFrom && !!this.template?.validTo; - } - - public get changed(): boolean { - if (!this.template) return true; - - for (const key of Object.keys(this.templateForm.getRawValue())) { - if (key === 'validFrom' || key === 'validTo') { - if (this.hasValidFrom !== (!!this.template.validFrom && !!this.template.validTo)) { - return true; - } - if (this.hasValidFrom && !moment(this.template[key]).isSame(moment(this.templateForm.get(key).value))) { - return true; - } - } else if (this.template[key] !== this.templateForm.get(key).value) { - return true; - } - } - - return false; - } - - async saveTemplate() { - const template = this.templateForm.getRawValue(); - console.log({ template }); - this.dialogRef.close({ template }); - } -} diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.ts b/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.ts deleted file mode 100644 index fc5a248a0..000000000 --- a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.ts +++ /dev/null @@ -1,94 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { SortingOption, SortingService } from '../../../utils/sorting.service'; -import { DialogService } from '../../../dialogs/dialog.service'; -import { AppStateService, ProjectTemplate } from '../../../state/app-state.service'; -import { PermissionsService } from '../../../common/service/permissions.service'; -import { FormBuilder, FormGroup } from '@angular/forms'; -import { debounce } from '../../../utils/debounce'; - -@Component({ - selector: 'redaction-project-templates-listing-screen', - templateUrl: './project-templates-listing-screen.component.html', - styleUrls: ['./project-templates-listing-screen.component.scss'] -}) -export class ProjectTemplatesListingScreenComponent implements OnInit { - public templates: ProjectTemplate[]; - public displayedTemplates: ProjectTemplate[]; - public selectedTemplateIds: string[] = []; - public searchForm: FormGroup; - - constructor( - private readonly _dialogService: DialogService, - private readonly _sortingService: SortingService, - private readonly _formBuilder: FormBuilder, - private readonly _appStateService: AppStateService, - public readonly permissionsService: PermissionsService - ) { - this.searchForm = this._formBuilder.group({ - query: [''] - }); - - this.searchForm.valueChanges.subscribe((value) => this._executeSearch(value)); - } - - ngOnInit(): void { - this.loadTemplatesData(); - } - - @debounce(200) - private _executeSearch(value: { query: string }) { - this.displayedTemplates = this.templates.filter((pt) => pt.name.toLowerCase().includes(value.query.toLowerCase())); - } - - public loadTemplatesData() { - this._appStateService.reset(); - this.templates = this._appStateService.projectTemplates; - this.displayedTemplates = [...this.templates]; - } - - public get sortingOption(): SortingOption { - return this._sortingService.getSortingOption('project-templates-listing'); - } - - public toggleSort($event) { - this._sortingService.toggleSort('project-templates-listing', $event); - } - - toggleTemplateSelected($event: MouseEvent, template: ProjectTemplate) { - $event.stopPropagation(); - const idx = this.selectedTemplateIds.indexOf(template.id); - if (idx === -1) { - this.selectedTemplateIds.push(template.id); - } else { - this.selectedTemplateIds.splice(idx, 1); - } - } - - public toggleSelectAll() { - if (this.areSomeTemplatesSelected) { - this.selectedTemplateIds = []; - } else { - this.selectedTemplateIds = this.displayedTemplates.map((pt) => pt.id); - } - } - - public get areAllTemplatesSelected() { - return this.displayedTemplates.length !== 0 && this.selectedTemplateIds.length === this.displayedTemplates.length; - } - - public get areSomeTemplatesSelected() { - return this.selectedTemplateIds.length > 0; - } - - public isTemplateSelected(pt: ProjectTemplate) { - return this.selectedTemplateIds.indexOf(pt.id) !== -1; - } - - openAddTemplateDialog() { - this._dialogService.openAddEditTemplateDialog(null, async (newTemplate) => { - if (newTemplate) { - this.loadTemplatesData(); - } - }); - } -} diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.html b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.html similarity index 89% rename from apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.html rename to apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.html index c50695797..75fcb8a84 100644 --- a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.html +++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.html @@ -1,9 +1,9 @@
- {{ (template ? 'add-edit-project-template.title.edit' : 'add-edit-project-template.title.new') | translate: { name: template?.name } }} + {{ (ruleSet ? 'add-edit-project-template.title.edit' : 'add-edit-project-template.title.new') | translate: { name: ruleSet?.name } }}
-
+
@@ -49,7 +49,7 @@
-
diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.scss b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.scss similarity index 100% rename from apps/red-ui/src/app/screens/admin/project-templates-listing-screen/add-edit-project-template-dialog/add-edit-project-template-dialog.component.scss rename to apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.scss diff --git a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts new file mode 100644 index 000000000..e3618bbb6 --- /dev/null +++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts @@ -0,0 +1,56 @@ +import { Component, Inject } from '@angular/core'; +import { AppStateService } from '../../../../state/app-state.service'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import * as moment from 'moment'; +import { RuleSetModel } from '@redaction/red-ui-http'; + +@Component({ + selector: 'redaction-add-edit-rule-set-dialog', + templateUrl: './add-edit-rule-set-dialog.component.html', + styleUrls: ['./add-edit-rule-set-dialog.component.scss'] +}) +export class AddEditRuleSetDialogComponent { + public ruleSetForm: FormGroup; + public hasValidFrom: boolean; + + constructor( + private readonly _appStateService: AppStateService, + private readonly _formBuilder: FormBuilder, + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public ruleSet: RuleSetModel + ) { + this.ruleSetForm = this._formBuilder.group({ + name: [this.ruleSet?.name, Validators.required], + description: [this.ruleSet?.description], + validFrom: [this.ruleSet?.validFrom], + validTo: [this.ruleSet?.validTo] + }); + this.hasValidFrom = !!this.ruleSet?.validFrom && !!this.ruleSet?.validTo; + } + + public get changed(): boolean { + if (!this.ruleSet) return true; + + for (const key of Object.keys(this.ruleSetForm.getRawValue())) { + if (key === 'validFrom' || key === 'validTo') { + if (this.hasValidFrom !== (!!this.ruleSet.validFrom && !!this.ruleSet.validTo)) { + return true; + } + if (this.hasValidFrom && !moment(this.ruleSet[key]).isSame(moment(this.ruleSetForm.get(key).value))) { + return true; + } + } else if (this.ruleSet[key] !== this.ruleSetForm.get(key).value) { + return true; + } + } + + return false; + } + + async saveRuleSet() { + const ruleSet = this.ruleSetForm.getRawValue(); + console.log({ ruleSet }); + this.dialogRef.close({ ruleSet }); + } +} diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.html b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html similarity index 79% rename from apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.html rename to apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html index cdf7c6724..48b9eb244 100644 --- a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.html +++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html @@ -19,7 +19,7 @@ @@ -41,13 +41,13 @@
- + - {{ 'project-templates-listing.table-header.title' | translate: { length: displayedTemplates.length } }} + {{ 'project-templates-listing.table-header.title' | translate: { length: displayedRuleSets.length } }}
@@ -93,17 +93,17 @@
-
-
- +
+
+
- {{ template.name }} + {{ ruleSet.name }}
@@ -121,17 +121,14 @@
- {{ template.dateAdded | date: 'd MMM. yyyy' }} + {{ ruleSet.dateAdded | date: 'd MMM. yyyy' }}
- {{ template.dateModified | date: 'd MMM. yyyy' }} + {{ ruleSet.dateModified | date: 'd MMM. yyyy' }}
- +
diff --git a/apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.scss b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.scss similarity index 100% rename from apps/red-ui/src/app/screens/admin/project-templates-listing-screen/project-templates-listing-screen.component.scss rename to apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.scss diff --git a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.ts b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.ts new file mode 100644 index 000000000..b1da6a106 --- /dev/null +++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.ts @@ -0,0 +1,95 @@ +import { Component, OnInit } from '@angular/core'; +import { SortingOption, SortingService } from '../../../utils/sorting.service'; +import { DialogService } from '../../../dialogs/dialog.service'; +import { AppStateService } from '../../../state/app-state.service'; +import { PermissionsService } from '../../../common/service/permissions.service'; +import { FormBuilder, FormGroup } from '@angular/forms'; +import { debounce } from '../../../utils/debounce'; +import { RuleSetModel } from '@redaction/red-ui-http'; + +@Component({ + selector: 'redaction-rule-sets-listing-screen', + templateUrl: './rule-sets-listing-screen.component.html', + styleUrls: ['./rule-sets-listing-screen.component.scss'] +}) +export class RuleSetsListingScreenComponent implements OnInit { + public ruleSets: RuleSetModel[]; + public displayedRuleSets: RuleSetModel[]; + public selectedRuleSetIds: string[] = []; + public searchForm: FormGroup; + + constructor( + private readonly _dialogService: DialogService, + private readonly _sortingService: SortingService, + private readonly _formBuilder: FormBuilder, + private readonly _appStateService: AppStateService, + public readonly permissionsService: PermissionsService + ) { + this.searchForm = this._formBuilder.group({ + query: [''] + }); + + this.searchForm.valueChanges.subscribe((value) => this._executeSearch(value)); + } + + ngOnInit(): void { + this.loadRuleSetsData(); + } + + @debounce(200) + private _executeSearch(value: { query: string }) { + this.displayedRuleSets = this.ruleSets.filter((pt) => pt.name.toLowerCase().includes(value.query.toLowerCase())); + } + + public loadRuleSetsData() { + this._appStateService.reset(); + this.ruleSets = this._appStateService.ruleSets; + this.displayedRuleSets = [...this.ruleSets]; + } + + public get sortingOption(): SortingOption { + return this._sortingService.getSortingOption('rule-sets-listing'); + } + + public toggleSort($event) { + this._sortingService.toggleSort('rule-sets-listing', $event); + } + + toggleTemplateSelected($event: MouseEvent, ruleSet: RuleSetModel) { + $event.stopPropagation(); + const idx = this.selectedRuleSetIds.indexOf(ruleSet.ruleSetId); + if (idx === -1) { + this.selectedRuleSetIds.push(ruleSet.ruleSetId); + } else { + this.selectedRuleSetIds.splice(idx, 1); + } + } + + public toggleSelectAll() { + if (this.areSomeRuleSetsSelected) { + this.selectedRuleSetIds = []; + } else { + this.selectedRuleSetIds = this.displayedRuleSets.map((rs) => rs.ruleSetId); + } + } + + public get areAllRuleSetsSelected() { + return this.displayedRuleSets.length !== 0 && this.selectedRuleSetIds.length === this.displayedRuleSets.length; + } + + public get areSomeRuleSetsSelected() { + return this.selectedRuleSetIds.length > 0; + } + + public isRuleSetSelected(ruleSet: RuleSetModel) { + return this.selectedRuleSetIds.indexOf(ruleSet.ruleSetId) !== -1; + } + + openAddRuleSetDialog() { + this._dialogService.openAddEditRuleSetDialog(null, async (newRuleSet) => { + if (newRuleSet) { + this.loadRuleSetsData(); + } + }); + } +} diff --git a/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.html b/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.html index 355dbc7c0..7432bdffb 100644 --- a/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.html +++ b/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.html @@ -2,11 +2,10 @@
- +
- - +
diff --git a/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.ts b/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.ts index df017d23c..603030f33 100644 --- a/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.ts +++ b/apps/red-ui/src/app/screens/admin/rules-screen/rules-screen.component.ts @@ -1,14 +1,14 @@ import { Component, ElementRef, ViewChild } from '@angular/core'; import { PermissionsService } from '../../../common/service/permissions.service'; import { AceEditorComponent } from 'ng2-ace-editor'; -import { RulesControllerService } from '@redaction/red-ui-http'; +import { RulesControllerService, RuleSetModel } from '@redaction/red-ui-http'; import { NotificationService, NotificationType } from '../../../notification/notification.service'; import { TranslateService } from '@ngx-translate/core'; import { saveAs } from 'file-saver'; import { DEFAULT_RUL_SET_UUID } from '../../../utils/rule-set-default'; import { ComponentHasChanges } from '../../../utils/can-deactivate.guard'; import { ActivatedRoute } from '@angular/router'; -import { AppStateService, ProjectTemplate } from '../../../state/app-state.service'; +import { AppStateService } from '../../../state/app-state.service'; declare var ace; @@ -26,7 +26,7 @@ export class RulesScreenComponent extends ComponentHasChanges { public currentLines: string[] = []; public changedLines: number[] = []; public activeEditMarkers: any[] = []; - public projectTemplate: ProjectTemplate; + public ruleSet: RuleSetModel; @ViewChild('editorComponent', { static: true }) editorComponent: AceEditorComponent; @@ -44,7 +44,7 @@ export class RulesScreenComponent extends ComponentHasChanges { ) { super(_translateService); this._initialize(); - this.projectTemplate = this._appStateService.getProjectTemplateById(this._actr.snapshot.params.templateId); + this.ruleSet = this._appStateService.getRuleSetById(this._actr.snapshot.params.ruleSetId); } private _initialize() { @@ -130,7 +130,7 @@ export class RulesScreenComponent extends ComponentHasChanges { } } - public loadProjectTemplatesData(): void { - console.log('load project templates data'); + public loadRuleSetsData(): void { + console.log('load rule sets data'); } } diff --git a/apps/red-ui/src/app/state/app-state.guard.ts b/apps/red-ui/src/app/state/app-state.guard.ts index 4e506655b..b6c3ab4bc 100644 --- a/apps/red-ui/src/app/state/app-state.guard.ts +++ b/apps/red-ui/src/app/state/app-state.guard.ts @@ -11,6 +11,7 @@ export class AppStateGuard implements CanActivate { async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise { await this._userService.loadAllUsersIfNecessary(); + await this._appStateService.loadRuleSetsIfNecessary(); await this._appStateService.loadDictionaryDataIfNecessary(); await this._appStateService.updateDictionaryVersion(); diff --git a/apps/red-ui/src/app/state/app-state.service.ts b/apps/red-ui/src/app/state/app-state.service.ts index 7910efb2c..ef2243ac6 100644 --- a/apps/red-ui/src/app/state/app-state.service.ts +++ b/apps/red-ui/src/app/state/app-state.service.ts @@ -6,6 +6,9 @@ import { Project, ProjectControllerService, ReanalysisControllerService, + RulesControllerService, + RuleSetControllerService, + RuleSetModel, StatusControllerService, TypeValue, VersionsControllerService @@ -24,6 +27,7 @@ import { DEFAULT_RUL_SET_UUID } from '../utils/rule-set-default'; export interface AppState { projects: ProjectWrapper[]; + ruleSets: RuleSetModel[]; activeProjectId: string; activeFileId: string; totalAnalysedPages?: number; @@ -33,18 +37,6 @@ export interface AppState { ruleVersion?: number; } -export interface ProjectTemplate { - id: string; - name: string; - description: string; - dateAdded: string; // ( iso-string ) - dateModified: string; // ( iso-string) - createdBy: string; // userId - modifiedBy: string; // userid - validFrom: string; // (iso-date ) - validTo: string; // ( iso-date) -} - @Injectable({ providedIn: 'root' }) @@ -64,11 +56,13 @@ export class AppStateService { private readonly _reanalysisControllerService: ReanalysisControllerService, private readonly _translateService: TranslateService, private readonly _dictionaryControllerService: DictionaryControllerService, + private readonly _ruleSetControllerService: RuleSetControllerService, private readonly _statusControllerService: StatusControllerService, private readonly _versionsControllerService: VersionsControllerService ) { this._appState = { projects: [], + ruleSets: [], activeProjectId: null, activeFileId: null }; @@ -161,35 +155,12 @@ export class AppStateService { return this.getProjectById(projectId).files.find((file) => file.fileId === fileId); } - public get projectTemplates(): ProjectTemplate[] { - return [ - { - id: '1', - name: 'Most important sets', - description: 'description', - dateAdded: '2011-10-05T14:48:00.000Z', - dateModified: '2011-10-05T14:48:00.000Z', - createdBy: '2', - modifiedBy: '2', - validFrom: '2011-10-05T14:48:00.000Z', - validTo: '2011-10-05T14:48:00.000Z' - }, - { - id: '2', - name: 'Another rule set', - description: 'description', - dateAdded: '2012-10-05T14:48:00.000Z', - dateModified: '2013-10-05T14:48:00.000Z', - createdBy: '2', - modifiedBy: '2', - validFrom: '2011-10-05T14:48:00.000Z', - validTo: '2011-10-05T14:48:00.000Z' - } - ]; + public get ruleSets(): RuleSetModel[] { + return this._appState.ruleSets; } - public getProjectTemplateById(id: string): ProjectTemplate { - return this.projectTemplates.find((pt) => pt.id === id); + public getRuleSetById(id: string): RuleSetModel { + return this.ruleSets.find((pt) => pt.ruleSetId === id); } async loadAllProjects() { @@ -403,6 +374,16 @@ export class AppStateService { } } + async loadAllRuleSets() { + this._appState.ruleSets = await this._ruleSetControllerService.getAllRuleSets1().toPromise(); + } + + async loadRuleSetsIfNecessary() { + if (!this._appState.ruleSets.length) { + await this.loadAllRuleSets(); + } + } + async loadAllProjectsIfNecessary() { if (!this._appState.projects.length) { await this.loadAllProjects(); diff --git a/apps/red-ui/src/app/utils/sorting.service.ts b/apps/red-ui/src/app/utils/sorting.service.ts index 69d255671..0ab24c33b 100644 --- a/apps/red-ui/src/app/utils/sorting.service.ts +++ b/apps/red-ui/src/app/utils/sorting.service.ts @@ -5,7 +5,7 @@ export class SortingOption { column: string; } -type Screen = 'project-listing' | 'project-overview' | 'dictionary-listing' | 'project-templates-listing'; +type Screen = 'project-listing' | 'project-overview' | 'dictionary-listing' | 'rule-sets-listing'; @Injectable({ providedIn: 'root' @@ -15,7 +15,7 @@ export class SortingService { 'project-listing': { column: 'project.projectName', order: 'asc' }, 'project-overview': { column: 'filename', order: 'asc' }, 'dictionary-listing': { column: 'label', order: 'asc' }, - 'project-templates-listing': { column: 'name', order: 'asc' } + 'rule-sets-listing': { column: 'name', order: 'asc' } }; constructor() {} diff --git a/libs/red-ui-http/src/lib/api.module.ts b/libs/red-ui-http/src/lib/api.module.ts index 3411fd296..b937a6cde 100644 --- a/libs/red-ui-http/src/lib/api.module.ts +++ b/libs/red-ui-http/src/lib/api.module.ts @@ -17,6 +17,7 @@ import { VersionsControllerService } from './api/versionsController.service'; import { ViewedPagesControllerService } from './api/viewedPagesController.service'; import { LegalBasisMappingControllerService } from './api/legalBasisMappingController.service'; import { WatermarkControllerService } from './api/watermarkController.service'; +import { RuleSetControllerService } from './api/ruleSetController.service'; @NgModule({ imports: [], @@ -31,6 +32,7 @@ import { WatermarkControllerService } from './api/watermarkController.service'; ProjectControllerService, ReanalysisControllerService, RedactionLogControllerService, + RuleSetControllerService, RulesControllerService, UserControllerService, StatusControllerService,