Skip to content

Commit a86055d

Browse files
AbradatAbradat
authored
Merge pull request #2089 from bcgov/feature/ALCS-2406
Add Support to Move Application Conditions to Other Boards
2 parents 91b6153 + 78e1099 commit a86055d

File tree

12 files changed

+234
-77
lines changed

12 files changed

+234
-77
lines changed

‎alcs-frontend/src/app/features/board/board.component.ts

+5-8
Original file line numberDiff line numberDiff line change
@@ -314,14 +314,6 @@ export class BoardComponent implements OnInit, OnDestroy {
314314
...mappedPlanningReferrals,
315315
...mappedNotifications,
316316
].sort(noiSort);
317-
} else if (boardCode === BOARD_TYPE_CODES.APP_CON) {
318-
const appConSort = (a: CardData, b: CardData) => {
319-
if (a.highPriority !== b.highPriority) {
320-
return b.highPriority ? 1 : -1;
321-
}
322-
return 0;
323-
};
324-
this.cards = mappedAppDecisionConditions.sort(appConSort);
325317
} else {
326318
const sorted = [];
327319
sorted.push(
@@ -336,6 +328,7 @@ export class BoardComponent implements OnInit, OnDestroy {
336328
...mappedPlanningReferrals.filter((r) => r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
337329
...mappedInquiries.filter((r) => r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
338330
...mappedNotifications.filter((r) => r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
331+
...mappedAppDecisionConditions.filter((r) => r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
339332
// non-high priority
340333
...mappedNoticeOfIntents
341334
.filter((a) => !a.highPriority)
@@ -349,6 +342,7 @@ export class BoardComponent implements OnInit, OnDestroy {
349342
...mappedPlanningReferrals.filter((r) => !r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
350343
...mappedInquiries.filter((r) => !r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
351344
...mappedNotifications.filter((r) => !r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
345+
...mappedAppDecisionConditions.filter((r) => !r.highPriority).sort((a, b) => a.dateReceived - b.dateReceived),
352346
);
353347
this.cards = sorted;
354348
}
@@ -537,7 +531,10 @@ export class BoardComponent implements OnInit, OnDestroy {
537531
dateReceived: 0,
538532
isExpired,
539533
isPastDue,
534+
isInConditionBoard: this.currentBoardCode === BOARD_TYPE_CODES.APP_CON,
540535
decisionIsFlagged: applicationDecisionCondition.decisionIsFlagged,
536+
isModification: applicationDecisionCondition.isModification,
537+
isReconsideration: applicationDecisionCondition.isReconsideration,
541538
};
542539
}
543540

‎alcs-frontend/src/app/features/board/dialogs/application-decision-condition-dialog/application-decision-condition-dialog.component.html

+16
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,22 @@ <h3 class="card-title">
4444
</div>
4545
</div>
4646
<div class="right">
47+
<button matTooltip="Move Board" [matMenuTriggerFor]="moveMenu" mat-icon-button>
48+
<mat-icon>move_down</mat-icon>
49+
</button>
50+
<mat-menu class="move-board-menu" xPosition="before" #moveMenu="matMenu">
51+
<button (click)="onBoardSelected(board)" *ngFor="let board of allowedBoards" mat-menu-item>
52+
<div class="board-menu-item">
53+
<span class="favourite-board-icon-container"
54+
><mat-icon *ngIf="board.isFavourite" class="favourite-board-icon">star</mat-icon>
55+
</span>
56+
<span>{{ board.title }}</span>
57+
<span *ngIf="card && card!.boardCode === board.code"
58+
><mat-icon class="selected-board-icon">check</mat-icon></span
59+
>
60+
</div>
61+
</button>
62+
</mat-menu>
4763
<button
4864
*ngIf="canArchive"
4965
matTooltip="Archive Card"

‎alcs-frontend/src/app/features/board/dialogs/application-decision-condition-dialog/application-decision-condition-dialog.component.ts

+31-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
import { ApplicationDecisionV2Service } from '../../../../services/application/decision/application-decision-v2/application-decision-v2.service';
1212
import { UserService } from '../../../../services/user/user.service';
1313
import { ConfirmationDialogService } from '../../../../shared/confirmation-dialog/confirmation-dialog.service';
14-
import { BoardService } from '../../../../services/board/board.service';
14+
import { BoardService, BoardWithFavourite } from '../../../../services/board/board.service';
1515
import { ToastService } from '../../../../services/toast/toast.service';
1616
import { CardService } from '../../../../services/card/card.service';
1717
import { AuthenticationService } from '../../../../services/authentication/authentication.service';
@@ -30,6 +30,7 @@ import {
3030
MODIFICATION_TYPE_LABEL,
3131
RECON_TYPE_LABEL,
3232
} from '../../../../shared/application-type-pill/application-type-pill.constants';
33+
import { Router } from '@angular/router';
3334

3435
@Component({
3536
selector: 'app-application-decision-condition-dialog',
@@ -70,6 +71,7 @@ export class ApplicationDecisionConditionDialogComponent extends CardDialogCompo
7071
toastService: ToastService,
7172
cardService: CardService,
7273
authService: AuthenticationService,
74+
private router: Router,
7375
) {
7476
super(authService, dialogRef, cardService, confirmationDialogService, toastService, userService, boardService);
7577
}
@@ -222,4 +224,32 @@ export class ApplicationDecisionConditionDialogComponent extends CardDialogCompo
222224
isSaveDisabled(): boolean {
223225
return !this.dataSource.data.some((item) => item.selected);
224226
}
227+
228+
async onBoardSelected(board: BoardWithFavourite) {
229+
this.selectedBoard = board.code;
230+
try {
231+
await this.boardService.changeBoard(this.applicationDecisionConditionCard.card!.uuid, board.code);
232+
const loadedBoard = await this.boardService.fetchBoardDetail(board.code);
233+
if (loadedBoard) {
234+
this.boardStatuses = loadedBoard.statuses;
235+
}
236+
237+
this.isDirty = true;
238+
const toast = this.toastService.showSuccessToast(`Application Condition moved to ${board.title}`, 'Go to Board');
239+
toast.onAction().subscribe(() => {
240+
this.router.navigate(['/board', board.code]);
241+
});
242+
await this.reloadApplicationCondition();
243+
} catch (e) {
244+
this.toastService.showErrorToast('Failed to move to new board');
245+
}
246+
}
247+
248+
async reloadApplicationCondition() {
249+
const applicationDecisionConditionCard = await this.applicationDecisionConditionCardService.getByCard(
250+
this.applicationDecisionConditionCard.card.uuid,
251+
);
252+
this.applicationDecisionConditionCard = applicationDecisionConditionCard!;
253+
this.populateData();
254+
}
225255
}

‎alcs-frontend/src/app/shared/application-type-pill/application-type-pill.constants.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ export const CLOSED_PR_LABEL = {
120120

121121
export const CONDITION_LABEL = {
122122
label: 'Condition',
123-
shortLabel: 'Condition',
123+
shortLabel: 'COND',
124124
backgroundColor: '#fff',
125125
borderColor: '#454545',
126126
textColor: '#000',

‎alcs-frontend/src/app/shared/card/card.component.html

+91-63
Original file line numberDiff line numberDiff line change
@@ -10,80 +10,108 @@
1010
</div>
1111
<div class="card-content">
1212
<div class="upper-card">
13-
<div class="subtext">
14-
{{ cardData.typeLabel }}
13+
<div class="row">
14+
<div class="subtext">
15+
{{ cardData.typeLabel }}
16+
</div>
17+
</div>
18+
<div class="row">
19+
<span
20+
class="ellipsis"
21+
[id]="cardData.id"
22+
[matTooltip]="cardData.titleTooltip"
23+
(mouseover)="onMouseHover(cardData.id)"
24+
(focus)="onMouseHover(cardData.id)"
25+
[matTooltipDisabled]="!cardData.verticalOutBound"
26+
>{{ cardData.title }}</span
27+
>
28+
<span class="high-priority" *ngIf="cardData.highPriority">!</span>
1529
</div>
16-
<span
17-
class="ellipsis"
18-
[id]="cardData.id"
19-
[matTooltip]="cardData.titleTooltip"
20-
(mouseover)="onMouseHover(cardData.id)"
21-
(focus)="onMouseHover(cardData.id)"
22-
[matTooltipDisabled]="!cardData.verticalOutBound"
23-
>{{ cardData.title }}</span
24-
>
25-
<span class="high-priority" *ngIf="cardData.highPriority">!</span>
26-
<div class="labels">
27-
<app-application-type-pill
28-
*ngFor="let type of cardData.labels"
29-
[type]="type"
30-
[useShortLabel]="true"
31-
></app-application-type-pill>
30+
<div class="row">
31+
<div class="labels">
32+
<app-application-type-pill
33+
*ngFor="let type of cardData.labels"
34+
[type]="type"
35+
[useShortLabel]="true"
36+
></app-application-type-pill>
37+
<ng-container *ngIf="isConditionCard && !isInConditionBoard">
38+
<app-application-type-pill
39+
[type]="getStatusPill('CONDITION')"
40+
[useShortLabel]="true"
41+
></app-application-type-pill>
42+
<app-application-type-pill
43+
*ngIf="isModification"
44+
[type]="getStatusPill('MODIFICATION')"
45+
[useShortLabel]="true"
46+
></app-application-type-pill>
47+
<app-application-type-pill
48+
*ngIf="isReconsideration"
49+
[type]="getStatusPill('RECONSIDERATION')"
50+
[useShortLabel]="true"
51+
></app-application-type-pill>
52+
</ng-container>
53+
</div>
3254
</div>
3355
</div>
3456
<div class="lower-card">
35-
<div *ngIf="!isConditionCard">
36-
<div
37-
*ngIf="cardData.activeDays !== undefined"
38-
class="day-count active-days center"
39-
matTooltip="Active days: {{ cardData.activeDays }} "
40-
>
41-
<mat-icon>calendar_month</mat-icon>
42-
<span *ngIf="!cardData.maxActiveDays || cardData.activeDays < cardData.maxActiveDays" class="center">
43-
{{ cardData.activeDays }}
44-
</span>
45-
<span *ngIf="cardData.maxActiveDays && cardData.activeDays >= cardData.maxActiveDays" class="center">
46-
{{ cardData.maxActiveDays }}+
47-
</span>
48-
</div>
49-
<div
50-
*ngIf="cardData.pausedDays !== undefined"
51-
class="day-count center"
52-
matTooltip="Paused days: {{ cardData.pausedDays }} "
53-
>
54-
<mat-icon>pause</mat-icon>
55-
<span class="center">{{ cardData.pausedDays }}</span>
56-
</div>
57-
<div *ngIf="cardData.showDueDate && cardData.dueDate" class="due-date center">
58-
<span class="center">Due: {{ cardData.dueDate | momentFormat }}</span>
59-
</div>
60-
<div *ngIf="cardData.activeDays && cardData.dueDate !== undefined" class="due-date center">
61-
<span *ngIf="!cardData.maxActiveDays || cardData.activeDays < cardData.maxActiveDays" class="center"
62-
>Due: {{ cardData.dueDate | momentFormat }}</span
57+
<div class="left-card">
58+
<div *ngIf="!isConditionCard">
59+
<div
60+
*ngIf="cardData.activeDays !== undefined"
61+
class="day-count active-days center"
62+
matTooltip="Active days: {{ cardData.activeDays }} "
6363
>
64-
<span *ngIf="cardData.maxActiveDays && cardData.activeDays >= cardData.maxActiveDays" class="center red-text"
65-
>Overdue</span
64+
<mat-icon>calendar_month</mat-icon>
65+
<span *ngIf="!cardData.maxActiveDays || cardData.activeDays < cardData.maxActiveDays" class="center">
66+
{{ cardData.activeDays }}
67+
</span>
68+
<span *ngIf="cardData.maxActiveDays && cardData.activeDays >= cardData.maxActiveDays" class="center">
69+
{{ cardData.maxActiveDays }}+
70+
</span>
71+
</div>
72+
<div
73+
*ngIf="cardData.pausedDays !== undefined"
74+
class="day-count center"
75+
matTooltip="Paused days: {{ cardData.pausedDays }} "
6676
>
77+
<mat-icon>pause</mat-icon>
78+
<span class="center">{{ cardData.pausedDays }}</span>
79+
</div>
80+
<div *ngIf="cardData.showDueDate && cardData.dueDate" class="due-date center">
81+
<span class="center">Due: {{ cardData.dueDate | momentFormat }}</span>
82+
</div>
83+
<div *ngIf="cardData.activeDays && cardData.dueDate !== undefined" class="due-date center">
84+
<span *ngIf="!cardData.maxActiveDays || cardData.activeDays < cardData.maxActiveDays" class="center"
85+
>Due: {{ cardData.dueDate | momentFormat }}</span
86+
>
87+
<span
88+
*ngIf="cardData.maxActiveDays && cardData.activeDays >= cardData.maxActiveDays"
89+
class="center red-text"
90+
>Overdue</span
91+
>
92+
</div>
6793
</div>
68-
</div>
6994

70-
<div class="condition-status-pill">
71-
<app-application-type-pill *ngIf="isExpired" [type]="getStatusPill('EXPIRED')"></app-application-type-pill>
72-
<app-application-type-pill *ngIf="isPastDue" [type]="getStatusPill('PASTDUE')"></app-application-type-pill>
95+
<div class="condition-status-pill" *ngIf="isConditionCard && isInConditionBoard">
96+
<app-application-type-pill *ngIf="isExpired" [type]="getStatusPill('EXPIRED')"></app-application-type-pill>
97+
<app-application-type-pill *ngIf="isPastDue" [type]="getStatusPill('PASTDUE')"></app-application-type-pill>
98+
</div>
7399
</div>
74100

75-
<div class="flag-avatar-container">
76-
<mat-icon
77-
*ngIf="cardData.cardType === CardType.APP_CON && cardData.decisionIsFlagged"
78-
svgIcon="personal_places"
79-
class="flag-icon"
80-
></mat-icon>
101+
<div class="right-card">
102+
<div class="flag-avatar-container">
103+
<mat-icon
104+
*ngIf="cardData.cardType === CardType.APP_CON && cardData.decisionIsFlagged"
105+
svgIcon="personal_places"
106+
class="flag-icon"
107+
></mat-icon>
81108

82-
<app-avatar-circle
83-
*ngIf="cardData.assignee"
84-
[initials]="cardData.assignee.initials || ''"
85-
[name]="cardData.assignee.prettyName"
86-
></app-avatar-circle>
109+
<app-avatar-circle
110+
*ngIf="cardData.assignee"
111+
[initials]="cardData.assignee.initials || ''"
112+
[name]="cardData.assignee.prettyName"
113+
></app-avatar-circle>
114+
</div>
87115
</div>
88116
</div>
89117
</div>

‎alcs-frontend/src/app/shared/card/card.component.scss

+20-1
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,6 @@ $date-ht: 32px;
7474
font-size: 1.4em;
7575
font-weight: bold;
7676
color: colors.$error-color;
77-
float: right;
7877
}
7978

8079
.day-count {
@@ -96,6 +95,8 @@ $date-ht: 32px;
9695

9796
.labels {
9897
margin-top: 6px;
98+
display: flex;
99+
justify-items: flex-start;
99100
}
100101

101102
.cdk-drag-placeholder {
@@ -150,3 +151,21 @@ mat-card {
150151
.flag-icon {
151152
color: blue;
152153
}
154+
155+
.left-card {
156+
display: flex;
157+
justify-content: flex-start;
158+
flex: 1;
159+
}
160+
161+
.right-card {
162+
display: flex;
163+
justify-content: flex-end;
164+
flex: 1;
165+
}
166+
167+
.row {
168+
width: 100%;
169+
display: flex;
170+
justify-content: space-between;
171+
}

0 commit comments

Comments
 (0)