From 893768912be719edd42dd1c4aaa99ea7c224f557 Mon Sep 17 00:00:00 2001
From: John Cardinal <support@ayanova.com>
Date: Thu, 5 Aug 2021 19:12:23 +0000
Subject: [PATCH] save overlay

---
 ayanova/devdocs/todo.txt                              | 10 ++++++----
 ayanova/src/views/acc-service-bank.vue                | 10 +++-------
 ayanova/src/views/acc-service-rate.vue                | 10 +++-------
 ayanova/src/views/acc-tax-code.vue                    | 10 +++-------
 ayanova/src/views/acc-travel-rate.vue                 | 10 +++-------
 ayanova/src/views/adm-global-settings.vue             | 10 +++-------
 ayanova/src/views/adm-translation.vue                 | 10 +++-------
 ayanova/src/views/adm-user.vue                        | 10 +++-------
 ayanova/src/views/ay-report-edit.vue                  |  6 +++++-
 ayanova/src/views/cust-customer-note.vue              | 11 +++--------
 ayanova/src/views/cust-customer.vue                   | 10 +++-------
 ayanova/src/views/cust-head-office.vue                | 10 +++-------
 ayanova/src/views/cust-user.vue                       | 10 +++-------
 ayanova/src/views/customer-csr-edit.vue               | 10 +++-------
 ayanova/src/views/customer-workorder.vue              | 10 +++-------
 ayanova/src/views/home-memo.vue                       | 10 +++-------
 ayanova/src/views/home-notify-subscription.vue        | 10 +++-------
 ayanova/src/views/home-reminder.vue                   | 10 +++-------
 ayanova/src/views/home-review.vue                     | 10 +++-------
 ayanova/src/views/inv-part-adjustment.vue             | 10 +++-------
 ayanova/src/views/inv-part-assembly.vue               | 10 +++-------
 ayanova/src/views/inv-part-serials.vue                | 10 +++-------
 ayanova/src/views/inv-part-stock-levels.vue           | 10 +++-------
 ayanova/src/views/inv-part-warehouse.vue              | 10 +++-------
 ayanova/src/views/inv-part.vue                        | 10 +++-------
 ayanova/src/views/inv-purchase-order.vue              | 10 +++-------
 ayanova/src/views/svc-contract.vue                    | 10 +++-------
 ayanova/src/views/svc-csr.vue                         | 10 +++-------
 ayanova/src/views/svc-loaner.vue                      | 10 +++-------
 ayanova/src/views/svc-pm.vue                          | 10 +++-------
 ayanova/src/views/svc-project.vue                     | 10 +++-------
 ayanova/src/views/svc-quote-status-edit.vue           | 10 +++-------
 ayanova/src/views/svc-quote.vue                       | 10 +++-------
 ayanova/src/views/svc-task-group.vue                  | 10 +++-------
 ayanova/src/views/svc-unit-model.vue                  | 10 +++-------
 ayanova/src/views/svc-unit.vue                        | 10 +++-------
 .../src/views/svc-work-order-item-priorities-edit.vue | 10 +++-------
 ayanova/src/views/svc-work-order-item-status-edit.vue | 10 +++-------
 ayanova/src/views/svc-work-order-status-edit.vue      | 10 +++-------
 ayanova/src/views/svc-workorder.vue                   | 11 ++++-------
 ayanova/src/views/vendor.vue                          | 10 +++-------
 ayanova/src/views/widget.vue                          | 10 +++-------
 42 files changed, 132 insertions(+), 286 deletions(-)

diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt
index 03a2d174..2b3eb3ee 100644
--- a/ayanova/devdocs/todo.txt
+++ b/ayanova/devdocs/todo.txt
@@ -513,9 +513,6 @@ CURRENTLY DOING:
 
 todo MISC: 
 	
-	CLIENT generate new wo then go back goes to zero id new but then is stuck with error can't go back further due to broken rule
-		shouldn't it skip this one like the others do??
-		shouldn't it not prompt if it's a not filled in new wo anyway??
 	during Save of workorder it should not be available for entry as it can take some time to process and user could fuck off in the middle of it
 		maybe a "Saving..." toast / popup and overlay to prevent fuckery??
 	Duplicate to self menu option in pm/wo/quote should prompt for attachments and wiki just like it does for the other types
@@ -856,4 +853,9 @@ BUILD CHANGES OF NOTE
 
 BUILD 118
 
