Skip to content

Commit

Permalink
Merge pull request #607 from bcgov/oleks
Browse files Browse the repository at this point in the history 
DSS-796: FE: Enhancement to send notice/takedown in aggregated listings
  • Loading branch information
@ychung-mot
ychung-mot authored Sep 6, 2024
2 parents 2406569 + ed2aa67 commit ebc7e1d
Show file tree
Hide file tree
Showing 6 changed files with 110 additions and 16 deletions.
17 changes: 14 additions & 3 deletions .../src/app/features/components/bulk-compliance-notice/bulk-compliance-notice.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,24 @@ <h2>Send Notices of Non-Compliance</h2>
<h4>Complete the following fields to send Notices of Non-Compliance to STR Hosts and Platform Representatives.</h4>
<h4>All fields are required except where stated.</h4>

<p-panel class="table-panel" header="Included Listings">
<p-panel class="table-panel">
<ng-template pTemplate="header" *ngIf="containsDisabledItems">
<div class="header-panel">
<strong>Included Listings</strong>
<div *ngIf="containsDisabledItems" class="some-items-are-inactive-msg"> <i
class="pi pi-info-circle"></i>Notices of Non-Compliance and
Takedown Requests cannot be sent
for inactive listings as they are no longer available on the platform.</div>
</div>
</ng-template>

<p-table [value]="extendedListings" [scrollable]="true" scrollDirection="vertical" scrollHeight="425px"
styleClass="p-datatable-sm" [(selection)]="selectedListings">
<ng-template pTemplate="header">
<tr>
<th style="width: 4rem">
<p-tableHeaderCheckbox></p-tableHeaderCheckbox>
<p-checkbox [binary]="true" [disabled]="containsDisabledItems"
(onChange)="onListingSelected($event)"></p-checkbox>
</th>
<th class="sortable-header" id="offeringOrganizationNm_header"
[class.sorted]="this.sort && this.sort.prop === 'offeringOrganizationNm'"
Expand Down Expand Up @@ -62,7 +73,7 @@ <h4>All fields are required except where stated.</h4>
<ng-template pTemplate="body" let-listing>
<tr class="small-text">
<td>
<p-tableCheckbox [value]="listing"></p-tableCheckbox>
<p-tableCheckbox [disabled]="listing.listingStatusType === 'I'" [value]="listing"></p-tableCheckbox>
</td>
<td>{{ listing.offeringOrganizationNm }}</td>
<td>
Expand Down
22 changes: 22 additions & 0 deletions .../src/app/features/components/bulk-compliance-notice/bulk-compliance-notice.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,28 @@
p-panel {
margin-bottom: 24px;
display: block;

.header-panel {
display: flex;
gap: 8px;
align-items: center;
justify-content: space-between;
width: 100%;

strong {
font-size: larger;
}

.some-items-are-inactive-msg {
i {
margin-right: 8px;
font-weight: 600;
}

font-size: medium;
color: #D32F2F;
}
}
}

