Merge pull request #70 from nmaas-platform/48-introduce-improvements-to-the-domain-list-view-1

48 introduce improvements to the domain list view 1

src/app/appmarket/appinstance/appinstance.module.ts

@@ -29,6 +29,7 @@ import {MultiSelectModule} from 'primeng/multiselect';
 import { SelectPodModalComponent } from './modals/select-pod-modal/select-pod-modal.component';
 import {TooltipModule} from 'primeng/tooltip';
 import {AppinstanceSearchPipe} from './appinstance-search.pipe';
+import {InputTextModule} from 'primeng/inputtext';
 
 @NgModule({
   declarations: [
@@ -59,6 +60,7 @@ import {AppinstanceSearchPipe} from './appinstance-search.pipe';
         NgTerminalModule,
         MultiSelectModule,
         TooltipModule,
+        InputTextModule,
     ],
   exports: [
     AppInstanceComponent,

src/app/appmarket/appmanagement/app-add-json-app/app-add-json-app.component.html

@@ -14,7 +14,7 @@
             <div style="margin-bottom: 10px">
                 {{ 'APPS_MANAGEMENT.ADD_JSON_TEXTAREA'| translate}}
             </div>
-            <textarea rows="10" cols="100" pInputTextarea [(ngModel)]="jsonText"></textarea>
+            <textarea rows="10" cols="100" pInputTextarea [(ngModel)]="jsonText" (keyup)="this.JsonError = false"></textarea>
         </div>
         <div class="flex flex-row justify-content-center justify-content-center mt-2">
             <button *ngIf="jsonText.length >0" pButton class="btn btn-success"

src/app/appmarket/appmanagement/app-add-json-version-app/app-add-json-version-app.component.html

 <nmaas-modal style="width: 600px; height: 800px">
-    <div class="nmaas-modal-header">{{ 'APPS_MANAGEMENT.ADD_JSON_version'| translate}}</div>
+    <div class="nmaas-modal-header">{{ 'APPS_MANAGEMENT.ADD_JSON_VERSION'| translate}}</div>
     <div class="nmaas-modal-body">
         <div style="margin-bottom: 10px">
             {{ 'APPS_MANAGEMENT.ADD_JSON_INFO'| translate}}
@@ -14,7 +14,7 @@
             <div style="margin-bottom: 10px">
                 {{ 'APPS_MANAGEMENT.ADD_JSON_TEXTAREA'| translate}}
             </div>
-            <textarea rows="10" cols="100" pInputTextarea [(ngModel)]="jsonText"></textarea>
+            <textarea rows="10" cols="100" pInputTextarea [(ngModel)]="jsonText" (keyup)="this.JsonError = false"></textarea>
         </div>
         <div class="flex flex-row justify-content-center justify-content-center mt-2">
             <button *ngIf="jsonText.length >0" pButton class="btn btn-success"

src/app/appmarket/appmanagement/app-add-json-version-app/app-add-json-version-app.component.ts

@@ -48,7 +48,7 @@ export class AppAddJsonVersionAppComponent implements OnInit {
               },
               error => {
                 console.log(error)
-                this.error = error.message
+                this.error = error.error.message
               })
         } catch (e) {
           console.warn('invalid json')
@@ -72,7 +72,7 @@ export class AppAddJsonVersionAppComponent implements OnInit {
             },
             error => {
               console.log(error)
-              this.error = error.message
+              this.error = error.error.message
             })
       } catch (e) {
         console.warn('invalid json')

src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.html

 <div class="col-sm-12 col-sm-offset-1 col-sm 10 col-md-offset-1 col-md-10">
   <h3>{{'APPS_MANAGEMENT.TITLE'| translate}}</h3>
-  <button [routerLink]="['/admin/apps/create']" class="btn btn-primary">{{ 'APPS_MANAGEMENT.ADD_BUTTON' | translate }}</button>
-  <button (click)="appAddJson.show()" class="btn btn-primary" style="margin-left: 10px">{{ 'APPS_MANAGEMENT.ADD_BUTTON' | translate }} (JSON)</button>
+  <div style="display:flex; justify-content: space-between">
+    <div style="display:flex">
+      <button [routerLink]="['/admin/apps/create']" class="btn btn-primary">{{ 'APPS_MANAGEMENT.ADD_BUTTON' | translate }}</button>
+      <button (click)="appAddJson.show()" class="btn btn-primary" style="margin-left: 10px">{{ 'APPS_MANAGEMENT.ADD_BUTTON' | translate }} (JSON)</button>
+    </div>
+    <div style="display: flex">
+      <input pInputText id="searchText" type="text"  placeholder="Search" (keyup)="searchApp($event.target.value)">
 
-  <hr>
-  <table class="table table-hover table-condensed" aria-describedby="Apps management table">
+    </div>
+  </div>
+
+
+  <table class="table table-hover table-condensed" aria-describedby="Apps management table" style="margin-top:15px">
     <thead>
     <tr>
       <th scope="col"></th>

src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.ts

@@ -27,6 +27,8 @@ export class AppManagementListComponent implements OnInit {
 
     public versionRowVisible: boolean[] = []
 
+    public filteredApps: ApplicationBase[] = [];
+
     constructor(public appsService: AppsService,
                 public router: Router,
                 public authService: AuthService) {
@@ -84,8 +86,22 @@ export class AppManagementListComponent implements OnInit {
             })
         ).subscribe(val => {
             this.apps = val;
+            this.filteredApps = val;
             this.versionRowVisible = new Array(val.length).fill(false);
         });
     }
 
+    public searchApp(value: string) {
+        const result = [];
+        if (value !== null && value !== '') {
+            this.apps.forEach(app => {
+                if (app.name.toLowerCase().includes(value.toLowerCase())) {
+                    result.push(app)
+                }
+            })
+            this.apps = result;
+        } else {
+            this.apps = this.filteredApps
+        }
+    }
 }

src/app/shared/users/list/userslist.component.css

@@ -26,3 +26,8 @@ tr.clickable {
 :host ::ng-deep .p-dropdown {
     width: 170px;
 }
+
+.space-between {
+    display: flex;
+    justify-content: end;
+}