From e9bec2dc8f86fe9b9d3a7018542e54453a202e68 Mon Sep 17 00:00:00 2001
From: John Cardinal <support@ayanova.com>
Date: Mon, 16 Nov 2020 19:24:23 +0000
Subject: [PATCH]

---
 ayanova/devdocs/todo.txt            |    9 +-
 ayanova/src/views/cust-customer.vue | 1184 ++++++++++++++-------------
 ayanova/src/views/ops-metrics.vue   |    2 +-
 3 files changed, 612 insertions(+), 583 deletions(-)

diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt
index b0bca94c..a8b99ed2 100644
--- a/ayanova/devdocs/todo.txt
+++ b/ayanova/devdocs/todo.txt
@@ -28,10 +28,12 @@ dotnet-runtime-deps-3.1/xenial,now 3.1.10-1 amd64 [installed,automatic]
 dotnet-runtime-deps-5.0/xenial,now 5.0.0-1 amd64 [installed,automatic]
 
 To REMOVE: apt-get remove dotnet-runtime-3.0 (replace 3.0 with whatever version it is)
-
-
 	https://docs.microsoft.com/en-us/dotnet/core/install/remove-runtime-sdk-versions?pivots=os-linux
 
+
+
+
+
 todo: SEEDER
 	Seed sample customers from v7 specifically in addition to random ones?
 
@@ -66,8 +68,7 @@ todo: TESTING After customer form is made
 		Test setting coords from phone
 	
 
-OUTSTANDING WITH CUSTOMER
-	servicetemplate, headoffice, banking, contract fields
+OUTSTANDING WITH CUSTOMER	
 	contacts
 	Customer User (contacts) UI for this client (generate, view)
 		case for this and notes, sb very simple way to create and send creds for user
diff --git a/ayanova/src/views/cust-customer.vue b/ayanova/src/views/cust-customer.vue
index 69c75360..f2b47b5c 100644
--- a/ayanova/src/views/cust-customer.vue
+++ b/ayanova/src/views/cust-customer.vue
@@ -2,616 +2,641 @@
   <v-container fluid>
     <gz-report-selector ref="reportSelector"></gz-report-selector>
     <!-- {{ formState }} -->
-    <v-row v-if="formState.ready">
-      <v-col>
-        <v-form ref="form">
-          <v-row>
-            <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
-            <v-col cols="12" sm="6" lg="4" xl="3">
-              <v-text-field
-                v-model="obj.name"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerName')"
-                :rules="[form().required(this, 'name')]"
-                :error-messages="form().serverErrors(this, 'name')"
-                ref="name"
-                data-cy="name"
-                @input="fieldValueChanged('name')"
-              ></v-text-field>
-            </v-col>
+    <div v-if="formState.ready">
+      <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
 
-            <v-col
-              v-if="form().showMe(this, 'Active')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-checkbox
-                v-model="obj.active"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('Active')"
-                ref="active"
-                data-cy="active"
-                :error-messages="form().serverErrors(this, 'active')"
-                @change="fieldValueChanged('active')"
-              ></v-checkbox>
-            </v-col>
+      <v-form ref="form">
+        <v-tabs mobile-breakpoint="100" v-model="tab">
+          <v-tab>{{ $ay.t("Customer") }}</v-tab>
+          <v-tab>{{ $ay.t("Address") }}</v-tab>
+          <v-tab>{{ $ay.t("Contacts") }}</v-tab>
 
