118 lines
3.4 KiB
HTML
118 lines
3.4 KiB
HTML
<section>
|
|
<div class="header">
|
|
<div class="title">Board</div>
|
|
<div class="search">
|
|
<div>
|
|
<input
|
|
#searchField
|
|
id="search-task"
|
|
type="text"
|
|
placeholder="Find Task"
|
|
(input)="searchTask()"
|
|
/>
|
|
<span class="line"></span>
|
|
</div>
|
|
<button class="btn" type="submit">
|
|
<div class="btn-inside">
|
|
<span>Add Task</span>
|
|
<img src="./../../../assets/img/board/add_white.svg" alt="check" />
|
|
</div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="content">
|
|
<div class="status">
|
|
<div
|
|
class="column"
|
|
(dragover)="dragDropService.allowDrop($event)"
|
|
(drop)="dragDropService.drop($event, 'todo')"
|
|
>
|
|
<div class="headline">
|
|
<span>To do</span
|
|
><img src="./../../../assets/img/board/add.svg" alt="add" />
|
|
</div>
|
|
<div id="todo">
|
|
<ng-container *ngIf="getTask('todo').length > 0; else noTask">
|
|
<app-task
|
|
*ngFor="let task of getTask('todo')"
|
|
[task]="task"
|
|
></app-task>
|
|
</ng-container>
|
|
|
|
<ng-template #noTask>
|
|
<div class="empty-task">No tasks</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="column"
|
|
(dragover)="dragDropService.allowDrop($event)"
|
|
(drop)="dragDropService.drop($event, 'inprogress')"
|
|
>
|
|
<div class="headline">
|
|
<span>In progress</span
|
|
><img src="./../../../assets/img/board/add.svg" alt="add" />
|
|
</div>
|
|
<div id="inprogress">
|
|
<ng-container *ngIf="getTask('inprogress').length > 0; else noTask">
|
|
<app-task
|
|
*ngFor="let task of getTask('inprogress')"
|
|
[task]="task"
|
|
></app-task>
|
|
</ng-container>
|
|
|
|
<ng-template #noTask>
|
|
<div class="empty-task">No tasks</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="column"
|
|
(dragover)="dragDropService.allowDrop($event)"
|
|
(drop)="dragDropService.drop($event, 'awaitfeedback')"
|
|
>
|
|
<div class="headline">
|
|
<span>Await feedback</span
|
|
><img src="./../../../assets/img/board/add.svg" alt="add" />
|
|
</div>
|
|
<div id="awaitfeedback">
|
|
<ng-container
|
|
*ngIf="getTask('awaitfeedback').length > 0; else noTask"
|
|
>
|
|
<app-task
|
|
*ngFor="let task of getTask('awaitfeedback')"
|
|
[task]="task"
|
|
></app-task>
|
|
</ng-container>
|
|
|
|
<ng-template #noTask>
|
|
<div class="empty-task">No tasks</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="column"
|
|
(dragover)="dragDropService.allowDrop($event)"
|
|
(drop)="dragDropService.drop($event, 'done')"
|
|
>
|
|
<div class="headline">
|
|
<span>Done</span
|
|
><img src="./../../../assets/img/board/add.svg" alt="add" />
|
|
</div>
|
|
<div id="todo">
|
|
<ng-container *ngIf="getTask('done').length > 0; else noTask">
|
|
<app-task
|
|
*ngFor="let task of getTask('done')"
|
|
[task]="task"
|
|
></app-task>
|
|
</ng-container>
|
|
|
|
<ng-template #noTask>
|
|
<div class="empty-task">No tasks</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="content-tasks"></div>
|
|
</div>
|
|
</section>
|