arranging proje
This commit is contained in:
parent
8bc54330a6
commit
0ad9d38d49
|
@ -1,3 +1,15 @@
|
|||
<div *ngFor="let notification of notificationPage.content">
|
||||
<div>{{notification.title}}</div>
|
||||
<div class="ui-g ui-g-nopad ui-app-noti" *ngIf="notificationPage">
|
||||
<h4>Notifications</h4>
|
||||
<li role="menuitem" *ngFor="let noti of notificationPage.content | slice:0:5; let i = index">
|
||||
<a href="javascript:void(0)" class="topbar-message" (click)="onNotiClick(noti)" [ngStyle]="noti.confirmDate ? '' : {'background-color': 'lightblue'}">
|
||||
<div class="ui-app-noti-date">{{noti.createDate | date: 'short'}}</div>
|
||||
<div class="ui-app-noti-title">{{noti.title}}</div>
|
||||
<div class="ui-app-noti-content">{{noti.message}}</div>
|
||||
</a>
|
||||
</li>
|
||||
<li role="menuitem">
|
||||
<a href="javascript:void(0)" class="topbar-message" (click)="onViewAllClick()">
|
||||
<span>View All</span>
|
||||
</a>
|
||||
</li>
|
||||
</div>
|
|
@ -10,4 +10,14 @@ import { Paginator } from 'primeng/primeng';
|
|||
export class NotificationBadgeComponent {
|
||||
|
||||
@Input() notificationPage: Page<Notification>;
|
||||
@Output() viewAll = new EventEmitter();
|
||||
@Output() select = new EventEmitter<Notification>();
|
||||
|
||||
onNotiClick(notification: Notification) {
|
||||
this.select.emit(notification);
|
||||
}
|
||||
|
||||
onViewAllClick() {
|
||||
this.viewAll.emit();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -16,7 +16,7 @@ export class NotificationListComponent implements OnChanges {
|
|||
@ViewChild('paginator') paginator: Paginator;
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
if (changes['notificationPage']) {
|
||||
if (changes['notificationPage'] && this.paginator) {
|
||||
this.paginator.changePage(this.notificationPage.number);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,2 +1 @@
|
|||
<of-notification-badge [notificationPage]="notificationPage$ | async"
|
||||
></of-notification-badge>
|
||||
<of-notification-badge [notificationPage]="notificationPage$ | async" (select)="onSelect($event)" (viewAll)="onViewAll($event)"></of-notification-badge>
|
|
@ -1,10 +1,10 @@
|
|||
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
|
||||
import { AfterContentInit, OnDestroy } from '@angular/core/src/metadata/lifecycle_hooks';
|
||||
import { AfterContentInit, OnDestroy, OnChanges, SimpleChanges } from '@angular/core/src/metadata/lifecycle_hooks';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
||||
import * as ListStore from '../../store/notification';
|
||||
import { NotificationSelector } from '../../store';
|
||||
import * as NotificationEntityStore from '../../store/entity/notification';
|
||||
import { NotificationEntitySelector } from '../../store/';
|
||||
import { AuthSelector } from '../../../member/store';
|
||||
import { Member } from '@overflow/commons-typescript/model/member';
|
||||
import { PageParams } from '@overflow/commons-typescript/model/commons/PageParams';
|
||||
|
@ -16,20 +16,26 @@ import { ActivatedRoute } from '@angular/router';
|
|||
selector: 'of-notification-badge-container',
|
||||
templateUrl: './badge-container.component.html',
|
||||
})
|
||||
export class NotificationBadgeContainerComponent implements OnInit {
|
||||
export class NotificationBadgeContainerComponent implements OnInit, OnChanges {
|
||||
|
||||
notificationPage$: Observable<Page<Notification>>;
|
||||
@Output() viewAll = new EventEmitter();
|
||||
@Output() select = new EventEmitter<Notification>();
|
||||
|
||||
constructor(
|
||||
private store: Store<ListStore.State>,
|
||||
private store: Store<NotificationEntityStore.State>,
|
||||
private route: ActivatedRoute
|
||||
) {
|
||||
this.notificationPage$ = store.pipe(select(NotificationSelector.select('page')));
|
||||
// this.notificationPage$ = store.pipe(select(NotificationEntitySelector.selectAll));
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.getNotifications();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
this.getNotifications();
|
||||
}
|
||||
|
||||
getNotifications() {
|
||||
this.store.select(AuthSelector.select('member')).subscribe(
|
||||
|
@ -40,7 +46,7 @@ export class NotificationBadgeContainerComponent implements OnInit {
|
|||
sortCol: 'id',
|
||||
sortDirection: 'descending',
|
||||
};
|
||||
this.store.dispatch(new ListStore.ReadAllByMember({ member, pageParams }));
|
||||
this.store.dispatch(new NotificationEntityStore.ReadAllByMember({ member, pageParams }));
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
|
@ -57,7 +63,7 @@ export class NotificationBadgeContainerComponent implements OnInit {
|
|||
sortCol: 'id',
|
||||
sortDirection: 'descending'
|
||||
};
|
||||
this.store.dispatch(new ListStore.MarkAllAsRead({ member, pageParams }));
|
||||
this.store.dispatch(new NotificationEntityStore.MarkAllAsRead({ member, pageParams }));
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
|
@ -65,8 +71,12 @@ export class NotificationBadgeContainerComponent implements OnInit {
|
|||
);
|
||||
}
|
||||
|
||||
notificationSelected(notification: Notification) {
|
||||
// this.router.navigate([notification.url]);
|
||||
alert('redirect to ' + notification.url);
|
||||
onSelect(notification: Notification) {
|
||||
this.select.emit(notification);
|
||||
}
|
||||
|
||||
onViewAll() {
|
||||
this.viewAll.emit();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -3,8 +3,8 @@ import { AfterContentInit, OnDestroy } from '@angular/core/src/metadata/lifecycl
|
|||
import { Store, select } from '@ngrx/store';
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
||||
import * as ListStore from '../../store/notification';
|
||||
import { NotificationSelector } from '../../store';
|
||||
import * as NotificationEntityStore from '../../store/entity/notification';
|
||||
import { NotificationEntitySelector } from '../../store/';
|
||||
import { AuthSelector } from '../../../member/store';
|
||||
import { Member } from '@overflow/commons-typescript/model/member';
|
||||
import { PageParams } from '@overflow/commons-typescript/model/commons/PageParams';
|
||||
|
@ -22,10 +22,10 @@ export class NotificationListContainerComponent implements OnInit {
|
|||
pageNo: number;
|
||||
|
||||
constructor(
|
||||
private store: Store<ListStore.State>,
|
||||
private store: Store<NotificationEntityStore.State>,
|
||||
private route: ActivatedRoute
|
||||
) {
|
||||
this.notificationPage$ = store.pipe(select(NotificationSelector.select('page')));
|
||||
// this.notificationPage$ = store.pipe(select(NotificationEntitySelector.selectAll));
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
@ -48,7 +48,7 @@ export class NotificationListContainerComponent implements OnInit {
|
|||
sortCol: 'id',
|
||||
sortDirection: 'descending',
|
||||
};
|
||||
this.store.dispatch(new ListStore.ReadAllByMember({ member, pageParams }));
|
||||
this.store.dispatch(new NotificationEntityStore.ReadAllByMember({ member, pageParams }));
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
|
@ -65,7 +65,7 @@ export class NotificationListContainerComponent implements OnInit {
|
|||
sortCol: 'id',
|
||||
sortDirection: 'descending'
|
||||
};
|
||||
this.store.dispatch(new ListStore.MarkAllAsRead({ member, pageParams }));
|
||||
this.store.dispatch(new NotificationEntityStore.MarkAllAsRead({ member, pageParams }));
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
|
|
|
@ -27,7 +27,7 @@ import {
|
|||
MarkAllAsReadFailure,
|
||||
ActionType,
|
||||
} from './notification.action';
|
||||
import { NotificationService } from '../../service/notification.service';
|
||||
import { NotificationService } from '../../../service/notification.service';
|
||||
|
||||
@Injectable()
|
||||
export class Effects {
|
|
@ -6,23 +6,22 @@ import {
|
|||
import {
|
||||
State,
|
||||
initialState,
|
||||
notificationAdapter
|
||||
} from './notification.state';
|
||||
|
||||
export function reducer(state = initialState, action: Actions): State {
|
||||
switch (action.type) {
|
||||
case ActionType.ReadAllByMember: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
pending: true,
|
||||
};
|
||||
}
|
||||
// case ActionType.ReadAllByMember: {
|
||||
// return {
|
||||
// ...state,
|
||||
// error: null,
|
||||
// };
|
||||
// }
|
||||
|
||||
// case ActionType.ReadAllByMemberSuccess: {
|
||||
// return {
|
||||
// ...state,
|
||||
// error: null,
|
||||
// pending: false,
|
||||
// page: action.payload,
|
||||
// };
|
||||
// }
|
||||
|
@ -31,24 +30,21 @@ export function reducer(state = initialState, action: Actions): State {
|
|||
// return {
|
||||
// ...state,
|
||||
// error: action.payload,
|
||||
// pending: false,
|
||||
// page: null,
|
||||
// };
|
||||
// }
|
||||
|
||||
case ActionType.MarkAllAsRead: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
pending: true,
|
||||
};
|
||||
}
|
||||
// case ActionType.MarkAllAsRead: {
|
||||
// return {
|
||||
// ...state,
|
||||
// error: null,
|
||||
// };
|
||||
// }
|
||||
|
||||
// case ActionType.MarkAllAsReadSuccess: {
|
||||
// return {
|
||||
// ...state,
|
||||
// error: null,
|
||||
// pending: false,
|
||||
// page: action.payload,
|
||||
// };
|
||||
// }
|
||||
|
@ -57,7 +53,6 @@ export function reducer(state = initialState, action: Actions): State {
|
|||
// return {
|
||||
// ...state,
|
||||
// error: action.payload,
|
||||
// pending: false,
|
||||
// page: null,
|
||||
// };
|
||||
// }
|
|
@ -0,0 +1,13 @@
|
|||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
import { Selector, createSelector } from '@ngrx/store';
|
||||
import { createEntityAdapter, EntityState } from '@loafer/ng-entity';
|
||||
|
||||
export const notificationAdapter = createEntityAdapter<Notification, RPCClientError>();
|
||||
export interface State extends EntityState<Notification, RPCClientError> {
|
||||
}
|
||||
export const initialState: State = notificationAdapter.getInitialState();
|
||||
|
||||
export function getSelectors<S>(selector: Selector<any, State>) {
|
||||
return notificationAdapter.getSelectors(selector);
|
||||
}
|
|
@ -7,23 +7,23 @@ import { StateSelector } from '@overflow/core/ngrx/store';
|
|||
|
||||
import { MODULE } from '../notification.constant';
|
||||
|
||||
import * as NotificationStore from './notification';
|
||||
import * as NotificationEntityStore from './entity/notification';
|
||||
|
||||
export interface State {
|
||||
notification: NotificationStore.State;
|
||||
notification: NotificationEntityStore.State;
|
||||
}
|
||||
|
||||
export const REDUCERS = {
|
||||
notification: NotificationStore.reducer,
|
||||
notification: NotificationEntityStore.reducer,
|
||||
};
|
||||
|
||||
export const EFFECTS = [
|
||||
NotificationStore.Effects,
|
||||
NotificationEntityStore.Effects,
|
||||
];
|
||||
|
||||
export const selectNotificationState = createFeatureSelector<State>(MODULE.name);
|
||||
export const selectState = createFeatureSelector<State>(MODULE.name);
|
||||
|
||||
export const NotificationSelector = new StateSelector<NotificationStore.State>(createSelector(
|
||||
selectNotificationState,
|
||||
export const NotificationEntitySelector = NotificationEntityStore.getSelectors(createSelector(
|
||||
selectState,
|
||||
(state: State) => state.notification
|
||||
));
|
||||
|
|
|
@ -1,61 +0,0 @@
|
|||
import { Action } from '@ngrx/store';
|
||||
|
||||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
|
||||
import { Member } from '@overflow/commons-typescript/model/member';
|
||||
// import { PageParams, Page } from 'app/commons/model';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
|
||||
export enum ActionType {
|
||||
MarkAsRead = '[Notification.notification] MarkAsRead',
|
||||
MarkAsReadSuccess = '[Notification.notification] MarkAsReadSuccess',
|
||||
MarkAsReadFailure = '[Notification.notification] MarkAsReadFailure',
|
||||
// ReadUnconfirmedCount = '[Notification.notification] ReadUnconfirmedCount',
|
||||
// ReadUnconfirmedCountSuccess = '[Notification.notification] ReadUnconfirmedCountSuccess',
|
||||
// ReadUnconfirmedCountFailure = '[Notification.notification] ReadUnconfirmedCountFailure',
|
||||
}
|
||||
|
||||
export class MarkAsRead implements Action {
|
||||
readonly type = ActionType.MarkAsRead;
|
||||
|
||||
constructor(public payload: Notification ) {}
|
||||
}
|
||||
|
||||
export class MarkAsReadSuccess implements Action {
|
||||
readonly type = ActionType.MarkAsReadSuccess;
|
||||
|
||||
constructor(public payload: Notification) {}
|
||||
}
|
||||
|
||||
export class MarkAsReadFailure implements Action {
|
||||
readonly type = ActionType.MarkAsReadFailure;
|
||||
|
||||
constructor(public payload: RPCClientError) {}
|
||||
}
|
||||
|
||||
// export class ReadUnconfirmedCount implements Action {
|
||||
// readonly type = ActionType.ReadUnconfirmedCount;
|
||||
|
||||
// constructor(public payload: Member) {}
|
||||
// }
|
||||
|
||||
// export class ReadUnconfirmedCountSuccess implements Action {
|
||||
// readonly type = ActionType.ReadUnconfirmedCountSuccess;
|
||||
|
||||
// constructor(public payload: number) {}
|
||||
// }
|
||||
|
||||
// export class ReadUnconfirmedCountFailure implements Action {
|
||||
// readonly type = ActionType.ReadUnconfirmedCountFailure;
|
||||
|
||||
// constructor(public payload: RPCClientError) {}
|
||||
// }
|
||||
|
||||
export type Actions =
|
||||
| MarkAsRead
|
||||
| MarkAsReadSuccess
|
||||
| MarkAsReadFailure
|
||||
// | ReadUnconfirmedCount
|
||||
// | ReadUnconfirmedCountSuccess
|
||||
// | ReadUnconfirmedCountFailure
|
||||
;
|
|
@ -1,15 +0,0 @@
|
|||
import { TestBed, inject } from '@angular/core/testing';
|
||||
|
||||
import { Effects } from './notification.effect';
|
||||
|
||||
describe('Notification.Effects', () => {
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({
|
||||
providers: [Effects]
|
||||
});
|
||||
});
|
||||
|
||||
it('should be created', inject([Effects], (effects: Effects) => {
|
||||
expect(effects).toBeTruthy();
|
||||
}));
|
||||
});
|
|
@ -1,50 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
import { Effect, Actions, ofType } from '@ngrx/effects';
|
||||
import { Action } from '@ngrx/store';
|
||||
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { of } from 'rxjs/observable/of';
|
||||
|
||||
import 'rxjs/add/operator/catch';
|
||||
import 'rxjs/add/operator/do';
|
||||
import 'rxjs/add/operator/exhaustMap';
|
||||
import 'rxjs/add/operator/map';
|
||||
import 'rxjs/add/operator/take';
|
||||
|
||||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
import { NotificationService } from '../../service/notification.service';
|
||||
|
||||
import {
|
||||
MarkAsRead,
|
||||
MarkAsReadSuccess,
|
||||
MarkAsReadFailure,
|
||||
ActionType,
|
||||
} from './notification.action';
|
||||
|
||||
@Injectable()
|
||||
export class Effects {
|
||||
|
||||
constructor(
|
||||
private actions$: Actions,
|
||||
private notificationService: NotificationService,
|
||||
private router: Router
|
||||
) { }
|
||||
|
||||
|
||||
@Effect()
|
||||
markAsRead$: Observable<Action> = this.actions$
|
||||
.ofType(ActionType.MarkAsRead)
|
||||
.map((action: MarkAsRead) => action.payload)
|
||||
.switchMap(payload => this.notificationService.markAsRead(payload))
|
||||
.map(notification => {
|
||||
return new MarkAsReadSuccess(notification);
|
||||
})
|
||||
.catch((error: RPCClientError) => {
|
||||
console.log(error.response.message);
|
||||
return of(new MarkAsReadFailure(error));
|
||||
});
|
||||
}
|
|
@ -1,44 +0,0 @@
|
|||
import {
|
||||
Actions,
|
||||
ActionType,
|
||||
} from './notification.action';
|
||||
|
||||
import {
|
||||
State,
|
||||
initialState,
|
||||
} from './notification.state';
|
||||
|
||||
export function reducer(state = initialState, action: Actions): State {
|
||||
switch (action.type) {
|
||||
case ActionType.MarkAsRead: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
pending: true,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.MarkAsReadSuccess: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
pending: false,
|
||||
notification: action.payload,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.MarkAsReadFailure: {
|
||||
return {
|
||||
...state,
|
||||
error: action.payload,
|
||||
pending: false,
|
||||
notification: null,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
default: {
|
||||
return state;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,14 +0,0 @@
|
|||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
|
||||
export interface State {
|
||||
error: RPCClientError | null;
|
||||
pending: boolean;
|
||||
notification: Notification;
|
||||
}
|
||||
|
||||
export const initialState: State = {
|
||||
error: null,
|
||||
pending: false,
|
||||
notification: null,
|
||||
};
|
|
@ -1,4 +0,0 @@
|
|||
export * from './notification.action';
|
||||
export * from './notification.effect';
|
||||
export * from './notification.reducer';
|
||||
export * from './notification.state';
|
|
@ -1,4 +0,0 @@
|
|||
export * from './notification.action';
|
||||
export * from './notification.effect';
|
||||
export * from './notification.reducer';
|
||||
export * from './notification.state';
|
|
@ -1,61 +0,0 @@
|
|||
import { Action } from '@ngrx/store';
|
||||
|
||||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
|
||||
import { Member } from '@overflow/commons-typescript/model/member';
|
||||
// import { PageParams, Page } from 'app/commons/model';
|
||||
|
||||
export enum ActionType {
|
||||
ReadAllByMember = '[Notification.notification] ReadAllByMember',
|
||||
ReadAllByMemberSuccess = '[Notification.notification] ReadAllByMemberSuccess',
|
||||
ReadAllByMemberFailure = '[Notification.notification] ReadAllByMemberFailure',
|
||||
MarkAllAsRead = '[Notification.notification] MarkAllAsRead',
|
||||
MarkAllAsReadSuccess = '[Notification.notification] MarkAllAsReadSuccess',
|
||||
MarkAllAsReadFailure = '[Notification.notification] MarkAllAsReadFailure',
|
||||
}
|
||||
|
||||
export class ReadAllByMember implements Action {
|
||||
readonly type = ActionType.ReadAllByMember;
|
||||
|
||||
// constructor(public payload: { member: Member, pageParams: PageParams }) {}
|
||||
}
|
||||
|
||||
export class ReadAllByMemberSuccess implements Action {
|
||||
readonly type = ActionType.ReadAllByMemberSuccess;
|
||||
|
||||
// constructor(public payload: Page) {}
|
||||
}
|
||||
|
||||
export class ReadAllByMemberFailure implements Action {
|
||||
readonly type = ActionType.ReadAllByMemberFailure;
|
||||
|
||||
constructor(public payload: RPCClientError) {}
|
||||
}
|
||||
|
||||
export class MarkAllAsRead implements Action {
|
||||
readonly type = ActionType.MarkAllAsRead;
|
||||
|
||||
// constructor(public payload: { member: Member, pageParams: PageParams }) {}
|
||||
}
|
||||
|
||||
export class MarkAllAsReadSuccess implements Action {
|
||||
readonly type = ActionType.MarkAllAsReadSuccess;
|
||||
|
||||
// constructor(public payload: Page) {}
|
||||
}
|
||||
|
||||
export class MarkAllAsReadFailure implements Action {
|
||||
readonly type = ActionType.MarkAllAsReadFailure;
|
||||
|
||||
constructor(public payload: RPCClientError) {}
|
||||
}
|
||||
|
||||
|
||||
export type Actions =
|
||||
| ReadAllByMember
|
||||
| ReadAllByMemberSuccess
|
||||
| ReadAllByMemberFailure
|
||||
| MarkAllAsRead
|
||||
| MarkAllAsReadSuccess
|
||||
| MarkAllAsReadFailure
|
||||
;
|
|
@ -1,15 +0,0 @@
|
|||
import { TestBed, inject } from '@angular/core/testing';
|
||||
|
||||
import { Effects } from './notification.effect';
|
||||
|
||||
describe('Notification.Effects', () => {
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({
|
||||
providers: [Effects]
|
||||
});
|
||||
});
|
||||
|
||||
it('should be created', inject([Effects], (effects: Effects) => {
|
||||
expect(effects).toBeTruthy();
|
||||
}));
|
||||
});
|
|
@ -1,63 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
import { Effect, Actions, ofType } from '@ngrx/effects';
|
||||
import { Action } from '@ngrx/store';
|
||||
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { of } from 'rxjs/observable/of';
|
||||
|
||||
import 'rxjs/add/operator/catch';
|
||||
import 'rxjs/add/operator/do';
|
||||
import 'rxjs/add/operator/exhaustMap';
|
||||
import 'rxjs/add/operator/map';
|
||||
import 'rxjs/add/operator/take';
|
||||
|
||||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
import { NotificationService } from '../../service/notification.service';
|
||||
|
||||
import {
|
||||
ReadAllByMember,
|
||||
ReadAllByMemberSuccess,
|
||||
ReadAllByMemberFailure,
|
||||
ActionType,
|
||||
MarkAllAsRead,
|
||||
MarkAllAsReadSuccess,
|
||||
MarkAllAsReadFailure,
|
||||
} from './notification.action';
|
||||
|
||||
@Injectable()
|
||||
export class Effects {
|
||||
|
||||
constructor(
|
||||
private actions$: Actions,
|
||||
private notificationService: NotificationService,
|
||||
private router: Router
|
||||
) { }
|
||||
|
||||
// @Effect()
|
||||
// readAllByMember$: Observable<Action> = this.actions$
|
||||
// .ofType(ActionType.ReadAllByMember)
|
||||
// .map((action: ReadAllByMember) => action.payload)
|
||||
// .switchMap(payload => this.notificationService.readAllByMember(payload.member, payload.pageParams))
|
||||
// .map(page => {
|
||||
// return new ReadAllByMemberSuccess(page);
|
||||
// })
|
||||
// .catch((error: RPCClientError) => {
|
||||
// return of(new ReadAllByMemberFailure(error));
|
||||
// });
|
||||
|
||||
// @Effect()
|
||||
// markAllAsRead$: Observable<Action> = this.actions$
|
||||
// .ofType(ActionType.MarkAllAsRead)
|
||||
// .map((action: MarkAllAsRead) => action.payload)
|
||||
// .switchMap(payload => this.notificationService.markAllAsRead(payload.member, payload.pageParams))
|
||||
// .map(page => {
|
||||
// return new MarkAllAsReadSuccess(page);
|
||||
// })
|
||||
// .catch((error: RPCClientError) => {
|
||||
// return of(new MarkAllAsReadFailure(error));
|
||||
// });
|
||||
}
|
|
@ -1,14 +0,0 @@
|
|||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
// import { Page } from 'app/commons/model';
|
||||
|
||||
export interface State {
|
||||
error: RPCClientError | null;
|
||||
pending: boolean;
|
||||
// page: Page;
|
||||
}
|
||||
|
||||
export const initialState: State = {
|
||||
error: null,
|
||||
pending: false,
|
||||
// page: null,
|
||||
};
|
|
@ -1,63 +0,0 @@
|
|||
import {
|
||||
Actions,
|
||||
ActionType,
|
||||
} from './notification.action';
|
||||
|
||||
import {
|
||||
State,
|
||||
initialState,
|
||||
} from './notification.state';
|
||||
|
||||
export function reducer(state = initialState, action: Actions): State {
|
||||
switch (action.type) {
|
||||
case ActionType.ReadAllByMember: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.ReadAllByMemberSuccess: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
page: action.payload,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.ReadAllByMemberFailure: {
|
||||
return {
|
||||
...state,
|
||||
error: action.payload,
|
||||
page: null,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.MarkAllAsRead: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.MarkAllAsReadSuccess: {
|
||||
return {
|
||||
...state,
|
||||
error: null,
|
||||
page: action.payload,
|
||||
};
|
||||
}
|
||||
|
||||
case ActionType.MarkAllAsReadFailure: {
|
||||
return {
|
||||
...state,
|
||||
error: action.payload,
|
||||
page: null,
|
||||
};
|
||||
}
|
||||
|
||||
default: {
|
||||
return state;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,13 +0,0 @@
|
|||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
|
||||
export interface State {
|
||||
error: RPCClientError | null;
|
||||
page: Page<Notification> | null;
|
||||
}
|
||||
|
||||
export const initialState: State = {
|
||||
error: null,
|
||||
page: null,
|
||||
};
|
|
@ -11,7 +11,7 @@
|
|||
|
||||
<div class="ui-g-6 nopad" dir="rtl" style="padding-top: 15px">
|
||||
<button class="ui-button-width-fit" *ngIf="!editMode" pButton type="button" label="Edit" (click)="editMode = true"></button>
|
||||
<button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Save" (click)="onEditSave()" [disabled]="displayNameErrMsg || descriptionErrMsg"></button>
|
||||
<button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Save" (click)="onEditSave()" [disabled]="displayNamedisplayNameErrMsg || descriptionErrMsg"></button>
|
||||
<button class="ui-button-width-fit" *ngIf="editMode" pButton type="button" label="Cancel" (click)="editMode = false"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -27,7 +27,7 @@ export class ProbeDetailComponent implements OnChanges {
|
|||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
if (changes['probeHost']) {
|
||||
if (changes['probeHost'].currentValue) {
|
||||
this.checkConnectStatus();
|
||||
}
|
||||
}
|
||||
|
@ -66,8 +66,8 @@ export class ProbeDetailComponent implements OnChanges {
|
|||
}
|
||||
|
||||
onEditSave() {
|
||||
this.probeHost.probe.displayName = this.displayName;
|
||||
this.probeHost.probe.description = this.description;
|
||||
this.probeHost.probe.displayName = this.displayName ? this.displayName : this.probeHost.probe.displayName;
|
||||
this.probeHost.probe.description = this.description ? this.description : this.probeHost.probe.description;
|
||||
this.modify.emit(this.probeHost);
|
||||
this.editMode = false;
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@ import { Observable } from 'rxjs';
|
|||
import { ProbeHost, Probe } from '@overflow/commons-typescript/model/probe';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import * as ProbeStore from '../store/entity/probe';
|
||||
import { ProbeSelector, ProbeDetailContainerSelector } from '../store';
|
||||
import { ProbeEntitySelector, ProbeDetailContainerSelector } from '../store';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
|
@ -23,11 +23,11 @@ export class ProbeDetailContainerComponent implements OnInit, OnChanges {
|
|||
private route: ActivatedRoute,
|
||||
) {
|
||||
this.pending$ = this.store.pipe(select(ProbeDetailContainerSelector.selectPending));
|
||||
this.error$ = this.store.pipe(select(ProbeSelector.selectError));
|
||||
this.error$ = this.store.pipe(select(ProbeEntitySelector.selectError));
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.probeHost$ = this.store.pipe(select(ProbeSelector.selectOne(this.probeHostID)));
|
||||
this.probeHost$ = this.store.pipe(select(ProbeEntitySelector.selectOne(this.probeHostID)));
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
|
|
|
@ -3,7 +3,7 @@ import { ProbeHost } from '@overflow/commons-typescript/model/probe';
|
|||
import { Observable } from 'rxjs';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import * as ProbeStore from '../store/entity/probe';
|
||||
import { ProbeSelector, ProbeListContainerSelector } from '../store';
|
||||
import { ProbeEntitySelector, ProbeListContainerSelector } from '../store';
|
||||
import { AuthSelector } from '@overflow/member/store';
|
||||
import { Domain } from '@overflow/commons-typescript/model/domain';
|
||||
|
||||
|
@ -18,7 +18,7 @@ export class ProbeListContainerComponent implements OnInit {
|
|||
@Output() select = new EventEmitter();
|
||||
|
||||
constructor(private store: Store<ProbeStore.State>) {
|
||||
this.probeHosts$ = store.pipe(select(ProbeSelector.selectAll));
|
||||
this.probeHosts$ = store.pipe(select(ProbeEntitySelector.selectAll));
|
||||
this.pending$ = store.pipe(select(ProbeListContainerSelector.selectPending));
|
||||
}
|
||||
|
||||
|
|
|
@ -30,7 +30,7 @@ export const EFFECTS = [
|
|||
|
||||
export const selectState = createFeatureSelector<State>(MODULE.name);
|
||||
|
||||
export const ProbeSelector = ProbeEntityStore.getSelectors(createSelector(
|
||||
export const ProbeEntitySelector = ProbeEntityStore.getSelectors(createSelector(
|
||||
selectState,
|
||||
(state: State) => state.probe
|
||||
));
|
||||
|
|
3636
package-lock.json
generated
3636
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
|
@ -1,15 +0,0 @@
|
|||
<div class="ui-g ui-g-nopad ui-app-noti" *ngIf="notifications">
|
||||
<h4>Notifications</h4>
|
||||
<li role="menuitem" *ngFor="let noti of notifications | slice:0:5; let i = index">
|
||||
<a href="javascript:void(0)" class="topbar-message" (click)="onNotiClick(noti)" [ngStyle]="noti.confirmDate ? '' : {'background-color': 'lightblue'}">
|
||||
<div class="ui-app-noti-date">{{noti.createDate | date: 'short'}}</div>
|
||||
<div class="ui-app-noti-title">{{noti.title}}</div>
|
||||
<div class="ui-app-noti-content">{{noti.message}}</div>
|
||||
</a>
|
||||
</li>
|
||||
<li role="menuitem">
|
||||
<a href="javascript:void(0)" class="topbar-message" (click)="onViewAllClick(noti)">
|
||||
<span>View All</span>
|
||||
</a>
|
||||
</li>
|
||||
</div>
|
|
@ -1,93 +0,0 @@
|
|||
import { Component, Injectable, OnInit, AfterContentInit, Output, EventEmitter, OnDestroy } from '@angular/core';
|
||||
import * as NotificationStore from '@overflow/notification/store/notification';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import { NotificationSelector } from '@overflow/notification/store';
|
||||
import { Page } from '@overflow/commons-typescript/model/commons/Page';
|
||||
import { PageParams } from '@overflow/commons-typescript/model/commons/PageParams';
|
||||
import { RPCClientError } from '@loafer/ng-rpc';
|
||||
import { AuthSelector } from '@overflow/member/store';
|
||||
import { Member } from '@overflow/commons-typescript/model/member';
|
||||
import { PagesComponent } from '../../../../pages/pages.component';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
import { Router } from '@angular/router';
|
||||
import { Subscription } from 'rxjs/Subscription';
|
||||
|
||||
@Component({
|
||||
selector: 'of-notification-menu',
|
||||
templateUrl: './app.notification.component.html'
|
||||
})
|
||||
|
||||
export class AppNotificationComponent implements OnInit, AfterContentInit, OnDestroy {
|
||||
|
||||
// notificationSubscription$: Subscription;
|
||||
// notification$ = this.listStore.pipe(select(NotificationSelector.select('page')));
|
||||
// notifications: Notification[];
|
||||
|
||||
@Output() notificationLoaded = new EventEmitter<number>();
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
private app: PagesComponent,
|
||||
private notificationStore: Store<NotificationStore.State>,
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// this.notificationSubscription$ = this.notification$.subscribe(
|
||||
// (page: Page) => {
|
||||
// if (page !== null && page !== undefined) {
|
||||
// this.notifications = page.content;
|
||||
// this.getUnconfirmedCount();
|
||||
// }
|
||||
// },
|
||||
// (error: RPCClientError) => {
|
||||
// console.log(error.response.message);
|
||||
// }
|
||||
// );
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
// this.listStore.select(AuthSelector.select('member')).subscribe(
|
||||
// (member: Member) => {
|
||||
// const pageParams: PageParams = {
|
||||
// pageNo: '0',
|
||||
// countPerPage: '10',
|
||||
// sortCol: 'id',
|
||||
// sortDirection: 'descending'
|
||||
// };
|
||||
// this.listStore.dispatch(new ListStore.ReadAllByMember({ member, pageParams }));
|
||||
// },
|
||||
// (error) => {
|
||||
// console.log(error);
|
||||
// }
|
||||
// );
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// if (this.notificationSubscription$) {
|
||||
// this.notificationSubscription$.unsubscribe();
|
||||
// }
|
||||
}
|
||||
|
||||
getUnconfirmedCount() {
|
||||
// if (this.notifications === null || this.notifications.length === 0) {
|
||||
// return;
|
||||
// }
|
||||
// let totalCnt = 0;
|
||||
// for (let i = 0; i < 5; i ++) {
|
||||
// if (!this.notifications[i].confirmDate) {
|
||||
// totalCnt += 1;
|
||||
// }
|
||||
// }
|
||||
// this.notificationLoaded.emit(totalCnt);
|
||||
}
|
||||
|
||||
onViewAllClick() {
|
||||
this.router.navigate(['notification']);
|
||||
}
|
||||
|
||||
onNotiClick(notification: Notification) {
|
||||
// this.detailStore.dispatch(new DetailStore.MarkAsRead(notification));
|
||||
// alert('Will redirect to ' + notification.url);
|
||||
}
|
||||
}
|
|
@ -135,13 +135,7 @@
|
|||
<span class="topbar-item-name">Notifications</span>
|
||||
</a>
|
||||
<ul class="ultima-menu animated fadeInDown">
|
||||
<!-- <of-notification-badge-container></of-notification-badge-container> -->
|
||||
<!-- <of-notification-menu (notificationLoaded)="onNotiLoaded($event)"></of-notification-menu> -->
|
||||
<!-- <li role="menuitem">
|
||||
<a href="#" class="topbar-message">
|
||||
<span>Give me a call</span>
|
||||
</a>
|
||||
</li> -->
|
||||
<of-notification-badge-container (select)="onNotificationSelect($event)" (viewAll)="onViewAllNotification($event)"></of-notification-badge-container>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- <li #notifications [ngClass]="{'active-top-menu':app.activeTopbarItem === notifications}">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { AppComponent } from '../../../../app.component';
|
||||
import { PagesComponent } from '../../../../pages/pages.component';
|
||||
import { AppNotificationComponent } from '../notification/app.notification.component';
|
||||
import { Notification } from '@overflow/commons-typescript/model/notification';
|
||||
|
||||
@Component({
|
||||
selector: 'of-topbar',
|
||||
|
@ -20,4 +20,12 @@ export class AppTopbarComponent implements OnInit {
|
|||
onNotiLoaded(count) {
|
||||
this.notificationCount = count;
|
||||
}
|
||||
|
||||
onViewAllNotification() {
|
||||
this.app.redirectNotifications();
|
||||
}
|
||||
|
||||
onNotificationSelect(notification: Notification) {
|
||||
this.app.redirect(notification.url);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -338,4 +338,12 @@ export class PagesComponent implements AfterViewInit, OnDestroy, OnInit {
|
|||
return outlet.isActivated ? outlet.activatedRoute : '';
|
||||
}
|
||||
|
||||
public redirectNotifications() {
|
||||
this.router.navigate(['notification']);
|
||||
}
|
||||
|
||||
public redirect(command: string) {
|
||||
this.router.navigate([command]);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -18,7 +18,6 @@ import { PagesRoutingModule } from './pages-routing.module';
|
|||
import { LocationStrategy, HashLocationStrategy } from '@angular/common';
|
||||
import { PrimeNGModules } from '@overflow/commons/prime-ng/prime-ng.module';
|
||||
import { TabbarModule } from '../commons/component/layout/tabbar/app.tabbar.module';
|
||||
import { AppNotificationComponent } from '../commons/component/layout/notification/app.notification.component';
|
||||
import { NotificationModule } from '@overflow/notification/notification.module';
|
||||
|
||||
@NgModule({
|
||||
|
@ -39,7 +38,6 @@ import { NotificationModule } from '@overflow/notification/notification.module';
|
|||
AppBreadcrumbComponent,
|
||||
AppRightpanelComponent,
|
||||
AppInlineProfileComponent,
|
||||
AppNotificationComponent
|
||||
],
|
||||
providers: [
|
||||
{ provide: LocationStrategy, useClass: HashLocationStrategy },
|
||||
|
|
Loading…
Reference in New Issue
Block a user