diff options
Diffstat (limited to 'public/src/app/general/general.component.html')
| -rw-r--r-- | public/src/app/general/general.component.html | 83 |
1 files changed, 83 insertions, 0 deletions
diff --git a/public/src/app/general/general.component.html b/public/src/app/general/general.component.html new file mode 100644 index 0000000..dcea57a --- /dev/null +++ b/public/src/app/general/general.component.html @@ -0,0 +1,83 @@ +<form #generalForm="ngForm" novalidate style="display: flex; margin: 1em;"> + <div class="left"> + + <div class="import-wrapper" style="display: flex" *ngIf="store.generalflow === 'import' && !importCompleted"> + <div class="field" style="width:70%"> + <div class="field-label required" style="display: flex;"> + <span>Select existing VFCMT</span> + </div> + <ng-select name="vfcmt" [items]="vfcmts" required [virtualScroll]="true" placeholder="Select VFCMT" [(ngModel)]="selectedVfcmt" + class="vfcmt-list" (change)="vfcmtChange($event)"> + </ng-select> + </div> + + <div class="field" style="width:30%"> + <div class="field-label required" style="display: flex;"> + <span>Select version</span> + </div> + <select name="version" required data-tests-id="vfcmtVersion" [(ngModel)]="selectedVersion" [style.background]="versions.length == 0 ? '#ebebe4' : 'white'" + (ngModelChange)="versionChange($event)" [disabled]="versions.length == 0" style="width: 100%; height: 30px;"> + <option [ngValue]="null" disabled>Select version</option> + <option *ngFor="let item of versions" [value]="item.version">{{item.version}}</option> + </select> + </div> + </div> + + <div class="field"> + <div class="field-label required">Name</div> + <input type="text" name="name" ngModel required [(ngModel)]="newVfcmt.name" class="field-text" [disabled]="this.store.isEditMode || disableName" + data-tests-id="nameMc" /> + </div> + + <div class="field"> + <div class="field-label required">Description</div> + <textarea required name="description" ngModel [(ngModel)]="newVfcmt.description" style="resize: none;" cols="30" rows="10" + class="field-text" data-tests-id="descMc" [disabled]="this.store.isEditMode || disableDescription"></textarea> + </div> + + <div class="field" *ngIf="store.generalflow === 'new'"> + <div class="field-label required" style="display: flex;"> + <span>Template</span> + <span style="padding-left: 5px;" [innerHTML]="'help-circle' | feather:14"></span> + </div> + <select name="template" [disabled]="this.store.isEditMode" required [(ngModel)]="newVfcmt.template" (ngModelChange)="onChangeTemplate($event)" + data-tests-id="templateDdl" class="field-text" [style.background]="this.store.isEditMode ? '#ebebe4' : 'white'"> + <option [ngValue]="null" disabled>Select template</option> + <option *ngFor="let template of templates" [value]="template.uuid" data-tests-id="templateOptions">{{template.name}}</option> + </select> + </div> + + <div class="field" *ngIf="store.generalflow === 'import' || store.generalflow === 'edit'"> + <div class="field-label required" style="display: flex;"> + <span>Flow type</span> + <span style="padding-left: 5px;" [innerHTML]="'help-circle' | feather:14"></span> + </div> + <select name="flowType" [disabled]="this.store.isEditMode || disableFlowType" required [(ngModel)]="newVfcmt.flowType" data-tests-id="flowTypeDdl" + class="field-text" [style.background]="this.store.isEditMode || disableFlowType ? '#ebebe4' : 'white'"> + <option [ngValue]="null" disabled>Select Flow Type</option> + <option *ngFor="let flowType of flowTypes" [value]="flowType" data-tests-id="flowTypeOptions">{{flowType}}</option> + </select> + </div> + + <div class="field"> + <div class="field-label required" style="display: flex;"> + <span>Attached to</span> + <span style="padding-left: 5px;" [innerHTML]="'help-circle' | feather:14"></span> + </div> + <select name="serviceAttached" [disabled]="this.store.isEditMode || disableVnfiList" required [(ngModel)]="newVfcmt.vfni" + data-tests-id="vfniDdl" (ngModelChange)="onChangeVfni($event)" class="field-text" [style.background]="this.store.isEditMode || disableVnfiList ? '#ebebe4' : 'white'"> + <option [ngValue]="null" disabled>Select VFNI</option> + <option *ngFor="let vfi of vfniList" [value]="vfi.resourceInstanceName">{{vfi.resourceInstanceName}}</option> + </select> + </div> + </div> + + <div class="right"> + <div style="padding: 0.7em 0.5em; padding-top: 1em; font-weight: 600;">Flow diagram</div> + <div> + <app-diagram [list]="list"></app-diagram> + <!-- <img style="width:100%; height:100%;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/73/Flag_of_Romania.svg/1200px-Flag_of_Romania.svg.png" + alt="flow"> --> + </div> + </div> +</form> |