Skip to content

Commit

Permalink
fix: zoneless completed
Browse files Browse the repository at this point in the history
  • Loading branch information
@ralfaron
ralfaron committed Jun 14, 2024
1 parent 95d4591 commit 8ac8c5d
Show file tree
Hide file tree
Showing 36 changed files with 6,331 additions and 2,179 deletions.
7,189 changes: 5,815 additions & 1,374 deletions package-lock.json
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion projects/aas-lib/src/lib/aas-table/aas-table.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
!---------------------------------------------------------------------------->

@if (rows().length > 0) {
@if (viewMode === 'list') {
@if (viewMode() === 'list') {
<table class="table table-sm table-hover table-striped">
<thead>
<tr>
Expand Down
81 changes: 34 additions & 47 deletions projects/aas-lib/src/lib/aas-table/aas-table.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@
*
*****************************************************************************/

import { Component, EventEmitter, Input, OnDestroy, Output, computed, effect } from '@angular/core';
import { Component, OnDestroy, computed, effect, input, model, untracked } from '@angular/core';
import { Router } from '@angular/router';
import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
import { TranslateModule } from '@ngx-translate/core';
import { TranslateModule, TranslateService } from '@ngx-translate/core';
import { AASDocument } from 'common';

import { AASTableRow } from './aas-table-row';
Expand All @@ -18,6 +18,7 @@ import { WindowService } from '../window.service';
import { ViewMode } from '../types/view-mode';
import { AASTableStore } from './aas-table.store';
import { MaxLengthPipe } from '../max-length.pipe';
import { AASTableFilter } from './aas-table.filter';

@Component({
selector: 'fhg-aas-table',
Expand All @@ -36,69 +37,55 @@ export class AASTableComponent implements OnDestroy {
private readonly store: AASTableStore,
private readonly clipboard: ClipboardService,
private readonly window: WindowService,
private readonly translate: TranslateService,
) {
effect(() => {
this.selectedChange.emit(this.store.selectedDocuments());
});
effect(
() => {
this.store.initialize(this.documents(), untracked(this.viewMode));
},
{ allowSignalWrites: true },
);

effect(
() => {
this.store.setSelected(this.selected(), untracked(this.viewMode));
},
{ allowSignalWrites: true },
);

this.window.addEventListener('keyup', this.keyup);
this.window.addEventListener('keydown', this.keydown);
}

@Input()
public get viewMode(): ViewMode {
return this.store.viewMode();
}

public set viewMode(value: ViewMode) {
this.store.viewMode.set(value);
}

@Input()
public get documents(): AASDocument[] {
return this.store.rows().map(row => row.element);
}

public set documents(values: AASDocument[]) {
this.store.initialize(values);
}
public readonly viewMode = input<ViewMode>(ViewMode.List);

@Output()
public selectedChange = new EventEmitter<AASDocument[]>();
public readonly documents = input<AASDocument[]>([]);

@Input()
public get selected(): AASDocument[] {
return this.store
.rows()
.filter(row => row.selected)
.map(row => row.element);
}
public readonly selected = model<AASDocument[]>([]);

public set selected(values: AASDocument[]) {
this.store.setSelections(values);
}
public readonly filter = input('');

@Input()
public get filter(): string {
return this.store.filterText();
}
public readonly rows = computed(() => {
const rows = this.store.rows();
const filterText = this.filter();
if (this.viewMode() === ViewMode.List && filterText) {
const filter = new AASTableFilter(filterText, this.translate.currentLang);
return rows.filter(row => filter.match(row.element));
}

public set filter(value: string) {
this.store.filterText.set(value);
}
return rows;
});

public readonly someSelected = computed(() => {
const rows = this.store.rows();
const rows = this.rows();
return rows.length > 0 && rows.some(row => row.selected) && !rows.every(row => row.selected);
});

public readonly everySelected = computed(() => {
const rows = this.store.rows();
const rows = this.rows();
return rows.length > 0 && rows.every(row => row.selected);
});

public readonly rows = this.store.rows;

public ngOnDestroy(): void {
this.window.removeEventListener('keyup', this.keyup);
this.window.removeEventListener('keydown', this.keydown);
Expand Down Expand Up @@ -128,11 +115,11 @@ export class AASTableComponent implements OnDestroy {
}

public toggleSelected(row: AASTableRow): void {
this.store.toggleSelected(row, this.altKey, this.shiftKey);
this.selected.set(this.store.toggleSelected(row, this.altKey, this.shiftKey, this.viewMode()));
}

public toggleSelections(): void {
this.store.toggleSelections();
this.selected.set(this.store.toggleSelections(this.viewMode()));
}

private keyup = () => {
Expand Down
74 changes: 26 additions & 48 deletions projects/aas-lib/src/lib/aas-table/aas-table.store.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,82 +6,58 @@
*
*****************************************************************************/

import { Injectable, computed, signal } from '@angular/core';
import { Injectable, signal, untracked } from '@angular/core';
import findLastIndex from 'lodash-es/findLastIndex';
import { TranslateService } from '@ngx-translate/core';
import { AASDocument } from 'common';
import { ViewMode } from '../types/view-mode';
import { AASTableRow, AASTableTree } from './aas-table-row';
import { AASTableFilter } from './aas-table.filter';

@Injectable()
export class AASTableStore {
private readonly _selectedDocuments = signal<AASDocument[]>([]);
private readonly _totalRows = signal<AASTableRow[]>([]);
private readonly _rows = signal<AASTableRow[]>([]);

public constructor(private readonly translate: TranslateService) {}
public readonly rows = this._rows.asReadonly();

public readonly selectedDocuments = this._selectedDocuments.asReadonly();

public readonly filterText = signal('');

public readonly viewMode = signal(ViewMode.List);

public readonly rows = computed(() => {
const rows = this._rows();
const filterText = this.filterText();
if (this.viewMode() === ViewMode.List && filterText) {
const filter = new AASTableFilter(filterText, this.translate.currentLang);
return rows.filter(row => filter.match(row.element));
}

return rows;
});

public setSelections(documents: AASDocument[]): void {
const tree = new AASTableTree(this._totalRows());
public setSelected(documents: AASDocument[], viewMode: ViewMode): void {
const tree = new AASTableTree(untracked(this._totalRows));
tree.selectedElements = documents;
this._totalRows.set(tree.nodes);
if (this.viewMode() === ViewMode.List) {
if (viewMode === ViewMode.List) {
this._rows.set(tree.nodes);
} else {
this._rows.set(tree.expanded);
}
}

public toggleSelected(row: AASTableRow, altKey: boolean, shiftKey: boolean): void {
public toggleSelected(row: AASTableRow, altKey: boolean, shiftKey: boolean, viewMode: ViewMode): AASDocument[] {
const tree = new AASTableTree(this._totalRows());
tree.toggleSelected(row, altKey, shiftKey);
this._totalRows.set(tree.nodes);
if (this.viewMode() === ViewMode.List) {
if (viewMode === ViewMode.List) {
this._rows.set(tree.nodes);
} else {
this._rows.set(tree.expanded);
}

this._selectedDocuments.set(
this._totalRows()
.filter(row => row.selected)
.map(row => row.element),
);
return this._totalRows()
.filter(row => row.selected)
.map(row => row.element);
}

public toggleSelections(): void {
public toggleSelections(viewMode: ViewMode): AASDocument[] {
const tree = new AASTableTree(this._totalRows());
tree.toggleSelections();
this._totalRows.set(tree.nodes);
if (this.viewMode() === ViewMode.List) {
if (viewMode === ViewMode.List) {
this._rows.set(tree.nodes);
} else {
this._rows.set(tree.expanded);
}

this._selectedDocuments.set(
this._totalRows()
.filter(row => row.selected)
.map(row => row.element),
);
return this._totalRows()
.filter(row => row.selected)
.map(row => row.element);
}

public expandRow(row: AASTableRow): void {
Expand All @@ -96,17 +72,19 @@ export class AASTableStore {
this._rows.set(tree.expanded);
}

public initialize(documents: AASDocument[]): void {
this._totalRows.set(
this.viewMode() === ViewMode.List
? this.createListViewRows(this._totalRows(), documents)
: this.createTreeViewRows(this._totalRows(), documents),
);
public initialize(documents: AASDocument[], viewMode: ViewMode): void {
const state = untracked(this._totalRows);
const totalRows =
viewMode === ViewMode.List
? this.createListViewRows(state, documents)
: this.createTreeViewRows(state, documents);

this._totalRows.set(totalRows);

if (this.viewMode() === ViewMode.List) {
this._rows.set(this._totalRows());
if (viewMode === ViewMode.List) {
this._rows.set(totalRows);
} else {
this._rows.set(new AASTableTree(this._totalRows()).expanded);
this._rows.set(new AASTableTree(totalRows).expanded);
}
}

Expand Down
11 changes: 4 additions & 7 deletions projects/aas-lib/src/lib/aas-tree/show-image-form/show-image-form.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,26 +9,23 @@
import { Component } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { SecuredImageComponent } from '../../secured-image/secured-image.component';
import { TranslateModule } from '@ngx-translate/core';

@Component({
selector: 'fhg-show-image',
templateUrl: './show-image-form.component.html',
styleUrls: ['./show-image-form.component.scss'],
standalone: true,
imports: [SecuredImageComponent],
imports: [SecuredImageComponent, TranslateModule],
})
export class ShowImageFormComponent {
private readonly _modal: NgbActiveModal;

public constructor(modal: NgbActiveModal) {
this._modal = modal;
}
public constructor(private readonly modal: NgbActiveModal) {}

public name!: string;

public image!: string;

public close(): void {
this._modal.close();
this.modal.close();
}
}
10 changes: 4 additions & 6 deletions projects/aas-lib/src/lib/aas-tree/show-video-form/show-video-form.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,25 +8,23 @@

import { Component } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { TranslateModule } from '@ngx-translate/core';

@Component({
selector: 'fhg-show-video',
templateUrl: './show-video-form.component.html',
styleUrls: ['./show-video-form.component.scss'],
standalone: true,
imports: [TranslateModule],
})
export class ShowVideoFormComponent {
private readonly _modal: NgbActiveModal;

public constructor(modal: NgbActiveModal) {
this._modal = modal;
}
public constructor(private readonly modal: NgbActiveModal) {}

public name!: string;

public video!: string;

public close(): void {
this._modal.close();
this.modal.close();
}
}
4 changes: 2 additions & 2 deletions projects/aas-lib/src/lib/auth/auth.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@
translate>CMD_LOGIN</a>
<a type="button" class="dropdown-item" (click)="register()" (keydown.enter)="register()" tabindex="2"
translate>CMD_REGISTER_USER</a>
<a type="button" class="dropdown-item" (click)="updateUserProfile()" (keydown.enter)="updateUserProfile()"
tabindex="3" translate>CMD_UPDATE_PROFILE</a>
}
@else {
<a type="button" class="dropdown-item" (click)="logout()" (keydown.enter)="logout()" tabindex="4"
translate>CMD_LOGOUT</a>
<a type="button" class="dropdown-item" (click)="updateUserProfile()" (keydown.enter)="updateUserProfile()"
tabindex="3" translate>CMD_UPDATE_PROFILE</a>
}
</div>
</div>
12 changes: 6 additions & 6 deletions projects/aas-lib/src/lib/customer-feedback/customer-feedback.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,19 +9,19 @@
<div class="container border rounded">
<div class="row">
<div class="col fs-3 text-start">
<span translate>CustomerFeedback.OverallRating</span><span>&nbsp;</span><span>({{count | number}})</span>
<span translate>CustomerFeedback.OverallRating</span><span>&nbsp;</span><span>({{count() | number}})</span>
</div>
<div class="col fs-3 text-warning text-end">
@for (starClassName of starClassNames; track starClassName) {
@for (starClassName of starClassNames(); track starClassName) {
<i [class]="starClassName"></i><span>&nbsp;</span>
}
<span class="text-body">{{stars | number: '1.1-1'}}</span>
<span class="text-body">{{stars() | number: '1.1-1'}}</span>
</div>
</div>
<div class="row">
<div class="col fw-light fst-italic">{{name}}</div>
<div class="col fw-light fst-italic">{{name()}}</div>
</div>
@for (item of items; track item) {
@for (item of items(); track item) {
<div class="row">
<div class="col-5">{{item.name}}</div>
<div class="col-7">
Expand All @@ -31,7 +31,7 @@
}
</div>
<div class="container mt-3">
@for (feedback of feedbacks; track feedback; let i = $index) {
@for (feedback of feedbacks(); track feedback; let i = $index) {
<div [class]="i % 2 === 0 ? 'd-flex flex-column mb-3' : 'd-flex flex-column mb-3 bg-secondary bg-opacity-10'">
<div class="d-flex">
<div class="text-warning">
Expand Down
Loading

0 comments on commit 8ac8c5d

Please sign in to comment.