Chneemann/join
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

bugfixes

Browse source
This commit is contained in:
Chneemann 2024-04-27 19:46:02 +02:00
parent 116fbe48d2
commit f6d4983785
3 changed files with 57 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/app/components/board/task/task-menu/task-menu.component.scss
View file

@ -1,7 +1,7 @@
section {
position: absolute;
top: 30px;
left: 40px;
right: 45px;
text-align: center;
width: fit-content;
height: fit-content;

99
src/app/components/board/task/task.component.html
View file

@ -1,55 +1,54 @@
<section (click)="handleMenuButtonClick($event, task.id)">
<div
class="content"
draggable="true"
(dragstart)="dragDropService.startDragging($event, task.id)"
>
<div class="header">
<div
class="category"
[style.background-color]="categoryColors.get(task.category)"
>
{{ task.category }}
</div>
<div
class="menu-btn"
(click)="handleMenuButtonClick($event, task.status)"
>
<img
class="menu-img"
src="./../../../../assets/img/board/menu.svg"
alt="menu"
/>
</div>
</div>
<div class="headline">{{ task.title }}</div>
<div class="description">
{{ task.description }}
</div>
@if(task.subtasksTitle.length > 0) {
<div class="subtask">
<div class="subtask-line">
<span
class="filler-full"
[style.width.%]="completedSubtasksPercent()"
></span>
</div>
<div class="subtask-text">
{{ completedSubtasks() }} / {{ task.subtasksTitle.length }} Subtasks
</div>
</div>
}
<div class="footer">
<div class="footer-badge">
@for (assigned of task.assigned; track assigned) {
<span
class="footer-badged"
[style.background-color]="userBadgedColor(assigned)"
>{{ userBadged(assigned) }}</span
<section>
<div (click)="handleMenuButtonClick($event, task.id)">
<div
class="content"
draggable="true"
(dragstart)="dragDropService.startDragging($event, task.id)"
>
<div class="header">
<div
class="category"
[style.background-color]="categoryColors.get(task.category)"
>
}
{{ task.category }}
</div>
<div class="menu-btn" (click)="handleMenuButtonClick($event, task.id)">
<img
class="menu-img"
src="./../../../../assets/img/board/menu.svg"
alt="menu"
/>
</div>
</div>
<div class="headline">{{ task.title }}</div>
<div class="description">
{{ task.description }}
</div>
@if(task.subtasksTitle.length > 0) {
<div class="subtask">
<div class="subtask-line">
<span
class="filler-full"
[style.width.%]="completedSubtasksPercent()"
></span>
</div>
<div class="subtask-text">
{{ completedSubtasks() }} / {{ task.subtasksTitle.length }} Subtasks
</div>
</div>
}
<div class="footer">
<div class="footer-badge">
@for (assigned of task.assigned; track assigned) {
<span
class="footer-badged"
[style.background-color]="userBadgedColor(assigned)"
>{{ userBadged(assigned) }}</span
>
}
</div>
<div class="footer-priority prio-{{ task.priority }}"></div>
</div>
<div class="footer-priority prio-{{ task.priority }}"></div>
</div>
</div>
@if (isMenuOpen){

11
src/app/components/board/task/task.component.ts
View file

@ -46,20 +46,23 @@ export class TaskComponent implements OnInit, OnDestroy {
this.isPageViewMedia = window.innerWidth <= 650;
}
handleMenuButtonClick(event: MouseEvent, taskIdOrStatus: string | undefined) {
handleMenuButtonClick(event: MouseEvent, taskId: string | undefined) {
event.stopPropagation();
const targetElement = event.target as HTMLElement;
targetElement.classList.contains('menu-btn') ||
targetElement.classList.contains('menu-img')
? this.openTaskMenu(taskIdOrStatus)
: this.openTaskDetailsOverlay(taskIdOrStatus);
? this.toggleTaskMenu()
: this.openTaskDetailsOverlay(taskId);
}
openTaskMenu(taskStatus: string | undefined) {
toggleTaskMenu() {
this.isMenuOpen = !this.isMenuOpen;
}
openTaskDetailsOverlay(taskId: string | undefined) {
if (this.isMenuOpen) {
this.toggleTaskMenu();
}
this.isPageViewMedia
? this.router.navigate(['/task', taskId])
: this.overlayService.setOverlayData('taskOverlay', taskId);