-            <v-col
-              v-if="form().showMe(this, 'AccountNumber')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.accountNumber"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerAccountNumber')"
-                ref="accountNumber"
-                data-cy="accountNumber"
-                :error-messages="form().serverErrors(this, 'accountNumber')"
-                @input="fieldValueChanged('accountNumber')"
-              ></v-text-field>
-            </v-col>
+          <v-tabs-items v-model="tab">
+            <v-tab-item class="mt-4">
+              <v-row>
+                <v-col cols="12" sm="6" lg="4" xl="3">
+                  <v-text-field
+                    v-model="obj.name"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerName')"
+                    :rules="[form().required(this, 'name')]"
+                    :error-messages="form().serverErrors(this, 'name')"
+                    ref="name"
+                    data-cy="name"
+                    @input="fieldValueChanged('name')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'EmailAddress')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.emailAddress"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerEmail')"
-                ref="emailAddress"
-                data-cy="emailAddress"
-                type="email"
-                :error-messages="form().serverErrors(this, 'emailAddress')"
-                @input="fieldValueChanged('emailAddress')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Active')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-checkbox
+                    v-model="obj.active"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('Active')"
+                    ref="active"
+                    data-cy="active"
+                    :error-messages="form().serverErrors(this, 'active')"
+                    @change="fieldValueChanged('active')"
+                  ></v-checkbox>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Phone1')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.phone1"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPhone1')"
-                ref="phone1"
-                data-cy="phone1"
-                type="tel"
-                :error-messages="form().serverErrors(this, 'phone1')"
-                @input="fieldValueChanged('phone1')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'AccountNumber')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.accountNumber"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerAccountNumber')"
+                    ref="accountNumber"
+                    data-cy="accountNumber"
+                    :error-messages="form().serverErrors(this, 'accountNumber')"
+                    @input="fieldValueChanged('accountNumber')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Phone2')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.phone2"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPhone2')"
-                ref="phone2"
-                data-cy="phone2"
-                type="tel"
-                :error-messages="form().serverErrors(this, 'phone2')"
-                @input="fieldValueChanged('phone2')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'EmailAddress')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.emailAddress"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerEmail')"
+                    ref="emailAddress"
+                    data-cy="emailAddress"
+                    type="email"
+                    :error-messages="form().serverErrors(this, 'emailAddress')"
+                    @input="fieldValueChanged('emailAddress')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Phone3')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.phone3"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPhone3')"
-                ref="phone3"
-                data-cy="phone3"
-                type="tel"
-                :error-messages="form().serverErrors(this, 'phone3')"
-                @input="fieldValueChanged('phone3')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Phone1')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.phone1"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPhone1')"
+                    ref="phone1"
+                    data-cy="phone1"
+                    type="tel"
+                    :error-messages="form().serverErrors(this, 'phone1')"
+                    @input="fieldValueChanged('phone1')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Phone4')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.phone4"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPhone4')"
-                ref="phone4"
-                data-cy="phone4"
-                type="tel"
-                :error-messages="form().serverErrors(this, 'phone4')"
-                @input="fieldValueChanged('phone4')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Phone2')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.phone2"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPhone2')"
+                    ref="phone2"
+                    data-cy="phone2"
+                    type="tel"
+                    :error-messages="form().serverErrors(this, 'phone2')"
+                    @input="fieldValueChanged('phone2')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Phone5')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.phone5"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPhone5')"
-                ref="phone5"
-                data-cy="phone5"
-                type="tel"
-                :error-messages="form().serverErrors(this, 'phone5')"
-                @input="fieldValueChanged('phone5')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Phone3')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.phone3"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPhone3')"
+                    ref="phone3"
+                    data-cy="phone3"
+                    type="tel"
+                    :error-messages="form().serverErrors(this, 'phone3')"
+                    @input="fieldValueChanged('phone3')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Address')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.address"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressDeliveryAddress')"
-                ref="address"
-                data-cy="address"
-                :error-messages="form().serverErrors(this, 'address')"
-                @input="fieldValueChanged('address')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Phone4')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.phone4"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPhone4')"
+                    ref="phone4"
+                    data-cy="phone4"
+                    type="tel"
+                    :error-messages="form().serverErrors(this, 'phone4')"
+                    @input="fieldValueChanged('phone4')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'City')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.city"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressCity')"
-                ref="city"
-                data-cy="city"
-                :error-messages="form().serverErrors(this, 'city')"
-                @input="fieldValueChanged('city')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Phone5')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.phone5"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPhone5')"
+                    ref="phone5"
+                    data-cy="phone5"
+                    type="tel"
+                    :error-messages="form().serverErrors(this, 'phone5')"
+                    @input="fieldValueChanged('phone5')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Region')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.region"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressStateProv')"
-                ref="region"
-                data-cy="region"
-                :error-messages="form().serverErrors(this, 'region')"
-                @input="fieldValueChanged('region')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'DefaultServiceTemplateID')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-pick-list
+                    :ayaType="ayaTypes().WorkOrderTemplate"
+                    :showEditIcon="true"
+                    v-model="obj.defaultServiceTemplateID"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('WorkOrderTemplate')"
+                    ref="defaultServiceTemplateID"
+                    data-cy="defaultServiceTemplateID"
+                    :error-messages="
+                      form().serverErrors(this, 'defaultServiceTemplateID')
+                    "
+                    @input="fieldValueChanged('defaultServiceTemplateID')"
+                  ></gz-pick-list>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Country')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.country"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressCountry')"
-                ref="country"
-                data-cy="country"
-                :error-messages="form().serverErrors(this, 'country')"
-                @input="fieldValueChanged('country')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'BillHeadOffice')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-checkbox
+                    v-model="obj.billHeadOffice"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerBillHeadOffice')"
+                    ref="billHeadOffice"
+                    data-cy="billHeadOffice"
+                    :error-messages="
+                      form().serverErrors(this, 'billHeadOffice')
+                    "
+                    @change="fieldValueChanged('billHeadOffice')"
+                  ></v-checkbox>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Latitude')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-decimal
-                v-model="obj.latitude"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressLatitude')"
-                ref="latitude"
-                data-cy="latitude"
-                :rules="[form().decimalValid(this, 'latitude')]"
-                :error-messages="form().serverErrors(this, 'latitude')"
-                @input="fieldValueChanged('latitude')"
-                :precision="6"
-              ></gz-decimal>
-            </v-col>
+                <v-col
+                  v-if="
+                    form().showMe(this, 'HeadOfficeID') && obj.billHeadOffice
+                  "
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-pick-list
+                    :ayaType="ayaTypes().HeadOffice"
+                    :showEditIcon="true"
+                    v-model="obj.headOfficeID"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('HeadOffice')"
+                    ref="headOfficeID"
+                    data-cy="headOfficeID"
+                    :error-messages="form().serverErrors(this, 'headOfficeID')"
+                    @input="fieldValueChanged('headOfficeID')"
+                  ></gz-pick-list>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Longitude')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-decimal
-                v-model="obj.longitude"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressLongitude')"
-                ref="longitude"
-                data-cy="longitude"
-                :rules="[form().decimalValid(this, 'longitude')]"
-                :error-messages="form().serverErrors(this, 'longitude')"
-                @input="fieldValueChanged('longitude')"
-                :precision="6"
-              ></gz-decimal>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'ContractID')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-pick-list
+                    :ayaType="ayaTypes().Contract"
+                    :showEditIcon="true"
+                    v-model="obj.contractID"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('Contract')"
+                    ref="contractID"
+                    data-cy="contractID"
+                    :error-messages="form().serverErrors(this, 'contractID')"
+                    @input="fieldValueChanged('contractID')"
+                  ></gz-pick-list>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'PostAddress')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.postAddress"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressPostalDeliveryAddress')"
-                ref="postAddress"
-                data-cy="postAddress"
-                :error-messages="form().serverErrors(this, 'postAddress')"
-                @input="fieldValueChanged('postAddress')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="
+                    form().showMe(this, 'ContractExpires') && obj.contractId
+                  "
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-date-time-picker
+                    :label="$ay.t('ContractExpires')"
+                    v-model="obj.contractExpires"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    ref="contractExpires"
+                    testId="contractExpires"
+                    :error-messages="
+                      form().serverErrors(this, 'contractExpires')
+                    "
+                    @input="fieldValueChanged('contractExpires')"
+                  ></gz-date-time-picker>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'PostCity')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.postCity"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressPostalCity')"
-                ref="postCity"
-                data-cy="postCity"
-                :error-messages="form().serverErrors(this, 'postCity')"
-                @input="fieldValueChanged('postCity')"
-              ></v-text-field>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'UsesBanking')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-checkbox
+                    v-model="obj.usesBanking"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('UsesBanking')"
+                    ref="usesBanking"
+                    data-cy="usesBanking"
+                    :error-messages="form().serverErrors(this, 'usesBanking')"
+                    @change="fieldValueChanged('usesBanking')"
+                  ></v-checkbox>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'PostRegion')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.postRegion"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressPostalStateProv')"
-                ref="postRegion"
-                data-cy="postRegion"
-                :error-messages="form().serverErrors(this, 'postRegion')"
-                @input="fieldValueChanged('postRegion')"
-              ></v-text-field>
-            </v-col>
+                <!-- --------------------------------- -->
+                <v-col v-if="form().showMe(this, 'Notes')" cols="12">
+                  <v-textarea
+                    v-model="obj.notes"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerNotes')"
+                    :error-messages="form().serverErrors(this, 'notes')"
+                    ref="notes"
+                    data-cy="notes"
+                    @input="fieldValueChanged('notes')"
+                    auto-grow
+                  ></v-textarea>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'PostCountry')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.postCountry"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressPostalCountry')"
-                ref="postCountry"
-                data-cy="postCountry"
-                :error-messages="form().serverErrors(this, 'postCountry')"
-                @input="fieldValueChanged('postCountry')"
-              ></v-text-field>
-            </v-col>
+                <v-col v-if="form().showMe(this, 'TechNotes')" cols="12">
+                  <v-textarea
+                    v-model="obj.techNotes"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerTechNotes')"
+                    :error-messages="form().serverErrors(this, 'techNotes')"
+                    ref="techNotes"
+                    data-cy="techNotes"
+                    @input="fieldValueChanged('techNotes')"
+                    auto-grow
+                    prepend-icon="$ayiTools"
+                  ></v-textarea>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'PostCode')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-text-field
-                v-model="obj.postCode"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('AddressPostalPostal')"
-                ref="postCode"
-                data-cy="postCode"
-                :error-messages="form().serverErrors(this, 'postCode')"
-                @input="fieldValueChanged('postCode')"
-              ></v-text-field>
-            </v-col>
+                <v-col v-if="form().showMe(this, 'PopUpNotes')" cols="12">
+                  <v-textarea
+                    v-model="obj.popUpNotes"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('CustomerPopUpNotes')"
+                    :error-messages="form().serverErrors(this, 'popUpNotes')"
+                    ref="popUpNotes"
+                    data-cy="popUpNotes"
+                    @input="fieldValueChanged('popUpNotes')"
+                    auto-grow
+                    prepend-icon="$ayiExclamationCircle"
+                  ></v-textarea>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'DefaultServiceTemplateID')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-pick-list
-                :ayaType="ayaTypes().WorkOrderTemplate"
-                :showEditIcon="true"
-                v-model="obj.defaultServiceTemplateID"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('WorkOrderTemplate')"
-                ref="defaultServiceTemplateID"
-                data-cy="defaultServiceTemplateID"
-                :error-messages="
-                  form().serverErrors(this, 'defaultServiceTemplateID')
-                "
-                @input="fieldValueChanged('defaultServiceTemplateID')"
-              ></gz-pick-list>
-            </v-col>
+                <v-col v-if="form().showMe(this, 'Tags')" cols="12">
+                  <gz-tag-picker
+                    v-model="obj.tags"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    ref="tags"
+                    data-cy="tags"
+                    :error-messages="form().serverErrors(this, 'tags')"
+                    @input="fieldValueChanged('tags')"
+                  ></gz-tag-picker>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'BillHeadOffice')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-checkbox
-                v-model="obj.billHeadOffice"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerBillHeadOffice')"
-                ref="billHeadOffice"
-                data-cy="billHeadOffice"
-                :error-messages="form().serverErrors(this, 'billHeadOffice')"
-                @change="fieldValueChanged('billHeadOffice')"
-              ></v-checkbox>
-            </v-col>
+                <v-col cols="12">
+                  <gz-custom-fields
+                    v-model="obj.customFields"
+                    :formKey="formCustomTemplateKey"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :parentVM="this"
+                    ref="customFields"
+                    data-cy="customFields"
+                    :error-messages="form().serverErrors(this, 'customFields')"
+                    @input="fieldValueChanged('customFields')"
+                  ></gz-custom-fields>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'HeadOfficeID')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-pick-list
-                :ayaType="ayaTypes().HeadOffice"
-                :showEditIcon="true"
-                v-model="obj.headOfficeID"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('HeadOffice')"
-                ref="headOfficeID"
-                data-cy="headOfficeID"
-                :error-messages="form().serverErrors(this, 'headOfficeID')"
-                @input="fieldValueChanged('headOfficeID')"
-              ></gz-pick-list>
-            </v-col>
+                <v-col v-if="form().showMe(this, 'Wiki')" cols="12">
+                  <gz-wiki
+                    :ayaType="ayaType"
+                    :ayaId="obj.id"
+                    ref="wiki"
+                    v-model="obj.wiki"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    @input="fieldValueChanged('wiki')"
+                  ></gz-wiki
+                ></v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'ContractID')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-pick-list
-                :ayaType="ayaTypes().Contract"
-                :showEditIcon="true"
-                v-model="obj.contractID"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('Contract')"
-                ref="contractID"
-                data-cy="contractID"
-                :error-messages="form().serverErrors(this, 'contractID')"
-                @input="fieldValueChanged('contractID')"
-              ></gz-pick-list>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Attachments') && obj.id"
+                  cols="12"
+                >
+                  <gz-attachments
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :ayaType="ayaType"
+                    :ayaId="obj.id"
+                  ></gz-attachments
+                ></v-col>
+              </v-row>
+            </v-tab-item>
+            <v-tab-item>
+              <v-row>
+                <v-col
+                  v-if="form().showMe(this, 'Address')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.address"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressDeliveryAddress')"
+                    ref="address"
+                    data-cy="address"
+                    :error-messages="form().serverErrors(this, 'address')"
+                    @input="fieldValueChanged('address')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'ContractExpires')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <gz-date-time-picker
-                :label="$ay.t('ContractExpires')"
-                v-model="obj.contractExpires"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                ref="contractExpires"
-                testId="contractExpires"
-                :error-messages="form().serverErrors(this, 'contractExpires')"
-                @input="fieldValueChanged('contractExpires')"
-              ></gz-date-time-picker>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'City')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.city"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressCity')"
+                    ref="city"
+                    data-cy="city"
+                    :error-messages="form().serverErrors(this, 'city')"
+                    @input="fieldValueChanged('city')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'UsesBanking')"
-              cols="12"
-              sm="6"
-              lg="4"
-              xl="3"
-            >
-              <v-checkbox
-                v-model="obj.usesBanking"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('UsesBanking')"
-                ref="usesBanking"
-                data-cy="usesBanking"
-                :error-messages="form().serverErrors(this, 'usesBanking')"
-                @change="fieldValueChanged('usesBanking')"
-              ></v-checkbox>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Region')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.region"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressStateProv')"
+                    ref="region"
+                    data-cy="region"
+                    :error-messages="form().serverErrors(this, 'region')"
+                    @input="fieldValueChanged('region')"
+                  ></v-text-field>
+                </v-col>
 
