Add functionality
[usecase-ui.git] / usecaseui-portal / src / app / views / maas / build / application-management.component.ts
1 import { Component, OnInit } from '@angular/core';
2 import { NzMessageService, NzModalService } from "ng-zorro-antd";
3 import { Router } from '@angular/router';
4 import { MaasApi } from '@src/app/api/maas.api';
5 import { Application } from './application.type';
6 import { modalClose } from '../knowledge-base-management/knowledge-base.type';
7 import { TranslateService } from '@ngx-translate/core';
8
9 @Component({
10   selector: 'app-application-management',
11   templateUrl: './application-management.component.html',
12   styleUrls: ['./application-management.component.less']
13 })
14 export class ApplicationManagementComponent implements OnInit {
15   data: Application[] = [];
16   createModalShow = false;
17   applicationShow = false;
18   applicationDetail: Object = {};
19   editModalShow = false;
20   applicationId = '';
21   existedNames = [];
22
23   constructor(
24     private myhttp: MaasApi,
25     private message: NzMessageService,
26     private router: Router,
27     private modalService: NzModalService,
28     private translate: TranslateService
29   ) { }
30
31   ngOnInit() {
32     this.getAllApplicationData()
33   }
34
35   getAllApplicationData(): void {
36     this.myhttp.getAllApplication()
37       .subscribe(
38         (data) => {
39           this.data = data.result_body
40           this.existedNames = this.data.map(item => item.applicationName);
41         },
42         () => {
43           this.message.error('Failed to obtain application data');
44         }
45       )
46   }
47
48   create(): void {
49     this.createModalShow = true;
50   }
51
52   createModalClose($event: modalClose): void {
53     this.createModalShow = false;
54     if ($event.cancel) {
55       return;
56     }
57     this.getAllApplicationData()
58   }
59
60   delete(data: Application): void {
61     this.myhttp.deleteApplicationById(data.applicationId).subscribe((data) => {
62       this.getAllApplicationData()
63       if (data.result_header.result_code === 200) {
64         this.message.success('Deleted successfully');
65       } else {
66         this.message.error(data.result_header.result_message);
67       }
68     }, () => {
69       this.message.error('Deletion failed');
70     });
71   }
72
73   navigateToDetail(data: Application): void {
74     this.router.navigate(['maas/use'], { queryParams: { id: data.applicationId, name: data.applicationName } });
75   }
76
77   applicationDetailClose(): void {
78     this.applicationShow = false;
79   }
80
81   displayApplicationDetails(data: Application): void {
82     this.applicationShow = true;
83     this.myhttp.getApplicationById(data.applicationId)
84       .subscribe(
85         (data) => {
86           this.applicationDetail = data.result_body;
87         },
88         () => {
89           this.message.error('Failed to obtain application data');
90         }
91       )
92   }
93
94   edit(data: Application) {
95     this.applicationId = data.applicationId;
96     this.editModalShow = true;
97   }
98
99   showDeleteConfirm(data: Application): void {
100     this.modalService.confirm({
101       nzTitle: this.translate.instant('maas.deleteTitle'),
102       nzContent: this.translate.instant('maas.application.deleteApplicationContent'),
103       nzOkText: 'Yes',
104       nzOkType: 'danger',
105       nzOnOk: () => this.delete(data),
106       nzCancelText: 'No',
107       nzIconType: 'warning',
108     });
109   }
110
111   editModalClose($event: modalClose): void {
112     this.editModalShow = false;
113     if ($event.cancel) {
114       return;
115     }
116     this.getAllApplicationData()
117   }
118
119 }