Added target and terminal support in Dashboard

[src/xds/xds-agent.git] / webapp / src / app / pages / targets / target-card / target-card.component.ts

diff --git a/webapp/src/app/pages/targets/target-card/target-card.component.ts b/webapp/src/app/pages/targets/target-card/target-card.component.ts
new file mode 100644 (file)
index 0000000..6d43260
--- /dev/null
+++ b/webapp/src/app/pages/targets/target-card/target-card.component.ts
@@ -0,0 +1,87 @@
+/**
+* @license
+* Copyright (C) 2018 "IoT.bzh"
+* Author Sebastien Douheret <sebastien@iot.bzh>
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+
+import { Component, Input, Pipe, PipeTransform } from '@angular/core';
+import { TargetService, ITarget, TargetType, TargetTypeEnum, TargetTypes } from '../../../@core-xds/services/target.service';
+import { AlertService } from '../../../@core-xds/services/alert.service';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { ConfirmModalComponent, EType } from '../../confirm/confirm-modal/confirm-modal.component';
+import { find } from 'rxjs/operator/find';
+import { findIndex } from 'rxjs/operator/findIndex';
+
+@Component({
+  selector: 'xds-target-card',
+  styleUrls: ['./target-card.component.scss'],
+  templateUrl: './target-card.component.html',
+})
+export class TargetCardComponent {
+
+  // FIXME workaround of https://github.com/angular/angular-cli/issues/2034
+  // should be removed with angular 5
+  // @Input() target: ITarget;
+  @Input() target = <ITarget>null;
+
+  constructor(
+    private alert: AlertService,
+    private targetSvr: TargetService,
+    private modalService: NgbModal,
+  ) {
+  }
+
+  delete(tgt: ITarget) {
+
+    const modal = this.modalService.open(ConfirmModalComponent, {
+      size: 'lg',
+      backdrop: 'static',
+      container: 'nb-layout',
+    });
+    modal.componentInstance.title = 'Confirm SDK deletion';
+    modal.componentInstance.type = EType.YesNo;
+    modal.componentInstance.question = `
+      Do you <b>permanently delete '` + tgt.name + `'</b> target ?
+      <br><br>
+      <i><small>(Target ID: ` + tgt.id + ` )</small></i>`;
+
+    modal.result
+      .then(res => {
+        if (res === 'yes') {
+          this.targetSvr.delete(tgt).subscribe(
+            r => { },
+            err => this.alert.error('ERROR delete: ' + err),
+          );
+        }
+      });
+
+  }
+
+}
+
+// Make Target type human readable
+@Pipe({
+  name: 'readableType',
+})
+
+export class TargetReadableTypePipe implements PipeTransform {
+  transform(type: TargetTypeEnum): string {
+    const tt = TargetTypes.find(el => type === el.value);
+    if (tt) {
+      return tt.display;
+    }
+    return String(type);
+  }
+}