From 6d55f599dc61c43dbfcbf4a04ee6d035bb687d4e Mon Sep 17 00:00:00 2001 From: owens-hub-git Date: Mon, 18 May 2026 15:58:12 +1000 Subject: [PATCH 1/2] feat: added the expanded part for the dashboard list items --- .../dashboard-list-item.component.html | 13 -------- .../f-cross-dashboard.component.html | 6 +--- .../dashboard/f-cross-dashboard.component.ts | 14 ++++++--- .../dashboard-list-item.component.html | 26 ++++++++++++++++ .../dashboard-list-item.component.ts | 9 ++++++ .../expanded-list-item.component.html | 31 +++++++++++++++++++ .../expanded-list-item.component.scss | 0 .../expanded-list-item.component.ts | 28 +++++++++++++++++ src/app/doubtfire-angular.module.ts | 4 ++- 9 files changed, 108 insertions(+), 23 deletions(-) delete mode 100644 src/app/dashboard/dashboard-list-item.component.html create mode 100644 src/app/dashboard/list-item/dashboard-list-item.component.html rename src/app/dashboard/{ => list-item}/dashboard-list-item.component.ts (62%) create mode 100644 src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html create mode 100644 src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss create mode 100644 src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.ts diff --git a/src/app/dashboard/dashboard-list-item.component.html b/src/app/dashboard/dashboard-list-item.component.html deleted file mode 100644 index f4d34fdccb..0000000000 --- a/src/app/dashboard/dashboard-list-item.component.html +++ /dev/null @@ -1,13 +0,0 @@ -
-
-
-

{{ task.title }}

-

{{ task.subtitle }}

-
-
-
- {{ task.comments }} -
- keyboard_arrow_down -
-
diff --git a/src/app/dashboard/f-cross-dashboard.component.html b/src/app/dashboard/f-cross-dashboard.component.html index 978148aa11..3ea01a6f18 100644 --- a/src/app/dashboard/f-cross-dashboard.component.html +++ b/src/app/dashboard/f-cross-dashboard.component.html @@ -14,11 +14,7 @@

{{ unit.code }}

-
+
diff --git a/src/app/dashboard/f-cross-dashboard.component.ts b/src/app/dashboard/f-cross-dashboard.component.ts index bd4bbc0721..6c2107b1af 100644 --- a/src/app/dashboard/f-cross-dashboard.component.ts +++ b/src/app/dashboard/f-cross-dashboard.component.ts @@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core'; import {GlobalStateService} from 'src/app/projects/states/index/global-state.service'; import {Project} from '../api/models/project'; import {TaskStatus} from '../api/models/task-status'; -import {DashboardTask} from './dashboard-list-item.component'; +import {DashboardTask} from './list-item/dashboard-list-item.component'; import {Task} from '../api/models/task'; import {TaskDefinition} from '../api/models/task-definition'; @@ -18,7 +18,7 @@ type DashboardUnit = { templateUrl: './f-cross-dashboard.component.html', }) export class CrossDashboardComponent implements OnInit { - constructor(private globalStateService: GlobalStateService) {} + constructor(private globalStateService: GlobalStateService,) {} units: DashboardUnit[] = []; @@ -37,12 +37,12 @@ export class CrossDashboardComponent implements OnInit { projectId: project.id, code: unit.code, name: unit.name, - tasks: this.mapTasks(project.tasks, unit.taskDefinitions), + tasks: this.mapTasks(project.tasks, unit.taskDefinitions, project.id, unit.code), }; }); } - mapTasks(tasks: readonly Task[], taskDefs: readonly TaskDefinition[]): DashboardTask[] { + mapTasks(tasks: readonly Task[], taskDefs: readonly TaskDefinition[], projectId: number, unitCode: string): DashboardTask[] { return taskDefs.map((def) => { const task = tasks.find((t) => t.taskDefId == def.id); return { @@ -51,6 +51,12 @@ export class CrossDashboardComponent implements OnInit { abbreviation: def.abbreviation, color: TaskStatus.STATUS_COLORS.get(task?.status ?? 'not_started'), comments: task?.numNewComments ?? 0, + projectId: projectId, + statusLabel: TaskStatus.STATUS_LABELS.get(task?.status ?? 'not_started'), + description: def.description, + unitCode: unitCode, + dueDate: def.targetDate, + taskDef: def, }; }); } diff --git a/src/app/dashboard/list-item/dashboard-list-item.component.html b/src/app/dashboard/list-item/dashboard-list-item.component.html new file mode 100644 index 0000000000..257fbafb4c --- /dev/null +++ b/src/app/dashboard/list-item/dashboard-list-item.component.html @@ -0,0 +1,26 @@ +
+
+
+

+ {{ task.title }} +

+

{{ task.subtitle }}

