sensor senting popup is in progress
This commit is contained in:
insanity
parent
aacd439d04
commit
b52cdaa384
|
|
@ -29,7 +29,6 @@
|
|||
"@ngrx/store": "^5.2.0",
|
||||
"@ngrx/store-devtools": "^5.2.0",
|
||||
"angular-l10n": "^4.1.5",
|
||||
"angular-tree-component": "^7.1.0",
|
||||
"angularx-qrcode": "^1.1.0",
|
||||
"ip-cidr": "^1.1.2",
|
||||
"reflect-metadata": "^0.1.12",
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { SERVICES } from './service';
|
|||
import { FormsModule } from '@angular/forms';
|
||||
import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
|
||||
import { DiscoveryModule } from 'packages/discovery/discovery.module';
|
||||
import { SensorModule } from '../sensor/sensor.module';
|
||||
|
||||
|
||||
@NgModule({
|
||||
|
|
@ -14,7 +15,8 @@ import { DiscoveryModule } from 'packages/discovery/discovery.module';
|
|||
InfraStoreModule,
|
||||
FormsModule,
|
||||
PrimeNGModules,
|
||||
DiscoveryModule
|
||||
DiscoveryModule,
|
||||
SensorModule
|
||||
],
|
||||
declarations: [
|
||||
COMPONENTS,
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
export interface MetaSensorItemType {
|
||||
id?: number;
|
||||
name: string;
|
||||
description: string;
|
||||
createDate: Date;
|
||||
name?: string;
|
||||
description?: string;
|
||||
createDate?: Date;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,27 +1,28 @@
|
|||
import { ListComponent } from './list/list.component';
|
||||
|
||||
// import { SettingComponent } from './setting/setting.component';
|
||||
import { SettingComponent } from './setting/setting.component';
|
||||
import { TargetSelectorComponent } from './setting/target-selector/target-selector.component';
|
||||
import { CrawlerSelectorComponent } from './setting/crawler-selector/crawler-selector.component';
|
||||
import { CrawlerAuthComponent } from './setting/crawler-auth/crawler-auth.component';
|
||||
import { SensorItemSelectorComponent } from './setting/sensor-item-selector/sensor-item-selector.component';
|
||||
// import { SettingResultComponent } from './setting-result/setting-result.component';
|
||||
// import { FilterComponent } from './list/filter/filter.component';
|
||||
// import { ListComponent } from './list/list.component';
|
||||
// import { DetailComponent } from './detail/detail.component';
|
||||
// import { TargetSelectorComponent } from './setting/target-selector/target-selector.component';
|
||||
// import { CrawlerSelectorComponent } from './setting/crawler-selector/crawler-selector.component';
|
||||
// import { CrawlerAuthComponent } from './setting/crawler-auth/crawler-auth.component';
|
||||
// import { SensorItemSelectorComponent } from './setting/sensor-item-selector/sensor-item-selector.component';
|
||||
// import { SettingETCComponent } from './setting/setting-etc/setting-etc.component';
|
||||
// import { NameTagComponent } from './name-tag/name-tag.component';
|
||||
|
||||
export const COMPONENTS = [
|
||||
// SettingComponent,
|
||||
SettingComponent,
|
||||
TargetSelectorComponent,
|
||||
CrawlerSelectorComponent,
|
||||
CrawlerAuthComponent,
|
||||
SensorItemSelectorComponent,
|
||||
// SettingResultComponent,
|
||||
ListComponent,
|
||||
// FilterComponent,
|
||||
// DetailComponent,
|
||||
// TargetSelectorComponent,
|
||||
// CrawlerSelectorComponent,
|
||||
// CrawlerAuthComponent,
|
||||
// SensorItemSelectorComponent,
|
||||
// SettingETCComponent,
|
||||
// NameTagComponent,
|
||||
];
|
||||
|
|
|
|||
|
|
@ -1,4 +1,68 @@
|
|||
<div>
|
||||
<div class="card no-margin" style="height: 250px; overflow: auto">
|
||||
<h1>3. Credential for </h1>
|
||||
|
||||
<div class="ui-g form-group">
|
||||
<div class="ui-g-12 ui-md-2">
|
||||
<label for="input">User</label>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<span class="md-inputfield">
|
||||
<input id="input" type="text" pInputText/>
|
||||
<label>Username</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui-g form-group">
|
||||
<div class="ui-g-12 ui-md-2">
|
||||
<label for="input">User</label>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<span class="md-inputfield">
|
||||
<input id="input" type="text" pInputText/>
|
||||
<label>Username</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui-g form-group">
|
||||
<div class="ui-g-12 ui-md-2">
|
||||
<label for="input">User</label>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<span class="md-inputfield">
|
||||
<input id="input" type="text" pInputText/>
|
||||
<label>Username</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui-g form-group">
|
||||
<div class="ui-g-12 ui-md-2">
|
||||
<label for="input">User</label>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<span class="md-inputfield">
|
||||
<input id="input" type="text" pInputText/>
|
||||
<label>Username</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui-g form-group">
|
||||
<div class="ui-g-12 ui-md-2">
|
||||
<label for="input">User</label>
|
||||
</div>
|
||||
<div class="ui-g-12 ui-md-4">
|
||||
<span class="md-inputfield">
|
||||
<input id="input" type="text" pInputText/>
|
||||
<label>Username</label>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- <div>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>Step 3</mat-card-title>
|
||||
|
|
@ -28,4 +92,4 @@
|
|||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -12,7 +12,6 @@ import { MetaCrawlerInputItem } from 'packages/meta/crawler-input-item/model/Met
|
|||
@Component({
|
||||
selector: 'of-crawler-auth',
|
||||
templateUrl: './crawler-auth.component.html',
|
||||
styleUrls: ['./crawler-auth.component.scss']
|
||||
})
|
||||
export class CrawlerAuthComponent implements OnInit, OnChanges {
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,14 @@
|
|||
<div>
|
||||
<p-orderList [value]="crawlers" [listStyle]="{'height':'200px'}" [responsive]="true" header="2. Choose a Crawler" filterBy="name">
|
||||
<ng-template let-crawler pTemplate="item">
|
||||
<div class="ui-helper-clearfix">
|
||||
<!-- <img src="assets/demo/images/car/Audi.gif" style="display:inline-block;margin:2px 0 2px 2px" /> -->
|
||||
<div style="font-size:14px;float:right;margin:15px 5px 0 0">{{crawler.name}}</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</p-orderList>
|
||||
|
||||
|
||||
<!-- <div>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>Step 2</mat-card-title>
|
||||
|
|
@ -18,4 +28,4 @@
|
|||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -27,16 +27,27 @@ export class CrawlerSelectorComponent implements OnInit, OnChanges, AfterContent
|
|||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.crawlers$.subscribe(
|
||||
(list: MetaCrawler[]) => {
|
||||
if (list !== null) {
|
||||
this.crawlers = list;
|
||||
// this.crawlers$.subscribe(
|
||||
// (list: MetaCrawler[]) => {
|
||||
// if (list !== null) {
|
||||
// this.crawlers = list;
|
||||
// }
|
||||
// },
|
||||
// (error: RPCClientError) => {
|
||||
// console.log(error.response.message);
|
||||
// }
|
||||
// );
|
||||
|
||||
// Temporary Data
|
||||
this.crawlers = [];
|
||||
for (let i = 0; i < 10; i++) {
|
||||
const c: MetaCrawler = {
|
||||
id: i,
|
||||
name: 'CrawlerName' + i,
|
||||
description: 'Description' + i,
|
||||
};
|
||||
this.crawlers.push(c);
|
||||
}
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
console.log(error.response.message);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
<div>
|
||||
<p-tree [value]="displayItems" selectionMode="checkbox" [(selection)]="selectedItems"></p-tree>
|
||||
|
||||
<!-- <div>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>Step 4</mat-card-title>
|
||||
|
|
@ -31,4 +33,4 @@
|
|||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -2,12 +2,12 @@ import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, A
|
|||
import { Router } from '@angular/router';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import { RPCClientError } from '@loafer/ng-rpc/protocol';
|
||||
|
||||
import * as ListStore from 'packages/meta/sensor-display-item/store/list';
|
||||
import { ReadAllSensorDisplayItemByCrawlerSelector } from 'packages/meta/sensor-display-item/store';
|
||||
import { MetaSensorDisplayItem } from 'packages/meta/sensor-display-item/model/MetaSensorDisplayItem';
|
||||
import { MetaCrawler } from '../../../../meta/crawler/model/MetaCrawler';
|
||||
import { ITreeOptions } from 'angular-tree-component';
|
||||
import { MetaSensorItemType } from '../../../../meta/sensor-item-type/model/MetaSensorItemType';
|
||||
import { TreeNode } from 'primeng/primeng';
|
||||
|
||||
@Component({
|
||||
selector: 'of-sensor-item-selector',
|
||||
|
|
@ -19,8 +19,9 @@ export class SensorItemSelectorComponent implements OnInit, OnChanges {
|
|||
@Input() selectedCrawler: MetaCrawler;
|
||||
@Output() itemSelectEvent = new EventEmitter<Set<MetaSensorDisplayItem>>();
|
||||
items$ = this.listStore.pipe(select(ReadAllSensorDisplayItemByCrawlerSelector.select('list')));
|
||||
nodes;
|
||||
checkedSet: Set<MetaSensorDisplayItem> = new Set();
|
||||
|
||||
selectedItems: MetaSensorDisplayItem[];
|
||||
treeNode: TreeNode[];
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
|
|
@ -28,77 +29,49 @@ export class SensorItemSelectorComponent implements OnInit, OnChanges {
|
|||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
this.items$.subscribe(
|
||||
(list: MetaSensorDisplayItem[]) => {
|
||||
if (list !== null) {
|
||||
this.generateTreeNode(list);
|
||||
// this.items$.subscribe(
|
||||
// (list: MetaSensorDisplayItem[]) => {
|
||||
// if (list !== null) {
|
||||
// }
|
||||
// },
|
||||
// (error: RPCClientError) => {
|
||||
// console.log(error.response.message);
|
||||
// }
|
||||
// );
|
||||
|
||||
// Temporary data
|
||||
const displayItems = [];
|
||||
for (let i = 0; i < 10; i++) {
|
||||
let isDefault = false;
|
||||
const t: MetaSensorItemType = {
|
||||
name: 'CPU'
|
||||
};
|
||||
if (i % 2) {
|
||||
isDefault = true;
|
||||
t.name = 'Memory';
|
||||
}
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
console.log(error.response.message);
|
||||
}
|
||||
);
|
||||
const si: MetaSensorDisplayItem = {
|
||||
id: i,
|
||||
key: 'SensorDisplayItemKey' + i,
|
||||
displayName: 'DisplayName' + i,
|
||||
description: 'Description' + i,
|
||||
default: isDefault,
|
||||
itemType: t
|
||||
};
|
||||
displayItems.push(si);
|
||||
}
|
||||
|
||||
this.generateTreeData(displayItems);
|
||||
}
|
||||
|
||||
generateTreeData(items) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
ngOnChanges() {
|
||||
this.checkedSet.clear();
|
||||
// this.checkedSet.clear();
|
||||
this.listStore.dispatch(new ListStore.ReadAllByCrawler(this.selectedCrawler));
|
||||
}
|
||||
|
||||
generateTreeNode(list: MetaSensorDisplayItem[]) {
|
||||
this.nodes = new Array();
|
||||
for (const item of list) {
|
||||
const categoryNode = this.existCategory(item);
|
||||
if (categoryNode === null) {
|
||||
const childrenNode = new Array();
|
||||
childrenNode.push(this.getChildNode(item));
|
||||
const node = {
|
||||
title: item.itemType.name,
|
||||
children: childrenNode,
|
||||
};
|
||||
this.nodes.push(node);
|
||||
} else {
|
||||
categoryNode.children.push(this.getChildNode(item));
|
||||
}
|
||||
}
|
||||
this.itemSelectEvent.emit(this.checkedSet);
|
||||
}
|
||||
|
||||
getChildNode(item) {
|
||||
const childNode = {
|
||||
title: item.displayName,
|
||||
key: ' - ' + item.key,
|
||||
default: item.default,
|
||||
displayItem: item
|
||||
};
|
||||
return childNode;
|
||||
}
|
||||
|
||||
existCategory(item: MetaSensorDisplayItem) {
|
||||
let categoryNode = null;
|
||||
for (const node of this.nodes) {
|
||||
if (node.title === item.itemType.name) {
|
||||
categoryNode = node;
|
||||
}
|
||||
}
|
||||
return categoryNode;
|
||||
}
|
||||
|
||||
checkItem(node) {
|
||||
node.toggleActivated(true);
|
||||
if (node.isActive) {
|
||||
if (this.checkedSet.has(node.data.displayItem) === false) {
|
||||
this.checkedSet.add(node.data.displayItem);
|
||||
}
|
||||
} else {
|
||||
if (this.checkedSet.has(node.data.displayItem)) {
|
||||
this.checkedSet.delete(node.data.displayItem);
|
||||
}
|
||||
}
|
||||
this.itemSelectEvent.emit(this.checkedSet);
|
||||
}
|
||||
|
||||
onTreeDataLoad(tree) {
|
||||
tree.treeModel.expandAll();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,37 +1,16 @@
|
|||
<div>
|
||||
<div [hidden]="step !== 1">
|
||||
<mat-grid-list cols="2" rowHeight="5:1">
|
||||
<!-- isAllSelectable === 0 ? 3 : 1 -->
|
||||
<mat-grid-tile [colspan]="1" [rowspan]="isAllSelectable ? 3 : 2" style="background-color: lightblue" (click)="onAreaClick(0)">
|
||||
<of-target-selector [target]="selectedTarget" (targetSelectEvent)="handleTargetSelection($event)" ></of-target-selector>
|
||||
</mat-grid-tile>
|
||||
<!-- <p-steps [model]="stepsItems"></p-steps> -->
|
||||
|
||||
<mat-grid-tile [colspan]="1" [rowspan]="2" style="background-color: lightcoral" (click)="onAreaClick(2)">
|
||||
<of-crawler-auth [selectedCrawler]="selectedCrawler" (testPassEvent)="handleTest($event)"></of-crawler-auth>
|
||||
</mat-grid-tile>
|
||||
|
||||
<mat-grid-tile [colspan]="1" [rowspan]="3" style="background-color: lightgrey" (click)="onAreaClick(3)">
|
||||
<of-sensor-item-selector [selectedCrawler]="selectedCrawler" (itemSelectEvent)="handleItemSelection($event)"></of-sensor-item-selector>
|
||||
</mat-grid-tile>
|
||||
|
||||
<mat-grid-tile [colspan]="1" [rowspan]="isAllSelectable ? 2 : 3" style="background-color: lightpink" (click)="onAreaClick(1)">
|
||||
<of-crawler-selector [selectedTarget]="selectedTarget" (crawlerSelectEvent)="handleCrawlerSelection($event)"></of-crawler-selector>
|
||||
</mat-grid-tile>
|
||||
|
||||
</mat-grid-list>
|
||||
<div class="ui-g">
|
||||
<div class="ui-g-6">
|
||||
<of-target-selector></of-target-selector>
|
||||
</div>
|
||||
|
||||
<div *ngIf="step === 2">
|
||||
<of-sensor-setting-etc [selectedTarget]="selectedTarget"
|
||||
[selectedCrawler]="selectedCrawler"
|
||||
[selectedItems]="selectedSensorDisplayItems"></of-sensor-setting-etc>
|
||||
<div class="ui-g-6">
|
||||
<of-crawler-auth></of-crawler-auth>
|
||||
</div>
|
||||
|
||||
<div fxLayoutAlign="space-between stretch" [style.margin]="'5px'">
|
||||
<button mat-raised-button mat-dialog-close *ngIf="step === 1">Cancel</button>
|
||||
<button mat-raised-button *ngIf="step === 2" (click)="onPrev()">Prev</button>
|
||||
|
||||
<button mat-raised-button color="primary" (click)="onNext()" *ngIf="step === 1" [disabled]="!nextable">Next</button>
|
||||
<button mat-raised-button color="primary" [mat-dialog-close]="true" *ngIf="step === 2">Done</button>
|
||||
<div class="ui-g-6">
|
||||
<of-crawler-selector></of-crawler-selector>
|
||||
</div>
|
||||
<div class="ui-g-6">
|
||||
<of-sensor-item-selector></of-sensor-item-selector>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,31 +1,26 @@
|
|||
.example-card {
|
||||
width: 400px;
|
||||
.ui-steps .ui-steps-item {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.example-header-image {
|
||||
background-image: url('https://material.angular.io/assets/img/examples/shiba1.jpg');
|
||||
background-size: cover;
|
||||
.ui-steps.steps-custom {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.example-radio-group {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
.ui-steps.steps-custom .ui-steps-item .ui-menuitem-link {
|
||||
height: 10px;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.example-radio-button {
|
||||
margin: 5px;
|
||||
.ui-steps.steps-custom .ui-steps-item .ui-steps-number {
|
||||
background-color: #0081c2;
|
||||
color: #FFFFFF;
|
||||
display: inline-block;
|
||||
width: 36px;
|
||||
border-radius: 50%;
|
||||
margin-top: -14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.example-selected-value {
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.example-form {
|
||||
min-width: 150px;
|
||||
max-width: 500px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.example-full-width {
|
||||
width: 100%;
|
||||
.ui-steps.steps-custom .ui-steps-item .ui-steps-title {
|
||||
color: #555555;
|
||||
}
|
||||
|
|
@ -1,111 +1,57 @@
|
|||
// import { Component, OnInit, Input, Inject, DoCheck } from '@angular/core';
|
||||
// import { Target } from '../../../target/model';
|
||||
// import { MAT_DIALOG_DATA, MatSnackBar } from '@angular/material';
|
||||
// import { Infra } from '../../../infra/model';
|
||||
// import { MetaCrawler } from '../../../meta/crawler/model/MetaCrawler';
|
||||
// import { MetaSensorDisplayItem } from '../../../meta/sensor-display-item/model/MetaSensorDisplayItem';
|
||||
import { Component, OnInit, Input, Inject, DoCheck, ViewEncapsulation } from '@angular/core';
|
||||
import { Target } from 'packages/target/model';
|
||||
import { Infra } from 'packages/infra/model';
|
||||
import { MetaCrawler } from 'packages/meta/crawler/model/MetaCrawler';
|
||||
import { MetaSensorDisplayItem } from 'packages/meta/sensor-display-item/model/MetaSensorDisplayItem';
|
||||
|
||||
// import { Store, select } from '@ngrx/store';
|
||||
// import { RPCClientError } from '@loafer/ng-rpc/protocol';
|
||||
// import * as SensorItemKeyListStore from 'packages/sensor-item/store/key-list';
|
||||
// import { ReadSensorItemKeySelector } from 'packages/sensor-item/store';
|
||||
// import { MetaSensorItemKey } from '../../../meta/sensor-item-key/model/MetaSensorItemKey';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import { RPCClientError } from '@loafer/ng-rpc/protocol';
|
||||
import * as SensorItemKeyListStore from 'packages/sensor-item/store/key-list';
|
||||
import { ReadSensorItemKeySelector } from 'packages/sensor-item/store';
|
||||
import { MetaSensorItemKey } from 'packages/meta/sensor-item-key/model/MetaSensorItemKey';
|
||||
|
||||
// @Component({
|
||||
// selector: 'of-sensor-setting',
|
||||
// templateUrl: './setting.component.html',
|
||||
// styleUrls: ['./setting.component.scss']
|
||||
// })
|
||||
// export class SettingComponent implements OnInit, DoCheck {
|
||||
@Component({
|
||||
selector: 'of-sensor-setting',
|
||||
templateUrl: './setting.component.html',
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class SettingComponent implements OnInit, DoCheck {
|
||||
|
||||
// selectedTarget: Target = null;
|
||||
// selectedCrawler: MetaCrawler = null;
|
||||
// testPassed = false;
|
||||
// selectedSensorDisplayItems: Set<MetaSensorDisplayItem> = null;
|
||||
// step = 1;
|
||||
// nextable = false;
|
||||
// focus = 0;
|
||||
// isAllSelectable = true;
|
||||
sensorItemKeys$ = this.keyListStore.pipe(select(ReadSensorItemKeySelector.select('list')));
|
||||
stepsItems = [
|
||||
{
|
||||
label: 'Target'
|
||||
},
|
||||
{
|
||||
label: 'Crawler'
|
||||
},
|
||||
{
|
||||
label: 'Credentials'
|
||||
},
|
||||
{
|
||||
label: 'Sensor Items'
|
||||
}
|
||||
];
|
||||
activeIndex = 1;
|
||||
|
||||
// sensorItemKeys$ = this.keyListStore.pipe(select(ReadSensorItemKeySelector.select('list')));
|
||||
constructor(
|
||||
private keyListStore: Store<SensorItemKeyListStore.State>,
|
||||
) {
|
||||
}
|
||||
|
||||
// constructor(
|
||||
// @Inject(MAT_DIALOG_DATA) public data: any,
|
||||
// public snackBar: MatSnackBar,
|
||||
// private keyListStore: Store<SensorItemKeyListStore.State>,
|
||||
// ) {
|
||||
// if (data !== null) {
|
||||
// this.isAllSelectable = false;
|
||||
// this.selectedTarget = data.infra.target;
|
||||
// }
|
||||
// }
|
||||
ngOnInit() {
|
||||
this.sensorItemKeys$.subscribe(
|
||||
(list: MetaSensorItemKey[]) => {
|
||||
if (list !== null) {
|
||||
console.log(list);
|
||||
}
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
console.log(error.response.message);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// ngOnInit() {
|
||||
// this.sensorItemKeys$.subscribe(
|
||||
// (list: MetaSensorItemKey[]) => {
|
||||
// if (list !== null) {
|
||||
// console.log('#############################');
|
||||
// console.log(list);
|
||||
// console.log('#############################');
|
||||
// }
|
||||
// },
|
||||
// (error: RPCClientError) => {
|
||||
// console.log(error.response.message);
|
||||
// }
|
||||
// );
|
||||
// }
|
||||
|
||||
// ngDoCheck() {
|
||||
// if (
|
||||
// this.selectedTarget === null ||
|
||||
// this.selectedCrawler === null ||
|
||||
// this.selectedSensorDisplayItems === null ||
|
||||
// this.selectedSensorDisplayItems.size === 0 ||
|
||||
// this.testPassed === false
|
||||
// ) {
|
||||
// this.nextable = false;
|
||||
// } else {
|
||||
// this.nextable = true;
|
||||
// }
|
||||
// }
|
||||
|
||||
// onNext() {
|
||||
// this.step += 1;
|
||||
// }
|
||||
|
||||
// onPrev() {
|
||||
// this.step -= 1;
|
||||
// }
|
||||
|
||||
// onDone() {
|
||||
// this.openSnackBar('센서 등록해야되는데 아직 못함');
|
||||
// // List<MetaSensorItemKey> SensorItemDependencyService.readAllByDisplayItem(MetaSensorDisplayItem displayItem)
|
||||
// for (const displayItem of Array.from(this.selectedSensorDisplayItems)) {
|
||||
// this.keyListStore.dispatch(new SensorItemKeyListStore.ReadAllByDisplayItem(displayItem));
|
||||
// }
|
||||
// // Sensor SensorService.registSensorConfig(Sensor sensor, List<SensorItem> sensorItemList, String etcJson)
|
||||
// }
|
||||
|
||||
// openSnackBar(message: string) {
|
||||
// this.snackBar.open(message, 'OK', {
|
||||
// duration: 2000,
|
||||
// });
|
||||
// }
|
||||
|
||||
// handleTargetSelection(t: Target) {
|
||||
// this.selectedTarget = t;
|
||||
// }
|
||||
// handleCrawlerSelection(c: MetaCrawler) {
|
||||
// this.selectedCrawler = c;
|
||||
// }
|
||||
// handleItemSelection(itemSet: Set<MetaSensorDisplayItem>) {
|
||||
// this.selectedSensorDisplayItems = itemSet;
|
||||
// }
|
||||
// handleTest(b: boolean) {
|
||||
// this.testPassed = b;
|
||||
// }
|
||||
|
||||
// onAreaClick(no: number) {
|
||||
// this.focus = no;
|
||||
// }
|
||||
// }
|
||||
ngDoCheck() {
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,13 @@
|
|||
<div style="width:100%">
|
||||
<p-orderList [value]="targets" [listStyle]="{'height':'200px'}" [responsive]="true" header="1. Choose a target" filterBy="displayName">
|
||||
<ng-template let-target pTemplate="item">
|
||||
<div class="ui-helper-clearfix">
|
||||
<!-- <img src="assets/demo/images/car/BMW.gif" style="display:inline-block;margin:2px 0 2px 2px" /> -->
|
||||
<div style="font-size:14px;float:right;margin:15px 5px 0 0">{{target.displayName}}</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</p-orderList>
|
||||
|
||||
<!-- <div style="width:100%">
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<mat-card-title>Step 1</mat-card-title>
|
||||
|
|
@ -18,4 +27,4 @@
|
|||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
</div>
|
||||
</div> -->
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
.radio-group {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.radio-button {
|
||||
margin: 5px;
|
||||
}
|
||||
|
|
@ -1,78 +1,89 @@
|
|||
// import { Component, OnInit, Output, EventEmitter, Input, AfterContentInit } from '@angular/core';
|
||||
// import { Router } from '@angular/router';
|
||||
// import { MatRadioButton } from '@angular/material';
|
||||
// import { Target } from 'packages/target/model';
|
||||
// import { RPCClientError } from '@loafer/ng-rpc/protocol';
|
||||
// import { Domain } from 'packages/domain/model';
|
||||
// import { AuthSelector } from 'packages/member/store';
|
||||
// import * as ListStore from 'packages/infra/store/list';
|
||||
// import { ListSelector } from 'packages/infra/store';
|
||||
// import { Store, select } from '@ngrx/store';
|
||||
// import { Page, PageParams } from 'app/commons/model';
|
||||
import { Component, OnInit, Output, EventEmitter, Input, AfterContentInit } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
import { Target } from 'packages/target/model';
|
||||
import { RPCClientError } from '@loafer/ng-rpc/protocol';
|
||||
import { Domain } from 'packages/domain/model';
|
||||
import { AuthSelector } from 'packages/member/store';
|
||||
import * as ListStore from 'packages/infra/store/list';
|
||||
import { ListSelector } from 'packages/infra/store';
|
||||
import { Store, select } from '@ngrx/store';
|
||||
import { Page, PageParams } from 'app/commons/model';
|
||||
import { SelectItem } from 'primeng/primeng';
|
||||
|
||||
// @Component({
|
||||
// selector: 'of-target-selector',
|
||||
// templateUrl: './target-selector.component.html',
|
||||
// styleUrls: ['./target-selector.component.scss']
|
||||
// })
|
||||
// export class TargetSelectorComponent implements OnInit {
|
||||
@Component({
|
||||
selector: 'of-target-selector',
|
||||
templateUrl: './target-selector.component.html',
|
||||
})
|
||||
export class TargetSelectorComponent implements OnInit {
|
||||
|
||||
// targets$ = this.store.pipe(select(ListSelector.select('page')));
|
||||
targets$ = this.store.pipe(select(ListSelector.select('page')));
|
||||
|
||||
// @Input() target: Target = null;
|
||||
// @Output() targetSelectEvent = new EventEmitter<Target>();
|
||||
// targets: Target[] = null;
|
||||
@Input() target: Target = null;
|
||||
@Output() targetSelectEvent = new EventEmitter<Target>();
|
||||
targets: Target[] = null;
|
||||
|
||||
// constructor(
|
||||
// private router: Router,
|
||||
// private store: Store<ListStore.State>
|
||||
// ) { }
|
||||
constructor(
|
||||
private router: Router,
|
||||
private store: Store<ListStore.State>
|
||||
) { }
|
||||
|
||||
// ngOnInit() {
|
||||
// this.targets = new Array();
|
||||
// if (this.target === null) {
|
||||
// this.getTargetList();
|
||||
// } else {
|
||||
// this.targets.push(this.target);
|
||||
// }
|
||||
ngOnInit() {
|
||||
this.targets = new Array();
|
||||
if (this.target === null) {
|
||||
this.getTargetList();
|
||||
} else {
|
||||
this.targets.push(this.target);
|
||||
}
|
||||
|
||||
// this.targets$.subscribe(
|
||||
// (page: Page) => {
|
||||
// if (page !== null) {
|
||||
// this.convertInfraToTarget(page);
|
||||
// }
|
||||
// },
|
||||
// (error: RPCClientError) => {
|
||||
// console.log(error.response.message);
|
||||
// }
|
||||
// );
|
||||
// }
|
||||
this.targets$.subscribe(
|
||||
(page: Page) => {
|
||||
if (page !== null) {
|
||||
this.convertInfraToTarget(page);
|
||||
}
|
||||
},
|
||||
(error: RPCClientError) => {
|
||||
console.log(error.response.message);
|
||||
}
|
||||
);
|
||||
|
||||
// convertInfraToTarget(page: Page) {
|
||||
// for (const infra of page.content) {
|
||||
// this.targets.push(infra.target);
|
||||
// }
|
||||
// }
|
||||
// Temporary data
|
||||
for (let i = 0; i < 10; i++) {
|
||||
const t: Target = {
|
||||
id: i,
|
||||
displayName: 'DisplayName' + i,
|
||||
createDate: new Date(),
|
||||
description: 'Description' + i,
|
||||
};
|
||||
this.targets.push(t);
|
||||
}
|
||||
}
|
||||
|
||||
// getTargetList() {
|
||||
// this.store.select(AuthSelector.select('domain')).subscribe(
|
||||
// (domain: Domain) => {
|
||||
// const pageParams: PageParams = {
|
||||
// pageNo: '0',
|
||||
// countPerPage: '9999',
|
||||
// sortCol: 'id',
|
||||
// sortDirection: 'descending'
|
||||
// };
|
||||
// this.store.dispatch(new ListStore.ReadAllByDomain({ domain, pageParams }));
|
||||
// },
|
||||
// (error) => {
|
||||
// console.log(error);
|
||||
// }
|
||||
// );
|
||||
// }
|
||||
|
||||
// targetSelected(t: Target) {
|
||||
// this.targetSelectEvent.emit(t);
|
||||
// }
|
||||
convertInfraToTarget(page: Page) {
|
||||
for (const infra of page.content) {
|
||||
this.targets.push(infra.target);
|
||||
}
|
||||
}
|
||||
|
||||
// }
|
||||
getTargetList() {
|
||||
this.store.select(AuthSelector.select('domain')).subscribe(
|
||||
(domain: Domain) => {
|
||||
const pageParams: PageParams = {
|
||||
pageNo: '0',
|
||||
countPerPage: '9999',
|
||||
sortCol: 'id',
|
||||
sortDirection: 'descending'
|
||||
};
|
||||
this.store.dispatch(new ListStore.ReadAllByDomain({ domain, pageParams }));
|
||||
},
|
||||
(error) => {
|
||||
console.log(error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
targetSelected(t: Target) {
|
||||
this.targetSelectEvent.emit(t);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,12 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { PrimeNGModules } from '../commons/prime-ng/prime-ng.module';
|
||||
import { COMPONENTS } from './component';
|
||||
import { SERVICES } from './service';
|
||||
import { SensorStoreModule } from './sensor-store.module';
|
||||
import { TreeModule } from 'angular-tree-component';
|
||||
import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
|
||||
import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
|
||||
// import { MetaCrawlerModule } from '../meta/crawler/crawler.module';
|
||||
// import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-display-item.module';
|
||||
// import { SensorItemModule } from '../sensor-item/sensor-item.module';
|
||||
// import { MetaCrawlerInputItemModule } from '../meta/crawler-input-item/crawler-input.module';
|
||||
|
||||
|
|
@ -16,10 +15,10 @@ import { MetaSensorDisplayItemModule } from '../meta/sensor-display-item/sensor-
|
|||
CommonModule,
|
||||
FormsModule,
|
||||
SensorStoreModule,
|
||||
TreeModule,
|
||||
MetaCrawlerModule,
|
||||
MetaSensorDisplayItemModule,
|
||||
// SensorItemModule
|
||||
PrimeNGModules,
|
||||
// SensorItemModule,
|
||||
// MetaCrawlerModule,
|
||||
// MetaSensorDisplayItemModule,
|
||||
],
|
||||
declarations: [
|
||||
COMPONENTS,
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user