This commit is contained in:
2019-04-18 23:19:30 +00:00
parent 266cc78530
commit 54a5330caf
5 changed files with 71 additions and 23 deletions

View File

@@ -49,10 +49,19 @@ All platforms and browsers
- DONE reorganize SAVE, DELETE ETC, put a divider between main form actions and then all the myriad of secondary things - DONE reorganize SAVE, DELETE ETC, put a divider between main form actions and then all the myriad of secondary things
- DONE LOCALIZE check all new menu items, some might be not localized (look for ALL CAPS) - DONE LOCALIZE check all new menu items, some might be not localized (look for ALL CAPS)
- DONE WIRE UP logout link to go to login form and logout properly - DONE WIRE UP logout link to go to login form and logout properly
### THIS NEXT -> - JUST CHANGED the keys to a new system and dropping data property, right in the middle of it actually but it needs to be changed back partially see below
- First of all, put gzmenu on to the vue object in main so can use it for little utilities like click handling, generating unique nav keys etc
- Reason was to ensure key uniqueness (two nav items with same key are erroring)
- HOWEVER as I'm thinking about it now, do we really want all that url stuff being in the key?
- Instead, change back to using data but add a third parameter to make sure that keys are unique somehow
- That way we can put anything into the data key again because in future might need whole objects etc (almost certainly will)
- Move ABOUT item to just above HELP in menu and remove from main NAV and make it navigate properly on click
- Make about contextual and insert a menu item to view log
- TODO navigating through menu doesn't "back" properly when clicking back on browser controls
- WIRE up save menu item and add code to disable save on broken rules (and make red, disabled etc) - WIRE up save menu item and add code to disable save on broken rules (and make red, disabled etc)
- Wire up delete menu item - Wire up delete menu item
- api code is stubbed out for delete, need to write that as well - api code is stubbed out for delete, need to write that as well
- Move ABOUT item to just above HELP in menu and remove from main NAV and make it navigate properly on click
- DO I need to institute a back button? (in APP MODE?? installed to "desktop" on device will I be able to easily navigate without back and forward buttons) - DO I need to institute a back button? (in APP MODE?? installed to "desktop" on device will I be able to easily navigate without back and forward buttons)
- Navigation guard: navigate away with unsaved changes should warn and prevent but have option to continue anyway - Navigation guard: navigate away with unsaved changes should warn and prevent but have option to continue anyway
@@ -288,6 +297,8 @@ Make all fields work according to specs below
- List should remember where the user was when they go to edit and back again - List should remember where the user was when they go to edit and back again
- What to do if they edit? Refresh the list but keep the same page location? - What to do if they edit? Refresh the list but keep the same page location?
- something I just forgot as I went to write it and got stuck reading older shit here
- SCROLL POSITION !! - Very important, must return UI to exact scroll position on navigation backwards, not doing so causes a hellish UI to use. - SCROLL POSITION !! - Very important, must return UI to exact scroll position on navigation backwards, not doing so causes a hellish UI to use.
- Same position in window - Same position in window
- Same settings in any grids being shown and scrolled to same point in grids - Same settings in any grids being shown and scrolled to same point in grids

View File

