ayanova/src/views/home-user-settings.vue

@@ -16,7 +16,84 @@
                 >{{ formState.errorBoxMessage }}</v-alert
               >
             </v-col>
-            FIELDS HERE
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.emailAddress"
+                :readonly="formState.readOnly"
+                clearable
+                @click:clear="onChange('emailAddress')"
+                :label="lt('UserEmailAddress')"
+                :error-messages="form().serverErrors(this, 'emailAddress')"
+                ref="emailAddress"
+                @change="onChange('emailAddress')"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.languageOverride"
+                :placeholder="locale().getBrowserFirstLanguage()"
+                :readonly="formState.readOnly"
+                clearable
+                @click:clear="onChange('languageOverride')"
+                :label="lt('LanguageCode')"
+                :error-messages="form().serverErrors(this, 'languageOverride')"
+                ref="languageOverride"
+                @change="onChange('languageOverride')"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.currencyName"
+                :readonly="formState.readOnly"
+                clearable
+                @click:clear="onChange('currencyName')"
+                :label="lt('CurrencyCode')"
+                :rules="[form().required(this, 'currencyName')]"
+                :error-messages="form().serverErrors(this, 'currencyName')"
+                ref="currencyName"
+                @change="onChange('currencyName')"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.timeZoneOverride"
+                :readonly="formState.readOnly"
+                clearable
+                @click:clear="onChange('timeZoneOverride')"
+                :label="lt('TimeZone')"
+                :error-messages="form().serverErrors(this, 'timeZoneOverride')"
+                ref="timeZoneOverride"
+                @change="onChange('timeZoneOverride')"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <!-- https://vuetifyjs.com/en/components/color-pickers -->
+              <v-color-picker
+                v-model="obj.uiColor"
+                :readonly="formState.readOnly"
+                mode="hexa"
+                :label="lt('UserColor')"
+                :error-messages="form().serverErrors(this, 'uiColor')"
+                ref="uiColor"
+                @change="onChange('uiColor')"
+              ></v-color-picker>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-checkbox
+                v-model="obj.hour12"
+                :readonly="formState.readOnly"
+                :label="lt('Hour12')"
+                ref="hour12"
+                :error-messages="form().serverErrors(this, 'hour12')"
+                @change="onChange('hour12')"
+              ></v-checkbox>
+            </v-col>
           </v-row>
         </v-form>
       </v-col>
@@ -59,28 +136,19 @@ export default {
         vm.formState.ready = true;
         window.$gz.eventBus.$on("menu-click", clickHandler);
         //UserOptions never creates a new one so this code is a little different than other forms
-        //id 0 means create a new record don't load one
+        //NOTE: FOR NOW GOING TO ASSUME THIS FORM WILL ONLY EVER BE USED TO EDIT *CURRENT* USER'S USEROPTIONS
-        if (vm.$route.params.recordid != 0) {
+        //SO NOT FOR EDITING OTHER USERS, WILL ASSUME THE USER EDITOR FORM FOR MANAGEMENT WILL HAVE A COMPACT VERSION
-          vm.getDataFromApi(vm.$route.params.recordid);
+        //OF THESE SAME FIELDS FOR THAT PURPOSE
-        } else {
+        //SO ALWAYS USER CURRENT LOGGED IN USER ID FOR THIS
-          throw "home-user-settings:created() - recordId is zero which is not valid for this type of object";
+        //id 0 means create a new record don't load one but thats not applicable here
-        }
+
+        vm.getDataFromApi();
       })
       .catch(err => {
         vm.formState.ready = true;
         window.$gz.errorHandler.handleFormError(err, vm);
       });
   },
