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

View file

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

View file

@ -1,4 +1,5 @@
<section (click)="handleMenuButtonClick($event, task.id)"> <section>
<div (click)="handleMenuButtonClick($event, task.id)">
<div <div
class="content" class="content"
draggable="true" draggable="true"
@ -11,10 +12,7 @@
> >
{{ task.category }} {{ task.category }}
</div> </div>
<div <div class="menu-btn" (click)="handleMenuButtonClick($event, task.id)">
class="menu-btn"
(click)="handleMenuButtonClick($event, task.status)"
>
<img <img
class="menu-img" class="menu-img"
src="./../../../../assets/img/board/menu.svg" src="./../../../../assets/img/board/menu.svg"
@ -52,6 +50,7 @@
<div class="footer-priority prio-{{ task.priority }}"></div> <div class="footer-priority prio-{{ task.priority }}"></div>
</div> </div>
</div> </div>
</div>
@if (isMenuOpen){ @if (isMenuOpen){
<app-task-menu [boardTaskStatus]="task.status"></app-task-menu> <app-task-menu [boardTaskStatus]="task.status"></app-task-menu>
} }

View file

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