-- Implemented all Child->grandchild data tables for quotes and pm's like workorders
\ No newline at end of file
+- Implemented all Child->grandchild data tables for quotes and pm's like workorders
+- Loading / Saving overlay fully implemented for all forms
+	this prevents users from clicking around while a save is happening 
+		workorders with a lot of changes take time to walk the tree and save each item which spurred this change mostly
+	clearly denotes that something is happening that they need to wait for
+	
\ No newline at end of file
diff --git a/ayanova/src/views/acc-service-bank.vue b/ayanova/src/views/acc-service-bank.vue
index c3f48620..a73ae0b7 100644
--- a/ayanova/src/views/acc-service-bank.vue
+++ b/ayanova/src/views/acc-service-bank.vue
@@ -91,13 +91,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/acc-service-rate.vue b/ayanova/src/views/acc-service-rate.vue
index 0caff220..b3820bfa 100644
--- a/ayanova/src/views/acc-service-rate.vue
+++ b/ayanova/src/views/acc-service-rate.vue
@@ -187,13 +187,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/acc-tax-code.vue b/ayanova/src/views/acc-tax-code.vue
index d852aba6..c83dce4d 100644
--- a/ayanova/src/views/acc-tax-code.vue
+++ b/ayanova/src/views/acc-tax-code.vue
@@ -149,13 +149,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/acc-travel-rate.vue b/ayanova/src/views/acc-travel-rate.vue
index 78a6add5..a83a9f0b 100644
--- a/ayanova/src/views/acc-travel-rate.vue
+++ b/ayanova/src/views/acc-travel-rate.vue
@@ -185,13 +185,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/adm-global-settings.vue b/ayanova/src/views/adm-global-settings.vue
index 65e5ed3d..3154469a 100644
--- a/ayanova/src/views/adm-global-settings.vue
+++ b/ayanova/src/views/adm-global-settings.vue
@@ -679,13 +679,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/adm-translation.vue b/ayanova/src/views/adm-translation.vue
index 2643090e..63f82417 100644
--- a/ayanova/src/views/adm-translation.vue
+++ b/ayanova/src/views/adm-translation.vue
@@ -131,13 +131,9 @@
         </v-form>
       </v-col>
     </v-row>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/adm-user.vue b/ayanova/src/views/adm-user.vue
index f560205a..7f878bac 100644
--- a/ayanova/src/views/adm-user.vue
+++ b/ayanova/src/views/adm-user.vue
@@ -403,13 +403,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/ay-report-edit.vue b/ayanova/src/views/ay-report-edit.vue
index 1e82ec14..0dc9ce43 100644
--- a/ayanova/src/views/ay-report-edit.vue
+++ b/ayanova/src/views/ay-report-edit.vue
@@ -1,8 +1,12 @@
 <template>
   <div v-resize="onResize">
-    <v-overlay :value="rendering" z-index="999">
+    <v-overlay
+      :value="rendering || !formState.ready || formState.loading"
+      z-index="999"
+    >
       <v-progress-circular indeterminate size="64"></v-progress-circular>
     </v-overlay>
+
     <!-- {{ formState }} -->
     <v-row v-show="formState.ready">
       <gz-error :error-box-message="formState.errorBoxMessage"></gz-error>
diff --git a/ayanova/src/views/cust-customer-note.vue b/ayanova/src/views/cust-customer-note.vue
index b737a73b..6d4a81ab 100644
--- a/ayanova/src/views/cust-customer-note.vue
+++ b/ayanova/src/views/cust-customer-note.vue
@@ -55,14 +55,9 @@
         </v-col>
       </v-row>
     </v-form>
-
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/cust-customer.vue b/ayanova/src/views/cust-customer.vue
index 5693876e..c68a5755 100644
--- a/ayanova/src/views/cust-customer.vue
+++ b/ayanova/src/views/cust-customer.vue
@@ -734,13 +734,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/cust-head-office.vue b/ayanova/src/views/cust-head-office.vue
index 81cf8fc8..ccead1e9 100644
--- a/ayanova/src/views/cust-head-office.vue
+++ b/ayanova/src/views/cust-head-office.vue
@@ -643,13 +643,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/cust-user.vue b/ayanova/src/views/cust-user.vue
index e8b65b57..153ab966 100644
--- a/ayanova/src/views/cust-user.vue
+++ b/ayanova/src/views/cust-user.vue
@@ -388,13 +388,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/customer-csr-edit.vue b/ayanova/src/views/customer-csr-edit.vue
index 31e8185d..2d4ec798 100644
--- a/ayanova/src/views/customer-csr-edit.vue
+++ b/ayanova/src/views/customer-csr-edit.vue
@@ -243,13 +243,9 @@
         </v-dialog>
       </v-row>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/customer-workorder.vue b/ayanova/src/views/customer-workorder.vue
