From f01b70815f0a1fa2251f19baa505d6b930cf27be Mon Sep 17 00:00:00 2001
From: KASSEM Passam <depysk@gmail.com>
Date: Thu, 20 May 2021 16:38:56 +0200
Subject: [PATCH] =?UTF-8?q?[VAS]=20BUG=207332=20:=20Correction=20sur=20la?=
=?UTF-8?q?=20position=20de=20la=20barre=20permettant=20de=20redimensionne?=
=?UTF-8?q?r=20le=20panneau=20lat=C3=A9ral=20gauche?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../resize-sidebar.directive.ts | 66 +++++++++++--------
.../src/app/archive/archive.component.html | 59 +++++++++++------
2 files changed, 78 insertions(+), 47 deletions(-)
diff --git a/ui/ui-frontend-common/src/app/modules/directives/resize-sidebar/resize-sidebar.directive.ts b/ui/ui-frontend-common/src/app/modules/directives/resize-sidebar/resize-sidebar.directive.ts
index 62d8f4e81..26e25a643 100644
--- a/ui/ui-frontend-common/src/app/modules/directives/resize-sidebar/resize-sidebar.directive.ts
+++ b/ui/ui-frontend-common/src/app/modules/directives/resize-sidebar/resize-sidebar.directive.ts
@@ -34,31 +34,39 @@
* 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, ElementRef, HostListener, Inject, Input, OnInit, Renderer2} from '@angular/core';
-import {DOCUMENT} from "@angular/common";
+import { DOCUMENT } from "@angular/common";
+import {
+ Directive,
+ ElementRef,
+ HostListener,
+ Inject,
+ Input,
+ OnInit,
+ Renderer2,
+} from "@angular/core";
@Directive({
- selector: '[vitamuiCommonResizeSidebar]'
+ selector: "[vitamuiCommonResizeSidebar]",
})
export class ResizeSidebarDirective implements OnInit {
/**
* Orientation du block à redimensionner, permet de positionner à droite ou à gauche la barre permettant de
* redimensionner
- * valeur possible: left (par défaut) ou right
+ * valeur possible: left ou right (par défaut)
*/
- @Input('vitamuiCommonResizeSidebar') orientation: 'right'|'left' = 'left';
+ @Input("vitamuiCommonResizeSidebar") orientation: "right" | "left" = "right";
/**
* largeur de la barre permettant de redimensionner
* valeur par défaut : 4px
*/
- @Input() barSize: string = '4px';
+ @Input() barSize: string = "4px";
/**
* Couleur de la barre permettant de redimensionner
* valeur par défaut #702382
*/
- @Input() barColor: string = 'rgb(112, 35, 130)';
+ @Input() barColor: string = "rgb(112, 35, 130)";
/**
* Largeur du block à redimensionner
@@ -68,45 +76,49 @@ export class ResizeSidebarDirective implements OnInit {
private status = 0;
- @HostListener('window:mousemove', ['$event'])
+ @HostListener("window:mousemove", ["$event"])
onMouseMove(event: MouseEvent) {
let mouse = { x: event.clientX, y: event.clientY };
- if(this.status === 1) {
+ if (this.status === 1) {
const space = Number(mouse.x) ? mouse.x : 0;
- if(this.orientation === 'left') {
+ if (this.orientation === "left") {
this.width = space;
- this.elementRef.nativeElement.style.width = this.width + 'px';
+ this.elementRef.nativeElement.style.width = this.width + "px";
} else {
- const {left} = this.elementRef.nativeElement.getBoundingClientRect();
+ const { left } = this.elementRef.nativeElement.getBoundingClientRect();
this.width = left - space + this.width;
- this.elementRef.nativeElement.style.width = this.width + 'px';
+ this.elementRef.nativeElement.style.width = this.width + "px";
}
}
}
- @HostListener('window:mouseup')
+ @HostListener("window:mouseup")
onMouseUp() {
this.status = 0;
}
- constructor(private elementRef: ElementRef, private renderer: Renderer2, @Inject(DOCUMENT) private document) { }
+ constructor(
+ private elementRef: ElementRef,
+ private renderer: Renderer2,
+ @Inject(DOCUMENT) private document
+ ) {}
ngOnInit(): void {
const nativeElt = this.elementRef.nativeElement;
- nativeElt.style.width = this.width + 'px';
+ nativeElt.style.width = this.width + "px";
const child = this.createResizeBar();
this.renderer.appendChild(nativeElt, child);
}
private createResizeBar() {
- const div = this.document.createElement('div');
- div.style.display = 'block';
- div.style.height = '100%';
- div.style.position = 'absolute';
- div.className = 'vitamuiResizeSidebar';
- div.style.zIndex = '99';
- div.style.top = '0';
- if(this.orientation === 'left') {
+ const div = this.document.createElement("div");
+ div.style.display = "block";
+ div.style.height = "100%";
+ div.style.position = "absolute";
+ div.className = "vitamuiResizeSidebar";
+ div.style.zIndex = "99";
+ div.style.top = "0";
+ if (this.orientation === "left") {
div.style.left = `calc(100% - ${this.barSize})`;
div.style.borderRight = `${this.barSize} solid ${this.barColor}`;
} else {
@@ -114,15 +126,15 @@ export class ResizeSidebarDirective implements OnInit {
div.style.borderLeft = `${this.barSize} solid ${this.barColor}`;
}
- div.style.cursor = 'ew-resize';
+ div.style.cursor = "ew-resize";
- div.addEventListener('mousedown', event => this.setStatus(event, 1));
+ div.addEventListener("mousedown", (event) => this.setStatus(event, 1));
return div;
}
private setStatus(event: MouseEvent, status: number) {
- if(status === 1) {
+ if (status === 1) {
event.stopPropagation();
}
this.status = status;
diff --git a/ui/ui-frontend/projects/archive-search/src/app/archive/archive.component.html b/ui/ui-frontend/projects/archive-search/src/app/archive/archive.component.html
index 055005449..b285123f0 100644
--- a/ui/ui-frontend/projects/archive-search/src/app/archive/archive.component.html
+++ b/ui/ui-frontend/projects/archive-search/src/app/archive/archive.component.html
@@ -1,38 +1,57 @@
<mat-sidenav-container [autosize]="true" [hasBackdrop]="false">
-
- <mat-sidenav mode="side" [fixedInViewport]="true" opened="{{show}}" *ngIf="foundAccessContract" vitamuiCommonResizeSidebar>
- <app-filing-holding-scheme (fillingSchemaClose)="closePanel()" [accessContract]="accessContract"></app-filing-holding-scheme>
+ <mat-sidenav
+ mode="side"
+ [fixedInViewport]="true"
+ opened="{{ show }}"
+ *ngIf="foundAccessContract"
+ vitamuiCommonResizeSidebar="left"
+ >
+ <app-filing-holding-scheme
+ (fillingSchemaClose)="closePanel()"
+ [accessContract]="accessContract"
+ ></app-filing-holding-scheme>
</mat-sidenav>
<mat-sidenav #panel mode="side" position="end" [fixedInViewport]="true">
- <app-archive-preview *ngIf="openedItem" (previewClose)="closePanel()" [archiveUnit]="openedItem"
- [accessContract]="accessContract"></app-archive-preview>
+ <app-archive-preview
+ *ngIf="openedItem"
+ (previewClose)="closePanel()"
+ [archiveUnit]="openedItem"
+ [accessContract]="accessContract"
+ ></app-archive-preview>
</mat-sidenav>
-
<mat-sidenav-content>
<div class="vitamui-heading">
<vitamui-common-title-breadcrumb>
- {{'ARCHIVE_SEARCH.TITLE_SEARCH_AREA' | translate}}
+ {{ "ARCHIVE_SEARCH.TITLE_SEARCH_AREA" | translate }}
</vitamui-common-title-breadcrumb>
<div class="marge">
- <app-access-contract (selectedAccessContract)="onSelectAccessContract($event)">
+ <app-access-contract
+ (selectedAccessContract)="onSelectAccessContract($event)"
+ >
</app-access-contract>
</div>
</div>
<div class="vitamui-content" *ngIf="foundAccessContract">
- <div class="row">
-
- <button *ngIf="!show" type="button" class="btn secondary right-arround left-not-arround"
- (click)="hiddenTreeBlock(show)" matTooltip="{{'ARCHIVE_SEARCH.SHOW_TREES_PLANS' | translate}}"
- matTooltipClass="vitamui-tooltip" [matTooltipShowDelay]="300">
- <i class="material-icons">chevron_right</i>
- </button>
- </div>
- <app-archive-search (archiveUnitClick)="showPreviewArchiveUnit($event)"
- [accessContract]="accessContract">
- </app-archive-search>
-
+ <div class="row">
+ <button
+ *ngIf="!show"
+ type="button"
+ class="btn secondary right-arround left-not-arround"
+ (click)="hiddenTreeBlock(show)"
+ matTooltip="{{ 'ARCHIVE_SEARCH.SHOW_TREES_PLANS' | translate }}"
+ matTooltipClass="vitamui-tooltip"
+ [matTooltipShowDelay]="300"
+ >
+ <i class="material-icons">chevron_right</i>
+ </button>
+ </div>
+ <app-archive-search
+ (archiveUnitClick)="showPreviewArchiveUnit($event)"
+ [accessContract]="accessContract"
+ >
+ </app-archive-search>
</div>
</mat-sidenav-content>
</mat-sidenav-container>
--
GitLab