-  beforeRouteUpdate(to, from, next) {
-    //This triggers a fetch of the data when the ID value changes on the route
-    //which happens on duplicate, submit new record and change of active record id (backward nav/forward nav etc)
-    if (to.params.recordid != 0) {
-      this.getDataFromApi(to.params.recordid);
-    }
-    next();
-    // react to route changes...
-    // don't forget to call next()
-  },
   beforeRouteLeave(to, from, next) {
     if (this.formState.dirty) {
       window.$gz.dialog.confirmLeaveUnsaved().then(dialogResult => {
@@ -125,9 +193,12 @@ export default {
         uiColor: null,
         languageOverride: null,
         timeZoneOverride: null,
-        currencName: null,
+        currencyName: null,
         hour12: null
       },
+      // default:{
+      //   language: locale().getBrowserFirstLanguage()
+      // },
       formState: {
         ready: false,
         dirty: false,
@@ -181,13 +252,11 @@ export default {
         window.$gz.form.onChange(this, ref);
       }
     },
-    getDataFromApi(recordId) {
+    getDataFromApi() {
       var vm = this;
       vm.formState.loading = true;
-      if (!recordId) {
+      //always fetch on this form for the current logged in user id
-        throw FORM_KEY + "::getDataFromApi -> Missing recordID!";
+      var url = API_BASE_URL + vm.$store.state.userId;
-      }
-      var url = API_BASE_URL + recordId;
 
       window.$gz.form.deleteAllErrorBoxErrors(vm);
 
@@ -236,7 +305,8 @@ export default {
       if (vm.canSave) {
         vm.formState.loading = true;
 
-        var url = API_BASE_URL + vm.$route.params.recordid;
+        //always submit from this form for the current logged in user id
+        var url = API_BASE_URL + vm.$store.state.userId;
 
         //clear any errors vm might be around from previous submit
         window.$gz.form.deleteAllErrorBoxErrors(vm);
@@ -327,8 +397,8 @@ function initForm(vm) {
     (async function() {
       try {
         await fetchUILocalizedText(vm);
-        await window.$gz.formCustomTemplate.get(FORM_CUSTOM_TEMPLATE_KEY);
+        // await window.$gz.formCustomTemplate.get(FORM_CUSTOM_TEMPLATE_KEY);
-        await populatePickLists(vm);
+        // await populatePickLists(vm);
       } catch (err) {
         reject(err);
       }
@@ -343,43 +413,25 @@ function initForm(vm) {
 //
 function fetchUILocalizedText(vm) {
   return window.$gz.locale.fetch([
-    "Widget",
+    "CurrencyCode",
-    "WidgetName",
+    "LanguageCode",
-    "WidgetSerial",
+    "TimeZone",
-    "WidgetDollarAmount",
+    "UserEmailAddress",
-    "WidgetCount",
+    "Hour12",
-    "WidgetUserType",
+    "UserColor",
-    "WidgetStartDate",
+    "BrowserDefault"
-    "WidgetEndDate",
-    "WidgetNotes",
-    "WidgetCustom1",
-    "WidgetCustom2",
-    "WidgetCustom3",
-    "WidgetCustom4",
-    "WidgetCustom5",
-    "WidgetCustom6",
-    "WidgetCustom7",
-    "WidgetCustom8",
-    "WidgetCustom9",
-    "WidgetCustom10",
-    "WidgetCustom11",
-    "WidgetCustom12",
-    "WidgetCustom13",
-    "WidgetCustom14",
-    "WidgetCustom15",
-    "WidgetCustom16"
   ]);
 }
 
-//////////////////////
+// //////////////////////
-//
+// //
-//
+// //
-function populatePickLists(vm) {
+// function populatePickLists(vm) {
-  //ensure the pick lists required are pre-fetched
+//   //ensure the pick lists required are pre-fetched
-  return window.$gz.enums.fetchEnumList("usertype").then(() => {
+//   return window.$gz.enums.fetchEnumList("usertype").then(() => {
-    vm.pickLists.usertypes = window.$gz.enums.getPickList("usertype");
+//     vm.pickLists.usertypes = window.$gz.enums.getPickList("usertype");
-  });
+//   });
-}
+// }
 </script>
 
 <style></style>