diff options
Diffstat (limited to 'ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html')
-rw-r--r-- | ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html | 481 |
1 files changed, 263 insertions, 218 deletions
diff --git a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html index 028c9807..63062109 100644 --- a/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html +++ b/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/form-fields/form-fields.component.html @@ -1,242 +1,287 @@ <app-sql-validate-changes-dialog-component [(visible)]="showDialog1"> - <span class="ecomp-spinner" *ngIf="showVerifySpinner"></span> - <div *ngIf="!showVerifySpinner"> + <span *ngIf="showVerifySpinner" class="ecomp-spinner"></span> + <div *ngIf="!showVerifySpinner"> <div class="card"> <div class="card-body" style="width: 800px; height: 615px; "> <div style="height:600px; overflow: scroll;"> - <div class="modalTitle">{{Validatestatus}}</div> - <button *ngIf="Validateclosable" (click)="closeValidateModal()" aria-label="Close" class="dialog__close-btn">X</button> - <br/> - <app-sql-validate-success-dialog-component [tableObj] = "validateResponseString"></app-sql-validate-success-dialog-component> - <!-- <app-sql-validate-error-dialog-component *ngIf="!ValidatePostResponse.query" [tableObj] = "GetValidateResponseString()"></app-sql-validate-error-dialog-component> --> + <div class="modalTitle">{{Validatestatus}}</div> + <button (click)="closeValidateModal()" *ngIf="Validateclosable" aria-label="Close" + class="dialog__close-btn">X + </button> + <br/> + <app-sql-validate-success-dialog-component + [tableObj]="validateResponseString"></app-sql-validate-success-dialog-component> + <!-- <app-sql-validate-error-dialog-component *ngIf="!ValidatePostResponse.query" [tableObj] = "GetValidateResponseString()"></app-sql-validate-error-dialog-component> --> </div> </div> <div class="card-footer" style="width: 800px;"> - <button style="font-size: 17px;" (click)="closeValidateModal()" class="btn btn-alt btn-small">Close</button> + <button (click)="closeValidateModal()" class="btn btn-alt btn-small" style="font-size: 17px;">Close + </button> </div> </div> - </div> + </div> </app-sql-validate-changes-dialog-component> -<app-form-fields-add-edit [(visible)]="showDialog" > - <div class="card"> - <div class="card-header"> - <div class="modalTitle">Report Form Field - Edit</div> - <button *ngIf="closable" (click)="close()" aria-label="Close" class="dialog__close-btn">X</button> - <br/> +<app-form-fields-add-edit [(visible)]="showDialog"> + <div class="card"> + <div class="card-header"> + <div class="modalTitle">Report Form Field - Edit</div> + <button (click)="close()" *ngIf="closable" aria-label="Close" class="dialog__close-btn">X</button> + <br/> + </div> + + + <div class="card-body" style="width: 100px; height: 760px; "> + <div style="height:737px; overflow: scroll; overflow-x: hidden;"> + <br/> + <br/> + + + <label class="defaultLabelFontSize">Field Name:</label><label><input [(ngModel)]="fieldName" + class="defaultFontSize" id="fieldName" + type="text" + value="{{fieldName}}"/></label> + + + <br/> + <br/> + <br/> + <div class="field-group"> + <label>Field Type:</label> + <select [(ngModel)]="fieldType" class="browser-default custom-select defaultFontSize" id="fieldType" + required="required" value="{{fieldType}}"> + <option class="defaultFontSize" selected>Select Field Type</option> + <option class="defaultFontSize" value="TEXT">Text Box</option> + <option class="defaultFontSize" value="TEXTAREA">TEXTAREA</option> + <option class="defaultFontSize" value="LIST_BOX">List Box</option> + <option class="defaultFontSize" value="LIST_MULTI_SELECT">Multi-select List Box</option> + <option class="defaultFontSize" value="HIDDEN">Hidden</option> + </select> + </div> + <br/> + <br/> + + <div class="field-group"> + <label>Visible:</label> + <select [(ngModel)]="visible" class="browser-default custom-select defaultFontSize" id="visible" + required="required" value="{{visible}}"> + <option class="defaultFontSize" selected value="YES">YES</option> + <option class="defaultFontSize" value="NO">NO</option> + </select> + </div> + + <br/> + <br/> + <div> + <label class="defaultLabelFontSize">Is used in Group By Clause?:</label> + <label class="defaultLabelFontSize" class="checkbox" for="groupFormField"> + <input [(ngModel)]="groupFormField" class="ng-valid ng-dirty ng-valid-parse ng-touched" id="groupFormField" + type="checkbox" value="{{groupFormField}}"><i class="skin"></i><span></span> + </label> + </div> + + <br/> + <br/> + <div> + <label class="defaultLabelFontSize">SQL as Default Value:</label> + <label class="defaultLabelFontSize" class="checkbox" for="isDefaultSql"> + <input [(ngModel)]="isDefaultSql" class="ng-valid ng-dirty ng-valid-parse ng-touched" id="isDefaultSql" + type="checkbox" value="{{isDefaultSql}}"><i class="skin"></i><span></span> + </label> + </div> + + <div *ngIf="isDefaultSql"> + <br/> + <br/> + <div class="field-group"> + <label>Default SQL:</label> + <textarea [(ngModel)]="fieldDefaultSQL" class="defaultFontSize" id="fieldDefaultSQL" + type="textarea" value="{{fieldDefaultSQL}}"></textarea> + <div class="center"> + <button (click)="verify('Default')" class="btn btn-alt btn-small" style="font-size: 17px;"> + Verify + </button> </div> - - - <div class="card-body" style="width: 1000px; height: 760px; "> - <div style="height:737px; overflow: scroll; overflow-x: hidden;"> - <br/> - <br/> - - - <label class="defaultLabelFontSize">Field Name:</label><label><input class="defaultFontSize" id="fieldName" type="text" [(ngModel)]="fieldName" value="{{fieldName}}"/></label> - - - - <br/> - <br/> - <br/> - <div class="field-group"> - <label>Field Type:</label> - <select class="browser-default custom-select defaultFontSize" id="fieldType" required="required" [(ngModel)]="fieldType" value="{{fieldType}}"> - <option class="defaultFontSize" selected>Select Field Type </option> - <option class="defaultFontSize" value="TEXT">Text Box</option> - <option class="defaultFontSize" value="TEXTAREA">TEXTAREA</option> - <option class="defaultFontSize" value="LIST_BOX">List Box</option> - <option class="defaultFontSize" value="LIST_MULTI_SELECT">Multi-select List Box</option> - <option class="defaultFontSize" value="HIDDEN">Hidden</option> - </select> - </div> - <br/> - <br/> - - <div class="field-group"> - <label>Visible:</label> - <select class="browser-default custom-select defaultFontSize" id="visible" required="required" [(ngModel)]="visible" value="{{visible}}"> - <option class="defaultFontSize" value="YES" selected>YES</option> - <option class="defaultFontSize" value="NO">NO</option> - </select> - </div> - - <br/> - <br/> - <div> - <label class="defaultLabelFontSize">Is used in Group By Clause?:</label> - <label class="defaultLabelFontSize" for="groupFormField" class="checkbox"> - <input id="groupFormField" type="checkbox" class="ng-valid ng-dirty ng-valid-parse ng-touched" [(ngModel)]="groupFormField" value="{{groupFormField}}"><i class="skin"></i><span></span> - </label> - </div> - - <br/> - <br/> - <div> - <label class="defaultLabelFontSize">SQL as Default Value:</label> - <label class="defaultLabelFontSize" for="isDefaultSql" class="checkbox"> - <input id="isDefaultSql" type="checkbox" class="ng-valid ng-dirty ng-valid-parse ng-touched" [(ngModel)]="isDefaultSql" value="{{isDefaultSql}}"><i class="skin"></i><span></span> - </label> - </div> - - <div *ngIf="isDefaultSql"> - <br/> - <br/> - <div class="field-group"> - <label>Default SQL:</label> - <textarea class="defaultFontSize" id="fieldDefaultSQL" type="textarea" [(ngModel)]="fieldDefaultSQL" value="{{fieldDefaultSQL}}"></textarea> - <button style="font-size: 17px;" (click)="verify('Default')" class="btn btn-alt btn-small">Verify</button> - - </div> - </div> - <br/> - <div *ngIf="(fieldDefaultSQL == null || fieldDefaultSQL == '') && isDefaultSql == false"> - <label class="defaultLabelFontSize" >Default Value:</label> - <label><input class="defaultFontSize" id="defaultValue" type="text" [(ngModel)]="defaultValue" value="{{defaultValue}}"/></label> - - - </div> - <br/> - <br/> - <br/> - <div class="field-group"> - <label>Verify Field Value As:</label> - <select class="browser-default custom-select defaultFontSize" id="validationType" required="required" [(ngModel)]="validationType" value="{{validationType}}"> - <option class="defaultFontSize" value="" selected>Select Visibility </option> - <option class="defaultFontSize" value="">Do Not Perform Validation</option> - <option class="defaultFontSize" value="INTEGER">Integer</option> - <option class="defaultFontSize" value="POSITIVE_INTEGER">Positive Integer</option> - <option class="defaultFontSize" value="DATE">Date</option> - <option class="defaultFontSize" value="TIMESTAMP_SEC">Timestamp(Hour, Min, Sec)</option> - <option class="defaultFontSize" value="TIMESTAMP_MIN">Timestamp(Hour, Min)</option> - <option class="defaultFontSize" value="TIMESTAMP_HOUR">Timestamp(Hour)</option> - <option class="defaultFontSize" value="NON_NEGATIVE_INTEGER">Positive Integer Can not Be Zero</option> - <option class="defaultFontSize" value="FLOAT">Any Number</option> - <option class="defaultFontSize" value="NON_NEGATIVE_FLOAT">Positive Number</option> - <option class="defaultFontSize" value="POSITIVE_FLOAT">Positive Number Can Not Be Zero</option> - </select> - </div> - <br/> - <br/> - <div class="field-group"> - <label>SQL Generating Custom List of Values:</label> - <textarea class="defaultFontSize" id="fieldSQL" type="textarea" [(ngModel)]="fieldSQL" value="{{fieldSQL}}"></textarea> - <button style="font-size: 17px;" (click)="verify('Regular')" class="btn btn-alt btn-small">Verify</button> - </div> - <br/> - <br/> - <div> - <label class="defaultLabelFontSize">Provide Predefined List of Values: Do not use Predefined list - Generate list from database:</label><label><input class="defaultFontSize" id="predefinedValue" type="text" [(ngModel)]="predefinedValue" value="{{predefinedValue}}"/></label> - <button style="font-size: 17px;" (click)="addToList(predefinedValue)" class="btn btn-alt btn-small">Add to List</button> - </div> - <br/> - <br/> - - <div> - <div *ngFor="let value of predefinedValueList"> - <div style="margin-left: 5px;"> - <label >{{value.name}}</label> - <mat-icon aria-hidden="false" aria-label="delete" (click)="deleteFromList(value.id)">delete</mat-icon> - </div> - </div> - </div> - </div> - </div> - - <div class="card-footer" style="width: 1000px; height: 65px; padding-left: 770px;"> - <button style="font-size: 17px;" *ngIf="!showConfirmButton" (click)="save();" class="btn btn-alt btn-small">Save</button> - <button style="font-size: 17px;" *ngIf="showConfirmButton" (click)="complete();" class="btn btn-alt btn-small">Confirm</button> - <button style="font-size: 17px;" (click)="close()" class="btn btn-alt btn-small">Cancel</button> - </div> - - + </div> </div> -</app-form-fields-add-edit> + <br/> + <div *ngIf="(fieldDefaultSQL == null || fieldDefaultSQL == '') && isDefaultSql == false"> + <label class="defaultLabelFontSize">Default Value:</label> + <label><input [(ngModel)]="defaultValue" class="defaultFontSize" id="defaultValue" type="text" + value="{{defaultValue}}"/></label> -<div class="stdForm"> - <br/> - <div class="tab-content"> - <h3>Step 4 - Report Form Fields</h3> - + </div> + <br/> + <br/> + <br/> + <div class="field-group"> + <label>Verify Field Value As:</label> + <select [(ngModel)]="validationType" class="browser-default custom-select defaultFontSize" + id="validationType" required="required" value="{{validationType}}"> + <option class="defaultFontSize" selected value="">Select Visibility</option> + <option class="defaultFontSize" value="">Do Not Perform Validation</option> + <option class="defaultFontSize" value="INTEGER">Integer</option> + <option class="defaultFontSize" value="POSITIVE_INTEGER">Positive Integer</option> + <option class="defaultFontSize" value="DATE">Date</option> + <option class="defaultFontSize" value="TIMESTAMP_SEC">Timestamp(Hour, Min, Sec)</option> + <option class="defaultFontSize" value="TIMESTAMP_MIN">Timestamp(Hour, Min)</option> + <option class="defaultFontSize" value="TIMESTAMP_HOUR">Timestamp(Hour)</option> + <option class="defaultFontSize" value="NON_NEGATIVE_INTEGER">Positive Integer Can not Be Zero + </option> + <option class="defaultFontSize" value="FLOAT">Any Number</option> + <option class="defaultFontSize" value="NON_NEGATIVE_FLOAT">Positive Number</option> + <option class="defaultFontSize" value="POSITIVE_FLOAT">Positive Number Can Not Be Zero</option> + </select> + </div> + <br/> + <br/> + <div class="field-group"> + <label>SQL Generating Custom List of Values:</label> + <textarea [(ngModel)]="fieldSQL" class="defaultFontSize" id="fieldSQL" type="textarea" + value="{{fieldSQL}}"></textarea> + <div class="center"> + <button (click)="verify('Regular')" class="btn btn-alt btn-small" + style="font-size: 17px;">Verify + </button> + </div> + </div> + <br/> + <br/> + <div> + <label class="defaultLabelFontSize">Provide Predefined List of Values: Do not use Predefined list - + Generate list from database:</label><label><input [(ngModel)]="predefinedValue" class="defaultFontSize" + id="predefinedValue" type="text" + value="{{predefinedValue}}"/></label> + <button (click)="addToList(predefinedValue)" class="btn btn-alt btn-small" style="font-size: 17px;"> + Add to List + </button> + </div> + <br/> + <br/> + + <div> + <div *ngFor="let value of predefinedValueList"> + <div style="margin-left: 5px;"> + <label>{{value.name}}</label> + <mat-icon (click)="deleteFromList(value.id)" aria-hidden="false" aria-label="delete"> + delete + </mat-icon> + </div> + </div> + </div> + </div> </div> - <span class="ecomp-spinner" *ngIf="showSpinner"></span> - <br/> - <br/> - <h4>Form Field Groups</h4> - <br/> - <div *ngFor="let group of Groups"> - <button class="formFieldGroupButton" mat-button >{{group.name}}</button><mat-icon style="margin-left: 21%;" aria-hidden="false" aria-label="delete" (click)="deleteGroup(group.name)">delete</mat-icon> - <table style="margin-top: 10px;" class="app-data-table"> - - <th class="defaultFontSize">Order Number</th> - <th class="defaultFontSize">Field Name</th> - <th class="defaultFontSize">Delete From Group</th> - - <tr *ngFor="let item of group.formFieldList; let i = index;"> - <td> - {{item.orderSeq}} - </td> - <td> - {{item.name}} - </td> - <td> - <mat-icon aria-hidden="false" aria-label="delete" (click)="deleteFromGroup(item.id)">delete</mat-icon> - </td> - </tr> - - </table> - <br/> + <div class="card-footer" style="width: 1000px; height: 65px; padding-left: 770px;"> + <button (click)="save();" *ngIf="!showConfirmButton" class="btn btn-alt btn-small" style="font-size: 17px;"> + Save + </button> + <button (click)="complete();" *ngIf="showConfirmButton" class="btn btn-alt btn-small" + style="font-size: 17px;">Confirm + </button> + <button (click)="close()" class="btn btn-alt btn-small" style="font-size: 17px;">Cancel</button> </div> + + + </div> +</app-form-fields-add-edit> + + +<div class="stdForm"> + <br/> + <div class="tab-content"> + <h3>Step 4 - Report Form Fields</h3> + + </div> + <span *ngIf="showSpinner" class="ecomp-spinner"></span> + <br/> + <br/> + + <h4>Form Field Groups</h4> + <br/> + <div *ngFor="let group of Groups"> + <button class="formFieldGroupButton" mat-button>{{group.name}}</button> + <mat-icon (click)="deleteGroup(group.name)" aria-hidden="false" aria-label="delete" style="margin-left: 21%;"> + delete + </mat-icon> + <mat-icon (click)="editGroup(group)" aria-hidden="false" aria-label="edit" class="edit-group">edit</mat-icon> + <table class="app-data-table" style="margin-top: 10px;"> + + <th class="defaultFontSize">Order Number</th> + <th class="defaultFontSize">Field Name</th> + <th class="defaultFontSize">Delete From Group</th> + + <tr *ngFor="let item of group.formFieldList; let i = index;"> + <td> + {{item.orderSeq}} + </td> + <td> + {{item.name}} + </td> + <td> + <mat-icon (click)="deleteFromGroup(item.id)" aria-hidden="false" aria-label="delete">delete + </mat-icon> + </td> + </tr> + + </table> <br/> - <div class="field-group"> + </div> + <br/> + <div class="field-group"> <table style="width: auto; margin-left: 70%;"> - <tr> - <td><button style="font-size: 17px;" class="btn btn-alt btn-small" (click)="createGroup()" >Create Group</button></td> - <td><button style="font-size: 17px;" class="btn btn-alt btn-small" (click)="saveFormFieldGroups()" >Save Group</button></td> - </tr> + <tr> + <td> + <button (click)="createGroup()" class="btn btn-alt btn-small" style="font-size: 17px;">Create + Group + </button> + </td> + <td> + <button (click)="saveFormFieldGroups()" class="btn btn-alt btn-small" style="font-size: 17px;">Save + Group + </button> + </td> + </tr> </table> + </div> + <br/> + <h4>Form Field List</h4> + <div *ngIf="!showSpinner"> + + <table class="app-data-table" style="margin-top: 10px;"> + + <th class="defaultFontSize">Order Number</th> + <th class="defaultFontSize">Field Name</th> + <th class="defaultFontSize">Edit</th> + <th class="defaultFontSize">Delete</th> + + <tr *ngFor="let item of formFieldsListObj; let i = index;"> + <td> + {{item.orderSeq}} + </td> + <td> + {{item.name}} + </td> + <td> + <mat-icon (click)="edit(item.id); setDisplayMode('Edit');" aria-hidden="false" aria-label="edit"> + edit + </mat-icon> + </td> + <td> + <mat-icon (click)="delete(item.id)" aria-hidden="false" aria-label="delete">delete</mat-icon> + </td> + </tr> + + </table> + <br/> + + <div class="field-group"> + <button (click)="add(); setDisplayMode('Add');" class="btn btn-alt btn-small" + style="font-size: 17px; margin-left: 80%;">Add + </button> </div> <br/> - <h4>Form Field List</h4> - <div *ngIf="!showSpinner"> - - <table style="margin-top: 10px;" class="app-data-table"> - - <th class="defaultFontSize">Order Number</th> - <th class="defaultFontSize">Field Name</th> - <th class="defaultFontSize">Edit</th> - <th class="defaultFontSize">Order</th> - <th class="defaultFontSize">Delete</th> - - <tr *ngFor="let item of formFieldsListObj; let i = index;"> - <td> - {{item.orderSeq}} - </td> - <td> - {{item.name}} - </td> - <td> - <mat-icon aria-hidden="false" aria-label="edit" (click)="edit(item.id); setDisplayMode('Edit');">edit</mat-icon> - </td> - <td> - <mat-icon *ngIf="!isFirst(i)" aria-hidden="false" aria-label="expand_less" (click)="moveUpward(i)">expand_less</mat-icon> - <mat-icon *ngIf="!isLast(i)" aria-hidden="false" aria-label="expand_more" (click)="moveDownward(i)">expand_more</mat-icon> - </td> - <td> - <mat-icon aria-hidden="false" aria-label="delete" (click)="delete(item.id)">delete</mat-icon> - </td> - </tr> - - </table> - <br/> - - <div class="field-group"> - <button style="font-size: 17px; margin-left: 80%;" class="btn btn-alt btn-small" (click)="add(); setDisplayMode('Add');" >Add</button> - </div> - <br/> - <hr/> - </div> + <hr/> </div> +</div> |