refactoring

matsen-tool/openapi.yaml

@@ -6854,6 +6854,11 @@ components:
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
+        imageUrl:
+          readOnly: true
+          type:
+            - string
+            - 'null'
         password:
           writeOnly: true
           description: 'The plaintext password when being set or changed.'
@@ -6907,6 +6912,11 @@ components:
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
+        imageUrl:
+          readOnly: true
+          type:
+            - string
+            - 'null'
         password:
           writeOnly: true
           description: 'The plaintext password when being set or changed.'
@@ -6974,6 +6984,11 @@ components:
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
+        imageUrl:
+          readOnly: true
+          type:
+            - string
+            - 'null'
         password:
           writeOnly: true
           description: 'The plaintext password when being set or changed.'

matsen-tool/src/app/_forms/apiForms.ts

@@ -548,6 +548,7 @@ export const userForm = new FormGroup({
   firstName: new FormControl(null, [Validators.required]),
   lastName: new FormControl(null, [Validators.required]),
   image: new FormControl(null, []),
+  imageUrl: new FormControl(null, []),
   password: new FormControl(null, []),
   active: new FormControl(null, []),
   createdAt: new FormControl(null, [])
@@ -559,6 +560,7 @@ export const userJsonhalForm = new FormGroup({
   firstName: new FormControl(null, [Validators.required]),
   lastName: new FormControl(null, [Validators.required]),
   image: new FormControl(null, []),
+  imageUrl: new FormControl(null, []),
   password: new FormControl(null, []),
   active: new FormControl(null, []),
   createdAt: new FormControl(null, [])
@@ -569,6 +571,7 @@ export const userJsonldForm = new FormGroup({
   firstName: new FormControl(null, [Validators.required]),
   lastName: new FormControl(null, [Validators.required]),
   image: new FormControl(null, []),
+  imageUrl: new FormControl(null, []),
   password: new FormControl(null, []),
   active: new FormControl(null, []),
   createdAt: new FormControl(null, [])

matsen-tool/src/app/_models/user.ts

@@ -1,4 +1,6 @@
-export class User {
+import {UserJsonld} from "@app/core/api/v1";
+
+export class User {
     id?: string;
     email?: string;
     password?: string;
@@ -6,4 +8,5 @@
     lastName?: string;
     roles?: string[];
     token?: string;
+    userResource?: UserJsonld;
 }

matsen-tool/src/app/_views/home/home.component.html

@@ -61,136 +61,10 @@
     </div>
 
     <div class="container spt-container">
-        <app-toggle #togglePosts [headline]="('user.my' | translate) + ' ' + ('basic.tasks' | translate)">
-            <div class="spt-accordion position-relative">
-                <button class="btn btn-primary toggle-btn"
-                        (click)="openModalNewTask()">{{ 'basic.new-task' | translate }}
-                </button>
-                <div class="tasks mb-3" *ngFor="let task of tasks">
-                    <div class="card p-3">
-                        <div class="position-relative">
-                            <h3 class="m-0" *ngIf="task.partner"><a href="/{{task.partnerType}}/{{appHelperService.extractId(task.partner)}}">{{task.partnerName}}</a></h3>
-                            <span class="info d-flex position-absolute">
-                                <span class="due-date">{{ task.dueAt | date:'dd.MM.YYYY':'GMT+0000' }}</span>
-                                <span class="importance" [attr.data-importance]="task.prio"></span>
-                            </span>
-                            <h2 class="m-0">{{ task.headline }}</h2>
-                            <div class="pt-3 pe-5 position-relative">
-                                <p class="m-0" [innerHTML]="appHelperService.getSafeLongtext(task.description)"></p>
-                                <p>Zugewiesen an: {{ task.assignedToName }}</p>
-                                <span *ngIf="task.createdBy === user?.id" class="position-absolute bi bi-pencil p-2"
-                                      data-type="user-tool" data-action="edit" (click)="openModalEditTask(task)"></span>
-                            </div>
-                        </div>
-                    </div>
-                    <ng-container *ngIf="task.id && taskNotesVisibility.get(task.id)">
-                        <div class="card ms-5" *ngFor="let taskNote of task.taskNotes">
-                            <div class="card-body">
-                                <div class="d-flex justify-content-between align-items-center">
-                                    <p>{{ taskNote.createdAt | date:'dd.MM.YYYY' }}</p>
-                                    <p>{{ taskNote.ownerName }}</p>
-                                </div>
-                                <div>
-                                    <p>{{ taskNote.message }}</p>
-                                </div>
-                                <span *ngIf="taskNote.owner === user?.id" class="position-absolute bi bi-pencil p-2"
-                                      data-type="user-tool" data-action="edit"
-                                      (click)="openModalEditTaskNote(taskNote)"></span>
-                            </div>
-                        </div>
-                    </ng-container>
-
-                    <div class="d-flex justify-content-end mt-1">
-                        <span *ngIf="task.taskNotes?.length !== 0" role="button" class="badge bg-secondary p-2 me-2"
-                              (click)="showTaskNotes(task)">
-                            <ng-container
-                                    *ngIf="task.id && taskNotesVisibility.get(task.id)">{{ 'basic.hide-comments' | translate }}</ng-container>
-                            <ng-container
-                                    *ngIf="task.id && !taskNotesVisibility.get(task.id)">{{ 'basic.show-comments' | translate }}</ng-container>
-                        </span>
-                        <span role="button" class="badge bg-secondary p-2"
-                              (click)="openModalNewTaskNote(task)">{{ 'basic.comment-it' | translate }}</span>
-                    </div>
-                </div>
-                <mat-paginator *ngIf="tasks.length > 0" class="rounded-1"
-                               [pageSizeOptions]="[10,20,30]"
-                               [length]="tasksLength"
-                               (page)="tasksHandlePageEvent($event)"
-                               [pageSize]="tasksPageSize"
-                               [pageIndex]="tasksPageIndex"
-                               showFirstLastButtons>
-                </mat-paginator>
-            </div>
+        <app-toggle #toggleTasks [headline]="('user.my' | translate) + ' ' + ('basic.tasks' | translate)">
+            <app-task-list #taskListComponent
+                   [user]="user?.userResource">
+            </app-task-list>
         </app-toggle>
     </div>
-
-    <!--    <div class="container spt-container">-->
-    <!--        <div class="d-flex justify-content-between align-items-start">-->
-    <!--            <h2>{{'user.my' | translate}} {{'basic.customer' | translate}}</h2>-->
-    <!--        </div>-->
-    <!--        <table mat-table [dataSource]="dataSource" matSort (matSortChange)="onSortChange($event)"-->
-    <!--               class="mat-elevation-z8 mb-3">-->
-
-    <!--            <ng-container matColumnDef="pos">-->
-    <!--                <th mat-header-cell *matHeaderCellDef>-->
-    <!--                    {{ 'overview.number' | translate }}-->
-    <!--                </th>-->
-    <!--                <td mat-cell-->
-    <!--                    *matCellDef="let element">{{ (pageSize * pageIndex) + dataSource.filteredData.indexOf(element) + 1 }}-->
-    <!--                </td>-->
-    <!--            </ng-container>-->
-
-    <!--            <ng-container matColumnDef="image">-->
-    <!--                <th mat-header-cell *matHeaderCellDef>-->
-    <!--                    {{ 'overview.logo' | translate }}-->
-    <!--                </th>-->
-    <!--                <td mat-cell *matCellDef="let element">-->
-    <!--                    <img role="button" src="{{ element.logoUrl }}" (click)="navigateToPartnerDetails(element)" width="40"-->
-    <!--                         height="40"/>-->
-    <!--                </td>-->
-    <!--            </ng-container>-->
-
-    <!--            <ng-container matColumnDef="name">-->
-    <!--                <th mat-header-cell *matHeaderCellDef mat-sort-header-->
-    <!--                    sortActionDescription="{{ 'overview.sort' | translate }}: {{ partnerNameOne }}">-->
-    <!--                    {{ partnerNameOne }}-->
-    <!--                </th>-->
-    <!--                <td mat-cell *matCellDef="let element"><span role="button"-->
-    <!--                                                             (click)="navigateToPartnerDetails(element)">{{ element.name }}</span>-->
-    <!--                </td>-->
-    <!--            </ng-container>-->
-
-    <!--            <ng-container matColumnDef="address">-->
-    <!--                <th mat-header-cell *matHeaderCellDef mat-sort-header="address"-->
-    <!--                    sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.address' | translate }}">-->
-    <!--                    {{ 'overview.address' | translate }}-->
-    <!--                </th>-->
-    <!--                <td mat-cell *matCellDef="let element">{{ element.street }} {{ element.streetNo }}-->
-    <!--                    <br/>{{ element.zip }} {{ element.city }}-->
-    <!--                    <br/>{{ element.country }}-->
-    <!--                </td>-->
-    <!--            </ng-container>-->
-
-    <!--            <ng-container matColumnDef="website">-->
-    <!--                <th mat-header-cell *matHeaderCellDef mat-sort-header-->
-    <!--                    sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.website' | translate }}">-->
-    <!--                    {{ 'overview.website' | translate }}-->
-    <!--                </th>-->
-    <!--                <td mat-cell *matCellDef="let element"><a href="{{ element.website }}"-->
-    <!--                                                          target="_blank">{{ element.website }}</a>-->
-    <!--                </td>-->
-    <!--            </ng-container>-->
-
-    <!--            <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>-->
-    <!--            <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>-->
-    <!--        </table>-->
-    <!--        <mat-paginator class="rounded-1"-->
-    <!--                       [pageSizeOptions]="[10,25,50]"-->
-    <!--                       [length]="length"-->
-    <!--                       (page)="handlePageEvent($event)"-->
-    <!--                       [pageSize]="pageSize"-->
-    <!--                       [pageIndex]="pageIndex"-->
-    <!--                       showFirstLastButtons>-->
-    <!--        </mat-paginator>-->
-    <!--    </div>-->
-</div>
+</div>

matsen-tool/src/app/_views/home/home.component.ts

@@ -19,12 +19,18 @@ import {NewTaskComponent} from "@app/_views/tasks/new-task/new-task.component";
 import {ModalStatus} from "@app/_helpers/modal.states";
 import {NewTaskNoteComponent} from "@app/_views/tasks/new-task-note/new-task-note.component";
 import {AppHelperService} from "@app/_helpers/app-helper.service";
+import {ToggleComponent} from "@app/_components/toggle/toggle.component";
+import {TaskListComponent} from "@app/_views/tasks/task-list/task-list.component";
 
 @Component({
     templateUrl: 'home.component.html',
     styleUrl: 'home.component.scss'
 })
 export class HomeComponent implements OnInit, AfterViewInit {
+
+    @ViewChild("toggleTasks", { static: true }) toggleTasks: ToggleComponent = new ToggleComponent();
+    @ViewChild("taskListComponent", { static: false }) taskListComponent!: TaskListComponent;
+
     @ViewChild(MatPaginator) tasksPaginator: MatPaginator;
 
     protected user: User | null;

matsen-tool/src/app/_views/tasks/task-list/task-list.component.html

@@ -17,7 +17,7 @@
                         <div class="pt-3 pe-5 position-relative">
                             <p class="m-0" [innerHTML]="appHelperService.getSafeLongtext(task.description)"></p>
                             <p>Zugewiesen an: {{ task.assignedToName }}</p>
-                            <span *ngIf="task.createdBy === user?.id" class="position-absolute bi bi-pencil p-2"
+                            <span *ngIf="task.createdBy === currentUser?.id" class="position-absolute bi bi-pencil p-2"
                                   data-type="user-tool" data-action="edit" (click)="openModalEditTask(task)"></span>
                         </div>
                     </div>
@@ -32,7 +32,7 @@
                             <div>
                                 <p>{{ taskNote.message }}</p>
                             </div>
-                            <span *ngIf="taskNote.owner === user?.id" class="position-absolute bi bi-pencil p-2"
+                            <span *ngIf="taskNote.owner === currentUser?.id" class="position-absolute bi bi-pencil p-2"
                                   data-type="user-tool" data-action="edit" (click)="openModalEditTaskNote(taskNote)"></span>
                         </div>
                     </div>

matsen-tool/src/app/_views/tasks/task-list/task-list.component.ts

@@ -1,7 +1,7 @@
 import {AfterViewInit, Component, Input, OnInit, ViewChild} from '@angular/core';
 import {PagingComponent} from "@app/_components/paging/paging.component";
 import {Subscription} from "rxjs";
-import {PartnerJsonld, TaskJsonld, TaskNoteJsonld, TaskService} from "@app/core/api/v1";
+import {PartnerJsonld, TaskJsonld, TaskNoteJsonld, TaskService, UserJsonld} from "@app/core/api/v1";
 import {MatTableDataSource} from "@angular/material/table";
 import {NewTaskComponent} from "@app/_views/tasks/new-task/new-task.component";
 import {NewTaskNoteComponent} from "@app/_views/tasks/new-task-note/new-task-note.component";
@@ -17,9 +17,10 @@ import {User} from "@app/_models";
 export class TaskListComponent implements OnInit, AfterViewInit {
 
     @Input() public partner!: PartnerJsonld;
+    @Input() public user!: UserJsonld | undefined;
     @ViewChild("pagingComponent", { static: false }) pagingComponent!: PagingComponent;
 
-    protected user: User | null;
+    protected currentUser: User | null;
     protected tasksSub: Subscription;
     protected tasks: Array<TaskJsonld>;
     protected dataSource;
@@ -35,7 +36,7 @@ export class TaskListComponent implements OnInit, AfterViewInit {
         this.tasks = [];
         this.dataSource = new MatTableDataSource<TaskJsonld>(this.tasks);
         this.taskNotesVisibility = new Map<string, boolean>();
-        this.user = this.accountService.userValue;
+        this.currentUser = this.accountService.userValue;
     }
 
     ngOnInit(): void {
@@ -49,7 +50,7 @@ export class TaskListComponent implements OnInit, AfterViewInit {
         this.tasksSub = this.taskService.tasksGetCollection(
             this.pagingComponent.getPageIndex(),
             this.pagingComponent.getPageSize(),
-            undefined,
+            this.user?.id,
             undefined,
             this.partner ? this.partner.id : undefined
         ).subscribe(

matsen-tool/src/app/core/api/v1/model/user.ts

@@ -19,6 +19,7 @@ export interface User {
     firstName: string | null;
     lastName: string | null;
     image?: string | null;
+    readonly imageUrl?: string | null;
     /**
      * The plaintext password when being set or changed.
      */

matsen-tool/src/app/core/api/v1/model/userJsonhal.ts

@@ -21,6 +21,7 @@ export interface UserJsonhal {
     firstName: string | null;
     lastName: string | null;
     image?: string | null;
+    readonly imageUrl?: string | null;
     /**
      * The plaintext password when being set or changed.
      */

matsen-tool/src/app/core/api/v1/model/userJsonld.ts

@@ -23,6 +23,7 @@ export interface UserJsonld {
     firstName: string | null;
     lastName: string | null;
     image?: string | null;
+    readonly imageUrl?: string | null;
     /**
      * The plaintext password when being set or changed.
      */