tykayn/ng-implementation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

up filters component

Browse source
This commit is contained in:
Tykayn 2025-09-22 11:57:03 +02:00 • committed by tykayn
parent 4e2451d600
commit e815c56815
2 changed files with 72 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

94
my-workspace/projects/sae-lib/filters/filters-group/filters-group.html
View file

@ -14,73 +14,117 @@
(availableChoicesChange)="onAvailableChoicesChange($event, 'findings')"
(selectedChoicesChange)="onSelectedChoicesChange($event, 'findings')"
[actionTypes]="actionTypes"
[availableChoices]="appState.filters?.findings?.availableChoices || []"
[label]="'Findings'"
[selectedChoices]="appState.filters?.findings?.selectedChoices || []"
[availableChoices]="appState.filters?.findings?.availableChoices || []"
[store]="store"
></sae-multi-selector>
<sae-multi-selector
(availableChoicesChange)="onAvailableChoicesChange($event, 'ata')"
(selectedChoicesChange)="onSelectedChoicesChange($event, 'ata')"
[actionTypes]="actionTypes"
[availableChoices]="appState.filters?.ata?.availableChoices || []"
[label]="'ATA'"
[selectedChoices]="appState.filters?.ata?.selectedChoices || []"
[availableChoices]="appState.filters?.ata?.availableChoices || []"
[store]="store"
></sae-multi-selector>
<sae-multi-selector
(availableChoicesChange)="onAvailableChoicesChange($event, 'partNumber')"
(selectedChoicesChange)="onSelectedChoicesChange($event, 'partNumber')"
[actionTypes]="actionTypes"
[availableChoices]="appState.filters?.partNumber?.availableChoices || []"
[label]="'Part number'"
[selectedChoices]="appState.filters?.partNumber?.selectedChoices || []"
[availableChoices]="appState.filters?.partNumber?.availableChoices || []"
[store]="store"
></sae-multi-selector>
<sae-multi-selector
(availableChoicesChange)="onAvailableChoicesChange($event, 'technicalManual')"
(selectedChoicesChange)="onSelectedChoicesChange($event, 'technicalManual')"
[actionTypes]="actionTypes"
[availableChoices]="appState.filters?.technicalManual?.availableChoices || []"
[label]="'Technical Manual'"
[selectedChoices]="appState.filters?.technicalManual?.selectedChoices || []"
[availableChoices]="appState.filters?.technicalManual?.availableChoices || []"
[store]="store"
></sae-multi-selector>
<sae-multi-selector
(availableChoicesChange)="onAvailableChoicesChange($event, 'wingStatus')"
(selectedChoicesChange)="onSelectedChoicesChange($event, 'wingStatus')"
[actionTypes]="actionTypes"
[availableChoices]="appState.filters?.wingStatus?.availableChoices || []"
[label]="'On-wing/off-wing'"
[selectedChoices]="appState.filters?.wingStatus?.selectedChoices || []"
[availableChoices]="appState.filters?.wingStatus?.availableChoices || []"
[store]="store"
></sae-multi-selector>
</div>
<div (click)="highlighted = !highlighted" class="chips-listing">
<!-- liste de chips-->
<pre>
filters:
{{ appState.filters }}
</pre>
<!-- <pre>-->
<!-- filters:-->
<!-- {{ appState.filters }}-->
<!-- </pre>-->
<!-- hideChipsList : {{ hideChipsList }}-->
<!-- selectedChoices : {{ appState.filters.engineType.selectedList.length }}-->
@if (!hideChipsList) {
<div class="chips-column">
<!-- @for( elem in appState.filters.engineType.selectedChoices; track elem.label ){-->
<!-- <button class="button chips is-rounded is-small">-->
<!-- {{elem.label}}-->
<!-- <span class="post-button">-->
<!-- x-->
<!-- </span>-->
<!-- </button>-->
<!-- }-->
<button class="button chips is-rounded is-small">
filtre col 2
<span class="post-button">
x
</span>
</button>
@for (elem of appState.filters.engineType.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
<div class="chips-column">
@for (elem of appState.filters.findings.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
<div class="chips-column">
@for (elem of appState.filters.ata.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
<div class="chips-column">
@for (elem of appState.filters.partNumber.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
<div class="chips-column">
@for (elem of appState.filters.technicalManual.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
<div class="chips-column">
@for (elem of appState.filters.onOffWing.selectedList; track elem.label) {
<button class="button chips is-rounded is-small">
{{ elem.label }}
<span class="post-button">
x
</span>
</button>
}
</div>
}
<!-- <div class="chips-column">-->

10
my-workspace/projects/sae-lib/filters/filters-group/filters-group.scss
View file

@ -42,13 +42,6 @@
}
}
.chips-listing {
display: flex;
border-radius: 8px;
position: absolute;
top: 577px;
}
.filter-group {
@ -64,6 +57,9 @@
}
.chips-listing {
display: flex;
position: absolute;
top: 650px;
margin-top: 16px;
border-radius: 4px;
background: variables.$csc-filters-box-color;