|
|
@@ -46,170 +46,174 @@ |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="contacts"> |
|
|
|
|
|
<div class="d-flex justify-content-between align-items-start"> |
|
|
|
|
|
<h2>{{ 'basic.contacts' | translate }}</h2> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewContact()">{{ 'basic.new-contact' | translate }} |
|
|
|
|
|
</button> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
|
|
|
<div class="col-4" *ngFor="let contact of contacts"> |
|
|
|
|
|
<div class="card"> |
|
|
|
|
|
<div class="card-body row"> |
|
|
|
|
|
<div class="col-8"> |
|
|
|
|
|
<h2>{{ contact.firstName }} {{ contact.lastName }}</h2> |
|
|
|
|
|
<p><a href="mailto:{{contact.email}}">{{ contact.email }}</a><br/> |
|
|
|
|
|
{{ contact.phone }}<br/> |
|
|
|
|
|
{{ contact.position }}</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="col-4"> |
|
|
|
|
|
<img *ngIf="contact.imageUrl !== null && contact.imageUrl !== undefined" |
|
|
|
|
|
ngSrc="{{contact.imageUrl}}" width="247" height="94" |
|
|
|
|
|
alt="{{contact.firstName}} {{contact.lastName}}" |
|
|
|
|
|
title="{{contact.firstName}} {{contact.lastName}}"/> |
|
|
|
|
|
|
|
|
<app-toggle #toggleContacts [headline]="'basic.contacts' | translate"> |
|
|
|
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="contacts"> |
|
|
|
|
|
<div class="d-flex justify-content-end align-items-start mb-3 toggle-btn"> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewContact()">{{ 'basic.new-contact' | translate }} |
|
|
|
|
|
</button> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
|
|
|
<div class="col-4" *ngFor="let contact of contacts"> |
|
|
|
|
|
<div class="card"> |
|
|
|
|
|
<div class="card-body row"> |
|
|
|
|
|
<div class="col-8"> |
|
|
|
|
|
<h2>{{ contact.firstName }} {{ contact.lastName }}</h2> |
|
|
|
|
|
<p><a href="mailto:{{contact.email}}">{{ contact.email }}</a><br/> |
|
|
|
|
|
{{ contact.phone }}<br/> |
|
|
|
|
|
{{ contact.position }}</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="col-4"> |
|
|
|
|
|
<img *ngIf="contact.imageUrl !== null && contact.imageUrl !== undefined" |
|
|
|
|
|
ngSrc="{{contact.imageUrl}}" width="247" height="94" |
|
|
|
|
|
alt="{{contact.firstName}} {{contact.lastName}}" |
|
|
|
|
|
title="{{contact.firstName}} {{contact.lastName}}"/> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="d-flex justify-content-end mt-1 mb-4"> |
|
|
|
|
|
<span role="button" (click)="navigateToContactDetails(contact)" |
|
|
|
|
|
class="badge bg-secondary p-2">{{ 'basic.details' | translate }}</span> |
|
|
|
|
|
|
|
|
<div class="d-flex justify-content-end mt-1 mb-4"> |
|
|
|
|
|
<span role="button" (click)="navigateToContactDetails(contact)" |
|
|
|
|
|
class="badge bg-secondary p-2">{{ 'basic.details' | translate }}</span> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<mat-paginator *ngIf="contacts.length > 0" class="rounded-1" |
|
|
|
|
|
[pageSizeOptions]="[6,12,18]" |
|
|
|
|
|
[length]="contactsLength" |
|
|
|
|
|
(page)="contactsHandlePageEvent($event)" |
|
|
|
|
|
[pageSize]="contactsPageSize" |
|
|
|
|
|
[pageIndex]="contactsPageIndex" |
|
|
|
|
|
showFirstLastButtons> |
|
|
|
|
|
</mat-paginator> |
|
|
</div> |
|
|
</div> |
|
|
<mat-paginator *ngIf="contacts.length > 0" class="rounded-1" |
|
|
|
|
|
[pageSizeOptions]="[6,12,18]" |
|
|
|
|
|
[length]="contactsLength" |
|
|
|
|
|
(page)="contactsHandlePageEvent($event)" |
|
|
|
|
|
[pageSize]="contactsPageSize" |
|
|
|
|
|
[pageIndex]="contactsPageIndex" |
|
|
|
|
|
showFirstLastButtons> |
|
|
|
|
|
</mat-paginator> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="spt-accordion"> |
|
|
|
|
|
<div class="d-flex justify-content-between align-items-start"> |
|
|
|
|
|
<h2>{{ 'basic.tasks' | translate }}</h2> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewTask()">{{ 'basic.new-task' | translate }}</button> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="tasks mb-3" *ngFor="let task of tasks"> |
|
|
|
|
|
<div class="card p-3"> |
|
|
|
|
|
<div class="position-relative" data-bs-toggle="collapse" |
|
|
|
|
|
[attr.data-bs-target]="'#collapse-' + ApiConverter.extractId(task.id)" |
|
|
|
|
|
aria-expanded="false" |
|
|
|
|
|
aria-controls="collapseExample"> |
|
|
|
|
|
<h3 class="m-0">{{ task.partnerName }}</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> |
|
|
|
|
|
<div class="collapse" id="collapse-{{ApiConverter.extractId(task.id)}}"> |
|
|
|
|
|
<div class="pt-3 pe-5 position-relative"> |
|
|
|
|
|
<p class="m-0" [innerHTML]="apiConverter.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> |
|
|
|
|
|
|
|
|
</app-toggle> |
|
|
|
|
|
|
|
|
|
|
|
<app-toggle #toggleTasks [headline]="'basic.tasks' | translate"> |
|
|
|
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="spt-accordion"> |
|
|
|
|
|
<div class="d-flex justify-content-end align-items-start mb-3 toggle-btn"> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewTask()">{{ 'basic.new-task' | translate }}</button> |
|
|
</div> |
|
|
</div> |
|
|
<div *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 class="tasks mb-3" *ngFor="let task of tasks"> |
|
|
|
|
|
<div class="card p-3"> |
|
|
|
|
|
<div class="position-relative" data-bs-toggle="collapse" |
|
|
|
|
|
[attr.data-bs-target]="'#collapse-' + ApiConverter.extractId(task.id)" |
|
|
|
|
|
aria-expanded="false" |
|
|
|
|
|
aria-controls="collapseExample"> |
|
|
|
|
|
<h3 class="m-0">{{ task.partnerName }}</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> |
|
|
|
|
|
<div class="collapse" id="collapse-{{ApiConverter.extractId(task.id)}}"> |
|
|
|
|
|
<div class="pt-3 pe-5 position-relative"> |
|
|
|
|
|
<p class="m-0" [innerHTML]="apiConverter.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> |
|
|
|
|
|
<p>{{ taskNote.message }}</p> |
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div *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> |
|
|
<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> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<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 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> |
|
|
</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> |
|
|
</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> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="posts"> |
|
|
|
|
|
<div class="d-flex justify-content-between align-items-start"> |
|
|
|
|
|
<h2>{{ 'basic.posts' | translate }}</h2> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewPosting()">{{ 'basic.new-post' | translate }}</button> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="post mb-3" *ngFor="let post of posts"> |
|
|
|
|
|
<div class="card"> |
|
|
|
|
|
<div class="card-body"> |
|
|
|
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
|
|
|
<p>{{ post.createdAt | date:'dd.MM.YYYY' }}</p> |
|
|
|
|
|
<p>{{ post.ownerName }}</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div> |
|
|
|
|
|
<h3>{{ post.headline }}</h3> |
|
|
|
|
|
<p class="m-0" [innerHTML]="apiConverter.getSafeLongtext(post.message)"></p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<span *ngIf="post.owner === user?.id" class="position-absolute bi bi-pencil p-2" |
|
|
|
|
|
data-type="user-tool" |
|
|
|
|
|
data-action="edit" (click)="openModalEditPosting(post)"></span> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
</app-toggle> |
|
|
|
|
|
<app-toggle #togglePosts [headline]="'basic.posts' | translate"> |
|
|
|
|
|
<div class="spt-container"> |
|
|
|
|
|
<div class="posts"> |
|
|
|
|
|
<div class="d-flex justify-content-end align-items-start mb-3 toggle-btn"> |
|
|
|
|
|
<button class="btn btn-primary" (click)="openModalNewPosting()">{{ 'basic.new-post' | translate }}</button> |
|
|
</div> |
|
|
</div> |
|
|
<div *ngIf="post.id && commentsVisibility.get(post.id)"> |
|
|
|
|
|
<div class="card ms-5" *ngFor="let comment of post.comments"> |
|
|
|
|
|
|
|
|
<div class="post mb-3" *ngFor="let post of posts"> |
|
|
|
|
|
<div class="card"> |
|
|
<div class="card-body"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
<p>{{ comment.createdAt | date:'dd.MM.YYYY' }}</p> |
|
|
|
|
|
<p>{{ comment.ownerName }}</p> |
|
|
|
|
|
|
|
|
<p>{{ post.createdAt | date:'dd.MM.YYYY' }}</p> |
|
|
|
|
|
<p>{{ post.ownerName }}</p> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div> |
|
|
<p class="m-0" [innerHTML]="apiConverter.getSafeLongtext(comment.message)"></p> |
|
|
|
|
|
|
|
|
<h3>{{ post.headline }}</h3> |
|
|
|
|
|
<p class="m-0" [innerHTML]="apiConverter.getSafeLongtext(post.message)"></p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<span *ngIf="post.owner === user?.id" class="position-absolute bi bi-pencil p-2" |
|
|
|
|
|
data-type="user-tool" |
|
|
|
|
|
data-action="edit" (click)="openModalEditPosting(post)"></span> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div *ngIf="post.id && commentsVisibility.get(post.id)"> |
|
|
|
|
|
<div class="card ms-5" *ngFor="let comment of post.comments"> |
|
|
|
|
|
<div class="card-body"> |
|
|
|
|
|
<div class="d-flex justify-content-between align-items-center"> |
|
|
|
|
|
<p>{{ comment.createdAt | date:'dd.MM.YYYY' }}</p> |
|
|
|
|
|
<p>{{ comment.ownerName }}</p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div> |
|
|
|
|
|
<p class="m-0" [innerHTML]="apiConverter.getSafeLongtext(comment.message)"></p> |
|
|
|
|
|
</div> |
|
|
|
|
|
<span *ngIf="comment.owner === user?.id" class="position-absolute bi bi-pencil p-2" |
|
|
|
|
|
data-type="user-tool" data-action="edit" (click)="openModalEditComment(comment)"></span> |
|
|
</div> |
|
|
</div> |
|
|
<span *ngIf="comment.owner === user?.id" class="position-absolute bi bi-pencil p-2" |
|
|
|
|
|
data-type="user-tool" data-action="edit" (click)="openModalEditComment(comment)"></span> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="d-flex justify-content-end mt-1"> |
|
|
|
|
|
<span *ngIf="post.comments?.length !== 0" role="button" class="badge bg-secondary p-2 me-2" |
|
|
|
|
|
(click)="showComments(post)"> |
|
|
|
|
|
<ng-container |
|
|
|
|
|
*ngIf="post.id && commentsVisibility.get(post.id)">{{ 'basic.hide-comments' | translate }}</ng-container> |
|
|
|
|
|
<ng-container |
|
|
|
|
|
*ngIf="post.id && !commentsVisibility.get(post.id)">{{ 'basic.show-comments' | translate }}</ng-container> |
|
|
|
|
|
</span> |
|
|
|
|
|
<span role="button" class="badge bg-secondary p-2" |
|
|
|
|
|
(click)="openModalNewComment(post)">{{ 'basic.comment-it' | translate }}</span> |
|
|
|
|
|
|
|
|
<div class="d-flex justify-content-end mt-1"> |
|
|
|
|
|
<span *ngIf="post.comments?.length !== 0" role="button" class="badge bg-secondary p-2 me-2" |
|
|
|
|
|
(click)="showComments(post)"> |
|
|
|
|
|
<ng-container |
|
|
|
|
|
*ngIf="post.id && commentsVisibility.get(post.id)">{{ 'basic.hide-comments' | translate }}</ng-container> |
|
|
|
|
|
<ng-container |
|
|
|
|
|
*ngIf="post.id && !commentsVisibility.get(post.id)">{{ 'basic.show-comments' | translate }}</ng-container> |
|
|
|
|
|
</span> |
|
|
|
|
|
<span role="button" class="badge bg-secondary p-2" |
|
|
|
|
|
(click)="openModalNewComment(post)">{{ 'basic.comment-it' | translate }}</span> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<mat-paginator *ngIf="posts.length > 0" class="rounded-1" |
|
|
|
|
|
[pageSizeOptions]="[10,20,30]" |
|
|
|
|
|
[length]="postsLength" |
|
|
|
|
|
(page)="postsHandlePageEvent($event)" |
|
|
|
|
|
[pageSize]="postsPageSize" |
|
|
|
|
|
[pageIndex]="postsPageIndex" |
|
|
|
|
|
showFirstLastButtons> |
|
|
|
|
|
</mat-paginator> |
|
|
</div> |
|
|
</div> |
|
|
<mat-paginator *ngIf="posts.length > 0" class="rounded-1" |
|
|
|
|
|
[pageSizeOptions]="[10,20,30]" |
|
|
|
|
|
[length]="postsLength" |
|
|
|
|
|
(page)="postsHandlePageEvent($event)" |
|
|
|
|
|
[pageSize]="postsPageSize" |
|
|
|
|
|
[pageIndex]="postsPageIndex" |
|
|
|
|
|
showFirstLastButtons> |
|
|
|
|
|
</mat-paginator> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</app-toggle> |
Florian Eisenmenger
1 年之前