@csmart/ngc-smart-victim 1.14.44 → 1.14.45

package/fesm2015/csmart-ngc-smart-victim.mjs

@@ -0,0 +1,3273 @@
+import * as i1 from '@angular/common/http';
+import { HttpHeaders } from '@angular/common/http';
+import * as i0 from '@angular/core';
+import { InjectionToken, Injectable, Inject, Component, EventEmitter, Input, Output, ViewChild, ViewEncapsulation, NgModule } from '@angular/core';
+import { throwError } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
+import * as i2 from 'apollo-angular';
+import { ApolloModule } from 'apollo-angular';
+import * as i8$1 from '@angular/common';
+import { DatePipe, DOCUMENT, CommonModule } from '@angular/common';
+import * as i11$1 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import { MatSort, MatSortModule } from '@angular/material/sort';
+import * as i6 from '@csmart/ngc-smart-core';
+import { AccessType, LoginStaffResolverService, SelectedOffenderResolverService, SmartErrorComponent, NgcSmartCoreModule } from '@csmart/ngc-smart-core';
+import * as i10$1 from '@angular/material/paginator';
+import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
+import * as i1$1 from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
+import * as i5 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import * as i4 from '@angular/material/snack-bar';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
+import * as i2$1 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i8 from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
+import * as i9$1 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i1$2 from '@angular/forms';
+import { UntypedFormControl, Validators, UntypedFormGroup, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import * as i10 from '@angular/material/radio';
+import { MatRadioGroup, MatRadioModule } from '@angular/material/radio';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i15 from '@angular/material/input';
+import { MatInput, MatInputModule } from '@angular/material/input';
+import * as i17 from '@angular/material/select';
+import { MatSelect, MatSelectModule } from '@angular/material/select';
+import * as i9 from '@angular/material/checkbox';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import * as i11 from '@angular/material/slider';
+import { MatSliderModule } from '@angular/material/slider';
+import * as i13 from '@angular/material/tabs';
+import { MatTabsModule } from '@angular/material/tabs';
+import * as i14 from '@angular/material/form-field';
+import * as i16 from '@angular/material/datepicker';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import * as i18 from '@angular/material/core';
+import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
+import * as i20 from '@csmart/ngc-smart-address';
+import { SmartAddressModule } from '@csmart/ngc-smart-address';
+import * as i21 from '@csmart/smart-ui';
+import { SmartUiModule } from '@csmart/smart-ui';
+import * as i3 from '@angular/material/expansion';
+import { MatExpansionModule } from '@angular/material/expansion';
+import * as i12$1 from '@angular/material/list';
+import { MatListModule } from '@angular/material/list';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import * as i11$2 from '@angular/material/toolbar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatGridListModule } from '@angular/material/grid-list';
+import { CdkTableModule } from '@angular/cdk/table';
+import { LayoutModule } from '@angular/cdk/layout';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatStepperModule } from '@angular/material/stepper';
+import { MatChipsModule } from '@angular/material/chips';
+import { MsalGuard } from '@azure/msal-angular';
+import gql from 'graphql-tag';
+import * as i12 from '@angular/cdk/text-field';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+
+const SMART_OFFENDER_SERVICE_URL = new InjectionToken('smart offender service url');
+const SMART_LOOKUP_SERVICE_URL = new InjectionToken('smart lookup service url');
+const SMART_VICTIM_SERVICE_URL = new InjectionToken('smart victim service url');
+const SMART_WARRANT_URL = new InjectionToken('smart warrant web url');
+class VictimListFilter$1 {
+}
+class VictimAdvocate {
+    constructor(victimAdvocateId, lastName, firstName, prefixId, suffixId, addressId, noPhoneFlag, homePhone, workPhone, cellPhone, email, modifiedBy) {
+        this.victimAdvocateId = victimAdvocateId;
+        this.lastName = lastName;
+        this.firstName = firstName;
+        this.prefixId = prefixId;
+        this.suffixId = suffixId;
+        this.addressId = addressId;
+        this.noPhoneFlag = noPhoneFlag;
+        this.homePhone = homePhone;
+        this.workPhone = workPhone;
+        this.cellPhone = cellPhone;
+        this.email = email;
+        this.modifiedBy = modifiedBy;
+    }
+}
+class VictimWeaponUse {
+    constructor(
+    // public victimWeaponUseId: number,
+    victimId, weaponTypeId, otherWeapon, modifiedBy) {
+        this.victimId = victimId;
+        this.weaponTypeId = weaponTypeId;
+        this.otherWeapon = otherWeapon;
+        this.modifiedBy = modifiedBy;
+    }
+}
+class VictimDrugUse {
+    constructor(
+    //public victimDrugUseId: number,
+    victimId, drugTypeId, otherDrug, modifiedBy) {
+        this.victimId = victimId;
+        this.drugTypeId = drugTypeId;
+        this.otherDrug = otherDrug;
+        this.modifiedBy = modifiedBy;
+    }
+}
+class VictimSupport {
+    constructor(
+    // public victimSupportId: number,
+    victimId, victimSupportTypeId, modifiedBy) {
+        this.victimId = victimId;
+        this.victimSupportTypeId = victimSupportTypeId;
+        this.modifiedBy = modifiedBy;
+    }
+}
+class VictimGuardian {
+    constructor(victimGuardianId, lastName, firstName, prefixId, suffixId, birthDate, addressId, noPhoneFlag, homePhone, workPhone, cellPhone, email, modifiedBy) {
+        this.victimGuardianId = victimGuardianId;
+        this.lastName = lastName;
+        this.firstName = firstName;
+        this.prefixId = prefixId;
+        this.suffixId = suffixId;
+        this.birthDate = birthDate;
+        this.addressId = addressId;
+        this.noPhoneFlag = noPhoneFlag;
+        this.homePhone = homePhone;
+        this.workPhone = workPhone;
+        this.cellPhone = cellPhone;
+        this.email = email;
+        this.modifiedBy = modifiedBy;
+    }
+}
+class Victim {
+    constructor(victimId, offenderId, underSupervisionFlag, victimOffenderRelationshipTypeId, lastName, firstName, middleName, prefixId, suffixId, birthDate, genderCode, homePhone, workPhone, cellPhone, email, addressId, minorFlag, victimAdvocateFlag, guardianFirstName, guardianLastName, guardianPrefixId, guardianSuffixId, guardianNoPhoneFlag, guardianHomePhone, guardianWorkPhone, guardianCellPhone, guardianEmail, guardianAddressId, guardianBirthDate, advocateFirstName, advocateLastName, advocatePrefixId, advocateSuffixId, advocateNoPhoneFlag, advocateHomePhone, advocateWorkPhone, advocateCellPhone, advocateEmail, advocateAddressId, emergencyContact, emergencyContactPhone, commonChildrenFlag, commonChildrenNumber, cpoExpirationFlag, cpoExpirationDate, supportInPlaceFlag, weaponInvolvedFlag, drugUseFlag, alcoholUseFlag, accessRisk, modifiedBy, relationship, vVictimAdvocate, vVictimGuardian, victimSupports, victimWeaponUses, victimDrugUses, allowCsosaContactFlag, liveWithOffenderFlag) {
+        this.victimId = victimId;
+        this.offenderId = offenderId;
+        this.underSupervisionFlag = underSupervisionFlag;
+        this.victimOffenderRelationshipTypeId = victimOffenderRelationshipTypeId;
+        this.lastName = lastName;
+        this.firstName = firstName;
+        this.middleName = middleName;
+        this.prefixId = prefixId;
+        this.suffixId = suffixId;
+        this.birthDate = birthDate;
+        this.genderCode = genderCode;
+        this.homePhone = homePhone;
+        this.workPhone = workPhone;
+        this.cellPhone = cellPhone;
+        this.email = email;
+        this.addressId = addressId;
+        this.minorFlag = minorFlag;
+        this.victimAdvocateFlag = victimAdvocateFlag;
+        this.guardianFirstName = guardianFirstName;
+        this.guardianLastName = guardianLastName;
+        this.guardianPrefixId = guardianPrefixId;
+        this.guardianSuffixId = guardianSuffixId;
+        this.guardianNoPhoneFlag = guardianNoPhoneFlag;
+        this.guardianHomePhone = guardianHomePhone;
+        this.guardianWorkPhone = guardianWorkPhone;
+        this.guardianCellPhone = guardianCellPhone;
+        this.guardianEmail = guardianEmail;
+        this.guardianAddressId = guardianAddressId;
+        this.guardianBirthDate = guardianBirthDate;
+        this.advocateFirstName = advocateFirstName;
+        this.advocateLastName = advocateLastName;
+        this.advocatePrefixId = advocatePrefixId;
+        this.advocateSuffixId = advocateSuffixId;
+        this.advocateNoPhoneFlag = advocateNoPhoneFlag;
+        this.advocateHomePhone = advocateHomePhone;
+        this.advocateWorkPhone = advocateWorkPhone;
+        this.advocateCellPhone = advocateCellPhone;
+        this.advocateEmail = advocateEmail;
+        this.advocateAddressId = advocateAddressId;
+        this.emergencyContact = emergencyContact;
+        this.emergencyContactPhone = emergencyContactPhone;
+        this.commonChildrenFlag = commonChildrenFlag;
+        this.commonChildrenNumber = commonChildrenNumber;
+        this.cpoExpirationFlag = cpoExpirationFlag;
+        this.cpoExpirationDate = cpoExpirationDate;
+        this.supportInPlaceFlag = supportInPlaceFlag;
+        this.weaponInvolvedFlag = weaponInvolvedFlag;
+        this.drugUseFlag = drugUseFlag;
+        this.alcoholUseFlag = alcoholUseFlag;
+        this.accessRisk = accessRisk;
+        this.modifiedBy = modifiedBy;
+        this.relationship = relationship;
+        this.vVictimAdvocate = vVictimAdvocate;
+        this.vVictimGuardian = vVictimGuardian;
+        this.victimSupports = victimSupports;
+        this.victimWeaponUses = victimWeaponUses;
+        this.victimDrugUses = victimDrugUses;
+        this.allowCsosaContactFlag = allowCsosaContactFlag;
+        this.liveWithOffenderFlag = liveWithOffenderFlag;
+    }
+}
+
+const headers$1 = new HttpHeaders({ 'Content-Type': 'application/json' });
+const options = { headers: headers$1 };
+class NgcSmartVictimService {
+    constructor(http, smartOffenderServiceUrl, smartLookupServiceUrl, smartVictimServiceUrl, apollo) {
+        this.http = http;
+        this.smartOffenderServiceUrl = smartOffenderServiceUrl;
+        this.smartLookupServiceUrl = smartLookupServiceUrl;
+        this.smartVictimServiceUrl = smartVictimServiceUrl;
+        this.apollo = apollo;
+        this.serviceApiUrl = 'https://smart-service-test.azurewebsites.net/graphql';
+    }
+    // getVictimInsurances(offenderId: any) {
+    //   return this.http.get(this.smartOffenderServiceUrl + '/VictimInsurances/?offenderId=' + offenderId).pipe();
+    // }
+    // getVictimInsurance(id: any) {
+    //   return this.http.get(this.smartOffenderServiceUrl + '/VictimInsurances/?id=' + id).pipe();
+    // } 
+    // postVictimInsurance(val: any) {
+    //   return this.http.post(this.smartOffenderServiceUrl + '/VictimInsurances', val).pipe();
+    // }
+    // putVictimInsurance(id: any, val: any) {
+    //   return this.http.put(this.smartOffenderServiceUrl + '/VictimInsurances/?id=' + id, val).pipe();
+    // }
+    // deleteVictimInsurance(id: any) {
+    //   return this.http.delete(this.smartOffenderServiceUrl + '/VictimInsurances/?id=' + id).pipe();
+    // }
+    // getVictimInsuranceTypes() {
+    //     return this.http.get(this.smartLookupServiceUrl + '/VictimInsuranceTypes').pipe();
+    // }
+    // getVictimInsurancePolicyHolders() {
+    //     return this.http.get(this.smartLookupServiceUrl + '/VictimInsurancePolicyHolders').pipe();
+    // }
+    //   getVictimInsuranceSwitchReasons() {
+    //       return this.http.get(this.smartLookupServiceUrl + '/VictimInsuranceSwitchReasons').pipe();
+    //   }
+    //   getVictimInsuranceProviders() {
+    //       return this.http.get(this.smartLookupServiceUrl + '/VictimInsuranceProvider').pipe();
+    //   }
+    //   getVictimInsuranceProvider(id) {
+    //     return this.http.get(this.smartLookupServiceUrl + '/VictimInsuranceProviders/' + id).pipe();
+    // }
+    //   postProviderInformation(val: any) {
+    //       return this.http.post(this.smartLookupServiceUrl + '/VictimInsuranceProviders', val).pipe();
+    //   }
+    getCurrentHousing(offenderId) {
+        return this.http
+            .get(this.smartOffenderServiceUrl + 'Housings/current/' + offenderId)
+            .pipe();
+    }
+    handleError(error) {
+        console.error(error);
+        return throwError(error.json().error || 'Server error');
+    }
+    getDrugsTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'DrugTypes', options).pipe(map(res => res));
+    }
+    getDocketList(offenderId) {
+        const queryString = `
+  {
+    findDockets(input: { where: { offenderId:${offenderId} } }) {
+      totalCount
+      message
+      data {
+        docketId
+        docketNumber
+      
+      }
+    }
+  }`;
+        return this.http.post(this.serviceApiUrl, { query: queryString }).pipe(map(({ data }) => {
+            console.log('dockets for this offender:', data.findDockets.data);
+            return data.findDockets.data;
+        }));
+    }
+    getSupportTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimSupportTypes', options).pipe(map(res => res));
+    }
+    getPrefixes() {
+        return this.http.get(this.smartLookupServiceUrl + 'Prefixes', options).pipe(map(res => res));
+    }
+    getSuffixes() {
+        return this.http.get(this.smartLookupServiceUrl + 'Suffixes', options).pipe(map(res => res));
+    }
+    getRelationshipTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'RelationshipTypes', options).pipe(map(res => res));
+    }
+    getGenders() {
+        return this.http.get(this.smartLookupServiceUrl + 'Genders', options).pipe(map(res => res));
+    }
+    getWeaponTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'WeaponTypes', options).pipe(map(res => res));
+    }
+    getFlagOptionYesNoUnknowns() {
+        return this.http.get(this.smartLookupServiceUrl + 'FlagOptionYesNoUnknowns', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getContactTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'ContactTypes', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getContactMethods() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimContactMethods', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getContactBys() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimContactPurposes', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getVictimContactPurposes() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimContactPurposes', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getVictimServiceTypes() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimServiceTypes', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getVictimServiceStatus() {
+        return this.http.get(this.smartLookupServiceUrl + 'VictimServiceStatus', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getvVictimServiceTypeProgramProviders() {
+        return this.http.get(this.smartLookupServiceUrl + 'vVictimServiceTypeProgramProviders', options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getVictim(val) {
+        return this.http.get(this.smartVictimServiceUrl + 'Victims/' + val, options).pipe(map(res => {
+            console.log('victim return data');
+            console.log(res);
+            return res;
+        }));
+    }
+    getVictimAdvocate(val) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimAdvocates/' + val, options).pipe(map(res => {
+            return res;
+        }));
+    }
+    getVictimGuardian(val) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimGuardians/' + val, options).pipe(map(res => {
+            return res;
+        }));
+    }
+    postVictims(val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'Victims', tempVal, options).pipe(map(res => { return res; }));
+    }
+    putVictims(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'Victims/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    putVictimAdvocate(id, val) {
+        let body;
+        body = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'VictimAdvocates/' + id, body, options).pipe(map(res => { return res; }));
+    }
+    postVictimAdvocate(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'VictimAdvocates/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    putVictimGuardian(id, val) {
+        console.log('update victim guardian');
+        console.log(val);
+        const tempVal = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'VictimGuardians/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    postVictimGuardian(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'VictimGuardians/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    getVictimDrugUse(val) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimDrugUses/' + val, options).pipe(map((res) => {
+            return res;
+        }));
+    }
+    putVictimDrugUse(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'VictimDrugUses/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    postVictimDrugUse(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'VictimDrugUses/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    putVictimWeaponUse(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'VictimWeaponUses/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    postVictimWeaponUse(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'VictimWeaponUses/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    putVictimSupport(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.put(this.smartVictimServiceUrl + 'VictimSupports/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    postVictimSupport(id, val) {
+        const tempVal = JSON.stringify(val);
+        return this.http.post(this.smartVictimServiceUrl + 'VictimSupports/' + id, tempVal, options).pipe(map(res => { return res; }));
+    }
+    deleteVictims(val, staffId) {
+        return this.http.delete(this.smartVictimServiceUrl + 'Victims/' + val + '?staffId=' + staffId, options).pipe(map(res => { return res; }));
+    }
+    // //==============Victim Serive===================================
+    getVictims(offenderId) {
+        return this.http.get(this.smartVictimServiceUrl + 'Victims/offender/' + offenderId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    getVictimsByFilter(filter) {
+        return this.http
+            .post(this.smartVictimServiceUrl + '/Victims', JSON.stringify(filter), { headers: headers$1 })
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    getVictimListByFilter(filter) {
+        console.log('filer in service');
+        console.log(filter);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'vVictims/Filter', JSON.stringify(filter), options)
+            .pipe();
+    }
+    getCasetNotes(victimId) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimCaseNotes/victim/' + victimId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    addCaseNote(caseNote) {
+        let body;
+        body = JSON.stringify(caseNote);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'VictimCaseNotes/', body, options);
+    }
+    updateCaseNote(caseNote) {
+        let body;
+        body = JSON.stringify(caseNote);
+        return this.http
+            .put(this.smartVictimServiceUrl + 'VictimCaseNotes/' + caseNote.victimCaseNoteId, body, options);
+    }
+    deleteCaseNote(id, staffId) {
+        return this.http.delete(`${this.smartVictimServiceUrl}VictimCaseNotes/${id}?staffId=${staffId}`);
+    }
+    getContacts(victimId) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimContacts/victim/' + victimId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    addContact(contact) {
+        let body;
+        body = JSON.stringify(contact);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'VictimContacts/', body, options);
+    }
+    updateContact(contact) {
+        let body;
+        body = JSON.stringify(contact);
+        return this.http
+            .put(this.smartVictimServiceUrl + 'VictimContacts/' + contact.victimContactId, body, options);
+    }
+    getSafetyPlans(victimId) {
+        return this.http.get(this.smartVictimServiceUrl + 'vVictimServiceLists/victim/' + victimId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    getVictimServices(victimServiceId) {
+        return this.http.get(this.smartVictimServiceUrl + 'vVictimServiceLists/victimServiceId/' + victimServiceId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    getVictimServiceDetail(victimServiceId) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimServiceDetails/' + victimServiceId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    addSafetyPlan(victimSafetyPlan) {
+        let body;
+        body = JSON.stringify(victimSafetyPlan);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'VictimServices/', body, options)
+            .pipe();
+    }
+    updateSafetyPlan(victimSafetyPlan) {
+        let body;
+        body = JSON.stringify(victimSafetyPlan);
+        return this.http
+            .put(this.smartVictimServiceUrl + 'VictimServices/' + victimSafetyPlan.victimServiceId, body, options);
+    }
+    addVictimServiceStatus(victimServiceStatusHistory) {
+        let body;
+        body = JSON.stringify(victimServiceStatusHistory);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'VictimServiceStatusHistories/', body, options);
+    }
+    getServiceStatusHistories(victimServiceId) {
+        return this.http.get(this.smartVictimServiceUrl + 'VictimServiceStatusHistories/victimServiceId/' + victimServiceId)
+            .pipe(map((res) => {
+            return res;
+        }), catchError(this.handleError));
+    }
+    deleteSafetyPlan(victimServiceId, staffId) {
+        return this.http.delete(`${this.smartVictimServiceUrl}VictimServices/${victimServiceId}?staffId=${staffId}`);
+    }
+    addPlanProvider(victimServiceDetail) {
+        let body;
+        body = JSON.stringify(victimServiceDetail);
+        return this.http
+            .post(this.smartVictimServiceUrl + 'VictimServiceDetails/', body, options)
+            .pipe();
+    }
+    deleteProvider(victimProgramProviderId, staffId) {
+        return this.http.delete(`${this.smartVictimServiceUrl}VictimServiceDetails/${victimProgramProviderId}?staffId=${staffId}`);
+    }
+}
+/** @nocollapse */ NgcSmartVictimService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimService, deps: [{ token: i1.HttpClient }, { token: SMART_OFFENDER_SERVICE_URL }, { token: SMART_LOOKUP_SERVICE_URL }, { token: SMART_VICTIM_SERVICE_URL }, { token: i2.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ NgcSmartVictimService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () {
+        return [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [SMART_OFFENDER_SERVICE_URL]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [SMART_LOOKUP_SERVICE_URL]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [SMART_VICTIM_SERVICE_URL]
+                    }] }, { type: i2.Apollo }];
+    } });
+
+const headers = new Headers({ 'Content-Type': 'application/json' });
+class IntakeServicesComponent {
+    //serviceData = environment.smartOffenderServiceUrl;
+    constructor(http, smartOffenderServiceUrl) {
+        this.http = http;
+        this.smartOffenderServiceUrl = smartOffenderServiceUrl;
+    }
+    getIntakeByOffender(offenderId) {
+        return this.http
+            .get(this.smartOffenderServiceUrl + 'IntakeBasic/offender/' + offenderId)
+            .pipe();
+    }
+    updateIntakeSteps(offenderId, intakeStepStatus) {
+        return this.http.put(this.smartOffenderServiceUrl + '/IntakeStepStatus/' + offenderId, intakeStepStatus);
+    }
+}
+/** @nocollapse */ IntakeServicesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IntakeServicesComponent, deps: [{ token: i1.HttpClient }, { token: SMART_OFFENDER_SERVICE_URL }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ IntakeServicesComponent.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IntakeServicesComponent, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IntakeServicesComponent, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () {
+        return [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [SMART_OFFENDER_SERVICE_URL]
+                    }] }];
+    } });
+class IntakeStep {
+}
+IntakeStep.PhysicalInformation = "PHYSIN";
+IntakeStep.Photo = "PHOTOS";
+IntakeStep.HousingInformation = "HOUSE";
+IntakeStep.DocketInformation = "DOCKET";
+IntakeStep.Alias = "ALIAS";
+IntakeStep.IntakeBasicInformation = "INTKBI";
+IntakeStep.ContactInformation = "CONTCT";
+IntakeStep.DeceasedInformation = "DEATH";
+IntakeStep.DriversLicense = "DRVLIC";
+IntakeStep.EmploymentInformation = "EMPLOY";
+IntakeStep.GangAffiliation = "GANG";
+IntakeStep.HealthInsurance = "HLTHINS";
+IntakeStep.Identification = "IDNTFCTN";
+IntakeStep.InternetIdentifier = "INTERNETID";
+IntakeStep.MilitaryService = "MLTSVC";
+IntakeStep.School = "SCHOOL";
+IntakeStep.SelectiveService = "SLCTVSVC";
+IntakeStep.Vehicle = "VEHICLE";
+IntakeStep.VictimInformation = "VICTIM";
+IntakeStep.WarrantInformation = "WARRNT";
+IntakeStep.RunningRecord = "RUNREC";
+IntakeStep.Signature = "SIGN";
+
+class CommonDialogComponent {
+    constructor(commondialogRef) {
+        this.commondialogRef = commondialogRef;
+        this.cmdYesTitle = "Yes";
+        this.cmdNoTitle = "No";
+    }
+    ngOnInit() {
+    }
+}
+/** @nocollapse */ CommonDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogComponent, deps: [{ token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ CommonDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CommonDialogComponent, selector: "app-common-dialog", ngImport: i0, template: "\n           \n            <mat-card class=\"example-card\"> \n                <mat-card-content>\n           <p>{{ title }}</p>\n                   <p>{{ message }}</p>\n                   <br>\n\n                   <div class=\"inner\">\n                        <button type=\"button\" mat-raised-button color=\"primary\"\n                            (click)=\"commondialogRef.close(true)\">{{cmdYesTitle}}</button>\n                    </div>\n                        &nbsp;&nbsp;\n                        \n                    <div *ngIf=\"cmdYesTitle!=='Ok'\" class=\"inner\">\n                        <button type=\"button\" mat-raised-button color=\"primary\" \n                            (click)=\"commondialogRef.close()\">{{cmdNoTitle}}</button>\n                        \n                    </div>\n                 \n                             \n               </mat-card-content>\n           </mat-card>", styles: [".md-dialog-container{position:fixed;top:0!important;overflow:hidden}.inner{display:inline-block}\n"], dependencies: [{ kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-common-dialog', template: "\n           \n            <mat-card class=\"example-card\"> \n                <mat-card-content>\n           <p>{{ title }}</p>\n                   <p>{{ message }}</p>\n                   <br>\n\n                   <div class=\"inner\">\n                        <button type=\"button\" mat-raised-button color=\"primary\"\n                            (click)=\"commondialogRef.close(true)\">{{cmdYesTitle}}</button>\n                    </div>\n                        &nbsp;&nbsp;\n                        \n                    <div *ngIf=\"cmdYesTitle!=='Ok'\" class=\"inner\">\n                        <button type=\"button\" mat-raised-button color=\"primary\" \n                            (click)=\"commondialogRef.close()\">{{cmdNoTitle}}</button>\n                        \n                    </div>\n                 \n                             \n               </mat-card-content>\n           </mat-card>", styles: [".md-dialog-container{position:fixed;top:0!important;overflow:hidden}.inner{display:inline-block}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$1.MatDialogRef }]; } });
+
+class CommonDialogService {
+    constructor(dialog) {
+        this.dialog = dialog;
+    }
+    confirm(title, message, cmdYesTitle, cmdNoTitle) {
+        let dialogRef;
+        dialogRef = this.dialog.open(CommonDialogComponent);
+        dialogRef.componentInstance.title = title;
+        dialogRef.componentInstance.message = message;
+        dialogRef.componentInstance.cmdYesTitle = cmdYesTitle;
+        dialogRef.componentInstance.cmdNoTitle = cmdNoTitle;
+        return dialogRef.afterClosed();
+    }
+    warning(title, message, cmdOkTitle) {
+        let dialogRef;
+        dialogRef = this.dialog.open(CommonDialogComponent);
+        dialogRef.componentInstance.title = title;
+        dialogRef.componentInstance.message = message;
+        dialogRef.componentInstance.cmdYesTitle = cmdOkTitle;
+        return dialogRef.afterClosed();
+    }
+}
+/** @nocollapse */ CommonDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogService, deps: [{ token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ CommonDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }]; } });
+
+function conditionalValidator(predicate, validator, errorNamespace) {
+    return (formControl => {
+        if (!formControl.parent) {
+            return null;
+        }
+        let error = null;
+        if (predicate()) {
+            error = validator(formControl);
+        }
+        if (errorNamespace && error) {
+            const customError = {};
+            customError[errorNamespace] = error;
+            error = customError;
+        }
+        return error;
+    });
+}
+function stringConditionalValidator(predicate, validator, errorNamespace) {
+    return (formControl => {
+        if (!formControl.parent) {
+            return null;
+        }
+        let error = null;
+        if (predicate() == 'YS') {
+            error = validator(formControl);
+        }
+        if (errorNamespace && error) {
+            const customError = {};
+            customError[errorNamespace] = error;
+            error = customError;
+        }
+        return error;
+    });
+}
+class SmartVictimDetailComponent {
+    constructor(location, formBuilder, dialog, route, router, snackBar, commonDialogService, victimService, changeDetectorRefs) {
+        this.location = location;
+        this.formBuilder = formBuilder;
+        this.dialog = dialog;
+        this.route = route;
+        this.router = router;
+        this.snackBar = snackBar;
+        this.commonDialogService = commonDialogService;
+        this.victimService = victimService;
+        this.changeDetectorRefs = changeDetectorRefs;
+        this.victimDetail = {};
+        this.onSave = new EventEmitter();
+        this.onCancel = new EventEmitter();
+        this.hidden = true;
+        this.victimAdvocate = {};
+        this.victimGuardian = {};
+        this.guardianTabFlag = false;
+        this.advocateTabFlag = false;
+        this.commonChildrenDivFlag = false;
+        this.cpoExpirationDivFlag = false;
+        this.supportInPlaceDivFlag = false;
+        this.weaponInvolvedDivFlag = false;
+        this.drugUseDivFlag = false;
+        this.showDelete = false;
+        this.addressId = 0;
+        this.advocateAddressId = 0;
+        this.guardianAddressId = 0;
+        this.datePipe = new DatePipe('en-US');
+        this.emailPattern = "^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$";
+        this.phoneNumber = "\\d{10}";
+        this.editVictim = {};
+        this.otherWeaponFlag = false;
+        this.otherDrugFlag = false;
+        this.contactDataSource = new MatTableDataSource();
+        this.guardianPhoneExistFlag = false;
+        this.advocatePhoneExistFlag = false;
+        this.phoneValidationFlag = false;
+        this.guaridanNoPhoneChkFlag = true;
+        this.advocateNoPhoneChkFlag = true;
+        this.addressValidators = {
+            street: [],
+            street2: [],
+            city: [],
+            stateCode: [],
+            zipCode: [],
+            psaCode: [],
+        };
+        this.homePhoneControl = new UntypedFormControl();
+        this.cellPhoneControl = new UntypedFormControl();
+        this.workPhoneControl = new UntypedFormControl();
+        this.guardianHomePhoneControl = new UntypedFormControl();
+        this.guardianCellPhoneControl = new UntypedFormControl();
+        this.guardianWorkPhoneControl = new UntypedFormControl();
+        this.advocateHomePhoneControl = new UntypedFormControl();
+        this.advocateCellPhoneControl = new UntypedFormControl();
+        this.advocateWorkPhoneControl = new UntypedFormControl();
+        this.emergencyContactPhoneControl = new UntypedFormControl();
+        this.initForm();
+    }
+    initForm() {
+        this.victimForm = this.formBuilder.group({
+            underSupervisionFlag: new UntypedFormControl('', Validators.compose([Validators.required])),
+            victimOffenderRelationshipTypeId: new UntypedFormControl('', Validators.compose([Validators.required])),
+            lastName: new UntypedFormControl('', Validators.compose([Validators.required])),
+            firstName: new UntypedFormControl('', Validators.compose([Validators.required])),
+            middleName: new UntypedFormControl(''),
+            prefixId: new UntypedFormControl(''),
+            suffixId: new UntypedFormControl(''),
+            genderCode: new UntypedFormControl(''),
+            birthDate: new UntypedFormControl(''),
+            homePhone: new UntypedFormControl(''),
+            cellPhone: new UntypedFormControl(''),
+            workPhone: new UntypedFormControl(''),
+            email: new UntypedFormControl('', Validators.compose([Validators.pattern(this.emailPattern)])),
+            minorFlag: new UntypedFormControl('', Validators.compose([Validators.required])),
+            victimAdvocateFlag: new UntypedFormControl('', Validators.compose([Validators.required])),
+            guardianLastName: new UntypedFormControl('', stringConditionalValidator(() => this.victimForm.get('minorFlag').value, Validators.required, 'illuminatiError')),
+            guardianFirstName: new UntypedFormControl('', stringConditionalValidator(() => this.victimForm.get('minorFlag').value, Validators.required, 'illuminatiError')),
+            guardianPrefixId: new UntypedFormControl(''),
+            guardianSuffixId: new UntypedFormControl(''),
+            //guardianGender:new FormControl('', ),
+            guardianBirthDate: new UntypedFormControl(''),
+            guardianNoPhoneFlag: new UntypedFormControl(true),
+            guardianHomePhone: new UntypedFormControl(''),
+            guardianCellPhone: new UntypedFormControl(''),
+            guardianWorkPhone: new UntypedFormControl(''),
+            guardianEmail: new UntypedFormControl('', Validators.compose([Validators.pattern(this.emailPattern)])),
+            advocateNoPhoneFlag: new UntypedFormControl(true),
+            advocateWorkPhone: new UntypedFormControl(''),
+            advocateHomePhone: new UntypedFormControl(''),
+            advocateCellPhone: new UntypedFormControl(''),
+            advocateSuffixId: new UntypedFormControl(''),
+            advocatePrefixId: new UntypedFormControl(''),
+            advocateFirstName: new UntypedFormControl('', stringConditionalValidator(() => this.victimForm.get('victimAdvocateFlag').value, Validators.required, 'illuminatiError')),
+            advocateLastName: new UntypedFormControl('', stringConditionalValidator(() => this.victimForm.get('victimAdvocateFlag').value, Validators.required, 'illuminatiError')),
+            advocateEmail: new UntypedFormControl('', Validators.compose([Validators.pattern(this.emailPattern)])),
+            emergencyContact: new UntypedFormControl(''),
+            emergencyContactPhone: new UntypedFormControl(''),
+            emergencyChildren: new UntypedFormControl(''),
+            emergencyCpo: new UntypedFormControl(''),
+            emergencyDrug: new UntypedFormControl(''),
+            emergencySupport: new UntypedFormControl(''),
+            emergencyWeapon: new UntypedFormControl(''),
+            drug: new UntypedFormControl(''),
+            weapon: new UntypedFormControl(''),
+            support: new UntypedFormControl(''),
+            commonChildrenFlag: new UntypedFormControl(''),
+            commonChildrenNumber: new UntypedFormControl(''),
+            cpoExpirationFlag: new UntypedFormControl(''),
+            cpoExpirationDate: new UntypedFormControl(''),
+            accessRisk: new UntypedFormControl(''),
+            drugUseFlag: new UntypedFormControl(''),
+            supportInPlaceFlag: new UntypedFormControl(''),
+            weaponInvolvedFlag: new UntypedFormControl(''),
+            otherWeapon: new UntypedFormControl(''),
+            otherDrug: new UntypedFormControl(''),
+            alcoholUseFlag: new UntypedFormControl(''),
+            victimSupports: new UntypedFormControl(''),
+            victimWeaponUses: new UntypedFormControl(''),
+            victimDrugUses: new UntypedFormControl(''),
+            allowCsosaContactFlag: new UntypedFormControl(''),
+            liveWithOffenderFlag: new UntypedFormControl(''),
+        });
+        this.victimForm.markAsPristine();
+        this.victimForm.markAsUntouched();
+    }
+    _getVictim() {
+        if (this.victimId === 0) {
+            return;
+        }
+        ;
+        if (this.editMode == true) {
+            console.log('find victim id inside getVictim');
+            console.log(this.victimId);
+            if (this.victimId === undefined) {
+                this.sub = this.route.params.subscribe(params => {
+                    this.victimId = params['victimId'];
+                    console.log('my this.victimId');
+                    console.log(this.victimId);
+                });
+            }
+            this.victimService.getVictim(this.victimId)
+                .subscribe((victim) => {
+                console.log('victim data 1');
+                console.log(victim);
+                this.editVictim = victim;
+                var supportsData = [];
+                this.editVictim.victimSupports.forEach(t => { supportsData.push(t.victimSupportTypeId); });
+                const victimSupportsControl = this.victimForm.get('victimSupports');
+                victimSupportsControl.setValue(supportsData);
+                var weaponUsesData = [];
+                var otherWeapon = "";
+                this.editVictim.victimWeaponUses.forEach(t => {
+                    weaponUsesData.push(t.weaponTypeId);
+                    if (t.weaponTypeId == "OTHER") {
+                        otherWeapon = t.otherWeapon;
+                        this.otherWeaponFlag = true;
+                    }
+                });
+                const victimWeaponUsesControl = this.victimForm.get('victimWeaponUses');
+                victimWeaponUsesControl.setValue(weaponUsesData);
+                const otherWeaponControl = this.victimForm.get('otherWeapon');
+                otherWeaponControl.setValue(otherWeapon);
+                var drugUseData = [];
+                var otherDrug = "";
+                console.log('load this.editVictim.victimDrugUses');
+                console.log(this.editVictim.victimDrugUses);
+                this.editVictim.victimDrugUses.forEach(t => {
+                    if (t.drugTypeId === null) {
+                        otherDrug = t.otherDrug;
+                        this.otherDrugFlag = true;
+                        t.drugTypeId = 'OTHER';
+                    }
+                    drugUseData.push(t.drugTypeId);
+                });
+                console.log('this.editVictim.victimDrugUses after push');
+                console.log(drugUseData);
+                if (drugUseData) {
+                    const victimDrugUsesControl = this.victimForm.get('victimDrugUses');
+                    victimDrugUsesControl.setValue(drugUseData);
+                }
+                if (otherDrug) {
+                    const otherDrugControl = this.victimForm.get('otherDrug');
+                    otherDrugControl.setValue(otherDrug);
+                }
+                //contact
+                this.victimService.getContacts(this.victimId).subscribe(contactList => {
+                    console.log('contactList');
+                    console.log(contactList);
+                    this.contactList = contactList;
+                    this.contactDataSource.data = this.contactList;
+                });
+                //no phone field
+                if (this.editVictim.guardianNoPhoneFlag === false) {
+                    this.victimForm.patchValue({ guardianNoPhoneFlag: false });
+                }
+                if (this.editVictim.advocateNoPhoneFlag === false) {
+                    this.victimForm.patchValue({ advocateNoPhoneFlag: false });
+                }
+                this.homePhoneControl.setValue(!this.editVictim.homePhone ? "" : this.editVictim.homePhone);
+                this.cellPhoneControl.setValue(!this.editVictim.cellPhone ? "" : this.editVictim.cellPhone);
+                this.workPhoneControl.setValue(!this.editVictim.workPhone ? "" : this.editVictim.workPhone);
+                this.guardianHomePhoneControl.setValue(!this.editVictim.guardianHomePhone ? "" : this.editVictim.guardianHomePhone);
+                this.guardianCellPhoneControl.setValue(!this.editVictim.guardianCellPhone ? "" : this.editVictim.guardianCellPhone);
+                this.guardianWorkPhoneControl.setValue(!this.editVictim.guardianWorkPhone ? "" : this.editVictim.guardianWorkPhone);
+                this.advocateHomePhoneControl.setValue(!this.editVictim.advocateHomePhone ? "" : this.editVictim.advocateHomePhone);
+                this.advocateCellPhoneControl.setValue(!this.editVictim.advocateCellPhone ? "" : this.editVictim.advocateCellPhone);
+                this.advocateWorkPhoneControl.setValue(!this.editVictim.advocateWorkPhone ? "" : this.editVictim.advocateWorkPhone);
+                this.emergencyContactPhoneControl.setValue(!this.editVictim.emergencyContactPhone ? "" : this.editVictim.emergencyContactPhone);
+            }, error => {
+                this.snackBar.open("Error occured while retriving Victim Information. Please try again.");
+            });
+            return;
+        }
+        else {
+            //new
+        }
+    }
+    ngOnChanges() {
+    }
+    onClear() {
+        if (this.addressComponent)
+            this.addressComponent.reset();
+    }
+    showAddress(value) {
+        if (value.checked) {
+            this.victimService.getCurrentHousing(this.offenderId).subscribe((item) => {
+                this.addressId = item.housing.addressId;
+                this.victimForm.patchValue({ addressId: this.addressId });
+            });
+        }
+        else {
+            this.addressComponent.reset();
+            this.editVictim.allowCsosaContactFlag = false;
+            this.addressId = null;
+        }
+    }
+    onAddressChange(addressId) {
+        this.victimForm.patchValue({ addressId: addressId });
+        this.addressId = addressId;
+    }
+    onGuardianAddressChange(MyGuardianAddressId) {
+        this.victimForm.patchValue({ guardianAddressId: MyGuardianAddressId });
+        this.guardianAddressId = MyGuardianAddressId;
+    }
+    onAdvocateAddressChange(MyAdvocateAddressId) {
+        this.victimForm.patchValue({ advocateAddressId: MyAdvocateAddressId });
+        this.advocateAddressId = MyAdvocateAddressId;
+    }
+    cancel() {
+        this.victimForm.reset();
+    }
+    ngOnInit() {
+        this.homePhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.homePhone = newValue;
+        });
+        this.cellPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.cellPhone = newValue;
+        });
+        this.workPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.workPhone = newValue;
+        });
+        this.guardianHomePhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.guardianHomePhone = newValue;
+        });
+        this.guardianCellPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.guardianCellPhone = newValue;
+        });
+        this.guardianWorkPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.guardianWorkPhone = newValue;
+        });
+        this.advocateHomePhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.advocateHomePhone = newValue;
+        });
+        this.advocateCellPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.advocateCellPhone = newValue;
+        });
+        this.advocateWorkPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.advocateWorkPhone = newValue;
+        });
+        this.emergencyContactPhoneControl.valueChanges.subscribe((hpn) => {
+            const newValue = hpn.replace(/\D/g, '');
+            this.editVictim.emergencyContactPhone = newValue;
+        });
+        console.log('show offenderId');
+        console.log(this.offenderId);
+        console.log('show staffId');
+        console.log(this.staffId);
+        console.log('show isIntake');
+        console.log(this.isIntake);
+        //required field
+        const requiredImplementation = { get: function () {
+                if (this._required) {
+                    return this._required;
+                }
+                if (this.ngControl && this.ngControl.control && this.ngControl.control.validator) {
+                    const emptyValueControl = Object.assign({}, this.ngControl.control);
+                    emptyValueControl.value = null;
+                    return ('required' in (this.ngControl.control.validator(emptyValueControl) || {}));
+                }
+                return false;
+            }, set: function (value) { this._required = coerceBooleanProperty(value); }, };
+        Object.defineProperty(MatInput.prototype, 'required', requiredImplementation);
+        Object.defineProperty(MatSelect.prototype, 'required', requiredImplementation);
+        Object.defineProperty(MatRadioGroup.prototype, 'required', requiredImplementation);
+        //required field end
+        if (this.victimDetail != null) {
+            // edit record
+            this.editMode = true;
+            this.showDelete = true;
+            this.victimId = this.victimDetail.victimId;
+            this.guardianTabFlag = this.victimDetail.minorFlag;
+            if (this.victimDetail.victimAdvocateFlag == 'YS') {
+                this.advocateTabFlag = true;
+            }
+            if (this.otherWeaponFlag == true) {
+                const otherWeaponControl = this.victimForm.get('otherWeapon');
+                otherWeaponControl.setValidators(Validators.required);
+            }
+            if (this.otherDrugFlag == true) {
+                const otherDrugControl = this.victimForm.get('otherDrug');
+                otherDrugControl.setValidators(Validators.required);
+            }
+            this.cpoExpirationDivFlag = this.victimDetail.cpoExpirationFlag;
+            this.commonChildrenDivFlag = this.victimDetail.commonChildrenFlag;
+            this.supportInPlaceDivFlag = this.victimDetail.supportInPlaceFlag;
+            this.weaponInvolvedDivFlag = this.victimDetail.weaponInvolvedFlag;
+            this.drugUseDivFlag = this.victimDetail.drugUseFlag;
+            this.addressId = this.victimDetail.addressId;
+            this.guardianAddressId = this.victimDetail.guardianAddressId;
+            this.advocateAddressId = this.victimDetail.advocateAddressId;
+            this._getVictim();
+        }
+        else {
+            //add new record
+            this.victimForm.patchValue({ guardianNoPhoneFlag: true });
+            this.victimForm.patchValue({ advocateNoPhoneFlag: true });
+        }
+        this.victimService.getFlagOptionYesNoUnknowns().subscribe((items) => {
+            this.flagOption = items;
+        });
+        this.victimService.getGenders().subscribe((items) => {
+            this.genders = items;
+        });
+        this.victimService.getPrefixes().subscribe((items) => {
+            this.prefixes = items;
+        });
+        this.victimService.getSuffixes().subscribe((items) => {
+            this.suffixes = items;
+        });
+        this.victimService.getRelationshipTypes().subscribe((items) => {
+            this.relationshipTypes = items.filter((y) => (y.relationshipCategoryId === 'ST' || y.relationshipCategoryId === 'FM'));
+        });
+        this.victimService.getSupportTypes().subscribe((items) => {
+            this.victimSupportTypes = items;
+        });
+        this.victimService.getWeaponTypes().subscribe((items) => {
+            this.weaponTypes = items;
+        });
+        this.victimService.getDrugsTypes().subscribe((items) => {
+            console.log('drug lookup items');
+            console.log(items);
+            this.drugs = items;
+            this.drugs.push({ drugTypeId: 'OTHER', name: 'Other' });
+            console.log(this.drugs);
+        });
+        // this.victimService.getDocketList(this.offenderId).subscribe(
+        //   (items: any) => {
+        //     this.docketlist = items;
+        //   }
+        // );
+        this.victimForm.get('minorFlag').valueChanges
+            .subscribe(value => {
+            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();
+        });
+        this.victimForm.get('victimAdvocateFlag').valueChanges
+            .subscribe(value => {
+            this.victimForm.get('advocateFirstName').updateValueAndValidity();
+            this.victimForm.get('advocateLastName').updateValueAndValidity();
+            this.victimForm.get('advocateWorkPhone').updateValueAndValidity();
+            this.victimForm.get('advocateHomePhone').updateValueAndValidity();
+            this.victimForm.get('advocateCellPhone').updateValueAndValidity();
+        });
+    }
+    back() {
+        //this.onSave.emit(this.victimDetail);
+        this.router.navigate(['victimList']);
+    }
+    deleteVictim() {
+        this.commonDialogService
+            .confirm('', 'Do you want to delete this Victim?', 'Yes', 'No')
+            .subscribe(res => {
+            this.result = res;
+            if (this.result) {
+                this.victimService.deleteVictims(this.victimDetail.victimId, this.staffId)
+                    .subscribe(result => {
+                    this.snackBar.open('Delete Successfully!', '', {
+                        duration: 3000,
+                    });
+                });
+                // this.onSave.emit(this.victimDetail);
+                // this.router.navigate(['victim']);
+                setTimeout(() => {
+                    window.location.reload();
+                }, 1500);
+            }
+        });
+    }
+    radioMinorChange($event) {
+        if ($event.value === true) {
+            this.guardianTabFlag = true;
+        }
+        else {
+            this.guardianTabFlag = false;
+        }
+    }
+    radioAdvocateChange($event) {
+        const advocateLastNameControl = this.victimForm.get('advocateLastName');
+        const advocateFirstNameControl = this.victimForm.get('advocateFirstName');
+        if ($event.value === "YS") {
+            this.advocateTabFlag = true;
+            advocateLastNameControl.setValidators(Validators.required);
+            advocateFirstNameControl.setValidators(Validators.required);
+        }
+        else {
+            this.advocateTabFlag = false;
+            advocateLastNameControl.clearValidators();
+            advocateFirstNameControl.clearValidators();
+        }
+        advocateLastNameControl.updateValueAndValidity();
+        advocateFirstNameControl.updateValueAndValidity();
+    }
+    radioCicChange($event) {
+        if ($event.value === true) {
+            this.commonChildrenDivFlag = true;
+            // requrie field
+            this.setValidators('commonChildren');
+        }
+        else {
+            this.commonChildrenDivFlag = false;
+        }
+    }
+    setValidators(type) {
+        if (type == 'commonChildren') {
+            this.victimForm.get('commonChildrenNumber').clearValidators();
+            this.victimForm.get('commonChildrenNumber').setValidators(Validators.required);
+        }
+        else if (type == 'cpo') {
+            this.victimForm.get('cpoExpirationDate').clearValidators();
+            this.victimForm.get('cpoExpirationDate').setValidators(Validators.required);
+        }
+    }
+    radioSupportChange($event) {
+        if ($event.value === true) {
+            this.supportInPlaceDivFlag = true;
+        }
+        else {
+            this.supportInPlaceDivFlag = false;
+        }
+    }
+    radioWeaponChange($event) {
+        if ($event.value === true) {
+            this.weaponInvolvedDivFlag = true;
+        }
+        else {
+            this.weaponInvolvedDivFlag = false;
+        }
+    }
+    radioDrugChange($event) {
+        if ($event.value === true) {
+            this.drugUseDivFlag = true;
+        }
+        else {
+            this.drugUseDivFlag = false;
+        }
+    }
+    radioCpoChange($event) {
+        if ($event.value === true) {
+            this.cpoExpirationDivFlag = true;
+            this.setValidators('cpo');
+        }
+        else {
+            this.cpoExpirationDivFlag = false;
+        }
+    }
+    handleDOBChange($event) {
+        var ageDifMs = Date.now() - $event.value;
+        var ageDate = new Date(ageDifMs);
+        if (Math.abs(ageDate.getUTCFullYear() - 1970) <= 18) {
+            this.snackBar.open('Victim is a Minor. This information is a sensitive and should not be disclosed to any unauthorized parties. Contact the legal guardian.', '', {
+                duration: 6000,
+            });
+            const minorControl = this.victimForm.get('minorFlag');
+            minorControl.setValue(true);
+            this.guardianTabFlag = true;
+        }
+    }
+    checkOtherWeapon(WeaponUse) {
+        const otherWeaponControl = this.victimForm.get('otherWeapon');
+        if (WeaponUse.includes("OTHER")) {
+            this.otherWeaponFlag = true;
+            otherWeaponControl.setValidators(Validators.required);
+        }
+        else {
+            this.otherWeaponFlag = false;
+            otherWeaponControl.clearValidators();
+        }
+        otherWeaponControl.updateValueAndValidity();
+    }
+    checkOtherDrug(DrugUse) {
+        const otherDrugControl = this.victimForm.get('otherDrug');
+        if (DrugUse.includes("OTHER")) {
+            this.otherDrugFlag = true;
+            otherDrugControl.setValidators(Validators.required);
+        }
+        else {
+            this.otherDrugFlag = false;
+            otherDrugControl.clearValidators();
+        }
+        otherDrugControl.updateValueAndValidity();
+    }
+    //#region "save victim"
+    saveVictim() {
+        //guardian phone logic
+        if (!this.victimForm.value.guardianNoPhoneFlag) {
+            if (this.guardianHomePhoneControl.value) {
+                if (this.guardianHomePhoneControl.value !== null) {
+                    if (this.guardianHomePhoneControl.value !== "") {
+                        this.guardianPhoneExistFlag = true;
+                    }
+                }
+            }
+            if (this.guardianWorkPhoneControl.value !== undefined) {
+                if (this.guardianWorkPhoneControl.value !== null) {
+                    if (this.guardianWorkPhoneControl.value !== "") {
+                        this.guardianPhoneExistFlag = true;
+                    }
+                }
+            }
+            if (this.guardianCellPhoneControl.value) {
+                if (this.guardianCellPhoneControl.value !== null) {
+                    if (this.guardianCellPhoneControl.value !== "") {
+                        this.guardianPhoneExistFlag = true;
+                    }
+                }
+            }
+        }
+        console.log('this.victimForm.value.guardianNoPhoneFlag');
+        console.log(this.victimForm.value.guardianNoPhoneFlag);
+        console.log('this.guardianPhoneExistFlag');
+        console.log(this.guardianPhoneExistFlag);
+        if (this.guardianPhoneExistFlag === false && this.victimForm.value.guardianNoPhoneFlag === false) {
+            this.phoneValidationFlag = true;
+            this.commonDialogService
+                .warning('', 'Please check the guardian phone field. You have to fill one of the three phone fileds.', 'Ok')
+                .subscribe(res => {
+                this.result = res;
+            });
+        }
+        console.log('this.phoneValidationFlag');
+        console.log(this.phoneValidationFlag);
+        //advocate phone logic
+        if (!this.victimForm.value.advocateNoPhoneFlag) {
+            if (this.advocateHomePhoneControl.value) {
+                if (this.advocateHomePhoneControl.value !== null) {
+                    if (this.advocateHomePhoneControl.value !== "") {
+                        this.advocatePhoneExistFlag = true;
+                    }
+                }
+            }
+            if (this.advocateWorkPhoneControl.value !== undefined) {
+                if (this.advocateWorkPhoneControl.value !== null) {
+                    if (this.advocateWorkPhoneControl.value !== "") {
+                        this.advocatePhoneExistFlag = true;
+                    }
+                }
+            }
+            if (this.advocateCellPhoneControl.value) {
+                if (this.advocateCellPhoneControl.value !== null) {
+                    if (this.advocateCellPhoneControl.value !== "") {
+                        this.advocatePhoneExistFlag = true;
+                    }
+                }
+            }
+        }
+        console.log('this.victimForm.value.advocateNoPhoneFlag');
+        console.log(this.victimForm.value.advocateNoPhoneFlag);
+        console.log('this.advocatePhoneExistFlag');
+        console.log(this.advocatePhoneExistFlag);
+        if (this.advocatePhoneExistFlag === false && this.victimForm.value.advocateNoPhoneFlag === false) {
+            this.phoneValidationFlag = true;
+            this.commonDialogService
+                .warning('', 'Please check the advocate phone field. You have to fill one of the three phone fileds.', 'Ok')
+                .subscribe(res => {
+                this.result = res;
+            });
+        }
+        if (this.homePhoneControl.value) {
+            this.victimForm.value.homePhone = this.homePhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.homePhone = null;
+        }
+        if (this.cellPhoneControl.value) {
+            this.victimForm.value.cellPhone = this.cellPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.cellPhone = null;
+        }
+        if (this.workPhoneControl.value) {
+            this.victimForm.value.workPhone = this.workPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.workPhone = null;
+        }
+        if (this.guardianHomePhoneControl.value) {
+            this.victimForm.value.guardianHomePhone = this.guardianHomePhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.guardianHomePhone = null;
+        }
+        if (this.guardianCellPhoneControl.value) {
+            this.victimForm.value.guardianCellPhone = this.guardianCellPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.guardianCellPhone = null;
+        }
+        if (this.guardianWorkPhoneControl.value) {
+            this.victimForm.value.guardianWorkPhone = this.guardianWorkPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.guardianWorkPhone = null;
+        }
+        if (this.advocateHomePhoneControl.value) {
+            this.victimForm.value.advocateHomePhone = this.advocateHomePhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.advocateHomePhone = null;
+        }
+        if (this.advocateCellPhoneControl.value) {
+            this.victimForm.value.advocateCellPhone = this.advocateCellPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.advocateCellPhone = null;
+        }
+        if (this.advocateWorkPhoneControl.value) {
+            this.victimForm.value.advocateWorkPhone = this.advocateWorkPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.advocateWorkPhone = null;
+        }
+        if (this.emergencyContactPhoneControl.value) {
+            this.victimForm.value.emergencyContactPhone = this.emergencyContactPhoneControl.value.replace(/[()\s-]/g, '');
+        }
+        else {
+            this.victimForm.value.emergencyContactPhone = null;
+        }
+        //data process
+        console.log('this.phoneValidationFlag 1');
+        console.log(this.phoneValidationFlag);
+        if (this.phoneValidationFlag === false) {
+            if (this.victimDetail === null) {
+                //insert new victim
+                var myVictimSupports = [];
+                if (this.victimForm.value.victimSupports) {
+                    this.victimForm.value.victimSupports.forEach(element => {
+                        const victimSupport = {};
+                        victimSupport.victimId = this.victimForm.value.victimId;
+                        victimSupport.victimSupportTypeId = element;
+                        victimSupport.modifiedBy = this.staffId;
+                        myVictimSupports.push(victimSupport);
+                    });
+                }
+                var myVictimDrugUses = [];
+                console.log('this.victimForm.value.victimDrugUses during save');
+                console.log(this.victimForm.value.victimDrugUses);
+                if (this.victimForm.value.victimDrugUses) {
+                    this.victimForm.value.victimDrugUses.forEach(element => {
+                        const victimDrugUse = {};
+                        victimDrugUse.drugTypeId = element;
+                        if (element === "OTHER" || element === "" || element === null) {
+                            victimDrugUse.drugTypeId = null;
+                            victimDrugUse.otherDrug = this.victimForm.value.otherDrug;
+                        }
+                        else {
+                            victimDrugUse.drugTypeId = element;
+                            victimDrugUse.otherDrug = null;
+                        }
+                        victimDrugUse.modifiedBy = this.staffId;
+                        victimDrugUse.victimId = this.victimForm.value.victimId;
+                        myVictimDrugUses.push(victimDrugUse);
+                    });
+                }
+                console.log('this.victimForm.value.victimDrugUses during save 1');
+                console.log(this.victimForm.value.victimDrugUses);
+                var myVictimWeaponUses = [];
+                if (this.victimForm.value.victimWeaponUses) {
+                    this.victimForm.value.victimWeaponUses.forEach(element => {
+                        const victimWeaponUse = {};
+                        victimWeaponUse.victimId = this.victimForm.value.victimId;
+                        victimWeaponUse.weaponTypeId = element;
+                        if (element == "OTHER") {
+                            victimWeaponUse.otherWeapon = this.victimForm.value.otherWeapon;
+                        }
+                        else {
+                            victimWeaponUse.otherWeapon = null;
+                        }
+                        victimWeaponUse.modifiedBy = this.staffId;
+                        myVictimWeaponUses.push(victimWeaponUse);
+                    });
+                }
+                const newVictim = {
+                    victimId: 0,
+                    offenderId: this.offenderId,
+                    victimOffenderRelationshipTypeId: this.victimForm.value.victimOffenderRelationshipTypeId,
+                    lastName: this.victimForm.value.lastName,
+                    firstName: this.victimForm.value.firstName,
+                    middleName: this.victimForm.value.middleName
+                        ? this.victimForm.value.middleName
+                        : null,
+                    prefixId: this.victimForm.value.prefixId
+                        ? this.victimForm.value.prefixId
+                        : null,
+                    suffixId: this.victimForm.value.suffixId
+                        ? this.victimForm.value.suffixId
+                        : null,
+                    birthDate: this.victimForm.value.birthDate
+                        ? this.victimForm.value.birthDate
+                        : null,
+                    genderCode: this.victimForm.value.genderCode
+                        ? this.victimForm.value.genderCode
+                        : null,
+                    underSupervisionFlag: this.victimForm.value.underSupervisionFlag,
+                    minorFlag: this.victimForm.value.minorFlag,
+                    victimAdvocateFlag: this.victimForm.value.victimAdvocateFlag,
+                    homePhone: this.victimForm.value.homePhone,
+                    workPhone: this.victimForm.value.workPhone,
+                    cellPhone: this.victimForm.value.cellPhone,
+                    email: this.victimForm.value.email ? this.victimForm.value.email : null,
+                    addressId: this.victimForm.value.addressId
+                        ? this.victimForm.value.addressId
+                        : 1,
+                    emergencyContact: this.victimForm.value.emergencyContact
+                        ? this.victimForm.value.emergencyContact
+                        : null,
+                    emergencyContactPhone: this.victimForm.value.emergencyContactPhone,
+                    commonChildrenFlag: this.victimForm.value.commonChildrenFlag,
+                    commonChildrenNumber: this.victimForm.value.commonChildrenNumber,
+                    cpoExpirationFlag: this.victimForm.value.cpoExpirationFlag,
+                    cpoExpirationDate: this.victimForm.value.cpoExpirationDate
+                        ? this.datePipe.transform(this.victimForm.value.cpoExpirationDate, "short")
+                        : null,
+                    supportInPlaceFlag: this.victimForm.value.supportInPlaceFlag,
+                    weaponInvolvedFlag: this.victimForm.value.weaponInvolvedFlag,
+                    drugUseFlag: this.victimForm.value.drugUseFlag,
+                    alcoholUseFlag: this.victimForm.value.alcoholUseFlag,
+                    accessRisk: this.victimForm.value.accessRisk,
+                    modifiedBy: this.staffId,
+                    vVictimAdvocate: null,
+                    vVictimGuardian: null,
+                    victimDrugUses: myVictimDrugUses,
+                    victimSupports: myVictimSupports,
+                    victimWeaponUses: myVictimWeaponUses,
+                    advocateFirstName: null,
+                    advocateLastName: null,
+                    advocateEmail: null,
+                    advocatePrefixId: null,
+                    advocateSuffixId: null,
+                    advocateNoPhoneFlag: null,
+                    advocateHomePhone: null,
+                    advocateWorkPhone: null,
+                    advocateCellPhone: null,
+                    advocateAddressId: null,
+                    guardianFirstName: null,
+                    guardianLastName: null,
+                    guardianEmail: null,
+                    guardianPrefixId: null,
+                    guardianSuffixId: null,
+                    guardianNoPhoneFlag: null,
+                    guardianHomePhone: null,
+                    guardianWorkPhone: null,
+                    guardianCellPhone: null,
+                    guardianAddressId: null,
+                    guardianBirthDate: null,
+                    relationship: null,
+                    //relationship: this.victimForm.value.victimOffenderRelationshipTypeId? this.victimForm.value.victimOffenderRelationshipTypeId : null,
+                    allowCsosaContactFlag: this.victimForm.value.allowCsosaContactFlag
+                        ? this.victimForm.value.allowCsosaContactFlag
+                        : null,
+                    liveWithOffenderFlag: this.victimForm.value.liveWithOffenderFlag
+                        ? this.victimForm.value.liveWithOffenderFlag
+                        : null,
+                };
+                if (this.addressId == 0) {
+                    newVictim.addressId = null;
+                }
+                else {
+                    newVictim.addressId = this.addressId;
+                }
+                newVictim.advocateAddressId = this.advocateAddressId;
+                newVictim.guardianAddressId = this.guardianAddressId;
+                console.log('newVictim');
+                console.log(newVictim);
+                this.victimService.postVictims(newVictim).subscribe((items) => {
+                    const id = items ? items.victimId : '';
+                    if (this.victimForm.value.victimAdvocateFlag == "YS") {
+                        console.log('add advocate');
+                        const victimAdvocate = {
+                            victimAdvocateId: id,
+                            lastName: this.victimForm.value.advocateLastName,
+                            firstName: this.victimForm.value.advocateFirstName,
+                            prefixId: this.victimForm.value.advocatePrefixId,
+                            suffixId: this.victimForm.value.advocateSuffixId,
+                            addressId: this.advocateAddressId ? this.advocateAddressId : null,
+                            noPhoneFlag: this.victimForm.value.advocateNoPhoneFlag ? this.victimForm.value.advocateNoPhoneFlag : null,
+                            homePhone: this.victimForm.value.advocateHomePhone,
+                            workPhone: this.victimForm.value.advocateWorkPhone,
+                            cellPhone: this.victimForm.value.advocateCellPhone,
+                            email: this.victimForm.value.advocateEmail,
+                            modifiedBy: this.staffId
+                        };
+                        this.victimService.postVictimAdvocate(id, victimAdvocate).subscribe();
+                    }
+                    if (this.victimForm.value.minorFlag == true) {
+                        const victimGuardian = {
+                            victimGuardianId: id,
+                            lastName: this.victimForm.value.guardianLastName,
+                            firstName: this.victimForm.value.guardianFirstName,
+                            prefixId: this.victimForm.value.guardianPrefixId,
+                            suffixId: this.victimForm.value.guardianSuffixId,
+                            birthDate: this.victimForm.value.guardianBirthDate,
+                            addressId: this.guardianAddressId ? this.guardianAddressId : null,
+                            noPhoneFlag: this.victimForm.value.guardianNoPhoneFlag ? this.victimForm.value.guardianNoPhoneFlag : null,
+                            homePhone: this.victimForm.value.guardianHomePhone,
+                            workPhone: this.victimForm.value.guardianWorkPhone,
+                            cellPhone: this.victimForm.value.guardianCellPhone,
+                            email: this.victimForm.value.guardianEmail,
+                            modifiedBy: this.staffId
+                        };
+                        this.victimService.postVictimGuardian(id, victimGuardian).subscribe();
+                    }
+                    this.snackBar.open('Add Victim Successfully!', '', {
+                        duration: 3000,
+                    });
+                    //insert new
+                    if (this.isIntake === true) {
+                        this.router.navigate(['victimHome']);
+                    }
+                    else {
+                        this.router.navigate(['victimList']);
+                    }
+                    //this.onSave.emit(this.victimDetail);
+                });
+            }
+            else {
+                //update victim
+                this.victimDetail.underSupervisionFlag = this.victimForm.value.underSupervisionFlag;
+                this.victimDetail.victimOffenderRelationshipTypeId = this.victimForm.value.victimOffenderRelationshipTypeId;
+                this.victimDetail.lastName = this.victimForm.value.lastName;
+                this.victimDetail.firstName = this.victimForm.value.firstName;
+                this.victimDetail.middleName = this.victimForm.value.middleName;
+                this.victimDetail.prefixId = this.victimForm.value.prefixId ? this.victimForm.value.prefixId : null;
+                this.victimDetail.suffixId = this.victimForm.value.suffixId ? this.victimForm.value.suffixId : null;
+                this.victimDetail.birthDate = this.victimForm.value.birthDate;
+                this.victimDetail.genderCode = this.victimForm.value.genderCode;
+                this.victimDetail.minorFlag = this.victimForm.value.minorFlag;
+                this.victimDetail.homePhone = this.victimForm.value.homePhone;
+                this.victimDetail.workPhone = this.victimForm.value.workPhone;
+                this.victimDetail.cellPhone = this.victimForm.value.cellPhone;
+                this.victimDetail.email = this.victimForm.value.email;
+                this.victimDetail.victimAdvocateFlag = this.victimForm.value.victimAdvocateFlag;
+                this.victimDetail.emergencyContact = this.victimForm.value.emergencyContact;
+                this.victimDetail.emergencyContactPhone = this.victimForm.value.emergencyContactPhone;
+                this.victimDetail.commonChildrenFlag = this.victimForm.value.commonChildrenFlag;
+                this.victimDetail.commonChildrenNumber = this.victimForm.value.commonChildrenNumber;
+                this.victimDetail.cpoExpirationDate = this.victimForm.value.cpoExpirationDate;
+                this.victimDetail.cpoExpirationFlag = this.victimForm.value.cpoExpirationFlag;
+                this.victimDetail.supportInPlaceFlag = this.victimForm.value.supportInPlaceFlag;
+                this.victimDetail.weaponInvolvedFlag = this.victimForm.value.weaponInvolvedFlag;
+                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.addressId;
+                this.victimDetail.allowCsosaContactFlag = this.victimForm.value.allowCsosaContactFlag;
+                this.victimDetail.liveWithOffenderFlag = this.victimForm.value.liveWithOffenderFlag;
+                this.victimDetail.victimSupports = [];
+                this.victimForm.value.victimSupports.forEach(element => {
+                    const victimSupport = {};
+                    victimSupport.victimId = this.victimDetail.victimId;
+                    victimSupport.victimSupportTypeId = element;
+                    victimSupport.modifiedBy = this.staffId;
+                    this.victimDetail.victimSupports.push(victimSupport);
+                });
+                this.victimDetail.victimDrugUses = [];
+                this.victimForm.value.victimDrugUses.forEach(element => {
+                    const victimDrugUse = {};
+                    victimDrugUse.drugTypeId = element;
+                    console.log('this.victimForm.value.victimDrugUses before');
+                    console.log(this.victimForm.value.victimDrugUses);
+                    if (element === "OTHER" || element === "") {
+                        victimDrugUse.drugTypeId = null;
+                        victimDrugUse.otherDrug = this.victimForm.value.otherDrug;
+                    }
+                    else {
+                        victimDrugUse.drugTypeId = element;
+                        victimDrugUse.otherDrug = null;
+                    }
+                    victimDrugUse.modifiedBy = this.staffId;
+                    victimDrugUse.victimId = this.victimDetail.victimId;
+                    this.victimDetail.victimDrugUses.push(victimDrugUse);
+                });
+                this.victimForm.value.victimDrugUses.filter(word => (!(word.drugTypeId === null && word.otherDrug === null)));
+                this.victimDetail.victimWeaponUses = [];
+                this.victimForm.value.victimWeaponUses.forEach(element => {
+                    const victimWeaponUse = {};
+                    victimWeaponUse.victimId = this.victimDetail.victimId;
+                    victimWeaponUse.weaponTypeId = element;
+                    if (element == "OTHER") {
+                        victimWeaponUse.otherWeapon = this.victimForm.value.otherWeapon;
+                    }
+                    else {
+                        victimWeaponUse.otherWeapon = null;
+                    }
+                    victimWeaponUse.modifiedBy = this.staffId;
+                    this.victimDetail.victimWeaponUses.push(victimWeaponUse);
+                });
+                console.log('this.victimDetail before emit');
+                console.log(this.victimDetail);
+                this.victimService.putVictims(this.victimDetail.victimId, this.victimDetail).subscribe((items) => {
+                    this.snackBar.open('Update Successfully!', '', {
+                        duration: 3000,
+                    });
+                    //Advocate section
+                    this.victimAdvocate.victimAdvocateId = this.victimDetail.victimId;
+                    this.victimAdvocate.lastName = this.victimForm.value.advocateLastName;
+                    this.victimAdvocate.firstName = this.victimForm.value.advocateFirstName;
+                    this.victimAdvocate.prefixId = this.victimForm.value.advocatePrefixId ? this.victimForm.value.advocatePrefixId : null;
+                    this.victimAdvocate.suffixId = this.victimForm.value.advocateSuffixId ? this.victimForm.value.advocateSuffixId : null;
+                    this.victimAdvocate.addressId = this.advocateAddressId ? this.advocateAddressId : null;
+                    this.victimAdvocate.noPhoneFlag = this.victimForm.value.advocateNoPhoneFlag ? true : false;
+                    this.victimAdvocate.homePhone = this.victimForm.value.advocateHomePhone;
+                    this.victimAdvocate.workPhone = this.victimForm.value.advocateWorkPhone;
+                    this.victimAdvocate.cellPhone = this.victimForm.value.advocateCellPhone;
+                    this.victimAdvocate.email = this.victimForm.value.advocateEmail ? this.victimForm.value.advocateEmail : null;
+                    this.victimAdvocate.modifiedBy = this.staffId;
+                    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(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;
+                    this.victimGuardian.lastName = this.victimForm.value.guardianLastName;
+                    this.victimGuardian.firstName = this.victimForm.value.guardianFirstName;
+                    this.victimGuardian.prefixId = this.victimForm.value.guardianPrefixId ? this.victimForm.value.guardianPrefixId : null;
+                    this.victimGuardian.suffixId = this.victimForm.value.guardianSuffixId ? this.victimForm.value.guardianSuffixId : null;
+                    this.victimGuardian.addressId = this.guardianAddressId ? this.guardianAddressId : null;
+                    this.victimGuardian.noPhoneFlag = this.victimForm.value.guardianNoPhoneFlag ? true : false;
+                    this.victimGuardian.homePhone = this.victimForm.value.guardianHomePhone;
+                    this.victimGuardian.workPhone = this.victimForm.value.guardianWorkPhone;
+                    this.victimGuardian.cellPhone = this.victimForm.value.guardianCellPhone;
+                    this.victimGuardian.email = this.victimForm.value.guardianEmail ? this.victimForm.value.guardianEmail : null;
+                    this.victimGuardian.modifiedBy = this.staffId;
+                    if (this.victimDetail.minorFlag == true) {
+                        if (this.victimDetail.guardianFirstName != null)
+                            this.victimService.putVictimGuardian(this.victimDetail.victimId, this.victimGuardian).subscribe(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"
+    addContact() {
+        this.router.navigate(['victimContact', this.victimId]);
+    }
+    formatLabel(value) {
+        return value;
+    }
+}
+/** @nocollapse */ SmartVictimDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SmartVictimDetailComponent, deps: [{ token: i8$1.Location }, { token: i1$2.UntypedFormBuilder }, { token: i1$1.MatDialog }, { token: i5.ActivatedRoute }, { token: i5.Router }, { token: i4.MatSnackBar }, { token: CommonDialogService }, { token: NgcSmartVictimService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ SmartVictimDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SmartVictimDetailComponent, selector: "csmart-victim-detail", inputs: { victimDetail: "victimDetail", staffId: "staffId", offenderId: "offenderId", isIntake: "isIntake" }, outputs: { onSave: "onSave", onCancel: "onCancel" }, providers: [CommonDialogService], viewQueries: [{ propertyName: "addressComponent", first: true, predicate: ["addressComponent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-card>\n  <mat-card-content>\n\n        <div  [formGroup]=\"victimForm\">\n\n          <mat-tab-group dynamicHeight  mat-stretch-tabs>\n            <mat-tab label=\"Victim Detail\" >\n              <div class='container'>\n\n                    <mat-form-field>\n                      <mat-label>Is victim a minor?<font color=\"red\">* </font></mat-label>\n                      <br>\n                      <mat-radio-group  formControlName=\"minorFlag\"  (change)=\"radioMinorChange($event)\" [(ngModel)]=\"editVictim.minorFlag\" >\n                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                    </mat-radio-group>\n                    <input matInput placeholder=\"\" style=\"display: none\">\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\n                    </div>\n\n                  </mat-form-field>\n\n                  <mat-form-field>\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>\n                    <br>\n                    <br>\n                    <mat-radio-group class = \"tp-radio-group\"  formControlName=\"victimAdvocateFlag\"  (change)=\"radioAdvocateChange($event)\" [(ngModel)]=\"editVictim.victimAdvocateFlag\">\n                      <mat-radio-button  color=\"primary\" *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\">{{item.name}} </mat-radio-button>&nbsp;\n                    </mat-radio-group>\n                    <input matInput placeholder=\"\" style=\"display: none\">\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors\n                    && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\n                    <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\n                    </div>\n                  </mat-form-field>\n\n\n               <mat-form-field>\n                  <mat-label>Victim Currently Under Supervision:</mat-label>\n                    <mat-select  formControlName=\"underSupervisionFlag\" name=\"supervision\" [(ngModel)]=\"editVictim.underSupervisionFlag\" >\n                      <mat-option *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\" >\n                        {{item.name}}</mat-option>\n                    </mat-select>\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors\n                    && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\n                    <mat-error>under supervision field is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n\n               <mat-form-field>\n                  <mat-label>Relationship to Offender:</mat-label>\n                    <mat-select formControlName=\"victimOffenderRelationshipTypeId\" [(ngModel)]=\"editVictim.victimOffenderRelationshipTypeId\"  >\n                      <mat-option *ngFor=\"let item of relationshipTypes\" [value]=\"item.relationshipTypeId\">{{item.name}}</mat-option>\n                    </mat-select>\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors\n                    && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\n                    <mat-error>relationship is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n\n                <mat-form-field>\n                  <mat-label>Victim Last Name:</mat-label>\n                  <input matInput formControlName=\"lastName\"  [(ngModel)]=\"editVictim.lastName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors\n                  && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\n                  <mat-error>victim last name is <strong>required</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim First Name: </mat-label>\n                  <input matInput  formControlName=\"firstName\" [(ngModel)]=\"editVictim.firstName\"  >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors\n                  && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\n                  <mat-error>victim first name is <strong>required</strong></mat-error>\n                 </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Middle Name:</mat-label>\n                    <input matInput  formControlName=\"middleName\" [(ngModel)]=\"editVictim.middleName\">\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Prefix:</mat-label>\n                    <mat-select  formControlName=\"prefixId\" [(ngModel)]=\"editVictim.prefixId\">\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Suffix:</mat-label>\n                    <mat-select  formControlName=\"suffixId\"  [(ngModel)]=\"editVictim.suffixId\">\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Sex:</mat-label>\n                  <mat-select  formControlName=\"genderCode\" [(ngModel)]=\"editVictim.genderCode\">\n                    <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\n                  </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Date of Birth:</mat-label>\n                   <input matInput\n                   [matDatepicker]=\"victimBirthRef\"\n                   formControlName=\"birthDate\"\n                  [(ngModel)]=\"editVictim.birthDate\"\n                  (click)=\"victimBirthRef.open()\"\n                  (dateChange)=\"handleDOBChange($event)\"\n                    >\n                  <mat-datepicker-toggle [for]=\"victimBirthRef\" matSuffix></mat-datepicker-toggle>\n                  <mat-datepicker #victimBirthRef></mat-datepicker>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.homePhone\"\n                    [phoneControl]=\"homePhoneControl\"\n                    [formControl]=\"homePhoneControl\"\n                    maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('homePhone').errors\n                  && (victimForm.get('homePhone').dirty || victimForm.get('homePhone').touched)\">\n                  <mat-error><strong>Home phone number format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Victim Cell Phone:</mat-label>\n                  <input\n                  id=\"tel1\"\n                  matInput\n                  phoneMask\n                  [preValue]=\"editVictim.cellPhone\"\n                  [phoneControl]=\"cellPhoneControl\"\n                  [formControl]=\"cellPhoneControl\"\n                  maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('cellPhone').errors\n                  && (victimForm.get('cellPhone').dirty || victimForm.get('cellPhone').touched)\">\n                   <mat-error><strong>Cell phone number format is not correct.</strong></mat-error>\n              </div>\n                </mat-form-field>\n\n\n                <mat-form-field >\n                  <mat-label>Victim Work Phone:</mat-label>\n                  <input\n                  id=\"tel2\"\n                  matInput\n                  phoneMask\n                  [preValue]=\"editVictim.workPhone\"\n                  [phoneControl]=\"workPhoneControl\"\n                  [formControl]=\"workPhoneControl\"\n                  maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('workPhone').errors\n                  && (victimForm.get('workPhone').dirty || victimForm.get('workPhone').touched)\">\n                  <mat-error><strong>Work phone number format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Victim Email:</mat-label>\n                   <input matInput  formControlName=\"email\" [(ngModel)]=\"editVictim.email\" >\n                   <div class=\"help-block\" *ngIf=\"victimForm.get('email').errors\n                  && (victimForm.get('email').dirty || victimForm.get('email').touched)\">\n                  <mat-error><strong>victim email format is not correct.</strong></mat-error>\n              </div>\n                </mat-form-field>\n\n                <div></div>\n                <app-smart-address\n                [modifiedBy]=\"staffId\"\n                [id]=\"addressId\"\n                [outline]=\"true\"\n                [showPsa]=\"true\"\n                [addressValidators]=\"addressValidators\"\n                [readonly]=\"false\"\n                (addressIdChange)=\"onAddressChange($event)\"\n                #addressComponent >\n\n                </app-smart-address>\n\n\n                  <!-- Docket:\n                  <div>\n                    <div  *ngFor=\"let docket of docketlist; let i=index\">\n                      <mat-checkbox >{{docket.docketNumber}}</mat-checkbox>\n                    </div>\n                  </div> -->\n                  <div>\n                  <mat-checkbox  color=\"primary\" formControlName=\"liveWithOffenderFlag\" name=\"liveWithOffenderFlag\" [(ngModel)]=\"editVictim.liveWithOffenderFlag\"   (change)=\"showAddress($event)\"  >victim live with offender</mat-checkbox>\n                  <br>\n                  <mat-checkbox  color=\"primary\" formControlName=\"allowCsosaContactFlag\" name=\"allowCsosaContactFlag\" [(ngModel)]=\"editVictim.allowCsosaContactFlag\">victim wants to be contacted by CSOSA</mat-checkbox>\n                  </div>\n\n                </div>\n\n                <mat-card>\n                      <mat-form-field>\n                        <mat-label> Children in Common</mat-label>\n                        <br>\n                        <mat-radio-group formControlName=\"commonChildrenFlag\" [(ngModel)]=\"editVictim.commonChildrenFlag\"  (change)=\"radioCicChange($event)\">\n                            <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                            <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                          </mat-radio-group>\n                          <input matInput placeholder=\"\" style=\"display: none\">\n                        </mat-form-field>\n\n                       <div  *ngIf=\"commonChildrenDivFlag\">\n\n                          <mat-form-field >\n                            <mat-label>\n                              Children number\n                             </mat-label>\n                              <input matInput  formControlName=\"commonChildrenNumber\" [(ngModel)]=\"editVictim.commonChildrenNumber\" >\n                            </mat-form-field>\n\n                  </div>\n\n                      <mat-form-field>\n                        <mat-label>CPO: </mat-label>\n                        <br>\n                          <mat-radio-group formControlName=\"cpoExpirationFlag\"  [(ngModel)]=\"editVictim.cpoExpirationFlag\" (change)=\"radioCpoChange($event)\">\n                              <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                              <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                            </mat-radio-group>\n                            <input matInput placeholder=\"\" style=\"display: none\">\n                          </mat-form-field>\n\n                      <div *ngIf=\"cpoExpirationDivFlag\">\n                          <mat-form-field>\n                            <mat-label>Expiration Date: </mat-label>\n                               <input matInput\n                               [matDatepicker]=\"cpoDateRef\"\n                               formControlName=\"cpoExpirationDate\"\n                              (click)=\"cpoDateRef.open()\"\n                              [(ngModel)]=\"editVictim.cpoExpirationDate\"  >\n                              <mat-datepicker-toggle [for]=\"cpoDateRef\" matSuffix></mat-datepicker-toggle>\n                              <mat-datepicker #cpoDateRef></mat-datepicker>\n                            </mat-form-field>\n\n                      </div>\n\n                    <br>\n                    <br>\n\n                          <mat-form-field>\n                            <mat-label>Victim has a Support System in Place? </mat-label>\n                             <br>\n                            <mat-radio-group formControlName=\"supportInPlaceFlag\" [(ngModel)]=\"editVictim.supportInPlaceFlag\"  (change)=\"radioSupportChange($event)\">\n                                <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                              </mat-radio-group>\n                              <input matInput placeholder=\"\" style=\"display: none\">\n                            </mat-form-field>\n\n                        <div *ngIf=\"supportInPlaceDivFlag\">\n                            <mat-form-field>\n                              <mat-label>Support type? </mat-label>\n                                <mat-select #supportSel formControlName=\"victimSupports\" [(ngModel)]=\"editVictim.victimSupports\" multiple>\n                                  <div (mouseleave)=\"supportSel.close()\">\n                                    <mat-option color=\"primary\" *ngFor=\"let item of victimSupportTypes\" [value]=\"item.victimSupportTypeId\">\n                                      {{item.name}}\n                                    </mat-option>\n                                 </div>\n                                </mat-select>\n                                <input matInput placeholder=\"\" style=\"display: none\">\n                              </mat-form-field>\n\n                        </div>\n\n                      <br>\n                      <br>\n\n                            <mat-form-field>\n                              <mat-label>Weapons Involved?</mat-label>\n                              <br>\n                              <mat-radio-group formControlName=\"weaponInvolvedFlag\" (change)=\"radioWeaponChange($event)\" [(ngModel)]=\"editVictim.weaponInvolvedFlag\" >\n                                  <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                  <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                </mat-radio-group>\n                                <input matInput placeholder=\"\" style=\"display: none\">\n                            </mat-form-field>\n\n\n                          <div *ngIf=\"weaponInvolvedDivFlag\">\n                              <mat-form-field>\n                                <mat-label>Weapon Type</mat-label>\n                                  <mat-select  #weaponSel formControlName=\"victimWeaponUses\" multiple [(ngModel)]=\"editVictim.victimWeaponUses\" (selectionChange)=\"checkOtherWeapon($event.value)\" >\n                                    <div (mouseleave)=\"weaponSel.close()\">\n                                      <mat-option color=\"primary\" *ngFor=\"let item of weaponTypes\" [value]=\"item.weaponTypeId\">\n                                        {{item.name}}\n                                      </mat-option>\n                                    </div>\n                                  </mat-select>\n                                  <input matInput placeholder=\"\" style=\"display: none\">\n                                </mat-form-field>\n                          </div>\n\n                          <div *ngIf=\"otherWeaponFlag\">\n                             <mat-form-field>\n                              <mat-label>Other Weapon:* </mat-label>\n                              <input matInput  formControlName=\"otherWeapon\" >\n                              </mat-form-field>\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors\n                              && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\n                              <mat-error><strong>Other weapon is required.</strong></mat-error>\n                              </div>\n                          </div>\n\n\n                        <br>\n                        <br>\n\n                              <mat-form-field>\n                                <mat-label>Was Offender under the influence of alcohol at the time of the offense?</mat-label>\n                                <br>\n                                <mat-radio-group formControlName=\"alcoholUseFlag\" [(ngModel)]=\"editVictim.alcoholUseFlag\" >\n                                    <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                    <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                  </mat-radio-group>\n                                  <input matInput placeholder=\"\" style=\"display: none\">\n                                </mat-form-field>\n\n                          <br>\n                          <br>\n\n                                <mat-form-field>\n                                  <mat-label>Was Offender under the influence of drugs at the time of the offense?</mat-label>\n                                  <br>\n                                  <mat-radio-group formControlName=\"drugUseFlag\" (change)=\"radioDrugChange($event)\" [(ngModel)]=\"editVictim.drugUseFlag\"  >\n                                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                    </mat-radio-group>\n                                    <input matInput placeholder=\"\" style=\"display: none\">\n                                  </mat-form-field>\n\n                              <div *ngIf=\"drugUseDivFlag\">\n                                  <mat-form-field>\n                                    <mat-label>Drug:</mat-label>\n                                      <mat-select  #drugSel formControlName=\"victimDrugUses\" multiple   (selectionChange)=\"checkOtherDrug($event.value)\" >\n                                        <div (mouseleave)=\"drugSel.close()\">\n                                            <mat-option color=\"primary\" *ngFor=\"let item of drugs\" [value]=\"item.drugTypeId\">\n                                            {{item.name}}\n                                          </mat-option>\n\n                                        </div>\n                                      </mat-select>\n                                      <input matInput placeholder=\"\" style=\"display: none\">\n                                    </mat-form-field>\n\n                              </div>\n\n                              <div *ngIf=\"otherDrugFlag\">\n                                <mat-form-field>\n                                 <mat-label>Other Drug:* </mat-label>\n                                 <input matInput  formControlName=\"otherDrug\" >\n                                 </mat-form-field>\n                                 <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors\n                                 && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\n                                 <mat-error><strong>Other drug is required.</strong></mat-error>\n                                 </div>\n                             </div>\n                            <br>\n                            <br>\n\n                            <div>\n                                <div>\n                                <mat-label>\n                                  Access Risk: 1 thru 10 (10 greatest risk): &nbsp;<b> {{editVictim.accessRisk}}</b>\n                                </mat-label>\n                                </div>\n                                <div>\n\n                                    <mat-slider\n                                    formControlName=\"accessRisk\"\n                                    thumbLabel=\"true\"\n                                    [displayWith]=\"formatLabel\"\n                                    min=\"1\"\n                                    max=\"10\"\n                                    [(ngModel)]=\"editVictim.accessRisk\"\n                                    ></mat-slider>\n\n                                </div>\n\n                            </div>\n\n                          </mat-card>\n\n\n              <br><br><br>\n            </mat-tab>\n\n           <mat-tab  *ngIf=\"guardianTabFlag\" label=\"Legal Guardian\">\n            <div class='container'>\n              <mat-form-field>\n                  <mat-label>Guardian Last Name:</mat-label>\n                  <input matInput formControlName=\"guardianLastName\" [(ngModel)]=\"editVictim.guardianLastName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors \">\n                    <mat-error>Guardian last name is <strong>required</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n               <mat-form-field>\n                <mat-label>Guardian First Name:</mat-label>\n                  <input matInput  formControlName=\"guardianFirstName\" [(ngModel)]=\"editVictim.guardianFirstName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \">\n                    <mat-error>Guardian first name is <strong>required</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n\n              <mat-form-field>\n                <mat-label>Guardian Prefix:</mat-label>\n                  <mat-select  formControlName=\"guardianPrefixId\" [(ngModel)]=\"editVictim.guardianPrefixId\" >\n                    <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                  </mat-select>\n              </mat-form-field>\n\n              <mat-form-field>\n                <mat-label>Guardian Suffix:</mat-label>\n                  <mat-select  formControlName=\"guardianSuffixId\" [(ngModel)]=\"editVictim.guardianSuffixId\"  >\n                    <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                  </mat-select>\n                </mat-form-field>\n\n\n                <!-- <mat-form-field>\n                    <mat-select placeholder=\"Choose\" formControlName=\"guardianGender\" [(ngModel)]=\"editVictim.guardianGender\">\n                      <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\n                    </mat-select>\n                  </mat-form-field> -->\n\n\n                <mat-form-field>\n                  <mat-label>Date of Birth:</mat-label>\n                     <input matInput\n                     [matDatepicker]=\"guardianDateRef\"\n                     formControlName=\"guardianBirthDate\"\n                     [(ngModel)]=\"editVictim.guardianBirthDate\"\n                     (click)=\"guardianDateRef.open()\"\n                       >\n                    <mat-datepicker-toggle [for]=\"guardianDateRef\" matSuffix></mat-datepicker-toggle>\n                    <mat-datepicker #guardianDateRef></mat-datepicker>\n                </mat-form-field>\n\n                <div></div>\n                  <mat-form-field >\n                  <mat-checkbox\n                  color = \"primary\"\n                  formControlName=\"guardianNoPhoneFlag\">\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\n                  <input matInput placeholder=\"\" style=\"display: none;\">\n                </mat-form-field>\n\n\n                <div></div>\n                <mat-card>\n                <mat-form-field >\n                  <mat-label>Guardian Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.guardianHomePhone\"\n                    [phoneControl]=\"guardianHomePhoneControl\"\n                    [formControl]=\"guardianHomePhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianHomePhone').errors\n                    && (victimForm.get('guardianHomePhone').dirty || victimForm.get('guardianHomePhone').touched)\">\n                    <mat-error><strong>Guardian home phone number format is not correct.</strong></mat-error>\n                  </div>\n\n\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Guardian Cell Phone:</mat-label>\n                   <input\n                   id=\"tel4\"\n                   matInput\n                   phoneMask\n                   [preValue]=\"editVictim.guardianCellPhone\"\n                   [phoneControl]=\"guardianCellPhoneControl\"\n                   [formControl]=\"guardianCellPhoneControl\"\n                   maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianCellPhone').errors\n                     && (victimForm.get('guardianCellPhone').dirty || victimForm.get('guardianCellPhone').touched)\">\n                    <mat-error><strong>Guardian Cell phone number format is not correct.</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Guardian Work Phone:</mat-label>\n\n                    <input\n                    id=\"tel5\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.guardianWorkPhone\"\n                    [phoneControl]=\"guardianWorkPhoneControl\"\n                    [formControl]=\"guardianWorkPhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianWorkPhone').errors\n                       && (victimForm.get('guardianWorkPhone').dirty || victimForm.get('guardianWorkPhone').touched)\">\n                       <mat-error><strong>Guardian work phone number format is not correct.</strong></mat-error>\n                    </div>\n\n\n                </mat-form-field>\n              </mat-card>\n\n              <div></div>\n\n                <mat-form-field>\n                  <mat-label>Guardian Email:</mat-label>\n                    <input matInput formControlName=\"guardianEmail\" [(ngModel)]=\"editVictim.guardianEmail\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianEmail').errors\n                    && (victimForm.get('guardianEmail').dirty || victimForm.get('guardianEmail').touched)\">\n                   <mat-error><strong>Guardian email format is not correct.</strong></mat-error>\n                   </div>\n                </mat-form-field>\n\n                <div></div>\n\n                <div>\n                <app-smart-address\n\n                [showPsa]=\"true\"\n                [modifiedBy]=\"staffId\"\n                [id]=\"guardianAddressId\"\n                (addressIdChange)=\"onGuardianAddressChange($event)\"\n                [outline]=\"true\"\n                readonly=\"false\"\n                [rowHeight]=\"80\"\n                (isValid)=\"false\"\n                [addressValidators]=\"addressValidators\"\n                #guardianAddressComponent\n                >\n                </app-smart-address>\n                </div>\n              </div>\n\n              <br><br><br>\n            </mat-tab>\n\n            <!--advocate-->\n\n              <mat-tab  *ngIf=\"advocateTabFlag\" label=\"Advocate\" >\n                <div class='container'>\n\n                <mat-form-field>\n                  <mat-label>Advocate Last Name:</mat-label>\n                    <input matInput  formControlName=\"advocateLastName\" [(ngModel)]=\"editVictim.advocateLastName\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors \">\n                      <mat-error>Advocate last name is <strong>required</strong></mat-error>\n                    </div>\n                 </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate First Name:</mat-label>\n                    <input matInput  formControlName=\"advocateFirstName\" [(ngModel)]=\"editVictim.advocateFirstName\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors \">\n                      <mat-error>Advocate first name is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Prefix:</mat-label>\n                    <mat-select  formControlName=\"advocatePrefixId\"  [(ngModel)]=\"editVictim.advocatePrefixId\" >\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Suffix:</mat-label>\n                    <mat-select  formControlName=\"advocateSuffixId\" [(ngModel)]=\"editVictim.advocateSuffixId\"  >\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n\n                <mat-form-field>\n                  <mat-checkbox\n                  color = \"primary\"\n                  formControlName=\"advocateNoPhoneFlag\"\n\n                  [(ngModel)]=\"editVictim.advocateNoPhoneFlag\" >\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\n                  <input matInput placeholder=\"\" style=\"display: none;\">\n                </mat-form-field>\n\n                <div></div>\n                <mat-card>\n                <mat-form-field >\n                  <mat-label>Advocate Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateHomePhone\"\n                    [phoneControl]=\"advocateHomePhoneControl\"\n                    [formControl]=\"advocateHomePhoneControl\"\n                    maxlength=\"14\"/>\n\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateHomePhone').errors\n                    && (victimForm.get('advocateHomePhone').dirty || victimForm.get('advocateHomePhone').touched)\">\n                    <mat-error><strong>Advocate home number format is not correct.</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Cell Phone:</mat-label>\n                    <input\n                    id=\"tel7\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateCellPhone\"\n                    [phoneControl]=\"advocateCellPhoneControl\"\n                    [formControl]=\"advocateCellPhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateCellPhone').errors\n                    && (victimForm.get('advocateCellPhone').dirty || victimForm.get('advocateCellPhone').touched)\">\n                    <mat-error><strong>Advocate cell number format is not correct.</strong></mat-error>\n                  </div>\n\n\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Work Phone:</mat-label>\n                    <input\n                    id=\"tel8\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateWorkPhone\"\n                    [phoneControl]=\"advocateWorkPhoneControl\"\n                    [formControl]=\"advocateWorkPhoneControl\"\n                    maxlength=\"14\"/>\n\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateWorkPhone').errors\n                    && (victimForm.get('advocateWorkPhone').dirty || victimForm.get('advocateWorkPhone').touched)\">\n                    <mat-error><strong>Advocate work number format is not correct.</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n                </mat-card>\n\n                <div></div>\n\n                <mat-form-field>\n                  <mat-label>Advocate Email:</mat-label>\n                    <input matInput formControlName=\"advocateEmail\"  [(ngModel)]=\"editVictim.advocateEmail\" >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateEmail').errors\n                    && (victimForm.get('advocateEmail').dirty || victimForm.get('advocateEmail').touched)\">\n                    <mat-error><strong>Advocate email format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <div></div>\n\n\n              <div >\n              <app-smart-address\n              [showPsa]=\"true\"\n              [modifiedBy]=\"staffId\"\n              [id]=\"advocateAddressId\"\n              (addressIdChange)=\"onAdvocateAddressChange($event)\"\n              [outline]=\"true\"\n              readonly=\"false\"\n              [rowHeight]=\"80\"\n              (isValid)=\"false\"\n              [addressValidators]=\"addressValidators\"\n              #advocateAddressComponent >\n              </app-smart-address>\n              </div>\n              </div>\n              <br><br><br>\n            </mat-tab>\n\n\n             <mat-tab  label=\"Emergency Contact\">\n                <div class='container'>\n\n                        <mat-form-field>\n                          <mat-label>Emergency Contact Name:</mat-label>\n                            <input matInput  formControlName=\"emergencyContact\" [(ngModel)]=\"editVictim.emergencyContact\"  >\n                          </mat-form-field>\n\n                          <mat-form-field>\n                            <mat-label>Emergency Phone Number:</mat-label>\n\n                               <input\n                               id=\"tel\"\n                               matInput\n                               phoneMask\n                               [preValue]=\"editVictim.emergencyContactPhone\"\n                               [phoneControl]=\"emergencyContactPhoneControl\"\n                               [formControl]=\"emergencyContactPhoneControl\"\n                               maxlength=\"14\"/>\n\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('emergencyContactPhone').errors\n                              && (victimForm.get('emergencyContactPhone').dirty || victimForm.get('emergencyContactPhone').touched)\">\n                              <mat-error><strong>Emergency contact number format is not correct.</strong></mat-error>\n                            </div>\n                            </mat-form-field>\n\n                </div>\n                <br><br><br>\n            </mat-tab>\n\n          </mat-tab-group>\n          <div class='outer'>\n            <div>\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>\n\n               <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors\n              && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\n              <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\n              </div>\n\n               <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors\n              && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\n              <mat-error>Under supervision field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors\n              && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\n              <mat-error>Relationship is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors\n              && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\n              <mat-error>Victim last name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors\n              && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\n              <mat-error>victim first name is <strong>required</strong></mat-error>\n             </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors\n              && (victimForm.get('guardianFirstName').dirty || victimForm.get('guardianFirstName').touched)\">\n                <mat-error>Guardian first name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors\n             && (victimForm.get('guardianLastName').dirty || victimForm.get('guardianLastName').touched)\" >\n              <mat-error>Guardian last name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors\n                && (victimForm.get('advocateLastName').dirty || victimForm.get('advocateLastName').touched)\" >\n                  <mat-error>Advocate last name is <strong>required</strong></mat-error>\n                  </div>\n\n                <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors\n                && (victimForm.get('advocateFirstName').dirty || victimForm.get('advocateFirstName').touched)\">\n                  <mat-error>Advocate first name is <strong>required</strong></mat-error>\n                </div>\n\n\n                <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors\n                    && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\n                    <mat-error>Other weapon field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors\n              && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\n              <mat-error>Other drug field is <strong>required</strong></mat-error>\n             </div>\n\n\n            </div>\n\n                  <div class=\"inner\">\n                     <button  mat-raised-button color=\"primary\" (click)=\"saveVictim()\" [disabled]=\"!victimForm.valid\"  >Save </button>\n                  </div>\n                  &nbsp;&nbsp;\n                  <div *ngIf=\"showDelete\" class=\"inner\">\n                  <button  mat-raised-button color=\"primary\" (click)=\"deleteVictim()\">Delete </button>\n                 </div>\n                  &nbsp;&nbsp;\n                  <div class=\"inner\">\n                  <button  mat-raised-button color=\"primary\" (click)=\"cancel()\">Clear </button>\n                </div>\n                  &nbsp;&nbsp;\n                  <button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n\n            </div>\n\n        </div>\n        <br>\n        <br>\n\n        <div align=\"right\">\n          <button mat-raised-button color=\"primary\"  (click)=\"addContact()\"  >Add victim contact</button>\n        </div>\n\n        <div>\n\n          <mat-table #table [dataSource]=\"contactDataSource\" class=\"example-table\">\n            <ng-container matColumnDef=\"contactDate\">\n                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Date</mat-header-cell>\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactDate | date}} </mat-cell>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"victimContactMethod\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Method</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimContactMethod}} </mat-cell>\n            </ng-container>\n\n            <ng-container matColumnDef=\"nextContactDate\">\n              <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Next Contact Date</mat-header-cell>\n              <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.nextContactDate | date}} </mat-cell>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"staff\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact By</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.staff}} </mat-cell>\n            </ng-container>\n            <ng-container matColumnDef=\"comment\">\n                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                    </ng-container>\n\n            <ng-container matColumnDef=\"contactId\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n\n                </mat-cell>\n            </ng-container>\n\n            <mat-header-row *matHeaderRowDef=\"['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId']\" class=\"example-header-row\"></mat-header-row>\n            <mat-row *matRowDef=\"let row; columns:['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId'];\" class=\"example-row\"></mat-row>\n            </mat-table>\n\n\n        </div>\n\n  </mat-card-content>\n</mat-card>\n", styles: ["mat-form-field{width:100%}.container{margin:16px;display:grid;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:grid;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}\n"], dependencies: [{ kind: "directive", type: i8$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i10.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i10.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type: i11.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i13.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "disableRipple"], exportAs: ["matTabGroup"] }, { kind: "component", type: i13.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "directive", type: i14.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatLabel, selector: "mat-label" }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i15.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i18.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i11$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i20.SmartAddressComponent, selector: "app-smart-address", inputs: ["showPsa", "housingTypeId", "modifiedBy", "rowHeight", "id", "outline", "readonly", "addressValidators"], outputs: ["isValid", "addressIdChange"] }, { kind: "directive", type: i21.PhoneMaskDirective, selector: "[phoneMask]", inputs: ["phoneControl", "preValue"] }, { kind: "pipe", type: i8$1.DatePipe, name: "date" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SmartVictimDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'csmart-victim-detail', providers: [CommonDialogService], template: "<mat-card>\n  <mat-card-content>\n\n        <div  [formGroup]=\"victimForm\">\n\n          <mat-tab-group dynamicHeight  mat-stretch-tabs>\n            <mat-tab label=\"Victim Detail\" >\n              <div class='container'>\n\n                    <mat-form-field>\n                      <mat-label>Is victim a minor?<font color=\"red\">* </font></mat-label>\n                      <br>\n                      <mat-radio-group  formControlName=\"minorFlag\"  (change)=\"radioMinorChange($event)\" [(ngModel)]=\"editVictim.minorFlag\" >\n                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                    </mat-radio-group>\n                    <input matInput placeholder=\"\" style=\"display: none\">\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\n                    </div>\n\n                  </mat-form-field>\n\n                  <mat-form-field>\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>\n                    <br>\n                    <br>\n                    <mat-radio-group class = \"tp-radio-group\"  formControlName=\"victimAdvocateFlag\"  (change)=\"radioAdvocateChange($event)\" [(ngModel)]=\"editVictim.victimAdvocateFlag\">\n                      <mat-radio-button  color=\"primary\" *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\">{{item.name}} </mat-radio-button>&nbsp;\n                    </mat-radio-group>\n                    <input matInput placeholder=\"\" style=\"display: none\">\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors\n                    && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\n                    <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\n                    </div>\n                  </mat-form-field>\n\n\n               <mat-form-field>\n                  <mat-label>Victim Currently Under Supervision:</mat-label>\n                    <mat-select  formControlName=\"underSupervisionFlag\" name=\"supervision\" [(ngModel)]=\"editVictim.underSupervisionFlag\" >\n                      <mat-option *ngFor=\"let item of flagOption\" [value]=\"item.flagOptionYesNoUnknownId\" >\n                        {{item.name}}</mat-option>\n                    </mat-select>\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors\n                    && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\n                    <mat-error>under supervision field is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n\n               <mat-form-field>\n                  <mat-label>Relationship to Offender:</mat-label>\n                    <mat-select formControlName=\"victimOffenderRelationshipTypeId\" [(ngModel)]=\"editVictim.victimOffenderRelationshipTypeId\"  >\n                      <mat-option *ngFor=\"let item of relationshipTypes\" [value]=\"item.relationshipTypeId\">{{item.name}}</mat-option>\n                    </mat-select>\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors\n                    && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\n                    <mat-error>relationship is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n\n                <mat-form-field>\n                  <mat-label>Victim Last Name:</mat-label>\n                  <input matInput formControlName=\"lastName\"  [(ngModel)]=\"editVictim.lastName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors\n                  && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\n                  <mat-error>victim last name is <strong>required</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim First Name: </mat-label>\n                  <input matInput  formControlName=\"firstName\" [(ngModel)]=\"editVictim.firstName\"  >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors\n                  && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\n                  <mat-error>victim first name is <strong>required</strong></mat-error>\n                 </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Middle Name:</mat-label>\n                    <input matInput  formControlName=\"middleName\" [(ngModel)]=\"editVictim.middleName\">\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Prefix:</mat-label>\n                    <mat-select  formControlName=\"prefixId\" [(ngModel)]=\"editVictim.prefixId\">\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Suffix:</mat-label>\n                    <mat-select  formControlName=\"suffixId\"  [(ngModel)]=\"editVictim.suffixId\">\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Sex:</mat-label>\n                  <mat-select  formControlName=\"genderCode\" [(ngModel)]=\"editVictim.genderCode\">\n                    <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\n                  </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Date of Birth:</mat-label>\n                   <input matInput\n                   [matDatepicker]=\"victimBirthRef\"\n                   formControlName=\"birthDate\"\n                  [(ngModel)]=\"editVictim.birthDate\"\n                  (click)=\"victimBirthRef.open()\"\n                  (dateChange)=\"handleDOBChange($event)\"\n                    >\n                  <mat-datepicker-toggle [for]=\"victimBirthRef\" matSuffix></mat-datepicker-toggle>\n                  <mat-datepicker #victimBirthRef></mat-datepicker>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Victim Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.homePhone\"\n                    [phoneControl]=\"homePhoneControl\"\n                    [formControl]=\"homePhoneControl\"\n                    maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('homePhone').errors\n                  && (victimForm.get('homePhone').dirty || victimForm.get('homePhone').touched)\">\n                  <mat-error><strong>Home phone number format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Victim Cell Phone:</mat-label>\n                  <input\n                  id=\"tel1\"\n                  matInput\n                  phoneMask\n                  [preValue]=\"editVictim.cellPhone\"\n                  [phoneControl]=\"cellPhoneControl\"\n                  [formControl]=\"cellPhoneControl\"\n                  maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('cellPhone').errors\n                  && (victimForm.get('cellPhone').dirty || victimForm.get('cellPhone').touched)\">\n                   <mat-error><strong>Cell phone number format is not correct.</strong></mat-error>\n              </div>\n                </mat-form-field>\n\n\n                <mat-form-field >\n                  <mat-label>Victim Work Phone:</mat-label>\n                  <input\n                  id=\"tel2\"\n                  matInput\n                  phoneMask\n                  [preValue]=\"editVictim.workPhone\"\n                  [phoneControl]=\"workPhoneControl\"\n                  [formControl]=\"workPhoneControl\"\n                  maxlength=\"14\"/>\n\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('workPhone').errors\n                  && (victimForm.get('workPhone').dirty || victimForm.get('workPhone').touched)\">\n                  <mat-error><strong>Work phone number format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Victim Email:</mat-label>\n                   <input matInput  formControlName=\"email\" [(ngModel)]=\"editVictim.email\" >\n                   <div class=\"help-block\" *ngIf=\"victimForm.get('email').errors\n                  && (victimForm.get('email').dirty || victimForm.get('email').touched)\">\n                  <mat-error><strong>victim email format is not correct.</strong></mat-error>\n              </div>\n                </mat-form-field>\n\n                <div></div>\n                <app-smart-address\n                [modifiedBy]=\"staffId\"\n                [id]=\"addressId\"\n                [outline]=\"true\"\n                [showPsa]=\"true\"\n                [addressValidators]=\"addressValidators\"\n                [readonly]=\"false\"\n                (addressIdChange)=\"onAddressChange($event)\"\n                #addressComponent >\n\n                </app-smart-address>\n\n\n                  <!-- Docket:\n                  <div>\n                    <div  *ngFor=\"let docket of docketlist; let i=index\">\n                      <mat-checkbox >{{docket.docketNumber}}</mat-checkbox>\n                    </div>\n                  </div> -->\n                  <div>\n                  <mat-checkbox  color=\"primary\" formControlName=\"liveWithOffenderFlag\" name=\"liveWithOffenderFlag\" [(ngModel)]=\"editVictim.liveWithOffenderFlag\"   (change)=\"showAddress($event)\"  >victim live with offender</mat-checkbox>\n                  <br>\n                  <mat-checkbox  color=\"primary\" formControlName=\"allowCsosaContactFlag\" name=\"allowCsosaContactFlag\" [(ngModel)]=\"editVictim.allowCsosaContactFlag\">victim wants to be contacted by CSOSA</mat-checkbox>\n                  </div>\n\n                </div>\n\n                <mat-card>\n                      <mat-form-field>\n                        <mat-label> Children in Common</mat-label>\n                        <br>\n                        <mat-radio-group formControlName=\"commonChildrenFlag\" [(ngModel)]=\"editVictim.commonChildrenFlag\"  (change)=\"radioCicChange($event)\">\n                            <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                            <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                          </mat-radio-group>\n                          <input matInput placeholder=\"\" style=\"display: none\">\n                        </mat-form-field>\n\n                       <div  *ngIf=\"commonChildrenDivFlag\">\n\n                          <mat-form-field >\n                            <mat-label>\n                              Children number\n                             </mat-label>\n                              <input matInput  formControlName=\"commonChildrenNumber\" [(ngModel)]=\"editVictim.commonChildrenNumber\" >\n                            </mat-form-field>\n\n                  </div>\n\n                      <mat-form-field>\n                        <mat-label>CPO: </mat-label>\n                        <br>\n                          <mat-radio-group formControlName=\"cpoExpirationFlag\"  [(ngModel)]=\"editVictim.cpoExpirationFlag\" (change)=\"radioCpoChange($event)\">\n                              <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                              <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                            </mat-radio-group>\n                            <input matInput placeholder=\"\" style=\"display: none\">\n                          </mat-form-field>\n\n                      <div *ngIf=\"cpoExpirationDivFlag\">\n                          <mat-form-field>\n                            <mat-label>Expiration Date: </mat-label>\n                               <input matInput\n                               [matDatepicker]=\"cpoDateRef\"\n                               formControlName=\"cpoExpirationDate\"\n                              (click)=\"cpoDateRef.open()\"\n                              [(ngModel)]=\"editVictim.cpoExpirationDate\"  >\n                              <mat-datepicker-toggle [for]=\"cpoDateRef\" matSuffix></mat-datepicker-toggle>\n                              <mat-datepicker #cpoDateRef></mat-datepicker>\n                            </mat-form-field>\n\n                      </div>\n\n                    <br>\n                    <br>\n\n                          <mat-form-field>\n                            <mat-label>Victim has a Support System in Place? </mat-label>\n                             <br>\n                            <mat-radio-group formControlName=\"supportInPlaceFlag\" [(ngModel)]=\"editVictim.supportInPlaceFlag\"  (change)=\"radioSupportChange($event)\">\n                                <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                              </mat-radio-group>\n                              <input matInput placeholder=\"\" style=\"display: none\">\n                            </mat-form-field>\n\n                        <div *ngIf=\"supportInPlaceDivFlag\">\n                            <mat-form-field>\n                              <mat-label>Support type? </mat-label>\n                                <mat-select #supportSel formControlName=\"victimSupports\" [(ngModel)]=\"editVictim.victimSupports\" multiple>\n                                  <div (mouseleave)=\"supportSel.close()\">\n                                    <mat-option color=\"primary\" *ngFor=\"let item of victimSupportTypes\" [value]=\"item.victimSupportTypeId\">\n                                      {{item.name}}\n                                    </mat-option>\n                                 </div>\n                                </mat-select>\n                                <input matInput placeholder=\"\" style=\"display: none\">\n                              </mat-form-field>\n\n                        </div>\n\n                      <br>\n                      <br>\n\n                            <mat-form-field>\n                              <mat-label>Weapons Involved?</mat-label>\n                              <br>\n                              <mat-radio-group formControlName=\"weaponInvolvedFlag\" (change)=\"radioWeaponChange($event)\" [(ngModel)]=\"editVictim.weaponInvolvedFlag\" >\n                                  <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                  <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                </mat-radio-group>\n                                <input matInput placeholder=\"\" style=\"display: none\">\n                            </mat-form-field>\n\n\n                          <div *ngIf=\"weaponInvolvedDivFlag\">\n                              <mat-form-field>\n                                <mat-label>Weapon Type</mat-label>\n                                  <mat-select  #weaponSel formControlName=\"victimWeaponUses\" multiple [(ngModel)]=\"editVictim.victimWeaponUses\" (selectionChange)=\"checkOtherWeapon($event.value)\" >\n                                    <div (mouseleave)=\"weaponSel.close()\">\n                                      <mat-option color=\"primary\" *ngFor=\"let item of weaponTypes\" [value]=\"item.weaponTypeId\">\n                                        {{item.name}}\n                                      </mat-option>\n                                    </div>\n                                  </mat-select>\n                                  <input matInput placeholder=\"\" style=\"display: none\">\n                                </mat-form-field>\n                          </div>\n\n                          <div *ngIf=\"otherWeaponFlag\">\n                             <mat-form-field>\n                              <mat-label>Other Weapon:* </mat-label>\n                              <input matInput  formControlName=\"otherWeapon\" >\n                              </mat-form-field>\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors\n                              && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\n                              <mat-error><strong>Other weapon is required.</strong></mat-error>\n                              </div>\n                          </div>\n\n\n                        <br>\n                        <br>\n\n                              <mat-form-field>\n                                <mat-label>Was Offender under the influence of alcohol at the time of the offense?</mat-label>\n                                <br>\n                                <mat-radio-group formControlName=\"alcoholUseFlag\" [(ngModel)]=\"editVictim.alcoholUseFlag\" >\n                                    <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                    <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                  </mat-radio-group>\n                                  <input matInput placeholder=\"\" style=\"display: none\">\n                                </mat-form-field>\n\n                          <br>\n                          <br>\n\n                                <mat-form-field>\n                                  <mat-label>Was Offender under the influence of drugs at the time of the offense?</mat-label>\n                                  <br>\n                                  <mat-radio-group formControlName=\"drugUseFlag\" (change)=\"radioDrugChange($event)\" [(ngModel)]=\"editVictim.drugUseFlag\"  >\n                                      <mat-radio-button color=\"primary\" [value]=\"true\">Yes</mat-radio-button>&nbsp;\n                                      <mat-radio-button color=\"primary\" [value]=\"false\">No</mat-radio-button>\n                                    </mat-radio-group>\n                                    <input matInput placeholder=\"\" style=\"display: none\">\n                                  </mat-form-field>\n\n                              <div *ngIf=\"drugUseDivFlag\">\n                                  <mat-form-field>\n                                    <mat-label>Drug:</mat-label>\n                                      <mat-select  #drugSel formControlName=\"victimDrugUses\" multiple   (selectionChange)=\"checkOtherDrug($event.value)\" >\n                                        <div (mouseleave)=\"drugSel.close()\">\n                                            <mat-option color=\"primary\" *ngFor=\"let item of drugs\" [value]=\"item.drugTypeId\">\n                                            {{item.name}}\n                                          </mat-option>\n\n                                        </div>\n                                      </mat-select>\n                                      <input matInput placeholder=\"\" style=\"display: none\">\n                                    </mat-form-field>\n\n                              </div>\n\n                              <div *ngIf=\"otherDrugFlag\">\n                                <mat-form-field>\n                                 <mat-label>Other Drug:* </mat-label>\n                                 <input matInput  formControlName=\"otherDrug\" >\n                                 </mat-form-field>\n                                 <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors\n                                 && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\n                                 <mat-error><strong>Other drug is required.</strong></mat-error>\n                                 </div>\n                             </div>\n                            <br>\n                            <br>\n\n                            <div>\n                                <div>\n                                <mat-label>\n                                  Access Risk: 1 thru 10 (10 greatest risk): &nbsp;<b> {{editVictim.accessRisk}}</b>\n                                </mat-label>\n                                </div>\n                                <div>\n\n                                    <mat-slider\n                                    formControlName=\"accessRisk\"\n                                    thumbLabel=\"true\"\n                                    [displayWith]=\"formatLabel\"\n                                    min=\"1\"\n                                    max=\"10\"\n                                    [(ngModel)]=\"editVictim.accessRisk\"\n                                    ></mat-slider>\n\n                                </div>\n\n                            </div>\n\n                          </mat-card>\n\n\n              <br><br><br>\n            </mat-tab>\n\n           <mat-tab  *ngIf=\"guardianTabFlag\" label=\"Legal Guardian\">\n            <div class='container'>\n              <mat-form-field>\n                  <mat-label>Guardian Last Name:</mat-label>\n                  <input matInput formControlName=\"guardianLastName\" [(ngModel)]=\"editVictim.guardianLastName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors \">\n                    <mat-error>Guardian last name is <strong>required</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n               <mat-form-field>\n                <mat-label>Guardian First Name:</mat-label>\n                  <input matInput  formControlName=\"guardianFirstName\" [(ngModel)]=\"editVictim.guardianFirstName\" >\n                  <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors \">\n                    <mat-error>Guardian first name is <strong>required</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n\n              <mat-form-field>\n                <mat-label>Guardian Prefix:</mat-label>\n                  <mat-select  formControlName=\"guardianPrefixId\" [(ngModel)]=\"editVictim.guardianPrefixId\" >\n                    <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                  </mat-select>\n              </mat-form-field>\n\n              <mat-form-field>\n                <mat-label>Guardian Suffix:</mat-label>\n                  <mat-select  formControlName=\"guardianSuffixId\" [(ngModel)]=\"editVictim.guardianSuffixId\"  >\n                    <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                  </mat-select>\n                </mat-form-field>\n\n\n                <!-- <mat-form-field>\n                    <mat-select placeholder=\"Choose\" formControlName=\"guardianGender\" [(ngModel)]=\"editVictim.guardianGender\">\n                      <mat-option *ngFor=\"let item of genders\" [value]=\"item.genderCode\">{{item.name}}</mat-option>\n                    </mat-select>\n                  </mat-form-field> -->\n\n\n                <mat-form-field>\n                  <mat-label>Date of Birth:</mat-label>\n                     <input matInput\n                     [matDatepicker]=\"guardianDateRef\"\n                     formControlName=\"guardianBirthDate\"\n                     [(ngModel)]=\"editVictim.guardianBirthDate\"\n                     (click)=\"guardianDateRef.open()\"\n                       >\n                    <mat-datepicker-toggle [for]=\"guardianDateRef\" matSuffix></mat-datepicker-toggle>\n                    <mat-datepicker #guardianDateRef></mat-datepicker>\n                </mat-form-field>\n\n                <div></div>\n                  <mat-form-field >\n                  <mat-checkbox\n                  color = \"primary\"\n                  formControlName=\"guardianNoPhoneFlag\">\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\n                  <input matInput placeholder=\"\" style=\"display: none;\">\n                </mat-form-field>\n\n\n                <div></div>\n                <mat-card>\n                <mat-form-field >\n                  <mat-label>Guardian Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.guardianHomePhone\"\n                    [phoneControl]=\"guardianHomePhoneControl\"\n                    [formControl]=\"guardianHomePhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianHomePhone').errors\n                    && (victimForm.get('guardianHomePhone').dirty || victimForm.get('guardianHomePhone').touched)\">\n                    <mat-error><strong>Guardian home phone number format is not correct.</strong></mat-error>\n                  </div>\n\n\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Guardian Cell Phone:</mat-label>\n                   <input\n                   id=\"tel4\"\n                   matInput\n                   phoneMask\n                   [preValue]=\"editVictim.guardianCellPhone\"\n                   [phoneControl]=\"guardianCellPhoneControl\"\n                   [formControl]=\"guardianCellPhoneControl\"\n                   maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianCellPhone').errors\n                     && (victimForm.get('guardianCellPhone').dirty || victimForm.get('guardianCellPhone').touched)\">\n                    <mat-error><strong>Guardian Cell phone number format is not correct.</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n                <mat-form-field >\n                  <mat-label>Guardian Work Phone:</mat-label>\n\n                    <input\n                    id=\"tel5\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.guardianWorkPhone\"\n                    [phoneControl]=\"guardianWorkPhoneControl\"\n                    [formControl]=\"guardianWorkPhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianWorkPhone').errors\n                       && (victimForm.get('guardianWorkPhone').dirty || victimForm.get('guardianWorkPhone').touched)\">\n                       <mat-error><strong>Guardian work phone number format is not correct.</strong></mat-error>\n                    </div>\n\n\n                </mat-form-field>\n              </mat-card>\n\n              <div></div>\n\n                <mat-form-field>\n                  <mat-label>Guardian Email:</mat-label>\n                    <input matInput formControlName=\"guardianEmail\" [(ngModel)]=\"editVictim.guardianEmail\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('guardianEmail').errors\n                    && (victimForm.get('guardianEmail').dirty || victimForm.get('guardianEmail').touched)\">\n                   <mat-error><strong>Guardian email format is not correct.</strong></mat-error>\n                   </div>\n                </mat-form-field>\n\n                <div></div>\n\n                <div>\n                <app-smart-address\n\n                [showPsa]=\"true\"\n                [modifiedBy]=\"staffId\"\n                [id]=\"guardianAddressId\"\n                (addressIdChange)=\"onGuardianAddressChange($event)\"\n                [outline]=\"true\"\n                readonly=\"false\"\n                [rowHeight]=\"80\"\n                (isValid)=\"false\"\n                [addressValidators]=\"addressValidators\"\n                #guardianAddressComponent\n                >\n                </app-smart-address>\n                </div>\n              </div>\n\n              <br><br><br>\n            </mat-tab>\n\n            <!--advocate-->\n\n              <mat-tab  *ngIf=\"advocateTabFlag\" label=\"Advocate\" >\n                <div class='container'>\n\n                <mat-form-field>\n                  <mat-label>Advocate Last Name:</mat-label>\n                    <input matInput  formControlName=\"advocateLastName\" [(ngModel)]=\"editVictim.advocateLastName\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors \">\n                      <mat-error>Advocate last name is <strong>required</strong></mat-error>\n                    </div>\n                 </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate First Name:</mat-label>\n                    <input matInput  formControlName=\"advocateFirstName\" [(ngModel)]=\"editVictim.advocateFirstName\"  >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors \">\n                      <mat-error>Advocate first name is <strong>required</strong></mat-error>\n                    </div>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Prefix:</mat-label>\n                    <mat-select  formControlName=\"advocatePrefixId\"  [(ngModel)]=\"editVictim.advocatePrefixId\" >\n                      <mat-option *ngFor=\"let item of prefixes\" [value]=\"item.prefixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Suffix:</mat-label>\n                    <mat-select  formControlName=\"advocateSuffixId\" [(ngModel)]=\"editVictim.advocateSuffixId\"  >\n                      <mat-option *ngFor=\"let item of suffixes\" [value]=\"item.suffixId\">{{item.name}}</mat-option>\n                    </mat-select>\n                </mat-form-field>\n\n\n                <mat-form-field>\n                  <mat-checkbox\n                  color = \"primary\"\n                  formControlName=\"advocateNoPhoneFlag\"\n\n                  [(ngModel)]=\"editVictim.advocateNoPhoneFlag\" >\n                  No Phone (If there is no phone, the phone fields are no longer required)</mat-checkbox>\n                  <input matInput placeholder=\"\" style=\"display: none;\">\n                </mat-form-field>\n\n                <div></div>\n                <mat-card>\n                <mat-form-field >\n                  <mat-label>Advocate Home Phone:</mat-label>\n                    <input\n                    id=\"tel\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateHomePhone\"\n                    [phoneControl]=\"advocateHomePhoneControl\"\n                    [formControl]=\"advocateHomePhoneControl\"\n                    maxlength=\"14\"/>\n\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateHomePhone').errors\n                    && (victimForm.get('advocateHomePhone').dirty || victimForm.get('advocateHomePhone').touched)\">\n                    <mat-error><strong>Advocate home number format is not correct.</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Cell Phone:</mat-label>\n                    <input\n                    id=\"tel7\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateCellPhone\"\n                    [phoneControl]=\"advocateCellPhoneControl\"\n                    [formControl]=\"advocateCellPhoneControl\"\n                    maxlength=\"14\"/>\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateCellPhone').errors\n                    && (victimForm.get('advocateCellPhone').dirty || victimForm.get('advocateCellPhone').touched)\">\n                    <mat-error><strong>Advocate cell number format is not correct.</strong></mat-error>\n                  </div>\n\n\n                </mat-form-field>\n\n                <mat-form-field>\n                  <mat-label>Advocate Work Phone:</mat-label>\n                    <input\n                    id=\"tel8\"\n                    matInput\n                    phoneMask\n                    [preValue]=\"editVictim.advocateWorkPhone\"\n                    [phoneControl]=\"advocateWorkPhoneControl\"\n                    [formControl]=\"advocateWorkPhoneControl\"\n                    maxlength=\"14\"/>\n\n\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateWorkPhone').errors\n                    && (victimForm.get('advocateWorkPhone').dirty || victimForm.get('advocateWorkPhone').touched)\">\n                    <mat-error><strong>Advocate work number format is not correct.</strong></mat-error>\n                  </div>\n\n                </mat-form-field>\n                </mat-card>\n\n                <div></div>\n\n                <mat-form-field>\n                  <mat-label>Advocate Email:</mat-label>\n                    <input matInput formControlName=\"advocateEmail\"  [(ngModel)]=\"editVictim.advocateEmail\" >\n                    <div class=\"help-block\" *ngIf=\"victimForm.get('advocateEmail').errors\n                    && (victimForm.get('advocateEmail').dirty || victimForm.get('advocateEmail').touched)\">\n                    <mat-error><strong>Advocate email format is not correct.</strong></mat-error>\n                  </div>\n                </mat-form-field>\n\n                <div></div>\n\n\n              <div >\n              <app-smart-address\n              [showPsa]=\"true\"\n              [modifiedBy]=\"staffId\"\n              [id]=\"advocateAddressId\"\n              (addressIdChange)=\"onAdvocateAddressChange($event)\"\n              [outline]=\"true\"\n              readonly=\"false\"\n              [rowHeight]=\"80\"\n              (isValid)=\"false\"\n              [addressValidators]=\"addressValidators\"\n              #advocateAddressComponent >\n              </app-smart-address>\n              </div>\n              </div>\n              <br><br><br>\n            </mat-tab>\n\n\n             <mat-tab  label=\"Emergency Contact\">\n                <div class='container'>\n\n                        <mat-form-field>\n                          <mat-label>Emergency Contact Name:</mat-label>\n                            <input matInput  formControlName=\"emergencyContact\" [(ngModel)]=\"editVictim.emergencyContact\"  >\n                          </mat-form-field>\n\n                          <mat-form-field>\n                            <mat-label>Emergency Phone Number:</mat-label>\n\n                               <input\n                               id=\"tel\"\n                               matInput\n                               phoneMask\n                               [preValue]=\"editVictim.emergencyContactPhone\"\n                               [phoneControl]=\"emergencyContactPhoneControl\"\n                               [formControl]=\"emergencyContactPhoneControl\"\n                               maxlength=\"14\"/>\n\n                              <div class=\"help-block\" *ngIf=\"victimForm.get('emergencyContactPhone').errors\n                              && (victimForm.get('emergencyContactPhone').dirty || victimForm.get('emergencyContactPhone').touched)\">\n                              <mat-error><strong>Emergency contact number format is not correct.</strong></mat-error>\n                            </div>\n                            </mat-form-field>\n\n                </div>\n                <br><br><br>\n            </mat-tab>\n\n          </mat-tab-group>\n          <div class='outer'>\n            <div>\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>\n\n               <div class=\"help-block\" *ngIf=\"victimForm.get('minorFlag').errors\n                    && (victimForm.get('minorFlag').dirty || victimForm.get('minorFlag').touched)\">\n                    <mat-error>If victim a minor field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimAdvocateFlag').errors\n              && (victimForm.get('victimAdvocateFlag').dirty || victimForm.get('victimAdvocateFlag').touched)\">\n              <mat-error>If victim has advocate field is <strong>required</strong></mat-error>\n              </div>\n\n               <div class=\"help-block\" *ngIf=\"victimForm.get('underSupervisionFlag').errors\n              && (victimForm.get('underSupervisionFlag').dirty || victimForm.get('underSupervisionFlag').touched)\">\n              <mat-error>Under supervision field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('victimOffenderRelationshipTypeId').errors\n              && (victimForm.get('victimOffenderRelationshipTypeId').dirty || victimForm.get('victimOffenderRelationshipTypeId').touched)\">\n              <mat-error>Relationship is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('lastName').errors\n              && (victimForm.get('lastName').dirty || victimForm.get('lastName').touched)\">\n              <mat-error>Victim last name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('firstName').errors\n              && (victimForm.get('firstName').dirty || victimForm.get('firstName').touched)\">\n              <mat-error>victim first name is <strong>required</strong></mat-error>\n             </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianFirstName').errors\n              && (victimForm.get('guardianFirstName').dirty || victimForm.get('guardianFirstName').touched)\">\n                <mat-error>Guardian first name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('guardianLastName').errors\n             && (victimForm.get('guardianLastName').dirty || victimForm.get('guardianLastName').touched)\" >\n              <mat-error>Guardian last name is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('advocateLastName').errors\n                && (victimForm.get('advocateLastName').dirty || victimForm.get('advocateLastName').touched)\" >\n                  <mat-error>Advocate last name is <strong>required</strong></mat-error>\n                  </div>\n\n                <div class=\"help-block\" *ngIf=\"victimForm.get('advocateFirstName').errors\n                && (victimForm.get('advocateFirstName').dirty || victimForm.get('advocateFirstName').touched)\">\n                  <mat-error>Advocate first name is <strong>required</strong></mat-error>\n                </div>\n\n\n                <div class=\"help-block\" *ngIf=\"victimForm.get('otherWeapon').errors\n                    && (victimForm.get('otherWeapon').dirty || victimForm.get('otherWeapon').touched)\">\n                    <mat-error>Other weapon field is <strong>required</strong></mat-error>\n              </div>\n\n              <div class=\"help-block\" *ngIf=\"victimForm.get('otherDrug').errors\n              && (victimForm.get('otherDrug').dirty || victimForm.get('otherDrug').touched)\">\n              <mat-error>Other drug field is <strong>required</strong></mat-error>\n             </div>\n\n\n            </div>\n\n                  <div class=\"inner\">\n                     <button  mat-raised-button color=\"primary\" (click)=\"saveVictim()\" [disabled]=\"!victimForm.valid\"  >Save </button>\n                  </div>\n                  &nbsp;&nbsp;\n                  <div *ngIf=\"showDelete\" class=\"inner\">\n                  <button  mat-raised-button color=\"primary\" (click)=\"deleteVictim()\">Delete </button>\n                 </div>\n                  &nbsp;&nbsp;\n                  <div class=\"inner\">\n                  <button  mat-raised-button color=\"primary\" (click)=\"cancel()\">Clear </button>\n                </div>\n                  &nbsp;&nbsp;\n                  <button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n\n            </div>\n\n        </div>\n        <br>\n        <br>\n\n        <div align=\"right\">\n          <button mat-raised-button color=\"primary\"  (click)=\"addContact()\"  >Add victim contact</button>\n        </div>\n\n        <div>\n\n          <mat-table #table [dataSource]=\"contactDataSource\" class=\"example-table\">\n            <ng-container matColumnDef=\"contactDate\">\n                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Date</mat-header-cell>\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactDate | date}} </mat-cell>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"victimContactMethod\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Method</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimContactMethod}} </mat-cell>\n            </ng-container>\n\n            <ng-container matColumnDef=\"nextContactDate\">\n              <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Next Contact Date</mat-header-cell>\n              <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.nextContactDate | date}} </mat-cell>\n            </ng-container>\n\n\n            <ng-container matColumnDef=\"staff\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact By</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.staff}} </mat-cell>\n            </ng-container>\n            <ng-container matColumnDef=\"comment\">\n                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                    </ng-container>\n\n            <ng-container matColumnDef=\"contactId\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n\n                </mat-cell>\n            </ng-container>\n\n            <mat-header-row *matHeaderRowDef=\"['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId']\" class=\"example-header-row\"></mat-header-row>\n            <mat-row *matRowDef=\"let row; columns:['contactDate', 'victimContactMethod','nextContactDate', 'staff', 'comment', 'contactId'];\" class=\"example-row\"></mat-row>\n            </mat-table>\n\n\n        </div>\n\n  </mat-card-content>\n</mat-card>\n", styles: ["mat-form-field{width:100%}.container{margin:16px;display:grid;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:grid;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}\n"] }]
+        }], ctorParameters: function () { return [{ type: i8$1.Location }, { type: i1$2.UntypedFormBuilder }, { type: i1$1.MatDialog }, { type: i5.ActivatedRoute }, { type: i5.Router }, { type: i4.MatSnackBar }, { type: CommonDialogService }, { type: NgcSmartVictimService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { victimDetail: [{
+                type: Input
+            }], staffId: [{
+                type: Input
+            }], offenderId: [{
+                type: Input
+            }], isIntake: [{
+                type: Input
+            }], onSave: [{
+                type: Output
+            }], onCancel: [{
+                type: Output
+            }], addressComponent: [{
+                type: ViewChild,
+                args: ["addressComponent"]
+            }] } });
+
+class VictimListFilter {
+}
+
+class VictimSearchFormComponent {
+    constructor() {
+        this.onSearch = new EventEmitter();
+        this.change = new EventEmitter();
+        this.filter = new VictimListFilter();
+    }
+    ngOnInit() {
+    }
+    ngAfterViewInit() {
+        //   var element = <HTMLInputElement> document.getElementById("victimSearchButton");
+        //   element.disabled = true;
+        //   setTimeout(function() {
+        //     element.disabled = false;
+        // }, 10000);
+    }
+    onChange() {
+        console.log('this.filter in serach form.');
+        console.log(this.filter);
+        this.onSearch.emit(this.filter);
+    }
+}
+/** @nocollapse */ VictimSearchFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSearchFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ VictimSearchFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: VictimSearchFormComponent, selector: "app-victim-search-form", outputs: { onSearch: "onSearch" }, ngImport: i0, template: "<form name=\"victimSearchFrom\"  #From=\"ngForm\">\n<mat-expansion-panel [expanded]=\"true\">\n        <mat-expansion-panel-header>\n            <mat-panel-title>\n                Search for Victims\n            </mat-panel-title>\n        </mat-expansion-panel-header>\n        <div class=\"victimSearch\">\n            <mat-form-field>\n                <input matInput placeholder=\"Victim Last Name\"  [(ngModel)]=\"filter.lastName\" name=\"lastName\" id=\"lastName\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Victim First Name\"  [(ngModel)]=\"filter.firstName\" name=\"firstName\" id=\"firstName\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Victim Date of Birth\" type=\"date\"    [(ngModel)]=\"filter.birthDate\" name=\"birthDate\" id=\"birthDate\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Offender PDID\"  [(ngModel)]=\"filter.pdid\" name=\"pdid\" id=\"pdid\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Offender CSOSA #\"[(ngModel)]=\"filter.offenderId\" name=\"offenderId\" id=\"offenderId\">\n            </mat-form-field>\n           \n           \n            <section>\n                <button  id=\"victimSearchButton\" mat-raised-button color=\"primary\" (click)=\"onChange()\">Search</button>\n                <span style=\"padding-right: 5px;\"></span>\n                <button   mat-raised-button color=\"primary\"  type=\"reset\" value=\"Reset\">Clear Changes</button>\n            </section>\n        </div>\n    </mat-expansion-panel>\n</form>\n\n\n", styles: ["div.services{max-width:500px;margin:auto;border:3px solid #73AD21}.rTable{display:block;width:100%}.rTableHeading,.rTableBody,.rTableFoot,.rTableRow{clear:both}.rTableHead,.rTableFoot{background-color:#ddd;font-weight:700}.rTableCell,.rTableHead{border:0px;float:left;padding:1px;width:28%}.rTable:after{visibility:hidden;display:block;font-size:0;content:\" \";clear:both;height:0}.victimSearch{display:grid;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-title,.example-headers-align .mat-expansion-panel-header-description{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-lastName,.mat-column-firstName,.mat-column-relationship,.mat-column-homePhone,.mat-column-offenderName{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;-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;-webkit-hyphens:auto;hyphens:auto}\n"], dependencies: [{ kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i3.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i15.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSearchFormComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-victim-search-form', encapsulation: ViewEncapsulation.None, template: "<form name=\"victimSearchFrom\"  #From=\"ngForm\">\n<mat-expansion-panel [expanded]=\"true\">\n        <mat-expansion-panel-header>\n            <mat-panel-title>\n                Search for Victims\n            </mat-panel-title>\n        </mat-expansion-panel-header>\n        <div class=\"victimSearch\">\n            <mat-form-field>\n                <input matInput placeholder=\"Victim Last Name\"  [(ngModel)]=\"filter.lastName\" name=\"lastName\" id=\"lastName\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Victim First Name\"  [(ngModel)]=\"filter.firstName\" name=\"firstName\" id=\"firstName\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Victim Date of Birth\" type=\"date\"    [(ngModel)]=\"filter.birthDate\" name=\"birthDate\" id=\"birthDate\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Offender PDID\"  [(ngModel)]=\"filter.pdid\" name=\"pdid\" id=\"pdid\">\n            </mat-form-field>\n            <mat-form-field>\n                <input matInput placeholder=\"Offender CSOSA #\"[(ngModel)]=\"filter.offenderId\" name=\"offenderId\" id=\"offenderId\">\n            </mat-form-field>\n           \n           \n            <section>\n                <button  id=\"victimSearchButton\" mat-raised-button color=\"primary\" (click)=\"onChange()\">Search</button>\n                <span style=\"padding-right: 5px;\"></span>\n                <button   mat-raised-button color=\"primary\"  type=\"reset\" value=\"Reset\">Clear Changes</button>\n            </section>\n        </div>\n    </mat-expansion-panel>\n</form>\n\n\n", styles: ["div.services{max-width:500px;margin:auto;border:3px solid #73AD21}.rTable{display:block;width:100%}.rTableHeading,.rTableBody,.rTableFoot,.rTableRow{clear:both}.rTableHead,.rTableFoot{background-color:#ddd;font-weight:700}.rTableCell,.rTableHead{border:0px;float:left;padding:1px;width:28%}.rTable:after{visibility:hidden;display:block;font-size:0;content:\" \";clear:both;height:0}.victimSearch{display:grid;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-title,.example-headers-align .mat-expansion-panel-header-description{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-lastName,.mat-column-firstName,.mat-column-relationship,.mat-column-homePhone,.mat-column-offenderName{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;-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;-webkit-hyphens:auto;hyphens:auto}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { onSearch: [{
+                type: Output
+            }] } });
+
+class NgcSmartVictimComponent {
+    constructor(dialog, victimService, router, route, snackBar, intakeService, smartWarrantUrl, document) {
+        this.dialog = dialog;
+        this.victimService = victimService;
+        this.router = router;
+        this.route = route;
+        this.snackBar = snackBar;
+        this.intakeService = intakeService;
+        this.smartWarrantUrl = smartWarrantUrl;
+        this.document = document;
+        this.appModuleId = '';
+        this.activatedRoute = null;
+        this.victims = [];
+        this.victimDetail = {};
+        this.showDetail = false;
+        this.victimListFilter = new VictimListFilter$1();
+        this.victimListDataSource = new MatTableDataSource();
+        this.doSpin = false;
+        this.showListFlag = false;
+        this.msg = "";
+        this.isIntake = false;
+    }
+    // private onChange(filter: VictimListFilter) {
+    //   console.log('filter in onchange');
+    //   console.log(filter);
+    //   this.getVictimList(filter);
+    // }
+    applyFilter(filterValue) {
+        this.victimListDataSource.filter = filterValue.trim().toLowerCase();
+    }
+    addRecord() {
+        this.showDetail = true;
+        this.showAdd = false;
+        this.victimDetail = null;
+        this.showListFlag = false;
+    }
+    editVictimDetail(record) {
+        console.log("victim edit record");
+        console.log(record);
+        console.log(record.victimId);
+        this.victimDetail = record;
+        this.showDetail = true;
+        this.showAdd = false;
+        this.showListFlag = false;
+    }
+    save(detail) {
+        this.showDetail = false;
+        this.showAdd = true;
+        this.showListFlag = true;
+    }
+    cancel() {
+        this.showDetail = false;
+        this.victimDetail = {};
+    }
+    ngAfterViewInit() {
+        this.victimListDataSource.paginator = this.paginator;
+        this.victimListDataSource.sort = this.sort;
+    }
+    ngOnChanges() {
+        this.updateAccessControlConfig = {
+            accessType: AccessType.UPDATE,
+            appModuleId: this.appModuleId,
+            roleId: null,
+            route: this.activatedRoute.snapshot,
+        };
+        this.createAccessControlConfig = {
+            accessType: AccessType.CREATE,
+            appModuleId: this.appModuleId,
+            roleId: null,
+            route: this.activatedRoute.snapshot,
+        };
+        this.deleteAccessControlConfig = {
+            accessType: AccessType.DELETE,
+            appModuleId: this.appModuleId,
+            roleId: null,
+            route: this.activatedRoute.snapshot,
+        };
+    }
+    ngOnInit() {
+        const queryParams = this.route.snapshot.queryParams;
+        if (queryParams['routeTo']) {
+            this.router.navigate([queryParams['routeTo']]);
+        }
+        var data = this.route.snapshot.data;
+        var myPath = this.router.url.slice(-10);
+        console.log("offender id at smart-victim");
+        console.log(this.offenderId);
+        console.log("staff id at smart-victim");
+        console.log(this.staffId);
+        console.log("insakeFlag at smart-victim");
+        console.log(this.intakeFlag);
+        console.log("smart-victim ngOnInit");
+        console.log(this.intakeFlag);
+        console.log(myPath);
+        if (this.intakeFlag == "true") {
+            this.isIntake = true;
+        }
+        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") {
+            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("myPath");
+        console.log(myPath);
+        if (this.showSearchForm == false ||
+            myPath == "victimList" ||
+            myPath == "victimHome") {
+            var myOffenderId;
+            if (this.offenderId) {
+                myOffenderId = this.offenderId;
+            }
+            else {
+                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";
+                myOffenderId = data.selectedOffender.offenderId;
+            }
+            const victimListFilter = {
+                offenderId: myOffenderId,
+                lastName: null,
+                firstName: null,
+                pdid: null,
+                birthDate: null,
+            };
+            console.log("victimListFilter in smar-victim componenet");
+            console.log(victimListFilter);
+            this.victimService
+                .getVictimListByFilter(victimListFilter)
+                .subscribe((data) => {
+                this.victims = data;
+                this.victimListDataSource.data = data;
+                console.log("victim data at line 245");
+                console.log(this.victims);
+                console.log("showListFlag");
+                console.log(this.showListFlag);
+                this.showListFlag = true;
+                if (data.length == 0) {
+                    this.msg = "No Record Found!";
+                }
+            });
+        }
+        else {
+            console.log("find filter");
+            console.log(this.victimListFilter);
+            if (this.showListFlag === true) {
+                if (this.victimListFilter != null) {
+                    this.victimService
+                        .getVictimListByFilter(this.victimListFilter)
+                        .subscribe((data) => {
+                        this.victims = data;
+                        this.victimListDataSource.data = data;
+                        console.log("victim data at line 279");
+                        console.log(data);
+                    });
+                }
+            }
+        }
+    }
+    // phone number format on the victim list
+    formatPhoneNumber(phoneNumberString) {
+        if (!phoneNumberString)
+            return "";
+        var cleaned = ("" + phoneNumberString).replace(/\D/g, "");
+        var match = cleaned.match(/^(\d{3})(\d{3})(\d{4})$/);
+        if (match) {
+            return "(" + match[1] + ") " + match[2] + "-" + match[3];
+        }
+        return "";
+    }
+    saveIntake() {
+        if (!this.isIntake) {
+            return;
+        }
+        const intakeStep = {
+            intakeStepId: IntakeStep.VictimInformation,
+            offenderId: this.offenderId,
+            modifiedBy: this.staffId,
+        };
+        this.intakeService
+            .updateIntakeSteps(this.offenderId, intakeStep)
+            .subscribe((res) => {
+            console.log("save intake step.");
+            this.snackBar.open("Status Saved.", "", {
+                duration: 3000,
+            });
+            //this.router.navigate(['/warrant '], { queryParams: { intake: 1 } });
+            this.document.location.href =
+                `${this.smartWarrantUrl}/?offenderId=${this.offenderId}&intakeFlag=${this.isIntake}&routeTo=warrant`;
+        });
+    }
+    goToCaseNote(victimId) {
+        this.router.navigate(["casenote", victimId, this.offenderId]);
+    }
+    goToSaftyPlan(victimId) {
+        this.router.navigate(["saftyPlan", victimId]);
+    }
+    getVictimList(filter) {
+        this.victimListFilter = filter;
+        console.log("this.victimListFilter inside getVictimList");
+        console.log(this.victimListFilter);
+        this.doSpin = true;
+        this.victimService.getVictimListByFilter(filter).subscribe((data) => {
+            this.doSpin = !this.doSpin;
+            if (data.length > 0) {
+                this.showListFlag = true;
+                this.victimListDataSource.data = data;
+            }
+            else {
+                this.msg = "No record found!";
+            }
+        }, (err) => {
+            this.doSpin = !this.doSpin;
+        });
+    }
+}
+/** @nocollapse */ NgcSmartVictimComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimComponent, deps: [{ token: i1$1.MatDialog }, { token: NgcSmartVictimService }, { token: i5.Router }, { token: i5.ActivatedRoute }, { token: i4.MatSnackBar }, { token: IntakeServicesComponent }, { token: SMART_WARRANT_URL }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ NgcSmartVictimComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NgcSmartVictimComponent, selector: "csmart-victim", inputs: { offenderId: "offenderId", staffId: "staffId", staffRole: "staffRole", showCaseNote: "showCaseNote", showSafetyPlan: "showSafetyPlan", showAdd: "showAdd", showEdit: "showEdit", showRelationshipColumn: "showRelationshipColumn", showOffenderNameColumn: "showOffenderNameColumn", showOffenderPhoneColumn: "showOffenderPhoneColumn", showSearchForm: "showSearchForm", accessByModule: "accessByModule", intakeFlag: "intakeFlag", appModuleId: "appModuleId", activatedRoute: "activatedRoute" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"showSearchForm\">\n    <app-victim-search-form\n    (onSearch)=\"getVictimList($event)\">\n    </app-victim-search-form>\n</div>\n\n<div *ngIf=\"showDetail\">\n  <csmart-victim-detail [victimDetail]=\"victimDetail\" \n                        [staffId]=\"staffId\"\n                        [offenderId] =\"offenderId\"\n                        [isIntake]=\"isIntake\"\n                        (onSave)=\"save($event)\" \n                        (onCancel)=\"cancel()\" >\n</csmart-victim-detail>\n</div>\n<div class=\"main-container\">\n    \n    <div class=\"add-action\" *ngIf=\"showAdd\">\n        <button mat-raised-button color=\"primary\" \n           accessControl\n          [accessControlConfig]=\"createAccessControlConfig\"  \n          (click)=\"addRecord()\">\n          <mat-icon>add</mat-icon>\n          Add Victim\n        </button>\n        &nbsp;&nbsp;\n\n    <div *ngIf=\"isIntake\">\n        <button \n        mat-raised-button \n        color=\"primary\" \n        accessControl\n        [accessControlConfig]=\"updateAccessControlConfig\"          \n        (click)=\"saveIntake()\">\n        Continue\n        </button> \n    </div>\n\n    </div>\n   <div *ngIf=\"showListFlag\">\n    <mat-card id=\"divVictim\" >\n          <mat-card-content >\n            <mat-table #table [dataSource]=\"victimListDataSource\" >\n\n                <ng-container matColumnDef=\"lastName\">\n                    <mat-header-cell *matHeaderCellDef>Victim Last Name</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" > {{row.lastName}}  </mat-cell>\n                </ng-container>\n\n\n                <ng-container matColumnDef=\"firstName\">\n                        <mat-header-cell *matHeaderCellDef >Victim First Name</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > {{row.firstName}} </mat-cell>\n                </ng-container>\n               \n                <div  *ngIf=\"showRelationshipColumn\">\n                    <ng-container matColumnDef=\"relationship\">\n                        <mat-header-cell *matHeaderCellDef >Relationship to Offender</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > {{row.relationship}} </mat-cell>\n                    </ng-container>\n                </div>\n\n                <div  *ngIf=\"showOffenderPhoneColumn\">\n                    <ng-container matColumnDef=\"homePhone\">\n                        <mat-header-cell *matHeaderCellDef >Phone Number</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > \n                           Home phone: {{formatPhoneNumber(row.homePhone)}}<br>  \n                           Cell Phone: {{formatPhoneNumber(row.cellPhone)}}<br>\n                           Work Phone: {{formatPhoneNumber(row.workPhone)}} \n\n                        </mat-cell>\n                    </ng-container>\n                </div>\n                \n                <div  *ngIf=\"showOffenderNameColumn\">\n                    <ng-container matColumnDef=\"offenderName\">\n                            <mat-header-cell *matHeaderCellDef>Offender Name</mat-header-cell>\n                            <mat-cell *matCellDef=\"let row\" > {{row.offenderName}} </mat-cell>\n                    </ng-container>\n                </div>\n               \n               <ng-container matColumnDef=\"victimId\">\n                  <mat-header-cell *matHeaderCellDef ></mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" >\n                        \n                        <!-- <div  *ngIf=\"accessByModule\">\n                            <mat-checkbox></mat-checkbox>\n                        </div> -->\n                        \n                        <div  *ngIf=\"showEdit\">\n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"View/Edit Victim\"\n                                accessControl\n                                [accessControlConfig]=\"updateAccessControlConfig\"  \n                                (click)=\"editVictimDetail(row)\">\n                                <i class=\"material-icons\">mode_edit</i>\n                            </button>\n                        </div>\n\n                        \n\n                        &nbsp;&nbsp; \n\n                        <div  *ngIf=\"showCaseNote\">\n                            <button type=\"button\" matTooltip=\"CaseNote\"  mat-raised-button color=\"primary\" \n                            accessControl\n                            [accessControlConfig]=\"updateAccessControlConfig\"  \n                            (click)=\"goToCaseNote(row.victimId)\">                        \n                                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Case Note\n                            </button> \n                        </div>\n                         &nbsp;&nbsp;\n                       \n                         <div  *ngIf=\"showSafetyPlan\">\n                        <button type=\"button\"  matTooltip=\"safety plan\" mat-raised-button color=\"primary\"\n                         accessControl\n                         [accessControlConfig]=\"updateAccessControlConfig\"  \n                         (click)=\"goToSaftyPlan(row.victimId)\">                        \n                                <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Safety Plan\n                        </button>\n                        </div>\n                        &nbsp;&nbsp;\n   \n                    </mat-cell>\n                </ng-container>\n\n                <mat-header-row *matHeaderRowDef=\"displayedColumns\" class=\"example-header-row\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\" class=\"example-row\"></mat-row>\n                </mat-table>\n\n              <mat-paginator #paginator [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator> \n          </mat-card-content>\n    </mat-card>\n    </div>\n\n    <div>\n        <b>{{msg}}</b>\n    </div>\n</div>", styles: ["div.services{max-width:500px;margin:auto;border:3px solid #73AD21}.rTable{display:block;width:100%}.rTableHeading,.rTableBody,.rTableFoot,.rTableRow{clear:both}.rTableHead,.rTableFoot{background-color:#ddd;font-weight:700}.rTableCell,.rTableHead{border:0px;float:left;padding:1px;width:28%}.rTable:after{visibility:hidden;display:block;font-size:0;content:\" \";clear:both;height:0}.victimSearch{display:grid;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-title,.example-headers-align .mat-expansion-panel-header-description{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-lastName,.mat-column-firstName,.mat-column-relationship,.mat-column-homePhone,.mat-column-offenderName{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;-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;-webkit-hyphens:auto;hyphens:auto}\n"], dependencies: [{ kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i9$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i11$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i6.SmartAccessControlDirective, selector: "[accessControl]", inputs: ["accessControlConfig"] }, { kind: "component", type: SmartVictimDetailComponent, selector: "csmart-victim-detail", inputs: ["victimDetail", "staffId", "offenderId", "isIntake"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: VictimSearchFormComponent, selector: "app-victim-search-form", outputs: ["onSearch"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "csmart-victim", template: "<div *ngIf=\"showSearchForm\">\n    <app-victim-search-form\n    (onSearch)=\"getVictimList($event)\">\n    </app-victim-search-form>\n</div>\n\n<div *ngIf=\"showDetail\">\n  <csmart-victim-detail [victimDetail]=\"victimDetail\" \n                        [staffId]=\"staffId\"\n                        [offenderId] =\"offenderId\"\n                        [isIntake]=\"isIntake\"\n                        (onSave)=\"save($event)\" \n                        (onCancel)=\"cancel()\" >\n</csmart-victim-detail>\n</div>\n<div class=\"main-container\">\n    \n    <div class=\"add-action\" *ngIf=\"showAdd\">\n        <button mat-raised-button color=\"primary\" \n           accessControl\n          [accessControlConfig]=\"createAccessControlConfig\"  \n          (click)=\"addRecord()\">\n          <mat-icon>add</mat-icon>\n          Add Victim\n        </button>\n        &nbsp;&nbsp;\n\n    <div *ngIf=\"isIntake\">\n        <button \n        mat-raised-button \n        color=\"primary\" \n        accessControl\n        [accessControlConfig]=\"updateAccessControlConfig\"          \n        (click)=\"saveIntake()\">\n        Continue\n        </button> \n    </div>\n\n    </div>\n   <div *ngIf=\"showListFlag\">\n    <mat-card id=\"divVictim\" >\n          <mat-card-content >\n            <mat-table #table [dataSource]=\"victimListDataSource\" >\n\n                <ng-container matColumnDef=\"lastName\">\n                    <mat-header-cell *matHeaderCellDef>Victim Last Name</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" > {{row.lastName}}  </mat-cell>\n                </ng-container>\n\n\n                <ng-container matColumnDef=\"firstName\">\n                        <mat-header-cell *matHeaderCellDef >Victim First Name</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > {{row.firstName}} </mat-cell>\n                </ng-container>\n               \n                <div  *ngIf=\"showRelationshipColumn\">\n                    <ng-container matColumnDef=\"relationship\">\n                        <mat-header-cell *matHeaderCellDef >Relationship to Offender</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > {{row.relationship}} </mat-cell>\n                    </ng-container>\n                </div>\n\n                <div  *ngIf=\"showOffenderPhoneColumn\">\n                    <ng-container matColumnDef=\"homePhone\">\n                        <mat-header-cell *matHeaderCellDef >Phone Number</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" > \n                           Home phone: {{formatPhoneNumber(row.homePhone)}}<br>  \n                           Cell Phone: {{formatPhoneNumber(row.cellPhone)}}<br>\n                           Work Phone: {{formatPhoneNumber(row.workPhone)}} \n\n                        </mat-cell>\n                    </ng-container>\n                </div>\n                \n                <div  *ngIf=\"showOffenderNameColumn\">\n                    <ng-container matColumnDef=\"offenderName\">\n                            <mat-header-cell *matHeaderCellDef>Offender Name</mat-header-cell>\n                            <mat-cell *matCellDef=\"let row\" > {{row.offenderName}} </mat-cell>\n                    </ng-container>\n                </div>\n               \n               <ng-container matColumnDef=\"victimId\">\n                  <mat-header-cell *matHeaderCellDef ></mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" >\n                        \n                        <!-- <div  *ngIf=\"accessByModule\">\n                            <mat-checkbox></mat-checkbox>\n                        </div> -->\n                        \n                        <div  *ngIf=\"showEdit\">\n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"View/Edit Victim\"\n                                accessControl\n                                [accessControlConfig]=\"updateAccessControlConfig\"  \n                                (click)=\"editVictimDetail(row)\">\n                                <i class=\"material-icons\">mode_edit</i>\n                            </button>\n                        </div>\n\n                        \n\n                        &nbsp;&nbsp; \n\n                        <div  *ngIf=\"showCaseNote\">\n                            <button type=\"button\" matTooltip=\"CaseNote\"  mat-raised-button color=\"primary\" \n                            accessControl\n                            [accessControlConfig]=\"updateAccessControlConfig\"  \n                            (click)=\"goToCaseNote(row.victimId)\">                        \n                                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Case Note\n                            </button> \n                        </div>\n                         &nbsp;&nbsp;\n                       \n                         <div  *ngIf=\"showSafetyPlan\">\n                        <button type=\"button\"  matTooltip=\"safety plan\" mat-raised-button color=\"primary\"\n                         accessControl\n                         [accessControlConfig]=\"updateAccessControlConfig\"  \n                         (click)=\"goToSaftyPlan(row.victimId)\">                        \n                                <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;Safety Plan\n                        </button>\n                        </div>\n                        &nbsp;&nbsp;\n   \n                    </mat-cell>\n                </ng-container>\n\n                <mat-header-row *matHeaderRowDef=\"displayedColumns\" class=\"example-header-row\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns: displayedColumns\" class=\"example-row\"></mat-row>\n                </mat-table>\n\n              <mat-paginator #paginator [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 100]\"></mat-paginator> \n          </mat-card-content>\n    </mat-card>\n    </div>\n\n    <div>\n        <b>{{msg}}</b>\n    </div>\n</div>", styles: ["div.services{max-width:500px;margin:auto;border:3px solid #73AD21}.rTable{display:block;width:100%}.rTableHeading,.rTableBody,.rTableFoot,.rTableRow{clear:both}.rTableHead,.rTableFoot{background-color:#ddd;font-weight:700}.rTableCell,.rTableHead{border:0px;float:left;padding:1px;width:28%}.rTable:after{visibility:hidden;display:block;font-size:0;content:\" \";clear:both;height:0}.victimSearch{display:grid;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-title,.example-headers-align .mat-expansion-panel-header-description{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-lastName,.mat-column-firstName,.mat-column-relationship,.mat-column-homePhone,.mat-column-offenderName{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;-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;-webkit-hyphens:auto;hyphens:auto}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: i1$1.MatDialog }, { type: NgcSmartVictimService }, { type: i5.Router }, { type: i5.ActivatedRoute }, { type: i4.MatSnackBar }, { type: IntakeServicesComponent }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [SMART_WARRANT_URL]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [DOCUMENT]
+                    }] }];
+    }, propDecorators: { offenderId: [{
+                type: Input
+            }], staffId: [{
+                type: Input
+            }], staffRole: [{
+                type: Input
+            }], showCaseNote: [{
+                type: Input
+            }], showSafetyPlan: [{
+                type: Input
+            }], showAdd: [{
+                type: Input
+            }], showEdit: [{
+                type: Input
+            }], showRelationshipColumn: [{
+                type: Input
+            }], showOffenderNameColumn: [{
+                type: Input
+            }], showOffenderPhoneColumn: [{
+                type: Input
+            }], showSearchForm: [{
+                type: Input
+            }], accessByModule: [{
+                type: Input
+            }], intakeFlag: [{
+                type: Input
+            }], appModuleId: [{
+                type: Input
+            }], activatedRoute: [{
+                type: Input
+            }], paginator: [{
+                type: ViewChild,
+                args: [MatPaginator]
+            }], sort: [{
+                type: ViewChild,
+                args: [MatSort]
+            }] } });
+
+class SmartVictimDeleteConfirmComponent {
+    constructor(dialogRef, data) {
+        this.dialogRef = dialogRef;
+        this.data = data;
+    }
+    onNoClick() {
+        this.dialogRef.close();
+    }
+    ngOnInit() {
+    }
+}
+/** @nocollapse */ SmartVictimDeleteConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SmartVictimDeleteConfirmComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ SmartVictimDeleteConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SmartVictimDeleteConfirmComponent, selector: "csmart-victim-delete-confirm", ngImport: i0, template: `
+  <h1 mat-dialog-title>Delete Confirmation</h1>
+  <div mat-dialog-content>
+    <p>Are you sure you want to delete this item?</p>
+  </div>
+  <div mat-dialog-actions class="actions">
+    <button mat-flat-button color="primary" (click)="onNoClick()">No</button>
+    <button mat-flat-button color="warn" [mat-dialog-close]='"YES"' cdkFocusInitial>Yes</button>
+  </div>
+  `, isInline: true, styles: [".actions{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SmartVictimDeleteConfirmComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'csmart-victim-delete-confirm', template: `
+  <h1 mat-dialog-title>Delete Confirmation</h1>
+  <div mat-dialog-content>
+    <p>Are you sure you want to delete this item?</p>
+  </div>
+  <div mat-dialog-actions class="actions">
+    <button mat-flat-button color="primary" (click)="onNoClick()">No</button>
+    <button mat-flat-button color="warn" [mat-dialog-close]='"YES"' cdkFocusInitial>Yes</button>
+  </div>
+  `, styles: [".actions{display:flex;justify-content:space-between}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [MAT_DIALOG_DATA]
+                    }] }];
+    } });
+
+class SharedModule {
+}
+/** @nocollapse */ SharedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ SharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: SharedModule, imports: [MatButtonModule,
+        MatCardModule,
+        MatCheckboxModule,
+        MatToolbarModule,
+        MatSelectModule,
+        MatDatepickerModule,
+        MatNativeDateModule,
+        MatDialogModule,
+        MatTabsModule,
+        MatListModule,
+        MatInputModule,
+        MatStepperModule,
+        BrowserAnimationsModule,
+        MatGridListModule,
+        MatProgressSpinnerModule,
+        MatTableModule,
+        MatSidenavModule,
+        MatRadioModule,
+        MatIconModule,
+        MatSliderModule,
+        MatChipsModule,
+        MatSnackBarModule,
+        CdkTableModule,
+        MatSortModule,
+        MatPaginatorModule,
+        MatExpansionModule,
+        MatRippleModule,
+        SmartUiModule], exports: [MatButtonModule,
+        MatCardModule,
+        MatCheckboxModule,
+        MatToolbarModule,
+        MatSelectModule,
+        MatDatepickerModule,
+        MatNativeDateModule,
+        MatDialogModule,
+        MatTabsModule,
+        MatListModule,
+        MatInputModule,
+        MatStepperModule,
+        BrowserAnimationsModule,
+        MatGridListModule,
+        MatProgressSpinnerModule,
+        MatTableModule,
+        MatSidenavModule,
+        MatRadioModule,
+        MatIconModule,
+        MatSliderModule,
+        MatChipsModule,
+        MatSnackBarModule,
+        CdkTableModule,
+        MatSortModule,
+        MatPaginatorModule,
+        MatExpansionModule,
+        MatRippleModule,
+        SmartUiModule] });
+/** @nocollapse */ SharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SharedModule, imports: [MatButtonModule,
+        MatCardModule,
+        MatCheckboxModule,
+        MatToolbarModule,
+        MatSelectModule,
+        MatDatepickerModule,
+        MatNativeDateModule,
+        MatDialogModule,
+        MatTabsModule,
+        MatListModule,
+        MatInputModule,
+        MatStepperModule,
+        BrowserAnimationsModule,
+        MatGridListModule,
+        MatProgressSpinnerModule,
+        MatTableModule,
+        MatSidenavModule,
+        MatRadioModule,
+        MatIconModule,
+        MatSliderModule,
+        MatChipsModule,
+        MatSnackBarModule,
+        CdkTableModule,
+        MatSortModule,
+        MatPaginatorModule,
+        MatExpansionModule,
+        MatRippleModule,
+        SmartUiModule, MatButtonModule,
+        MatCardModule,
+        MatCheckboxModule,
+        MatToolbarModule,
+        MatSelectModule,
+        MatDatepickerModule,
+        MatNativeDateModule,
+        MatDialogModule,
+        MatTabsModule,
+        MatListModule,
+        MatInputModule,
+        MatStepperModule,
+        BrowserAnimationsModule,
+        MatGridListModule,
+        MatProgressSpinnerModule,
+        MatTableModule,
+        MatSidenavModule,
+        MatRadioModule,
+        MatIconModule,
+        MatSliderModule,
+        MatChipsModule,
+        MatSnackBarModule,
+        CdkTableModule,
+        MatSortModule,
+        MatPaginatorModule,
+        MatExpansionModule,
+        MatRippleModule,
+        SmartUiModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SharedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        MatButtonModule,
+                        MatCardModule,
+                        MatCheckboxModule,
+                        MatToolbarModule,
+                        MatSelectModule,
+                        MatDatepickerModule,
+                        MatNativeDateModule,
+                        MatDialogModule,
+                        MatTabsModule,
+                        MatListModule,
+                        MatInputModule,
+                        MatStepperModule,
+                        BrowserAnimationsModule,
+                        MatGridListModule,
+                        MatProgressSpinnerModule,
+                        MatTableModule,
+                        MatSidenavModule,
+                        MatRadioModule,
+                        MatIconModule,
+                        MatSliderModule,
+                        MatChipsModule,
+                        MatSnackBarModule,
+                        CdkTableModule,
+                        MatSortModule,
+                        MatPaginatorModule,
+                        MatExpansionModule,
+                        MatRippleModule,
+                        SmartUiModule
+                    ],
+                    exports: [
+                        MatButtonModule,
+                        MatCardModule,
+                        MatCheckboxModule,
+                        MatToolbarModule,
+                        MatSelectModule,
+                        MatDatepickerModule,
+                        MatNativeDateModule,
+                        MatDialogModule,
+                        MatTabsModule,
+                        MatListModule,
+                        MatInputModule,
+                        MatStepperModule,
+                        BrowserAnimationsModule,
+                        MatGridListModule,
+                        MatProgressSpinnerModule,
+                        MatTableModule,
+                        MatSidenavModule,
+                        MatRadioModule,
+                        MatIconModule,
+                        MatSliderModule,
+                        MatChipsModule,
+                        MatSnackBarModule,
+                        CdkTableModule,
+                        MatSortModule,
+                        MatPaginatorModule,
+                        MatExpansionModule,
+                        MatRippleModule,
+                        SmartUiModule
+                    ]
+                }]
+        }] });
+
+class CommonDialogModule {
+}
+/** @nocollapse */ CommonDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ CommonDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogModule, declarations: [CommonDialogComponent], imports: [
+        // MaterialModule.forRoot(),
+        SharedModule
+    ], exports: [CommonDialogComponent] });
+/** @nocollapse */ CommonDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogModule, providers: [
+        CommonDialogComponent,
+    ], imports: [
+        // MaterialModule.forRoot(),
+        SharedModule
+    ] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CommonDialogModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        // MaterialModule.forRoot(),
+                        SharedModule
+                    ],
+                    exports: [
+                        CommonDialogComponent,
+                    ],
+                    declarations: [
+                        CommonDialogComponent,
+                    ],
+                    providers: [
+                        CommonDialogComponent,
+                    ]
+                }]
+        }] });
+
+function dateValidator() {
+    return (control) => {
+        const dateStr = control.value;
+        const invalidObj = { 'date': 'future Date is Not Allowed' };
+        const date = new Date(dateStr);
+        if (date > new Date()) {
+            return invalidObj;
+        }
+        return null;
+    };
+}
+function passDateValidator() {
+    return (control) => {
+        const dateStr = control.value;
+        const invalidObj = { 'date': 'Pass Date is Not Allowed' };
+        const date = new Date(dateStr);
+        if (date < new Date()) {
+            return invalidObj;
+        }
+        return null;
+    };
+}
+function dateLessThan(dateField1, dateField2, validatorField) {
+    return (c) => {
+        const date1 = c.get(dateField1).value;
+        const date2 = c.get(dateField2).value;
+        console.log('date1');
+        console.log(date1);
+        console.log('date2');
+        console.log(date2);
+        //const invalidObj = { 'dateRule': 'date is Not Allowed' };
+        if ((date1 !== null && date2 !== null) && date1 > date2) {
+            console.log(validatorField);
+            return validatorField;
+            //return invalidObj;
+        }
+        console.log('return null');
+        return null;
+    };
+}
+function greaterLessThan(dateField1, dateField2, validatorField) {
+    return (c) => {
+        const date1 = c.get(dateField1).value;
+        const date2 = c.get(dateField2).value;
+        console.log('end date');
+        console.log(date1);
+        console.log('ver date');
+        console.log(date2);
+        //const invalidObj = { 'dateRule': 'date is Not Allowed' };
+        if ((date1 !== null && date2 !== null) && date1 < date2) {
+            console.log(validatorField);
+            return validatorField;
+            //return invalidObj;
+        }
+        console.log('return null');
+        return null;
+    };
+}
+
+class EmailService {
+    constructor(apollo) {
+        this.apollo = apollo;
+    }
+    createCaseNoteEmail(templateId, offenderId, modifiedBy) {
+        return this.createEmail(templateId, `{\\"offenderId\\": ${offenderId}}`, modifiedBy);
+    }
+    createEmail(emailTemplateId, parameters, modifiedBy) {
+        const mutation = `mutation {
+      createEmail(input: {
+        emailTemplateId: "${emailTemplateId}"
+        parameters: "${parameters}"
+        modifiedBy: ${modifiedBy}
+      }) {
+        message
+        data {
+          emailQueueId
+        }
+      }
+    }`;
+        console.log(mutation);
+        return this.apollo.mutate({
+            mutation: gql `
+        ${mutation}
+      `,
+        });
+    }
+}
+/** @nocollapse */ EmailService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmailService, deps: [{ token: i2.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
+/** @nocollapse */ EmailService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmailService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmailService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i2.Apollo }]; } });
+
+class CaseNoteComponent {
+    constructor(formBuilder, _victimServicesComponent, commonDialogService, snackBar, route, router, smartAuthService, emailService) {
+        this.formBuilder = formBuilder;
+        this._victimServicesComponent = _victimServicesComponent;
+        this.commonDialogService = commonDialogService;
+        this.snackBar = snackBar;
+        this.route = route;
+        this.router = router;
+        this.smartAuthService = smartAuthService;
+        this.emailService = emailService;
+        this.editCaseNote = {};
+        this.caseNoteDataSource = new MatTableDataSource();
+        this.initForm();
+    }
+    initForm() {
+        this.caseNoteForm = this.formBuilder.group({
+            caseNoteDate: new UntypedFormControl('', Validators.compose([
+                Validators.required, dateValidator()
+            ])),
+            contactType: new UntypedFormControl('', Validators.required),
+            contactPurpose: new UntypedFormControl('', Validators.required),
+            comment: new UntypedFormControl('', Validators.required)
+        });
+        this.caseNoteForm.markAsPristine();
+        this.caseNoteForm.markAsUntouched();
+    }
+    ngAfterViewInit() {
+        this.smartAuthService.setPermission('Victim', this.route.snapshot);
+    }
+    ngOnInit() {
+        var data = this.route.snapshot.data;
+        this.loginStaff = data.loginStaff;
+        this.staffId = this.loginStaff.staffId;
+        this.sub = this.route.params.subscribe(params => {
+            this.victimId = params['victimId'];
+            this.offenderId = params['offenderId'];
+        });
+        this.addDisableFlag = false;
+        this.hiddenDetailFlag = true;
+        this.hiddenAddNewFlag = false;
+        this._victimServicesComponent.getVictim(this.victimId).subscribe((items) => {
+            this.victimName = items.firstName + ', ' + items.lastName;
+        });
+        this._victimServicesComponent.getContactTypes().subscribe((items) => {
+            this.contactTypes = items;
+        });
+        this._victimServicesComponent.getVictimContactPurposes().subscribe((items) => {
+            this.contactPurposes = items;
+        });
+        this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(caseNoteList => {
+            console.log('caseNoteList');
+            console.log(caseNoteList);
+            this.caseNoteList = caseNoteList;
+            this.caseNoteDataSource.data = this.caseNoteList;
+        });
+        // this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(
+        //   (itms: any) => {
+        //   const ELEMENT_DATA: Element[] = itms;
+        //   this.caseNoteDataSource.data =  ELEMENT_DATA;
+        //   })
+    }
+    onEditCaseNote(victimCaseNoteId) {
+        this.hiddenDetailFlag = false;
+        this.hiddenAddNewFlag = true;
+        this.addDisableFlag = true;
+        this.editCaseNote = this.caseNoteList.find(x => x.victimCaseNoteId === victimCaseNoteId);
+    }
+    onDeleteCaseNote(victimCaseNoteId) {
+        this.commonDialogService
+            .confirm('', 'Do you want to delete this case note?', 'Yes', 'No')
+            .subscribe(res => {
+            this.result = res;
+            if (this.result) {
+                this._victimServicesComponent.deleteCaseNote(victimCaseNoteId, this.staffId)
+                    .subscribe(result => {
+                    this.snackBar.open('delete Successfully !', '', { duration: 3000, });
+                    this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(caseNoteList => {
+                        this.caseNoteList = caseNoteList;
+                        this.caseNoteDataSource.data = this.caseNoteList;
+                    });
+                });
+            }
+        });
+    }
+    onAddNew() {
+        this.hiddenDetailFlag = false;
+        this.editCaseNote.victimCaseNoteId = 0;
+        const caseNoteDateControl = this.caseNoteForm.get('caseNoteDate');
+        caseNoteDateControl.setValue(null);
+        caseNoteDateControl.setErrors(null);
+        caseNoteDateControl.markAsPristine();
+        caseNoteDateControl.markAsPristine();
+        const contactTypeControl = this.caseNoteForm.get('contactType');
+        contactTypeControl.setValue(null);
+        contactTypeControl.setErrors(null);
+        contactTypeControl.markAsPristine();
+        contactTypeControl.markAsUntouched();
+        const contactPurposeControl = this.caseNoteForm.get('contactPurpose');
+        contactPurposeControl.setValue(null);
+        contactPurposeControl.setErrors(null);
+        contactPurposeControl.markAsPristine();
+        contactPurposeControl.markAsUntouched();
+        const commentControl = this.caseNoteForm.get('comment');
+        commentControl.setValue(null);
+        commentControl.setErrors(null);
+        commentControl.markAsPristine();
+        commentControl.markAsUntouched();
+    }
+    back() {
+        this.router.navigate(['victimHome']);
+    }
+    saveCaseNote() {
+        this.emailService
+            .createCaseNoteEmail("VictimCaseNoteReminders", this.offenderId, this.staffId)
+            .subscribe();
+        if (this.editCaseNote.victimCaseNoteId === undefined || this.editCaseNote.victimCaseNoteId === 0) {
+            const castNote = {
+                victimId: this.victimId,
+                victimCaseNoteId: 0,
+                caseNoteDate: this.editCaseNote.caseNoteDate,
+                contactTypeId: this.editCaseNote.contactTypeId,
+                contactType: null,
+                victimContactPurposeId: this.editCaseNote.victimContactPurposeId,
+                victimContactPurpose: null,
+                comment: this.editCaseNote.comment,
+                modifiedBy: this.staffId,
+                victimFirstName: null,
+                victimLastName: null
+            };
+            this._victimServicesComponent.addCaseNote(castNote).subscribe(result => {
+                this.snackBar.open('Saved Successfully !', '', {
+                    duration: 3000,
+                });
+                // this._victimServicesComponent.sendEmail('', {referralId:  0, offenderId: this.offenderId }, this.loginStaff.staffId);
+                this.hiddenDetailFlag = true;
+                this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(caseNoteList => {
+                    this.caseNoteList = caseNoteList;
+                    this.caseNoteDataSource.data = this.caseNoteList;
+                });
+            });
+        }
+        else {
+            this._victimServicesComponent.updateCaseNote(this.editCaseNote).subscribe(result => {
+                this.snackBar.open('Update Successfully !', '', {
+                    duration: 3000,
+                });
+                this.hiddenDetailFlag = true;
+                this.hiddenAddNewFlag = false;
+                this.addDisableFlag = false;
+                this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(caseNoteList => {
+                    this.caseNoteList = caseNoteList;
+                    this.caseNoteDataSource.data = this.caseNoteList;
+                });
+            });
+        }
+        //email
+    }
+}
+/** @nocollapse */ CaseNoteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseNoteComponent, deps: [{ token: i1$2.UntypedFormBuilder }, { token: NgcSmartVictimService }, { token: CommonDialogService }, { token: i4.MatSnackBar }, { token: i5.ActivatedRoute }, { token: i5.Router }, { token: i6.SmartAuthService }, { token: EmailService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ CaseNoteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CaseNoteComponent, selector: "ng-component", providers: [CommonDialogService], ngImport: i0, template: "\n <mat-card>\n        <mat-card-header>\n\n        </mat-card-header>\n         <mat-card-content>\n                \n                        <mat-toolbar  color=\"primary\">\n                                        <h4 class=\"card-header\" >Case Note</h4>\n                        </mat-toolbar>\n                        <br>\n                        <div class=\"row\" >\n                                <div [hidden]=\"hiddenAddNewFlag\">\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\" (click)=\"onAddNew()\" [disabled]=\"addDisableFlag\">Add Case Note</button>\n\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n                                </div>\n                       </div>\n\n                        <div [hidden]=\"hiddenDetailFlag\" >\n                                        <mat-card >\n                                        <div class='container'>       \n                                        <form [formGroup]=\"caseNoteForm\" #caseNoteDetailForm=\"ngForm\" >\n                                                    \n                                                <div>\n                                                        <mat-label>Victim Name:</mat-label>\n                                                                {{victimName}} \n                                                </div>\n                                                      \n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Date of Case Note: </mat-label>\n                                                                 <input matInput formControlName=\"caseNoteDate\"   \n                                                                 (click)=\"caseNoteDate.open()\" \n                                                                 [matDatepicker]=\"caseNoteDate\" \n                                                                 placeholder=\"Choose a start date\" \n                                                                 [(ngModel)]=\"editCaseNote.caseNoteDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"caseNoteDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #caseNoteDate></mat-datepicker>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('caseNoteDate').errors \n                                                                && (caseNoteForm.get('caseNoteDate').dirty || caseNoteForm.get('caseNoteDate').touched)\">\n                                                                <mat-error>case note date is <strong>required</strong></mat-error>\n                                                                </div> \n\n                                                                <div class=\"help-block\" \n                                                                *ngIf=\"caseNoteForm.get('caseNoteDate').hasError('date') \n                                                                && (caseNoteForm.get('caseNoteDate').dirty || caseNoteForm.get('caseNoteDate').touched)\">\n                                                                <mat-error>future case note Date is <strong>not allowed</strong></mat-error>\n                                                                </div>\n\n                                                        </mat-form-field>\n\n                                                </div>  \n                                                                \n                                                       \n\n                                                <div>\n                                                        <mat-form-field>\n                                                                <mat-label>Contact Type:</mat-label>\n                                                                <mat-select  placeholder=\"contactType\" formControlName=\"contactType\"  required   [(ngModel)]=\"editCaseNote.contactTypeId\">\n                                                                        <mat-option *ngFor=\" let contactType of contactTypes\" [value]=\"contactType.contactTypeId\" >{{contactType.name}}</mat-option>\n                                                                </mat-select>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('contactType').errors \n                                                                && (caseNoteForm.get('contactType').dirty || caseNoteForm.get('contactType').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                        </mat-form-field>\n                                                </div>\n                                                                      \n                                                 <div>                    \n                                                        <mat-form-field class=\"mat-select-content\">\n                                                                <mat-label>Contact Purpose:</mat-label>\n                                                                <mat-select  formControlName=\"contactPurpose\"   required [(ngModel)]=\"editCaseNote.victimContactPurposeId\" class=\"mat-select-inner\">\n                                                                        <mat-option *ngFor=\" let contactPurpose of contactPurposes\" [value]=\"contactPurpose.victimContactPurposeId\" >{{contactPurpose.name}}</mat-option>\n                                                                </mat-select>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('contactPurpose').errors \n                                                                && (caseNoteForm.get('contactPurpose').dirty || caseNoteForm.get('contactPurpose').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                                \n                                                        </mat-form-field>\n                                                </div>  \n                                                \n                                                <div>\n\n                                                        <mat-form-field style=\"width: 400px;\">\n                                                                <mat-label>Comment:</mat-label>\n                                                                <textarea \n                                                                class=\"textarea-content\"\n                                                                matInput \n                                                                placeholder=\"\" \n                                                                required formControlName=\"comment\" \n                                                                [(ngModel)]=\"editCaseNote.comment\"\n                                                                cdkTextareaAutosize\n                                                                #autosize=\"cdkTextareaAutosize\"\n                                                                cdkAutosizeMinRows=\"8\"\n                                                                cdkAutosizeMaxRows=\"12\">\n                                                                </textarea> \n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('comment').errors \n                                                                && (caseNoteForm.get('comment').dirty || caseNoteForm.get('comment').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                        </mat-form-field>\n                                                </div>\n                                                \n                                                <div>\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveCaseNote()\"  [disabled]=\"!caseNoteDetailForm.form.valid\" >Save</button>\n\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  (click)=\"hiddenDetailFlag = true;addDisableFlag = false; this.hiddenAddNewFlag = false;\">Cancel</button>\n                                                </div>\n\n                                              </form>\n                                              </div>\n                                                </mat-card>\n                                        \n                                        </div>\n                        <br>\n                        <mat-table #table [dataSource]=\"caseNoteDataSource\" class=\"example-table\">\n                                        <ng-container matColumnDef=\"caseNoteDate\">\n                                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Case Note Date</mat-header-cell>\n                                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.caseNoteDate | date}} </mat-cell>\n                                        </ng-container>\n\n\n                                        <ng-container matColumnDef=\"contactType\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Type</mat-header-cell>\n                                                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactType}} </mat-cell>\n                                        </ng-container>\n                                        \n                                    \n                                        <ng-container matColumnDef=\"contactPurpose\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Purpose</mat-header-cell>\n                                                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactPurpose}} </mat-cell>\n                                        </ng-container>\n                                        <ng-container matColumnDef=\"comment\">\n                                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                                                </ng-container>\n\n                                        <ng-container matColumnDef=\"victimCaseNoteId\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n                                              \n                                                <button \n                                                class=\"sac-cso-read sac-vsp-read\"  \n                                                mat-icon-button \n                                                color=\"primary\"  \n                                                matTooltip=\"Edit Case Note\" \n                                                (click)=\"onEditCaseNote(row.victimCaseNoteId)\">\n                                                        <i class=\"material-icons\">mode_edit</i>\n                                                </button>\n\n                                                &nbsp;&nbsp;\n                                             \n                                              \n\n                                        <button\n                                        class=\"sac-vsp-read\"\n                                        matTooltip=\"Delete Case Note\" \n                                        mat-icon-button\n                                        color=\"primary\"\n                                        (click)=\"onDeleteCaseNote(row.victimCaseNoteId)\">\n                                        <i class=\"material-icons\">delete</i>\n                                        </button>\n\n\n\n\n                                            </mat-cell>\n                                        </ng-container>\n        \n                                        <mat-header-row *matHeaderRowDef=\"['caseNoteDate', 'contactType', 'contactPurpose', 'comment', 'victimCaseNoteId']\" class=\"example-header-row\"></mat-header-row>\n                                        <mat-row *matRowDef=\"let row; columns:['caseNoteDate', 'contactType', 'contactPurpose', 'comment', 'victimCaseNoteId'];\" class=\"example-row\"></mat-row>\n                                        </mat-table>\n\n\n\n\n\n\n\n</mat-card-content>\n</mat-card>", styles: [".container{width:800px;margin:16px;display:grid;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}.textarea-content{width:500px}\n"], dependencies: [{ kind: "directive", type: i8$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i11$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i12.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i14.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatLabel, selector: "mat-label" }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i15.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i18.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i11$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: i8$1.DatePipe, name: "date" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseNoteComponent, decorators: [{
+            type: Component,
+            args: [{ providers: [CommonDialogService], template: "\n <mat-card>\n        <mat-card-header>\n\n        </mat-card-header>\n         <mat-card-content>\n                \n                        <mat-toolbar  color=\"primary\">\n                                        <h4 class=\"card-header\" >Case Note</h4>\n                        </mat-toolbar>\n                        <br>\n                        <div class=\"row\" >\n                                <div [hidden]=\"hiddenAddNewFlag\">\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\" (click)=\"onAddNew()\" [disabled]=\"addDisableFlag\">Add Case Note</button>\n\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n                                </div>\n                       </div>\n\n                        <div [hidden]=\"hiddenDetailFlag\" >\n                                        <mat-card >\n                                        <div class='container'>       \n                                        <form [formGroup]=\"caseNoteForm\" #caseNoteDetailForm=\"ngForm\" >\n                                                    \n                                                <div>\n                                                        <mat-label>Victim Name:</mat-label>\n                                                                {{victimName}} \n                                                </div>\n                                                      \n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Date of Case Note: </mat-label>\n                                                                 <input matInput formControlName=\"caseNoteDate\"   \n                                                                 (click)=\"caseNoteDate.open()\" \n                                                                 [matDatepicker]=\"caseNoteDate\" \n                                                                 placeholder=\"Choose a start date\" \n                                                                 [(ngModel)]=\"editCaseNote.caseNoteDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"caseNoteDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #caseNoteDate></mat-datepicker>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('caseNoteDate').errors \n                                                                && (caseNoteForm.get('caseNoteDate').dirty || caseNoteForm.get('caseNoteDate').touched)\">\n                                                                <mat-error>case note date is <strong>required</strong></mat-error>\n                                                                </div> \n\n                                                                <div class=\"help-block\" \n                                                                *ngIf=\"caseNoteForm.get('caseNoteDate').hasError('date') \n                                                                && (caseNoteForm.get('caseNoteDate').dirty || caseNoteForm.get('caseNoteDate').touched)\">\n                                                                <mat-error>future case note Date is <strong>not allowed</strong></mat-error>\n                                                                </div>\n\n                                                        </mat-form-field>\n\n                                                </div>  \n                                                                \n                                                       \n\n                                                <div>\n                                                        <mat-form-field>\n                                                                <mat-label>Contact Type:</mat-label>\n                                                                <mat-select  placeholder=\"contactType\" formControlName=\"contactType\"  required   [(ngModel)]=\"editCaseNote.contactTypeId\">\n                                                                        <mat-option *ngFor=\" let contactType of contactTypes\" [value]=\"contactType.contactTypeId\" >{{contactType.name}}</mat-option>\n                                                                </mat-select>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('contactType').errors \n                                                                && (caseNoteForm.get('contactType').dirty || caseNoteForm.get('contactType').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                        </mat-form-field>\n                                                </div>\n                                                                      \n                                                 <div>                    \n                                                        <mat-form-field class=\"mat-select-content\">\n                                                                <mat-label>Contact Purpose:</mat-label>\n                                                                <mat-select  formControlName=\"contactPurpose\"   required [(ngModel)]=\"editCaseNote.victimContactPurposeId\" class=\"mat-select-inner\">\n                                                                        <mat-option *ngFor=\" let contactPurpose of contactPurposes\" [value]=\"contactPurpose.victimContactPurposeId\" >{{contactPurpose.name}}</mat-option>\n                                                                </mat-select>\n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('contactPurpose').errors \n                                                                && (caseNoteForm.get('contactPurpose').dirty || caseNoteForm.get('contactPurpose').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                                \n                                                        </mat-form-field>\n                                                </div>  \n                                                \n                                                <div>\n\n                                                        <mat-form-field style=\"width: 400px;\">\n                                                                <mat-label>Comment:</mat-label>\n                                                                <textarea \n                                                                class=\"textarea-content\"\n                                                                matInput \n                                                                placeholder=\"\" \n                                                                required formControlName=\"comment\" \n                                                                [(ngModel)]=\"editCaseNote.comment\"\n                                                                cdkTextareaAutosize\n                                                                #autosize=\"cdkTextareaAutosize\"\n                                                                cdkAutosizeMinRows=\"8\"\n                                                                cdkAutosizeMaxRows=\"12\">\n                                                                </textarea> \n\n                                                                <div class=\"help-block\" *ngIf=\"caseNoteForm.get('comment').errors \n                                                                && (caseNoteForm.get('comment').dirty || caseNoteForm.get('comment').touched)\">\n                                                                <mat-error>comment is <strong>required</strong></mat-error>\n                                                                </div> \n                                                        </mat-form-field>\n                                                </div>\n                                                \n                                                <div>\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveCaseNote()\"  [disabled]=\"!caseNoteDetailForm.form.valid\" >Save</button>\n\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  (click)=\"hiddenDetailFlag = true;addDisableFlag = false; this.hiddenAddNewFlag = false;\">Cancel</button>\n                                                </div>\n\n                                              </form>\n                                              </div>\n                                                </mat-card>\n                                        \n                                        </div>\n                        <br>\n                        <mat-table #table [dataSource]=\"caseNoteDataSource\" class=\"example-table\">\n                                        <ng-container matColumnDef=\"caseNoteDate\">\n                                            <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Case Note Date</mat-header-cell>\n                                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.caseNoteDate | date}} </mat-cell>\n                                        </ng-container>\n\n\n                                        <ng-container matColumnDef=\"contactType\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Type</mat-header-cell>\n                                                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactType}} </mat-cell>\n                                        </ng-container>\n                                        \n                                    \n                                        <ng-container matColumnDef=\"contactPurpose\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Contact Purpose</mat-header-cell>\n                                                <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.contactPurpose}} </mat-cell>\n                                        </ng-container>\n                                        <ng-container matColumnDef=\"comment\">\n                                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                                                </ng-container>\n\n                                        <ng-container matColumnDef=\"victimCaseNoteId\">\n                                                <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                                            <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n                                              \n                                                <button \n                                                class=\"sac-cso-read sac-vsp-read\"  \n                                                mat-icon-button \n                                                color=\"primary\"  \n                                                matTooltip=\"Edit Case Note\" \n                                                (click)=\"onEditCaseNote(row.victimCaseNoteId)\">\n                                                        <i class=\"material-icons\">mode_edit</i>\n                                                </button>\n\n                                                &nbsp;&nbsp;\n                                             \n                                              \n\n                                        <button\n                                        class=\"sac-vsp-read\"\n                                        matTooltip=\"Delete Case Note\" \n                                        mat-icon-button\n                                        color=\"primary\"\n                                        (click)=\"onDeleteCaseNote(row.victimCaseNoteId)\">\n                                        <i class=\"material-icons\">delete</i>\n                                        </button>\n\n\n\n\n                                            </mat-cell>\n                                        </ng-container>\n        \n                                        <mat-header-row *matHeaderRowDef=\"['caseNoteDate', 'contactType', 'contactPurpose', 'comment', 'victimCaseNoteId']\" class=\"example-header-row\"></mat-header-row>\n                                        <mat-row *matRowDef=\"let row; columns:['caseNoteDate', 'contactType', 'contactPurpose', 'comment', 'victimCaseNoteId'];\" class=\"example-row\"></mat-row>\n                                        </mat-table>\n\n\n\n\n\n\n\n</mat-card-content>\n</mat-card>", styles: [".container{width:800px;margin:16px;display:grid;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}.textarea-content{width:500px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$2.UntypedFormBuilder }, { type: NgcSmartVictimService }, { type: CommonDialogService }, { type: i4.MatSnackBar }, { type: i5.ActivatedRoute }, { type: i5.Router }, { type: i6.SmartAuthService }, { type: EmailService }]; } });
+
+class ContactComponent {
+    constructor(_victimServicesComponent, 
+    //private commonDialogService: CommonDialogService,
+    snackBar, route, router, smartAuthService) {
+        this._victimServicesComponent = _victimServicesComponent;
+        this.snackBar = snackBar;
+        this.route = route;
+        this.router = router;
+        this.smartAuthService = smartAuthService;
+        this.editContact = {};
+        this.staff = {};
+        this.contactForm = new UntypedFormGroup({
+            //contactDate: new FormControl(),
+            contactDate: new UntypedFormControl('', Validators.compose([
+                dateValidator()
+            ])),
+            contactMethod: new UntypedFormControl(),
+            contactBy: new UntypedFormControl(),
+            comment: new UntypedFormControl(),
+            nextContactDate: new UntypedFormControl()
+        });
+    }
+    ngAfterViewInit() {
+        this.smartAuthService.setPermission('Victim', this.route.snapshot);
+    }
+    ngOnInit() {
+        var data = this.route.snapshot.data;
+        this.loginStaff = data.loginStaff;
+        this.staffId = this.loginStaff.staffId;
+        this.staff = [
+            {
+                staffId: this.loginStaff.staffId,
+                fullName: this.loginStaff.firstName + ' ' + this.loginStaff.lastName,
+            },
+        ];
+        this.sub = this.route.params.subscribe(params => {
+            this.victimId = params['victimId'];
+            console.log('my this.victimId');
+            console.log(this.victimId);
+        });
+        this._victimServicesComponent.getContactMethods().subscribe((items) => {
+            this.contactMethods = items;
+            console.log('this.contactMethods');
+            console.log(this.contactMethods);
+        });
+        // this._victimServicesComponent.getContactBys().subscribe(
+        //   (items: any) => {
+        //     this.contactBy= items;
+        //   }
+        // );
+        // this._victimServicesComponent.getContacts(this.victimId).subscribe(
+        //   caseNoteList => {
+        //     this.caseNoteList = caseNoteList; 
+        //   }
+        // );
+    }
+    onEditContact(victimContactId) {
+        // this.hiddenDetailFlag =false;
+        // this.hiddenAddNewFlag = true;
+        // this.addDisableFlag = true;
+        // this.editCaseNote = this.caseNoteList.find(x => x.victimCaseNoteId === victimCaseNoteId);
+    }
+    // onDeleteCaseNote(victimCaseNoteId: number){
+    //    this.commonDialogService
+    //   .confirm('', 'Do you want to delete this case note?', 'Yes', 'No')
+    //   .subscribe(res => {this.result =  res;
+    //       if (this.result) {
+    //           this._victimServicesComponent.deleteCaseNote(victimCaseNoteId, this.staffId)
+    //            .subscribe(result => {
+    //               this.snackBar.open('delete Successfully !', '', { duration: 3000,});
+    //           this._victimServicesComponent.getCasetNotes(this.victimId).subscribe(
+    //             caseNoteList => {
+    //               this.caseNoteList = caseNoteList; 
+    //             }
+    //           );
+    //              }
+    //            );
+    //       }
+    //    });
+    // }
+    onAddNew() {
+        // this.editCas.caseNoteDate = null;
+        // this.editCaseNote.contactTypeId = null;
+        // this.editCaseNote.victimContactPurposeId = null;
+        // this.editCaseNote.comment = null;
+    }
+    back() {
+        this.router.navigate(['victimDetail', this.victimId]);
+    }
+    saveContact() {
+        const contact = {
+            victimId: this.victimId,
+            victimContactId: 0,
+            contactDate: this.editContact.contactDate,
+            victimContactMethodId: this.editContact.victimContactMethodId,
+            contactMethod: null,
+            contactedByName: null,
+            contactedBy: this.editContact.contactedBy,
+            comment: this.editContact.comment,
+            nextContactDate: this.editContact.nextContactDate,
+            modifiedBy: this.staffId,
+        };
+        this._victimServicesComponent.addContact(contact).subscribe(result => {
+            this.snackBar.open('Saved Successfully !', '', {
+                duration: 3000,
+            });
+            this.router.navigate(['victimDetail', this.victimId]);
+        });
+    }
+}
+/** @nocollapse */ ContactComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactComponent, deps: [{ token: NgcSmartVictimService }, { token: i4.MatSnackBar }, { token: i5.ActivatedRoute }, { token: i5.Router }, { token: i6.SmartAuthService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ ContactComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ContactComponent, selector: "ng-component", ngImport: i0, template: "\n <mat-card>\n        <mat-card-header>\n\n        </mat-card-header>\n         <mat-card-content>\n                \n                        <mat-toolbar  color=\"primary\">\n                                        <h4 class=\"card-header\" >Contact detail</h4>\n                        </mat-toolbar>\n                        <br>\n       \n\n                       \n                                        <mat-card >\n                                        <div class='container'>       \n                                        <form [formGroup]=\"contactForm\" #contactDetailForm=\"ngForm\" >\n                                                    \n                                               \n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Contact Date:</mat-label>\n                                                                 <input matInput formControlName=\"contactDate\"   \n                                                                 (click)=\"contactDate.open()\" \n                                                                 [matDatepicker]=\"contactDate\" \n                                                                 placeholder=\"Choose a contact date\" \n                                                                 [(ngModel)]=\"editContact.contactDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"contactDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #contactDate></mat-datepicker>\n                                                        </mat-form-field>\n\n                                                        <div class=\"validation-errors\">\n                                                                <div\n                                                                  class=\"help-block\"\n                                                                  *ngIf=\"\n                                                                  contactForm\n                                                                      .get('contactDate')\n                                                                      .hasError('required') &&\n                                                                    (contactForm.get('contactDate').dirty ||\n                                                                    contactForm.get('contactDate').touched)\">\n                                                                  <mat-error>Contact date is\n                                                                    <strong>required</strong></mat-error>\n                                                                </div>\n                                                                <div\n                                                                  class=\"help-block\"\n                                                                  *ngIf=\"\n                                                                  contactForm.get('contactDate').hasError('date') &&\n                                                                    (contactForm.get('contactDate').dirty ||\n                                                                    contactForm.get('contactDate').touched)\">\n                                                                  <mat-error >future Date is <strong>not allowed</strong> for contact date</mat-error>\n                                                                </div>\n                                                              </div>\n                                                </div>  \n                                                                \n                                                       \n\n                                                <div>\n                                                        <mat-form-field>\n                                                                <mat-label>Contact Method:</mat-label>\n                                                                <mat-select  placeholder=\"contactMethod\" formControlName=\"contactMethod\"  required   [(ngModel)]=\"editContact.victimContactMethodId\">\n                                                                        <mat-option *ngFor=\" let contactMethod of contactMethods\" [value]=\"contactMethod.victimContactMethodId\" >{{contactMethod.name}}</mat-option>\n                                                                </mat-select>\n                                                        </mat-form-field>\n                                                </div>\n                                                                      \n                                                 <div>                    \n                                                        <mat-form-field class=\"mat-select-content\">\n                                                                <mat-label>Contact By:</mat-label>\n                                                                <mat-select  formControlName=\"contactBy\"   required [(ngModel)]=\"editContact.contactedBy\" class=\"mat-select-inner\">\n                                                                        <mat-option *ngFor=\" let item of staff\" [value]=\"item.staffId\" >{{ item.fullName}}</mat-option>\n                                                                </mat-select>\n                                                        </mat-form-field>\n                                                </div>  \n                                                \n                                                <div>\n\n                                                        <mat-form-field>\n                                                                <mat-label>Comments </mat-label>\n                                                                <textarea \n                                                                matInput \n                                                                placeholder=\"\" \n                                                                required formControlName=\"comment\" \n                                                                [(ngModel)]=\"editContact.comment\"\n                                                                cdkTextareaAutosize\n                                                                #autosize=\"cdkTextareaAutosize\"\n                                                                cdkAutosizeMinRows=\"1\"\n                                                                cdkAutosizeMaxRows=\"5\">\n                                                                </textarea> \n                                                        </mat-form-field>\n                                                </div>\n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Next Contact Date: </mat-label>\n                                                                 <input matInput formControlName=\"nextContactDate\"   \n                                                                 (click)=\"nextContactDate.open()\" \n                                                                 [matDatepicker]=\"nextContactDate\" \n                                                                 placeholder=\"Choose a next contact date\" \n                                                                 [(ngModel)]=\"editContact.nextContactDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"nextContactDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #nextContactDate></mat-datepicker>\n                                                        </mat-form-field>\n                                                </div> \n                                                \n                                                <div>\n                                                        <!-- <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\"  [disabled]=\"!contactForm.form.valid\" >Save</button> -->\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\" [disabled]=\"!contactForm.valid\" >Save</button>\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  >Cancel</button>\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\" (click)=\"back()\"  >Back</button>\n                                                </div>\n\n                                              </form>\n                                              </div>\n                                                </mat-card>\n                                        \n                                       \n                        <br>\n                       \n\n\n\n</mat-card-content>\n</mat-card>", styles: ["mat-form-field{width:50%}.container{margin:16px;display:grid;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}\n"], dependencies: [{ kind: "directive", type: i8$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i11$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i12.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i14.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatLabel, selector: "mat-label" }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i15.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i18.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactComponent, decorators: [{
+            type: Component,
+            args: [{ template: "\n <mat-card>\n        <mat-card-header>\n\n        </mat-card-header>\n         <mat-card-content>\n                \n                        <mat-toolbar  color=\"primary\">\n                                        <h4 class=\"card-header\" >Contact detail</h4>\n                        </mat-toolbar>\n                        <br>\n       \n\n                       \n                                        <mat-card >\n                                        <div class='container'>       \n                                        <form [formGroup]=\"contactForm\" #contactDetailForm=\"ngForm\" >\n                                                    \n                                               \n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Contact Date:</mat-label>\n                                                                 <input matInput formControlName=\"contactDate\"   \n                                                                 (click)=\"contactDate.open()\" \n                                                                 [matDatepicker]=\"contactDate\" \n                                                                 placeholder=\"Choose a contact date\" \n                                                                 [(ngModel)]=\"editContact.contactDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"contactDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #contactDate></mat-datepicker>\n                                                        </mat-form-field>\n\n                                                        <div class=\"validation-errors\">\n                                                                <div\n                                                                  class=\"help-block\"\n                                                                  *ngIf=\"\n                                                                  contactForm\n                                                                      .get('contactDate')\n                                                                      .hasError('required') &&\n                                                                    (contactForm.get('contactDate').dirty ||\n                                                                    contactForm.get('contactDate').touched)\">\n                                                                  <mat-error>Contact date is\n                                                                    <strong>required</strong></mat-error>\n                                                                </div>\n                                                                <div\n                                                                  class=\"help-block\"\n                                                                  *ngIf=\"\n                                                                  contactForm.get('contactDate').hasError('date') &&\n                                                                    (contactForm.get('contactDate').dirty ||\n                                                                    contactForm.get('contactDate').touched)\">\n                                                                  <mat-error >future Date is <strong>not allowed</strong> for contact date</mat-error>\n                                                                </div>\n                                                              </div>\n                                                </div>  \n                                                                \n                                                       \n\n                                                <div>\n                                                        <mat-form-field>\n                                                                <mat-label>Contact Method:</mat-label>\n                                                                <mat-select  placeholder=\"contactMethod\" formControlName=\"contactMethod\"  required   [(ngModel)]=\"editContact.victimContactMethodId\">\n                                                                        <mat-option *ngFor=\" let contactMethod of contactMethods\" [value]=\"contactMethod.victimContactMethodId\" >{{contactMethod.name}}</mat-option>\n                                                                </mat-select>\n                                                        </mat-form-field>\n                                                </div>\n                                                                      \n                                                 <div>                    \n                                                        <mat-form-field class=\"mat-select-content\">\n                                                                <mat-label>Contact By:</mat-label>\n                                                                <mat-select  formControlName=\"contactBy\"   required [(ngModel)]=\"editContact.contactedBy\" class=\"mat-select-inner\">\n                                                                        <mat-option *ngFor=\" let item of staff\" [value]=\"item.staffId\" >{{ item.fullName}}</mat-option>\n                                                                </mat-select>\n                                                        </mat-form-field>\n                                                </div>  \n                                                \n                                                <div>\n\n                                                        <mat-form-field>\n                                                                <mat-label>Comments </mat-label>\n                                                                <textarea \n                                                                matInput \n                                                                placeholder=\"\" \n                                                                required formControlName=\"comment\" \n                                                                [(ngModel)]=\"editContact.comment\"\n                                                                cdkTextareaAutosize\n                                                                #autosize=\"cdkTextareaAutosize\"\n                                                                cdkAutosizeMinRows=\"1\"\n                                                                cdkAutosizeMaxRows=\"5\">\n                                                                </textarea> \n                                                        </mat-form-field>\n                                                </div>\n\n                                                <div>      \n                                                        <mat-form-field>\n                                                                <mat-label>Next Contact Date: </mat-label>\n                                                                 <input matInput formControlName=\"nextContactDate\"   \n                                                                 (click)=\"nextContactDate.open()\" \n                                                                 [matDatepicker]=\"nextContactDate\" \n                                                                 placeholder=\"Choose a next contact date\" \n                                                                 [(ngModel)]=\"editContact.nextContactDate\" required>\n                                                                <mat-datepicker-toggle matSuffix [for]=\"nextContactDate\"></mat-datepicker-toggle>\n                                                                <mat-datepicker #nextContactDate></mat-datepicker>\n                                                        </mat-form-field>\n                                                </div> \n                                                \n                                                <div>\n                                                        <!-- <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\"  [disabled]=\"!contactForm.form.valid\" >Save</button> -->\n                                                        <button  mat-raised-button color=\"primary\" (click)=\"saveContact()\" [disabled]=\"!contactForm.valid\" >Save</button>\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\"  >Cancel</button>\n                                                        &nbsp;&nbsp;<button  mat-raised-button color=\"primary\" (click)=\"back()\"  >Back</button>\n                                                </div>\n\n                                              </form>\n                                              </div>\n                                                </mat-card>\n                                        \n                                       \n                        <br>\n                       \n\n\n\n</mat-card-content>\n</mat-card>", styles: ["mat-form-field{width:50%}.container{margin:16px;display:grid;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}\n"] }]
+        }], ctorParameters: function () { return [{ type: NgcSmartVictimService }, { type: i4.MatSnackBar }, { type: i5.ActivatedRoute }, { type: i5.Router }, { type: i6.SmartAuthService }]; } });
+
+class VictimSafetyPlanComponent {
+    constructor(_victimServicesComponent, commonDialogService, http, dialog, route, router, snackBar, smartAuthService) {
+        this._victimServicesComponent = _victimServicesComponent;
+        this.commonDialogService = commonDialogService;
+        this.http = http;
+        this.dialog = dialog;
+        this.route = route;
+        this.router = router;
+        this.snackBar = snackBar;
+        this.smartAuthService = smartAuthService;
+        this.editSafetyPlan = {};
+        this.safetyPlanDataSource = new MatTableDataSource();
+    }
+    ngAfterViewInit() {
+        this.smartAuthService.setPermission('Victim', this.route.snapshot);
+    }
+    ngOnInit() {
+        var data = this.route.snapshot.data;
+        this.loginStaff = data.loginStaff;
+        this.staffId = this.loginStaff.staffId;
+        this.sub = this.route.params.subscribe(params => {
+            this.victimId = params['victimId'];
+        });
+        this.hiddenAddNewFlag = false;
+        this.victimName = this.victimName;
+        this._victimServicesComponent.getSafetyPlans(this.victimId).subscribe(victimSafetyPlans => {
+            this.victimSafetyPlans = victimSafetyPlans;
+            this.safetyPlanDataSource.data = this.victimSafetyPlans;
+            console.log('this.victimSafetyPlans');
+            console.log(this.victimSafetyPlans);
+        });
+        //  this.myVictimServiceId =1;
+        // this._victimServicesComponent.getVictimServiceDetail(this.myVictimServiceId).subscribe(
+        //   victimServiceDetail => {
+        //     this.victimServiceDetail = victimServiceDetail;
+        //     console.log('service detail');
+        //     console.log(this.victimServiceDetail); 
+        //   }
+        // );
+        this._victimServicesComponent.getServiceStatusHistories(1).subscribe(victimServiceStatusHistories => {
+            // this.victimServiceStatusHistories = victimServiceStatusHistories; 
+        });
+    }
+    //---------------graphQL--------------------------------------
+    //   getVictimServiceTypeProgramProviders(): Observable<VictimServiceTypeProgramProviderModel[]> {
+    //     const queryString = `
+    //         {
+    //           findVictimServiceTypeProgramProviders {
+    //                 data {
+    //                   victimServiceTypeProgramProviderId
+    //                   victimServiceType
+    //                   victimProgramProvider
+    //                 }
+    //               }
+    //         }`;
+    //     return this.http.post<any>(environment.smartApiUrl, { query: queryString })
+    //         .map(result => {
+    //         return result.data.findVictimServiceTypeProgramProviders.data;
+    //     });
+    // }
+    goToSafetyPlanDetail(victimServiceId) {
+        this.router.navigate(['saftyPlanDetail', victimServiceId, this.victimId]);
+    }
+    onAddNew() {
+        this.hiddenDetailFlag = false;
+    }
+    onDeleteSafetyPlan(victimServiceId) {
+        this.commonDialogService
+            .confirm('', 'Do you want to delete this safety plan?', 'Yes', 'No')
+            .subscribe(res => {
+            this.result = res;
+            if (this.result) {
+                this._victimServicesComponent.deleteSafetyPlan(victimServiceId, this.staffId)
+                    .subscribe(result => {
+                    this.snackBar.open('delete safety plan Successfully !', '', { duration: 3000, });
+                    this._victimServicesComponent.getSafetyPlans(this.victimId).subscribe(victimSafetyPlans => {
+                        this.victimSafetyPlans = victimSafetyPlans;
+                        this.safetyPlanDataSource.data = this.victimSafetyPlans;
+                    });
+                });
+            }
+        });
+    }
+    back() {
+        this.router.navigate(['victimHome']);
+    }
+}
+/** @nocollapse */ VictimSafetyPlanComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSafetyPlanComponent, deps: [{ token: NgcSmartVictimService }, { token: CommonDialogService }, { token: i1.HttpClient }, { token: i1$1.MatDialog }, { token: i5.ActivatedRoute }, { token: i5.Router }, { token: i4.MatSnackBar }, { token: i6.SmartAuthService }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ VictimSafetyPlanComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: VictimSafetyPlanComponent, selector: "ng-component", providers: [CommonDialogService], ngImport: i0, template: "\n <mat-card>\n        <mat-card-header>\n        </mat-card-header>\n         <mat-card-content>\n                <mat-toolbar  color=\"primary\">\n                        <h4 class=\"card-header\" style=\"display: inline-block;\">Safety Plan</h4>\n                    </mat-toolbar>\n        <br>\n        <button mat-raised-button color=\"primary\" (click)=\"goToSafetyPlanDetail(0)\" >Add Goal</button>\n        &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n        <br>\n        <br>\n        <mat-table #table [dataSource]=\"safetyPlanDataSource\" class=\"example-table\">\n                <ng-container matColumnDef=\"startDate\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Start Date</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.startDate | date}} </mat-cell>\n                </ng-container>\n                <ng-container matColumnDef=\"goal\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Goal</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.goal }} </mat-cell>\n                    </ng-container>\n                    <ng-container matColumnDef=\"victimServiceStatus\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Status</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimServiceStatus }} </mat-cell>\n                    </ng-container>\n                    <ng-container matColumnDef=\"comment\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment }} </mat-cell>\n                    </ng-container>\n\n                <ng-container matColumnDef=\"victimServiceId\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                    <!-- <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n                        <button type=\"button\" mat-raised-button color=\"primary\" (click)=\"goToSafetyPlanDetail(row.victimServiceId)\">                        \n                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;\n                        <mat-icon>edit</mat-icon> \n                        </button> \n                      \n                       \n\n\n\n\n\n                        &nbsp;&nbsp;\n                        <button type=\"button\" mat-raised-button color=\"primary\" (click)=\"onDeleteSafetyPlan(row.victimServiceId)\">                        \n                            <span class=\"glyphicon glyphicon-trash\" ></span>&nbsp;Delete\n                        </button> \n                    </mat-cell> -->\n\n                    <mat-cell *matCellDef=\"let element\">\n                          \n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"Edit Safety Plan\" (click)=\"goToSafetyPlanDetail(element.victimServiceId)\">\n                                <i class=\"material-icons\">mode_edit</i>\n                            </button>\n\n                            &nbsp;&nbsp;\n                          \n                            <button\n                            class=\"delete-btn\"\n                            matTooltip=\"Delete Safety Plan\"\n                            mat-icon-button\n                            color=\"primary\"\n                            (click)=\"onDeleteSafetyPlan(element.victimServiceId)\">\n                            <i class=\"material-icons\">delete</i>\n                          </button>\n\n\n\n\n                        \n                    </mat-cell>\n\n                           \n                  \n                </ng-container>\n\n                <mat-header-row *matHeaderRowDef=\"['startDate', 'goal', 'victimServiceStatus', 'comment', 'victimServiceId']\" class=\"example-header-row\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns:['startDate', 'goal', 'victimServiceStatus', 'comment', 'victimServiceId'];\" class=\"example-row\"></mat-row>\n                </mat-table>\n               \n       \n</mat-card-content>\n</mat-card>", dependencies: [{ kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i11$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i11$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: i8$1.DatePipe, name: "date" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSafetyPlanComponent, decorators: [{
+            type: Component,
+            args: [{ providers: [CommonDialogService], template: "\n <mat-card>\n        <mat-card-header>\n        </mat-card-header>\n         <mat-card-content>\n                <mat-toolbar  color=\"primary\">\n                        <h4 class=\"card-header\" style=\"display: inline-block;\">Safety Plan</h4>\n                    </mat-toolbar>\n        <br>\n        <button mat-raised-button color=\"primary\" (click)=\"goToSafetyPlanDetail(0)\" >Add Goal</button>\n        &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n        <br>\n        <br>\n        <mat-table #table [dataSource]=\"safetyPlanDataSource\" class=\"example-table\">\n                <ng-container matColumnDef=\"startDate\">\n                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Start Date</mat-header-cell>\n                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.startDate | date}} </mat-cell>\n                </ng-container>\n                <ng-container matColumnDef=\"goal\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Goal</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.goal }} </mat-cell>\n                    </ng-container>\n                    <ng-container matColumnDef=\"victimServiceStatus\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Status</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimServiceStatus }} </mat-cell>\n                    </ng-container>\n                    <ng-container matColumnDef=\"comment\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment }} </mat-cell>\n                    </ng-container>\n\n                <ng-container matColumnDef=\"victimServiceId\">\n                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\"></mat-header-cell>\n                    <!-- <mat-cell *matCellDef=\"let row\" class=\"example-cell\">\n                        <button type=\"button\" mat-raised-button color=\"primary\" (click)=\"goToSafetyPlanDetail(row.victimServiceId)\">                        \n                        <span class=\"glyphicon glyphicon-pencil\" ></span>&nbsp;\n                        <mat-icon>edit</mat-icon> \n                        </button> \n                      \n                       \n\n\n\n\n\n                        &nbsp;&nbsp;\n                        <button type=\"button\" mat-raised-button color=\"primary\" (click)=\"onDeleteSafetyPlan(row.victimServiceId)\">                        \n                            <span class=\"glyphicon glyphicon-trash\" ></span>&nbsp;Delete\n                        </button> \n                    </mat-cell> -->\n\n                    <mat-cell *matCellDef=\"let element\">\n                          \n                            <button class=\"edit-btn\"  mat-icon-button color=\"primary\"  matTooltip=\"Edit Safety Plan\" (click)=\"goToSafetyPlanDetail(element.victimServiceId)\">\n                                <i class=\"material-icons\">mode_edit</i>\n                            </button>\n\n                            &nbsp;&nbsp;\n                          \n                            <button\n                            class=\"delete-btn\"\n                            matTooltip=\"Delete Safety Plan\"\n                            mat-icon-button\n                            color=\"primary\"\n                            (click)=\"onDeleteSafetyPlan(element.victimServiceId)\">\n                            <i class=\"material-icons\">delete</i>\n                          </button>\n\n\n\n\n                        \n                    </mat-cell>\n\n                           \n                  \n                </ng-container>\n\n                <mat-header-row *matHeaderRowDef=\"['startDate', 'goal', 'victimServiceStatus', 'comment', 'victimServiceId']\" class=\"example-header-row\"></mat-header-row>\n                <mat-row *matRowDef=\"let row; columns:['startDate', 'goal', 'victimServiceStatus', 'comment', 'victimServiceId'];\" class=\"example-row\"></mat-row>\n                </mat-table>\n               \n       \n</mat-card-content>\n</mat-card>" }]
+        }], ctorParameters: function () { return [{ type: NgcSmartVictimService }, { type: CommonDialogService }, { type: i1.HttpClient }, { type: i1$1.MatDialog }, { type: i5.ActivatedRoute }, { type: i5.Router }, { type: i4.MatSnackBar }, { type: i6.SmartAuthService }]; } });
+
+class SeriveProviderComponent {
+    constructor(formBuilder, dialogRef, _victimServicesComponent, data) {
+        this.formBuilder = formBuilder;
+        this.dialogRef = dialogRef;
+        this._victimServicesComponent = _victimServicesComponent;
+        this.data = data;
+        this.spForm = this.formBuilder.group({
+            voteeProviderId: [''],
+        });
+    }
+    cancel() {
+        this.dialogRef.close();
+    }
+    ngOnInit() {
+        console.log('data.providerCollections');
+        console.log(this.data);
+        console.log(this.data.serviceTypeId);
+        this._victimServicesComponent.getvVictimServiceTypeProgramProviders().subscribe((items) => {
+            this.programProviders = items.filter((y) => (y.victimServiceTypeId === this.data.serviceTypeId));
+            console.log('this.programProviders');
+            console.log(this.programProviders);
+        });
+        this.spForm.get('voteeProviderId').valueChanges.subscribe(voteeProviderId => {
+            console.log('voteeProviderId in service provider component.');
+            console.log(voteeProviderId);
+        });
+    }
+}
+/** @nocollapse */ SeriveProviderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SeriveProviderComponent, deps: [{ token: i1$2.UntypedFormBuilder }, { token: i1$1.MatDialogRef }, { token: NgcSmartVictimService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ SeriveProviderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SeriveProviderComponent, selector: "app-service-provider", ngImport: i0, template: `
+    <h1 mat-dialog-title> {{data.serviceType}}</h1>
+    <div mat-dialog-content class="main" [formGroup]="spForm">
+      <mat-form-field>
+        <mat-label>service provider</mat-label>
+        
+        <mat-select formControlName="voteeProviderId">
+          <mat-option
+            *ngFor="let providerOption of programProviders"
+            [value]="providerOption.victimProgramProviderId">{{ providerOption.victimProgramProvider }}
+          </mat-option>
+        </mat-select>
+      
+      </mat-form-field>
+  
+    </div>
+    <div mat-dialog-actions class="actions">
+      <button mat-raised-button color="primary" (click)="cancel()" cdkFocusInitial>
+        Cancel Change
+      </button>
+      <button mat-raised-button color="primary" [mat-dialog-close]="spForm.value" >
+        Save Change
+      </button>
+    </div>
+  `, isInline: true, styles: [".main{width:100%;display:flex;flex-direction:column}.actions{display:flex}\n"], dependencies: [{ kind: "directive", type: i8$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i17.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i18.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SeriveProviderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-service-provider', template: `
+    <h1 mat-dialog-title> {{data.serviceType}}</h1>
+    <div mat-dialog-content class="main" [formGroup]="spForm">
+      <mat-form-field>
+        <mat-label>service provider</mat-label>
+        
+        <mat-select formControlName="voteeProviderId">
+          <mat-option
+            *ngFor="let providerOption of programProviders"
+            [value]="providerOption.victimProgramProviderId">{{ providerOption.victimProgramProvider }}
+          </mat-option>
+        </mat-select>
+      
+      </mat-form-field>
+  
+    </div>
+    <div mat-dialog-actions class="actions">
+      <button mat-raised-button color="primary" (click)="cancel()" cdkFocusInitial>
+        Cancel Change
+      </button>
+      <button mat-raised-button color="primary" [mat-dialog-close]="spForm.value" >
+        Save Change
+      </button>
+    </div>
+  `, styles: [".main{width:100%;display:flex;flex-direction:column}.actions{display:flex}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: i1$2.UntypedFormBuilder }, { type: i1$1.MatDialogRef }, { type: NgcSmartVictimService }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [MAT_DIALOG_DATA]
+                    }] }];
+    } });
+
+class VictimSafetyPlanDetailComponent {
+    constructor(dialog, _victimServicesComponent, http, snackBar, route, router, commonDialogService, formBuilder) {
+        this.dialog = dialog;
+        this._victimServicesComponent = _victimServicesComponent;
+        this.http = http;
+        this.snackBar = snackBar;
+        this.route = route;
+        this.router = router;
+        this.commonDialogService = commonDialogService;
+        this.formBuilder = formBuilder;
+        this.editSafetyPlan = {};
+        this.providerListCollection = [];
+        this.serviceCheck = [];
+        this.victimServiceStatusHistoriesDataSource = new MatTableDataSource();
+        this.initForm();
+    }
+    initForm() {
+        this.spForm = this.formBuilder.group({
+            serviceGoal: new UntypedFormControl('', Validators.compose([
+                Validators.required
+            ])),
+            goalStatus: new UntypedFormControl('', Validators.compose([
+                Validators.required
+            ])),
+            goalStatusDate: new UntypedFormControl('', Validators.compose([
+                Validators.required, dateValidator()
+            ])),
+            comment: new UntypedFormControl('', Validators.required)
+        });
+        this.spForm.markAsPristine();
+        this.spForm.markAsUntouched();
+    }
+    ngOnInit() {
+        var data = this.route.snapshot.data;
+        this.loginStaff = data.loginStaff;
+        this.staffId = this.loginStaff.staffId;
+        this.sub = this.route.params.subscribe(params => {
+            this.victimServiceId = params['victimServiceId'];
+            this.victimId = params['victimId'];
+        });
+        this.hiddenAddNewFlag = false;
+        this.isDisplay = false;
+        this._victimServicesComponent.getVictimServiceTypes().subscribe((items) => {
+            this.victimServiceTypes = items;
+        });
+        this._victimServicesComponent.getVictimServiceStatus().subscribe((items) => {
+            this.victimServiceStatus = items;
+        });
+        this._victimServicesComponent.getVictim(this.victimId).subscribe((items) => {
+            this.victimName = items.firstName + ', ' + items.lastName;
+        });
+        //---------------graphQL--------------------------------------
+        // this.getVictimServiceTypeProgramProviders().subscribe(result => {
+        // this.providerList = result;
+        // });
+        // console.log('this.victimServiceId');
+        // console.log(this.victimServiceId);
+        if (this.victimServiceId != 0) {
+            this._victimServicesComponent.getVictimServices(this.victimServiceId).subscribe(victimSafetyPlans => {
+                console.log('victimSafetyPlans');
+                console.log(victimSafetyPlans);
+                this.editSafetyPlan = victimSafetyPlans[0];
+                this.victimId = victimSafetyPlans[0].victimId;
+                console.log('this.editSafetyPlan');
+                console.log(this.editSafetyPlan);
+                // console.log('this.editSafetyPlan.goal');
+                // console.log(this.editSafetyPlan.goal);
+                // console.log('this.editSafetyPlan[0].goal');
+                // console.log(this.editSafetyPlan[0].goal);
+            });
+            this._victimServicesComponent.getServiceStatusHistories(this.victimServiceId).subscribe(victimServiceStatusHistories => {
+                // this.victimServiceStatusHistories = victimServiceStatusHistories;
+                this.victimServiceStatusHistoriesDataSource.data = victimServiceStatusHistories;
+            });
+        }
+        this.loadProvider();
+    }
+    //pass in id
+    isInArray(providerListCollectionKey, serviceTypeName, event) {
+        console.log('providerListCollectionKey');
+        console.log(providerListCollectionKey);
+        console.log('serviceTypeName');
+        console.log(serviceTypeName);
+        console.log('event.source.value');
+        console.log(event.checked);
+        if (event.checked == true) {
+            for (let j = 0; j < this.providerListCollection.length; j++) {
+                if (providerListCollectionKey == this.providerListCollection[j].groupId) {
+                    this.providerListCollection[j].isDisplay = !this.providerListCollection[j].isDisplay;
+                    const dialogRef = this.dialog.open(SeriveProviderComponent, {
+                        width: '500px',
+                        data: {
+                            serviceType: serviceTypeName,
+                            serviceTypeId: providerListCollectionKey,
+                            providerCollections: [...this.providerListCollection],
+                        },
+                        panelClass: 'formFieldWidth480',
+                    });
+                    dialogRef.afterClosed().subscribe((result) => {
+                        console.log('The dialog was closed');
+                        console.log(result);
+                        if (result) {
+                            console.log('The dialog was closed, inside result');
+                            this.savePlanProvider(providerListCollectionKey, result.voteeProviderId);
+                        }
+                    });
+                    // return;
+                }
+            }
+        } //if event.checked == true
+        //this.router.navigate(['saftyPlanDetail', this.victimServiceId,  this.victimId ]); 
+    }
+    loadProvider() {
+        this.providerListCollection = [];
+        this._victimServicesComponent.getvVictimServiceTypeProgramProviders()
+            .subscribe((providerList) => {
+            if (providerList) {
+                let providers = Object.create(null);
+                for (let i = 0; i < providerList.length; i++) {
+                    if (!providers[providerList[i].victimServiceTypeId]) {
+                        providers[providerList[i].victimServiceTypeId] = [];
+                        if (this.editSafetyPlan.vVictimServiceDetails != null) {
+                            for (let j = 0; j < this.editSafetyPlan.vVictimServiceDetails.length; j++) {
+                                if (providerList[i].victimServiceTypeId == this.editSafetyPlan.vVictimServiceDetails[j].victimServiceId.toString()) {
+                                    this.isDisplay = true;
+                                }
+                            }
+                        }
+                        this.providerListCollection.push({ groupId: providerList[i].victimServiceTypeId, isDisplay: this.isDisplay, collection: providers[providerList[i].victimServiceTypeId] });
+                    }
+                    providers[providerList[i].victimServiceTypeId].push(providerList[i]);
+                }
+            }
+        });
+    }
+    //---------------graphQL--------------------------------------
+    //   getVictimServiceTypeProgramProviders(): Observable<VictimServiceTypeProgramProviderModel[]> {
+    //     const queryString = `
+    //         {
+    //           findVictimServiceTypeProgramProviders {
+    //                 data {
+    //                   victimServiceTypeProgramProviderId
+    //                   victimServiceType
+    //                   victimProgramProvider
+    //                 }
+    //               }
+    //         }`;
+    //     return this.http.post<any>(environment.smartApiUrl, { query: queryString })
+    //         .map(result => {
+    //         return result.data.findVictimServiceTypeProgramProviders.data;
+    //     });
+    // }
+    evaluateSelection(victimServiceTypeId) {
+        if (this.editSafetyPlan.vVictimServiceDetails) {
+            return this.editSafetyPlan.vVictimServiceDetails.findIndex(r => r.victimServiceTypeId === victimServiceTypeId) >= 0;
+        }
+    }
+    savePlanProvider(victimServiceTypeId, victimProgramProviderId) {
+        console.log('savePlanProvider');
+        console.log(victimServiceTypeId);
+        console.log(victimProgramProviderId);
+        if (victimProgramProviderId === "" || victimProgramProviderId === null || victimProgramProviderId === undefined) {
+            this.snackBar.open('Please pick a program on the drop down list !', '', { duration: 120, });
+            // alert('Please pick a program on the drop down list !');
+        }
+        else {
+            if (this.victimServiceId == 0) {
+                //insert
+                console.log('insert new plan');
+                const safetyPlan = {
+                    victimId: this.victimId,
+                    fullName: null,
+                    victimServiceId: 0,
+                    goal: this.editSafetyPlan.goal,
+                    comment: this.editSafetyPlan.comment,
+                    modifiedBy: this.staffId,
+                    victimServiceStatusId: null,
+                    status: null,
+                    startDate: null,
+                    vVictimServiceDetails: null,
+                    victimName: null
+                };
+                this._victimServicesComponent.addSafetyPlan(safetyPlan).subscribe((itms) => {
+                    const victimServiceStatus = {
+                        victimServiceStatusHistoryId: 0,
+                        victimServiceId: itms.victimServiceId,
+                        victimServiceStatusId: this.editSafetyPlan.victimServiceStatusId,
+                        startDate: this.editSafetyPlan.startDate,
+                        modifiedBy: this.staffId,
+                        comment: 'test add safety plan'
+                    };
+                    this._victimServicesComponent.addVictimServiceStatus(victimServiceStatus).subscribe(() => {
+                        console.log('check itms.victimServiceId iniside add victim serive status');
+                        console.log(itms.victimServiceId);
+                        const victimServiceDetail = {
+                            victimServiceId: itms.victimServiceId,
+                            victimServiceDetailId: 0,
+                            victimServiceTypeId: victimServiceTypeId,
+                            victimProgramProviderId: victimProgramProviderId,
+                            modifiedBy: this.staffId,
+                            victimProgramProvider: null
+                        };
+                        console.log('add plan provider here at insert');
+                        this._victimServicesComponent.addPlanProvider(victimServiceDetail).subscribe(() => {
+                            this.router.navigate(['saftyPlanDetail', itms.victimServiceId, this.victimId]);
+                        });
+                    });
+                });
+            }
+            else //update
+             {
+                const victimServiceDetail = {
+                    victimServiceId: this.victimServiceId,
+                    victimServiceDetailId: 0,
+                    victimServiceTypeId: victimServiceTypeId,
+                    victimProgramProviderId: victimProgramProviderId,
+                    modifiedBy: this.staffId,
+                    victimProgramProvider: null
+                };
+                console.log('add plan provider here at update');
+                this._victimServicesComponent.addPlanProvider(victimServiceDetail).subscribe(() => {
+                    this.router.navigate(['saftyPlanDetail', this.victimServiceId, this.victimId]);
+                });
+            }
+        }
+    }
+    deleteProvider(victimProgramProviderId) {
+        this.commonDialogService
+            .confirm('', 'Do you want to delete this provider?', 'Yes', 'No')
+            .subscribe(res => {
+            this.result = res;
+            if (this.result) {
+                this._victimServicesComponent.deleteProvider(victimProgramProviderId, this.staffId)
+                    .subscribe(result => {
+                    this.snackBar.open('delete provider Successfully !', '', {
+                        duration: 3000,
+                    });
+                    location.reload();
+                });
+            }
+        });
+        // location.reload();
+    }
+    saveSafetyPlan() {
+        if (this.editSafetyPlan.victimServiceId === undefined) {
+            const safetyPlan = {
+                victimId: this.victimId,
+                fullName: null,
+                victimServiceId: 0,
+                goal: this.editSafetyPlan.goal,
+                comment: this.editSafetyPlan.comment,
+                modifiedBy: this.staffId,
+                victimServiceStatusId: null,
+                status: null,
+                startDate: null,
+                vVictimServiceDetails: null,
+                victimName: null
+            };
+            this._victimServicesComponent.addSafetyPlan(safetyPlan).subscribe((itms) => {
+                const victimServiceStatus = {
+                    victimServiceStatusHistoryId: 0,
+                    victimServiceId: itms.victimServiceId,
+                    victimServiceStatusId: this.editSafetyPlan.victimServiceStatusId,
+                    startDate: this.editSafetyPlan.startDate,
+                    modifiedBy: this.staffId,
+                    comment: 'test add safety Plan'
+                };
+                this._victimServicesComponent.addVictimServiceStatus(victimServiceStatus).subscribe(resp => {
+                    this.snackBar.open('Insert status successfully!', '', {
+                        duration: 3000,
+                    });
+                });
+                this.router.navigate(['saftyPlanDetail', itms.victimServiceId, this.victimId]);
+            });
+        }
+        else {
+            // this.editSafetyPlan.modifiedBy=this.loginStaff.staffId;
+            this.editSafetyPlan.modifiedBy = this.staffId;
+            this._victimServicesComponent.updateSafetyPlan(this.editSafetyPlan).subscribe(resp => {
+                //  this.snackBar.open('update Successfully!', '', {
+                //  duration: 3000,
+                //       });
+                const victimServiceStatus = {
+                    victimServiceStatusHistoryId: 0,
+                    victimServiceId: this.editSafetyPlan.victimServiceId.toString(),
+                    victimServiceStatusId: this.editSafetyPlan.victimServiceStatusId,
+                    startDate: this.editSafetyPlan.startDate,
+                    modifiedBy: this.staffId,
+                    comment: 'test update safety Plan'
+                };
+                this._victimServicesComponent.addVictimServiceStatus(victimServiceStatus).subscribe();
+                this.router.navigate(['saftyPlanDetail', this.editSafetyPlan.victimServiceId, this.victimId]);
+            });
+        }
+    }
+    back() {
+        console.log('this.victimId');
+        console.log(this.victimId);
+        this.router.navigate(['saftyPlan', this.victimId]);
+    }
+}
+/** @nocollapse */ VictimSafetyPlanDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSafetyPlanDetailComponent, deps: [{ token: i1$1.MatDialog }, { token: NgcSmartVictimService }, { token: i1.HttpClient }, { token: i4.MatSnackBar }, { token: i5.ActivatedRoute }, { token: i5.Router }, { token: CommonDialogService }, { token: i1$2.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ VictimSafetyPlanDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: VictimSafetyPlanDetailComponent, selector: "ng-component", providers: [CommonDialogService], ngImport: i0, template: "<mat-card>\n        <mat-card-header>\n            \n        </mat-card-header>\n         <mat-card-content>\n        <mat-toolbar  color=\"primary\">\n                        <h4 class=\"card-header\" style=\"display: inline-block;\">Safety Plan</h4>\n        </mat-toolbar>\n \n        \n                        <div class='container'>\n                                <form [formGroup]=\"spForm\" #spDetailForm=\"ngForm\" >\n                                                       \n                            \n                                        <div class=\"row\" ><b>Victim Name:</b> {{victimName}} </div>\n                              \n\n                                        <div class=\"row\" > \n                                                <mat-form-field >\n                                                <mat-label>Goal:</mat-label>\n                                                 <input matInput  formControlName=\"serviceGoal\" [(ngModel)]=\"editSafetyPlan.goal\" >\n                                                </mat-form-field>\n                                                \n                                        </div>\n                                \n                                        <div class=\"row\">  \n                                                <mat-form-field>\n                                                  <mat-label>Goal Status:</mat-label>\n                                                  <mat-select  formControlName=\"goalStatus\"  [(ngModel)]=\"editSafetyPlan.victimServiceStatusId\" >\n                                                        <mat-option *ngFor=\" let victimServiceStatu of victimServiceStatus\" [value]=\"victimServiceStatu.victimServiceStatusId\" >{{victimServiceStatu.name}}</mat-option>\n                                                  </mat-select> \n                                                </mat-form-field>\n                                        </div>\n                                \n                       \n                                        <div class=\"row\">  \n                                                \n                                                <mat-form-field>\n                                                        <mat-label>Goal Status Date:</mat-label>\n                                                <input matInput \n                                                formControlName=\"goalStatusDate\" \n                                                [matDatepicker]=\"goalStatusDate\" \n                                                placeholder=\"Choose a date\" [(ngModel)]=\"editSafetyPlan.startDate\" \n                                                (click)=\"goalStatusDate.open()\" \n                                                >\n                                             \n                                                <mat-datepicker-toggle matSuffix [for]=\"goalStatusDate\"></mat-datepicker-toggle>\n                                                <mat-datepicker #goalStatusDate></mat-datepicker>   \n                                                </mat-form-field> \n\n\n                                                <div class=\"help-block\" \n                                                *ngIf=\"spForm.get('goalStatusDate').hasError('date') \n                                                && (spForm.get('goalStatusDate').dirty || spForm.get('goalStatusDate').touched)\">\n                                                <mat-error>Future Date is <strong>not allowed</strong> for goal status date</mat-error>\n                                                </div>\n                                         </div>\n\n                                      \n                                        <div class=\"row\" >  \n                                                <!-- <mat-form-field style=\"width: 200px;\"> -->\n                                                <!-- <mat-label>Comment:</mat-label>   \n                                                <textarea mdInput \n                                                class=\"textarea-content\"\n                                                [(ngModel)]=\"editSafetyPlan.comment\"\n                                                formControlName=\"comment\" \n                                                cdkTextareaAutosize\n                                                #autosize=\"cdkTextareaAutosize\"\n                                                cdkAutosizeMinRows=\"8\"\n                                                cdkAutosizeMaxRows=\"12\"\n                                                >\n                                                </textarea>   -->\n                                                <!-- </mat-form-field> -->\n\n\n\n                                                <mat-form-field style=\"width: 400px;\">\n                                                        <mat-label>Comment:</mat-label>\n                                                        <textarea \n                                                        class=\"textarea-content\"\n                                                        matInput \n                                                        placeholder=\"\" \n                                                        formControlName=\"comment\" \n                                                        [(ngModel)]=\"editSafetyPlan.comment\"\n                                                        cdkTextareaAutosize\n                                                        #autosize=\"cdkTextareaAutosize\"\n                                                        cdkAutosizeMinRows=\"8\"\n                                                        cdkAutosizeMaxRows=\"12\">\n                                                        </textarea> \n\n                                                        \n                                                </mat-form-field>\n\n                                       </div>\n\n                                </form>\n                        </div><!--end form-->\n                       \n  \n                                        <br>\n\n                                        <div class=\"row\"><b>Need and provider:</b><br> (click on a check box to select provider information)\n                                                          \n                                        <mat-list>\n                                                <mat-list-item *ngFor=\"let serviceType of victimServiceTypes; let i=index\" >\n                                                     <mat-checkbox class=\"example-margin\" name=\"victimService\"  color =\"primary\" [checked]=\"evaluateSelection(serviceType.victimServiceTypeId)\"  (change)=\"isInArray(serviceType.victimServiceTypeId,serviceType.name, $event);\" > {{serviceType.name}}</mat-checkbox>\n                                                     <div> &nbsp;&nbsp;</div>\n                                                      <div *ngFor=\"let provider of providerListCollection; let pi = index\"  >\n                                                                <!-- <div *ngIf=\"provider.isDisplay && serviceType.victimServiceTypeId == provider.groupId \" class=\"Row\">\n                                                                                                      \n                                                                                <div class=\"serviceSelect\"> -->\n                                                                                <!-- <mat-form-field> -->\n                                                                                        <!-- <mat-select  name=\"provider\" id=\"provider.groupId\" [(ngModel)]=\"providerId\" >  -->\n                                                                                        <!-- <mat-select  name=\"provider\" id=\"provider.groupId\" [(value)]=\"providerId\" > \n                                                                                          <mat-option *ngFor=\" let providerOption of provider.collection\" [value]=\"providerOption.victimProgramProviderId\" >{{providerOption.victimProgramProvider}}</mat-option>\n                                                                                        </mat-select> -->\n                                                                                <!-- </mat-form-field> -->\n                                                                                  \n                                                                                <!-- </div>\n\n                                                                                 <div class=\"serviceButton\">\n                                                                                    <button mat-raised-button color=\"primary\" (click)=\"savePlanProvider(serviceType.victimServiceTypeId ,providerId)\">Add Provider</button>\n                                                                                </div>\n                                                                </div> -->\n                                                        </div>\n                                                                <div *ngFor=\" let serviceprovider of editSafetyPlan.vVictimServiceDetails\"  >\n                                                                        \n                                                                        <div *ngIf=\"serviceType.victimServiceTypeId===serviceprovider.victimServiceTypeId\"  class=\"Row\" >\n                                                                                <!-- . {{ serviceprovider.victimProgramProvider}}<button mat-raised-button color=\"primary\" (click)=\"deleteProvider(serviceprovider.victimServiceDetailId)\">Delete</button> <br> -->\n                                                                                <div class=\"serviceSelect\" >\n                                                                                . {{ serviceprovider.victimProgramProvider}}\n                                                                                </div>\n                                                                                <div class=\"serviceButton\">\n                                                                                        <button mat-raised-button color=\"primary\" (click)=\"deleteProvider(serviceprovider.victimServiceDetailId)\">Delete</button> \n                                                                                </div>\n                                                                        \n                                                                        </div>\n                                                                \n                                                                </div>\n                                                      \n                                                </mat-list-item>       \n                                                                                                       \n                                         </mat-list>\n                                        </div>\n                                         \n                                                \n                                          \n                         \n\n\n\n\n\n\n         \n  \n                        <!-- <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Victim Name:</b> {{victimName}} </div>\n                                <div class='col-md-7'>           \n                                                 \n                                </div>           \n                        </div> -->\n                        <!-- <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'> \n                                        <mat-form-field >\n                                                <input matInput name=\"serviceGoal\" [(ngModel)]=\"editSafetyPlan.goal\" required placeholder=\"\">\n                                        </mat-form-field>\n                                </div>           \n                        </div>\n\n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal Status:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'> \n                                        <mat-select  name=\"goalStatus\"  [style.width]=\"'50%'\"  [(ngModel)]=\"editSafetyPlan.victimServiceStatusId\" required>\n                                                <mat-option *ngFor=\" let victimServiceStatu of victimServiceStatus\" [value]=\"victimServiceStatu.victimServiceStatusId\" >{{victimServiceStatu.name}}</mat-option>\n                                        </mat-select>\n                                </div>           \n                        </div>\n                \n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal Status Date:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'>           \n                                        <input matInput name=\"goalStatusDate\" [matDatepicker]=\"goalStatusDate\" placeholder=\"Choose a date\" [(ngModel)]=\"editSafetyPlan.startDate\"  required>\n                                        <mat-datepicker-toggle matSuffix [for]=\"goalStatusDate\"></mat-datepicker-toggle>\n                                        <mat-datepicker #goalStatusDate></mat-datepicker>                         \n                                </div>           \n                        </div>\n                \n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Comment:</b></div>\n                                <div class='col-md-7'>           \n                                        <textarea mdInput placeholder=\"\"  rows=\"10\" cols=\"50\" name=\"comment\" [(ngModel)]=\"editSafetyPlan.comment\"></textarea>  \n                                </div>           \n                        </div> -->\n\n                      \n                        <div class='row' >\n                                <div class='col-md-12 text-center'>\n                                <!-- <button type=\"button\" class=\"btn btn-default btn-small\" (click)=\"print()\">Print</button> -->\n                                <button mat-raised-button color=\"primary\" (click)=\"saveSafetyPlan()\" [disabled]=\"!spForm.valid\">Save</button>\n                                <!-- &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"commondialogRef.close()\">Cancel</button> -->\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n                                </div>                 \n                        </div> \n\n                        <!--status hisotry-->\n                       \n                         <mat-table #table [dataSource]=\"victimServiceStatusHistoriesDataSource\" class=\"example-table\">\n                                <ng-container matColumnDef=\"startDate\">\n                                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Start Date</mat-header-cell>\n                                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.startDate | date}} </mat-cell>\n                                </ng-container>\n\n\n                                <ng-container matColumnDef=\"victimServiceStatusId\">\n                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Status</mat-header-cell>\n                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimServiceStatusId}} </mat-cell>\n                                </ng-container>\n                                \n                            \n                                <ng-container matColumnDef=\"comment\">\n                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                                </ng-container>\n                                 <mat-header-row *matHeaderRowDef=\"[ 'startDate', 'victimServiceStatusId', 'comment']\" class=\"example-header-row\"></mat-header-row>\n                                <mat-row *matRowDef=\"let row; columns:[ 'startDate', 'victimServiceStatusId', 'comment'];\" class=\"example-row\"></mat-row>\n                         </mat-table>\n\n                \n                        \n\n</mat-card-content>\n</mat-card>", styles: ["div.serviceSelect{width:500px}div.serviceButton{width:20%}.container{margin:16px;display:grid;grid-template-columns:repeat(2,1fr);grid-gap:10px;grid-auto-rows:minmax(50px,auto);justify-items:stretch}.app-class .mat-list-item{height:auto}.textarea-content{width:500px}\n"], dependencies: [{ kind: "directive", type: i8$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i8.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "component", type: i12$1.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { kind: "component", type: i12$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { kind: "component", type: i11$2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i12.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i14.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatLabel, selector: "mat-label" }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i15.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i18.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i11$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i11$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: i8$1.DatePipe, name: "date" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimSafetyPlanDetailComponent, decorators: [{
+            type: Component,
+            args: [{ providers: [CommonDialogService], template: "<mat-card>\n        <mat-card-header>\n            \n        </mat-card-header>\n         <mat-card-content>\n        <mat-toolbar  color=\"primary\">\n                        <h4 class=\"card-header\" style=\"display: inline-block;\">Safety Plan</h4>\n        </mat-toolbar>\n \n        \n                        <div class='container'>\n                                <form [formGroup]=\"spForm\" #spDetailForm=\"ngForm\" >\n                                                       \n                            \n                                        <div class=\"row\" ><b>Victim Name:</b> {{victimName}} </div>\n                              \n\n                                        <div class=\"row\" > \n                                                <mat-form-field >\n                                                <mat-label>Goal:</mat-label>\n                                                 <input matInput  formControlName=\"serviceGoal\" [(ngModel)]=\"editSafetyPlan.goal\" >\n                                                </mat-form-field>\n                                                \n                                        </div>\n                                \n                                        <div class=\"row\">  \n                                                <mat-form-field>\n                                                  <mat-label>Goal Status:</mat-label>\n                                                  <mat-select  formControlName=\"goalStatus\"  [(ngModel)]=\"editSafetyPlan.victimServiceStatusId\" >\n                                                        <mat-option *ngFor=\" let victimServiceStatu of victimServiceStatus\" [value]=\"victimServiceStatu.victimServiceStatusId\" >{{victimServiceStatu.name}}</mat-option>\n                                                  </mat-select> \n                                                </mat-form-field>\n                                        </div>\n                                \n                       \n                                        <div class=\"row\">  \n                                                \n                                                <mat-form-field>\n                                                        <mat-label>Goal Status Date:</mat-label>\n                                                <input matInput \n                                                formControlName=\"goalStatusDate\" \n                                                [matDatepicker]=\"goalStatusDate\" \n                                                placeholder=\"Choose a date\" [(ngModel)]=\"editSafetyPlan.startDate\" \n                                                (click)=\"goalStatusDate.open()\" \n                                                >\n                                             \n                                                <mat-datepicker-toggle matSuffix [for]=\"goalStatusDate\"></mat-datepicker-toggle>\n                                                <mat-datepicker #goalStatusDate></mat-datepicker>   \n                                                </mat-form-field> \n\n\n                                                <div class=\"help-block\" \n                                                *ngIf=\"spForm.get('goalStatusDate').hasError('date') \n                                                && (spForm.get('goalStatusDate').dirty || spForm.get('goalStatusDate').touched)\">\n                                                <mat-error>Future Date is <strong>not allowed</strong> for goal status date</mat-error>\n                                                </div>\n                                         </div>\n\n                                      \n                                        <div class=\"row\" >  \n                                                <!-- <mat-form-field style=\"width: 200px;\"> -->\n                                                <!-- <mat-label>Comment:</mat-label>   \n                                                <textarea mdInput \n                                                class=\"textarea-content\"\n                                                [(ngModel)]=\"editSafetyPlan.comment\"\n                                                formControlName=\"comment\" \n                                                cdkTextareaAutosize\n                                                #autosize=\"cdkTextareaAutosize\"\n                                                cdkAutosizeMinRows=\"8\"\n                                                cdkAutosizeMaxRows=\"12\"\n                                                >\n                                                </textarea>   -->\n                                                <!-- </mat-form-field> -->\n\n\n\n                                                <mat-form-field style=\"width: 400px;\">\n                                                        <mat-label>Comment:</mat-label>\n                                                        <textarea \n                                                        class=\"textarea-content\"\n                                                        matInput \n                                                        placeholder=\"\" \n                                                        formControlName=\"comment\" \n                                                        [(ngModel)]=\"editSafetyPlan.comment\"\n                                                        cdkTextareaAutosize\n                                                        #autosize=\"cdkTextareaAutosize\"\n                                                        cdkAutosizeMinRows=\"8\"\n                                                        cdkAutosizeMaxRows=\"12\">\n                                                        </textarea> \n\n                                                        \n                                                </mat-form-field>\n\n                                       </div>\n\n                                </form>\n                        </div><!--end form-->\n                       \n  \n                                        <br>\n\n                                        <div class=\"row\"><b>Need and provider:</b><br> (click on a check box to select provider information)\n                                                          \n                                        <mat-list>\n                                                <mat-list-item *ngFor=\"let serviceType of victimServiceTypes; let i=index\" >\n                                                     <mat-checkbox class=\"example-margin\" name=\"victimService\"  color =\"primary\" [checked]=\"evaluateSelection(serviceType.victimServiceTypeId)\"  (change)=\"isInArray(serviceType.victimServiceTypeId,serviceType.name, $event);\" > {{serviceType.name}}</mat-checkbox>\n                                                     <div> &nbsp;&nbsp;</div>\n                                                      <div *ngFor=\"let provider of providerListCollection; let pi = index\"  >\n                                                                <!-- <div *ngIf=\"provider.isDisplay && serviceType.victimServiceTypeId == provider.groupId \" class=\"Row\">\n                                                                                                      \n                                                                                <div class=\"serviceSelect\"> -->\n                                                                                <!-- <mat-form-field> -->\n                                                                                        <!-- <mat-select  name=\"provider\" id=\"provider.groupId\" [(ngModel)]=\"providerId\" >  -->\n                                                                                        <!-- <mat-select  name=\"provider\" id=\"provider.groupId\" [(value)]=\"providerId\" > \n                                                                                          <mat-option *ngFor=\" let providerOption of provider.collection\" [value]=\"providerOption.victimProgramProviderId\" >{{providerOption.victimProgramProvider}}</mat-option>\n                                                                                        </mat-select> -->\n                                                                                <!-- </mat-form-field> -->\n                                                                                  \n                                                                                <!-- </div>\n\n                                                                                 <div class=\"serviceButton\">\n                                                                                    <button mat-raised-button color=\"primary\" (click)=\"savePlanProvider(serviceType.victimServiceTypeId ,providerId)\">Add Provider</button>\n                                                                                </div>\n                                                                </div> -->\n                                                        </div>\n                                                                <div *ngFor=\" let serviceprovider of editSafetyPlan.vVictimServiceDetails\"  >\n                                                                        \n                                                                        <div *ngIf=\"serviceType.victimServiceTypeId===serviceprovider.victimServiceTypeId\"  class=\"Row\" >\n                                                                                <!-- . {{ serviceprovider.victimProgramProvider}}<button mat-raised-button color=\"primary\" (click)=\"deleteProvider(serviceprovider.victimServiceDetailId)\">Delete</button> <br> -->\n                                                                                <div class=\"serviceSelect\" >\n                                                                                . {{ serviceprovider.victimProgramProvider}}\n                                                                                </div>\n                                                                                <div class=\"serviceButton\">\n                                                                                        <button mat-raised-button color=\"primary\" (click)=\"deleteProvider(serviceprovider.victimServiceDetailId)\">Delete</button> \n                                                                                </div>\n                                                                        \n                                                                        </div>\n                                                                \n                                                                </div>\n                                                      \n                                                </mat-list-item>       \n                                                                                                       \n                                         </mat-list>\n                                        </div>\n                                         \n                                                \n                                          \n                         \n\n\n\n\n\n\n         \n  \n                        <!-- <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Victim Name:</b> {{victimName}} </div>\n                                <div class='col-md-7'>           \n                                                 \n                                </div>           \n                        </div> -->\n                        <!-- <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'> \n                                        <mat-form-field >\n                                                <input matInput name=\"serviceGoal\" [(ngModel)]=\"editSafetyPlan.goal\" required placeholder=\"\">\n                                        </mat-form-field>\n                                </div>           \n                        </div>\n\n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal Status:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'> \n                                        <mat-select  name=\"goalStatus\"  [style.width]=\"'50%'\"  [(ngModel)]=\"editSafetyPlan.victimServiceStatusId\" required>\n                                                <mat-option *ngFor=\" let victimServiceStatu of victimServiceStatus\" [value]=\"victimServiceStatu.victimServiceStatusId\" >{{victimServiceStatu.name}}</mat-option>\n                                        </mat-select>\n                                </div>           \n                        </div>\n                \n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Goal Status Date:<font color=\"red\">*</font></b></div>\n                                <div class='col-md-7'>           \n                                        <input matInput name=\"goalStatusDate\" [matDatepicker]=\"goalStatusDate\" placeholder=\"Choose a date\" [(ngModel)]=\"editSafetyPlan.startDate\"  required>\n                                        <mat-datepicker-toggle matSuffix [for]=\"goalStatusDate\"></mat-datepicker-toggle>\n                                        <mat-datepicker #goalStatusDate></mat-datepicker>                         \n                                </div>           \n                        </div>\n                \n                        <div class='row' >\n                                <div class='col-md-5 desc-label'><b>Comment:</b></div>\n                                <div class='col-md-7'>           \n                                        <textarea mdInput placeholder=\"\"  rows=\"10\" cols=\"50\" name=\"comment\" [(ngModel)]=\"editSafetyPlan.comment\"></textarea>  \n                                </div>           \n                        </div> -->\n\n                      \n                        <div class='row' >\n                                <div class='col-md-12 text-center'>\n                                <!-- <button type=\"button\" class=\"btn btn-default btn-small\" (click)=\"print()\">Print</button> -->\n                                <button mat-raised-button color=\"primary\" (click)=\"saveSafetyPlan()\" [disabled]=\"!spForm.valid\">Save</button>\n                                <!-- &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"commondialogRef.close()\">Cancel</button> -->\n                                &nbsp;&nbsp;<button mat-raised-button color=\"primary\"  (click)=\"back()\">Back</button>\n                                </div>                 \n                        </div> \n\n                        <!--status hisotry-->\n                       \n                         <mat-table #table [dataSource]=\"victimServiceStatusHistoriesDataSource\" class=\"example-table\">\n                                <ng-container matColumnDef=\"startDate\">\n                                    <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Start Date</mat-header-cell>\n                                    <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.startDate | date}} </mat-cell>\n                                </ng-container>\n\n\n                                <ng-container matColumnDef=\"victimServiceStatusId\">\n                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Status</mat-header-cell>\n                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.victimServiceStatusId}} </mat-cell>\n                                </ng-container>\n                                \n                            \n                                <ng-container matColumnDef=\"comment\">\n                                        <mat-header-cell *matHeaderCellDef class=\"example-header-cell\">Comment</mat-header-cell>\n                                        <mat-cell *matCellDef=\"let row\" class=\"example-cell\"> {{row.comment}} </mat-cell>\n                                </ng-container>\n                                 <mat-header-row *matHeaderRowDef=\"[ 'startDate', 'victimServiceStatusId', 'comment']\" class=\"example-header-row\"></mat-header-row>\n                                <mat-row *matRowDef=\"let row; columns:[ 'startDate', 'victimServiceStatusId', 'comment'];\" class=\"example-row\"></mat-row>\n                         </mat-table>\n\n                \n                        \n\n</mat-card-content>\n</mat-card>", styles: ["div.serviceSelect{width:500px}div.serviceButton{width:20%}.container{margin:16px;display:grid;grid-template-columns:repeat(2,1fr);grid-gap:10px;grid-auto-rows:minmax(50px,auto);justify-items:stretch}.app-class .mat-list-item{height:auto}.textarea-content{width:500px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }, { type: NgcSmartVictimService }, { type: i1.HttpClient }, { type: i4.MatSnackBar }, { type: i5.ActivatedRoute }, { type: i5.Router }, { type: CommonDialogService }, { type: i1$2.UntypedFormBuilder }]; } });
+
+const routes = [
+    //{path: 'casenote/:victimId', component: CaseNoteComponent,pathMatch: 'full',canActivate: [MsalGuard],resolve: { loginStaff: LoginStaffResolverService } },
+    { path: 'casenote/:victimId/:offenderId', component: CaseNoteComponent, pathMatch: 'full', canActivate: [MsalGuard], resolve: { loginStaff: LoginStaffResolverService } },
+    { path: 'saftyPlan/:victimId', component: VictimSafetyPlanComponent, pathMatch: 'full', resolve: { loginStaff: LoginStaffResolverService } },
+    { path: 'saftyPlanDetail/:victimServiceId/:victimId', component: VictimSafetyPlanDetailComponent, pathMatch: 'full', resolve: { loginStaff: LoginStaffResolverService } },
+    { path: 'victimList', component: NgcSmartVictimComponent, resolve: { loginStaff: LoginStaffResolverService, selectedOffender: SelectedOffenderResolverService } },
+    { path: 'victimHome', component: NgcSmartVictimComponent, resolve: { loginStaff: LoginStaffResolverService, selectedOffender: SelectedOffenderResolverService } },
+    { path: 'victimContact/:victimId', component: ContactComponent, resolve: { loginStaff: LoginStaffResolverService, selectedOffender: SelectedOffenderResolverService } },
+    { path: 'victimDetail/:victimId', component: SmartVictimDetailComponent, resolve: { loginStaff: LoginStaffResolverService, selectedOffender: SelectedOffenderResolverService } },
+    { path: 'smart-error', component: SmartErrorComponent }
+];
+class VictimRoutingModule {
+}
+/** @nocollapse */ VictimRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ VictimRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: VictimRoutingModule, imports: [i5.RouterModule], exports: [RouterModule] });
+/** @nocollapse */ VictimRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VictimRoutingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        RouterModule.forChild(routes)
+                    ],
+                    exports: [
+                        RouterModule
+                    ]
+                }]
+        }] });
+
+const COMPONENTS = [
+    NgcSmartVictimComponent,
+    SmartVictimDetailComponent,
+    SmartVictimDeleteConfirmComponent,
+];
+const ENTRY_COMPONENTS = [
+    SmartVictimDeleteConfirmComponent,
+];
+const BASE_MODULES = [
+    CommonModule,
+    ReactiveFormsModule
+];
+const CORE_MODULES = [NgcSmartCoreModule, SmartAddressModule, SmartUiModule,];
+const MATERIAL_MODULES = [
+    MatButtonModule, MatCheckboxModule, MatRadioModule, MatSliderModule,
+    MatCardModule, MatSlideToggleModule,
+    MatListModule, MatIconModule, MatButtonToggleModule,
+    MatToolbarModule, MatTabsModule, MatExpansionModule,
+    MatMenuModule, MatInputModule, MatProgressBarModule,
+    MatDatepickerModule, MatNativeDateModule, MatPaginatorModule,
+    MatDialogModule, MatSidenavModule, MatSelectModule,
+    MatTableModule, MatSortModule, MatGridListModule, CdkTableModule, LayoutModule,
+];
+class NgcSmartVictimModule {
+}
+/** @nocollapse */ NgcSmartVictimModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ NgcSmartVictimModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimModule, declarations: [NgcSmartVictimComponent,
+        SmartVictimDetailComponent,
+        SmartVictimDeleteConfirmComponent, CaseNoteComponent,
+        ContactComponent,
+        VictimSafetyPlanComponent,
+        VictimSafetyPlanDetailComponent,
+        VictimSearchFormComponent,
+        SeriveProviderComponent], imports: [CommonModule,
+        ReactiveFormsModule, MatButtonModule, MatCheckboxModule, MatRadioModule, MatSliderModule,
+        MatCardModule, MatSlideToggleModule,
+        MatListModule, MatIconModule, MatButtonToggleModule,
+        MatToolbarModule, MatTabsModule, MatExpansionModule,
+        MatMenuModule, MatInputModule, MatProgressBarModule,
+        MatDatepickerModule, MatNativeDateModule, MatPaginatorModule,
+        MatDialogModule, MatSidenavModule, MatSelectModule,
+        MatTableModule, MatSortModule, MatGridListModule, CdkTableModule, LayoutModule, NgcSmartCoreModule, SmartAddressModule, SmartUiModule, CommonDialogModule,
+        FormsModule,
+        VictimRoutingModule,
+        ApolloModule], exports: [NgcSmartVictimComponent,
+        SmartVictimDetailComponent,
+        SmartVictimDeleteConfirmComponent, ApolloModule] });
+/** @nocollapse */ NgcSmartVictimModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimModule, providers: [NgcSmartVictimService], imports: [BASE_MODULES, MATERIAL_MODULES, CORE_MODULES, CommonDialogModule,
+        FormsModule,
+        VictimRoutingModule,
+        ApolloModule, ApolloModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgcSmartVictimModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [...COMPONENTS,
+                        CaseNoteComponent,
+                        ContactComponent,
+                        VictimSafetyPlanComponent,
+                        VictimSafetyPlanDetailComponent,
+                        VictimSearchFormComponent,
+                        SeriveProviderComponent
+                    ],
+                    imports: [
+                        ...BASE_MODULES,
+                        ...MATERIAL_MODULES,
+                        ...CORE_MODULES,
+                        CommonDialogModule,
+                        FormsModule,
+                        VictimRoutingModule,
+                        ApolloModule,
+                        //SharedModule
+                    ],
+                    exports: [...COMPONENTS, ApolloModule],
+                    providers: [NgcSmartVictimService]
+                }]
+        }] });
+
+/*
+ * Public API Surface of ngc-smart-victim
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CaseNoteComponent, NgcSmartVictimComponent, NgcSmartVictimModule, NgcSmartVictimService, SMART_LOOKUP_SERVICE_URL, SMART_OFFENDER_SERVICE_URL, SMART_VICTIM_SERVICE_URL, SMART_WARRANT_URL, SmartVictimDeleteConfirmComponent, SmartVictimDetailComponent, Victim, VictimAdvocate, VictimDrugUse, VictimGuardian, VictimListFilter$1 as VictimListFilter, VictimSupport, VictimWeaponUse, conditionalValidator, stringConditionalValidator };
+//# sourceMappingURL=csmart-ngc-smart-victim.mjs.map