From d74a001d940159f3d591d0542cbdae6738111bbc Mon Sep 17 00:00:00 2001 From: Bertrand Zuchuat Date: Fri, 23 Oct 2020 16:14:04 +0200 Subject: [PATCH] search: add tooltip on delete button of brief view * Adds tooltip on delete button of the search view to inform the user why deletion is not possible. Co-Authored-by: Bertrand Zuchuat --- .../src/app/app-routing.module.ts | 2 +- .../ng-core/src/lib/record/record.module.ts | 2 ++ .../record-search-result.component.html | 11 ++++++---- .../record-search-result.component.spec.ts | 8 ++++++- .../result/record-search-result.component.ts | 21 ++++++++----------- 5 files changed, 26 insertions(+), 18 deletions(-) diff --git a/projects/ng-core-tester/src/app/app-routing.module.ts b/projects/ng-core-tester/src/app/app-routing.module.ts index 4f5b7342..a08b93b9 100644 --- a/projects/ng-core-tester/src/app/app-routing.module.ts +++ b/projects/ng-core-tester/src/app/app-routing.module.ts @@ -120,7 +120,7 @@ const permissions = (record: any) => { }), canDelete: of({ can: perms.delete, - message: '' + message: 'This record cannot be deleted.' }) }; }; diff --git a/projects/rero/ng-core/src/lib/record/record.module.ts b/projects/rero/ng-core/src/lib/record/record.module.ts index c7319e16..fc35f635 100644 --- a/projects/rero/ng-core/src/lib/record/record.module.ts +++ b/projects/rero/ng-core/src/lib/record/record.module.ts @@ -25,6 +25,7 @@ import { NgxBootstrapSliderModule } from 'ngx-bootstrap-slider'; import { CollapseModule } from 'ngx-bootstrap/collapse'; import { BsDatepickerModule } from 'ngx-bootstrap/datepicker'; import { PaginationModule } from 'ngx-bootstrap/pagination'; +import { PopoverModule } from 'ngx-bootstrap/popover'; import { TooltipModule } from 'ngx-bootstrap/tooltip'; import { TypeaheadModule } from 'ngx-bootstrap/typeahead'; import { CoreModule } from '../core.module'; @@ -98,6 +99,7 @@ import { RecordSearchResultDirective } from './search/result/record-search-resul ReactiveFormsModule, RecordRoutingModule, TooltipModule.forRoot(), + PopoverModule.forRoot(), TypeaheadModule.forRoot(), PaginationModule.forRoot(), CollapseModule.forRoot(), diff --git a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.html b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.html index ca155b29..38d01386 100644 --- a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.html +++ b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.html @@ -48,15 +48,18 @@ - + +
+ diff --git a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.spec.ts b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.spec.ts index fa7b1b64..aaafe8b6 100644 --- a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.spec.ts +++ b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.spec.ts @@ -21,7 +21,10 @@ import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/t import { RouterTestingModule } from '@angular/router/testing'; import { TranslateFakeLoader, TranslateLoader, TranslateModule } from '@ngx-translate/core'; import { ModalModule } from 'ngx-bootstrap/modal'; +import { PopoverModule } from 'ngx-bootstrap/popover'; +import { TooltipModule } from 'ngx-bootstrap/tooltip'; import { ToastrModule } from 'ngx-toastr'; +import { CoreModule } from '../../../core.module'; import { JsonComponent } from './item/json.component'; import { RecordSearchResultComponent } from './record-search-result.component'; import { RecordSearchResultDirective } from './record-search-result.directive'; @@ -44,7 +47,10 @@ describe('RecordSearchResultComponent', () => { loader: { provide: TranslateLoader, useClass: TranslateFakeLoader } }), ToastrModule.forRoot(), - HttpClientModule + HttpClientModule, + TooltipModule.forRoot(), + PopoverModule.forRoot(), + CoreModule ], schemas: [ NO_ERRORS_SCHEMA ] }) diff --git a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.ts b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.ts index e7a7b49d..5c1d6c25 100644 --- a/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.ts +++ b/projects/rero/ng-core/src/lib/record/search/result/record-search-result.component.ts @@ -15,13 +15,12 @@ * along with this program. If not, see . */ import { Component, ComponentFactoryResolver, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'; +import { Router } from '@angular/router'; import { Observable } from 'rxjs'; import { ActionStatus } from '../../action-status'; -import { RecordUiService } from '../../record-ui.service'; import { JsonComponent } from './item/json.component'; import { ResultItem } from './item/result-item'; import { RecordSearchResultDirective } from './record-search-result.directive'; -import { Router} from '@angular/router'; @Component({ @@ -121,16 +120,22 @@ export class RecordSearchResultComponent implements OnInit { */ @ViewChild(RecordSearchResultDirective, { static: true }) searchResultItem: RecordSearchResultDirective; + + /** + * Return a message containing the reasons why the item cannot be deleted + */ + get deleteInfoMessage(): string { + return this.deleteStatus.message; + } + /** * Constructor. * * @param _componentFactoryResolver Component factory resolver. - * @param _recordUiService Record UI service. * @param _router: Router */ constructor( private _componentFactoryResolver: ComponentFactoryResolver, - private _recordUiService: RecordUiService, private _router: Router ) { this.currentUrl = window.location.href; @@ -204,12 +209,4 @@ export class RecordSearchResultComponent implements OnInit { useRecord() { this._router.navigateByUrl(this.useStatus.url); } - - /** - * Show dialog with the reason why record cannot be deleted. - * @param message - string, message to display - */ - showDeleteMessage(message: string) { - this._recordUiService.showDeleteMessage(message); - } }