This commit is contained in:
2020-03-05 00:08:17 +00:00
parent 2e9f4e9940
commit 340d4cd516

View File

@@ -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
if (vm.$route.params.recordid != 0) {
vm.getDataFromApi(vm.$route.params.recordid);
} else {
throw "home-user-settings:created() - recordId is zero which is not valid for this type of object";
}
//NOTE: FOR NOW GOING TO ASSUME THIS FORM WILL ONLY EVER BE USED TO EDIT *CURRENT* USER'S USEROPTIONS
//SO NOT FOR EDITING OTHER USERS, WILL ASSUME THE USER EDITOR FORM FOR MANAGEMENT WILL HAVE A COMPACT VERSION
//OF THESE SAME FIELDS FOR THAT PURPOSE
//SO ALWAYS USER CURRENT LOGGED IN USER ID FOR THIS
//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) {
throw FORM_KEY + "::getDataFromApi -> Missing recordID!";
}
var url = API_BASE_URL + recordId;
//always fetch on this form for the current logged in user id
var url = API_BASE_URL + vm.$store.state.userId;
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 populatePickLists(vm);
// await window.$gz.formCustomTemplate.get(FORM_CUSTOM_TEMPLATE_KEY);
// await populatePickLists(vm);
} catch (err) {
reject(err);
}
@@ -343,43 +413,25 @@ function initForm(vm) {
//
function fetchUILocalizedText(vm) {
return window.$gz.locale.fetch([
"Widget",
"WidgetName",
"WidgetSerial",
"WidgetDollarAmount",
"WidgetCount",
"WidgetUserType",
"WidgetStartDate",
"WidgetEndDate",
"WidgetNotes",
"WidgetCustom1",
"WidgetCustom2",
"WidgetCustom3",
"WidgetCustom4",
"WidgetCustom5",
"WidgetCustom6",
"WidgetCustom7",
"WidgetCustom8",
"WidgetCustom9",
"WidgetCustom10",
"WidgetCustom11",
"WidgetCustom12",
"WidgetCustom13",
"WidgetCustom14",
"WidgetCustom15",
"WidgetCustom16"
"CurrencyCode",
"LanguageCode",
"TimeZone",
"UserEmailAddress",
"Hour12",
"UserColor",
"BrowserDefault"
]);
}
//////////////////////
//
//
function populatePickLists(vm) {
//ensure the pick lists required are pre-fetched
return window.$gz.enums.fetchEnumList("usertype").then(() => {
vm.pickLists.usertypes = window.$gz.enums.getPickList("usertype");
});
}
// //////////////////////
// //
// //
// function populatePickLists(vm) {
// //ensure the pick lists required are pre-fetched
// return window.$gz.enums.fetchEnumList("usertype").then(() => {
// vm.pickLists.usertypes = window.$gz.enums.getPickList("usertype");
// });
// }
</script>
<style></style>