From b1ce3d40b0f056a6275ab9ecb48fd0b16b9bb394 Mon Sep 17 00:00:00 2001
From: od7427 <od7427@att.com>
Date: Thu, 23 Aug 2018 11:49:12 -0400
Subject: APPC CDT to Support Multiple Templates for VNFCs

APPC CDT Should Support Multiple Templates For Configure and
 ConfigModify for VNFs with VNFC level templates.
CDT would be used to create a single reference artifact for a VNF.
For the Configure related actions (Configure and ConfigModify)
 vnfc-type to be shown at the top.  The user would have a new link
 below it, to be able to add each vnfc-type.  For each vnfc-type,
 the user would create the associated template and PD file as usual.
The fix required to modify several visual elements and variables
 related to VNFC Types on MyVNFS page, ReferenceData page, Template
 page and Parameters page. Also a number of supporting services were
 modified. New Modal window type is now used for VNFC-related dialogs.

Change-Id: Ibbbb50e2ff6f96783c0aea89a6870d7c28021ba0
Issue-ID: APPC-1010
Signed-off-by: od7427 <od7427@att.com>
---
 src/app/vnfs/myvnfs/myvnfs.component.html | 42 ++++++++++++++++++++++++++++---
 1 file changed, 38 insertions(+), 4 deletions(-)

(limited to 'src/app/vnfs/myvnfs/myvnfs.component.html')

diff --git a/src/app/vnfs/myvnfs/myvnfs.component.html b/src/app/vnfs/myvnfs/myvnfs.component.html
index 3ce7859..3bfabc3 100644
--- a/src/app/vnfs/myvnfs/myvnfs.component.html
+++ b/src/app/vnfs/myvnfs/myvnfs.component.html
@@ -84,13 +84,13 @@ limitations under the License.
         </div>
     </div>
     <div class="col-lg-12-ln2">
-        <button type="button" (click)="buildNewDesign(content)" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">Create New
-            VNF Type or VNFC Type
+        <button type="button" (click)="createVnfcModal.open()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">
+            Create New VNF Type
         </button>
     </div>
 </div>
 
-<ng-template #content let-c="close" let-d="dismiss">
+<!-- <ng-template #content let-c="close" let-d="dismiss">
     <form ngNativeValidate (ngSubmit)="c('yes')">
         <div class="modal-header">
             <h4 class="modal-title">Enter VNF type and VNFC to proceed</h4>
@@ -130,4 +130,38 @@ limitations under the License.
 
         </div>
     </form>
-</ng-template>
\ No newline at end of file
+</ng-template> -->
+
+<!-- Modal for Create new Vnf -->
+<modal #createVnfcModal>
+    <form ngNativeValidate (ngSubmit)="buildNewDesign('yes')">
+        <modal-header [show-close]="true">
+            <h4 class="modal-title">Enter VNF Type</h4>
+        </modal-header>
+        <modal-body>
+            <div class="form-group row">
+                <label for="example-text-input" class="col-12 col-form-label">Enter Vnf Type</label>
+                <div class="col-12">
+                    <input pattern=".*[^ ].*" required name="vnfType" class="form-control" (ngModelChange)="validateVnfName($event)" [(ngModel)]="vnfType" type="text" id="vnfType">
+                    <span class="error-message">{{errorMessage}}</span>
+                </div>
+
+            </div>
+            <div class="form-check">
+                <label class="form-check-label">
+                    <input  name="vnfcRequired" class="form-check-input" [(ngModel)]="vnfcRequired" type="checkbox"
+                            id="vnfcRequired">
+                    This VNF has VNFC templates
+                </label>
+            </div>
+        </modal-body>
+        <modal-footer [show-default-buttons]="false">
+            <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="buildNewDesign('no')">
+                Proceed To Upload
+            </button>
+            <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" [disabled]="invalid">
+                Next
+            </button>
+        </modal-footer>
+    </form>
+</modal>
-- 
cgit 1.2.3-korg