Skip to content

Commit

Permalink
fix: Display location for sites in asset management (#3291)
Browse files Browse the repository at this point in the history 
* fixed location for sites in asset management

* add indication for label configuration
  • Loading branch information
@Marcelfrueh
Marcelfrueh authored Oct 8, 2024
1 parent f8a96ec commit 1d58e08
Show file tree
Hide file tree
Showing 4 changed files with 103 additions and 47 deletions.
10 changes: 10 additions & 0 deletions ui/src/app/assets/components/asset-details/base-asset-details.directive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,16 @@ export abstract class BaseAssetDetailsDirective implements OnInit {
SpAssetRoutes.BASE,
{ label: this.asset.assetName },
]);

if (!this.asset.assetSite.hasExactLocation) {
const matchingSite = this.sites.find(
site => site._id === this.asset.assetSite.siteId,
);
if (matchingSite) {
this.asset.assetSite.location = matchingSite.location;
}
}

this.onAssetAvailable();
});
}
Expand Down
93 changes: 59 additions & 34 deletions ...tails-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,42 +17,67 @@
-->

<div *ngIf="editMode">
<mat-form-field class="w-100" *ngIf="labelsAvailable" color="accent">
<mat-chip-grid #chipGrid aria-label="Labels">
<mat-chip-row
(removed)="remove(label)"
*ngFor="let label of labels"
[ngStyle]="{ background: label.color }"
<div fxLayout="row" fxLayoutGap="15px" fxLayoutAlign="start center">
<div fxFlex fxLayoutAlign="start center">
<mat-form-field
class="w-100"
*ngIf="labelsAvailable"
color="accent"
subscriptSizing="dynamic"
[disabled]="allLabels.length === 0"
>
<span [ngStyle]="{ color: labelTextColors[label._id] }">{{
label.label
}}</span>
<button
matChipRemove
[ngStyle]="{ color: labelTextColors[label._id] }"
<mat-chip-grid #chipGrid aria-label="Labels">
<mat-chip-row
(removed)="remove(label)"
*ngFor="let label of labels"
[ngStyle]="{ background: label.color }"
>
<span
[ngStyle]="{ color: labelTextColors[label._id] }"
>{{ label.label }}</span
>
<button
matChipRemove
[ngStyle]="{ color: labelTextColors[label._id] }"
>
<mat-icon>cancel</mat-icon>
</button>
</mat-chip-row>
</mat-chip-grid>
<input
[placeholder]="
allLabels.length === 0
? 'No labels available - Click \'Manage Labels\''
: 'Click to add label'
"
#labelInput
[formControl]="labelCtrl"
[matChipInputFor]="chipGrid"
[matAutocomplete]="auto"
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
(matChipInputTokenEnd)="add($event)"
[disabled]="allLabels.length === 0"
/>
<mat-autocomplete
#auto="matAutocomplete"
(optionSelected)="selected($event)"
>
<mat-icon>cancel</mat-icon>
</button>
</mat-chip-row>
</mat-chip-grid>
<input
placeholder="Click to add label"
#labelInput
[formControl]="labelCtrl"
[matChipInputFor]="chipGrid"
[matAutocomplete]="auto"
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
(matChipInputTokenEnd)="add($event)"
/>
<mat-autocomplete
#auto="matAutocomplete"
(optionSelected)="selected($event)"
>
@for (label of filteredLabels | async; track label) {
<mat-option [value]="label">{{ label }}</mat-option>
}
</mat-autocomplete>
</mat-form-field>
@for (label of filteredLabels | async; track label) {
<mat-option [value]="label">{{ label }}</mat-option>
}
</mat-autocomplete>
</mat-form-field>
</div>
<div fxLayoutAlign="start center">
<button
mat-raised-button
color="accent"
[routerLink]="['/configuration/labels']"
>
Manage Labels
</button>
</div>
</div>
</div>
<div
*ngIf="!editMode && labelsAvailable"
Expand Down
4 changes: 4 additions & 0 deletions ...details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,10 @@ export class AssetDetailsLabelsComponent implements OnInit, OnChanges {
label.color,
)),
);
this.asset.labelIds =
this.asset.labelIds?.filter(
id => this.allLabels.find(l => l._id === id) !== undefined,
) || [];
this.refreshCurrentLabels();
this.labelsAvailable = true;
});
Expand Down
43 changes: 30 additions & 13 deletions ...t-details-panel/asset-details-basics/asset-details-site/asset-details-site.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,19 +17,36 @@
-->

<div fxLayout="column">
<mat-form-field color="accent" class="w-100">
<mat-label>Site</mat-label>
<mat-select
[disabled]="!editMode"
[(ngModel)]="asset.assetSite.siteId"
(selectionChange)="handleLocationChange($event)"
>
<mat-option *ngFor="let site of sites" [value]="site._id">
{{ site.label }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field color="accent" class="w-100" *ngIf="currentSite">
<div fxLayout="row" fxLayoutGap="15px" fxLayoutAlign="start center">
<div fxFlex fxLayoutAlign="start center">
<mat-form-field
color="accent"
class="w-100"
subscriptSizing="dynamic"
>
<mat-select
[disabled]="!editMode"
[(ngModel)]="asset.assetSite.siteId"
(selectionChange)="handleLocationChange($event)"
>
<mat-option *ngFor="let site of sites" [value]="site._id">
{{ site.label }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxLayoutAlign="start center">
<button
mat-raised-button
color="accent"
[routerLink]="['/configuration/sites']"
>
Manage Sites
</button>
</div>
</div>

<mat-form-field color="accent" class="mt-10 w-100" *ngIf="currentSite">
<mat-label>Area</mat-label>
<mat-select [disabled]="!editMode" [(ngModel)]="asset.assetSite.area">
<mat-option *ngFor="let area of currentSite.areas" [value]="area">
Expand Down

0 comments on commit 1d58e08

Please sign in to comment.