-            <!-- --------------------------------- -->
-            <v-col v-if="form().showMe(this, 'Notes')" cols="12">
-              <v-textarea
-                v-model="obj.notes"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerNotes')"
-                :error-messages="form().serverErrors(this, 'notes')"
-                ref="notes"
-                data-cy="notes"
-                @input="fieldValueChanged('notes')"
-                auto-grow
-              ></v-textarea>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Country')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.country"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressCountry')"
+                    ref="country"
+                    data-cy="country"
+                    :error-messages="form().serverErrors(this, 'country')"
+                    @input="fieldValueChanged('country')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col v-if="form().showMe(this, 'TechNotes')" cols="12">
-              <v-textarea
-                v-model="obj.techNotes"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerTechNotes')"
-                :error-messages="form().serverErrors(this, 'techNotes')"
-                ref="techNotes"
-                data-cy="techNotes"
-                @input="fieldValueChanged('techNotes')"
-                auto-grow
-                prepend-icon="$ayiTools"
-              ></v-textarea>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Latitude')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-decimal
+                    v-model="obj.latitude"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressLatitude')"
+                    ref="latitude"
+                    data-cy="latitude"
+                    :rules="[form().decimalValid(this, 'latitude')]"
+                    :error-messages="form().serverErrors(this, 'latitude')"
+                    @input="fieldValueChanged('latitude')"
+                    :precision="6"
+                  ></gz-decimal>
+                </v-col>
 
