sebastian/ConceptCreator
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases Wiki Activity

Edit ItemgroupCharacteristic
All checks were successful
E2E Testing / test (push) Successful in 1m32s
Details

Browse Source
This commit is contained in:
Sebastian Böckelmann 2024-05-06 19:51:00 +02:00
parent 1266e4b53d
commit cf95fe234e
3 changed files with 32 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/app/editor/items/item-group-editor/item-group-editor.component.html
View File

@ -1,15 +1,30 @@
<table mat-table [dataSource]="itemQualityDatasource" class="mat-elevation-z8"> <table mat-table [dataSource]="itemQualityDatasource" class="mat-elevation-z8">
<ng-container matColumnDef="Characteristic"> <ng-container matColumnDef="Characteristic">
<th mat-header-cell *matHeaderCellDef> Characteristic </th> <th mat-header-cell *matHeaderCellDef> Characteristic </th>
<td mat-cell *matCellDef="let element"> {{element.characteristicName}} </td> <td mat-cell *matCellDef="let element">
<span *ngIf="editedCharacteristic !== element">{{element.characteristicName}}</span>
<mat-form-field appearance="outline" *ngIf="editedCharacteristic === element" style="width: 100%">
<mat-label>Name</mat-label>
<input matInput [(ngModel)]="element.characteristicName">
</mat-form-field>
</td>
</ng-container> </ng-container>
<ng-container matColumnDef="Description"> <ng-container matColumnDef="Description">
<th mat-header-cell *matHeaderCellDef> Description </th> <th mat-header-cell *matHeaderCellDef> Description </th>
<td mat-cell *matCellDef="let element"> {{element.characteristicDescription}} </td> <td mat-cell *matCellDef="let element">
<span *ngIf="editedCharacteristic !== element">{{element.characteristicDescription}}</span>
<mat-form-field appearance="outline" *ngIf="editedCharacteristic === element" style="width: 100%">
<mat-label>Name</mat-label>
<textarea matInput [(ngModel)]="element.characteristicDescription" rows="3"></textarea>
</mat-form-field>
</td>
</ng-container> </ng-container>
<ng-container matColumnDef="edit"> <ng-container matColumnDef="edit">
<th mat-header-cell *matHeaderCellDef> </th> <th mat-header-cell *matHeaderCellDef> </th>
<td mat-cell *matCellDef="let element"><button mat-icon-button><mat-icon>edit</mat-icon></button></td> <td mat-cell *matCellDef="let element">
<button mat-icon-button *ngIf="editedCharacteristic !== element" [disabled]="editedCharacteristic" (click)="editItemgroupCharacteristic(element)"><mat-icon>edit</mat-icon></button>
<button mat-icon-button *ngIf="editedCharacteristic === element" (click)="finishEditing()"><mat-icon>done</mat-icon></button>
</td>
</ng-container> </ng-container>
<ng-container matColumnDef="delete"> <ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef> <button mat-icon-button><mat-icon>add</mat-icon></button> </th> <th mat-header-cell *matHeaderCellDef> <button mat-icon-button><mat-icon>add</mat-icon></button> </th>

4
src/app/editor/items/item-group-editor/item-group-editor.component.scss
View File

@ -1,3 +1,7 @@
.mat-column-edit, .mat-column-delete { .mat-column-edit, .mat-column-delete {
width: 32px; width: 32px;
} }
.mat-column-Characteristic, {
width: 25%;
}

10
src/app/editor/items/item-group-editor/item-group-editor.component.ts
View File

@ -16,6 +16,8 @@ export class ItemGroupEditorComponent implements OnInit{
itemQualityDatasource: MatTableDataSource<ItemGroupCharacteristic> = new MatTableDataSource<ItemGroupCharacteristic>(); itemQualityDatasource: MatTableDataSource<ItemGroupCharacteristic> = new MatTableDataSource<ItemGroupCharacteristic>();
displayedColumns: string[] = ["Characteristic", "Description", 'edit', 'delete'] displayedColumns: string[] = ["Characteristic", "Description", 'edit', 'delete']
editedCharacteristic: ItemGroupCharacteristic | undefined;
ngOnInit(): void { ngOnInit(): void {
this.itemgroup!.itemGroupCharacteristics.push(new ItemGroupCharacteristic("Inventory", "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.")) this.itemgroup!.itemGroupCharacteristics.push(new ItemGroupCharacteristic("Inventory", "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."))
@ -26,4 +28,12 @@ export class ItemGroupEditorComponent implements OnInit{
this.itemgroup!.itemGroupCharacteristics = this.itemgroup!.itemGroupCharacteristics.filter(igc => igc.characteristicName !== characteristic.characteristicName); this.itemgroup!.itemGroupCharacteristics = this.itemgroup!.itemGroupCharacteristics.filter(igc => igc.characteristicName !== characteristic.characteristicName);
this.itemQualityDatasource.data = this.itemgroup!.itemGroupCharacteristics; this.itemQualityDatasource.data = this.itemgroup!.itemGroupCharacteristics;
} }
editItemgroupCharacteristic(characteristic: ItemGroupCharacteristic) {
this.editedCharacteristic = characteristic;
}
finishEditing() {
this.editedCharacteristic = undefined;
}
} }