login

src/app/pages/probe/probe-page.component.html

@@ -1,3 +1 @@
-<div>
+<of-tabbar [tabs]="tabs"></of-tabbar> 
-  <of-tabbar [tabs]="tabs"></of-tabbar> 
-</div>

src/app/pages/probes/probes-page-routing.module.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { ProbesPageComponent } from './probes-page.component';
-// import { ListComponent as ProbeListComponent } from 'packages/probe/component/list/list.component';
+import { ListComponent as ProbeListComponent } from 'packages/probe/component/list/list.component';
 // import { ListComponent as NoauthListComponent } from 'packages/noauth/component/list/list.component';
 // import { DownloadComponent } from 'packages/probe/component/download/download.component';
 // import { DetailComponent as ProbeDetailComponent } from 'packages/probe/component/detail/detail.component';
@@ -11,7 +11,7 @@ const routes: Routes = [
     path: '',
     component: ProbesPageComponent,
     children: [
-      // { path: '', component: ProbeListComponent },
+      { path: '', component: ProbeListComponent },
       // { path: 'noauth', component: NoauthListComponent },
       // { path: 'download', component: DownloadComponent },
     ]

src/app/pages/probes/probes-page.component.html

@@ -1,9 +1 @@
-<!-- <div>
-  <of-sub-menubar [tabs]="tabs"></of-sub-menubar>
-  <div style="padding: 15px">
-    
-  </div>
-</div>
- -->
- probe detail
  <router-outlet></router-outlet>

src/app/pages/probes/probes-page.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-// import { ProbeModule } from 'packages/probe/probe.module';
+import { ProbeModule } from 'packages/probe/probe.module';
 // import { NoauthModule } from 'packages/noauth/noauth.module';
 import { ProbesPageComponent } from './probes-page.component';
 import { ProbesPageRoutingModule } from './probes-page-routing.module';
@@ -9,7 +9,7 @@ import { ProbesPageRoutingModule } from './probes-page-routing.module';
   imports: [
     CommonModule,
     ProbesPageRoutingModule,
-    // ProbeModule,
+    ProbeModule,
     // NoauthModule,
   ],
   declarations: [

src/packages/member/component/signin/signin.component.html

@@ -1,30 +1,37 @@
-<div class="card login-panel ui-fluid">
+<form [formGroup]="signinForm" (ngSubmit)="signin()">
+    <div class="card login-panel ui-fluid">
         <div class="ui-g">
             <div class="ui-g-12">
                 <img src="assets/layout/images/logo-ultima.svg">
             </div>
             <div class="ui-g-12">
                 <span class="md-inputfield">
-                <input type="text" autocomplete="off" class="ui-inputtext ui-corner-all ui-state-default ui-widget">
+                    <input type="email" id="email" autocomplete="off" placeholder="email" formControlName="email" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
-                <label>Username</label>
                 </span>
             </div>
             <div class="ui-g-12">
                 <span class="md-inputfield">
-                <input type="password" autocomplete="off" class="ui-inputtext ui-corner-all ui-state-default ui-widget">
+                    <input type="password" id="password" autocomplete="off" placeholder="password" formControlName="password" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
-                <label>Password</label>
                 </span>
             </div>
             <div class="ui-g-12">
-            <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
+                <button type="submit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
                     <span class="ui-button-icon-left ui-c fa fa-fw ui-icon-person"></span>
                     <span class="ui-button-text ui-c">Sign In</span>
                 </button>
-            <button type="button" class="secondary ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
-                <span class="ui-button-icon-left ui-c fa fa-fw ui-icon-help"></span>
-                <span class="ui-button-text ui-c">Sign In</span>
-            </button>
-        </div>
-    </div>
 
-</div>
+                <button type="button" (click)="resetPasswordBtnClick()" class="secondary ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
+                    <span class="ui-button-icon-left ui-c fa fa-fw ui-icon-help"></span>
+                    <span class="ui-button-text ui-c">Forgot Password</span>
+                </button>
+
+                <button type="button" (click)="signupBtnClick()" class="secondary ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
+                    <span class="ui-button-icon-left ui-c fa fa-fw ui-icon-help"></span>
+                    <span class="ui-button-text ui-c">Sign Up</span>
+                </button>
+
+
+            </div>
+        </div>
+    </div>
+</form>

src/packages/probe/component/list/list.component.html

@@ -1,46 +1,27 @@
-<div>probe list</div>
+<p-table [value]="probes" selectionMode="single" (onRowSelect)="onRowSelect($event)" dataKey="displayName">
-<!-- <div class="example-container mat-elevation-z8">
+  <ng-template pTemplate="header">
-  <mat-table #table [dataSource]="dataSource" matSort>
+    <ng-template pTemplate="caption">
-
+      Recent Sales
-    <ng-container matColumnDef="name">
+    </ng-template>
-      <mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
+    <tr>
-      <mat-cell *matCellDef="let element"> {{element.displayName}} </mat-cell>
+      <th>Probe Name</th>
-    </ng-container>
+      <th>IP</th>
-
+      <th>OS</th>
-    <ng-container matColumnDef="ip">
+      <th>CIDR</th>
-      <mat-header-cell *matHeaderCellDef mat-sort-header> IP </mat-header-cell>
+      <th>Targets</th>
-      <mat-cell *matCellDef="let element">  </mat-cell>
+      <th>Authroized at</th>
-    </ng-container>
+      <th>Authroized by</th>
-
+    </tr>
-    <ng-container matColumnDef="os">
+  </ng-template>
-      <mat-header-cell *matHeaderCellDef mat-sort-header> OS </mat-header-cell>
+  <ng-template pTemplate="body" let-probe>
-      <mat-cell *matCellDef="let element">  </mat-cell>
+    <tr>
-    </ng-container>
+      <td>{{probe.displayName}}</td>
-
+      <td>?</td>
-    <ng-container matColumnDef="cidr">
+      <td>?</td>
-      <mat-header-cell *matHeaderCellDef mat-sort-header> CIDR </mat-header-cell>
+      <td>{{probe.cidr}}</td>
-      <mat-cell *matCellDef="let element"> {{element.cidr}} </mat-cell>
+      <td>??</td>
-    </ng-container>
+      <td>{{probe.authorizeDate}}</td>
-
+      <td>{{probe.authorizeMember.name}}</td>
-    <ng-container matColumnDef="targetCnt">
+    </tr>
-      <mat-header-cell *matHeaderCellDef mat-sort-header> Targets </mat-header-cell>
+  </ng-template>
-      <mat-cell *matCellDef="let element"> {{element.targets.length}} </mat-cell>
+</p-table>
-    </ng-container>
-
-    <ng-container matColumnDef="date">
-      <mat-header-cell *matHeaderCellDef mat-sort-header> Date </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.authorizeDate.toLocaleString()}} </mat-cell>
-    </ng-container>
-
-    <ng-container matColumnDef="authBy">
-      <mat-header-cell *matHeaderCellDef mat-sort-header> AuthBy </mat-header-cell>
-      <mat-cell *matCellDef="let element"> {{element.authorizeMember.name}} </mat-cell>
-    </ng-container>
-
-    <mat-header-row *matHeaderRowDef="displayedColumns" ></mat-header-row>
-    <mat-row *matRowDef="let row; columns: displayedColumns;" (click)="handleRowClick(row)"></mat-row>
-  </mat-table>
-
-  <mat-paginator [length]="length" [pageIndex]="0" [pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25, 100]">
-  </mat-paginator>
-</div> -->