index 21ca07fd..87abf056 100644
--- a/ayanova/src/views/customer-workorder.vue
+++ b/ayanova/src/views/customer-workorder.vue
@@ -14,13 +14,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/home-memo.vue b/ayanova/src/views/home-memo.vue
index 2cbfc44e..50a0f345 100644
--- a/ayanova/src/views/home-memo.vue
+++ b/ayanova/src/views/home-memo.vue
@@ -153,13 +153,9 @@
         </template>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/home-notify-subscription.vue b/ayanova/src/views/home-notify-subscription.vue
index 84d33e30..2c8b3835 100644
--- a/ayanova/src/views/home-notify-subscription.vue
+++ b/ayanova/src/views/home-notify-subscription.vue
@@ -173,13 +173,9 @@
         </v-form>
       </v-col>
     </v-row>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/home-reminder.vue b/ayanova/src/views/home-reminder.vue
index 6e891f20..d5ae0425 100644
--- a/ayanova/src/views/home-reminder.vue
+++ b/ayanova/src/views/home-reminder.vue
@@ -124,13 +124,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/home-review.vue b/ayanova/src/views/home-review.vue
index 8c4530dd..1c99ecf4 100644
--- a/ayanova/src/views/home-review.vue
+++ b/ayanova/src/views/home-review.vue
@@ -160,13 +160,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-part-adjustment.vue b/ayanova/src/views/inv-part-adjustment.vue
index 1dbe3e74..10c2a0c4 100644
--- a/ayanova/src/views/inv-part-adjustment.vue
+++ b/ayanova/src/views/inv-part-adjustment.vue
@@ -64,13 +64,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-part-assembly.vue b/ayanova/src/views/inv-part-assembly.vue
index 12a2cc62..14f50c46 100644
--- a/ayanova/src/views/inv-part-assembly.vue
+++ b/ayanova/src/views/inv-part-assembly.vue
@@ -140,13 +140,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- #########################################################################################################-->
     <!-- ##########################  ITEM EDIT FORM  ###############################-->
     <!-- #########################################################################################################-->
diff --git a/ayanova/src/views/inv-part-serials.vue b/ayanova/src/views/inv-part-serials.vue
index a71be7d2..9c7c8130 100644
--- a/ayanova/src/views/inv-part-serials.vue
+++ b/ayanova/src/views/inv-part-serials.vue
@@ -57,13 +57,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-part-stock-levels.vue b/ayanova/src/views/inv-part-stock-levels.vue
index 912bf5fc..b36fd175 100644
--- a/ayanova/src/views/inv-part-stock-levels.vue
+++ b/ayanova/src/views/inv-part-stock-levels.vue
@@ -87,13 +87,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-part-warehouse.vue b/ayanova/src/views/inv-part-warehouse.vue
index ec7e9247..d40b7021 100644
--- a/ayanova/src/views/inv-part-warehouse.vue
+++ b/ayanova/src/views/inv-part-warehouse.vue
@@ -89,13 +89,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-part.vue b/ayanova/src/views/inv-part.vue
index 8501780a..528b556a 100644
--- a/ayanova/src/views/inv-part.vue
+++ b/ayanova/src/views/inv-part.vue
@@ -293,13 +293,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/inv-purchase-order.vue b/ayanova/src/views/inv-purchase-order.vue
index f2dc6ffa..c6e25ecd 100644
--- a/ayanova/src/views/inv-purchase-order.vue
+++ b/ayanova/src/views/inv-purchase-order.vue
@@ -358,13 +358,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- #########################################################################################-->
     <!-- ########################## PURCHASE ORDER ITEM EDIT FORM  ###############################-->
     <!-- #########################################################################################-->
diff --git a/ayanova/src/views/svc-contract.vue b/ayanova/src/views/svc-contract.vue
index c5da1a4e..d551b478 100644
--- a/ayanova/src/views/svc-contract.vue
+++ b/ayanova/src/views/svc-contract.vue
@@ -552,13 +552,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- #################################################################################################-->
     <!-- ########################## CONTRACT PART OVERRIDE ITEM EDIT FORM  ###############################-->
     <!-- #################################################################################################-->
diff --git a/ayanova/src/views/svc-csr.vue b/ayanova/src/views/svc-csr.vue
index fce9a972..34de76fd 100644
--- a/ayanova/src/views/svc-csr.vue
+++ b/ayanova/src/views/svc-csr.vue
@@ -237,13 +237,9 @@
         </v-dialog>
       </v-row>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-loaner.vue b/ayanova/src/views/svc-loaner.vue
index b7288984..98e505be 100644
--- a/ayanova/src/views/svc-loaner.vue
+++ b/ayanova/src/views/svc-loaner.vue
@@ -412,13 +412,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-pm.vue b/ayanova/src/views/svc-pm.vue
index 02646f4c..b7b6b9ca 100644
--- a/ayanova/src/views/svc-pm.vue
+++ b/ayanova/src/views/svc-pm.vue
@@ -28,13 +28,9 @@
         />
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- ################################################################################-->
     <!-- ##########################  GENERATE WO DIALOG  ###############################-->
     <!-- ################################################################################-->
