dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Amendments after review

Browse Source
This commit is contained in:
rusikv 2023-04-07 12:15:31 +03:00
parent bcee982497
commit 1eb7f12310
7 changed files with 44 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
ui-ngx/src/app/modules/home/components/alarm/alarm-assignee-panel.component.ts
View File

@ -65,6 +65,8 @@ export class AlarmAssigneePanelComponent implements OnInit, AfterViewInit, OnDe
assigneeId?: string;
reassigned: boolean = false;
selectUserFormGroup: FormGroup;
@ViewChild('userInput', {static: true}) userInput: ElementRef;
@ -130,12 +132,18 @@ export class AlarmAssigneePanelComponent implements OnInit, AfterViewInit, OnDe
assign(user: User): void {
this.alarmService.assignAlarm(this.alarmId, user.id.id, {ignoreLoading: true}).subscribe(
() => this.overlayRef.dispose());
() => {
this.reassigned = true;
this.overlayRef.dispose()
});
}
unassign(): void {
this.alarmService.unassignAlarm(this.alarmId, {ignoreLoading: true}).subscribe(
() => this.overlayRef.dispose());
() => {
this.reassigned = true;
this.overlayRef.dispose()
});
}
fetchUsers(searchText?: string): Observable<Array<UserEmailInfo>> {

23
ui-ngx/src/app/modules/home/components/alarm/alarm-assignee.component.html
View File

@ -16,14 +16,15 @@
-->
<div (click)="openAlarmAssigneePanel($event, alarm)">
<mat-form-field fxFlex class="mat-block">
<mat-label translate>alarm.assignee</mat-label>
<input matInput readonly [value]="getAssignee()">
<span *ngIf="alarm?.assigneeId" matPrefix class="user-avatar" [style.backgroundColor]="getAvatarBgColor(alarm.assignee)">
{{ getUserInitials(alarm.assignee) }}
</span>
<mat-icon *ngIf="!alarm?.assigneeId" matPrefix class="unassigned-icon">account_circle</mat-icon>
<mat-icon matSuffix>arrow_drop_down</mat-icon>
</mat-form-field>
</div>
<mat-form-field fxFlex class="mat-block" style="margin-bottom: 25px"
(click)="openAlarmAssigneePanel($event, alarm)"
subscriptSizing="dynamic">
<mat-label translate>alarm.assignee</mat-label>
<input matInput readonly [value]="getAssignee()">
<span *ngIf="alarm?.assigneeId" matPrefix class="user-avatar"
[style.backgroundColor]="getAvatarBgColor(alarm.assignee)">
{{ getUserInitials(alarm.assignee) }}
</span>
<mat-icon *ngIf="!alarm?.assigneeId" matPrefix class="unassigned-icon">account_circle</mat-icon>
<mat-icon matSuffix>arrow_drop_down</mat-icon>
</mat-form-field>

2
ui-ngx/src/app/modules/home/components/alarm/alarm-assignee.component.ts
View File

@ -124,7 +124,7 @@ export class AlarmAssigneeComponent {
config.hasBackdrop = true;
const connectedPosition: ConnectedPosition = {
originX: 'center',
originY: 'center',
originY: 'bottom',
overlayX: 'center',
overlayY: 'top'
};

7
ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.html
View File

@ -55,7 +55,7 @@
<div class="comments-container" fxLayout="column" fxLayoutGap="12px" style="padding: 24px"
[ngClass]="{'asc': isDirectionAscending(), 'activity-only': alarmActivityOnly}">
<div fxFlex *ngFor="let displayDataElement of displayData; index as i">
<div *ngIf="displayDataElement.isSystemComment; else userComment" style="margin-left: 38px;">
<div class="system-comment" *ngIf="displayDataElement.isSystemComment; else userComment">
<span class="system-text" style="margin-right: 8px">
{{ displayDataElement.commentText }}
</span>
@ -70,8 +70,7 @@
*ngIf="!displayDataElement.edit; else commentEditing"
(mouseenter)="onCommentMouseEnter(displayDataElement.commentId, i)"
(mouseleave)="onCommentMouseLeave(i)">
<div fxLayout="row" fxLayoutAlign="center center" fxFlexAlign="start"
class="user-avatar"
<div class="user-avatar" fxLayout="row" fxLayoutAlign="center center" fxFlexAlign="start" fxHide.xs
[style.background-color]="displayDataElement.avatarBgColor">
{{ getUserInitials(displayDataElement.displayName) }}
</div>
@ -91,7 +90,7 @@
</div>
<span class="text">{{ displayDataElement.commentText }}</span>
</div>
<div fxLayout="row" class="action-buttons"
<div fxLayout="row" fxLayout.xs="column" class="action-buttons"
[ngClass]="{ 'show-buttons': displayDataElement.showActions }">
<button mat-icon-button
type="button"

7
ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.scss
View File

@ -166,6 +166,13 @@ $border: 1px solid mat.get-color-from-palette($tb-primary);
}
}
.system-comment {
margin-left: 38px;
@media #{$mat-xs} {
margin-left: 0;
}
}
.system-text {
font-weight: 500;
font-size: 14px;

4
ui-ngx/src/app/modules/home/components/alarm/alarm-details-dialog.component.html
View File

@ -62,10 +62,10 @@
</mat-form-field>
</div>
<mat-expansion-panel class="tb-alarm-details">
<mat-expansion-panel-header fxLayout="row wrap">
<mat-expansion-panel-header fxLayout="row wrap" style="margin-bottom: 8px">
<mat-panel-title>
</mat-panel-title>
<mat-panel-description fxLayoutAlign="end center" fxHide.xs translate>
<mat-panel-description fxLayoutAlign="end center" translate>
alarm.show-more
</mat-panel-description>
</mat-expansion-panel-header>

12
ui-ngx/src/app/modules/home/components/alarm/alarm-table-config.ts
View File

@ -53,7 +53,8 @@ import { Authority } from '@shared/models/authority.enum';
import { ChangeDetectorRef, Injector, StaticProvider, ViewContainerRef } from '@angular/core';
import { ConnectedPosition, Overlay, OverlayConfig, OverlayRef } from '@angular/cdk/overlay';
import {
ALARM_ASSIGNEE_PANEL_DATA, AlarmAssigneePanelComponent,
ALARM_ASSIGNEE_PANEL_DATA,
AlarmAssigneePanelComponent,
AlarmAssigneePanelData
} from '@home/components/alarm/alarm-assignee-panel.component';
import { ComponentPortal } from '@angular/cdk/portal';
@ -282,8 +283,13 @@ export class AlarmTableConfig extends EntityTableConfig<AlarmInfo, TimePageLink>
}
];
const injector = Injector.create({parent: this.viewContainerRef.injector, providers});
overlayRef.attach(new ComponentPortal(AlarmAssigneePanelComponent,
this.viewContainerRef, injector)).onDestroy(() => this.updateData());
const componentRef = overlayRef.attach(new ComponentPortal(AlarmAssigneePanelComponent,
this.viewContainerRef, injector));
componentRef.onDestroy(() => {
if (componentRef.instance.reassigned) {
this.updateData()
}
});
}
}