Skip to content

Commit

Permalink
fix: compare dropdowns and icons[3141]
Browse files Browse the repository at this point in the history
  • Loading branch information
Ihar committed Dec 10, 2024
1 parent 56779e2 commit d8c081c
Show file tree
Hide file tree
Showing 5 changed files with 440 additions and 383 deletions.
88 changes: 48 additions & 40 deletions frontend/src/app/modules/analytics/compare/compare.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,14 @@
<!-- </mat-form-field>-->

<div class="p-fluid">
<label for="eventsDropdown">Events:</label>
<label for="eventsDropdown" class="dropdown-border-label">Events:</label>
<p-dropdown
id="eventsDropdown"
[(ngModel)]="eventsLvl"
[(ngModel)]="eventsLvl.value"
[options]="eventOptions"
placeholder="Select Event Level"
(onChange)="onFilterChange()">
(onChange)="onFilterChange()"
[appendTo]="'body'"
>
</p-dropdown>
</div>
</div>
Expand All @@ -48,13 +49,15 @@
<!-- </mat-form-field>-->

<div class="p-fluid">
<label for="propertiesDropdown">Properties:</label>
<label for="propertiesDropdown" class="dropdown-border-label">Properties:</label>
<p-dropdown
id="propertiesDropdown"
[(ngModel)]="propLvl"
[(ngModel)]="propLvl.value"
[options]="propertyOptions"
placeholder="Select Property Level"
(onChange)="onFilterChange()">
(onChange)="onFilterChange()"
[appendTo]="'body'"
>
</p-dropdown>
</div>
</div>
Expand All @@ -69,14 +72,16 @@
<!-- </mat-form-field>-->

<div class="p-fluid">
<label for="childrenDropdown">Children:</label>
<label for="childrenDropdown" class="dropdown-border-label">Children:</label>
<p-dropdown
id="childrenDropdown"
[(ngModel)]="childrenLvl"
[options]="childrenOptions"
optionLabel="label"
placeholder="Select Children Level"
(onChange)="onFilterChange()">
(onChange)="onFilterChange()"
[appendTo]="'body'"
>
</p-dropdown>
</div>
</div>
Expand All @@ -90,14 +95,16 @@
<!-- </mat-form-field>-->

<div class="p-fluid">
<label for="uuidDropdown">UUID:</label>
<label for="uuidDropdown" class="dropdown-border-label">UUID:</label>
<p-dropdown
id="uuidDropdown"
[(ngModel)]="idLvl"
[options]="uuidOptions"
optionLabel="label"
placeholder="Select UUID Level"
(onChange)="onFilterChange()">
(onChange)="onFilterChange()"
[appendTo]="'body'"
>
</p-dropdown>
</div>
</div>
Expand Down Expand Up @@ -129,13 +136,14 @@
<!-- </mat-form-field>-->

<div class="p-fluid">
<label for="typeDropdown">Type:</label>
<label for="typeDropdown" class="dropdown-border-label">Type:</label>
<p-dropdown
id="typeDropdown"
[(ngModel)]="visibleType"
[options]="typeOptions"
optionLabel="label"
placeholder="Select Type">
placeholder="Select Type"
[appendTo]="'body'">
</p-dropdown>
</div>
</div>
Expand All @@ -144,63 +152,63 @@

<div *ngIf="isPolicies" class="content-result">
<app-compare-policy
[childrenLvl]="childrenLvl"
[eventsLvl]="eventsLvl"
[idLvl]="idLvl"
[propLvl]="propLvl"
[type]="visibleType"
[childrenLvl]="childrenLvl.value"
[eventsLvl]="eventsLvl.value"
[idLvl]="idLvl.value"
[propLvl]="propLvl.value"
[type]="visibleType.value"
[value]="result"
(change)="onChange($event)"></app-compare-policy>
</div>

<div *ngIf="isSchemas" class="content-result">
<app-compare-schema
[type]="visibleType"
[type]="visibleType.value"
[value]="result"
[idLvl]="idLvl"
[idLvl]="idLvl.value"
(change)="onChange($event)"></app-compare-schema>
</div>

<div *ngIf="isModules" class="content-result">
<app-compare-module
[childrenLvl]="childrenLvl"
[eventsLvl]="eventsLvl"
[idLvl]="idLvl"
[propLvl]="propLvl"
[type]="visibleType"
[childrenLvl]="childrenLvl.value"
[eventsLvl]="eventsLvl.value"
[idLvl]="idLvl.value"
[propLvl]="propLvl.value"
[type]="visibleType.value"
[value]="result"
(change)="onChange($event)"></app-compare-module>
</div>