diff --git a/ayanova/src/views/svc-project.vue b/ayanova/src/views/svc-project.vue
index f096ff05..38505292 100644
--- a/ayanova/src/views/svc-project.vue
+++ b/ayanova/src/views/svc-project.vue
@@ -165,13 +165,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-quote-status-edit.vue b/ayanova/src/views/svc-quote-status-edit.vue
index 1a6c7873..6a952ad5 100644
--- a/ayanova/src/views/svc-quote-status-edit.vue
+++ b/ayanova/src/views/svc-quote-status-edit.vue
@@ -109,13 +109,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-quote.vue b/ayanova/src/views/svc-quote.vue
index e5e1f013..0e4bce3b 100644
--- a/ayanova/src/views/svc-quote.vue
+++ b/ayanova/src/views/svc-quote.vue
@@ -28,13 +28,9 @@
         />
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- ################################################################################-->
     <!-- ##########################  GENERATE WO DIALOG  ###############################-->
     <!-- ################################################################################-->
diff --git a/ayanova/src/views/svc-task-group.vue b/ayanova/src/views/svc-task-group.vue
index d5e25dfe..3e9e7452 100644
--- a/ayanova/src/views/svc-task-group.vue
+++ b/ayanova/src/views/svc-task-group.vue
@@ -97,13 +97,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
     <!-- #########################################################################################################-->
     <!-- ##########################  ITEM EDIT FORM  ###############################-->
     <!-- #########################################################################################################-->
diff --git a/ayanova/src/views/svc-unit-model.vue b/ayanova/src/views/svc-unit-model.vue
index dbd0433b..f77db27e 100644
--- a/ayanova/src/views/svc-unit-model.vue
+++ b/ayanova/src/views/svc-unit-model.vue
@@ -249,13 +249,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-unit.vue b/ayanova/src/views/svc-unit.vue
index 2d615d4d..90de5e41 100644
--- a/ayanova/src/views/svc-unit.vue
+++ b/ayanova/src/views/svc-unit.vue
@@ -706,13 +706,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-work-order-item-priorities-edit.vue b/ayanova/src/views/svc-work-order-item-priorities-edit.vue
index 78649249..32b36a1e 100644
--- a/ayanova/src/views/svc-work-order-item-priorities-edit.vue
+++ b/ayanova/src/views/svc-work-order-item-priorities-edit.vue
@@ -46,13 +46,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-work-order-item-status-edit.vue b/ayanova/src/views/svc-work-order-item-status-edit.vue
index 7b2f30b0..d561b80f 100644
--- a/ayanova/src/views/svc-work-order-item-status-edit.vue
+++ b/ayanova/src/views/svc-work-order-item-status-edit.vue
@@ -63,13 +63,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-work-order-status-edit.vue b/ayanova/src/views/svc-work-order-status-edit.vue
index ca626209..1ff79357 100644
--- a/ayanova/src/views/svc-work-order-status-edit.vue
+++ b/ayanova/src/views/svc-work-order-status-edit.vue
@@ -109,13 +109,9 @@
         </v-row>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/svc-workorder.vue b/ayanova/src/views/svc-workorder.vue
index 59f6b5b8..e626ec4b 100644
--- a/ayanova/src/views/svc-workorder.vue
+++ b/ayanova/src/views/svc-workorder.vue
@@ -28,13 +28,10 @@
         />
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
+    <!-- </template> -->
     <!-- ################################################################################-->
     <!-- ##########################  GENERATE QUOTE DIALOG  ###############################-->
     <!-- ################################################################################-->
diff --git a/ayanova/src/views/vendor.vue b/ayanova/src/views/vendor.vue
index 969d8523..0af784cf 100644
--- a/ayanova/src/views/vendor.vue
+++ b/ayanova/src/views/vendor.vue
@@ -568,13 +568,9 @@
         </v-tabs>
       </v-form>
     </div>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>
 
diff --git a/ayanova/src/views/widget.vue b/ayanova/src/views/widget.vue
index ca5d3716..346cbef6 100644
--- a/ayanova/src/views/widget.vue
+++ b/ayanova/src/views/widget.vue
@@ -219,13 +219,9 @@
         </v-form>
       </v-col>
     </v-row>
-    <template v-if="!formState.ready">
-      <v-progress-circular
-        indeterminate
-        color="primary"
-        :size="60"
-      ></v-progress-circular>
-    </template>
+    <v-overlay :value="!formState.ready || formState.loading">
+      <v-progress-circular indeterminate :size="64" />
+    </v-overlay>
   </div>
 </template>