admin/raven-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Browse Source
This commit is contained in:
John Cardinal
2019-04-23 19:32:21 +00:00
parent b25a5834bf
commit 3cc5cd53a4
4 changed files with 121 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
ayanova/src/App.vue
View File

@@ -107,19 +107,26 @@ export default {
// MENU EVENT HANDLERS // MENU EVENT HANDLERS
// //
// //
var that = this; var vm = this;
this.$gzevent.$on("menu-change", function handleMenuChange(ctx) { this.$gzevent.$on("menu-change", function handleMenuChange(ctx) {
that.$gzmenu.handleMenuChange(that, ctx); vm.$gzmenu.handleMenuChange(vm, ctx);
}); });
this.$gzevent.$on("menu-replace-item", function handleReplaceMenuItem( this.$gzevent.$on("menu-replace-item", function handleReplaceMenuItem(
newItem newItem
) { ) {
that.$gzmenu.handleReplaceMenuItem(that, newItem); vm.$gzmenu.handleReplaceMenuItem(vm, newItem);
});
this.$gzevent.$on("menu-disable-item", function handleDisableMenuItem(
key,
disabled
) {
vm.$gzmenu.handleDisableMenuItem(vm, key, disabled);
}); });
this.$gzevent.$on("menu-click", function handleMenuClick(menuitem) { this.$gzevent.$on("menu-click", function handleMenuClick(menuitem) {
that.$gzmenu.handleAppClick(that, menuitem); vm.$gzmenu.handleAppClick(vm, menuitem);
}); });
}, },
beforeDestroy() { beforeDestroy() {

54
ayanova/src/api/gzform.js
View File

@@ -127,7 +127,7 @@ export default {
// REQUIRED // REQUIRED
// //
required(vm, ref) { required(vm, ref) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
var ctrl = getControl(vm, ref); var ctrl = getControl(vm, ref);
@@ -149,7 +149,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return err; return err;
}, },
@@ -157,7 +157,7 @@ export default {
// MAXLENGTH // MAXLENGTH
// //
maxLength(vm, ref, max) { maxLength(vm, ref, max) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
var ctrl = getControl(vm, ref); var ctrl = getControl(vm, ref);
@@ -180,7 +180,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return err; return err;
} else { } else {
@@ -191,7 +191,7 @@ export default {
// MAX 255 // MAX 255
// //
max255(vm, ref) { max255(vm, ref) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
return this.maxLength(vm, ref, 255); return this.maxLength(vm, ref, 255);
@@ -201,7 +201,7 @@ export default {
// (start date must precede end date) // (start date must precede end date)
// //
datePrecedence(vm, refStart, refEnd) { datePrecedence(vm, refStart, refEnd) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
var ctrlStart = getControl(vm, refStart); var ctrlStart = getControl(vm, refStart);
@@ -238,7 +238,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return err; return err;
} else { } else {
@@ -249,7 +249,7 @@ export default {
// INTEGER IS VALID // INTEGER IS VALID
// //
integerValid(vm, ref) { integerValid(vm, ref) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
var ctrl = getControl(vm, ref); var ctrl = getControl(vm, ref);
@@ -274,7 +274,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return err; return err;
}, },
@@ -283,7 +283,7 @@ export default {
// Basically anything that can be a number is valid // Basically anything that can be a number is valid
// //
decimalValid(vm, ref) { decimalValid(vm, ref) {
if (vm.formLoading) { if (vm.formState.loading) {
return false; return false;
} }
//TODO: Handle commas and spaces in numbers //TODO: Handle commas and spaces in numbers
@@ -311,7 +311,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return err; return err;
}, },
@@ -364,7 +364,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
ret.push(err); ret.push(err);
} }
@@ -394,7 +394,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: false valid: false
}); });
return ret; return ret;
} }
@@ -419,7 +419,7 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formValid: true valid: true
}); });
}, },
/////////////////////////////// ///////////////////////////////
@@ -436,7 +436,7 @@ export default {
// This is required so that server errors can be cleared when input is changed // This is required so that server errors can be cleared when input is changed
// //
onChange(vm, ref) { onChange(vm, ref) {
if (triggeringChange || vm.formLoading) { if (triggeringChange || vm.formState.loading) {
return; return;
} }
//If ref appears in the servererrors details collection, remove each one //If ref appears in the servererrors details collection, remove each one
@@ -470,29 +470,29 @@ export default {
//Update the form status //Update the form status
this.setFormState({ this.setFormState({
vm: vm, vm: vm,
formDirty: true, dirty: true,
formValid: vm.$refs.form.validate() valid: vm.$refs.form.validate()
}); });
}, },
//////////////////////////////////// ////////////////////////////////////
// set calling form Valid state // set calling form Valid state
// //
// {vm:vm,formDirty:bool | undefined, // {vm:vm,dirty:bool | undefined,
// formValid:bool | undefined, // valid:bool | undefined,
// formLoading:bool | undefined} // loading:bool | undefined}
// //
setFormState(theState) { setFormState(newState) {
Vue.nextTick(function() { Vue.nextTick(function() {
if (theState.formValid != undefined) { if (newState.valid != undefined) {
theState.vm.formValid = theState.formValid; newState.vm.formState.valid = newState.valid;
} }
if (theState.formDirty != undefined) { if (newState.dirty != undefined) {
theState.vm.formDirty = theState.formDirty; newState.vm.formState.dirty = newState.dirty;
} }
if (theState.formLoading != undefined) { if (newState.loading != undefined) {
theState.vm.formLoading = theState.formLoading; newState.vm.formState.loading = newState.loading;
} }
}); });
} }

68
ayanova/src/api/gzmenu.js
View File

@@ -10,21 +10,21 @@ export default {
// //
// Deal with a menu change request // Deal with a menu change request
// called from App.vue // called from App.vue
handleMenuChange(that, ctx) { handleMenuChange(vm, ctx) {
that.appBar.isMain = ctx.isMain; vm.appBar.isMain = ctx.isMain;
that.appBar.icon = ctx.icon; vm.appBar.icon = ctx.icon;
that.appBar.title = ctx.title; vm.appBar.title = ctx.title;
//set the help url if presented or default to the top of the index //set the help url if presented or default to the top of the index
that.appBar.helpUrl = ctx.helpUrl ? ctx.helpUrl : "index.html"; vm.appBar.helpUrl = ctx.helpUrl ? ctx.helpUrl : "index.html";
that.appBar.menuItems = []; vm.appBar.menuItems = [];
//CONTEXT TOP PORTION //CONTEXT TOP PORTION
//populate the context portion of the menu so handle accordingly //populate the context portion of the menu so handle accordingly
if (ctx.menuItems) { if (ctx.menuItems) {
that.appBar.menuItems = ctx.menuItems; vm.appBar.menuItems = ctx.menuItems;
//DIVIDER //DIVIDER
//Insert the devider between context and global items //Insert the devider between context and global items
that.appBar.menuItems.push({ divider: true, inset: false }); vm.appBar.menuItems.push({ divider: true, inset: false });
} }
//GLOBAL BOTTOM PORTION //GLOBAL BOTTOM PORTION
@@ -36,27 +36,27 @@ export default {
//global menu items //global menu items
//LOGOUT //LOGOUT
that.appBar.menuItems.push({ vm.appBar.menuItems.push({
title: that.$gzlocale.get("Logout"), title: vm.$gzlocale.get("Logout"),
icon: "sign-out-alt", icon: "sign-out-alt",
color: "pink", color: "pink",
key: "app:logout" key: "app:logout"
}); });
//divider //divider
that.appBar.menuItems.push({ divider: true, inset: false }); vm.appBar.menuItems.push({ divider: true, inset: false });
//HELP //HELP
that.appBar.menuItems.push({ vm.appBar.menuItems.push({
title: that.$gzlocale.get("MenuHelp"), title: vm.$gzlocale.get("MenuHelp"),
icon: "question-circle", icon: "question-circle",
key: "app:help", key: "app:help",
data: that.appBar.helpUrl data: vm.appBar.helpUrl
}); });
//ABOUT //ABOUT
that.appBar.menuItems.push({ vm.appBar.menuItems.push({
title: that.$gzlocale.get("HelpAboutAyaNova"), title: vm.$gzlocale.get("HelpAboutAyaNova"),
icon: "info-circle", icon: "info-circle",
key: "app:nav:abt", key: "app:nav:abt",
data: "about" data: "about"
@@ -67,27 +67,45 @@ export default {
// //
// Deal with a menu item update request // Deal with a menu item update request
// called from App.vue // called from App.vue
handleReplaceMenuItem(that, newItem) { handleReplaceMenuItem(vm, newItem) {
if (!that.appBar.menuItems || !newItem) { if (!vm.appBar.menuItems || !newItem) {
return; return;
} }
//Find the key that is in the collection and replace it //Find the key that is in the collection and replace it
for (var i = 0; i < that.appBar.menuItems.length; i++) { for (var i = 0; i < vm.appBar.menuItems.length; i++) {
if (that.appBar.menuItems[i].key == newItem.key) { if (vm.appBar.menuItems[i].key == newItem.key) {
//NOTE: since we are adding a new object, it has no reactivity in it so we need to use the Vue.Set to set it which //NOTE: since we are adding a new object, it has no reactivity in it so we need to use the Vue.Set to set it which
//automatically adds the setters and getters that trigger reactivity //automatically adds the setters and getters that trigger reactivity
//If it was set directly on the array it wouldn't update the UI //If it was set directly on the array it wouldn't update the UI
that.$set(that.appBar.menuItems, i, newItem); vm.$set(vm.appBar.menuItems, i, newItem);
return; return;
} }
} }
}, },
/////////////////////////////// ///////////////////////////////
// ENABLE / DISABLE HANDLER
//
// Deal with a menu item enable / disable
// called from App.vue
handleDisableMenuItem(vm, key, disabled) {
if (!vm.appBar.menuItems || !key) {
return;
}
//Find the key that is in the collection and replace it
for (var i = 0; i < vm.appBar.menuItems.length; i++) {
var menuItem = vm.appBar.menuItems[i];
if (menuItem.key == key) {
menuItem.disabled = disabled;
}
return;
}
},
///////////////////////////////
// APP (GLOBAL) CLICK HANDLER // APP (GLOBAL) CLICK HANDLER
// //
// Deal with a menu change request // Deal with a menu change request
// called from App.vue // called from App.vue
handleAppClick(that, menuItem) { handleAppClick(vm, menuItem) {
//Key will start with the string "app:" if it's a global application command that should be handled here, //Key will start with the string "app:" if it's a global application command that should be handled here,
//otherwise it's a local command for a local form only //otherwise it's a local command for a local form only
//If there is any extended information required for the command it will be in the data property of the menu item //If there is any extended information required for the command it will be in the data property of the menu item
@@ -99,15 +117,15 @@ export default {
if (!item.disabled && item.owner == "app") { if (!item.disabled && item.owner == "app") {
switch (item.key) { switch (item.key) {
case "help": case "help":
var helpurl = that.$store.state.helpUrl + item.data; var helpurl = vm.$store.state.helpUrl + item.data;
window.open(helpurl, "_blank"); window.open(helpurl, "_blank");
break; break;
case "logout": case "logout":
processLogout(); processLogout();
that.$router.push({ name: "login" }); vm.$router.push({ name: "login" });
break; break;
case "nav": case "nav":
that.$router.push({ name: item.data }); vm.$router.push({ name: item.data });
break; break;
default: default:
alert( alert(

67
ayanova/src/views/inventory-widget-edit.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<v-layout v-if="this.formReady"> <v-layout v-if="this.formState.ready">
<v-flex> <v-flex>
<v-form ref="form"> <v-form ref="form">
<v-layout align-center justify-left row wrap> <v-layout align-center justify-left row wrap>
@@ -117,15 +117,15 @@
<v-layout align-left justify-center row wrap mt-5> <v-layout align-left justify-center row wrap mt-5>
<v-flex xs6 sm4> <v-flex xs6 sm4>
READY: {{formReady}} READY: {{formState.ready}}
<br> <br>
LOADING: {{formLoading}} LOADING: {{formState.loading}}
<br> <br>
DIRTY: {{formDirty}} DIRTY: {{formState.dirty}}
<br> <br>
VALID: {{formValid}} VALID: {{formState.valid}}
<br> <br>
READONLY: {{formReadOnly}} READONLY: {{formState.readOnly}}
<br> <br>
</v-flex> </v-flex>
</v-layout> </v-layout>
@@ -146,7 +146,7 @@
</template> </template>
<script> <script>
/* XXeslint-disable */ /* Xeslint-disable */
function clickHandler(menuItem) { function clickHandler(menuItem) {
if (!menuItem) { if (!menuItem) {
@@ -203,9 +203,9 @@ export default {
var vm = this; var vm = this;
this.$gzlocale this.$gzlocale
.fetch(ltKeysRequired) .fetch(ltKeysRequired)
.then(() => (this.formReady = true)) .then(() => (this.formState.ready = true))
.catch(err => { .catch(err => {
this.formReady = true; this.formState.ready = true;
vm.$gzHandleFormError(err); vm.$gzHandleFormError(err);
}); });
}, },
@@ -254,29 +254,42 @@ export default {
serverError: {}, serverError: {},
errorBoxMessage: null, errorBoxMessage: null,
appError: null, appError: null,
formReady: false, formState: {
formDirty: false, ready: false,
formValid: true, dirty: false,
formReadOnly: false, valid: true,
formLoading: true readOnly: false,
loading: true
}
}; };
}, },
watch: { watch: {
formValid: { canSave: {
handler: function(newObj, oldObj) { // xeslint-disable-next-line
handler: function(newState) {
this.$gzevent.$emit(
"menu-replace-item",
"inventory-widget-edit:save",
newState
);
//todo: change the save button state here //todo: change the save button state here
//console.log("Valid CHANGED, was " + oldObj + " Now is " + newObj); //console.log("Valid CHANGED, was " + oldObj + " Now is " + newObj);
} }
} }
}, },
computed: {
canSave: function() {
return this.formState.valid && this.formState.dirty;
}
},
methods: { methods: {
onChange(ref) { onChange(ref) {
if (!this.formLoading) { if (!this.formState.loading) {
this.$gzform.onChange(this, ref); this.$gzform.onChange(this, ref);
} }
}, },
getDataFromApi() { getDataFromApi() {
this.formLoading = true; this.formState.loading = true;
var url = "Widget/" + this.$route.params.id; var url = "Widget/" + this.$route.params.id;
var vm = this; var vm = this;
this.$gzform.deleteAllErrorBoxErrors(this); this.$gzform.deleteAllErrorBoxErrors(this);
@@ -291,9 +304,9 @@ export default {
//Update the form status //Update the form status
vm.$gzform.setFormState({ vm.$gzform.setFormState({
vm: vm, vm: vm,
formDirty: false, dirty: false,
formValid: true, valid: true,
formLoading: false loading: false
}); });
} }
}) })
@@ -301,15 +314,15 @@ export default {
//Update the form status //Update the form status
vm.$gzform.setFormState({ vm.$gzform.setFormState({
vm: vm, vm: vm,
formLoading: false loading: false
}); });
vm.$gzHandleFormError(error, vm); vm.$gzHandleFormError(error, vm);
}); });
}, },
submit() { submit() {
//check if form is valid, as far as I know this is the way you're supposed to do it and in testing it does not force all fields to revalidate individually //check if form is valid, as far as I know this is the way you're supposed to do it and in testing it does not force all fields to revalidate individually
if (this.formValid && this.formDirty) { if (this.canSave()) {
this.formLoading = true; this.formState.loading = true;
var vm = this; var vm = this;
var url = "Widget/" + this.$route.params.id; var url = "Widget/" + this.$route.params.id;
@@ -319,14 +332,14 @@ export default {
this.$gzapi this.$gzapi
.upsert(url, this.obj) .upsert(url, this.obj)
.then(res => { .then(res => {
this.formLoading = false; this.formState.loading = false;
if (res.error) { if (res.error) {
vm.serverError = res.error; vm.serverError = res.error;
vm.$gzform.setErrorBoxErrors(vm); vm.$gzform.setErrorBoxErrors(vm);
} else { } else {
vm.$gzform.setFormState({ vm.$gzform.setFormState({
vm: vm, vm: vm,
formDirty: false dirty: false
}); });
//Logic for detecting if a post or put: if id then it was a post, if no id then it was a put //Logic for detecting if a post or put: if id then it was a post, if no id then it was a put
@@ -340,7 +353,7 @@ export default {
} }
}) })
.catch(function handleSubmitError(error) { .catch(function handleSubmitError(error) {
vm.formLoading = false; vm.formState.loading = false;
vm.$gzHandleFormError(error, vm); vm.$gzHandleFormError(error, vm);
}); });
} }