116 lines
3.5 KiB
HTML
116 lines
3.5 KiB
HTML
<section>
|
|
<div class="header">
|
|
<div class="title">Join 360</div>
|
|
<div class="blue-bar"></div>
|
|
<div class="metrics-txt">
|
|
{{ "summary.headlineDescription" | translate }}
|
|
</div>
|
|
</div>
|
|
@if (!isLoading) {
|
|
<div class="content">
|
|
<div class="left-container">
|
|
<!-- Top Frame -->
|
|
<div class="top-frame">
|
|
<div class="todo-done" routerLink="/board">
|
|
<div class="circle">
|
|
<div class="inline">
|
|
<img src="./../../../assets/img/summary/pencil.svg" alt="" />
|
|
</div>
|
|
</div>
|
|
<div class="details">
|
|
<span>{{ taskStatusCounts.get("todo") || 0 }}</span>
|
|
<p>{{ "summary.todo" | translate }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="todo-done" routerLink="/board">
|
|
<div class="circle">
|
|
<img src="./../../../assets/img/summary/rake.svg" alt="" />
|
|
</div>
|
|
<div class="details">
|
|
<span>{{ taskStatusCounts.get("done") || 0 }}</span>
|
|
<p>{{ "summary.done" | translate }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Middle Frame -->
|
|
<div class="middle-frame">
|
|
<div class="urgent" routerLink="/board">
|
|
<div class="left">
|
|
<img src="./../../../assets/img/summary/urgent.svg" alt="" />
|
|
<div class="details">
|
|
<span>{{ urgentTasks.length || 0 }}</span>
|
|
<p>{{ "summary.urgent" | translate }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="line"></div>
|
|
<div class="right">
|
|
<div class="date">
|
|
<div>
|
|
@if (urgentTasks.length) {
|
|
<span>{{ nextUrgentTask }}</span>
|
|
<p class="spacer">
|
|
{{ "summary.upcomingDeadline" | translate }}
|
|
</p>
|
|
} @else {
|
|
<p>{{ "summary.noDeadline" | translate }}</p>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom Frame -->
|
|
<div class="bottom-frame">
|
|
<div class="tasks" routerLink="/board">
|
|
<div class="details">
|
|
<span>{{ totalTasks || 0 }}</span>
|
|
<p>
|
|
{{ "summary.taskBoard0" | translate }}<br />{{
|
|
"summary.taskBoard1" | translate
|
|
}}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="tasks" routerLink="/board">
|
|
<div class="details">
|
|
<span>{{ taskStatusCounts.get("inprogress") || 0 }}</span>
|
|
<p>
|
|
{{ "summary.taskProgress0" | translate }}<br />{{
|
|
"summary.taskProgress1" | translate
|
|
}}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="tasks" routerLink="/board">
|
|
<div class="details">
|
|
<span>{{ taskStatusCounts.get("awaitfeedback") || 0 }}</span>
|
|
<p>
|
|
{{ "summary.taskAwaitingFeedback0" | translate }}<br />{{
|
|
"summary.taskAwaitingFeedback1" | translate
|
|
}}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Greeting -->
|
|
<div class="right-container">
|
|
<p>{{ greeting }},</p>
|
|
<!-- TODO -->
|
|
<span id="welcome-user"
|
|
>{{ "firstName" }}<br />
|
|
{{ "lastName" }}</span
|
|
>
|
|
</div>
|
|
</div>
|
|
} @else {
|
|
<div class="content">
|
|
<div class="left-container">
|
|
<app-loading-spinner></app-loading-spinner>
|
|
</div>
|
|
</div>
|
|
}
|
|
</section>
|