From c437d5360c75c1af5417c3681235a0f8015a9a85 Mon Sep 17 00:00:00 2001
From: liuwh7 <liuwh7@asiainfo.com>
Date: Wed, 15 Sep 2021 09:57:09 +0800
Subject: feat: add intent based service

Signed-off-by: liuwh7 <liuwh7@asiainfo.com>
Change-Id: If63eb5e61f01751771ad090728f33214077edd6f
Issue-ID: USECASEUI-605
---
 .../cloud-leased-line.component.html               |  99 ++++++++++++++++
 .../cloud-leased-line.component.less               |  41 +++++++
 .../cloud-leased-line.component.ts                 | 132 +++++++++++++++++++++
 3 files changed, 272 insertions(+)
 create mode 100644 usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.html
 create mode 100644 usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.less
 create mode 100644 usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.ts

(limited to 'usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line')

diff --git a/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.html b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.html
new file mode 100644
index 00000000..331eb7b0
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.html
@@ -0,0 +1,99 @@
+<div>
+  <div nz-row>
+    <button
+      nz-button
+      nzType="primary"
+      class="buy-button"
+      (click)="cloudLeasedLineShow()"
+    >
+      Create
+    </button>
+    <button
+      nz-button
+      nzType="primary"
+      class="buy-button"
+      (click)="smartCloudLeasedLineShow()"
+    >
+      Smart Create
+    </button>
+  </div>
+  <div class="slicing-resource-table-list">
+    <nz-table
+      #basicTable [nzData]="listOfData"
+      [nzFrontPagination]="false"
+      nzShowSizeChanger
+      [nzPageSizeOptions]="[5,10,15,20]"
+      [nzTotal]='total'
+      [(nzPageSize)]="pageSize"
+      [(nzPageIndex)]='pageIndex'
+      [nzLoading]="loading"
+      (nzPageIndexChange)="searchData()"
+      (nzPageSizeChange)="searchData()"
+    >
+      <thead>
+        <tr>
+          <th nzWidth="6%">No</th>
+          <th nzWidth="15%">Communication Service Name</th>
+          <th nzWidth="10%">Intent Instance ID</th>
+          <th nzWidth="6%">Status</th>
+          <th nzWidth="20%">{{"i18nTextDefine_Operationbutton" | translate}}</th>
+        </tr>
+      </thead>
+      <tbody>
+        <ng-template ngFor let-data [ngForOf]="basicTable.data" let-i="index">
+          <tr>
+            <td>{{i+1}}</td>
+            <td>{{ data.name }}</td>
+            <td>{{ data.instanceId }}</td>
+            <td>{{ statusObj[data.status] }}</td>
+            <td>
+              <button
+                nz-button
+                nzType="primary"
+                class="buy-button"
+                (click)="goMonitorService()"
+              >
+                Intent Monitor
+              </button>
+              <button
+                *ngIf="data.status === '3'"
+                nz-button
+                nzType="primary"
+                class="buy-button"
+                (click)="activeCloudLeasedLine(data)"
+              >
+                Active
+              </button>
+              <button
+                *ngIf="data.status === '1'"
+                nz-button
+                nzType="primary"
+                class="buy-button"
+                (click)="inactiveCloudLeasedLine(data)"
+              >
+                Inactive
+              </button>
+              <button
+                nz-button
+                nzType="primary"
+                class="buy-button"
+                (click)="deleteCloudLeasedLine(data)"
+              >
+                Delete
+              </button>
+            </td>
+          </tr>
+        </ng-template>
+      </tbody>
+    </nz-table>
+  </div>
+  <app-smart-cloud-leased-modal
+    [samrtCloudLeasedLineShowFlag]="smartCloudLeasedLineShowFlag"
+    (resolveEmitter)="smartCloudLeasedLineClose($event)"
+  ></app-smart-cloud-leased-modal>
+  <app-cloud-leased-line-modal
+    [modelParams]="resolveResult"
+    [cloudLeasedLineShowFlag]="cloudLeasedLineShowFlag"
+    (cancelEmitter)="cloudLeasedLineClose()"
+  ></app-cloud-leased-line-modal>
+</div>
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.less b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.less
new file mode 100644
index 00000000..df2a899e
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.less
@@ -0,0 +1,41 @@
+nz-select {
+  width: 200px;
+}
+
+.task_status {
+  margin-bottom: 20px;
+
+  span {
+    margin-right: 5%;
+  }
+}
+
+.action-icon {
+  display: inline-block;
+  vertical-align: top;
+}
+
+i.anticon {
+  cursor: pointer;
+  font-size: 18px;
+  padding: 2px 15px;
+  vertical-align: inherit !important;
+
+  &:hover {
+    color: #147dc2;
+  }
+}
+
+.cannotclick {
+  pointer-events: none;
+  color: #aaa;
+  opacity: 0.6;
+}
+
+.buy-button {
+  float: right;
+  margin-right: 2%;
+}
+::ng-deep .ant-table-row .buy-button {
+  float: left;
+}
\ No newline at end of file
diff --git a/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.ts b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.ts
new file mode 100644
index 00000000..bf046545
--- /dev/null
+++ b/usecaseui-portal/src/app/views/services/intent-based-services/cloud-leased-line/cloud-leased-line.component.ts
@@ -0,0 +1,132 @@
+import { Component, OnInit } from "@angular/core";
+import { Router } from "@angular/router";
+import { NzMessageService } from "ng-zorro-antd";
+import { intentBaseService } from "../../../../core/services/intentBase.service";
+
+@Component({
+  selector: 'app-cloud-leased-line',
+  templateUrl: './cloud-leased-line.component.html',
+  styleUrls: ['./cloud-leased-line.component.less']
+})
+export class CloudLeasedLineComponent implements OnInit {
+
+  constructor(
+    private router:Router,
+    private myHttp: intentBaseService,
+    private nzMessage: NzMessageService 
+  ) {}
+
+	ngOnChanges() {}
+
+	ngOnInit() {
+    this.pageIndex = 1;
+    this.pageSize = 10;
+    this.getCloudLeasedLineList();
+  }
+
+	ngOnDestroy() {}
+
+  statusObj: any = {
+    0: 'Incomplete',
+    1: 'Completed',
+    2: 'Deleted',
+    3: 'Inactive'
+  }
+  // 列表数据源
+	listOfData: any[] = [];
+  // 分页信息及总数
+	pageIndex: number = 1;
+	pageSize: number = 10;
+	total: number = 0;
+	loading = false;
+  // 控制弹窗展示变量
+  cloudLeasedLineShowFlag: boolean = false;
+  smartCloudLeasedLineShowFlag: boolean = false;
+  // 初始化查询数据源
+	getCloudLeasedLineList(): void {
+    this.myHttp.getInstanceList({
+      currentPage: this.pageIndex,
+      pageSize: this.pageSize
+    }).subscribe((response) => {
+      const { code, message, data } = response;
+      if (code !== 200) {
+        this.nzMessage.error(message);
+				return;
+      }
+      this.total = data.totalRecords;
+      this.listOfData = [...data.list];
+    }, (err) => {
+      console.log(err);
+    });
+  }
+  // 分页信息变更查询数据
+  searchData(): void {
+    this.getCloudLeasedLineList();
+  }
+  // 解析结果传递到create弹窗
+  resolveResult: any;
+  // 弹窗加载
+	cloudLeasedLineShow(): void {
+	  this.cloudLeasedLineShowFlag = true;
+	}
+  // 弹窗关闭
+	cloudLeasedLineClose(): void {
+    this.cloudLeasedLineShowFlag = false;
+    this.pageIndex = 1;
+    this.pageSize = 10;
+    this.getCloudLeasedLineList();
+  }
+  // smart 弹窗加载
+	smartCloudLeasedLineShow(): void {
+	  this.smartCloudLeasedLineShowFlag = true;
+	}
+  // smart 弹窗关闭
+	smartCloudLeasedLineClose(data): void {
+    this.smartCloudLeasedLineShowFlag = false;
+    if (data.cancel) {
+      return;
+    }
+    this.cloudLeasedLineShowFlag = true;
+    this.resolveResult = {
+      name: 'test',
+      instanceId: '123456',
+      accessPointOne: {
+        name: 'aaa',
+        bandwidth: '20'
+      },
+      cloudPointName: 'aaa',
+    };
+  }
+  // 跳转监控管理页面
+  goMonitorService(): void {
+    this.router.navigateByUrl('/fcaps/monitor_service');
+  }
+
+  activeCloudLeasedLine(row): void {
+    this.myHttp.activeIntentInstance({
+      instanceId: row.instanceId
+    }).subscribe((data) => {
+      console.log(data);
+    }, (err) => {
+      console.log(err);
+    });
+  }
+
+  inactiveCloudLeasedLine(row): void {
+    this.myHttp.invalidIntentInstance({
+      instanceId: row.instanceId
+    }).subscribe((data) => {
+      console.log(data);
+    }, (err) => {
+      console.log(err);
+    });
+  }
+
+  deleteCloudLeasedLine(row): void {
+    this.myHttp.deleteIntentInstance(row.instanceId).subscribe((data) => {
+      console.log(data);
+    }, (err) => {
+      console.log(err);
+    });
+  }
+}
\ No newline at end of file
-- 
cgit 1.2.3-korg