src/packages/probe/component/list/list.component.ts

@@ -18,12 +18,8 @@ import { ListSelector } from '../../store';
 })
 export class ListComponent implements OnInit, AfterContentInit {
   probes$ = this.store.pipe(select(ListSelector.select('probes')));
-  // pageSize = '25';
+  probes: Probe[];
-  // length = '100';
+  cols: any[];
-
-  displayedColumns = ['name', 'ip', 'os', 'cidr', 'targetCnt', 'date', 'authBy'];
-//   dataSource: MatTableDataSource<Probe>;
-//   @ViewChild(MatSort) sort: MatSort;
 
   constructor(
     private router: Router,
@@ -45,48 +41,43 @@ export class ListComponent implements OnInit, AfterContentInit {
     this.probes$.subscribe(
       (probes: Probe[]) => {
         console.log(probes);
-        // this.dataSource = new MatTableDataSource(probes);
-        // this.dataSource.sort = this.sort;
       },
       (error: RPCClientError) => {
         console.log(error.response.message);
       }
     );
 
-    // // temporary data
-    // const data: Probe[] = new Array();
-    // for (let i = 0; i < 100; i++) {
-    //   const p: Probe = {
-    //     id: i,
-    //     displayName: String('displayName' + i),
-    //     host: {
-    //       ip: i,
-    //       os: {
-    //         meta: 'blahblahblah'
-    //       },
-    //     },
-    //     cidr: String('cidr' + i),
-    //     targets: [
-    //       {
-    //         id: i,
-    //       },
-    //     ],
-    //     authorizeDate: new Date(),
-    //     authorizeMember: {
-    //       'name': String('insanity')
-    //     },
-    //   };
-    //   data.push(p);
-    // }
-
-    // this.dataSource = new MatTableDataSource(data);
-    // this.dataSource.sort = this.sort;
   }
 
   ngOnInit() {
+    this.cols = [
+      { field: 'displayName', header: 'displayName' },
+      { field: 'createDate', header: 'createDate' },
+      { field: 'cidr', header: 'CIDR' },
+      { field: 'authorizeDate', header: 'authorizeDate' },
+      { field: 'authorizeMember', authorizeMember: 'Color' }
+    ];
+
+    // Temporary data
+    this.probes = new Array();
+    for (let i = 0; i < 10; i++) {
+      const p: Probe = {
+        id: i,
+        createDate: new Date(),
+        description: 'Description' + i,
+        displayName: 'DisplayName' + i,
+        cidr: 'CIDR' + i,
+        authorizeDate: new Date(),
+        authorizeMember: {
+          name: 'MemberName' + i,
+        },
+      };
+      this.probes.push(p);
+    }
   }
 
-  handleRowClick(obj: Probe) {
+  onRowSelect(event) {
-    this.router.navigate(['probe', obj.id]);
+    console.log(event.data);
+    // this.router.navigate(['probe', obj.id]);
   }
 }

src/packages/probe/probe.module.ts

@@ -4,6 +4,7 @@ import { CommonModule } from '@angular/common';
 import { COMPONENTS } from './component';
 import { ProbeStoreModule } from './probe-store.module';
 import { SERVICES } from './service';
+import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
 // import { SettingComponent as DiscoverySettingComponent } from 'packages/discovery/component/setting/setting.component';
 // import { DiscoveryModule } from '../discovery/discovery.module';
 
@@ -11,6 +12,7 @@ import { SERVICES } from './service';
 @NgModule({
   imports: [
     CommonModule,
+    PrimeNGModules,
     ProbeStoreModule,
     // DiscoveryModule
   ],