-            <v-col v-if="form().showMe(this, 'PopUpNotes')" cols="12">
-              <v-textarea
-                v-model="obj.popUpNotes"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :label="$ay.t('CustomerPopUpNotes')"
-                :error-messages="form().serverErrors(this, 'popUpNotes')"
-                ref="popUpNotes"
-                data-cy="popUpNotes"
-                @input="fieldValueChanged('popUpNotes')"
-                auto-grow
-                prepend-icon="$ayiExclamationCircle"
-              ></v-textarea>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'Longitude')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <gz-decimal
+                    v-model="obj.longitude"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressLongitude')"
+                    ref="longitude"
+                    data-cy="longitude"
+                    :rules="[form().decimalValid(this, 'longitude')]"
+                    :error-messages="form().serverErrors(this, 'longitude')"
+                    @input="fieldValueChanged('longitude')"
+                    :precision="6"
+                  ></gz-decimal>
+                </v-col>
 
-            <v-col v-if="form().showMe(this, 'Tags')" cols="12">
-              <gz-tag-picker
-                v-model="obj.tags"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                ref="tags"
-                data-cy="tags"
-                :error-messages="form().serverErrors(this, 'tags')"
-                @input="fieldValueChanged('tags')"
-              ></gz-tag-picker>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'PostAddress')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.postAddress"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressPostalDeliveryAddress')"
+                    ref="postAddress"
+                    data-cy="postAddress"
+                    :error-messages="form().serverErrors(this, 'postAddress')"
+                    @input="fieldValueChanged('postAddress')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col cols="12">
-              <gz-custom-fields
-                v-model="obj.customFields"
-                :formKey="formCustomTemplateKey"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :parentVM="this"
-                ref="customFields"
-                data-cy="customFields"
-                :error-messages="form().serverErrors(this, 'customFields')"
-                @input="fieldValueChanged('customFields')"
-              ></gz-custom-fields>
-            </v-col>
+                <v-col
+                  v-if="form().showMe(this, 'PostCity')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.postCity"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressPostalCity')"
+                    ref="postCity"
+                    data-cy="postCity"
+                    :error-messages="form().serverErrors(this, 'postCity')"
+                    @input="fieldValueChanged('postCity')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col v-if="form().showMe(this, 'Wiki')" cols="12">
-              <gz-wiki
-                :ayaType="ayaType"
-                :ayaId="obj.id"
-                ref="wiki"
-                v-model="obj.wiki"
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                @input="fieldValueChanged('wiki')"
-              ></gz-wiki
-            ></v-col>
+                <v-col
+                  v-if="form().showMe(this, 'PostRegion')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.postRegion"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressPostalStateProv')"
+                    ref="postRegion"
+                    data-cy="postRegion"
+                    :error-messages="form().serverErrors(this, 'postRegion')"
+                    @input="fieldValueChanged('postRegion')"
+                  ></v-text-field>
+                </v-col>
 