@@ -35,20 +35,29 @@ export default {
//global menu items //global menu items
//Logout //LOGOUT
that.appBar.menuItems.push({ that.appBar.menuItems.push({
title: that.$gzlocale.get("Logout"), title: that.$gzlocale.get("Logout"),
icon: "sign-out-alt", icon: "sign-out-alt",
color: "pink", color: "pink",
key: "app:logout" key: "app||logout"
}); });
//Insert help item //divider
that.appBar.menuItems.push({ divider: true, inset: false });
//HELP
that.appBar.menuItems.push({ that.appBar.menuItems.push({
title: that.$gzlocale.get("MenuHelp"), title: that.$gzlocale.get("MenuHelp"),
icon: "question-circle", icon: "question-circle",
key: "app:help", key: "app||help||" + that.appBar.helpUrl
data: that.appBar.helpUrl });
//ABOUT
that.appBar.menuItems.push({
title: that.$gzlocale.get("HelpAboutAyaNova"),
icon: "info-circle",
key: "app||nav||about"
}); });
}, },
/////////////////////////////// ///////////////////////////////
@@ -77,21 +86,29 @@ export default {
// Deal with a menu change request // Deal with a menu change request
// called from App.vue // called from App.vue
handleClick(that, menuitem) { handleClick(that, 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" key of the menu item (e.g. the url in a app:help link) //If there is any extended information required for the command it will be in the key after the command portion of the menu item (e.g. the url in a app||help link)
//split a key into component parts, part one is the responsible party, part two is the command, part three to part * are all extra info
//each part is separated by a double pipe symbol ||
//Handle different items //Handle different items
if (!menuitem.disabled && menuitem.key.startsWith("app:")) { if (!menuitem.disabled && menuitem.key.startsWith("app||")) {
switch (menuitem.key) { var keyparts = menuitem.key.split("||");
case "app:help": var cmd = keyparts[1];
var helpurl = that.$store.state.helpUrl + menuitem.data; var data = keyparts[2] ? keyparts[2] : null;
switch (cmd) {
case "help":
var helpurl = that.$store.state.helpUrl + data;
window.open(helpurl, "_blank"); window.open(helpurl, "_blank");
break; break;
case "app:logout": case "logout":
processLogout(); processLogout();
that.$router.replace({ name: "login" }); that.$router.replace({ name: "login" });
break; break;
case "nav":
that.$router.replace({ name: data });
break;
default: default:
alert( alert(
"gzmenu:handleClick - unrecognized command [" + menuitem.key + "]" "gzmenu:handleClick - unrecognized command [" + menuitem.key + "]"

View File

@@ -70,9 +70,10 @@ export default function initialize() {
addNavItem(locale.get("Operations"), "cogs", "ops"); addNavItem(locale.get("Operations"), "cogs", "ops");
} }
//MOVED TO MENU OUT OF NAV
//Everyone can see about and logout //Everyone can see about and logout
addNavItem(locale.get("HelpAboutAyaNova"), "info-circle", "/about"); // addNavItem(locale.get("HelpAboutAyaNova"), "info-circle", "/about");
addNavItem(locale.get("Logout"), "sign-out-alt", "/login"); // addNavItem(locale.get("Logout"), "sign-out-alt", "/login");
}) })
.catch(function handleIntializeError(error) { .catch(function handleIntializeError(error) {
store.commit("logItem", "Initialize::() ltfetch -> error" + error); store.commit("logItem", "Initialize::() ltfetch -> error" + error);

View File

@@ -2,7 +2,7 @@
<v-layout row> <v-layout row>
<v-flex> <v-flex>
<v-card> <v-card>
<v-toolbar> <!-- <v-toolbar>
<v-avatar size="64px" tile> <v-avatar size="64px" tile>
<img :src="require('../assets/bw-logo.svg')" alt="AyaNova"> <img :src="require('../assets/bw-logo.svg')" alt="AyaNova">
</v-avatar> </v-avatar>
@@ -11,7 +11,7 @@
<v-btn large icon to="/log"> <v-btn large icon to="/log">
<v-icon>fa-glasses</v-icon> <v-icon>fa-glasses</v-icon>
</v-btn> </v-btn>
</v-toolbar> </v-toolbar>-->
<v-list two-line subheader> <v-list two-line subheader>
<v-subheader>{{ this.$gzlocale.get("ClientApp")}}</v-subheader> <v-subheader>{{ this.$gzlocale.get("ClientApp")}}</v-subheader>
<v-list-tile avatar> <v-list-tile avatar>
@@ -106,6 +106,13 @@
<script> <script>
/* Xeslint-disable */ /* Xeslint-disable */
import aboutInfo from "../api/aboutinfo"; import aboutInfo from "../api/aboutinfo";
function clickHandler(item) {
if (!item.disabled && !item.key.startsWith("app||")) {
alert("about.vue::context click: " + item.key);
}
}
export default { export default {
beforeCreate() { beforeCreate() {
this.$gzlocale.fetch([ this.$gzlocale.fetch([
@@ -128,10 +135,19 @@ export default {
}, },
created() { created() {
this.$gzevent.$emit("menu-change", { this.$gzevent.$emit("menu-change", {
isMain: true, isMain: false,
icon: "fa-info-circle", icon: "fa-info-circle",
title: this.$gzlocale.get("HelpAboutAyaNova") title: this.$gzlocale.get("HelpAboutAyaNova"),
menuItems: [
{
title: this.$gzlocale.get("log"),
icon: "glasses",
surface: true,
key: "app||nav||log"
}
]
}); });
this.$gzevent.$on("menu-click", clickHandler);
this.clientInfo.version = aboutInfo.version; this.clientInfo.version = aboutInfo.version;
this.$gzapi this.$gzapi
@@ -143,6 +159,9 @@ export default {
throw error; throw error;
}); });
}, },
beforeDestroy() {
this.$gzevent.$off("menu-click", clickHandler);
},
data() { data() {
return { return {
serverInfo: { license: { license: {} } }, serverInfo: { license: { license: {} } },

View File

@@ -131,7 +131,7 @@
<script> <script>
/* xeslint-disable */ /* xeslint-disable */
function clickHandler(item) { function clickHandler(item) {
if (!item.disabled && !item.key.startsWith("app:")) { if (!item.disabled && !item.key.startsWith("app||")) {
alert("inventory-widget-edit.vue::context click: " + item.key); alert("inventory-widget-edit.vue::context click: " + item.key);
} }
} }
@@ -185,19 +185,19 @@ export default {
title: this.$gzlocale.get("Save"), title: this.$gzlocale.get("Save"),
icon: "save", icon: "save",
surface: true, surface: true,
key: "save" key: "inventory-widget-edit||save"
}, },
{ {
title: this.$gzlocale.get("Delete"), title: this.$gzlocale.get("Delete"),
icon: "trash-alt", icon: "trash-alt",
surface: true, surface: true,
key: "delete" key: "inventory-widget-edit||delete"
}, },
{ divider: true, inset: false }, { divider: true, inset: false },
{ {
title: this.$gzlocale.get("Duplicate"), title: this.$gzlocale.get("Duplicate"),
icon: "clone", icon: "clone",
key: "duplicate" key: "inventory-widget-edit||duplicate"
} }
] ]
}); });