<div *ngIf="isMultiPolicies" class="content-result">
<app-multi-compare-policy
[childrenLvl]="childrenLvl"
[eventsLvl]="eventsLvl"
[idLvl]="idLvl"
[propLvl]="propLvl"
[type]="visibleType"
[childrenLvl]="childrenLvl.value"
[eventsLvl]="eventsLvl.value"
[idLvl]="idLvl.value"
[propLvl]="propLvl.value"
[type]="visibleType.value"
[value]="result"
(change)="onChange($event)"></app-multi-compare-policy>
</div>

<div *ngIf="isDocuments" class="content-result">
<app-compare-document
[childrenLvl]="childrenLvl"
[eventsLvl]="eventsLvl"
[idLvl]="idLvl"
[propLvl]="propLvl"
[type]="visibleType"
[childrenLvl]="childrenLvl.value"
[eventsLvl]="eventsLvl.value"
[idLvl]="idLvl.value"
[propLvl]="propLvl.value"
[type]="visibleType.value"
[value]="result"
(change)="onChange($event)"></app-compare-document>
</div>

<div *ngIf="isTools" class="content-result">
<app-compare-tool
[childrenLvl]="childrenLvl"
[eventsLvl]="eventsLvl"
[idLvl]="idLvl"
[propLvl]="propLvl"
[type]="visibleType"
[childrenLvl]="childrenLvl.value"
[eventsLvl]="eventsLvl.value"
[idLvl]="idLvl.value"
[propLvl]="propLvl.value"
[type]="visibleType.value"
[value]="result"
(change)="onChange($event)"></app-compare-tool>
</div>
Expand Down
15 changes: 15 additions & 0 deletions frontend/src/app/modules/analytics/compare/compare.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -243,3 +243,18 @@
min-width: 0px;
}
}

.p-fluid {
position: relative;
padding: 8px 0
}

.dropdown-border-label {
background: var(--color-grey-white);
position: absolute;
z-index: 10;
font-size: 11px;
top: 3px;
left: 18px;
color: var(--color-grey-5);
}
72 changes: 36 additions & 36 deletions frontend/src/app/modules/analytics/compare/compare.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,13 +17,40 @@ enum ItemType {
styleUrls: ['./compare.component.scss']
})
export class CompareComponent implements OnInit {
public eventOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'All events', value: 1}
];

public propertyOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'Only simple properties', value: 1},
{label: 'All properties', value: 2}
];

public childrenOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'Only child blocks of the first level', value: 1},
{label: 'All children', value: 2}
];

public uuidOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'All UUID', value: 1}
];

public typeOptions: any[] = [
{label: 'Tree', value: 'tree'},
{label: 'Table', value: 'table'}
];

public loading: boolean = true;
public eventsLvl: string = '1';
public propLvl: string = '2';
public childrenLvl: string = '2';
public idLvl: string = '0';
public eventsLvl: Record<string, any> = this.eventOptions[1];
public propLvl: Record<string, any> = this.propertyOptions[2]
public childrenLvl: Record<string, any> = this.childrenOptions[2];
public idLvl: Record<string, any> = this.uuidOptions[0];
public needApplyFilters: boolean = false;
public visibleType: 'tree' | 'table' = 'tree';
public visibleType: Record<string, any> = this.typeOptions[0];
public result: any;
public total: any;

Expand Down Expand Up @@ -76,33 +103,6 @@ export class CompareComponent implements OnInit {
return this.type === ItemType.Tool;
}

public eventOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'All events', value: 1}
];

public propertyOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'Only simple properties', value: 1},
{label: 'All properties', value: 2}
];

public childrenOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'Only child blocks of the first level', value: 1},
{label: 'All children', value: 2}
];

public uuidOptions = [
{label: 'Don\'t compare', value: 0},
{label: 'All UUID', value: 1}
];

public typeOptions: any[] = [
{label: 'Tree', value: 'tree'},
{label: 'Table', value: 'table'}
];

constructor(
private route: ActivatedRoute,
private router: Router,
Expand Down Expand Up @@ -235,10 +235,10 @@ export class CompareComponent implements OnInit {
private loadPolicy() {
this.error = null;
const options = {
eventsLvl: this.eventsLvl,
propLvl: this.propLvl,
childrenLvl: this.childrenLvl,
idLvl: this.idLvl,
eventsLvl: this.eventsLvl.value,
propLvl: this.propLvl.value,
childrenLvl: this.childrenLvl.value,
idLvl: this.idLvl.value,
policies: this.getItems()
}
if (!options.policies || options.policies.length < 2) {
Expand Down
Loading

0 comments on commit d8c081c

Please sign in to comment.