added ansible server functionality

multiple ansible server for CDT

Issue-ID: APPC-1510
Change-Id: I383bc63705418654efb596c617309821ebbeb9b4
Signed-off-by: Mohamed Asgar Samiulla <ma926a@us.att.com>
diff --git a/src/app/admin/admin.component.html b/src/app/admin/admin.component.html
new file mode 100644
index 0000000..1185957
--- /dev/null
+++ b/src/app/admin/admin.component.html
@@ -0,0 +1,93 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software 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.
+
+============LICENSE_END============================================
+-->
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'" [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+
+<div class="container" style="margin-left:-15px;" *ngIf="noData != true">
+    <table class="table">
+        <thead>
+            <tr>
+                <th>CONFIGURATION SERVER <i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='serverandport'" aria-hidden="true"></i></th>
+                <th>CLOUD-OWNER/CLOUD-REGION/TENANT<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='ownerid'" aria-hidden="true"></i></th>
+                <th>DESCRIPTION</th>
+                <th>MODIFIER<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='modifier'" aria-hidden="true"></i></th>
+                <th>DATE MODIFIED<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='modified-date'" aria-hidden="true"></i></th>
+                <th></th>
+            </tr>
+        </thead>
+
+        <tbody style="padding: 5px 5px">
+            <tr *ngFor="let item of displayAnsibleServerData | orderBy:sortBy:sortOrder; let i=index">
+                <td><strong>{{item['serverandport']}}</strong></td>
+
+                <td>
+                    <table class="table">
+                        <thead></thead>
+                        <tbody style="padding: 5px 5px">
+                            <tr *ngFor="let info of item.info">
+                                <td><strong>{{info.ownerid}} / {{info.regionid}}</strong> / {{info.tenantid}}</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </td>
+
+                <td><strong>{{item['descr']}} </strong></td>
+
+                <td><strong>{{item['modifier']}} </strong></td>
+
+                <td><strong>{{item['modified-date']}} </strong></td>
+
+                <td>
+                    <button type="button" class="mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="viewAnbsibleServer(item,i)" style="width:100px;height:40px;">
+                                        <i class="fa fa-edit"></i> View/Edit
+                                    </button>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+
+</div>
+
+
+<div *ngIf="noData == true" class="text-center">
+    <div class="card">
+        <div class="mdl-dialog__content">
+            <div class="mdl-card__title">
+                <h2 class="mdl-card__title-text">There is no admin Artifacts</h2>
+            </div>
+            <div class="mdl-card__supporting-text">
+                {{noDataMsg}}
+            </div>
+        </div>
+    </div>
+</div>
+<div class="col-lg-12-ln2">
+    <button type="button" (click)="createAnsibleServer()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">
+            CREATE NEW SERVER
+        </button>
+    <button type="button" (click)="download()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">
+            DOWNLOAD ALL TO PC
+        </button>
+    <button type="button" (click)="saveToAppc()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">
+            SAVE ALL TO APPC
+        </button>
+</div>
\ No newline at end of file