-            <v-col
-              v-if="form().showMe(this, 'Attachments') && obj.id"
-              cols="12"
-            >
-              <gz-attachments
-                :readonly="formState.readOnly"
-                :disabled="formState.readOnly"
-                :ayaType="ayaType"
-                :ayaId="obj.id"
-              ></gz-attachments
-            ></v-col>
-          </v-row>
-        </v-form>
-      </v-col>
-    </v-row>
+                <v-col
+                  v-if="form().showMe(this, 'PostCountry')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.postCountry"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressPostalCountry')"
+                    ref="postCountry"
+                    data-cy="postCountry"
+                    :error-messages="form().serverErrors(this, 'postCountry')"
+                    @input="fieldValueChanged('postCountry')"
+                  ></v-text-field>
+                </v-col>
+
+                <v-col
+                  v-if="form().showMe(this, 'PostCode')"
+                  cols="12"
+                  sm="6"
+                  lg="4"
+                  xl="3"
+                >
+                  <v-text-field
+                    v-model="obj.postCode"
+                    :readonly="formState.readOnly"
+                    :disabled="formState.readOnly"
+                    :label="$ay.t('AddressPostalPostal')"
+                    ref="postCode"
+                    data-cy="postCode"
+                    :error-messages="form().serverErrors(this, 'postCode')"
+                    @input="fieldValueChanged('postCode')"
+                  ></v-text-field>
+                </v-col>
+              </v-row>
+            </v-tab-item>
+            <v-tab-item>
+              <v-row>
+                CONTACTS HERE
+              </v-row>
+            </v-tab-item>
+          </v-tabs-items>
+        </v-tabs>
+      </v-form>
+    </div>
     <template v-if="!formState.ready">
       <v-progress-circular
         indeterminate