tr {
Expand Down
27 changes: 21 additions & 6 deletions ...nd/src/app/features/components/bulk-compliance-notice/bulk-compliance-notice.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import { ErrorHandlingService } from '../../../common/services/error-handling.se
import { ComplianceNoticeBulk } from '../../../common/models/compliance-notice';
import { OverlayPanelModule } from 'primeng/overlaypanel';
import { GlobalLoaderService } from '../../../common/services/global-loader.service';
import { ListingTableRow } from '../../../common/models/listing-table-row';

@Component({
selector: 'app-bulk-compliance-notice',
Expand All @@ -41,17 +42,19 @@ import { GlobalLoaderService } from '../../../common/services/global-loader.serv
styleUrl: './bulk-compliance-notice.component.scss'
})
export class BulkComplianceNoticeComponent implements OnInit {
listings!: Array<ListingDetails>;
listings!: Array<ListingDetails | ListingTableRow>;
returnUrl!: string;
myForm!: FormGroup;
extendedListings = new Array<ListingDetailsWithHostCheckboxExtension>();
containsDisabledItems = false;

extendedListings = new Array<ListingDetailsWithHostCheckboxExtension | any>();

previewText = '';
showPreviewDialog = false;

submissionArray!: Array<ComplianceNoticeBulk>;

selectedListings!: Array<ListingDetailsWithHostCheckboxExtension>;
selectedListings!: Array<ListingDetails | ListingTableRow>;
addressWarningScoreLimit = Number.parseInt(environment.ADDRESS_SCORE);
sort!: { prop: string, dir: 'asc' | 'desc' }

Expand Down Expand Up @@ -81,9 +84,12 @@ export class BulkComplianceNoticeComponent implements OnInit {
else {
this.returnUrl = param['returnUrl'];
this.listings = [...this.searchStateService.selectedListings];
this.extendedListings = this.listings.map((listing) => ({ ...listing, sendNoticeToHosts: listing.hasAtLeastOneValidHostEmail }));
this.containsDisabledItems = this.listings.some(l => l.listingStatusType !== 'I')

this.extendedListings = this.listings.map((listing) => ({ ...listing, sendNoticeToHosts: (listing as any).hasAtLeastOneValidHostEmail }));
this.searchStateService.selectedListings = new Array<ListingDetailsWithHostCheckboxExtension>();
this.selectedListings = this.extendedListings;
this.selectedListings = this.extendedListings.filter(l => l.listingStatusType !== 'I')
;

this.initForm();
this.cloakParams();
Expand Down Expand Up @@ -145,9 +151,18 @@ export class BulkComplianceNoticeComponent implements OnInit {
this.showPreviewDialog = false;
}

onListingSelected(e: any): void {
console.log(e);
if (e.checked) {
this.selectedListings = this.listings.filter(l => l.listingStatusType !== 'I');
} else {
this.selectedListings = [];
}
}

private sendPreview(): void {
const formValues = this.myForm.value;
this.submissionArray = this.selectedListings.map((x: ListingDetailsWithHostCheckboxExtension) => ({
this.submissionArray = this.selectedListings.map((x: ListingDetailsWithHostCheckboxExtension | any) => ({
rentalListingId: x.rentalListingId,
ccList: formValues.ccList.prototype === Array
? formValues
Expand Down
18 changes: 15 additions & 3 deletions ...nd/src/app/features/components/bulk-takedown-request/bulk-takedown-request.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,24 @@ <h4>Takedown Requests for each platform are aggregated into a CSV file and sent
where stated.</h4>
<form *ngIf="myForm" [formGroup]="myForm">

<p-panel class="table-panel" header="Included Listings">
<p-panel class="table-panel">
<ng-template pTemplate="header" *ngIf="containsDisabledItems">
<div class="header-panel">
<strong>Included Listings</strong>
<div *ngIf="containsDisabledItems" class="some-items-are-inactive-msg"> <i
class="pi pi-info-circle"></i>Notices of Non-Compliance and
Takedown Requests cannot be sent
for inactive listings as they are no longer available on the platform.</div>
</div>
</ng-template>

<p-table [value]="listings" [scrollable]="true" scrollDirection="vertical" scrollHeight="425px"
styleClass="p-datatable-sm" [(selection)]="selectedListings">
<ng-template pTemplate="header">
<tr>
<th style="width: 4rem">
<p-tableHeaderCheckbox></p-tableHeaderCheckbox>
<p-checkbox [binary]="true" [disabled]="containsDisabledItems"
(onChange)="onListingSelected($event)"></p-checkbox>
</th>
<th class="sortable-header" id="status_header"
[class.sorted]="this.sort && this.sort.prop === 'offeringOrganizationNm'"
Expand Down Expand Up @@ -54,7 +65,8 @@ <h4>Takedown Requests for each platform are aggregated into a CSV file and sent
<ng-template pTemplate="body" let-listing>
<tr class="small-text">
<td>
<p-tableCheckbox [value]="listing"></p-tableCheckbox>
<p-tableCheckbox [disabled]="listing.listingStatusType === 'I'"
[value]="listing"></p-tableCheckbox>
</td>
<td>{{ listing.offeringOrganizationNm }}</td>
<td>
Expand Down
22 changes: 22 additions & 0 deletions ...nd/src/app/features/components/bulk-takedown-request/bulk-takedown-request.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,28 @@
p-panel {
margin-bottom: 24px;
display: block;

.header-panel {
display: flex;
gap: 8px;
align-items: center;
justify-content: space-between;
width: 100%;

strong {
font-size: larger;
}

.some-items-are-inactive-msg {
i {
margin-right: 8px;
font-weight: 600;
}

font-size: medium;
color: #D32F2F;
}
}
}

tr {
Expand Down
20 changes: 16 additions & 4 deletions ...tend/src/app/features/components/bulk-takedown-request/bulk-takedown-request.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import { DelistingService } from '../../../common/services/delisting.service';
import { validateEmailListString } from '../../../common/consts/validators.const';
import { ErrorHandlingService } from '../../../common/services/error-handling.service';
import { GlobalLoaderService } from '../../../common/services/global-loader.service';
import { ListingTableRow } from '../../../common/models/listing-table-row';

@Component({
selector: 'app-bulk-takedown-request',
Expand All @@ -37,9 +38,10 @@ import { GlobalLoaderService } from '../../../common/services/global-loader.serv
styleUrl: './bulk-takedown-request.component.scss'
})
export class BulkTakedownRequestComponent implements OnInit {
listings!: Array<ListingDetails>;
listings!: Array<ListingDetails | ListingTableRow>;
returnUrl!: string;
myForm!: FormGroup;
containsDisabledItems = false;

previewText = '';
showPreviewDialog = false;
Expand All @@ -51,7 +53,7 @@ export class BulkTakedownRequestComponent implements OnInit {
customDetailTxt: any;
}[]

selectedListings!: Array<ListingDetails>;
selectedListings!: Array<ListingDetails | ListingTableRow>;
addressWarningScoreLimit = Number.parseInt(environment.ADDRESS_SCORE);
sort!: { prop: string, dir: 'asc' | 'desc' }

Expand Down Expand Up @@ -85,13 +87,23 @@ export class BulkTakedownRequestComponent implements OnInit {
this.returnUrl = param['returnUrl'];
this.listings = [...this.searchStateService.selectedListings];
this.searchStateService.selectedListings = new Array<ListingDetails>();
this.selectedListings = this.listings;
this.selectedListings = this.listings.filter(l => l.listingStatusType !== 'I');
this.containsDisabledItems = this.listings.some(l => l.listingStatusType !== 'I')
this.initForm();
this.cloakParams();
}
});
}

onListingSelected(e: any): void {
console.log(e);
if (e.checked) {
this.selectedListings = this.listings.filter(l => l.listingStatusType !== 'I');
} else {
this.selectedListings = [];
}
}

onSort(property: keyof ListingDetails): void {
if (this.sort) {
if (this.sort.prop === property) {
Expand Down Expand Up @@ -158,7 +170,7 @@ export class BulkTakedownRequestComponent implements OnInit {

private sendPreview(): void {
const formValues = this.myForm.value;
this.submissionArray = this.selectedListings.map((x: ListingDetails) => ({
this.submissionArray = this.selectedListings.map((x: ListingDetails | ListingTableRow) => ({
rentalListingId: x.rentalListingId,
ccList: formValues.ccList.prototype === Array
? formValues
Expand Down

0 comments on commit ebc7e1d

Please sign in to comment.