ayanova/src/views/home-dashboard.vue

@@ -1,25 +1,28 @@
 <template>
   <v-row>
-    <v-col
+    <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
-      v-for="(item, i) in availableItems"
+    <div v-if="formState.ready">
-      :key="i"
+      <v-col
-      class="d-flex child-flex"
+        v-for="(item, i) in availableItems"
-      cols="12"
+        :key="i"
-      sm="6"
+        class="d-flex child-flex"
-      lg="4"
+        cols="12"
-      xl="3"
+        sm="6"
-    >
+        lg="4"
-      <gz-dash
+        xl="3"
-        :title="item.title"
+      >
-        :id="item.id"
+        <gz-dash
-        v-on:dash-remove="dashRemove"
+          :title="item.title"
-        v-on:dash-move-start="dashMoveStart"
+          :id="item.id"
-        v-on:dash-move-back="dashMoveBack"
+          v-on:dash-remove="dashRemove"
-        v-on:dash-move-forward="dashMoveForward"
+          v-on:dash-move-start="dashMoveStart"
-        v-on:dash-move-end="dashMoveEnd"
+          v-on:dash-move-back="dashMoveBack"
-        v-on:dash-refresh="dashRefresh"
+          v-on:dash-move-forward="dashMoveForward"
-      />
+          v-on:dash-move-end="dashMoveEnd"
-    </v-col>
+          v-on:dash-refresh="dashRefresh"
+        />
+      </v-col>
+    </div>
   </v-row>
 </template>
 
@@ -49,17 +52,32 @@ export default {
       helpUrl: "form-home-dashboard"
     });
   },
-  created() {
+  async created() {
-    this.availableItems = DashRegistry.availableItems();
+    let vm = this;
+    try {
+      vm.availableItems = DashRegistry.availableItems();
+      //keeping in case need later for some localized text or something
+      // await initForm(vm);
+
+      //users have full rights to their dashboard config
+      vm.rights = window.$gz.role.fullRightsObject();
+      vm.formState.readOnly = false;
+      window.$gz.eventBus.$on("menu-click", clickHandler);
+
+      await vm.getDataFromApi();
+      window.$gz.form.setFormState({
+        vm: vm,
+        dirty: false,
+        valid: true
+      });
+      generateMenu(vm);
+    } catch (error) {
+      window.$gz.errorHandler.handleFormError(error, vm);
+    } finally {
+      vm.formState.ready = true;
+    }
   },
   methods: {
-    dashItems: function() {
-      let ret = [];
-      for (var i = 0; i < 12; i++) {
-        ret.push({ id: i.toString(), title: `Dash ${i}` });
-      }
-      return ret;
-    },
     dashMoveStart: function(item) {
       console.log("home-dashboard:dashMoveStart", item);
     },
@@ -80,12 +98,82 @@ export default {
         "home-dashboard:refresh (normally handle @ typed dash control)",
         item
       );
+    },
+    async getDataFromApi(recordId) {
+      let vm = this;
+      window.$gz.form.setFormState({
+        vm: vm,
+        loading: true
+      });
+      if (!recordId) {
+        throw new Error(FORM_KEY + "::getDataFromApi -> Missing recordID!");
+      }
+      let url = API_BASE_URL + recordId;
+      try {
+        window.$gz.form.deleteAllErrorBoxErrors(vm);
+
+        let res = await window.$gz.api.get(url);
+
+        if (res.error) {
+          //Not found?
+          if (res.error.code == "2010") {
+            window.$gz.form.handleObjectNotFound(vm);
+          }
+          vm.formState.serverError = res.error;
+          window.$gz.form.setErrorBoxErrors(vm);
+        } else {
+          vm.obj = res.data;
+          //modify the menu as necessary
+          generateMenu(vm);
+          //Update the form status
+          window.$gz.form.setFormState({
+            vm: vm,
+            dirty: false,
+            valid: true,
+            loading: false
+          });
+        }
+      } catch (error) {
+        window.$gz.errorHandler.handleFormError(error, vm);
+      } finally {
+        window.$gz.form.setFormState({
+          vm: vm,
+          loading: false
+        });
+      }
     }
   },
   data() {
     return {
-      availableItems: []
+      availableItems: [],
+      formState: {
+        ready: false,
+        dirty: false,
+        valid: true,
+        readOnly: false,
+        loading: true,
+        errorBoxMessage: null,
+        appError: null,
+        serverError: {}
+      }
     };
   }
 };
+
+// /////////////////////////////////
+// //
+// //
+// async function initForm(vm) {
+//   await fetchTranslatedText(vm);
+//   await window.$gz.formCustomTemplate.get(FORM_CUSTOM_TEMPLATE_KEY);
+//   await populateSelectionLists(vm);
+// }
+
+// //////////////////////////////////////////////////////////
+// //
+// // Ensures UI translated text is available
+// //
+// async function fetchTranslatedText(vm) {
+//   await window.$gz.translation.cacheTranslations(["Widget", "WidgetName"]);
+// }
 </script>