@@ -736,6 +761,7 @@ export default {
           latitude: null,
           longitude: null
         },
+      tab: 0,
       formState: {
         ready: false,
         dirty: false,
@@ -1189,6 +1215,7 @@ async function initForm(vm) {
 async function fetchTranslatedText(vm) {
   await window.$gz.translation.cacheTranslations([
     "Customer",
+    "Contacts",
     "CustomerName",
     "CustomerNotes",
     "WebAddress",
@@ -1207,6 +1234,7 @@ async function fetchTranslatedText(vm) {
     "CustomerPhone4",
     "CustomerPhone5",
     "CustomerEmail",
+    "Address",
     "AddressPostalDeliveryAddress",
     "AddressPostalCity",
     "AddressPostalStateProv",
diff --git a/ayanova/src/views/ops-metrics.vue b/ayanova/src/views/ops-metrics.vue
index 0203b4e7..1fe2e177 100644
--- a/ayanova/src/views/ops-metrics.vue
+++ b/ayanova/src/views/ops-metrics.vue
@@ -14,7 +14,7 @@
       ></v-select>
     </v-col>
 
-    <v-tabs v-model="tab" color="primary" grow @change="tabChanged">
+    <v-tabs v-model="tab" @change="tabChanged">
       <v-tabs-slider></v-tabs-slider>
       <v-tab>{{ $ay.t("MetricCPUMemory") }}</v-tab>
       <v-tab>{{ $ay.t("Database") }}</v-tab>