This commit is contained in:
insanity 2018-04-09 20:03:15 +09:00
parent 6baf0ef325
commit 5aed772c54
8 changed files with 98 additions and 127 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -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> -->

View File

@ -18,12 +18,8 @@ import { ListSelector } from '../../store';
}) })
export class ListComponent implements OnInit, AfterContentInit { export class ListComponent implements OnInit, AfterContentInit {
probes$ = this.store.pipe(select(ListSelector.select('probes'))); 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( constructor(
private router: Router, private router: Router,
@ -45,48 +41,43 @@ export class ListComponent implements OnInit, AfterContentInit {
this.probes$.subscribe( this.probes$.subscribe(
(probes: Probe[]) => { (probes: Probe[]) => {
console.log(probes); console.log(probes);
// this.dataSource = new MatTableDataSource(probes);
// this.dataSource.sort = this.sort;
}, },
(error: RPCClientError) => { (error: RPCClientError) => {
console.log(error.response.message); 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() { 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]);
} }
} }

View File

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