mine in app notification listing changes
This commit is contained in:
amentis
parent
cb7d5b342f
commit
46ba3dcb62
|
|
@ -16,6 +16,13 @@
|
|||
</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
|
||||
<mat-select multiple [(ngModel)]="internalFilters.type">
|
||||
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-label>
|
||||
</div>
|
||||
<div>
|
||||
<mat-label>{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}
|
||||
<mat-select multiple [(ngModel)]="internalFilters.trackingState">
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import { NotificationInAppTracking } from '@app/core/common/enum/notification-in
|
|||
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
||||
import { InAppNotificationFilter } from '@app/core/query/inapp-notification.lookup';
|
||||
import { nameof } from 'ts-simple-nameof';
|
||||
import { NotificationType } from '@app/core/common/enum/notification-type';
|
||||
@Component({
|
||||
selector: 'app-mine-inapp-notification-listing-filters',
|
||||
templateUrl: './mine-inapp-notification-listing-filters.component.html',
|
||||
|
|
@ -16,6 +17,7 @@ export class MineInAppNotificationListingFiltersComponent extends BaseComponent
|
|||
@Output() filterChange = new EventEmitter<InAppNotificationFilter>();
|
||||
|
||||
notificationInAppTrackingEnumValues = this.enumUtils.getEnumValues<NotificationInAppTracking>(NotificationInAppTracking);
|
||||
notificationTypeEnumValues = this.enumUtils.getEnumValues<NotificationType>(NotificationType);
|
||||
|
||||
// * State
|
||||
internalFilters: InAppNotificationListingFilters = this._getEmptyFilters();
|
||||
|
|
@ -47,11 +49,12 @@ export class MineInAppNotificationListingFiltersComponent extends BaseComponent
|
|||
}
|
||||
|
||||
protected applyFilters(): void {
|
||||
const { like, trackingState } = this.internalFilters ?? {}
|
||||
const { like, trackingState, type } = this.internalFilters ?? {}
|
||||
this.filterChange.emit({
|
||||
...this.filter,
|
||||
like,
|
||||
trackingState
|
||||
trackingState,
|
||||
type
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -61,11 +64,12 @@ export class MineInAppNotificationListingFiltersComponent extends BaseComponent
|
|||
return this._getEmptyFilters();
|
||||
}
|
||||
|
||||
let { like, trackingState } = inputFilter;
|
||||
let { like, trackingState, type } = inputFilter;
|
||||
|
||||
return {
|
||||
like: like,
|
||||
trackingState: trackingState
|
||||
trackingState: trackingState,
|
||||
type: type
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -73,7 +77,8 @@ export class MineInAppNotificationListingFiltersComponent extends BaseComponent
|
|||
private _getEmptyFilters(): InAppNotificationListingFilters {
|
||||
return {
|
||||
like: null,
|
||||
trackingState: null
|
||||
trackingState: null,
|
||||
type: null
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -90,4 +95,5 @@ export class MineInAppNotificationListingFiltersComponent extends BaseComponent
|
|||
interface InAppNotificationListingFilters {
|
||||
like: string;
|
||||
trackingState: NotificationInAppTracking[];
|
||||
type: NotificationType[];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,9 +32,33 @@
|
|||
<div class="d-flex align-items-center p-3 gap-1-rem">
|
||||
<div class="row">
|
||||
<ng-container *ngIf="isColumnSelected('trackingState')">
|
||||
<a class="buttonLinkClass" [routerLink]="'./' + item?.id" class="col-12"
|
||||
(click)="$event.stopPropagation()">{{item?.trackingState | nullifyValue}}</a>
|
||||
<br />
|
||||
<span class="col-12">
|
||||
<small>
|
||||
<mat-icon *ngIf="item?.trackingState == notificationInAppTracking.Delivered" mat-list-icon>drafts</mat-icon>
|
||||
<mat-icon *ngIf="item?.trackingState == notificationInAppTracking.Stored" mat-list-icon>mail</mat-icon>
|
||||
</small>
|
||||
</span>
|
||||
<br>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="isColumnSelected('subject')">
|
||||
<span class="col-12">
|
||||
{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.SUBJECT' | translate}}:
|
||||
<small>
|
||||
{{item?.subject | nullifyValue}}
|
||||
</small>
|
||||
</span>
|
||||
<br>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="isColumnSelected('type')">
|
||||
<span class="col-12">
|
||||
{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.NOTIFICATION-TYPE' | translate}}:
|
||||
<small>
|
||||
{{enumUtils.toNotificationTypeString(item.type) | nullifyValue}}
|
||||
</small>
|
||||
</span>
|
||||
<br>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="isColumnSelected('createdAt')">
|
||||
|
|
@ -64,4 +88,13 @@
|
|||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #state let-row="row" let-item>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<mat-icon *ngIf="row.trackingState === notificationInAppTracking.Delivered" mat-list-icon>drafts</mat-icon>
|
||||
<mat-icon *ngIf="row.trackingState === notificationInAppTracking.Stored" mat-list-icon>mail</mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
|
@ -13,7 +13,6 @@ import { InAppNotificationLookup } from '@app/core/query/inapp-notification.look
|
|||
import { InAppNotificationService } from '@app/core/services/inapp-notification/inapp-notification.service';
|
||||
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
||||
import { nameof } from 'ts-simple-nameof';
|
||||
import { NotificationInAppTrackingTypePipe } from '@common/formatting/pipes/notification-inapp-tracking-type.pipe';
|
||||
import { Observable } from 'rxjs';
|
||||
import { QueryResult } from '@common/model/query-result';
|
||||
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
||||
|
|
@ -22,6 +21,8 @@ import { MatDialog } from '@angular/material/dialog';
|
|||
import { Guid } from '@common/types/guid';
|
||||
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { NotificationInAppTracking } from '@app/core/common/enum/notification-inapp-tracking.enum';
|
||||
import { NotificationTypePipe } from '@common/formatting/pipes/notification-type.pipe';
|
||||
|
||||
@Component({
|
||||
selector: 'app-mine-inapp-notification-listing',
|
||||
|
|
@ -32,13 +33,16 @@ export class MineInAppNotificationListingComponent extends BaseListingComponent<
|
|||
publish = false;
|
||||
userSettingsKey = { key: 'InAppNotificationListingUserSettings' };
|
||||
propertiesAvailableForOrder: ColumnDefinition[];
|
||||
notificationInAppTracking= NotificationInAppTracking;
|
||||
|
||||
@ViewChild('actions', { static: true }) actions?: TemplateRef<any>;
|
||||
@ViewChild('state', { static: true }) state?: TemplateRef<any>;
|
||||
@ViewChild(HybridListingComponent, { static: true }) hybridListingComponent: HybridListingComponent;
|
||||
|
||||
private readonly lookupFields: string[] = [
|
||||
nameof<InAppNotification>(x => x.id),
|
||||
nameof<InAppNotification>(x => x.subject),
|
||||
nameof<InAppNotification>(x => x.type),
|
||||
nameof<InAppNotification>(x => x.trackingState),
|
||||
nameof<InAppNotification>(x => x.createdAt),
|
||||
nameof<InAppNotification>(x => x.isActive)
|
||||
|
|
@ -86,15 +90,22 @@ export class MineInAppNotificationListingComponent extends BaseListingComponent<
|
|||
|
||||
protected setupColumns() {
|
||||
this.gridColumns.push(...[{
|
||||
prop: nameof<InAppNotification>(x => x.subject),
|
||||
sortable: true,
|
||||
languageName: 'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.SUBJECT'
|
||||
},
|
||||
{
|
||||
prop: nameof<InAppNotification>(x => x.trackingState),
|
||||
sortable: true,
|
||||
languageName: 'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.TRACKING-STATE',
|
||||
pipe: this.pipeService.getPipe<NotificationInAppTrackingTypePipe>(NotificationInAppTrackingTypePipe)
|
||||
cellTemplate: this.state,
|
||||
maxWidth: 100
|
||||
},
|
||||
{
|
||||
prop: nameof<InAppNotification>(x => x.subject),
|
||||
sortable: true,
|
||||
languageName: 'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.SUBJECT'
|
||||
},
|
||||
{
|
||||
prop: nameof<InAppNotification>(x => x.type),
|
||||
sortable: true,
|
||||
languageName: 'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FIELDS.NOTIFICATION-TYPE',
|
||||
pipe: this.pipeService.getPipe<NotificationTypePipe>(NotificationTypePipe)
|
||||
},
|
||||
{
|
||||
prop: nameof<InAppNotification>(x => x.createdAt),
|
||||
|
|
|
|||
|
|
@ -1336,11 +1336,13 @@
|
|||
"FIELDS": {
|
||||
"SUBJECT": "Subject",
|
||||
"TRACKING-STATE": "State",
|
||||
"NOTIFICATION-TYPE":"Type",
|
||||
"CREATED-AT": "Created"
|
||||
},
|
||||
"FILTER": {
|
||||
"TITLE": "Filters",
|
||||
"TRACKING-STATE":"State",
|
||||
"NOTIFICATION-TYPE":"Type",
|
||||
"IS-ACTIVE": "Is Active",
|
||||
"CANCEL": "Cancel",
|
||||
"APPLY-FILTERS": "Apply filters"
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import { ReferenceTypePipe } from './pipes/reference-type.pipe';
|
|||
import { ReferenceSourceTypePipe } from './pipes/reference-source-type.pipe';
|
||||
import { NotificationTemplateChannelPipe } from './pipes/notification-template-channel.pipe';
|
||||
import { NotificationTemplateKindPipe } from './pipes/notification-template-kind.pipe';
|
||||
import { NotificationInAppTrackingTypePipe } from './pipes/notification-inapp-tracking-type.pipe';
|
||||
import { NotificationTypePipe } from './pipes/notification-type.pipe';
|
||||
|
||||
//
|
||||
//
|
||||
|
|
@ -31,7 +31,7 @@ import { NotificationInAppTrackingTypePipe } from './pipes/notification-inapp-tr
|
|||
ReferenceSourceTypePipe,
|
||||
NotificationTemplateChannelPipe,
|
||||
NotificationTemplateKindPipe,
|
||||
NotificationInAppTrackingTypePipe
|
||||
NotificationTypePipe
|
||||
],
|
||||
exports: [
|
||||
DateFormatPipe,
|
||||
|
|
@ -47,7 +47,7 @@ import { NotificationInAppTrackingTypePipe } from './pipes/notification-inapp-tr
|
|||
ReferenceSourceTypePipe,
|
||||
NotificationTemplateChannelPipe,
|
||||
NotificationTemplateKindPipe,
|
||||
NotificationInAppTrackingTypePipe
|
||||
NotificationTypePipe
|
||||
],
|
||||
providers: [
|
||||
DateFormatPipe,
|
||||
|
|
@ -63,7 +63,7 @@ import { NotificationInAppTrackingTypePipe } from './pipes/notification-inapp-tr
|
|||
ReferenceSourceTypePipe,
|
||||
NotificationTemplateChannelPipe,
|
||||
NotificationTemplateKindPipe,
|
||||
NotificationInAppTrackingTypePipe
|
||||
NotificationTypePipe
|
||||
]
|
||||
})
|
||||
export class CommonFormattingModule { }
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
import { Pipe, PipeTransform } from '@angular/core';
|
||||
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
||||
|
||||
@Pipe({ name: 'NotificationInAppTrackingTypeFormat' })
|
||||
export class NotificationInAppTrackingTypePipe implements PipeTransform {
|
||||
@Pipe({ name: 'NotificationTypeFormat' })
|
||||
export class NotificationTypePipe implements PipeTransform {
|
||||
constructor(private enumUtils: EnumUtils) { }
|
||||
|
||||
public transform(value): any {
|
||||
return this.enumUtils.toNotificationInAppTrackingString(value);
|
||||
return this.enumUtils.toNotificationTypeString(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue