@csmart/ngc-smart-victim 0.1.3 → 0.1.7

package/bundles/csmart-ngc-smart-victim.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common/http'), require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('apollo-angular'), require('@angular/common'), require('@angular/router'), require('@angular/material/table'), require('@angular/material'), require('@angular/forms'), require('@angular/cdk/table'), require('@angular/cdk/layout'), require('@csmart/ngc-smart-address'), require('@angular/cdk/coercion'), require('@angular/material/dialog'), require('@angular/platform-browser/animations'), require('@angular/material/icon'), require('@angular/material/snack-bar'), require('@azure/msal-angular'), require('@csmart/ngc-smart-core')) :
-    typeof define === 'function' && define.amd ? define('@csmart/ngc-smart-victim', ['exports', '@angular/common/http', '@angular/core', 'rxjs', 'rxjs/operators', 'apollo-angular', '@angular/common', '@angular/router', '@angular/material/table', '@angular/material', '@angular/forms', '@angular/cdk/table', '@angular/cdk/layout', '@csmart/ngc-smart-address', '@angular/cdk/coercion', '@angular/material/dialog', '@angular/platform-browser/animations', '@angular/material/icon', '@angular/material/snack-bar', '@azure/msal-angular', '@csmart/ngc-smart-core'], factory) :
-    (global = global || self, factory((global.csmart = global.csmart || {}, global.csmart['ngc-smart-victim'] = {}), global.ng.common.http, global.ng.core, global.rxjs, global.rxjs.operators, global.apolloAngular, global.ng.common, global.ng.router, global.ng.material.table, global.ng.material, global.ng.forms, global.ng.cdk.table, global.ng.cdk.layout, global.ngcSmartAddress, global.ng.cdk.coercion, global.ng.material.dialog, global.ng.platformBrowser.animations, global.ng.material.icon, global.ng.material['snack-bar'], global.msalAngular, global.ngcSmartCore));
-}(this, (function (exports, http, core, rxjs, operators, apolloAngular, common, router, table, material, forms, table$1, layout, ngcSmartAddress, coercion, dialog, animations, icon, snackBar, msalAngular, ngcSmartCore) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common/http'), require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('apollo-angular'), require('@angular/common'), require('@angular/router'), require('@angular/material/table'), require('@angular/material'), require('@csmart/ngc-smart-core'), require('@angular/forms'), require('@angular/cdk/table'), require('@angular/cdk/layout'), require('@csmart/ngc-smart-address'), require('@angular/cdk/coercion'), require('@angular/material/dialog'), require('@angular/platform-browser/animations'), require('@angular/material/icon'), require('@angular/material/snack-bar'), require('@azure/msal-angular')) :
+    typeof define === 'function' && define.amd ? define('@csmart/ngc-smart-victim', ['exports', '@angular/common/http', '@angular/core', 'rxjs', 'rxjs/operators', 'apollo-angular', '@angular/common', '@angular/router', '@angular/material/table', '@angular/material', '@csmart/ngc-smart-core', '@angular/forms', '@angular/cdk/table', '@angular/cdk/layout', '@csmart/ngc-smart-address', '@angular/cdk/coercion', '@angular/material/dialog', '@angular/platform-browser/animations', '@angular/material/icon', '@angular/material/snack-bar', '@azure/msal-angular'], factory) :
+    (global = global || self, factory((global.csmart = global.csmart || {}, global.csmart['ngc-smart-victim'] = {}), global.ng.common.http, global.ng.core, global.rxjs, global.rxjs.operators, global.apolloAngular, global.ng.common, global.ng.router, global.ng.material.table, global.ng.material, global.ngcSmartCore, global.ng.forms, global.ng.cdk.table, global.ng.cdk.layout, global.ngcSmartAddress, global.ng.cdk.coercion, global.ng.material.dialog, global.ng.platformBrowser.animations, global.ng.material.icon, global.ng.material['snack-bar'], global.msalAngular));
+}(this, (function (exports, http, core, rxjs, operators, apolloAngular, common, router, table, material, ngcSmartCore, forms, table$1, layout, ngcSmartAddress, coercion, dialog, animations, icon, snackBar, msalAngular) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -2009,10 +2009,12 @@
             this.intakeService = intakeService;
             this.smartWarrantUrl = smartWarrantUrl;
             this.document = document;
+            this.appModuleId = '';
+            this.activatedRoute = null;
             this.victims = [];
             this.victimDetail = (/** @type {?} */ ({}));
             this.showDetail = false;
-            this.victimListFilter = new VictimListFilter;
+            this.victimListFilter = new VictimListFilter();
             this.victimListDataSource = new table.MatTableDataSource();
             this.doSpin = false;
             this.showListFlag = false;
@@ -2067,7 +2069,7 @@
          * @return {?}
          */
         function (record) {
-            console.log('victim edit record');
+            console.log("victim edit record");
             console.log(record);
             console.log(record.victimId);
             this.victimDetail = record;
@@ -2108,6 +2110,32 @@
             this.victimListDataSource.paginator = this.paginator;
             this.victimListDataSource.sort = this.sort;
         };
+        /**
+         * @return {?}
+         */
+        NgcSmartVictimComponent.prototype.ngOnChanges = /**
+         * @return {?}
+         */
+        function () {
+            this.updateAccessControlConfig = {
+                accessType: ngcSmartCore.AccessType.UPDATE,
+                appModuleId: this.appModuleId,
+                roleId: null,
+                route: this.activatedRoute.snapshot,
+            };
+            this.createAccessControlConfig = {
+                accessType: ngcSmartCore.AccessType.CREATE,
+                appModuleId: this.appModuleId,
+                roleId: null,
+                route: this.activatedRoute.snapshot,
+            };
+            this.deleteAccessControlConfig = {
+                accessType: ngcSmartCore.AccessType.DELETE,
+                appModuleId: this.appModuleId,
+                roleId: null,
+                route: this.activatedRoute.snapshot,
+            };
+        };
         /**
          * @return {?}
          */
@@ -2120,47 +2148,53 @@
             var data = this.route.snapshot.data;
             /** @type {?} */
             var myPath = this.router.url.slice(-10);
-            console.log('smart-victim ngOnInit');
+            console.log("smart-victim ngOnInit");
             console.log(this.intakeFlag);
             console.log(myPath);
-            if (this.intakeFlag || myPath == 'victimHome') {
+            if (this.intakeFlag || myPath == "victimHome") {
                 this.isIntake = true;
             }
-            this.displayedColumns = ['lastName', 'firstName'];
-            if (this.showRelationshipColumn == true || myPath == 'victimList' || myPath == 'victimHome') {
+            this.displayedColumns = ["lastName", "firstName"];
+            if (this.showRelationshipColumn == true ||
+                myPath == "victimList" ||
+                myPath == "victimHome") {
                 this.displayedColumns.push("relationship");
             }
             if (this.showOffenderNameColumn == true) {
                 this.displayedColumns.push("offenderName");
             }
-            if (this.showOffenderPhoneColumn == true || myPath == 'victimList' || myPath == 'victimHome') {
+            if (this.showOffenderPhoneColumn == true ||
+                myPath == "victimList" ||
+                myPath == "victimHome") {
                 this.displayedColumns.push("homePhone");
             }
             this.displayedColumns.push("victimId");
             if (this.showSearchForm == true) {
                 this.showListFlag = false;
             }
-            console.log('this.showSearchForm');
+            console.log("this.showSearchForm");
             console.log(this.showSearchForm);
-            console.log('myPath');
+            console.log("myPath");
             console.log(myPath);
-            if (this.showSearchForm == false || myPath == 'victimList' || myPath == 'victimHome') {
+            if (this.showSearchForm == false ||
+                myPath == "victimList" ||
+                myPath == "victimHome") {
                 /** @type {?} */
                 var myOffenderId;
                 if (this.offenderId) {
                     myOffenderId = this.offenderId;
                 }
                 else {
-                    console.log('back from previous page');
+                    console.log("back from previous page");
                     this.showAdd = true;
                     this.showRelationshipColumn = true;
                     //this.displayedColumns.push("relationship");
                     this.showOffenderPhoneColumn = true;
                     // this.displayedColumns.push("homePhone");
-                    this.accessByModule = 'true';
-                    this.showEdit = 'true';
-                    this.showCaseNote = 'true';
-                    this.showSafetyPlan = 'true';
+                    this.accessByModule = "true";
+                    this.showEdit = "true";
+                    this.showCaseNote = "true";
+                    this.showSafetyPlan = "true";
                     myOffenderId = data.selectedOffender.offenderId;
                 }
                 /** @type {?} */
@@ -2169,11 +2203,13 @@
                     lastName: null,
                     firstName: null,
                     pdid: null,
-                    birthDate: null
+                    birthDate: null,
                 };
-                console.log('victimListFilter in smar-victim componenet');
+                console.log("victimListFilter in smar-victim componenet");
                 console.log(victimListFilter);
-                this.victimService.getVictimListByFilter(victimListFilter).subscribe((/**
+                this.victimService
+                    .getVictimListByFilter(victimListFilter)
+                    .subscribe((/**
                  * @param {?} data
                  * @return {?}
                  */
@@ -2192,9 +2228,9 @@
                             d.homePhone = d.workPhone;
                         }
                     }));
-                    console.log('victim data at line 179');
+                    console.log("victim data at line 179");
                     console.log(_this.victims);
-                    console.log('showListFlag');
+                    console.log("showListFlag");
                     console.log(_this.showListFlag);
                     _this.showListFlag = true;
                     if (data.length == 0) {
@@ -2203,18 +2239,20 @@
                 }));
             }
             else {
-                console.log('find filter');
+                console.log("find filter");
                 console.log(this.victimListFilter);
                 if (this.showListFlag === true) {
                     if (this.victimListFilter != null) {
-                        this.victimService.getVictimListByFilter(this.victimListFilter).subscribe((/**
+                        this.victimService
+                            .getVictimListByFilter(this.victimListFilter)
+                            .subscribe((/**
                          * @param {?} data
                          * @return {?}
                          */
                         function (data) {
                             _this.victimListDataSource.data = data;
                             _this.victims = data;
-                            console.log('victim data at line 201');
+                            console.log("victim data at line 201");
                             console.log(data);
                         }));
                     }
@@ -2231,15 +2269,15 @@
          */
         function (phoneNumberString) {
             if (!phoneNumberString)
-                return '';
+                return "";
             /** @type {?} */
-            var cleaned = ('' + phoneNumberString).replace(/\D/g, '');
+            var cleaned = ("" + phoneNumberString).replace(/\D/g, "");
             /** @type {?} */
             var match = cleaned.match(/^(\d{3})(\d{3})(\d{4})$/);
             if (match) {
-                return '(' + match[1] + ') ' + match[2] + '-' + match[3];
+                return "(" + match[1] + ") " + match[2] + "-" + match[3];
             }
-            return '';
+            return "";
         };
         /**
          * @return {?}
@@ -2265,8 +2303,8 @@
              * @return {?}
              */
             function (res) {
-                console.log('save intake step.');
-                _this.snackBar.open('Status Saved.', '', {
+                console.log("save intake step.");
+                _this.snackBar.open("Status Saved.", "", {
                     duration: 3000,
                 });
                 //this.router.navigate(['/warrant '], { queryParams: { intake: 1 } });
@@ -2282,7 +2320,7 @@
          * @return {?}
          */
         function (victimId) {
-            this.router.navigate(['casenote', victimId]);
+            this.router.navigate(["casenote", victimId]);
         };
         /**
          * @param {?} victimId
@@ -2293,7 +2331,7 @@
          * @return {?}
          */
         function (victimId) {
-            this.router.navigate(['saftyPlan', victimId]);
+            this.router.navigate(["saftyPlan", victimId]);
         };
         /**
          * @param {?} filter
@@ -2306,7 +2344,7 @@
         function (filter) {
             var _this = this;
             this.victimListFilter = filter;
-            console.log('this.victimListFilter inside getVictimList');
+            console.log("this.victimListFilter inside getVictimList");
             console.log(this.victimListFilter);
             this.doSpin = true;
             this.victimService.getVictimListByFilter(filter).subscribe((/**
@@ -2332,8 +2370,8 @@
         };
         NgcSmartVictimComponent.decorators = [
             { type: core.Component, args: [{
-                        selector: 'csmart-victim',
-                        template: "<div *ngIf=\"showSearchForm\">\r\n    <app-victim-search-form\r\n    (onSearch)=\"getVictimList($event)\">\r\n    </app-victim-search-form>\r\n</div>\r\n\r\n<div *ngIf=\"showDetail\">\r\n  <csmart-victim-detail [victimDetail]=\"victimDetail\" \r\n                        [staffId]=\"staffId\"\r\n                        [offenderId] =\"offenderId\"\r\n                        [isIntake]=\"isIntake\"\r\n                        (onSave)=\"save($event)\" \r\n                        (onCancel)=\"cancel()\" >\r\n</csmart-victim-detail>\r\n</div>\r\n<div class=\"main-container\">\r\n    \r\n    <div class=\"add-action\" *ngIf=\"showAdd\">\r\n        <button mat-raised-button color=\"primary\" (click)=\"addRecord()\">\r\n          <mat-icon>add</mat-icon>\r\n          Add Victim\r\n        </button>\r\n        &nbsp;&nbsp;\r\n\r\n    <div *ngIf=\"isIntake\">\r\n        <button \r\n        mat-raised-button \r\n        color=\"primary\"         \r\n        (click)=\"saveIntake()\">\r\n        Continue\r\n        </button> \r\n    </div>\r\n\r\n    </div>\r\n   <div *ngIf=\"showListFlag\">\r\n    <mat-card id=\"divVictim\" >\r\n          <mat-card-content >\r\n            <mat-table #table [dataSource]=\"victimListDataSource\" >\r\n\r\n                <ng-container matColumnDef=\"lastName\">\r\n                    <mat-header-cell *matHeaderCellDef>Victim Last Name</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" > {{row.lastName}}  </mat-cell>\r\n                </ng-container>\r\n\r\n\r\n                <ng-container matColumnDef=\"firstName\">\r\n                        <mat-header-cell *matHeaderCellDef >Victim First Name</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{row.firstName}} </mat-cell>\r\n                </ng-container>\r\n               \r\n                <div  *ngIf=\"showRelationshipColumn\">\r\n                    <ng-container matColumnDef=\"relationship\">\r\n                        <mat-header-cell *matHeaderCellDef >Relationship to Offender</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{row.relationship}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n\r\n                <div  *ngIf=\"showOffenderPhoneColumn\">\r\n                    <ng-container matColumnDef=\"homePhone\">\r\n                        <mat-header-cell *matHeaderCellDef >Phone Number</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{formatPhoneNumber(row.homePhone)}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n                \r\n                <div  *ngIf=\"showOffenderNameColumn\">\r\n                    <ng-container matColumnDef=\"offenderName\">\r\n                            <mat-header-cell *matHeaderCellDef>Offender Name</mat-header-cell>\r\n                            <mat-cell *matCellDef=\"let row\" > {{row.offenderName}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n               \r\n               <ng-container matColumnDef=\"victimId\">\r\n                  <mat-header-cell *matHeaderCellDef ></mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" >\r\n                        \r\n                        <!-- <div  *ngIf=\"accessByModule\">\r\n                            <mat-checkbox></mat-checkbox>\r\n                        </div> -->\r\n                        \r\n                        <div  *ngIf=\"showEdit\">\r\n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"View/Edit Victim\" (click)=\"editVictimDetail(row)\">\r\n                                <i class=\"material-icons\">mode_edit</i>\r\n                            </button>\r\n                        </div>\r\n\r\n                        \r\n\r\n                        &nbsp;&nbsp; \r\n\r\n                        <div  *ngIf=\"showCaseNote\">\r\n                            <button type=\"button\" matTooltip=\"CaseNote\"  mat-raised-button color=\"primary\" (click)=\"goToCaseNote(row.victimId)\">                        \r\n                                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Case Note\r\n                            </button> \r\n                        </div>\r\n                         &nbsp;&nbsp;\r\n                       \r\n                         <div  *ngIf=\"showSafetyPlan\">\r\n                        <button type=\"button\"  matTooltip=\"safety plan\" mat-raised-button color=\"primary\" (click)=\"goToSaftyPlan(row.victimId)\">                        \r\n                                <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Safety Plan\r\n                        </button>\r\n                        </div>\r\n                        &nbsp;&nbsp;\r\n   \r\n                    </mat-cell>\r\n                </ng-container>\r\n\r\n                <mat-header-row *matHeaderRowDef=\"displayedColumns\" class=\"example-header-row\"></mat-header-row>\r\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\" class=\"example-row\"></mat-row>\r\n                </mat-table>\r\n\r\n              <mat-paginator #paginator [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator> \r\n          </mat-card-content>\r\n    </mat-card>\r\n    </div>\r\n\r\n    <div>\r\n        <b>{{msg}}</b>\r\n    </div>\r\n</div>",
+                        selector: "csmart-victim",
+                        template: "<div *ngIf=\"showSearchForm\">\r\n    <app-victim-search-form\r\n    (onSearch)=\"getVictimList($event)\">\r\n    </app-victim-search-form>\r\n</div>\r\n\r\n<div *ngIf=\"showDetail\">\r\n  <csmart-victim-detail [victimDetail]=\"victimDetail\" \r\n                        [staffId]=\"staffId\"\r\n                        [offenderId] =\"offenderId\"\r\n                        [isIntake]=\"isIntake\"\r\n                        (onSave)=\"save($event)\" \r\n                        (onCancel)=\"cancel()\" >\r\n</csmart-victim-detail>\r\n</div>\r\n<div class=\"main-container\">\r\n    \r\n    <div class=\"add-action\" *ngIf=\"showAdd\">\r\n        <button mat-raised-button color=\"primary\" \r\n           accessControl\r\n          [accessControlConfig]=\"createAccessControlConfig\"  \r\n          (click)=\"addRecord()\">\r\n          <mat-icon>add</mat-icon>\r\n          Add Victim\r\n        </button>\r\n        &nbsp;&nbsp;\r\n\r\n    <div *ngIf=\"isIntake\">\r\n        <button \r\n        mat-raised-button \r\n        color=\"primary\" \r\n        accessControl\r\n        [accessControlConfig]=\"updateAccessControlConfig\"          \r\n        (click)=\"saveIntake()\">\r\n        Continue\r\n        </button> \r\n    </div>\r\n\r\n    </div>\r\n   <div *ngIf=\"showListFlag\">\r\n    <mat-card id=\"divVictim\" >\r\n          <mat-card-content >\r\n            <mat-table #table [dataSource]=\"victimListDataSource\" >\r\n\r\n                <ng-container matColumnDef=\"lastName\">\r\n                    <mat-header-cell *matHeaderCellDef>Victim Last Name</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" > {{row.lastName}}  </mat-cell>\r\n                </ng-container>\r\n\r\n\r\n                <ng-container matColumnDef=\"firstName\">\r\n                        <mat-header-cell *matHeaderCellDef >Victim First Name</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{row.firstName}} </mat-cell>\r\n                </ng-container>\r\n               \r\n                <div  *ngIf=\"showRelationshipColumn\">\r\n                    <ng-container matColumnDef=\"relationship\">\r\n                        <mat-header-cell *matHeaderCellDef >Relationship to Offender</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{row.relationship}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n\r\n                <div  *ngIf=\"showOffenderPhoneColumn\">\r\n                    <ng-container matColumnDef=\"homePhone\">\r\n                        <mat-header-cell *matHeaderCellDef >Phone Number</mat-header-cell>\r\n                        <mat-cell *matCellDef=\"let row\" > {{formatPhoneNumber(row.homePhone)}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n                \r\n                <div  *ngIf=\"showOffenderNameColumn\">\r\n                    <ng-container matColumnDef=\"offenderName\">\r\n                            <mat-header-cell *matHeaderCellDef>Offender Name</mat-header-cell>\r\n                            <mat-cell *matCellDef=\"let row\" > {{row.offenderName}} </mat-cell>\r\n                    </ng-container>\r\n                </div>\r\n               \r\n               <ng-container matColumnDef=\"victimId\">\r\n                  <mat-header-cell *matHeaderCellDef ></mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" >\r\n                        \r\n                        <!-- <div  *ngIf=\"accessByModule\">\r\n                            <mat-checkbox></mat-checkbox>\r\n                        </div> -->\r\n                        \r\n                        <div  *ngIf=\"showEdit\">\r\n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"View/Edit Victim\"\r\n                                accessControl\r\n                                [accessControlConfig]=\"updateAccessControlConfig\"  \r\n                                (click)=\"editVictimDetail(row)\">\r\n                                <i class=\"material-icons\">mode_edit</i>\r\n                            </button>\r\n                        </div>\r\n\r\n                        \r\n\r\n                        &nbsp;&nbsp; \r\n\r\n                        <div  *ngIf=\"showCaseNote\">\r\n                            <button type=\"button\" matTooltip=\"CaseNote\"  mat-raised-button color=\"primary\" \r\n                            accessControl\r\n                            [accessControlConfig]=\"updateAccessControlConfig\"  \r\n                            (click)=\"goToCaseNote(row.victimId)\">                        \r\n                                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Case Note\r\n                            </button> \r\n                        </div>\r\n                         &nbsp;&nbsp;\r\n                       \r\n                         <div  *ngIf=\"showSafetyPlan\">\r\n                        <button type=\"button\"  matTooltip=\"safety plan\" mat-raised-button color=\"primary\"\r\n                         accessControl\r\n                         [accessControlConfig]=\"updateAccessControlConfig\"  \r\n                         (click)=\"goToSaftyPlan(row.victimId)\">                        \r\n                                <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Safety Plan\r\n                        </button>\r\n                        </div>\r\n                        &nbsp;&nbsp;\r\n   \r\n                    </mat-cell>\r\n                </ng-container>\r\n\r\n                <mat-header-row *matHeaderRowDef=\"displayedColumns\" class=\"example-header-row\"></mat-header-row>\r\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\" class=\"example-row\"></mat-row>\r\n                </mat-table>\r\n\r\n              <mat-paginator #paginator [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator> \r\n          </mat-card-content>\r\n    </mat-card>\r\n    </div>\r\n\r\n    <div>\r\n        <b>{{msg}}</b>\r\n    </div>\r\n</div>",
                         styles: ["div.services{max-width:500px;margin:auto;border:3px solid #73ad21}.rTable{display:block;width:100%}.rTableBody,.rTableFoot,.rTableHeading,.rTableRow{clear:both}.rTableFoot,.rTableHead{background-color:#ddd;font-weight:700}.rTableCell,.rTableHead{border:0;float:left;padding:1px;width:28%}.rTable:after{visibility:hidden;display:block;font-size:0;content:\" \";clear:both;height:0}.victimSearch{display:-ms-grid;display:grid;-ms-grid-columns:1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr;grid-column-gap:10px}.edit-btn{margin-right:4px}.main-container{display:flex;margin-top:8px}.add-action{display:flex;justify-content:flex-end;margin-bottom:8px}.example-headers-align .mat-expansion-panel-header-description,.example-headers-align .mat-expansion-panel-header-title{flex-basis:0}.example-headers-align .mat-expansion-panel-header-description{justify-content:space-between;align-items:center}mat-form-field{margin-right:12px}.actions{display:flex;justify-content:space-around}.Row{display:table;width:100%;table-layout:fixed}.Column{display:table-cell}.sp-form textarea{float:left;margin-top:20px;margin-bottom:10px;width:462px;height:70px;overflow:auto;box-sizing:border-box}.mat-column-firstName,.mat-column-homePhone,.mat-column-lastName,.mat-column-offenderName,.mat-column-relationship{word-wrap:break-word!important;white-space:unset!important;flex:0 0 15%!important;width:15%!important;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-ms-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}.mat-column-victimId{word-wrap:break-word!important;white-space:unset!important;flex:0 0 25%!important;width:25%!important;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-ms-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}"]
                     }] }
         ];
@@ -2362,6 +2400,8 @@
             showSearchForm: [{ type: core.Input }],
             accessByModule: [{ type: core.Input }],
             intakeFlag: [{ type: core.Input }],
+            appModuleId: [{ type: core.Input }],
+            activatedRoute: [{ type: core.Input }],
             paginator: [{ type: core.ViewChild, args: [material.MatPaginator,] }],
             sort: [{ type: core.ViewChild, args: [material.MatSort,] }]
         };
@@ -2395,6 +2435,10 @@
         /** @type {?} */
         NgcSmartVictimComponent.prototype.intakeFlag;
         /** @type {?} */
+        NgcSmartVictimComponent.prototype.appModuleId;
+        /** @type {?} */
+        NgcSmartVictimComponent.prototype.activatedRoute;
+        /** @type {?} */
         NgcSmartVictimComponent.prototype.paginator;
         /** @type {?} */
         NgcSmartVictimComponent.prototype.sort;
@@ -2418,6 +2462,12 @@
         NgcSmartVictimComponent.prototype.msg;
         /** @type {?} */
         NgcSmartVictimComponent.prototype.isIntake;
+        /** @type {?} */
+        NgcSmartVictimComponent.prototype.updateAccessControlConfig;
+        /** @type {?} */
+        NgcSmartVictimComponent.prototype.createAccessControlConfig;
+        /** @type {?} */
+        NgcSmartVictimComponent.prototype.deleteAccessControlConfig;
         /**
          * @type {?}
          * @private
@@ -2722,14 +2772,8 @@
                 email: new forms.FormControl('', forms.Validators.compose([forms.Validators.pattern(this.emailPattern)])),
                 minorFlag: new forms.FormControl('', forms.Validators.compose([forms.Validators.required])),
                 victimAdvocateFlag: new forms.FormControl('', forms.Validators.compose([forms.Validators.required])),
-                guardianLastName: new forms.FormControl('', conditionalValidator((/**
-                 * @return {?}
-                 */
-                function () { return _this.victimForm.get('minorFlag').value; }), forms.Validators.required, 'illuminatiError')),
-                guardianFirstName: new forms.FormControl('', conditionalValidator((/**
-                 * @return {?}
-                 */
-                function () { return _this.victimForm.get('minorFlag').value; }), forms.Validators.required, 'illuminatiError')),
+                guardianLastName: new forms.FormControl(''),
+                guardianFirstName: new forms.FormControl(''),
                 guardianPrefixId: new forms.FormControl(''),
                 guardianSuffixId: new forms.FormControl(''),
                 //guardianGender:new FormControl('', ),
@@ -3113,8 +3157,8 @@
              * @return {?}
              */
             function (value) {
-                _this.victimForm.get('guardianFirstName').updateValueAndValidity();
-                _this.victimForm.get('guardianLastName').updateValueAndValidity();
+                // this.victimForm.get('guardianFirstName').updateValueAndValidity();
+                // this.victimForm.get('guardianLastName').updateValueAndValidity();
                 _this.victimForm.get('guardianWorkPhone').updateValueAndValidity();
                 _this.victimForm.get('guardianHomePhone').updateValueAndValidity();
                 _this.victimForm.get('guardianCellPhone').updateValueAndValidity();
@@ -3139,7 +3183,8 @@
          * @return {?}
          */
         function () {
-            this.onSave.emit(this.victimDetail);
+            //this.onSave.emit(this.victimDetail);
+            this.router.navigate(['victimList']);
         };
         /**
          * @return {?}
@@ -3182,23 +3227,21 @@
          * @return {?}
          */
         function ($event) {
-            /** @type {?} */
-            var guardianLastNameControl = this.victimForm.get('guardianLastName');
-            /** @type {?} */
-            var guardianFirstNameControl = this.victimForm.get('guardianFirstName');
+            // const guardianLastNameControl = this.victimForm.get('guardianLastName');
+            //const guardianFirstNameControl = this.victimForm.get('guardianFirstName');
             if ($event.value === true) {
                 this.guardianTabFlag = true;
-                guardianLastNameControl.setValidators(forms.Validators.required);
-                guardianFirstNameControl.setValidators(forms.Validators.required);
+                // guardianLastNameControl.setValidators(Validators.required);
+                // guardianFirstNameControl.setValidators(Validators.required);
                 //this.victimForm.value.guardianNoPhoneFlag =  true;
             }
             else {
                 this.guardianTabFlag = false;
-                guardianLastNameControl.clearValidators();
-                guardianFirstNameControl.clearValidators();
+                // guardianLastNameControl.clearValidators();
+                // guardianFirstNameControl.clearValidators();
             }
-            guardianLastNameControl.updateValueAndValidity();
-            guardianFirstNameControl.updateValueAndValidity();
+            //guardianLastNameControl.updateValueAndValidity();
+            // guardianFirstNameControl.updateValueAndValidity();
         };
         /**
          * @param {?} $event
@@ -3348,13 +3391,11 @@
                 /** @type {?} */
                 var minorControl = this.victimForm.get('minorFlag');
                 minorControl.setValue(true);
-                /** @type {?} */
-                var guardianLastNameControl = this.victimForm.get('guardianLastName');
-                /** @type {?} */
-                var guardianFirstNameControl = this.victimForm.get('guardianFirstName');
+                //  const guardianLastNameControl = this.victimForm.get('guardianLastName');
+                // const guardianFirstNameControl = this.victimForm.get('guardianFirstName');
                 this.guardianTabFlag = true;
-                guardianLastNameControl.setValidators(forms.Validators.required);
-                guardianFirstNameControl.setValidators(forms.Validators.required);
+                // guardianLastNameControl.setValidators(Validators.required);
+                //  guardianFirstNameControl.setValidators(Validators.required);
             }
         };
         /**
@@ -3696,8 +3737,6 @@
                 }
                 else {
                     //update victim
-                    console.log(' this.victimForm.value.victimOffenderRelationshipTypeId');
-                    console.log(this.victimForm.value.victimOffenderRelationshipTypeId);
                     this.victimDetail.underSupervisionFlag = this.victimForm.value.underSupervisionFlag;
                     this.victimDetail.victimOffenderRelationshipTypeId = this.victimForm.value.victimOffenderRelationshipTypeId;
                     this.victimDetail.lastName = this.victimForm.value.lastName;
@@ -3724,7 +3763,7 @@
                     this.victimDetail.drugUseFlag = this.victimForm.value.drugUseFlag;
                     this.victimDetail.alcoholUseFlag = this.victimForm.value.alcoholUseFlag;
                     this.victimDetail.accessRisk = this.victimForm.value.accessRisk;
-                    this.victimDetail.addressId = this.victimForm.value.addressId;
+                    this.victimDetail.addressId = this.addressId;
                     this.victimDetail.allowCsosaContactFlag = this.victimForm.value.allowCsosaContactFlag;
                     this.victimDetail.victimSupports = [];
                     this.victimForm.value.victimSupports.forEach((/**
@@ -3819,17 +3858,23 @@
                         _this.victimAdvocate.cellPhone = _this.victimForm.value.advocateCellPhone ? _this.victimForm.value.advocateCellPhone : null;
                         _this.victimAdvocate.email = _this.victimForm.value.advocateEmail ? _this.victimForm.value.advocateEmail : null;
                         _this.victimAdvocate.modifiedBy = _this.staffId;
-                        if (_this.victimDetail.victimAdvocateFlag == 'YS' && _this.victimDetail.advocateFirstName != null) {
-                            _this.victimService.putVictimAdvocate(_this.victimDetail.victimId, _this.victimAdvocate).subscribe((/**
-                             * @param {?} resp
-                             * @return {?}
-                             */
-                            function (resp) {
-                            }));
-                        }
-                        else {
-                            console.log('add advocate');
-                            _this.victimService.postVictimAdvocate(_this.victimDetail.victimId, _this.victimAdvocate).subscribe();
+                        console.log('work on advocate part');
+                        if (_this.victimDetail.victimAdvocateFlag == 'YS') {
+                            console.log('work on advocate flag is YS ');
+                            if (_this.victimDetail.advocateFirstName != null) {
+                                console.log('check advocate fisrt name ');
+                                console.log(_this.victimDetail.advocateFirstName);
+                                _this.victimService.putVictimAdvocate(_this.victimDetail.victimId, _this.victimAdvocate).subscribe((/**
+                                 * @param {?} resp
+                                 * @return {?}
+                                 */
+                                function (resp) { }));
+                            }
+                            else {
+                                console.log('add advocate');
+                                console.log(_this.victimAdvocate);
+                                _this.victimService.postVictimAdvocate(_this.victimDetail.victimId, _this.victimAdvocate).subscribe();
+                            }
                         }
                         // guardian section
                         _this.victimGuardian.victimGuardianId = _this.victimDetail.victimId;
@@ -3844,20 +3889,25 @@
                         _this.victimGuardian.cellPhone = _this.victimForm.value.guardianCellPhone ? _this.victimForm.value.guardianCellPhone : null;
                         _this.victimGuardian.email = _this.victimForm.value.guardianEmail ? _this.victimForm.value.guardianEmail : null;
                         _this.victimGuardian.modifiedBy = _this.staffId;
-                        if (_this.victimDetail.minorFlag == true && _this.victimDetail.guardianFirstName != null) {
-                            _this.victimService.putVictimGuardian(_this.victimDetail.victimId, _this.victimGuardian).subscribe((/**
-                             * @param {?} resp
-                             * @return {?}
-                             */
-                            function (resp) {
-                            }));
-                        }
-                        else {
-                            _this.victimService.postVictimGuardian(_this.victimDetail.victimId, _this.victimGuardian).subscribe();
+                        if (_this.victimDetail.minorFlag == true) {
+                            if (_this.victimDetail.guardianFirstName != null)
+                                _this.victimService.putVictimGuardian(_this.victimDetail.victimId, _this.victimGuardian).subscribe((/**
+                                 * @param {?} resp
+                                 * @return {?}
+                                 */
+                                function (resp) {
+                                }));
+                            else {
+                                console.log('add gurdian');
+                                console.log(_this.victimGuardian);
+                                _this.victimService.postVictimGuardian(_this.victimDetail.victimId, _this.victimGuardian).subscribe();
+                            }
                         }
                     }));
                 }
             } //end of this.phoneValidationFlag = false
+            console.log('this.victimDetail');
+            console.log(this.victimDetail);
             this.onSave.emit(this.victimDetail);
         };
         //#endregion "save victim"
@@ -3887,7 +3937,7 @@
         SmartVictimDetailComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'csmart-victim-detail',
-                        template: "<mat-card>\r\n  <mat-card-content>\r\n\r\n        <div  [formGroup]=\"victimForm\">\r\n\r\n          <mat-tab-group dynamicHeight  mat-stretch-tabs>\r\n            <mat-tab label=\"Victim Detail\" >\r\n              <div class='container'>\r\n\r\n                    <mat-form-field>\r\n                      <mat-label>Is victim a minor?<font color=\"red\">* </font></mat-label>\r\n                      <br>\r\n                      <mat-radio-group  formControlName=\"minorFlag\"  (change)=\"radioMinorChange($event)\" [(ngModel)]=\"editVictim.minorFlag\" >\r\n                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                    </mat-radio-group>\r\n                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors \r\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\r\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\r\n                    </div> \r\n\r\n                  </mat-form-field>\r\n                 \r\n                  <mat-form-field>\r\n                    <mat-label>Does the Victim have a Victim Advocate or Social Worker with <br>whom CSOSA should maintain contact?<font color=\"red\">* </font></mat-label>\r\n                    <br>\r\n                    <br>\r\n                    <mat-radio-group class = \"tp-radio-group\"  formControlName=\"victimAdvocateFlag\"  (change)=\"radioAdvocateChange($event)\" [(ngModel)]=\"editVictim.victimAdvocateFlag\">\r\n                      <mat-radio-button  color=\"primary\" *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\">{{item.name}} </mat-radio-button>&nbsp;\r\n                    </mat-radio-group>\r\n                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors \r\n                    && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\r\n                    <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\r\n                    </div> \r\n                  </mat-form-field>\r\n              \r\n \r\n               <mat-form-field>\r\n                  <mat-label>Victim Currently Under Supervision:</mat-label>\r\n                    <mat-select  formControlName=\"underSupervisionFlag\" name=\"supervision\" [(ngModel)]=\"editVictim.underSupervisionFlag\" >\r\n                      <mat-option *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\" >\r\n                        {{item.name}}</mat-option>\r\n                    </mat-select>\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors \r\n                    && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\r\n                    <mat-error>under supervision field is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n               \r\n             \r\n               <mat-form-field>\r\n                  <mat-label>Relationship to Offender:</mat-label>\r\n                    <mat-select formControlName=\"victimOffenderRelationshipTypeId\" [(ngModel)]=\"editVictim.victimOffenderRelationshipTypeId\"  >\r\n                      <mat-option *ngFor=\"let item of relationshipTypes\" [value]=\"item.relationshipTypeId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors \r\n                    && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\r\n                    <mat-error>relationship is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n             \r\n                 \r\n                <mat-form-field>\r\n                  <mat-label>Victim Last Name:</mat-label>\r\n                  <input matInput formControlName=\"lastName\"  [(ngModel)]=\"editVictim.lastName\" >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors \r\n                  && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\r\n                  <mat-error>victim last name is <strong>required</strong></mat-error>\r\n                  </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim First Name: </mat-label>\r\n                  <input matInput  formControlName=\"firstName\" [(ngModel)]=\"editVictim.firstName\"  >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors \r\n                  && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\r\n                  <mat-error>victim first name is <strong>required</strong></mat-error>\r\n                 </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Middle Name:</mat-label>\r\n                    <input matInput  formControlName=\"middleName\" [(ngModel)]=\"editVictim.middleName\">\r\n                </mat-form-field>\r\n                             \r\n                <mat-form-field>\r\n                  <mat-label>Victim Prefix:</mat-label>\r\n                    <mat-select  formControlName=\"prefixId\" [(ngModel)]=\"editVictim.prefixId\">\r\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Suffix:</mat-label>\r\n                    <mat-select  formControlName=\"suffixId\"  [(ngModel)]=\"editVictim.suffixId\">\r\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n  \r\n                <mat-form-field>\r\n                  <mat-label>Victim Gender:</mat-label>\r\n                  <mat-select  formControlName=\"genderCode\" [(ngModel)]=\"editVictim.genderCode\">\r\n                    <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n                </mat-form-field>\r\n                             \r\n                <mat-form-field>\r\n                  <mat-label>Date of Birth:</mat-label>\r\n                   <input matInput \r\n                   [matDatepicker]=\"victimBirthRef\" \r\n                   formControlName=\"birthDate\"\r\n                  [(ngModel)]=\"editVictim.birthDate\"\r\n                  (click)=\"victimBirthRef.open()\"\r\n                  (dateChange)=\"handleDOBChange($event)\"  \r\n                    >\r\n                  <mat-datepicker-toggle [for]=\"victimBirthRef\" matSuffix></mat-datepicker-toggle>\r\n                  <mat-datepicker #victimBirthRef></mat-datepicker>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Home Phone:</mat-label>\r\n                    <input \r\n                    matInput \r\n                    formControlName=\"homePhone\" \r\n                    [(ngModel)]=\"editVictim.homePhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\"/>\r\n\r\n\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('homePhone').errors\r\n                  && (victimForm.get('homePhone').dirty || victimForm.get('homePhone').touched)\">\r\n\r\n\r\n                  <mat-error><strong>Home phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Victim Cell Phone:</mat-label>\r\n                  <input matInput  formControlName=\"cellPhone\" [(ngModel)]=\"editVictim.cellPhone\" >\r\n                      <div class=\"help-block\" *ngIf=\"victimForm.get('cellPhone').errors \r\n                  && (victimForm.get('cellPhone').dirty || victimForm.get('cellPhone').touched)\">\r\n                   <mat-error><strong>Cell phone number format is not correct.</strong></mat-error>\r\n              </div>\r\n                </mat-form-field>\r\n\r\n               \r\n                <mat-form-field >\r\n                  <mat-label>Victim Work Phone:</mat-label>\r\n                  <input matInput  formControlName=\"workPhone\"  [(ngModel)]=\"editVictim.workPhone\" >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('workPhone').errors \r\n                  && (victimForm.get('workPhone').dirty || victimForm.get('workPhone').touched)\">\r\n                  <mat-error><strong>Work phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Victim Email:</mat-label>\r\n                   <input matInput  formControlName=\"email\" [(ngModel)]=\"editVictim.email\" >\r\n                   <div class=\"help-block\" *ngIf=\"victimForm.get('email').errors \r\n                  && (victimForm.get('email').dirty || victimForm.get('email').touched)\">\r\n                  <mat-error><strong>victim email format is not correct.</strong></mat-error>\r\n              </div>\r\n                </mat-form-field>\r\n  \r\n                <div></div>\r\n              \r\n                <app-smart-address \r\n                [showPsa]=\"true\" \r\n                [modifiedBy]=\"staffId\" \r\n                [id]=\"addressId\"\r\n                (addressIdChange)=\"onAddressChange($event)\"\r\n                [outline]=\"true\" \r\n                readonly=\"false\"\r\n                [rowHeight]=\"80\" \r\n                (isValid)=\"false\" \r\n                [addressValidators]=\"addressValidators\"\r\n                #addressComponent\r\n                >\r\n                </app-smart-address>\r\n          \r\n               \r\n                  <!-- Docket: \r\n                  <div>\r\n                    <div  *ngFor=\"let docket of docketlist; let i=index\">\r\n                      <mat-checkbox >{{docket.docketNumber}}</mat-checkbox>\r\n                    </div>\r\n                  </div> -->\r\n\r\n                  <mat-checkbox  color=\"primary\" formControlName=\"allowCsosaContactFlag\" name=\"allowCsosaContactFlag\" [(ngModel)]=\"editVictim.allowCsosaContactFlag\">victim wants to be contacted by CSOSA</mat-checkbox>\r\n                                   \r\n                </div> \r\n\r\n                <mat-card>\r\n                      <mat-form-field>\r\n                        <mat-label> Children in Common</mat-label>\r\n                        <br>\r\n                        <mat-radio-group formControlName=\"commonChildrenFlag\" [(ngModel)]=\"editVictim.commonChildrenFlag\"  (change)=\"radioCicChange($event)\">\r\n                            <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                            <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                          </mat-radio-group>\r\n                          <input matInput placeholder=\"\" style=\"display: none\">\r\n                        </mat-form-field>\r\n\r\n                       <div  *ngIf=\"commonChildrenDivFlag\">\r\n                   \r\n                          <mat-form-field >\r\n                            <mat-label>\r\n                              Children number\r\n                             </mat-label>\r\n                              <input matInput  formControlName=\"commonChildrenNumber\" [(ngModel)]=\"editVictim.commonChildrenNumber\" >\r\n                            </mat-form-field>\r\n                   \r\n                  </div>\r\n   \r\n                      <mat-form-field>\r\n                        <mat-label>CPO: </mat-label>\r\n                        <br>\r\n                          <mat-radio-group formControlName=\"cpoExpirationFlag\"  [(ngModel)]=\"editVictim.cpoExpirationFlag\" (change)=\"radioCpoChange($event)\">\r\n                              <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                              <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                            </mat-radio-group>\r\n                            <input matInput placeholder=\"\" style=\"display: none\">\r\n                          </mat-form-field>\r\n                      \r\n                      <div *ngIf=\"cpoExpirationDivFlag\"> \r\n                          <mat-form-field>\r\n                            <mat-label>Expiration Date: </mat-label>\r\n                               <input matInput \r\n                               [matDatepicker]=\"cpoDateRef\" \r\n                               formControlName=\"cpoExpirationDate\" \r\n                              (click)=\"cpoDateRef.open()\"  \r\n                              [(ngModel)]=\"editVictim.cpoExpirationDate\"  >\r\n                              <mat-datepicker-toggle [for]=\"cpoDateRef\" matSuffix></mat-datepicker-toggle>\r\n                              <mat-datepicker #cpoDateRef></mat-datepicker>\r\n                            </mat-form-field>\r\n\r\n                      </div>\r\n                    \r\n                    <br>\r\n                    <br>\r\n     \r\n                          <mat-form-field>\r\n                            <mat-label>Victim has a Support System in Place? </mat-label>\r\n                             <br>\r\n                            <mat-radio-group formControlName=\"supportInPlaceFlag\" [(ngModel)]=\"editVictim.supportInPlaceFlag\"  (change)=\"radioSupportChange($event)\">\r\n                                <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                              </mat-radio-group>\r\n                              <input matInput placeholder=\"\" style=\"display: none\">\r\n                            </mat-form-field>\r\n                     \r\n                        <div *ngIf=\"supportInPlaceDivFlag\"> \r\n                            <mat-form-field>\r\n                              <mat-label>Support type? </mat-label>\r\n                                <mat-select #supportSel formControlName=\"victimSupports\" [(ngModel)]=\"editVictim.victimSupports\" multiple>\r\n                                  <div (mouseleave)=\"supportSel.close()\">\r\n                                    <mat-option color=\"primary\" *ngFor=\"let item of victimSupportTypes\" [value]=\"item.victimSupportTypeId\">\r\n                                      {{item.name}}\r\n                                    </mat-option>\r\n                                 </div>\r\n                                </mat-select>\r\n                                <input matInput placeholder=\"\" style=\"display: none\">\r\n                              </mat-form-field>\r\n\r\n                        </div>\r\n                      \r\n                      <br>\r\n                      <br>\r\n\r\n                            <mat-form-field>\r\n                              <mat-label>Weapons Involved?</mat-label>\r\n                              <br>\r\n                              <mat-radio-group formControlName=\"weaponInvolvedFlag\" (change)=\"radioWeaponChange($event)\" [(ngModel)]=\"editVictim.weaponInvolvedFlag\" >\r\n                                  <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                  <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                </mat-radio-group>\r\n                                <input matInput placeholder=\"\" style=\"display: none\">\r\n                            </mat-form-field>\r\n                            \r\n                       \r\n                          <div *ngIf=\"weaponInvolvedDivFlag\"> \r\n                              <mat-form-field>\r\n                                <mat-label>Weapon Type</mat-label>\r\n                                  <mat-select  #weaponSel formControlName=\"victimWeaponUses\" multiple [(ngModel)]=\"editVictim.victimWeaponUses\" (selectionChange)=\"checkOtherWeapon($event.value)\" >\r\n                                    <div (mouseleave)=\"weaponSel.close()\">\r\n                                      <mat-option color=\"primary\" *ngFor=\"let item of weaponTypes\" [value]=\"item.weaponTypeId\">\r\n                                        {{item.name}}\r\n                                      </mat-option>\r\n                                    </div>\r\n                                  </mat-select>\r\n                                  <input matInput placeholder=\"\" style=\"display: none\">\r\n                                </mat-form-field>\r\n                          </div>\r\n\r\n                          <div *ngIf=\"otherWeaponFlag\"> \r\n                             <mat-form-field>\r\n                              <mat-label>Other Weapon:* </mat-label>\r\n                              <input matInput  formControlName=\"otherWeapon\" >\r\n                              </mat-form-field>\r\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors \r\n                              && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\r\n                              <mat-error><strong>Other weapon is required.</strong></mat-error>\r\n                              </div>\r\n                          </div>\r\n\r\n             \r\n                        <br>\r\n                        <br>\r\n \r\n                              <mat-form-field>\r\n                                <mat-label>Was Offender under the influence of alcohol at the time of the offense?</mat-label>\r\n                                <br>\r\n                                <mat-radio-group formControlName=\"alcoholUseFlag\" [(ngModel)]=\"editVictim.alcoholUseFlag\" >\r\n                                    <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                    <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                  </mat-radio-group>\r\n                                  <input matInput placeholder=\"\" style=\"display: none\">\r\n                                </mat-form-field>\r\n                      \r\n                          <br>\r\n                          <br>\r\n\r\n                                <mat-form-field>\r\n                                  <mat-label>Was Offender under the influence of drugs at the time of the offense?</mat-label>\r\n                                  <br>\r\n                                  <mat-radio-group formControlName=\"drugUseFlag\" (change)=\"radioDrugChange($event)\" [(ngModel)]=\"editVictim.drugUseFlag\"  >\r\n                                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                    </mat-radio-group>\r\n                                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                                  </mat-form-field>\r\n                            \r\n                              <div *ngIf=\"drugUseDivFlag\"> \r\n                                  <mat-form-field>\r\n                                    <mat-label>Drug:</mat-label>\r\n                                      <mat-select  #drugSel formControlName=\"victimDrugUses\" multiple   (selectionChange)=\"checkOtherDrug($event.value)\" >\r\n                                        <div (mouseleave)=\"drugSel.close()\">\r\n                                            <mat-option color=\"primary\" *ngFor=\"let item of drugs\" [value]=\"item.drugTypeId\">\r\n                                            {{item.name}}\r\n                                          </mat-option>\r\n                                         \r\n                                        </div>\r\n                                      </mat-select>\r\n                                      <input matInput placeholder=\"\" style=\"display: none\">\r\n                                    </mat-form-field>\r\n    \r\n                              </div>\r\n\r\n                              <div *ngIf=\"otherDrugFlag\"> \r\n                                <mat-form-field>\r\n                                 <mat-label>Other Drug:* </mat-label>\r\n                                 <input matInput  formControlName=\"otherDrug\" >\r\n                                 </mat-form-field>\r\n                                 <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors \r\n                                 && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\r\n                                 <mat-error><strong>Other drug is required.</strong></mat-error>\r\n                                 </div>\r\n                             </div>\r\n                            <br>\r\n                            <br>\r\n\r\n                            <div>\r\n                                <div>\r\n                                <mat-label>\r\n                                  Access Risk: 1 thru 10 (10 greatest risk): &nbsp;<b> {{editVictim.accessRisk}}</b>\r\n                                </mat-label>\r\n                                </div>\r\n                                <div>\r\n                               \r\n                                    <mat-slider\r\n                                    formControlName=\"accessRisk\"\r\n                                    thumbLabel=\"true\"\r\n                                    [displayWith]=\"formatLabel\"\r\n                                    min=\"1\"\r\n                                    max=\"10\"\r\n                                    [(ngModel)]=\"editVictim.accessRisk\" \r\n                                    ></mat-slider>\r\n                                  \r\n                                </div>\r\n\r\n                            </div>\r\n\r\n                          </mat-card>  \r\n\r\n \r\n              <br><br><br>           \r\n            </mat-tab>\r\n            \r\n           <mat-tab  *ngIf=\"guardianTabFlag\" label=\"Legal Guardian\">\r\n            <div class='container'>\r\n              <mat-form-field>\r\n                  <mat-label>Guardian Last Name:</mat-label>\r\n                  <input matInput formControlName=\"guardianLastName\" [(ngModel)]=\"editVictim.guardianLastName\" > \r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors \">\r\n                    <mat-error>Guardian last name is <strong>required</strong></mat-error>\r\n                  </div> \r\n                </mat-form-field>\r\n\r\n               <mat-form-field>\r\n                <mat-label>Guardian First Name:</mat-label>\r\n                  <input matInput  formControlName=\"guardianFirstName\" [(ngModel)]=\"editVictim.guardianFirstName\" >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \">\r\n                    <mat-error>Guardian first name is <strong>required</strong></mat-error>\r\n                  </div> \r\n                \r\n                </mat-form-field>\r\n                              \r\n              <mat-form-field>\r\n                <mat-label>Guardian Prefix:</mat-label>\r\n                  <mat-select  formControlName=\"guardianPrefixId\" [(ngModel)]=\"editVictim.guardianPrefixId\" >\r\n                    <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n              </mat-form-field>\r\n\r\n              <mat-form-field>\r\n                <mat-label>Guardian Suffix:</mat-label>\r\n                  <mat-select  formControlName=\"guardianSuffixId\" [(ngModel)]=\"editVictim.guardianSuffixId\"  >\r\n                    <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n                </mat-form-field>\r\n\r\n              \r\n                <!-- <mat-form-field>\r\n                    <mat-select placeholder=\"Choose\" formControlName=\"guardianGender\" [(ngModel)]=\"editVictim.guardianGender\">\r\n                      <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                  </mat-form-field> -->\r\n             \r\n                \r\n                <mat-form-field>\r\n                  <mat-label>Date of Birth:</mat-label>\r\n                     <input matInput \r\n                     [matDatepicker]=\"guardianDateRef\" \r\n                     formControlName=\"guardianBirthDate\"\r\n                     [(ngModel)]=\"editVictim.guardianBirthDate\" \r\n                     (click)=\"guardianDateRef.open()\" \r\n                       >\r\n                    <mat-datepicker-toggle [for]=\"guardianDateRef\" matSuffix></mat-datepicker-toggle>\r\n                    <mat-datepicker #guardianDateRef></mat-datepicker>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n                  <mat-form-field >\r\n                  <mat-checkbox \r\n                  color = \"primary\" \r\n                  formControlName=\"guardianNoPhoneFlag\" \r\n                 \r\n                  >\r\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\r\n                  <input matInput placeholder=\"\" style=\"display: none;\">\r\n                </mat-form-field>\r\n\r\n\r\n                <div></div>\r\n                <mat-card>\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Home Phone:</mat-label>\r\n                    <input matInput   \r\n                    formControlName=\"guardianHomePhone\" \r\n                    [(ngModel)]=\"editVictim.guardianHomePhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n                   \r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianHomePhone').errors \r\n                    && (victimForm.get('guardianHomePhone').dirty || victimForm.get('guardianHomePhone').touched)\">\r\n                    <mat-error><strong>Guardian home phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n               \r\n\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Cell Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"guardianCellPhone\" \r\n                    [(ngModel)]=\"editVictim.guardianCellPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" \r\n                   >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianCellPhone').errors \r\n                     && (victimForm.get('guardianCellPhone').dirty || victimForm.get('guardianCellPhone').touched)\">\r\n                    <mat-error><strong>Guardian Cell phone number format is not correct.</strong></mat-error>\r\n                    </div>\r\n\r\n                 \r\n\r\n                    \r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Work Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"guardianWorkPhone\" \r\n                    [(ngModel)]=\"editVictim.guardianWorkPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianWorkPhone').errors \r\n                       && (victimForm.get('guardianWorkPhone').dirty || victimForm.get('guardianWorkPhone').touched)\">\r\n                       <mat-error><strong>Guardian work phone number format is not correct.</strong></mat-error>\r\n                    </div>\r\n                  \r\n                    \r\n                </mat-form-field>\r\n              </mat-card>\r\n               \r\n              <div></div>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Guardian Email:</mat-label>\r\n                    <input matInput formControlName=\"guardianEmail\" [(ngModel)]=\"editVictim.guardianEmail\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianEmail').errors \r\n                    && (victimForm.get('guardianEmail').dirty || victimForm.get('guardianEmail').touched)\">\r\n                   <mat-error><strong>Guardian email format is not correct.</strong></mat-error>\r\n                   </div>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n               \r\n                <div>\r\n                <app-smart-address \r\n\r\n                [showPsa]=\"true\" \r\n                [modifiedBy]=\"staffId\" \r\n                [id]=\"guardianAddressId\"\r\n                (addressIdChange)=\"onGuardianAddressChange($event)\"\r\n                [outline]=\"true\" \r\n                readonly=\"false\"\r\n                [rowHeight]=\"80\" \r\n                (isValid)=\"false\" \r\n                [addressValidators]=\"addressValidators\"\r\n                #guardianAddressComponent\r\n                >\r\n                </app-smart-address>\r\n                </div>\r\n              </div>\r\n                          \r\n              <br><br><br> \r\n            </mat-tab>\r\n                        \r\n            <!--advocate-->\r\n            \r\n              <mat-tab  *ngIf=\"advocateTabFlag\" label=\"Advocate\" > \r\n                <div class='container'>\r\n                \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Last Name:</mat-label>\r\n                    <input matInput  formControlName=\"advocateLastName\" [(ngModel)]=\"editVictim.advocateLastName\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors \">\r\n                      <mat-error>Advocate last name is <strong>required</strong></mat-error>\r\n                    </div> \r\n                 </mat-form-field>\r\n                   \r\n                <mat-form-field>\r\n                  <mat-label>Advocate First Name:</mat-label>\r\n                    <input matInput  formControlName=\"advocateFirstName\" [(ngModel)]=\"editVictim.advocateFirstName\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors \">\r\n                      <mat-error>Advocate first name is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Prefix:</mat-label>\r\n                    <mat-select  formControlName=\"advocatePrefixId\"  [(ngModel)]=\"editVictim.advocatePrefixId\" >\r\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Suffix:</mat-label>\r\n                    <mat-select  formControlName=\"advocateSuffixId\" [(ngModel)]=\"editVictim.advocateSuffixId\"  >\r\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n               \r\n                <mat-form-field>\r\n                  <mat-checkbox  \r\n                  color = \"primary\" \r\n                  formControlName=\"advocateNoPhoneFlag\" \r\n                 \r\n                  [(ngModel)]=\"editVictim.advocateNoPhoneFlag\" >\r\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\r\n                  <input matInput placeholder=\"\" style=\"display: none;\">\r\n                </mat-form-field>\r\n\r\n                <div></div> \r\n                <mat-card> \r\n                <mat-form-field >\r\n                  <mat-label>Advocate Home Phone:</mat-label>\r\n                    <input matInput   \r\n                    formControlName=\"advocateHomePhone\" \r\n                    [(ngModel)]=\"editVictim.advocateHomePhone\"\r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateHomePhone').errors \r\n                    && (victimForm.get('advocateHomePhone').dirty || victimForm.get('advocateHomePhone').touched)\">\r\n                    <mat-error><strong>Advocate home number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                \r\n                </mat-form-field>\r\n    \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Cell Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"advocateCellPhone\" \r\n                    [(ngModel)]=\"editVictim.advocateCellPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\">\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateCellPhone').errors \r\n                    && (victimForm.get('advocateCellPhone').dirty || victimForm.get('advocateCellPhone').touched)\">\r\n                    <mat-error><strong>Advocate cell number format is not correct.</strong></mat-error>\r\n                  </div>\r\n\r\n                \r\n                </mat-form-field> \r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Work Phone:</mat-label>\r\n                    <input matInput  \r\n                     formControlName=\"advocateWorkPhone\" \r\n                     [(ngModel)]=\"editVictim.advocateWorkPhone\" \r\n                     phoneMask\r\n                     maxlength=\"14\"\r\n                     >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateWorkPhone').errors \r\n                    && (victimForm.get('advocateWorkPhone').dirty || victimForm.get('advocateWorkPhone').touched)\">\r\n                    <mat-error><strong>Advocate work number format is not correct.</strong></mat-error>\r\n                  </div>\r\n               \r\n                </mat-form-field>\r\n                </mat-card>\r\n\r\n                <div></div>\r\n        \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Email:</mat-label>\r\n                    <input matInput formControlName=\"advocateEmail\"  [(ngModel)]=\"editVictim.advocateEmail\" >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateEmail').errors \r\n                    && (victimForm.get('advocateEmail').dirty || victimForm.get('advocateEmail').touched)\">\r\n                    <mat-error><strong>Advocate email format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n\r\n             \r\n              <div >\r\n              <app-smart-address \r\n              [showPsa]=\"true\" \r\n              [modifiedBy]=\"staffId\" \r\n              [id]=\"advocateAddressId\"\r\n              (addressIdChange)=\"onAdvocateAddressChange($event)\"\r\n              [outline]=\"true\" \r\n              readonly=\"false\"\r\n              [rowHeight]=\"80\" \r\n              (isValid)=\"false\" \r\n              [addressValidators]=\"addressValidators\"\r\n              #advocateAddressComponent >\r\n              </app-smart-address>\r\n              </div>\r\n              </div>\r\n              <br><br><br> \r\n            </mat-tab>\r\n           \r\n            \r\n             <mat-tab  label=\"Emergency Contact\">\r\n                <div class='container'>\r\n            \r\n                        <mat-form-field>\r\n                          <mat-label>Emergency Contact Name:</mat-label>\r\n                            <input matInput  formControlName=\"emergencyContact\" [(ngModel)]=\"editVictim.emergencyContact\"  >\r\n                          </mat-form-field>\r\n\r\n                          <mat-form-field>\r\n                            <mat-label>Emergency Phone Number:</mat-label>\r\n                              <input matInput   formControlName=\"emergencyContactPhone\"  [(ngModel)]=\"editVictim.emergencyContactPhone\" >\r\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('emergencyContactPhone').errors \r\n                              && (victimForm.get('emergencyContactPhone').dirty || victimForm.get('emergencyContactPhone').touched)\">\r\n                              <mat-error><strong>Emergency contact number format is not correct.</strong></mat-error>\r\n                            </div>\r\n                            </mat-form-field>\r\n\r\n                </div>\r\n                <br><br><br>    \r\n            </mat-tab> \r\n          \r\n          </mat-tab-group>\r\n          <div class='outer'>\r\n            <div>\r\n               All buttons apply to all tabs. If save button is grey, please check each tab to make sure the required field is filled.<br><br>\r\n\r\n               <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors \r\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\r\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\r\n              </div>\r\n              \r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors \r\n              && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\r\n              <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\r\n              </div> \r\n              \r\n               <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors \r\n              && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\r\n              <mat-error>Under supervision field is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors \r\n              && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\r\n              <mat-error>Relationship is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors \r\n              && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\r\n              <mat-error>Victim last name is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors \r\n              && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\r\n              <mat-error>victim first name is <strong>required</strong></mat-error>\r\n             </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \r\n              && (victimForm.get('guardianFirstName').dirty || victimForm.get('guardianFirstName').touched)\">\r\n                <mat-error>Guardian first name is <strong>required</strong></mat-error>\r\n              </div>\r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors\r\n             && (victimForm.get('guardianLastName').dirty || victimForm.get('guardianLastName').touched)\" >\r\n              <mat-error>Guardian last name is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors\r\n                && (victimForm.get('advocateLastName').dirty || victimForm.get('advocateLastName').touched)\" >\r\n                  <mat-error>Advocate last name is <strong>required</strong></mat-error>\r\n                  </div> \r\n    \r\n                <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors\r\n                && (victimForm.get('advocateFirstName').dirty || victimForm.get('advocateFirstName').touched)\">\r\n                  <mat-error>Advocate first name is <strong>required</strong></mat-error>\r\n                </div>\r\n\r\n              \r\n                <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors \r\n                    && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\r\n                    <mat-error>Other weapon field is <strong>required</strong></mat-error>\r\n              </div>\r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors \r\n              && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\r\n              <mat-error>Other drug field is <strong>required</strong></mat-error>\r\n             </div>\r\n\r\n\r\n            </div>\r\n              \r\n                  <div class=\"inner\">\r\n                     <button  mat-raised-button color=\"primary\" (click)=\"saveVictim()\" [disabled]=\"!victimForm.valid\"  >Save </button> \r\n                  </div>\r\n                  &nbsp;&nbsp;\r\n                  <div *ngIf=\"showDelete\" class=\"inner\">\r\n                  <button  mat-raised-button color=\"primary\" (click)=\"deleteVictim()\">Delete </button>\r\n                 </div>\r\n                  &nbsp;&nbsp; \r\n                  <div class=\"inner\">\r\n                  <button  mat-raised-button color=\"primary\" (click)=\"cancel()\">Clear </button>\r\n                </div>\r\n                  &nbsp;&nbsp; \r\n                  <button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\r\n\r\n            </div>\r\n\r\n        </div>\r\n        <br>\r\n        <br>\r\n\r\n        <div align=\"right\">\r\n          <button mat-raised-button color=\"primary\"  (click)=\"addContact()\"  >Add victim contact</button>\r\n        </div>\r\n        \r\n        <div>\r\n\r\n          <mat-table #table [dataSource]=\"contactDataSource\" class=\"example-table\">\r\n            <ng-container matColumnDef=\"contactDate\">\r\n                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Date</mat-header-cell>\r\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactDate | date}} </mat-cell>\r\n            </ng-container>\r\n\r\n\r\n            <ng-container matColumnDef=\"victimContactMethod\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Method</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimContactMethod}} </mat-cell>\r\n            </ng-container>\r\n\r\n            <ng-container matColumnDef=\"nextContactDate\">\r\n              <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Next Contact Date</mat-header-cell>\r\n              <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.nextContactDate | date}} </mat-cell>\r\n            </ng-container>\r\n            \r\n        \r\n            <ng-container matColumnDef=\"staff\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact By</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.staff}} </mat-cell>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"comment\">\r\n                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\r\n                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\r\n                    </ng-container>\r\n\r\n            <ng-container matColumnDef=\"contactId\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\r\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\r\n                  \r\n                </mat-cell>\r\n            </ng-container>\r\n\r\n            <mat-header-row *matHeaderRowDef=\"['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId']\" class=\"example-header-row\"></mat-header-row>\r\n            <mat-row *matRowDef=\"let row; columns:['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId'];\" class=\"example-row\"></mat-row>\r\n            </mat-table>\r\n\r\n\r\n        </div>\r\n  \r\n  </mat-card-content>\r\n</mat-card>\r\n",
+                        template: "<mat-card>\r\n  <mat-card-content>\r\n\r\n        <div  [formGroup]=\"victimForm\">\r\n\r\n          <mat-tab-group dynamicHeight  mat-stretch-tabs>\r\n            <mat-tab label=\"Victim Detail\" >\r\n              <div class='container'>\r\n\r\n                    <mat-form-field>\r\n                      <mat-label>Is victim a minor?<font color=\"red\">* </font></mat-label>\r\n                      <br>\r\n                      <mat-radio-group  formControlName=\"minorFlag\"  (change)=\"radioMinorChange($event)\" [(ngModel)]=\"editVictim.minorFlag\" >\r\n                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                    </mat-radio-group>\r\n                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors \r\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\r\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\r\n                    </div> \r\n\r\n                  </mat-form-field>\r\n                 \r\n                  <mat-form-field>\r\n                    <mat-label>Does the Victim have a Victim Advocate or Social Worker with <br>whom CSOSA should maintain contact?<font color=\"red\">* </font></mat-label>\r\n                    <br>\r\n                    <br>\r\n                    <mat-radio-group class = \"tp-radio-group\"  formControlName=\"victimAdvocateFlag\"  (change)=\"radioAdvocateChange($event)\" [(ngModel)]=\"editVictim.victimAdvocateFlag\">\r\n                      <mat-radio-button  color=\"primary\" *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\">{{item.name}} </mat-radio-button>&nbsp;\r\n                    </mat-radio-group>\r\n                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors \r\n                    && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\r\n                    <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\r\n                    </div> \r\n                  </mat-form-field>\r\n              \r\n \r\n               <mat-form-field>\r\n                  <mat-label>Victim Currently Under Supervision:</mat-label>\r\n                    <mat-select  formControlName=\"underSupervisionFlag\" name=\"supervision\" [(ngModel)]=\"editVictim.underSupervisionFlag\" >\r\n                      <mat-option *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\" >\r\n                        {{item.name}}</mat-option>\r\n                    </mat-select>\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors \r\n                    && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\r\n                    <mat-error>under supervision field is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n               \r\n             \r\n               <mat-form-field>\r\n                  <mat-label>Relationship to Offender:</mat-label>\r\n                    <mat-select formControlName=\"victimOffenderRelationshipTypeId\" [(ngModel)]=\"editVictim.victimOffenderRelationshipTypeId\"  >\r\n                      <mat-option *ngFor=\"let item of relationshipTypes\" [value]=\"item.relationshipTypeId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors \r\n                    && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\r\n                    <mat-error>relationship is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n             \r\n                 \r\n                <mat-form-field>\r\n                  <mat-label>Victim Last Name:</mat-label>\r\n                  <input matInput formControlName=\"lastName\"  [(ngModel)]=\"editVictim.lastName\" >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors \r\n                  && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\r\n                  <mat-error>victim last name is <strong>required</strong></mat-error>\r\n                  </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim First Name: </mat-label>\r\n                  <input matInput  formControlName=\"firstName\" [(ngModel)]=\"editVictim.firstName\"  >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors \r\n                  && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\r\n                  <mat-error>victim first name is <strong>required</strong></mat-error>\r\n                 </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Middle Name:</mat-label>\r\n                    <input matInput  formControlName=\"middleName\" [(ngModel)]=\"editVictim.middleName\">\r\n                </mat-form-field>\r\n                             \r\n                <mat-form-field>\r\n                  <mat-label>Victim Prefix:</mat-label>\r\n                    <mat-select  formControlName=\"prefixId\" [(ngModel)]=\"editVictim.prefixId\">\r\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Suffix:</mat-label>\r\n                    <mat-select  formControlName=\"suffixId\"  [(ngModel)]=\"editVictim.suffixId\">\r\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n  \r\n                <mat-form-field>\r\n                  <mat-label>Victim Gender:</mat-label>\r\n                  <mat-select  formControlName=\"genderCode\" [(ngModel)]=\"editVictim.genderCode\">\r\n                    <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n                </mat-form-field>\r\n                             \r\n                <mat-form-field>\r\n                  <mat-label>Date of Birth:</mat-label>\r\n                   <input matInput \r\n                   [matDatepicker]=\"victimBirthRef\" \r\n                   formControlName=\"birthDate\"\r\n                  [(ngModel)]=\"editVictim.birthDate\"\r\n                  (click)=\"victimBirthRef.open()\"\r\n                  (dateChange)=\"handleDOBChange($event)\"  \r\n                    >\r\n                  <mat-datepicker-toggle [for]=\"victimBirthRef\" matSuffix></mat-datepicker-toggle>\r\n                  <mat-datepicker #victimBirthRef></mat-datepicker>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Victim Home Phone:</mat-label>\r\n                    <input \r\n                    matInput \r\n                    formControlName=\"homePhone\" \r\n                    [(ngModel)]=\"editVictim.homePhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\"/>\r\n\r\n\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('homePhone').errors\r\n                  && (victimForm.get('homePhone').dirty || victimForm.get('homePhone').touched)\">\r\n\r\n\r\n                  <mat-error><strong>Home phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Victim Cell Phone:</mat-label>\r\n                  <input matInput  formControlName=\"cellPhone\" [(ngModel)]=\"editVictim.cellPhone\" >\r\n                      <div class=\"help-block\" *ngIf=\"victimForm.get('cellPhone').errors \r\n                  && (victimForm.get('cellPhone').dirty || victimForm.get('cellPhone').touched)\">\r\n                   <mat-error><strong>Cell phone number format is not correct.</strong></mat-error>\r\n              </div>\r\n                </mat-form-field>\r\n\r\n               \r\n                <mat-form-field >\r\n                  <mat-label>Victim Work Phone:</mat-label>\r\n                  <input matInput  formControlName=\"workPhone\"  [(ngModel)]=\"editVictim.workPhone\" >\r\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('workPhone').errors \r\n                  && (victimForm.get('workPhone').dirty || victimForm.get('workPhone').touched)\">\r\n                  <mat-error><strong>Work phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Victim Email:</mat-label>\r\n                   <input matInput  formControlName=\"email\" [(ngModel)]=\"editVictim.email\" >\r\n                   <div class=\"help-block\" *ngIf=\"victimForm.get('email').errors \r\n                  && (victimForm.get('email').dirty || victimForm.get('email').touched)\">\r\n                  <mat-error><strong>victim email format is not correct.</strong></mat-error>\r\n              </div>\r\n                </mat-form-field>\r\n  \r\n                <div></div>\r\n              \r\n                <!-- <app-smart-address \r\n                [showPsa]=\"true\" \r\n                [modifiedBy]=\"staffId\" \r\n                [id]=\"addressId\"\r\n                (addressIdChange)=\"onAddressChange($event)\"\r\n                [outline]=\"true\" \r\n                readonly=\"false\"\r\n                [rowHeight]=\"80\" \r\n                (isValid)=\"false\" \r\n                [addressValidators]=\"addressValidators\"\r\n                #addressComponent\r\n                > -->\r\n\r\n\r\n                <app-smart-address\r\n                [modifiedBy]=\"staffId\"\r\n                [id]=\"addressId\"\r\n                [outline]=\"true\"\r\n                [showPsa]=\"true\"\r\n                [addressValidators]=\"addressValidators\"\r\n                [readonly]=\"false\"\r\n                (addressIdChange)=\"onAddressChange($event)\"\r\n                #addressComponent\r\n              >\r\n\r\n                </app-smart-address>\r\n          \r\n               \r\n                  <!-- Docket: \r\n                  <div>\r\n                    <div  *ngFor=\"let docket of docketlist; let i=index\">\r\n                      <mat-checkbox >{{docket.docketNumber}}</mat-checkbox>\r\n                    </div>\r\n                  </div> -->\r\n\r\n                  <mat-checkbox  color=\"primary\" formControlName=\"allowCsosaContactFlag\" name=\"allowCsosaContactFlag\" [(ngModel)]=\"editVictim.allowCsosaContactFlag\">victim wants to be contacted by CSOSA</mat-checkbox>\r\n                                   \r\n                </div> \r\n\r\n                <mat-card>\r\n                      <mat-form-field>\r\n                        <mat-label> Children in Common</mat-label>\r\n                        <br>\r\n                        <mat-radio-group formControlName=\"commonChildrenFlag\" [(ngModel)]=\"editVictim.commonChildrenFlag\"  (change)=\"radioCicChange($event)\">\r\n                            <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                            <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                          </mat-radio-group>\r\n                          <input matInput placeholder=\"\" style=\"display: none\">\r\n                        </mat-form-field>\r\n\r\n                       <div  *ngIf=\"commonChildrenDivFlag\">\r\n                   \r\n                          <mat-form-field >\r\n                            <mat-label>\r\n                              Children number\r\n                             </mat-label>\r\n                              <input matInput  formControlName=\"commonChildrenNumber\" [(ngModel)]=\"editVictim.commonChildrenNumber\" >\r\n                            </mat-form-field>\r\n                   \r\n                  </div>\r\n   \r\n                      <mat-form-field>\r\n                        <mat-label>CPO: </mat-label>\r\n                        <br>\r\n                          <mat-radio-group formControlName=\"cpoExpirationFlag\"  [(ngModel)]=\"editVictim.cpoExpirationFlag\" (change)=\"radioCpoChange($event)\">\r\n                              <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                              <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                            </mat-radio-group>\r\n                            <input matInput placeholder=\"\" style=\"display: none\">\r\n                          </mat-form-field>\r\n                      \r\n                      <div *ngIf=\"cpoExpirationDivFlag\"> \r\n                          <mat-form-field>\r\n                            <mat-label>Expiration Date: </mat-label>\r\n                               <input matInput \r\n                               [matDatepicker]=\"cpoDateRef\" \r\n                               formControlName=\"cpoExpirationDate\" \r\n                              (click)=\"cpoDateRef.open()\"  \r\n                              [(ngModel)]=\"editVictim.cpoExpirationDate\"  >\r\n                              <mat-datepicker-toggle [for]=\"cpoDateRef\" matSuffix></mat-datepicker-toggle>\r\n                              <mat-datepicker #cpoDateRef></mat-datepicker>\r\n                            </mat-form-field>\r\n\r\n                      </div>\r\n                    \r\n                    <br>\r\n                    <br>\r\n     \r\n                          <mat-form-field>\r\n                            <mat-label>Victim has a Support System in Place? </mat-label>\r\n                             <br>\r\n                            <mat-radio-group formControlName=\"supportInPlaceFlag\" [(ngModel)]=\"editVictim.supportInPlaceFlag\"  (change)=\"radioSupportChange($event)\">\r\n                                <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                              </mat-radio-group>\r\n                              <input matInput placeholder=\"\" style=\"display: none\">\r\n                            </mat-form-field>\r\n                     \r\n                        <div *ngIf=\"supportInPlaceDivFlag\"> \r\n                            <mat-form-field>\r\n                              <mat-label>Support type? </mat-label>\r\n                                <mat-select #supportSel formControlName=\"victimSupports\" [(ngModel)]=\"editVictim.victimSupports\" multiple>\r\n                                  <div (mouseleave)=\"supportSel.close()\">\r\n                                    <mat-option color=\"primary\" *ngFor=\"let item of victimSupportTypes\" [value]=\"item.victimSupportTypeId\">\r\n                                      {{item.name}}\r\n                                    </mat-option>\r\n                                 </div>\r\n                                </mat-select>\r\n                                <input matInput placeholder=\"\" style=\"display: none\">\r\n                              </mat-form-field>\r\n\r\n                        </div>\r\n                      \r\n                      <br>\r\n                      <br>\r\n\r\n                            <mat-form-field>\r\n                              <mat-label>Weapons Involved?</mat-label>\r\n                              <br>\r\n                              <mat-radio-group formControlName=\"weaponInvolvedFlag\" (change)=\"radioWeaponChange($event)\" [(ngModel)]=\"editVictim.weaponInvolvedFlag\" >\r\n                                  <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                  <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                </mat-radio-group>\r\n                                <input matInput placeholder=\"\" style=\"display: none\">\r\n                            </mat-form-field>\r\n                            \r\n                       \r\n                          <div *ngIf=\"weaponInvolvedDivFlag\"> \r\n                              <mat-form-field>\r\n                                <mat-label>Weapon Type</mat-label>\r\n                                  <mat-select  #weaponSel formControlName=\"victimWeaponUses\" multiple [(ngModel)]=\"editVictim.victimWeaponUses\" (selectionChange)=\"checkOtherWeapon($event.value)\" >\r\n                                    <div (mouseleave)=\"weaponSel.close()\">\r\n                                      <mat-option color=\"primary\" *ngFor=\"let item of weaponTypes\" [value]=\"item.weaponTypeId\">\r\n                                        {{item.name}}\r\n                                      </mat-option>\r\n                                    </div>\r\n                                  </mat-select>\r\n                                  <input matInput placeholder=\"\" style=\"display: none\">\r\n                                </mat-form-field>\r\n                          </div>\r\n\r\n                          <div *ngIf=\"otherWeaponFlag\"> \r\n                             <mat-form-field>\r\n                              <mat-label>Other Weapon:* </mat-label>\r\n                              <input matInput  formControlName=\"otherWeapon\" >\r\n                              </mat-form-field>\r\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors \r\n                              && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\r\n                              <mat-error><strong>Other weapon is required.</strong></mat-error>\r\n                              </div>\r\n                          </div>\r\n\r\n             \r\n                        <br>\r\n                        <br>\r\n \r\n                              <mat-form-field>\r\n                                <mat-label>Was Offender under the influence of alcohol at the time of the offense?</mat-label>\r\n                                <br>\r\n                                <mat-radio-group formControlName=\"alcoholUseFlag\" [(ngModel)]=\"editVictim.alcoholUseFlag\" >\r\n                                    <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                    <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                  </mat-radio-group>\r\n                                  <input matInput placeholder=\"\" style=\"display: none\">\r\n                                </mat-form-field>\r\n                      \r\n                          <br>\r\n                          <br>\r\n\r\n                                <mat-form-field>\r\n                                  <mat-label>Was Offender under the influence of drugs at the time of the offense?</mat-label>\r\n                                  <br>\r\n                                  <mat-radio-group formControlName=\"drugUseFlag\" (change)=\"radioDrugChange($event)\" [(ngModel)]=\"editVictim.drugUseFlag\"  >\r\n                                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\r\n                                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\r\n                                    </mat-radio-group>\r\n                                    <input matInput placeholder=\"\" style=\"display: none\">\r\n                                  </mat-form-field>\r\n                            \r\n                              <div *ngIf=\"drugUseDivFlag\"> \r\n                                  <mat-form-field>\r\n                                    <mat-label>Drug:</mat-label>\r\n                                      <mat-select  #drugSel formControlName=\"victimDrugUses\" multiple   (selectionChange)=\"checkOtherDrug($event.value)\" >\r\n                                        <div (mouseleave)=\"drugSel.close()\">\r\n                                            <mat-option color=\"primary\" *ngFor=\"let item of drugs\" [value]=\"item.drugTypeId\">\r\n                                            {{item.name}}\r\n                                          </mat-option>\r\n                                         \r\n                                        </div>\r\n                                      </mat-select>\r\n                                      <input matInput placeholder=\"\" style=\"display: none\">\r\n                                    </mat-form-field>\r\n    \r\n                              </div>\r\n\r\n                              <div *ngIf=\"otherDrugFlag\"> \r\n                                <mat-form-field>\r\n                                 <mat-label>Other Drug:* </mat-label>\r\n                                 <input matInput  formControlName=\"otherDrug\" >\r\n                                 </mat-form-field>\r\n                                 <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors \r\n                                 && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\r\n                                 <mat-error><strong>Other drug is required.</strong></mat-error>\r\n                                 </div>\r\n                             </div>\r\n                            <br>\r\n                            <br>\r\n\r\n                            <div>\r\n                                <div>\r\n                                <mat-label>\r\n                                  Access Risk: 1 thru 10 (10 greatest risk): &nbsp;<b> {{editVictim.accessRisk}}</b>\r\n                                </mat-label>\r\n                                </div>\r\n                                <div>\r\n                               \r\n                                    <mat-slider\r\n                                    formControlName=\"accessRisk\"\r\n                                    thumbLabel=\"true\"\r\n                                    [displayWith]=\"formatLabel\"\r\n                                    min=\"1\"\r\n                                    max=\"10\"\r\n                                    [(ngModel)]=\"editVictim.accessRisk\" \r\n                                    ></mat-slider>\r\n                                  \r\n                                </div>\r\n\r\n                            </div>\r\n\r\n                          </mat-card>  \r\n\r\n \r\n              <br><br><br>           \r\n            </mat-tab>\r\n            \r\n           <mat-tab  *ngIf=\"guardianTabFlag\" label=\"Legal Guardian\">\r\n            <div class='container'>\r\n              <mat-form-field>\r\n                  <mat-label>Guardian Last Name:</mat-label>\r\n                  <input matInput formControlName=\"guardianLastName\" [(ngModel)]=\"editVictim.guardianLastName\" > \r\n                  <!-- <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors \">\r\n                    <mat-error>Guardian last name is <strong>required</strong></mat-error>\r\n                  </div>  -->\r\n                </mat-form-field>\r\n\r\n               <mat-form-field>\r\n                <mat-label>Guardian First Name:</mat-label>\r\n                  <input matInput  formControlName=\"guardianFirstName\" [(ngModel)]=\"editVictim.guardianFirstName\" >\r\n                  <!-- <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \">\r\n                    <mat-error>Guardian first name is <strong>required</strong></mat-error>\r\n                  </div>  -->\r\n                \r\n                </mat-form-field>\r\n                              \r\n              <mat-form-field>\r\n                <mat-label>Guardian Prefix:</mat-label>\r\n                  <mat-select  formControlName=\"guardianPrefixId\" [(ngModel)]=\"editVictim.guardianPrefixId\" >\r\n                    <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n              </mat-form-field>\r\n\r\n              <mat-form-field>\r\n                <mat-label>Guardian Suffix:</mat-label>\r\n                  <mat-select  formControlName=\"guardianSuffixId\" [(ngModel)]=\"editVictim.guardianSuffixId\"  >\r\n                    <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                  </mat-select>\r\n                </mat-form-field>\r\n\r\n              \r\n                <!-- <mat-form-field>\r\n                    <mat-select placeholder=\"Choose\" formControlName=\"guardianGender\" [(ngModel)]=\"editVictim.guardianGender\">\r\n                      <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                  </mat-form-field> -->\r\n             \r\n                \r\n                <mat-form-field>\r\n                  <mat-label>Date of Birth:</mat-label>\r\n                     <input matInput \r\n                     [matDatepicker]=\"guardianDateRef\" \r\n                     formControlName=\"guardianBirthDate\"\r\n                     [(ngModel)]=\"editVictim.guardianBirthDate\" \r\n                     (click)=\"guardianDateRef.open()\" \r\n                       >\r\n                    <mat-datepicker-toggle [for]=\"guardianDateRef\" matSuffix></mat-datepicker-toggle>\r\n                    <mat-datepicker #guardianDateRef></mat-datepicker>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n                  <mat-form-field >\r\n                  <mat-checkbox \r\n                  color = \"primary\" \r\n                  formControlName=\"guardianNoPhoneFlag\" \r\n                 \r\n                  >\r\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\r\n                  <input matInput placeholder=\"\" style=\"display: none;\">\r\n                </mat-form-field>\r\n\r\n\r\n                <div></div>\r\n                <mat-card>\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Home Phone:</mat-label>\r\n                    <input matInput   \r\n                    formControlName=\"guardianHomePhone\" \r\n                    [(ngModel)]=\"editVictim.guardianHomePhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n                   \r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianHomePhone').errors \r\n                    && (victimForm.get('guardianHomePhone').dirty || victimForm.get('guardianHomePhone').touched)\">\r\n                    <mat-error><strong>Guardian home phone number format is not correct.</strong></mat-error>\r\n                  </div>\r\n               \r\n\r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Cell Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"guardianCellPhone\" \r\n                    [(ngModel)]=\"editVictim.guardianCellPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" \r\n                   >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianCellPhone').errors \r\n                     && (victimForm.get('guardianCellPhone').dirty || victimForm.get('guardianCellPhone').touched)\">\r\n                    <mat-error><strong>Guardian Cell phone number format is not correct.</strong></mat-error>\r\n                    </div>\r\n\r\n                 \r\n\r\n                    \r\n                </mat-form-field>\r\n\r\n                <mat-form-field >\r\n                  <mat-label>Guardian Work Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"guardianWorkPhone\" \r\n                    [(ngModel)]=\"editVictim.guardianWorkPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianWorkPhone').errors \r\n                       && (victimForm.get('guardianWorkPhone').dirty || victimForm.get('guardianWorkPhone').touched)\">\r\n                       <mat-error><strong>Guardian work phone number format is not correct.</strong></mat-error>\r\n                    </div>\r\n                  \r\n                    \r\n                </mat-form-field>\r\n              </mat-card>\r\n               \r\n              <div></div>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Guardian Email:</mat-label>\r\n                    <input matInput formControlName=\"guardianEmail\" [(ngModel)]=\"editVictim.guardianEmail\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianEmail').errors \r\n                    && (victimForm.get('guardianEmail').dirty || victimForm.get('guardianEmail').touched)\">\r\n                   <mat-error><strong>Guardian email format is not correct.</strong></mat-error>\r\n                   </div>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n               \r\n                <div>\r\n                <app-smart-address \r\n\r\n                [showPsa]=\"true\" \r\n                [modifiedBy]=\"staffId\" \r\n                [id]=\"guardianAddressId\"\r\n                (addressIdChange)=\"onGuardianAddressChange($event)\"\r\n                [outline]=\"true\" \r\n                readonly=\"false\"\r\n                [rowHeight]=\"80\" \r\n                (isValid)=\"false\" \r\n                [addressValidators]=\"addressValidators\"\r\n                #guardianAddressComponent\r\n                >\r\n                </app-smart-address>\r\n                </div>\r\n              </div>\r\n                          \r\n              <br><br><br> \r\n            </mat-tab>\r\n                        \r\n            <!--advocate-->\r\n            \r\n              <mat-tab  *ngIf=\"advocateTabFlag\" label=\"Advocate\" > \r\n                <div class='container'>\r\n                \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Last Name:</mat-label>\r\n                    <input matInput  formControlName=\"advocateLastName\" [(ngModel)]=\"editVictim.advocateLastName\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors \">\r\n                      <mat-error>Advocate last name is <strong>required</strong></mat-error>\r\n                    </div> \r\n                 </mat-form-field>\r\n                   \r\n                <mat-form-field>\r\n                  <mat-label>Advocate First Name:</mat-label>\r\n                    <input matInput  formControlName=\"advocateFirstName\" [(ngModel)]=\"editVictim.advocateFirstName\"  >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors \">\r\n                      <mat-error>Advocate first name is <strong>required</strong></mat-error>\r\n                    </div> \r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Prefix:</mat-label>\r\n                    <mat-select  formControlName=\"advocatePrefixId\"  [(ngModel)]=\"editVictim.advocatePrefixId\" >\r\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Suffix:</mat-label>\r\n                    <mat-select  formControlName=\"advocateSuffixId\" [(ngModel)]=\"editVictim.advocateSuffixId\"  >\r\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n\r\n               \r\n                <mat-form-field>\r\n                  <mat-checkbox  \r\n                  color = \"primary\" \r\n                  formControlName=\"advocateNoPhoneFlag\" \r\n                 \r\n                  [(ngModel)]=\"editVictim.advocateNoPhoneFlag\" >\r\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\r\n                  <input matInput placeholder=\"\" style=\"display: none;\">\r\n                </mat-form-field>\r\n\r\n                <div></div> \r\n                <mat-card> \r\n                <mat-form-field >\r\n                  <mat-label>Advocate Home Phone:</mat-label>\r\n                    <input matInput   \r\n                    formControlName=\"advocateHomePhone\" \r\n                    [(ngModel)]=\"editVictim.advocateHomePhone\"\r\n                    phoneMask\r\n                    maxlength=\"14\" >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateHomePhone').errors \r\n                    && (victimForm.get('advocateHomePhone').dirty || victimForm.get('advocateHomePhone').touched)\">\r\n                    <mat-error><strong>Advocate home number format is not correct.</strong></mat-error>\r\n                  </div>\r\n                \r\n                </mat-form-field>\r\n    \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Cell Phone:</mat-label>\r\n                    <input matInput  \r\n                    formControlName=\"advocateCellPhone\" \r\n                    [(ngModel)]=\"editVictim.advocateCellPhone\" \r\n                    phoneMask\r\n                    maxlength=\"14\">\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateCellPhone').errors \r\n                    && (victimForm.get('advocateCellPhone').dirty || victimForm.get('advocateCellPhone').touched)\">\r\n                    <mat-error><strong>Advocate cell number format is not correct.</strong></mat-error>\r\n                  </div>\r\n\r\n                \r\n                </mat-form-field> \r\n\r\n                <mat-form-field>\r\n                  <mat-label>Advocate Work Phone:</mat-label>\r\n                    <input matInput  \r\n                     formControlName=\"advocateWorkPhone\" \r\n                     [(ngModel)]=\"editVictim.advocateWorkPhone\" \r\n                     phoneMask\r\n                     maxlength=\"14\"\r\n                     >\r\n\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateWorkPhone').errors \r\n                    && (victimForm.get('advocateWorkPhone').dirty || victimForm.get('advocateWorkPhone').touched)\">\r\n                    <mat-error><strong>Advocate work number format is not correct.</strong></mat-error>\r\n                  </div>\r\n               \r\n                </mat-form-field>\r\n                </mat-card>\r\n\r\n                <div></div>\r\n        \r\n                <mat-form-field>\r\n                  <mat-label>Advocate Email:</mat-label>\r\n                    <input matInput formControlName=\"advocateEmail\"  [(ngModel)]=\"editVictim.advocateEmail\" >\r\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateEmail').errors \r\n                    && (victimForm.get('advocateEmail').dirty || victimForm.get('advocateEmail').touched)\">\r\n                    <mat-error><strong>Advocate email format is not correct.</strong></mat-error>\r\n                  </div>\r\n                </mat-form-field>\r\n\r\n                <div></div>\r\n\r\n             \r\n              <div >\r\n              <app-smart-address \r\n              [showPsa]=\"true\" \r\n              [modifiedBy]=\"staffId\" \r\n              [id]=\"advocateAddressId\"\r\n              (addressIdChange)=\"onAdvocateAddressChange($event)\"\r\n              [outline]=\"true\" \r\n              readonly=\"false\"\r\n              [rowHeight]=\"80\" \r\n              (isValid)=\"false\" \r\n              [addressValidators]=\"addressValidators\"\r\n              #advocateAddressComponent >\r\n              </app-smart-address>\r\n              </div>\r\n              </div>\r\n              <br><br><br> \r\n            </mat-tab>\r\n           \r\n            \r\n             <mat-tab  label=\"Emergency Contact\">\r\n                <div class='container'>\r\n            \r\n                        <mat-form-field>\r\n                          <mat-label>Emergency Contact Name:</mat-label>\r\n                            <input matInput  formControlName=\"emergencyContact\" [(ngModel)]=\"editVictim.emergencyContact\"  >\r\n                          </mat-form-field>\r\n\r\n                          <mat-form-field>\r\n                            <mat-label>Emergency Phone Number:</mat-label>\r\n                              <input matInput   formControlName=\"emergencyContactPhone\"  [(ngModel)]=\"editVictim.emergencyContactPhone\" >\r\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('emergencyContactPhone').errors \r\n                              && (victimForm.get('emergencyContactPhone').dirty || victimForm.get('emergencyContactPhone').touched)\">\r\n                              <mat-error><strong>Emergency contact number format is not correct.</strong></mat-error>\r\n                            </div>\r\n                            </mat-form-field>\r\n\r\n                </div>\r\n                <br><br><br>    \r\n            </mat-tab> \r\n          \r\n          </mat-tab-group>\r\n          <div class='outer'>\r\n            <div>\r\n               All buttons apply to all tabs. If save button is grey, please check each tab to make sure the required field is filled.<br><br>\r\n\r\n               <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors \r\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\r\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\r\n              </div>\r\n              \r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors \r\n              && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\r\n              <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\r\n              </div> \r\n              \r\n               <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors \r\n              && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\r\n              <mat-error>Under supervision field is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors \r\n              && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\r\n              <mat-error>Relationship is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors \r\n              && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\r\n              <mat-error>Victim last name is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors \r\n              && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\r\n              <mat-error>victim first name is <strong>required</strong></mat-error>\r\n             </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \r\n              && (victimForm.get('guardianFirstName').dirty || victimForm.get('guardianFirstName').touched)\">\r\n                <mat-error>Guardian first name is <strong>required</strong></mat-error>\r\n              </div>\r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors\r\n             && (victimForm.get('guardianLastName').dirty || victimForm.get('guardianLastName').touched)\" >\r\n              <mat-error>Guardian last name is <strong>required</strong></mat-error>\r\n              </div> \r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors\r\n                && (victimForm.get('advocateLastName').dirty || victimForm.get('advocateLastName').touched)\" >\r\n                  <mat-error>Advocate last name is <strong>required</strong></mat-error>\r\n                  </div> \r\n    \r\n                <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors\r\n                && (victimForm.get('advocateFirstName').dirty || victimForm.get('advocateFirstName').touched)\">\r\n                  <mat-error>Advocate first name is <strong>required</strong></mat-error>\r\n                </div>\r\n\r\n              \r\n                <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors \r\n                    && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\r\n                    <mat-error>Other weapon field is <strong>required</strong></mat-error>\r\n              </div>\r\n\r\n              <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors \r\n              && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\r\n              <mat-error>Other drug field is <strong>required</strong></mat-error>\r\n             </div>\r\n\r\n\r\n            </div>\r\n              \r\n                  <div class=\"inner\">\r\n                     <button  mat-raised-button color=\"primary\" (click)=\"saveVictim()\" [disabled]=\"!victimForm.valid\"  >Save </button> \r\n                  </div>\r\n                  &nbsp;&nbsp;\r\n                  <div *ngIf=\"showDelete\" class=\"inner\">\r\n                  <button  mat-raised-button color=\"primary\" (click)=\"deleteVictim()\">Delete </button>\r\n                 </div>\r\n                  &nbsp;&nbsp; \r\n                  <div class=\"inner\">\r\n                  <button  mat-raised-button color=\"primary\" (click)=\"cancel()\">Clear </button>\r\n                </div>\r\n                  &nbsp;&nbsp; \r\n                  <button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\r\n\r\n            </div>\r\n\r\n        </div>\r\n        <br>\r\n        <br>\r\n\r\n        <div align=\"right\">\r\n          <button mat-raised-button color=\"primary\"  (click)=\"addContact()\"  >Add victim contact</button>\r\n        </div>\r\n        \r\n        <div>\r\n\r\n          <mat-table #table [dataSource]=\"contactDataSource\" class=\"example-table\">\r\n            <ng-container matColumnDef=\"contactDate\">\r\n                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Date</mat-header-cell>\r\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactDate | date}} </mat-cell>\r\n            </ng-container>\r\n\r\n\r\n            <ng-container matColumnDef=\"victimContactMethod\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Method</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimContactMethod}} </mat-cell>\r\n            </ng-container>\r\n\r\n            <ng-container matColumnDef=\"nextContactDate\">\r\n              <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Next Contact Date</mat-header-cell>\r\n              <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.nextContactDate | date}} </mat-cell>\r\n            </ng-container>\r\n            \r\n        \r\n            <ng-container matColumnDef=\"staff\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact By</mat-header-cell>\r\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.staff}} </mat-cell>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"comment\">\r\n                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\r\n                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\r\n                    </ng-container>\r\n\r\n            <ng-container matColumnDef=\"contactId\">\r\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\r\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\r\n                  \r\n                </mat-cell>\r\n            </ng-container>\r\n\r\n            <mat-header-row *matHeaderRowDef=\"['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId']\" class=\"example-header-row\"></mat-header-row>\r\n            <mat-row *matRowDef=\"let row; columns:['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId'];\" class=\"example-row\"></mat-row>\r\n            </mat-table>\r\n\r\n\r\n        </div>\r\n  \r\n  </mat-card-content>\r\n</mat-card>\r\n",
                         providers: [CommonDialogService],
                         styles: ["mat-form-field{width:100%}.container{margin:16px;display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr);grid-gap:10px;grid-auto-rows:minmax(50px,auto);justify-items:stretch}@media only screen and (max-width:1120px){.container{display:-ms-grid;display:grid;-ms-grid-columns:1fr 1fr;grid-template-columns:1fr 1fr;grid-row-gap:15px}}@media only screen and (max-width:675px){.container{display:flex;flex-direction:column}}#outer{width:100%;text-align:center}.inner{display:inline-block}.tp-radio-group{display:flex;justify-content:space-between}"]
                     }] }
