otf-frontend/client/src/app/shared/modules/create-test-form/create-test-form.component.pug

   1 //-  Copyright (c) 2019 AT&T Intellectual Property.                             #\r
   2 //-                                                                             #\r
   3 //-  Licensed under the Apache License, Version 2.0 (the "License");            #\r
   4 //-  you may not use this file except in compliance with the License.           #\r
   5 //-  You may obtain a copy of the License at                                    #\r
   6 //-                                                                             #\r
   7 //-      http://www.apache.org/licenses/LICENSE-2.0                             #\r
   8 //-                                                                             #\r
   9 //-  Unless required by applicable law or agreed to in writing, software        #\r
  10 //-  distributed under the License is distributed on an "AS IS" BASIS,          #\r
  11 //-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.   #\r
  12 //-  See the License for the specific language governing permissions and        #\r
  13 //-  limitations under the License.                                             #\r
  14 //- #############################################################################\r
  15 \r
  16 \r
  17 form(#testDefinitionForm="ngForm")\r
  18   .row.mb-3\r
  19     .col-sm-6(style="justify-content: flex-end;flex-direction: column;display: flex")\r
  20 \r
  21       //- Diagram\r
  22       .row(style="height: 100%")\r
  23         //- placeholder\r
  24         .col-12(*ngIf="!ptd.currentInstance.bpmnXml", style="text-align:center; opacity: .4")\r
  25           i.fa.fa-5x.fa-object-group\r
  26         //- diagram\r
  27         .col-12(#canvas, [hidden]="!ptd.currentInstance.bpmnXml", style="position: relative; cursor: pointer", (click)="enlargeBpmn()")\r
  28           button(mat-icon-button, color="primary", style="position: absolute; top: 0px; right: 0px; z-index: 100")\r
  29             mat-icon zoom_in\r
  30         \r
  31 \r
  32       //- Upload and version\r
  33       .row\r
  34         .col-sm-6(style="text-align:center")\r
  35           input(id="file", #file, type="file", name="file", ng2FileSelect, [uploader]="bpmnUploader", style="display:none", [hidden]="!ptd.currentInstance.isDeployed", (change)="validateFile()", required)\r
  36           \r
  37           //- when creating new\r
  38           button(mat-raised-button, color="accent", *ngIf="!ptd.currentInstance.isDeployed && !ptd.currentInstance.bpmnXml && isNew", [hidden]="isUploading", (click)="isClicked = true", onclick="file.click();")\r
  39             | Upload Workflow\r
  40           button(mat-raised-button, color="primary", *ngIf="!ptd.currentInstance.isDeployed && ptd.currentInstance.bpmnXml", [hidden]="isUploading", onclick="file.click();")\r
  41             | Change Workflow\r
  42 \r
  43           //- when editing\r
  44           //- button(mat-raised-button, color="primary", *ngIf="!isNew && ptd.currentInstance.isDeployed", [hidden]="isUploading", (click)="newVersion(this.ptd.processDefinitionKey)", onclick="file.click();")\r
  45           //-   | New Version\r
  46           h4(*ngIf="ptd.currentInstance.isDeployed") Deployed\r
  47           \r
  48           mat-spinner(style="margin:auto", [diameter]="30", [hidden]="!isUploading")\r
  49 \r
  50         .col-sm-6\r
  51           mat-form-field(*ngIf="ptd.processDefinitionKey != null")\r
  52             input(matInput, placeholder="Process Definition Key", name="processDefinitionKey", maxlength="22", [disabled]="hasBeenSaved", (keyup)="checkProcessDefinitionKey()", [(ngModel)]="ptd.processDefinitionKey", required)\r
  53             mat-spinner(matSuffix, *ngIf="pStatus == 'loading'", [diameter]="19")\r
  54             mat-icon(matSuffix, *ngIf="pStatus == 'unique'", style="color: green") check\r
  55             mat-icon(matSuffix, *ngIf="pStatus == 'notUnique'", style="color: red") error_outline\r
  56 \r
  57     .col-sm-6\r
  58       mat-form-field(style="width:100%")\r
  59         input(matInput, type="text", placeholder="Name", name="name", [disabled]="(existingTd && !hasBeenSaved) || !ptd.currentInstance.bpmnXml", [(ngModel)]="ptd.testName", required)\r
  60         mat-error Required\r
  61       mat-form-field(style="width:100%")\r
  62         input(matInput, type="text", placeholder="Description", name="description", [disabled]="(existingTd && !hasBeenSaved) || !ptd.currentInstance.bpmnXml", [(ngModel)]="ptd.testDescription", required)\r
  63         mat-error Required\r
  64       //- mat-form-field(style="width:100%")\r
  65       //-   mat-select((selectionChange)="markAsDirty()", name="ns", [disabled]="(existingTd && !hasBeenSaved) || !ptd.currentInstance.bpmnXml", placeholder="Group", [(value)]="ptd.groupId", required)\r
  66       //-     mat-option(*ngFor="let group of groups", value="{{group._id}}") {{ group.groupName }}\r
  67       //-   mat-error Required\r
  68       mat-form-field(style="width:100%")\r
  69         input(matInput, type="text", *ngIf="!hasBeenSaved", placeholder="Version", name="version", [(ngModel)]="ptd.currentInstance.version", (keyup)="checkVersionUnique()", required)\r
  70         mat-select((selectionChange)="switchVersion(ptd.currentVersionName)", placeholder="Version", name="selectedVersion", *ngIf="hasBeenSaved", [(value)]="ptd.currentVersionName", required)\r
  71           mat-option(*ngFor="let instance of ptd.bpmnInstances.slice().reverse()", value="{{instance.version}}") {{ instance.version }}\r
  72         mat-error Required\r
  73         button(mat-button, matSuffix, color="primary", *ngIf="hasBeenSaved", (click)="newVersion(this.ptd.processDefinitionKey)", onclick="file.click();") New\r
  74 \r
  75       button(mat-button, (click)="viewer.download()", color="primary")\r
  76         mat-icon cloud_download\r
  77         span.ml-2 Download\r
  78         \r
  79       \r
  80   .row\r
  81     .col-12(*ngIf="ptd.currentInstance")\r
  82       mat-accordion\r
  83         mat-expansion-panel([expanded]="ptd.currentInstance.dataTestHeads.length > 0")\r
  84           mat-expansion-panel-header\r
  85             mat-panel-title Test Heads\r
  86             mat-panel-description(*ngIf="ptd.currentInstance.dataTestHeads") {{ ptd.currentInstance.dataTestHeads.length > 0? ptd.currentInstance.dataTestHeads.length : '' }}\r
  87           .ps(style="position: relative; max-height: 105px", [perfectScrollbar])\r
  88             div(style="white-space: nowrap")\r
  89               .mr-4.text-center(*ngFor=("let task of ptd.currentInstance.dataTestHeads; index as i; trackBy: trackByFn"), style="display:inline-block")\r
  90                 .text-muted {{task.bpmnVthTaskId}}\r
  91                 button(color="accent", mat-fab, (click)="selectTestHead(i)")\r
  92                   i.fa.fw.fa-gears.fa-2x(style="color:white")\r
  93                 p.text-muted {{ (task.testHead && task.testHead.testHeadName) ? task.testHead.testHeadName : '' }}\r
  94       mat-expansion-panel([expanded]="true")\r
  95         mat-expansion-panel-header\r
  96           mat-panel-title Resources\r
  97           mat-panel-description A single .zip file with scripts\r
  98         input(type="file", #scripts, id="scripts", name="scripts", hidden,  (change)="markAsDirty()", ng2FileSelect, [uploader]="uploader", accept="application/zip")\r
  99         .row(*ngIf="ptd.currentInstance.resourceFileId")\r
 100           .col-12\r
 101             mat-list\r
 102               mat-list-item\r
 103                 mat-icon(mat-list-icon) insert_drive_file\r
 104                 h4(mat-line) {{ptd.currentInstance.resourceFileName }}\r
 105         .row(*ngIf="!ptd.currentInstance.isDeployed")\r
 106           .col-md-3\r
 107             //- .mb-2 TESTING GIT TRACKING\r
 108             //-   | Multiple Files \r
 109             //-   mat-slide-toggle(color="primary", name="isZip", [(ngModel)]="isZip", (change)="uploader.clearQueue()")\r
 110             //-   |  .zip\r
 111             //- div \r
 112             //-   input(*ngIf="!isZip", type="file", name="scripts", ng2FileSelect, [uploader]="uploader", multiple)\r
 113             \r
 114             button(mat-raised-button, *ngIf="isZip && !ptd.currentInstance.resourceFileId", onclick="scripts.click()", color="primary") Choose File\r
 115             button(mat-raised-button, *ngIf="isZip && ptd.currentInstance.resourceFileId", onclick="scripts.click()", color="primary") Replace File\r
 116           .col-md-8.ml-2\r
 117             div(*ngIf="uploader.queue.length > 0")\r
 118               label File:\r
 119               ul.list-group(style="position:relative")\r
 120                 li.list-group-item(*ngFor="let item of uploader.queue")\r
 121                   | {{ item?.file?.name }}\r
 122                   div.upload-progress([ngStyle]="{'width': item.progress + '%'}")\r
 123               //- button.pull-right(mat-button, (click)="upload()") Upload All\r
 124               label(*ngIf="ptd.currentInstance.resourceFileId && uploader.queue.length > 0 && !saved") This will replace the previous resouce file\r
 125               button.pull-right(mat-button, color="primary", (click)="clearQueue()") Remove All\r
 126         .row(*ngIf="ptd.currentInstance.isDeployed")\r
 127           .col-12(*ngIf="!ptd.currentInstance.resourceFileId")\r
 128             | No resources were deployed with this version\r
 129             \r
 130 \r
 131     .col-12(*ngIf="ptd.currentInstance.testDataTemplate != {}")\r
 132       h5.text-muted.mt-4 testInputTemplate.yaml\r
 133       div(style="border: 1px solid lightgrey; font-size: 16px !important")\r
 134         codemirror([config]="codeConfig", [(ngModel)]='ptd.currentInstance.testDataTemplate', name="testConfig")\r
 135 \r
 136   .row(style="height:30px")\r
 137   .row.form-buttons\r
 138     .col-12.mt-3\r
 139       .pull-left\r
 140         .mr-3(mat-button, *ngIf="hasBeenSaved && saved && !testDefinitionForm.dirty") saved\r
 141           mat-icon(style="color:green") check\r
 142       .pull-right\r
 143         //save\r
 144         button.mr-3(mat-raised-button, *ngIf="!hasBeenSaved && !inProgress", color="primary", [disabled]="!testDefinitionForm.form.valid || !ptd.currentInstance.bpmnXml || !successUpload || pStatus == 'notUnique'", (click)="save()") Save\r
 145 \r
 146         //update\r
 147         button.mr-3(mat-raised-button, *ngIf="hasBeenSaved && !inProgress", color="primary", [disabled]="!testDefinitionForm.form.valid || !ptd.currentInstance.bpmnXml  || !testDefinitionForm.dirty || !successUpload", (click)="update()") Update\r
 148         \r
 149         //save and deploy\r
 150         button.mr-3(mat-raised-button, color="accent",  [disabled]="!testDefinitionForm.form.valid || !ptd.currentInstance.bpmnXml || !successUpload || pStatus == 'notUnique'", *ngIf="!ptd.currentInstance.isDeployed && !hasBeenSaved && !saved && !inProgress", (click)="saveDeploy()") Save & Deploy\r
 151         \r
 152         //update and deploy\r
 153         button.mr-3(mat-raised-button, color="accent", [disabled]="!testDefinitionForm.form.valid || !ptd.currentInstance.bpmnXml || !successUpload", *ngIf="!ptd.currentInstance.isDeployed && hasBeenSaved && testDefinitionForm.dirty && !inProgress", (click)="updateDeploy()") Update & Deploy\r
 154 \r
 155         //deploy\r
 156         button.mr-3(mat-raised-button, color="accent", [disabled]="!testDefinitionForm.form.valid || !ptd.currentInstance.bpmnXml || !successUpload", *ngIf="!ptd.currentInstance.isDeployed && hasBeenSaved && testDefinitionForm.pristine && !inProgress", (click)="deploy()") Deploy\r
 157       \r
 158         //delete\r
 159         button.mr-3(mat-raised-button, color="warn", *ngIf="hasBeenSaved && !inProgress", (click)="deleteVersion()") Delete Version\r
 160 \r
 161         //- button((click)="print()") print\r
 162         \r
 163         //In Progress\r
 164         button.mr-3(mat-raised-button, *ngIf="inProgress", color="primary", disabled)\r
 165           mat-spinner([diameter]="19", style="display:inline")\r
 166           div.ml-4(style="display:inline") In Progress\r
 167         \r