member modify

src/environments/environment.ts

@@ -7,7 +7,7 @@ export const environment = {
   production: false,
   restBaseURL: 'http://192.168.1.50:19080/webapp',
   webappRPCConfig: {
-    url: 'ws://192.168.1.50:19090/webapp',
+    url: 'ws://192.168.1.103:19090/webapp',
     reconnectInterval: 5000,
     reconnectRetry: 10,
   },

src/packages/infra/component/map/map.component.html

@@ -82,6 +82,18 @@
 </p-dialog>
 
 
+<p-dialog header="Rename Probe" [(visible)]="renameProbeVisible" [modal]="true" [responsive]="true" [width]="350" [minWidth]="200"
+  [minY]="70">
+  <span class="md-inputfield">
+    <input #probeAlias type="text" pInputText placeholder="aaaa">
+  </span>
+  <p-footer>
+    <button type="button" pButton icon="fa-check" (click)="onSaveProbeName(probeAlias.value)" label="Save"></button>
+    <button type="button" pButton icon="fa-close" (click)="renameProbeVisible=false" label="Cancel"></button>
+  </p-footer>
+</p-dialog>
+
+
 
 
 

src/packages/infra/component/map/map.component.ts

@@ -41,15 +41,12 @@ export class MapComponent implements OnInit, AfterContentInit {
 
   infras$ = this.listStore.pipe(select(ListSelector.select('page')));
   sensors$ = this.sensorListStore.pipe(select(sensorListSelector.select('page')));
-
   display = false;
   loading = false;
-
+  renameProbeVisible = false;
   totalList: Infra[];
   hostDataList: HostData[] = new Array();
-
   sensorMap: Map<number, Array<Sensor>> = new Map();
-
   targetTreeMap: Map<number, TreeNode> = new Map();
 
   DEFAULT_EXPANDED: Boolean = true;
@@ -66,7 +63,6 @@ export class MapComponent implements OnInit, AfterContentInit {
 
   visibleSidebar = false;
   selectedNode: TreeNode = null;
-  targetNodeForView: Object = null;
 
   sensorSettingDisplay = false;
   target: Target = null;
@@ -473,6 +469,8 @@ export class MapComponent implements OnInit, AfterContentInit {
   }
 
   editProbeAlias() {
+    console.log(this.selectedNode);
+    this.renameProbeVisible = true;
   }
 
   editSensor() {
@@ -494,6 +492,10 @@ export class MapComponent implements OnInit, AfterContentInit {
     this.target = null;
     this.sensorSettingDisplay = false;
   }
+
+  onSaveProbeName(value) {
+    console.log(value);
+  }
 }
 
 const testInfraList = [

src/packages/member/component/profile/profile.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { PagesComponent } from 'app/pages/pages.component';
 
@@ -7,8 +7,11 @@ import * as ModifyStore from '../../store/modify';
 
 import { Member } from '../../model';
 import { AuthSelector } from '../../store';
-import { Store } from '@ngrx/store';
+import { Store, select } from '@ngrx/store';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ModifySelector } from '../../store';
+import { Subscription } from 'rxjs/Subscription';
+import { RPCClientError } from '@loafer/ng-rpc/protocol';
 
 
 @Component({
@@ -16,17 +19,20 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
   templateUrl: './profile.component.html',
   styleUrls: ['./profile.component.scss']
 })
-export class ProfileComponent implements OnInit {
+export class ProfileComponent implements OnInit, OnDestroy {
 
   member: Member;
   modifyForm: FormGroup;
 
+  modifiedMember$ = this.modifyStore.pipe(select(ModifySelector.select('member')));
+
   constructor(
     public app: PagesComponent,
     private activatedRoute: ActivatedRoute,
     private router: Router,
     private store: Store<AuthStore.State>,
     private formBuilder: FormBuilder,
+    private modifyStore: Store<ModifyStore.State>
   ) {
   }
 
@@ -43,6 +49,9 @@ export class ProfileComponent implements OnInit {
     this.initForm();
   }
 
+  ngOnDestroy() {
+  }
+
   initForm() {
     this.modifyForm = this.formBuilder.group({
       'email': [this.member.email,
@@ -64,8 +73,22 @@ export class ProfileComponent implements OnInit {
       phone: modifyValue.phone,
       companyName: modifyValue.companyName,
     };
-    this.store.dispatch(new ModifyStore.Modify({member}));
-    console.log(member);
+    this.modifyStore.dispatch(new ModifyStore.Modify({ member }));
+
+    const modifiedMemberSubscription$ = this.modifiedMember$.subscribe(
+      (m: Member) => {
+        if (m) {
+          console.log(m);
+        }
+
+        if (modifiedMemberSubscription$) {
+          modifiedMemberSubscription$.unsubscribe();
+        }
+      },
+      (error: RPCClientError) => {
+        console.log(error.response.message);
+      }
+    );
   }
 
 }

src/packages/member/store/index.ts

@@ -32,6 +32,7 @@ export const EFFECTS = [
   AuthStore.Effects,
   SignupStore.Effects,
   TotpStore.Effects,
+  ModifyStore.Effects
 ];
 
 export const selectMemberState = createFeatureSelector<State>(MODULE.name);
@@ -50,3 +51,8 @@ export const TotpSelector = new StateSelector<TotpStore.State>(createSelector(
   selectMemberState,
   (state: State) => state.totp
 ));
+
+export const ModifySelector = new StateSelector<ModifyStore.State>(createSelector(
+  selectMemberState,
+  (state: State) => state.modify
+));

src/packages/member/store/modify/modify.action.ts

@@ -13,7 +13,7 @@ export enum ActionType {
 export class Modify implements Action {
   readonly type = ActionType.Modify;
 
-  constructor(public payload: {member: Member }) {}
+  constructor(public payload: Member ) {}
 }
 
 export class ModifySuccess implements Action {

src/packages/target/component/detail/detail.component.ts

@@ -10,8 +10,9 @@ import { RPCClientError } from '@loafer/ng-rpc/protocol';
 import { sensorListSelector } from 'packages/sensor/store';
 import * as SensorListStore from 'packages/sensor/store/list';
 import { PageParams, Page } from 'app/commons/model';
-// import { target } from 'packages/target/store';
-// import * as SensorListStore from 'packages/sensor/store/list';
+import { ModifySelector } from 'packages/target/store';
+import * as TargetModifyStore from 'packages/target/store/modify';
+import { Target } from '../../model';
 
 
 @Component({
@@ -24,8 +25,7 @@ export class DetailComponent implements OnInit, AfterContentInit, OnDestroy {
   infra$ = this.infraDetailStore.pipe(select(InfraDetailSelector.select('infra')));
   sensorsSubscription$: Subscription;
   sensors$ = this.sensorListStore.pipe(select(sensorListSelector.select('page')));
-
-  targetSubscription$: Subscription;
+  target$ = this.targetModifyStore.pipe(select(ModifySelector.select('target')));
 
   infraId = null;
   infra: Infra;
@@ -41,7 +41,8 @@ export class DetailComponent implements OnInit, AfterContentInit, OnDestroy {
     private router: Router,
     private route: ActivatedRoute,
     private infraDetailStore: Store<InfraDetailStore.State>,
-    private sensorListStore: Store<SensorListStore.State>
+    private sensorListStore: Store<SensorListStore.State>,
+    private targetModifyStore: Store<TargetModifyStore.State>
   ) { }
 
   ngOnInit() {
@@ -122,29 +123,27 @@ export class DetailComponent implements OnInit, AfterContentInit, OnDestroy {
 
 
   onDisplayNameChange(value: string) {
-    console.log(value);
-    // if (value === this.probe.displayName) {
-    //   return;
-    // }
-    // this.probe.displayName = value;
-    // this.modifyStore.dispatch(
-    //   new ModifyStore.Modify(this.probe)
-    // );
+    if (value === this.infra.target.displayName) {
+      return;
+    }
+    const target = this.infra.target;
+    target.displayName = value;
+    this.targetModifyStore.dispatch(
+      new TargetModifyStore.Modify(target)
+    );
 
-    // const modifySuccessSubscription$: Subscription = this.modifySuccess$.subscribe(
-    //   (probe: Probe) => {
-    //     if (probe) {
-    //       this.msgs = [];
-    //       this.msgs.push({ severity: 'success', summary: 'Succeed', detail: 'Probe name has changed.' });
-    //     }
-    //     if (modifySuccessSubscription$) {
-    //       modifySuccessSubscription$.unsubscribe();
-    //     }
-    //   },
-    //   (error: RPCClientError) => {
-    //     console.log(error.response.message);
-    //   }
-    // );
+    const modifySuccessSubscription$: Subscription = this.target$.subscribe(
+      (t: Target) => {
+        if (t) {
+        }
+        if (modifySuccessSubscription$) {
+          modifySuccessSubscription$.unsubscribe();
+        }
+      },
+      (error: RPCClientError) => {
+        console.log(error);
+      }
+    );
   }
 
   onDisplayNameChangeKeypress(event, value) {

src/packages/target/store/index.ts

@@ -24,7 +24,7 @@ import {
 
   export const selectTargetState = createFeatureSelector<State>(MODULE.name);
 
-  export const ReadAllByDomainSelector = new StateSelector<TargetModifyStore.State>(createSelector(
+  export const ModifySelector = new StateSelector<TargetModifyStore.State>(createSelector(
     selectTargetState,
     (state: State) => state.modify
   ));