@@ -4715,7 +4765,10 @@
             this.editContact = (/** @type {?} */ ({}));
             this.staff = {};
             this.contactForm = new forms.FormGroup({
-                contactDate: new forms.FormControl(),
+                //contactDate: new FormControl(),
+                contactDate: new forms.FormControl('', forms.Validators.compose([
+                    dateValidator()
+                ])),
                 contactMethod: new forms.FormControl(),
                 contactBy: new forms.FormControl(),
                 comment: new forms.FormControl(),
@@ -4902,7 +4955,7 @@
         };
         ContactComponent.decorators = [
             { type: core.Component, args: [{
-                        template: "\r\n <mat-card>\r\n        <mat-card-header>\r\n\r\n        </mat-card-header>\r\n         <mat-card-content>\r\n                \r\n                        <mat-toolbar  color=\"primary\">\r\n                                        <h4 class=\"card-header\" >Contact detail</h4>\r\n                        </mat-toolbar>\r\n                        <br>\r\n       \r\n\r\n                       \r\n                                        <mat-card >\r\n                                        <div class='container'>       \r\n                                        <form [formGroup]=\"contactForm\" #caseNoteDetailForm=\"ngForm\" >\r\n                                                    \r\n                                               \r\n\r\n                                                <div>      \r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Contact Date:</mat-label>\r\n                                                                 <input matInput formControlName=\"contactDate\"   \r\n                                                                 (click)=\"contactDate.open()\" \r\n                                                                 [matDatepicker]=\"contactDate\" \r\n                                                                 placeholder=\"Choose a contact date\" \r\n                                                                 [(ngModel)]=\"editContact.contactDate\" required>\r\n                                                                <mat-datepicker-toggle matSuffix [for]=\"contactDate\"></mat-datepicker-toggle>\r\n                                                                <mat-datepicker #contactDate></mat-datepicker>\r\n                                                        </mat-form-field>\r\n                                                </div>  \r\n                                                                \r\n                                                       \r\n\r\n                                                <div>\r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Contact Method:</mat-label>\r\n                                                                <mat-select  placeholder=\"contactMethod\" formControlName=\"contactMethod\"  required   [(ngModel)]=\"editContact.victimContactMethodId\">\r\n                                                                        <mat-option *ngFor=\" let contactMethod of contactMethods\" [value]=\"contactMethod.victimContactMethodId\" >{{contactMethod.name}}</mat-option>\r\n                                                                </mat-select>\r\n                                                        </mat-form-field>\r\n                                                </div>\r\n                                                                      \r\n                                                 <div>                    \r\n                                                        <mat-form-field class=\"mat-select-content\">\r\n                                                                <mat-label>Contact By:</mat-label>\r\n                                                                <mat-select  formControlName=\"contactBy\"   required [(ngModel)]=\"editContact.contactedBy\" class=\"mat-select-inner\">\r\n                                                                        <mat-option *ngFor=\" let item of staff\" [value]=\"item.staffId\" >{{ item.fullName}}</mat-option>\r\n                                                                </mat-select>\r\n                                                        </mat-form-field>\r\n                                                </div>  \r\n                                                \r\n                                                <div>\r\n\r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Comments </mat-label>\r\n                                                                <textarea \r\n                                                                matInput \r\n                                                                placeholder=\"\" \r\n                                                                required formControlName=\"comment\" \r\n                                                                [(ngModel)]=\"editContact.comment\"\r\n                                                                cdkTextareaAutosize\r\n                                                                #autosize=\"cdkTextareaAutosize\"\r\n                                                                cdkAutosizeMinRows=\"1\"\r\n                                                                cdkAutosizeMaxRows=\"5\">\r\n                                                                </textarea> \r\n                                                        </mat-form-field>\r\n                                                </div>\r\n\r\n                                                <div>      \r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Next Contact Date: </mat-label>\r\n                                                                 <input matInput formControlName=\"nextContactDate\"   \r\n                                                                 (click)=\"nextContactDate.open()\" \r\n                                                                 [matDatepicker]=\"nextContactDate\" \r\n                                                                 placeholder=\"Choose a next contact date\" \r\n                                                                 [(ngModel)]=\"editContact.nextContactDate\" required>\r\n                                                                <mat-datepicker-toggle matSuffix [for]=\"nextContactDate\"></mat-datepicker-toggle>\r\n                                                                <mat-datepicker #nextContactDate></mat-datepicker>\r\n                                                        </mat-form-field>\r\n                                                </div> \r\n                                                \r\n                                                <div>\r\n                                                        <!-- <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\"  [disabled]=\"!contactForm.form.valid\" >Save</button> -->\r\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\"  >Save</button>\r\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  >Cancel</button>\r\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\" (click)=\"back()\"  >Back</button>\r\n                                                </div>\r\n\r\n                                              </form>\r\n                                              </div>\r\n                                                </mat-card>\r\n                                        \r\n                                       \r\n                        <br>\r\n                       \r\n\r\n\r\n\r\n</mat-card-content>\r\n</mat-card>",
+                        template: "\r\n <mat-card>\r\n        <mat-card-header>\r\n\r\n        </mat-card-header>\r\n         <mat-card-content>\r\n                \r\n                        <mat-toolbar  color=\"primary\">\r\n                                        <h4 class=\"card-header\" >Contact detail</h4>\r\n                        </mat-toolbar>\r\n                        <br>\r\n       \r\n\r\n                       \r\n                                        <mat-card >\r\n                                        <div class='container'>       \r\n                                        <form [formGroup]=\"contactForm\" #contactDetailForm=\"ngForm\" >\r\n                                                    \r\n                                               \r\n\r\n                                                <div>      \r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Contact Date:</mat-label>\r\n                                                                 <input matInput formControlName=\"contactDate\"   \r\n                                                                 (click)=\"contactDate.open()\" \r\n                                                                 [matDatepicker]=\"contactDate\" \r\n                                                                 placeholder=\"Choose a contact date\" \r\n                                                                 [(ngModel)]=\"editContact.contactDate\" required>\r\n                                                                <mat-datepicker-toggle matSuffix [for]=\"contactDate\"></mat-datepicker-toggle>\r\n                                                                <mat-datepicker #contactDate></mat-datepicker>\r\n                                                        </mat-form-field>\r\n\r\n                                                        <div class=\"validation-errors\">\r\n                                                                <div\r\n                                                                  class=\"help-block\"\r\n                                                                  *ngIf=\"\r\n                                                                  contactForm\r\n                                                                      .get('contactDate')\r\n                                                                      .hasError('required') &&\r\n                                                                    (contactForm.get('contactDate').dirty ||\r\n                                                                    contactForm.get('contactDate').touched)\">\r\n                                                                  <mat-error>Contact date is\r\n                                                                    <strong>required</strong></mat-error>\r\n                                                                </div>\r\n                                                                <div\r\n                                                                  class=\"help-block\"\r\n                                                                  *ngIf=\"\r\n                                                                  contactForm.get('contactDate').hasError('date') &&\r\n                                                                    (contactForm.get('contactDate').dirty ||\r\n                                                                    contactForm.get('contactDate').touched)\">\r\n                                                                  <mat-error >future Date is <strong>not allowed</strong> for contact date</mat-error>\r\n                                                                </div>\r\n                                                              </div>\r\n                                                </div>  \r\n                                                                \r\n                                                       \r\n\r\n                                                <div>\r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Contact Method:</mat-label>\r\n                                                                <mat-select  placeholder=\"contactMethod\" formControlName=\"contactMethod\"  required   [(ngModel)]=\"editContact.victimContactMethodId\">\r\n                                                                        <mat-option *ngFor=\" let contactMethod of contactMethods\" [value]=\"contactMethod.victimContactMethodId\" >{{contactMethod.name}}</mat-option>\r\n                                                                </mat-select>\r\n                                                        </mat-form-field>\r\n                                                </div>\r\n                                                                      \r\n                                                 <div>                    \r\n                                                        <mat-form-field class=\"mat-select-content\">\r\n                                                                <mat-label>Contact By:</mat-label>\r\n                                                                <mat-select  formControlName=\"contactBy\"   required [(ngModel)]=\"editContact.contactedBy\" class=\"mat-select-inner\">\r\n                                                                        <mat-option *ngFor=\" let item of staff\" [value]=\"item.staffId\" >{{ item.fullName}}</mat-option>\r\n                                                                </mat-select>\r\n                                                        </mat-form-field>\r\n                                                </div>  \r\n                                                \r\n                                                <div>\r\n\r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Comments </mat-label>\r\n                                                                <textarea \r\n                                                                matInput \r\n                                                                placeholder=\"\" \r\n                                                                required formControlName=\"comment\" \r\n                                                                [(ngModel)]=\"editContact.comment\"\r\n                                                                cdkTextareaAutosize\r\n                                                                #autosize=\"cdkTextareaAutosize\"\r\n                                                                cdkAutosizeMinRows=\"1\"\r\n                                                                cdkAutosizeMaxRows=\"5\">\r\n                                                                </textarea> \r\n                                                        </mat-form-field>\r\n                                                </div>\r\n\r\n                                                <div>      \r\n                                                        <mat-form-field>\r\n                                                                <mat-label>Next Contact Date: </mat-label>\r\n                                                                 <input matInput formControlName=\"nextContactDate\"   \r\n                                                                 (click)=\"nextContactDate.open()\" \r\n                                                                 [matDatepicker]=\"nextContactDate\" \r\n                                                                 placeholder=\"Choose a next contact date\" \r\n                                                                 [(ngModel)]=\"editContact.nextContactDate\" required>\r\n                                                                <mat-datepicker-toggle matSuffix [for]=\"nextContactDate\"></mat-datepicker-toggle>\r\n                                                                <mat-datepicker #nextContactDate></mat-datepicker>\r\n                                                        </mat-form-field>\r\n                                                </div> \r\n                                                \r\n                                                <div>\r\n                                                        <!-- <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\"  [disabled]=\"!contactForm.form.valid\" >Save</button> -->\r\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\" [disabled]=\"!contactForm.valid\" >Save</button>\r\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  >Cancel</button>\r\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\" (click)=\"back()\"  >Back</button>\r\n                                                </div>\r\n\r\n                                              </form>\r\n                                              </div>\r\n                                                </mat-card>\r\n                                        \r\n                                       \r\n                        <br>\r\n                       \r\n\r\n\r\n\r\n</mat-card-content>\r\n</mat-card>",
                         styles: ["mat-form-field{width:50%}.container{margin:16px;display:-ms-grid;display:grid;-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr);grid-gap:10px;grid-auto-rows:minmax(50px,auto);justify-items:stretch}.mat-select-content{width:300px}.mat-select-inner{width:290px}"]
                     }] }
         ];
@@ -6308,7 +6361,7 @@
         forms.ReactiveFormsModule
     ];
     /** @type {?} */
-    var CORE_MODULES = [ngcSmartAddress.SmartAddressModule];
+    var CORE_MODULES = [ngcSmartCore.NgcSmartCoreModule, ngcSmartAddress.SmartAddressModule];
     /** @type {?} */
     var MATERIAL_MODULES = [
         material.MatButtonModule, material.MatCheckboxModule, material.MatRadioModule, material.MatSliderModule,