+
+
+
+
+ {{ task.comments }} +
+
+ + {{ isExpanded ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }} + +
+
+
+
+ +
+
diff --git a/src/app/dashboard/dashboard-list-item.component.ts b/src/app/dashboard/list-item/dashboard-list-item.component.ts similarity index 62% rename from src/app/dashboard/dashboard-list-item.component.ts rename to src/app/dashboard/list-item/dashboard-list-item.component.ts index b201cfcad0..32800afac2 100644 --- a/src/app/dashboard/dashboard-list-item.component.ts +++ b/src/app/dashboard/list-item/dashboard-list-item.component.ts @@ -1,11 +1,18 @@ import {Component, Input} from '@angular/core'; +import {TaskDefinition} from '../../api/models/task-definition'; export type DashboardTask = { title: string; subtitle: string; + statusLabel: string; abbreviation: string; color: string; comments: number; + projectId: number; + description: string; + taskDef: TaskDefinition; + unitCode: string; + dueDate: Date; }; @Component({ @@ -14,4 +21,6 @@ export type DashboardTask = { }) export class DashboardListItemComponent { @Input() task: DashboardTask; + + isExpanded = false; } diff --git a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html new file mode 100644 index 0000000000..6454e0939b --- /dev/null +++ b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html @@ -0,0 +1,31 @@ +
+
+
+

{{ task.statusLabel }}

+

{{ task.description }}

+

Complete by + {{ task.dueDate | date: 'EEEE d MMMM' }} +

+
+ + + +
+
+
diff --git a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.ts b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.ts new file mode 100644 index 0000000000..ae1247d954 --- /dev/null +++ b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.ts @@ -0,0 +1,28 @@ +import {Component, Input} from '@angular/core'; +import {DashboardTask} from '../dashboard-list-item.component'; +import {FileDownloaderService} from 'src/app/common/file-downloader/file-downloader.service'; + +@Component({ + selector: 'f-expanded-list-item', + templateUrl: './expanded-list-item.component.html', + styleUrls: ['./expanded-list-item.component.scss'], +}) +export class DashboardExpandedListItemComponent { + @Input() task: DashboardTask; + + constructor(private fileDownloader: FileDownloaderService) {} + + downloadTaskSheet() { + this.fileDownloader.downloadFile( + this.task.taskDef.getTaskPDFUrl(true), + `${this.task.unitCode}-${this.task.abbreviation}-TaskSheet.pdf` + ); + } + + downloadResources() { + this.fileDownloader.downloadFile( + this.task.taskDef.getTaskResourcesUrl(true), + `${this.task.unitCode}-${this.task.abbreviation}-TaskResources.zip` + ); + } +} diff --git a/src/app/doubtfire-angular.module.ts b/src/app/doubtfire-angular.module.ts index df568bdbe8..d6016da9b3 100644 --- a/src/app/doubtfire-angular.module.ts +++ b/src/app/doubtfire-angular.module.ts @@ -44,7 +44,8 @@ import {MatDialogModule as MatDialogModuleNew} from '@angular/material/dialog'; import {AlertService} from 'src/app/common/services/alert.service'; import {AlertComponent} from 'src/app/common/services/alert.service'; import {MatSidenavModule} from '@angular/material/sidenav'; -import { DashboardListItemComponent } from './dashboard/dashboard-list-item.component'; +import {DashboardListItemComponent} from './dashboard/list-item/dashboard-list-item.component'; +import {DashboardExpandedListItemComponent} from './dashboard/list-item/expanded-list-item/expanded-list-item.component'; import {setTheme} from 'ngx-bootstrap/utils'; import {CodeEditorModule} from '@ngstack/code-editor'; @@ -368,6 +369,7 @@ const GANTT_CHART_CONFIG = { // Components we declare declarations: [ DashboardListItemComponent, + DashboardExpandedListItemComponent, AlertComponent, AboutDoubtfireModalContent, D2lUnitDetailsFormComponent, From 3e40777c07903bbfdb5c7bfedbe40a883eabf347 Mon Sep 17 00:00:00 2001 From: owens-hub-git Date: Mon, 18 May 2026 21:17:45 +1000 Subject: [PATCH 2/2] fix: linting and colour changes --- .../dashboard-list-item.component.html | 10 ++++--- .../expanded-list-item.component.html | 29 ++++++++++++++----- .../expanded-list-item.component.scss | 3 ++ 3 files changed, 30 insertions(+), 12 deletions(-) diff --git a/src/app/dashboard/list-item/dashboard-list-item.component.html b/src/app/dashboard/list-item/dashboard-list-item.component.html index 257fbafb4c..2bbc5cb854 100644 --- a/src/app/dashboard/list-item/dashboard-list-item.component.html +++ b/src/app/dashboard/list-item/dashboard-list-item.component.html @@ -1,17 +1,19 @@
-

- {{ task.title }} + [uiParams]="{projectId: task.projectId, taskAbbr: task.abbreviation}" + > + {{ task.title }}

{{ task.subtitle }}

- {{ task.comments }} + {{ task.comments }}
diff --git a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html index 6454e0939b..21ed3d2345 100644 --- a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html +++ b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.html @@ -3,26 +3,39 @@

{{ task.statusLabel }}

{{ task.description }}

-

Complete by +

+ Complete by {{ task.dueDate | date: 'EEEE d MMMM' }}

- - - diff --git a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss index e69de29bb2..a3b7bc573e 100644 --- a/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss +++ b/src/app/dashboard/list-item/expanded-list-item/expanded-list-item.component.scss @@ -0,0 +1,3 @@ +.mat-badge-warn { + --mat-badge-text-color: white; +}