generate varianceString edit-workflow-template

frontend/angular/src/app/components/edit-workflow-template/edit-workflow-template.component.html

@@ -225,7 +225,7 @@
                                         </div>
                                     </div>
                                     <p-panel [collapsed]="!stage.UseMessaging" [toggleable]="stage.UseMessaging"
-                                             header="{{stageMessagesCount(stage)}}" class="messaging">
+                                             header="{{stageMessagesCount(stage)}}" toggler="header" class="messaging">
                                         <div class="form-group row">
                                             <div class="col-md-offset-9 col-md-3">
                                                 <button (click)="addMessage(stage)" *ngIf="stage.UseMessaging"
@@ -275,8 +275,17 @@
                                                     <label for="Variance{{message.ObjectID}}">+/-</label>
                                                     <input [(ngModel)]="message.Variance"
                                                            [disabled]="showLoader"
+                                                           (change)="generateVarianceString(message)"
+                                                           (blur)="toggleInput($event, 'Variance'+message.ObjectID, false)"
+                                                           (focusin)="toggleInput($event, 'Variance'+message.ObjectID, true)"
                                                            class="form-control" id="Variance{{message.ObjectID}}"
+                                                           *ngIf="!showLabel('Variance'+message.ObjectID) || !message.Variance"
                                                            name="Variance{{message.ObjectID}}" type="text">
+                                                    <div
+                                                        (click)="toggleInput($event, 'Variance'+message.ObjectID, true)"
+                                                        *ngIf="showLabel('Variance'+message.ObjectID) && message.Variance">
+                                                        <label>{{message.VarianceString}}</label>
+                                                    </div>
                                                 </div>
                                                 <div class="col-md-2">
                                                     <label title="Business Hours only" class="mb-0">Business Hours
@@ -440,7 +449,7 @@
                                         </div>
                                     </div>
                                     <p-panel [collapsed]="!stage.UseMessaging" [toggleable]="stage.UseMessaging"
-                                             header="{{stageMessagesCount(stage)}}" class="messaging">
+                                             header="{{stageMessagesCount(stage)}}" toggler="header" class="messaging">
                                         <div class="form-group row">
                                             <div class="col-md-offset-9 col-md-3">
                                                 <button (click)="addMessage(stage)" *ngIf="stage.UseMessaging"
@@ -578,7 +587,7 @@
                                         </div>
                                     </div>
                                     <p-panel [collapsed]="!stage.UseMessaging" [toggleable]="stage.UseMessaging"
-                                             header="{{stageMessagesCount(stage)}}" class="messaging">
+                                             header="{{stageMessagesCount(stage)}}" toggler="header" class="messaging">
                                         <div class="form-group row">
                                             <div class="col-md-offset-9 col-md-3">
                                                 <button (click)="addMessage(stage)" *ngIf="stage.UseMessaging"

frontend/angular/src/app/components/edit-workflow-template/edit-workflow-template.component.ts

@@ -249,6 +249,14 @@ export class EditWorkflowTemplateComponent extends BaseComponent implements OnIn
         }
     }
 
+    generateVarianceString(message: WorkflowMessageModel): void {
+
+        if (!message.Variance) {
+            return;
+        }
+        message.VarianceString = `${message.Variance}m`;
+    }
+
     generateDelayString(message: WorkflowMessageModel): void {
 
         if (!message.Delay) {

frontend/angular/src/app/models/workflowMessage.model.ts

@@ -9,6 +9,7 @@ export class WorkflowMessageModel {
     DelayString: string;
     DelayMinutes: number;
     Variance: string;
+    VarianceString: string;
     BusinessHoursOnly: boolean;
     IsWithdrawalMessage: boolean;
     ApplicantSources: Array<ApplicantSourcesEnum>;