CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

External Identifier as component with copy to clipboard (#1774)

Browse Source 
Co-authored-by: Jose Alberto Hernandez <alberto@blue-daemon.local>
This commit is contained in:
José Alberto Hernández
2023-06-28 23:19:41 -06:00
committed by GitHub
co-authored by Jose Alberto Hernandez
parent d0bc11256d
commit f459b1ae4e
38 changed files with 309 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/shared/external-identifier/external-identifier.component.html
+8 -5
View File
@@ -1,5 +1,8 @@
<div>
<span matTooltip="{{externalId}}" (mouseenter)="$event.stopImmediatePropagation()" (mouseleave)="$event.stopImmediatePropagation()" #tooltip="matTooltip"></span>
<span *ngIf="isLongValue()" (click)="tooltip.toggle()"><fa-icon icon="eye" size="sm" [title]="externalId"></fa-icon></span>
{{ externalId | externalIdentifier }}
</div>
<span (mouseenter)="mouseEnter()" (mouseleave)="mouseLeave()">
<span (click)="copyValue()" *ngIf="displayL && iconVisible"><fa-icon icon="copy" size="sm" title="Copy External Id"></fa-icon></span>
<span class="m-l-3" *ngIf="displayL && !completed && iconVisible && isLongValue()"><fa-icon icon="eye" size="sm" [title]="externalId"></fa-icon></span>
<span class="m-l-5" *ngIf="!completed">{{ externalId | externalIdentifier }}</span>
<span class="m-l-5" *ngIf="completed">{{ externalId }}</span>
<span class="m-l-5" *ngIf="displayR && !completed && iconVisible && isLongValue()"><fa-icon icon="eye" size="sm" [title]="externalId"></fa-icon></span>
<span class="m-l-3" (click)="copyValue()" *ngIf="displayR && iconVisible"><fa-icon icon="copy" size="sm" title="Copy External Id"></fa-icon></span>
</span>
src/app/shared/external-identifier/external-identifier.component.ts
+21 -1
View File
@@ -1,4 +1,5 @@
import { Component, Input, OnInit } from '@angular/core';
import { Clipboard } from '@angular/cdk/clipboard';
@Component({
selector: 'mifosx-external-identifier',
@@ -7,10 +8,18 @@ import { Component, Input, OnInit } from '@angular/core';
})
export class ExternalIdentifierComponent implements OnInit {
@Input() externalId: string;
@Input() completed = false;
@Input() display = 'right';
constructor() { }
iconVisible = false;
displayL = false;
displayR = true;
constructor(private clipboard: Clipboard) { }
ngOnInit(): void {
this.displayL = (this.display === 'left');
this.displayR = (this.display === 'right');
}
isLongValue(): boolean {
@@ -20,4 +29,15 @@ export class ExternalIdentifierComponent implements OnInit {
return (this.externalId.length > 15);
}
copyValue(): void {
this.clipboard.copy(this.externalId);
}
mouseEnter() {
this.iconVisible = true;
}
mouseLeave() {
this.iconVisible = false;
}
}