diff --git a/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.component.html b/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.component.html index 2dc789e0daeb83c16ea8697357f703debe6371be..bf2e4e6b139d4348a2b13e87ef17297a31b0b581 100644 --- a/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.component.html +++ b/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.component.html @@ -1,10 +1,12 @@ <div class="vitamui-autocomplete" [class.disabled]="control.disabled" [class.label-up]="labelUp"> <label class="input-label">{{ placeholder }}</label> <input - #input + #input="matAutocompleteTrigger" + matInput type="text" [formControl]="control" [matAutocomplete]="auto" + [vitamuiAutocompletePosition]="input" (blur)="onBlur()" (focus)="onFocus()" > diff --git a/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.module.ts b/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.module.ts index 12e5c35cec9bfb7ae302f0e42df7d5ebb8b2e77a..f466026c695b2c62249ba3efe9f696ad54637229 100644 --- a/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.module.ts +++ b/ui/ui-frontend-common/src/app/modules/components/vitamui-autocomplete/vitamui-autocomplete.module.ts @@ -41,14 +41,18 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete'; import { MatTooltipModule } from '@angular/material/tooltip'; import { VitamUIAutocompleteComponent } from './vitamui-autocomplete.component'; +import {MatInputModule} from "@angular/material/input"; +import {AutocompletePositionDirectiveModule} from "../../directives/autocomplete-position/autocomplete-position.directive.module"; @NgModule({ - imports: [ - CommonModule, - MatAutocompleteModule, - ReactiveFormsModule, - MatTooltipModule, - ], + imports: [ + CommonModule, + MatAutocompleteModule, + ReactiveFormsModule, + MatTooltipModule, + MatInputModule, + AutocompletePositionDirectiveModule + ], declarations: [VitamUIAutocompleteComponent], exports: [VitamUIAutocompleteComponent] }) diff --git a/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.module.ts b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.module.ts new file mode 100644 index 0000000000000000000000000000000000000000..709d7136902ca8f8d826ec02f00fe01401df7855 --- /dev/null +++ b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.module.ts @@ -0,0 +1,52 @@ +/* + * Copyright French Prime minister Office/SGMAP/DINSIC/Vitam Program (2019-2020) + * and the signatories of the "VITAM - Accord du Contributeur" agreement. + * + * contact@programmevitam.fr + * + * This software is a computer program whose purpose is to implement + * implement a digital archiving front-office system for the secure and + * efficient high volumetry VITAM solution. + * + * This software is governed by the CeCILL-C license under French law and + * abiding by the rules of distribution of free software. You can use, + * modify and/ or redistribute the software under the terms of the CeCILL-C + * license as circulated by CEA, CNRS and INRIA at the following URL + * "http://www.cecill.info". + * + * As a counterpart to the access to the source code and rights to copy, + * modify and redistribute granted by the license, users are provided only + * with a limited warranty and the software's author, the holder of the + * economic rights, and the successive licensors have only limited + * liability. + * + * In this respect, the user's attention is drawn to the risks associated + * with loading, using, modifying and/or developing or reproducing the + * software by the user in light of its specific status of free software, + * that may mean that it is complicated to manipulate, and that also + * therefore means that it is reserved for developers and experienced + * professionals having in-depth computer knowledge. Users are therefore + * encouraged to load and test the software's suitability as regards their + * requirements in conditions enabling the security of their systems and/or + * data to be ensured and, more generally, to use and operate it in the + * same conditions as regards security. + * + * The fact that you are presently reading this means that you have had + * knowledge of the CeCILL-C license and that you accept its terms. + */ +import {CommonModule} from '@angular/common'; +import {NgModule} from '@angular/core'; +import {AutocompletePositionDirective} from "./autocomplete-position.directive"; + +@NgModule({ + imports: [ + CommonModule, + ], + declarations: [ + AutocompletePositionDirective + ], + exports: [ + AutocompletePositionDirective + ] +}) +export class AutocompletePositionDirectiveModule { } diff --git a/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.spec.ts b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.spec.ts new file mode 100644 index 0000000000000000000000000000000000000000..7b0b8e1349ef58dcfc9bf6eb67fb1f8d213841a8 --- /dev/null +++ b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.spec.ts @@ -0,0 +1,44 @@ +/* + * Copyright French Prime minister Office/SGMAP/DINSIC/Vitam Program (2019-2020) + * and the signatories of the "VITAM - Accord du Contributeur" agreement. + * + * contact@programmevitam.fr + * + * This software is a computer program whose purpose is to implement + * implement a digital archiving front-office system for the secure and + * efficient high volumetry VITAM solution. + * + * This software is governed by the CeCILL-C license under French law and + * abiding by the rules of distribution of free software. You can use, + * modify and/ or redistribute the software under the terms of the CeCILL-C + * license as circulated by CEA, CNRS and INRIA at the following URL + * "http://www.cecill.info". + * + * As a counterpart to the access to the source code and rights to copy, + * modify and redistribute granted by the license, users are provided only + * with a limited warranty and the software's author, the holder of the + * economic rights, and the successive licensors have only limited + * liability. + * + * In this respect, the user's attention is drawn to the risks associated + * with loading, using, modifying and/or developing or reproducing the + * software by the user in light of its specific status of free software, + * that may mean that it is complicated to manipulate, and that also + * therefore means that it is reserved for developers and experienced + * professionals having in-depth computer knowledge. Users are therefore + * encouraged to load and test the software's suitability as regards their + * requirements in conditions enabling the security of their systems and/or + * data to be ensured and, more generally, to use and operate it in the + * same conditions as regards security. + * + * The fact that you are presently reading this means that you have had + * knowledge of the CeCILL-C license and that you accept its terms. + */ +import {AutocompletePositionDirective} from "./autocomplete-position.directive"; + +describe('AutocompletePositionDirective', () => { + it('should create an instance', () => { + const directive = new AutocompletePositionDirective(); + expect(directive).toBeTruthy(); + }); +}); diff --git a/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.ts b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.ts new file mode 100644 index 0000000000000000000000000000000000000000..cac864569875072d581275b732dc1535d0553491 --- /dev/null +++ b/ui/ui-frontend-common/src/app/modules/directives/autocomplete-position/autocomplete-position.directive.ts @@ -0,0 +1,63 @@ +/* + * Copyright French Prime minister Office/SGMAP/DINSIC/Vitam Program (2019-2020) + * and the signatories of the "VITAM - Accord du Contributeur" agreement. + * + * contact@programmevitam.fr + * + * This software is a computer program whose purpose is to implement + * implement a digital archiving front-office system for the secure and + * efficient high volumetry VITAM solution. + * + * This software is governed by the CeCILL-C license under French law and + * abiding by the rules of distribution of free software. You can use, + * modify and/ or redistribute the software under the terms of the CeCILL-C + * license as circulated by CEA, CNRS and INRIA at the following URL + * "http://www.cecill.info". + * + * As a counterpart to the access to the source code and rights to copy, + * modify and redistribute granted by the license, users are provided only + * with a limited warranty and the software's author, the holder of the + * economic rights, and the successive licensors have only limited + * liability. + * + * In this respect, the user's attention is drawn to the risks associated + * with loading, using, modifying and/or developing or reproducing the + * software by the user in light of its specific status of free software, + * that may mean that it is complicated to manipulate, and that also + * therefore means that it is reserved for developers and experienced + * professionals having in-depth computer knowledge. Users are therefore + * encouraged to load and test the software's suitability as regards their + * requirements in conditions enabling the security of their systems and/or + * data to be ensured and, more generally, to use and operate it in the + * same conditions as regards security. + * + * The fact that you are presently reading this means that you have had + * knowledge of the CeCILL-C license and that you accept its terms. + */ +import { Directive, Input, OnDestroy } from '@angular/core'; +import { MatAutocompleteTrigger } from '@angular/material/autocomplete'; + +@Directive({ + selector: '[vitamuiAutocompletePosition]' +}) +export class AutocompletePositionDirective implements OnDestroy { + private matAutocompleteTrigger: MatAutocompleteTrigger; + + @Input('vitamuiAutocompletePosition') set autocompletePosition(value: MatAutocompleteTrigger) { + this.matAutocompleteTrigger = value; + window.addEventListener('scroll', this.scrollEvent, true); + } + + private scrollEvent = (): void => { + if (this.matAutocompleteTrigger == null) { + return; + } + if (this.matAutocompleteTrigger.panelOpen) { + this.matAutocompleteTrigger.updatePosition(); + } + }; + + ngOnDestroy() { + window.removeEventListener('scroll', this.scrollEvent, true); + } +} diff --git a/ui/ui-frontend-common/src/app/modules/vitamui-common.module.ts b/ui/ui-frontend-common/src/app/modules/vitamui-common.module.ts index c1923798f9f1cd11edc79cee78a41aeef2ef64b4..0a442c57633cb4dd293780d1cb2b2212d1521561 100644 --- a/ui/ui-frontend-common/src/app/modules/vitamui-common.module.ts +++ b/ui/ui-frontend-common/src/app/modules/vitamui-common.module.ts @@ -99,6 +99,7 @@ import { StartupService } from './startup.service'; import { SubrogationModule } from './subrogation/subrogation.module'; import { VitamUIHttpInterceptor } from './vitamui-http-interceptor'; import {ResizeSidebarModule} from "./directives/resize-sidebar/resize-sidebar.module"; +import {AutocompletePositionDirectiveModule} from "./directives/autocomplete-position/autocomplete-position.directive.module"; export function startupServiceFactory(startupService: StartupService) { // leave it like this due to run packagr issue : @@ -166,7 +167,8 @@ export function startupServiceFactory(startupService: StartupService) { UserPhotoModule, VitamuiMenuButtonModule, VitamuiSidenavHeaderModule, - ResizeSidebarModule + ResizeSidebarModule, + AutocompletePositionDirectiveModule ], entryComponents: [ ErrorDialogComponent @@ -221,7 +223,8 @@ export function startupServiceFactory(startupService: StartupService) { CommonTooltipModule, VitamuiSidenavHeaderModule, VitamuiMenuButtonModule, - ResizeSidebarModule + ResizeSidebarModule, + AutocompletePositionDirectiveModule ], providers: [ { provide: SUBROGRATION_REFRESH_RATE_MS, useValue: 10000 }, diff --git a/ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.scss b/ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.scss index f3afb4f409e0f3118cd40da0d7f1104b7ad6eaef..6a520f3f55caa38d718ced9ec32e452e4fce5840 100644 --- a/ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.scss +++ b/ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.scss @@ -15,11 +15,9 @@ height: 16px; display: block; position: absolute; - left: 100%; - top: 100%; - margin-left: -8px; - margin-top: -8px; - padding: 2px 3px 3px 4px; + margin-left: 15px; + margin-top: -9px; + padding: 0 3px 3px 4px; border-radius: 50%; background-color: var(--vitamui-grey-600); border: solid 2px $white; @@ -41,7 +39,7 @@ vitamui-common-table-filter-option .vitamui-icon { .table-filter-icon { display: flex; align-items: center; - + span.badge-state { color: var(--vitamui-grey-900); margin-left: 18px; diff --git a/ui/ui-frontend/projects/identity/src/app/user/user-preview/user-preview.component.html b/ui/ui-frontend/projects/identity/src/app/user/user-preview/user-preview.component.html index 09b99b6732b280b2ba833a9b8dafe5d12b2e10ac..31b8652eb0c67befa5c8e41ff4c558487ae553c4 100644 --- a/ui/ui-frontend/projects/identity/src/app/user/user-preview/user-preview.component.html +++ b/ui/ui-frontend/projects/identity/src/app/user/user-preview/user-preview.component.html @@ -1,5 +1,5 @@ <vitamui-common-sidenav-header - [badge]="user?.status === 'ENABLED' ? 'green' : (user?.status === 'DISABLED' || user?.status === 'ANONYM' ? 'grey' : 'orange')" + [badge]="user?.status === 'ENABLED' ? 'green' : ((user?.status === 'DISABLED' || user?.status === 'ANONYM' || user?.status === 'REMOVED') ? 'grey' : 'orange')" [title]="user?.lastname.toUpperCase() + ' ' + user?.firstname" [subtitle]="'(' + user?.identifier + ')'" [icon]="'vitamui-icon-user'"