refactoring of state
This commit is contained in:
parent
50152c5907
commit
1f2687189a
|
@ -1 +1 @@
|
||||||
<ucap-organization-expansion-panel></ucap-organization-expansion-panel>
|
<ucap-organization-tree></ucap-organization-tree>
|
||||||
|
|
|
@ -3,6 +3,8 @@ import { CommonModule } from '@angular/common';
|
||||||
|
|
||||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||||
|
|
||||||
|
import { MatButtonModule } from '@angular/material/button';
|
||||||
|
|
||||||
import { UCapUiAccountModule } from '@ucap-webmessenger/ui-account';
|
import { UCapUiAccountModule } from '@ucap-webmessenger/ui-account';
|
||||||
|
|
||||||
import { AppAccountRoutingPageModule } from './account-routing.page.module';
|
import { AppAccountRoutingPageModule } from './account-routing.page.module';
|
||||||
|
@ -13,6 +15,7 @@ import { COMPONENTS } from './components';
|
||||||
imports: [
|
imports: [
|
||||||
CommonModule,
|
CommonModule,
|
||||||
FlexLayoutModule,
|
FlexLayoutModule,
|
||||||
|
MatButtonModule,
|
||||||
UCapUiAccountModule,
|
UCapUiAccountModule,
|
||||||
AppAccountRoutingPageModule
|
AppAccountRoutingPageModule
|
||||||
],
|
],
|
||||||
|
|
|
@ -1,6 +1,19 @@
|
||||||
<div class="login" fxLayout="column">
|
<div class="login" fxLayout="column">
|
||||||
<div class="login-wrapper" fxLayout="column" fxLayoutAlign="center center">
|
<div class="login-wrapper" fxLayout="column" fxLayoutAlign="center center">
|
||||||
<ucap-account-login [companyList]="companyList$ | async" (login)="onLogin($event)" (template)="onTemplate($event)">
|
<ucap-account-login
|
||||||
|
[companyList]="companyList$ | async"
|
||||||
|
(login)="onLogin($event)"
|
||||||
|
>
|
||||||
</ucap-account-login>
|
</ucap-account-login>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<button
|
||||||
|
mat-raised-button
|
||||||
|
color="accent"
|
||||||
|
class="submit-button"
|
||||||
|
aria-label="Template"
|
||||||
|
(click)="onClickTemplate()"
|
||||||
|
>
|
||||||
|
Template
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -52,7 +52,7 @@ export class LoginPageComponent implements OnInit {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
onTemplate() {
|
onClickTemplate() {
|
||||||
this.router.navigate(['/template']);
|
this.router.navigate(['/template']);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,11 +1,32 @@
|
||||||
<div>
|
<div fxLayout="column">
|
||||||
|
<button
|
||||||
|
mat-raised-button
|
||||||
|
color="accent"
|
||||||
|
class="submit-button"
|
||||||
|
aria-label="Login"
|
||||||
|
(click)="onClickLogin()"
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</button>
|
||||||
|
|
||||||
<h3>User-list-item</h3>
|
<h3>User-list-item</h3>
|
||||||
<div>
|
<div>
|
||||||
<ucap-profile-user-list-item [userInfo]="userInfo" [profileImageRoot]="profileImageRoot" [presence]='presence'>
|
<ucap-profile-user-list-item
|
||||||
|
[userInfo]="userInfo"
|
||||||
|
[profileImageRoot]="profileImageRoot"
|
||||||
|
[presence]="presence"
|
||||||
|
>
|
||||||
</ucap-profile-user-list-item>
|
</ucap-profile-user-list-item>
|
||||||
<ucap-profile-user-list-item [userInfo]="userInfo" [profileImageRoot]="profileImageRoot">
|
<ucap-profile-user-list-item
|
||||||
|
[userInfo]="userInfo"
|
||||||
|
[profileImageRoot]="profileImageRoot"
|
||||||
|
>
|
||||||
</ucap-profile-user-list-item>
|
</ucap-profile-user-list-item>
|
||||||
<ucap-profile-user-list-item [userInfo]="userInfo" [profileImageRoot]="profileImageRoot" [checkable]='true'>
|
<ucap-profile-user-list-item
|
||||||
|
[userInfo]="userInfo"
|
||||||
|
[profileImageRoot]="profileImageRoot"
|
||||||
|
[checkable]="true"
|
||||||
|
>
|
||||||
</ucap-profile-user-list-item>
|
</ucap-profile-user-list-item>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -8,6 +8,7 @@ import {
|
||||||
TerminalStatusNumber
|
TerminalStatusNumber
|
||||||
} from '@ucap-webmessenger/protocol-status';
|
} from '@ucap-webmessenger/protocol-status';
|
||||||
import { StatusCode } from '@ucap-webmessenger/core';
|
import { StatusCode } from '@ucap-webmessenger/core';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-template.page',
|
selector: 'app-template.page',
|
||||||
|
@ -21,9 +22,13 @@ export class TemplatePageComponent implements OnInit {
|
||||||
|
|
||||||
presence: StatusBulkInfo = status;
|
presence: StatusBulkInfo = status;
|
||||||
|
|
||||||
constructor() {}
|
constructor(private router: Router) {}
|
||||||
|
|
||||||
ngOnInit() {}
|
ngOnInit() {}
|
||||||
|
|
||||||
|
onClickLogin() {
|
||||||
|
this.router.navigate(['/account/login']);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const status: StatusBulkInfo = {
|
export const status: StatusBulkInfo = {
|
||||||
|
|
|
@ -3,6 +3,8 @@ import { CommonModule } from '@angular/common';
|
||||||
|
|
||||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||||
|
|
||||||
|
import { MatButtonModule } from '@angular/material/button';
|
||||||
|
|
||||||
import { UCapUiGroupModule } from '@ucap-webmessenger/ui-group';
|
import { UCapUiGroupModule } from '@ucap-webmessenger/ui-group';
|
||||||
|
|
||||||
import { AppTemplateRoutingPageModule } from './template-routing.page.module';
|
import { AppTemplateRoutingPageModule } from './template-routing.page.module';
|
||||||
|
@ -15,6 +17,7 @@ import { UcapUiProfileModule } from '@ucap-webmessenger/ui-profile';
|
||||||
...MET_MODULES,
|
...MET_MODULES,
|
||||||
CommonModule,
|
CommonModule,
|
||||||
FlexLayoutModule,
|
FlexLayoutModule,
|
||||||
|
MatButtonModule,
|
||||||
UCapUiGroupModule,
|
UCapUiGroupModule,
|
||||||
UcapUiProfileModule,
|
UcapUiProfileModule,
|
||||||
AppTemplateRoutingPageModule
|
AppTemplateRoutingPageModule
|
||||||
|
|
|
@ -25,7 +25,7 @@ import {
|
||||||
KEY_LOGIN_INFO,
|
KEY_LOGIN_INFO,
|
||||||
EnvironmentsInfo,
|
EnvironmentsInfo,
|
||||||
KEY_ENVIRONMENTS_INFO
|
KEY_ENVIRONMENTS_INFO
|
||||||
} from '../types';
|
} from '@app/types';
|
||||||
import { InnerProtocolService } from '@ucap-webmessenger/protocol-inner';
|
import { InnerProtocolService } from '@ucap-webmessenger/protocol-inner';
|
||||||
import {
|
import {
|
||||||
AuthenticationProtocolService,
|
AuthenticationProtocolService,
|
||||||
|
@ -40,8 +40,8 @@ import { OptionProtocolService } from '@ucap-webmessenger/protocol-option';
|
||||||
|
|
||||||
import * as AppStore from '@app/store';
|
import * as AppStore from '@app/store';
|
||||||
import * as VersionInfoStore from '@app/store/setting/version-info';
|
import * as VersionInfoStore from '@app/store/setting/version-info';
|
||||||
import * as OptionStore from '@app/store/setting/option';
|
import * as OptionStore from '@app/store/messenger/option';
|
||||||
import * as QueryStore from '@app/store/setting/query';
|
import * as QueryStore from '@app/store/messenger/query';
|
||||||
import * as SyncStore from '@app/store/messenger/sync';
|
import * as SyncStore from '@app/store/messenger/sync';
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
|
@ -124,7 +124,7 @@ export class AppMessengerResolver implements Resolve<void> {
|
||||||
);
|
);
|
||||||
this.store.dispatch(QueryStore.authSuccess({ res: authRes }));
|
this.store.dispatch(QueryStore.authSuccess({ res: authRes }));
|
||||||
|
|
||||||
this.store.dispatch(AuthenticationStore.postLogin({ loginRes }));
|
// this.store.dispatch(AuthenticationStore.postLogin({ loginRes }));
|
||||||
}),
|
}),
|
||||||
withLatestFrom(
|
withLatestFrom(
|
||||||
this.store.pipe(
|
this.store.pipe(
|
||||||
|
@ -146,6 +146,12 @@ export class AppMessengerResolver implements Resolve<void> {
|
||||||
localeCode: loginInfo.localeCode
|
localeCode: loginInfo.localeCode
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
this.store.dispatch(
|
||||||
|
QueryStore.dept({
|
||||||
|
divCd: 'ORG',
|
||||||
|
companyCode: loginInfo.companyCode
|
||||||
|
})
|
||||||
|
);
|
||||||
}),
|
}),
|
||||||
catchError(err => {
|
catchError(err => {
|
||||||
return throwError(err);
|
return throwError(err);
|
||||||
|
|
|
@ -2,17 +2,23 @@ import { Type } from '@angular/core';
|
||||||
import { Action, combineReducers, Selector, createSelector } from '@ngrx/store';
|
import { Action, combineReducers, Selector, createSelector } from '@ngrx/store';
|
||||||
|
|
||||||
import * as ChatStore from './chat';
|
import * as ChatStore from './chat';
|
||||||
|
import * as OptionStore from './option';
|
||||||
|
import * as QueryStore from './query';
|
||||||
import * as StatusStore from './status';
|
import * as StatusStore from './status';
|
||||||
import * as SyncStore from './sync';
|
import * as SyncStore from './sync';
|
||||||
|
|
||||||
export interface State {
|
export interface State {
|
||||||
chat: ChatStore.State;
|
chat: ChatStore.State;
|
||||||
|
option: OptionStore.State;
|
||||||
|
query: QueryStore.State;
|
||||||
status: StatusStore.State;
|
status: StatusStore.State;
|
||||||
sync: SyncStore.State;
|
sync: SyncStore.State;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const effects: Type<any>[] = [
|
export const effects: Type<any>[] = [
|
||||||
ChatStore.Effects,
|
ChatStore.Effects,
|
||||||
|
OptionStore.Effects,
|
||||||
|
QueryStore.Effects,
|
||||||
StatusStore.Effects,
|
StatusStore.Effects,
|
||||||
SyncStore.Effects
|
SyncStore.Effects
|
||||||
];
|
];
|
||||||
|
@ -20,6 +26,8 @@ export const effects: Type<any>[] = [
|
||||||
export function reducers(state: State | undefined, action: Action) {
|
export function reducers(state: State | undefined, action: Action) {
|
||||||
return combineReducers({
|
return combineReducers({
|
||||||
chat: ChatStore.reducer,
|
chat: ChatStore.reducer,
|
||||||
|
option: OptionStore.reducer,
|
||||||
|
query: QueryStore.reducer,
|
||||||
status: StatusStore.reducer,
|
status: StatusStore.reducer,
|
||||||
sync: SyncStore.reducer
|
sync: SyncStore.reducer
|
||||||
})(state, action);
|
})(state, action);
|
||||||
|
@ -33,6 +41,18 @@ export function selectors<S>(selector: Selector<any, State>) {
|
||||||
(state: State) => state.chat
|
(state: State) => state.chat
|
||||||
)
|
)
|
||||||
),
|
),
|
||||||
|
OptionSelector: OptionStore.selectors(
|
||||||
|
createSelector(
|
||||||
|
selector,
|
||||||
|
(state: State) => state.option
|
||||||
|
)
|
||||||
|
),
|
||||||
|
QuerySelector: QueryStore.selectors(
|
||||||
|
createSelector(
|
||||||
|
selector,
|
||||||
|
(state: State) => state.query
|
||||||
|
)
|
||||||
|
),
|
||||||
StatusSelector: StatusStore.selectors(
|
StatusSelector: StatusStore.selectors(
|
||||||
createSelector(
|
createSelector(
|
||||||
selector,
|
selector,
|
||||||
|
|
|
@ -8,31 +8,31 @@ import {
|
||||||
} from '@ucap-webmessenger/protocol-option';
|
} from '@ucap-webmessenger/protocol-option';
|
||||||
|
|
||||||
export const regView = createAction(
|
export const regView = createAction(
|
||||||
'[Setting::Option] RegView',
|
'[Messenger::Option] RegView',
|
||||||
props<RegViewRequest>()
|
props<RegViewRequest>()
|
||||||
);
|
);
|
||||||
|
|
||||||
export const regViewSuccess = createAction(
|
export const regViewSuccess = createAction(
|
||||||
'[Setting::Option] RegView Success',
|
'[Messenger::Option] RegView Success',
|
||||||
props<{ res: RegViewResponse }>()
|
props<{ res: RegViewResponse }>()
|
||||||
);
|
);
|
||||||
|
|
||||||
export const regViewFailure = createAction(
|
export const regViewFailure = createAction(
|
||||||
'[Setting::Option] RegView Failure',
|
'[Messenger::Option] RegView Failure',
|
||||||
props<{ error: any }>()
|
props<{ error: any }>()
|
||||||
);
|
);
|
||||||
|
|
||||||
export const regUpdate = createAction(
|
export const regUpdate = createAction(
|
||||||
'[Setting::Option] RegUpdate',
|
'[Messenger::Option] RegUpdate',
|
||||||
props<RegUpdateRequest>()
|
props<RegUpdateRequest>()
|
||||||
);
|
);
|
||||||
|
|
||||||
export const regUpdateSuccess = createAction(
|
export const regUpdateSuccess = createAction(
|
||||||
'[Setting::Option] RegUpdate Success',
|
'[Messenger::Option] RegUpdate Success',
|
||||||
props<{ res: RegUpdateResponse }>()
|
props<{ res: RegUpdateResponse }>()
|
||||||
);
|
);
|
||||||
|
|
||||||
export const regUpdateFailure = createAction(
|
export const regUpdateFailure = createAction(
|
||||||
'[Setting::Option] RegUpdate Failure',
|
'[Messenger::Option] RegUpdate Failure',
|
||||||
props<{ error: any }>()
|
props<{ error: any }>()
|
||||||
);
|
);
|
|
@ -6,24 +6,12 @@ import { of } from 'rxjs';
|
||||||
import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
|
import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
|
||||||
|
|
||||||
import { regViewSuccess, regViewFailure } from './actions';
|
import { regViewSuccess, regViewFailure } from './actions';
|
||||||
import { initSettings } from '../init';
|
|
||||||
import { OptionProtocolService } from '@ucap-webmessenger/protocol-option';
|
import { OptionProtocolService } from '@ucap-webmessenger/protocol-option';
|
||||||
import { loginSuccess } from '@app/store/account/authentication';
|
import { loginSuccess } from '@app/store/account/authentication';
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class Effects {
|
export class Effects {
|
||||||
// initSettings$ = createEffect(() =>
|
|
||||||
// this.actions$.pipe(
|
|
||||||
// ofType(loginSuccess),
|
|
||||||
// exhaustMap(() =>
|
|
||||||
// this.optionProtocolService.regView({}).pipe(
|
|
||||||
// map(res => regViewSuccess({ res })),
|
|
||||||
// catchError(error => of(regViewFailure({ error })))
|
|
||||||
// )
|
|
||||||
// )
|
|
||||||
// )
|
|
||||||
// );
|
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private actions$: Actions,
|
private actions$: Actions,
|
||||||
private optionProtocolService: OptionProtocolService
|
private optionProtocolService: OptionProtocolService
|
|
@ -1,7 +1,6 @@
|
||||||
import { Selector, createSelector } from '@ngrx/store';
|
import { Selector, createSelector } from '@ngrx/store';
|
||||||
import { RegViewResponse } from '@ucap-webmessenger/protocol-option';
|
import { RegViewResponse } from '@ucap-webmessenger/protocol-option';
|
||||||
|
|
||||||
// tslint:disable-next-line: no-empty-interface
|
|
||||||
export interface State {
|
export interface State {
|
||||||
reg?: RegViewResponse;
|
reg?: RegViewResponse;
|
||||||
}
|
}
|
|
@ -0,0 +1,38 @@
|
||||||
|
import { createAction, props } from '@ngrx/store';
|
||||||
|
|
||||||
|
import {
|
||||||
|
AuthRequest,
|
||||||
|
AuthResponse,
|
||||||
|
DeptRequest,
|
||||||
|
DeptInfo
|
||||||
|
} from '@ucap-webmessenger/protocol-query';
|
||||||
|
|
||||||
|
export const auth = createAction(
|
||||||
|
'[Messenger::Query] Auth',
|
||||||
|
props<AuthRequest>()
|
||||||
|
);
|
||||||
|
|
||||||
|
export const authSuccess = createAction(
|
||||||
|
'[Messenger::Query] Auth Success',
|
||||||
|
props<{ res: AuthResponse }>()
|
||||||
|
);
|
||||||
|
|
||||||
|
export const authFailure = createAction(
|
||||||
|
'[Messenger::Query] Auth Failure',
|
||||||
|
props<{ error: any }>()
|
||||||
|
);
|
||||||
|
|
||||||
|
export const dept = createAction(
|
||||||
|
'[Messenger::Query] Dept',
|
||||||
|
props<DeptRequest>()
|
||||||
|
);
|
||||||
|
|
||||||
|
export const deptSuccess = createAction(
|
||||||
|
'[Messenger::Query] Dept Success',
|
||||||
|
props<{ departmentInfoList: DeptInfo[] }>()
|
||||||
|
);
|
||||||
|
|
||||||
|
export const deptFailure = createAction(
|
||||||
|
'[Messenger::Query] Dept Failure',
|
||||||
|
props<{ error: any }>()
|
||||||
|
);
|
|
@ -0,0 +1,62 @@
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
|
||||||
|
import { Actions, ofType, createEffect } from '@ngrx/effects';
|
||||||
|
|
||||||
|
import { of } from 'rxjs';
|
||||||
|
import { catchError, map, tap, switchMap } from 'rxjs/operators';
|
||||||
|
|
||||||
|
import { dept, deptSuccess, deptFailure } from './actions';
|
||||||
|
|
||||||
|
import {
|
||||||
|
QueryProtocolService,
|
||||||
|
DeptInfo,
|
||||||
|
SSVC_TYPE_QUERY_DEPT_DATA,
|
||||||
|
SSVC_TYPE_QUERY_DEPT_RES,
|
||||||
|
DeptData
|
||||||
|
} from '@ucap-webmessenger/protocol-query';
|
||||||
|
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
|
||||||
|
|
||||||
|
import { Store } from '@ngrx/store';
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class Effects {
|
||||||
|
dept$ = createEffect(
|
||||||
|
() => {
|
||||||
|
let departmentInfoList: DeptInfo[];
|
||||||
|
|
||||||
|
return this.actions$.pipe(
|
||||||
|
ofType(dept),
|
||||||
|
tap(() => {
|
||||||
|
departmentInfoList = [];
|
||||||
|
}),
|
||||||
|
switchMap(req => {
|
||||||
|
return this.queryProtocolService.dept(req).pipe(
|
||||||
|
map(res => {
|
||||||
|
switch (res.Type) {
|
||||||
|
case SSVC_TYPE_QUERY_DEPT_DATA:
|
||||||
|
departmentInfoList.push(...(res as DeptData).departmentInfos);
|
||||||
|
break;
|
||||||
|
case SSVC_TYPE_QUERY_DEPT_RES:
|
||||||
|
this.store.dispatch(
|
||||||
|
deptSuccess({
|
||||||
|
departmentInfoList
|
||||||
|
})
|
||||||
|
);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
catchError(error => of(deptFailure({ error })))
|
||||||
|
);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
},
|
||||||
|
{ dispatch: false }
|
||||||
|
);
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private actions$: Actions,
|
||||||
|
private store: Store<any>,
|
||||||
|
private sessionStorageService: SessionStorageService,
|
||||||
|
private queryProtocolService: QueryProtocolService
|
||||||
|
) {}
|
||||||
|
}
|
|
@ -1,6 +1,6 @@
|
||||||
import { createReducer, on } from '@ngrx/store';
|
import { createReducer, on } from '@ngrx/store';
|
||||||
import { initialState } from './state';
|
import { initialState } from './state';
|
||||||
import { authSuccess } from './actions';
|
import { authSuccess, deptSuccess } from './actions';
|
||||||
|
|
||||||
export const reducer = createReducer(
|
export const reducer = createReducer(
|
||||||
initialState,
|
initialState,
|
||||||
|
@ -9,5 +9,12 @@ export const reducer = createReducer(
|
||||||
...state,
|
...state,
|
||||||
auth: action.res
|
auth: action.res
|
||||||
};
|
};
|
||||||
|
}),
|
||||||
|
|
||||||
|
on(deptSuccess, (state, action) => {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
departmentInfoList: action.departmentInfoList
|
||||||
|
};
|
||||||
})
|
})
|
||||||
);
|
);
|
|
@ -1,12 +1,15 @@
|
||||||
import { Selector, createSelector } from '@ngrx/store';
|
import { Selector, createSelector } from '@ngrx/store';
|
||||||
import { AuthResponse } from '@ucap-webmessenger/protocol-query';
|
import { AuthResponse, DeptInfo } from '@ucap-webmessenger/protocol-query';
|
||||||
|
|
||||||
export interface State {
|
export interface State {
|
||||||
auth?: AuthResponse;
|
auth?: AuthResponse;
|
||||||
|
|
||||||
|
departmentInfoList: DeptInfo[] | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const initialState: State = {
|
export const initialState: State = {
|
||||||
auth: null
|
auth: null,
|
||||||
|
departmentInfoList: null
|
||||||
};
|
};
|
||||||
|
|
||||||
export function selectors<S>(selector: Selector<any, State>) {
|
export function selectors<S>(selector: Selector<any, State>) {
|
||||||
|
@ -14,6 +17,10 @@ export function selectors<S>(selector: Selector<any, State>) {
|
||||||
auth: createSelector(
|
auth: createSelector(
|
||||||
selector,
|
selector,
|
||||||
(state: State) => state.auth
|
(state: State) => state.auth
|
||||||
|
),
|
||||||
|
departmentInfoList: createSelector(
|
||||||
|
selector,
|
||||||
|
(state: State) => state.departmentInfoList
|
||||||
)
|
)
|
||||||
};
|
};
|
||||||
}
|
}
|
|
@ -49,7 +49,7 @@ import {
|
||||||
RoomUserDetailData,
|
RoomUserDetailData,
|
||||||
RoomResponse
|
RoomResponse
|
||||||
} from '@ucap-webmessenger/protocol-sync';
|
} from '@ucap-webmessenger/protocol-sync';
|
||||||
import { regViewSuccess } from '@app/store/setting/option';
|
import { regViewSuccess } from '@app/store/messenger/option';
|
||||||
import {
|
import {
|
||||||
RoomInfo,
|
RoomInfo,
|
||||||
UserInfoShort,
|
UserInfoShort,
|
||||||
|
|
|
@ -3,23 +3,17 @@ import { Action, combineReducers, Selector, createSelector } from '@ngrx/store';
|
||||||
|
|
||||||
import * as CompanyStore from './company';
|
import * as CompanyStore from './company';
|
||||||
import * as InitStore from './init';
|
import * as InitStore from './init';
|
||||||
import * as OptionStore from './option';
|
|
||||||
import * as QueryStore from './query';
|
|
||||||
import * as VersionInfoStore from './version-info';
|
import * as VersionInfoStore from './version-info';
|
||||||
|
|
||||||
export interface State {
|
export interface State {
|
||||||
company: CompanyStore.State;
|
company: CompanyStore.State;
|
||||||
init: InitStore.State;
|
init: InitStore.State;
|
||||||
option: OptionStore.State;
|
|
||||||
query: QueryStore.State;
|
|
||||||
versionInfo: VersionInfoStore.State;
|
versionInfo: VersionInfoStore.State;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const effects: Type<any>[] = [
|
export const effects: Type<any>[] = [
|
||||||
CompanyStore.Effects,
|
CompanyStore.Effects,
|
||||||
InitStore.Effects,
|
InitStore.Effects,
|
||||||
OptionStore.Effects,
|
|
||||||
QueryStore.Effects,
|
|
||||||
VersionInfoStore.Effects
|
VersionInfoStore.Effects
|
||||||
];
|
];
|
||||||
|
|
||||||
|
@ -27,8 +21,6 @@ export function reducers(state: State | undefined, action: Action) {
|
||||||
return combineReducers({
|
return combineReducers({
|
||||||
company: CompanyStore.reducer,
|
company: CompanyStore.reducer,
|
||||||
init: InitStore.reducer,
|
init: InitStore.reducer,
|
||||||
option: OptionStore.reducer,
|
|
||||||
query: QueryStore.reducer,
|
|
||||||
versionInfo: VersionInfoStore.reducer
|
versionInfo: VersionInfoStore.reducer
|
||||||
})(state, action);
|
})(state, action);
|
||||||
}
|
}
|
||||||
|
@ -47,18 +39,6 @@ export function selectors<S>(selector: Selector<any, State>) {
|
||||||
(state: State) => state.init
|
(state: State) => state.init
|
||||||
)
|
)
|
||||||
),
|
),
|
||||||
OptionSelector: OptionStore.selectors(
|
|
||||||
createSelector(
|
|
||||||
selector,
|
|
||||||
(state: State) => state.option
|
|
||||||
)
|
|
||||||
),
|
|
||||||
QuerySelector: QueryStore.selectors(
|
|
||||||
createSelector(
|
|
||||||
selector,
|
|
||||||
(state: State) => state.query
|
|
||||||
)
|
|
||||||
),
|
|
||||||
VersionInfoSelector: VersionInfoStore.selectors(
|
VersionInfoSelector: VersionInfoStore.selectors(
|
||||||
createSelector(
|
createSelector(
|
||||||
selector,
|
selector,
|
||||||
|
|
|
@ -1,15 +0,0 @@
|
||||||
import { createAction, props } from '@ngrx/store';
|
|
||||||
|
|
||||||
import { AuthRequest, AuthResponse } from '@ucap-webmessenger/protocol-query';
|
|
||||||
|
|
||||||
export const auth = createAction('[Setting::Query] Auth', props<AuthRequest>());
|
|
||||||
|
|
||||||
export const authSuccess = createAction(
|
|
||||||
'[Setting::Query] Auth Success',
|
|
||||||
props<{ res: AuthResponse }>()
|
|
||||||
);
|
|
||||||
|
|
||||||
export const authFailure = createAction(
|
|
||||||
'[Setting::Query] Auth Failure',
|
|
||||||
props<{ error: any }>()
|
|
||||||
);
|
|
|
@ -1,55 +0,0 @@
|
||||||
import { Injectable } from '@angular/core';
|
|
||||||
|
|
||||||
import { Actions, ofType, createEffect } from '@ngrx/effects';
|
|
||||||
|
|
||||||
import { of } from 'rxjs';
|
|
||||||
import { catchError, exhaustMap, map, tap } from 'rxjs/operators';
|
|
||||||
|
|
||||||
import { authSuccess, authFailure } from './actions';
|
|
||||||
import { initSettings } from '../init';
|
|
||||||
|
|
||||||
import {
|
|
||||||
QueryProtocolService,
|
|
||||||
AuthRequest
|
|
||||||
} from '@ucap-webmessenger/protocol-query';
|
|
||||||
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
|
|
||||||
import {
|
|
||||||
LoginInfo,
|
|
||||||
KEY_LOGIN_INFO,
|
|
||||||
EnvironmentsInfo,
|
|
||||||
KEY_ENVIRONMENTS_INFO
|
|
||||||
} from '@app/types';
|
|
||||||
import { loginSuccess } from '@app/store/account/authentication';
|
|
||||||
|
|
||||||
@Injectable()
|
|
||||||
export class Effects {
|
|
||||||
// initSettings$ = createEffect(() =>
|
|
||||||
// this.actions$.pipe(
|
|
||||||
// ofType(loginSuccess),
|
|
||||||
// map(() => {
|
|
||||||
// const loginInfo = this.sessionStorageService.get<LoginInfo>(
|
|
||||||
// KEY_LOGIN_INFO
|
|
||||||
// );
|
|
||||||
// const environmentsInfo = this.sessionStorageService.get<
|
|
||||||
// EnvironmentsInfo
|
|
||||||
// >(KEY_ENVIRONMENTS_INFO);
|
|
||||||
|
|
||||||
// return {
|
|
||||||
// deviceType: environmentsInfo.deviceType
|
|
||||||
// } as AuthRequest;
|
|
||||||
// }),
|
|
||||||
// exhaustMap(req =>
|
|
||||||
// this.queryProtocolService.auth(req).pipe(
|
|
||||||
// map(res => authSuccess({ res })),
|
|
||||||
// catchError(error => of(authFailure({ error })))
|
|
||||||
// )
|
|
||||||
// )
|
|
||||||
// )
|
|
||||||
// );
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private actions$: Actions,
|
|
||||||
private sessionStorageService: SessionStorageService,
|
|
||||||
private queryProtocolService: QueryProtocolService
|
|
||||||
) {}
|
|
||||||
}
|
|
|
@ -5,7 +5,10 @@
|
||||||
<mat-form-field appearance="outline">
|
<mat-form-field appearance="outline">
|
||||||
<mat-label>Company</mat-label>
|
<mat-label>Company</mat-label>
|
||||||
<mat-select formControlName="companyCode" required>
|
<mat-select formControlName="companyCode" required>
|
||||||
<mat-option *ngFor="let company of companyList" [value]="company.companyCode">{{ company.companyName }}
|
<mat-option
|
||||||
|
*ngFor="let company of companyList"
|
||||||
|
[value]="company.companyCode"
|
||||||
|
>{{ company.companyName }}
|
||||||
</mat-option>
|
</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
<mat-error *ngIf="loginForm.get('companyCode').hasError('required')">
|
<mat-error *ngIf="loginForm.get('companyCode').hasError('required')">
|
||||||
|
@ -32,7 +35,12 @@
|
||||||
</mat-error>
|
</mat-error>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<div class="remember-forgot-password" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="space-between center">
|
<div
|
||||||
|
class="remember-forgot-password"
|
||||||
|
fxLayout="row"
|
||||||
|
fxLayout.xs="column"
|
||||||
|
fxLayoutAlign="space-between center"
|
||||||
|
>
|
||||||
<mat-checkbox class="remember-me" aria-label="Remember Me">
|
<mat-checkbox class="remember-me" aria-label="Remember Me">
|
||||||
Remember Me
|
Remember Me
|
||||||
</mat-checkbox>
|
</mat-checkbox>
|
||||||
|
@ -42,8 +50,14 @@
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button mat-raised-button color="accent" class="submit-button" aria-label="LOG IN" [disabled]="loginForm.invalid"
|
<button
|
||||||
(click)="onClickLogin()">
|
mat-raised-button
|
||||||
|
color="accent"
|
||||||
|
class="submit-button"
|
||||||
|
aria-label="LOG IN"
|
||||||
|
[disabled]="loginForm.invalid"
|
||||||
|
(click)="onClickLogin()"
|
||||||
|
>
|
||||||
LOGIN
|
LOGIN
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
|
@ -52,9 +66,4 @@
|
||||||
<span class="text">Don't have an account?</span>
|
<span class="text">Don't have an account?</span>
|
||||||
<a class="link">Create an account</a>
|
<a class="link">Create an account</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<button mat-raised-button color="accent" class="submit-button" aria-label="Template" (click)="onClickTemplate()">
|
|
||||||
Template
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -27,8 +27,6 @@ export class LoginComponent implements OnInit {
|
||||||
rememberMe: boolean;
|
rememberMe: boolean;
|
||||||
notValid: () => void;
|
notValid: () => void;
|
||||||
}>();
|
}>();
|
||||||
@Output()
|
|
||||||
template = new EventEmitter();
|
|
||||||
|
|
||||||
@ViewChild('loginPw', { static: true }) loginPwElementRef: ElementRef;
|
@ViewChild('loginPw', { static: true }) loginPwElementRef: ElementRef;
|
||||||
|
|
||||||
|
@ -55,8 +53,4 @@ export class LoginComponent implements OnInit {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
onClickTemplate() {
|
|
||||||
this.template.emit();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +0,0 @@
|
||||||
import { Component, OnInit, Input } from '@angular/core';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'ucap-organization-expansion-panel',
|
|
||||||
templateUrl: './expansion-panel.component.html',
|
|
||||||
styleUrls: ['./expansion-panel.component.scss']
|
|
||||||
})
|
|
||||||
export class ExpansionPanelComponent implements OnInit {
|
|
||||||
@Input()
|
|
||||||
organizationList: any[];
|
|
||||||
|
|
||||||
constructor() {}
|
|
||||||
|
|
||||||
ngOnInit() {}
|
|
||||||
}
|
|
|
@ -1,19 +1,19 @@
|
||||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
import { ExpansionPanelComponent } from './expansion-panel.component';
|
import { TreeComponent } from './tree.component';
|
||||||
|
|
||||||
describe('Organization::ExpansionPanelComponent', () => {
|
describe('Organization::TreeComponent', () => {
|
||||||
let component: ExpansionPanelComponent;
|
let component: TreeComponent;
|
||||||
let fixture: ComponentFixture<ExpansionPanelComponent>;
|
let fixture: ComponentFixture<TreeComponent>;
|
||||||
|
|
||||||
beforeEach(async(() => {
|
beforeEach(async(() => {
|
||||||
TestBed.configureTestingModule({
|
TestBed.configureTestingModule({
|
||||||
declarations: [ExpansionPanelComponent]
|
declarations: [TreeComponent]
|
||||||
}).compileComponents();
|
}).compileComponents();
|
||||||
}));
|
}));
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
fixture = TestBed.createComponent(ExpansionPanelComponent);
|
fixture = TestBed.createComponent(TreeComponent);
|
||||||
component = fixture.componentInstance;
|
component = fixture.componentInstance;
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
});
|
});
|
|
@ -0,0 +1,15 @@
|
||||||
|
import { Component, OnInit, Input } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'ucap-organization-tree',
|
||||||
|
templateUrl: './tree.component.html',
|
||||||
|
styleUrls: ['./tree.component.scss']
|
||||||
|
})
|
||||||
|
export class TreeComponent implements OnInit {
|
||||||
|
@Input()
|
||||||
|
organizationList: any[];
|
||||||
|
|
||||||
|
constructor() {}
|
||||||
|
|
||||||
|
ngOnInit() {}
|
||||||
|
}
|
|
@ -4,9 +4,9 @@ import { ReactiveFormsModule } from '@angular/forms';
|
||||||
|
|
||||||
import { MatExpansionModule } from '@angular/material/expansion';
|
import { MatExpansionModule } from '@angular/material/expansion';
|
||||||
|
|
||||||
import { ExpansionPanelComponent } from './components/expansion-panel.component';
|
import { TreeComponent } from './components/tree.component';
|
||||||
|
|
||||||
const COMPONENTS = [ExpansionPanelComponent];
|
const COMPONENTS = [TreeComponent];
|
||||||
const SERVICES = [];
|
const SERVICES = [];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
/*
|
/*
|
||||||
* Public API Surface of ucap-webmessenger-ui-organization
|
* Public API Surface of ucap-webmessenger-ui-organization
|
||||||
*/
|
*/
|
||||||
export * from './lib/components/expansion-panel.component';
|
export * from './lib/components/tree.component';
|
||||||
|
|
||||||
export * from './lib/ucap-ui-organization.module';
|
export * from './lib/ucap-ui-organization.module';
|
||||||
|
|
Loading…
Reference in New Issue
Block a user