ayanova/src/views/home-schedule.vue

@@ -1,7 +1,8 @@
 <template>
-  <div v-resize="onResize" class="my-n8">
+  <div v-if="formState.ready" v-resize="onResize" class="my-n8">
     <!-- {{ events }} -->
     <gz-error :error-box-message="formState.errorBoxMessage"></gz-error>
+
     <v-sheet height="64">
       <v-toolbar flat>
         <v-btn outlined class="mr-4" color="grey darken-2" @click="setToday">
@@ -31,22 +32,24 @@
         <v-menu bottom right>
           <template v-slot:activator="{ on, attrs }">
             <v-btn outlined color="grey darken-2" v-bind="attrs" v-on="on">
-              <span>{{ typeToLabel[viewType] }}</span>
+              <span>{{ typeToLabel() }}</span>
               <v-icon right>$sort</v-icon>
             </v-btn>
           </template>
           <v-list>
             <v-list-item @click="viewType = 'day'">
-              <v-list-item-title>Day</v-list-item-title>
+              <v-list-item-title>{{ $ay.t("ScheduleDay") }}</v-list-item-title>
             </v-list-item>
             <v-list-item @click="viewType = 'week'">
-              <v-list-item-title>Week</v-list-item-title>
+              <v-list-item-title>{{ $ay.t("ScheduleWeek") }}</v-list-item-title>
             </v-list-item>
             <v-list-item @click="viewType = 'month'">
-              <v-list-item-title>Month</v-list-item-title>
+              <v-list-item-title>{{
+                $ay.t("ScheduleMonth")
+              }}</v-list-item-title>
             </v-list-item>
             <v-list-item @click="viewType = '4day'">
-              <v-list-item-title>4 days</v-list-item-title>
+              <v-list-item-title>{{ $ay.t("Schedule4Day") }}</v-list-item-title>
             </v-list-item>
           </v-list>
         </v-menu>
@@ -161,7 +164,9 @@ SETTINGS:
 
  TODO NEXT:
     
-    translations of existing text (not calendar built in days months etc but controls)
+    preserve position / view when navigate away and return
+      temp formsettings
+    
    MORE INFO DISPLAY
    Summary info to display for woitem when open dialog (MUST check at server if restricted tech and not send / show some if not all of this)
       No controls to change the time / date for now
@@ -204,6 +209,9 @@ export default {
       generateMenu(vm);
     } catch (error) {
       window.$gz.errorHandler.handleFormError(error, vm);
+    } finally {
+      console.log("created: setting formstate ready to true now");
+      vm.formState.ready = true;
     }
   },
   beforeDestroy() {
@@ -214,12 +222,7 @@ export default {
       formCustomTemplateKey: FORM_CUSTOM_TEMPLATE_KEY,
       focus: "",
       viewType: "month",
-      typeToLabel: {
-        month: "Month",
-        week: "Week",
-        day: "Day",
-        "4day": "4 Days"
-      },
+
       selectedEvent: {},
       selectedElement: null,
       selectedOpen: false,
@@ -243,10 +246,19 @@ export default {
       hour12: window.$gz.locale.getHour12()
     };
   },
-  mounted() {
-    this.$refs.calendar.checkChange();
-  },
   methods: {
+    typeToLabel() {
+      switch (this.viewType) {
+        case "month":
+          return this.$ay.t("ScheduleMonth");
+        case "week":
+          return this.$ay.t("ScheduleWeek");
+        case "day":
+          return this.$ay.t("ScheduleDay");
+        case "4day":
+          return this.$ay.t("Schedule4Day");
+      }
+    },
     onResize() {
       this.calendarHeight = window.innerHeight * 0.84;
     },
@@ -297,10 +309,10 @@ export default {
       nativeEvent.stopPropagation();
     },
     async fetchEvents({ start, end }) {
-      // console.log(
-      //   "UPDATE RANGE:",
-      //   JSON.stringify({ start: start.date, end: end.date })
-      // );
+      console.trace(
+        "UPDATE RANGE:",
+        JSON.stringify({ start: start.date, end: end.date })
+      );
 
       // console.log(
       //   "TZ Offset",
@@ -482,6 +494,12 @@ async function initForm(vm) {
 // Ensures UI translated text is available
 //
 async function fetchTranslatedText(vm) {
-  await window.$gz.translation.cacheTranslations(["DateRangeToday"]);
+  await window.$gz.translation.cacheTranslations([
+    "DateRangeToday",
+    "ScheduleMonth",
+    "ScheduleDay",
+    "ScheduleWeek",
+    "Schedule4Day"
+  ]);
 }
 </script>