This commit is contained in:
@@ -31,6 +31,7 @@ All platforms and browsers
|
||||
- IMPLEMENTED / NOT TESTED: Login, doesn't have any ui if failed login, maybe a red frowny face icon? :)
|
||||
- IMPLEMENTED / NOT TESTED: need clear buttons on pw and login
|
||||
- IMPLEMENTED / NOT TESTED: Numeric input fields don't give numeric keyboard
|
||||
- Navigation guard: navigate away with unsaved changes should warn and prevent but have option to continue anyway
|
||||
- Save on broken rules in Widget edit form it's not clear that save does nothing if there are broken rules. Button should be deactivated or there should be a message if you click on it or something.
|
||||
- Red outline and inactive seems ideal
|
||||
- Save button placement, not sure I like having to scroll down the page to save on small format screens where there is potentially going to be a *lot* of scrolling needed which hides the info box etc
|
||||
@@ -70,6 +71,22 @@ All platforms and browsers
|
||||
- Move help menu item in shell into menu as bottom item instead
|
||||
- TODO: CODE THIS FOR THIS MENU ISSUE
|
||||
- Just added ability to send info to store that is picked up by nav menu
|
||||
- REQUIREMENTS
|
||||
- Global Help link on *every* page
|
||||
- will change on each page
|
||||
- Global Logout link on every page
|
||||
- Unchanging
|
||||
- Probably more global page items
|
||||
- Menu supports dividers
|
||||
- Menu has a context section and a global section
|
||||
- One set of menu items only not two separate ones internally
|
||||
- Context items are at the top, then a divider, then the global ones at the bottom
|
||||
- Caller sets if it's contextual or not to adapt colour of app bar, but otherwise it's the same exact menu all the time
|
||||
- Caller should be able to set items colour so (for example) Save can be redded out when not savable
|
||||
- Caller should be able to set the ENABLED property so it can handle different states
|
||||
- Maybe a change item event that takes a key and updates it rather than refreshing the whole menu basis on state change?
|
||||
- I.E. so that can change save button enabled and colour when state of form broken rules changes?
|
||||
|
||||
|
||||
|
||||
iPad
|
||||
|
||||
@@ -56,35 +56,23 @@
|
||||
</v-list-tile>
|
||||
</template>
|
||||
</v-list>-->
|
||||
<!-- MAIN MENU -->
|
||||
<v-list v-if="appBar.isMain">
|
||||
<v-list-tile
|
||||
v-for="item in appBar.mainMenuItems"
|
||||
:key="item.key"
|
||||
@click="$gzevent.$emit('menu-click',item.key)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-if="item.icon">{{ "fa-" + item.icon }}</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list>
|
||||
<!-- CONTEXT MENU -->
|
||||
<v-list v-if="!appBar.isMain">
|
||||
<v-list-tile
|
||||
v-for="item in appBar.contextMenuItems"
|
||||
:key="item.key"
|
||||
@click="$gzevent.$emit('menu-click',item.key)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-if="item.icon">{{ "fa-" + item.icon }}</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
|
||||
<!-- MENU -->
|
||||
<v-list>
|
||||
<template v-for="(item,index) in appBar.menuItems">
|
||||
<v-subheader v-if="item.header" :key="index">{{ item.header }}</v-subheader>
|
||||
|
||||
<v-divider v-else-if="item.divider" :key="index" :inset="item.inset"></v-divider>
|
||||
|
||||
<v-list-tile v-else :key="item.key" @click="$gzevent.$emit('menu-click',item.key)">
|
||||
<v-list-tile-action>
|
||||
<v-icon v-if="item.icon">{{ "fa-" + item.icon }}</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
</v-toolbar>
|
||||
@@ -122,75 +110,67 @@ export default {
|
||||
isMain: true,
|
||||
icon: "",
|
||||
title: "",
|
||||
contextMenuItems: [],
|
||||
mainMenuItems: []
|
||||
},
|
||||
items: [
|
||||
{ header: "Today" },
|
||||
{
|
||||
avatar: "https://cdn.vuetifyjs.com/images/lists/1.jpg",
|
||||
title: "Brunch this weekend?",
|
||||
subtitle:
|
||||
"<span class='text--primary'>Ali Connors</span> — I'll be in your neighborhood doing errands this weekend. Do you want to hang out?"
|
||||
},
|
||||
{ divider: true, inset: true },
|
||||
{
|
||||
avatar: "https://cdn.vuetifyjs.com/images/lists/2.jpg",
|
||||
title: 'Summer BBQ <span class="grey--text text--lighten-1">4</span>',
|
||||
subtitle:
|
||||
"<span class='text--primary'>to Alex, Scott, Jennifer</span> — Wish I could come, but I'm out of town this weekend."
|
||||
},
|
||||
{ divider: true, inset: true },
|
||||
{
|
||||
avatar: "https://cdn.vuetifyjs.com/images/lists/3.jpg",
|
||||
title: "Oui oui",
|
||||
subtitle:
|
||||
"<span class='text--primary'>Sandra Adams</span> — Do you have Paris recommendations? Have you ever been?"
|
||||
}
|
||||
]
|
||||
menuItems: []
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
//////////////////////////////////
|
||||
// MENU DISPLAY EVENT HANDLER
|
||||
//subscribe to menu changes
|
||||
//
|
||||
var that = this;
|
||||
this.$gzevent.$on("menu-change", function(ctx) {
|
||||
that.appBar.isMain = ctx.isMain;
|
||||
that.appBar.icon = ctx.icon;
|
||||
that.appBar.title = ctx.title;
|
||||
if (!ctx.isMain) {
|
||||
//context menu so handle accordingly
|
||||
that.appBar.contextMenuItems = ctx.contextMenuItems
|
||||
? ctx.contextMenuItems
|
||||
: [];
|
||||
} else {
|
||||
//main menu, put in the standard items that always show
|
||||
that.appBar.mainMenuItems = [
|
||||
{
|
||||
title: this.$gzlocale.get("Logout"),
|
||||
icon: "sign-out-alt",
|
||||
key: "app:logout"
|
||||
}
|
||||
];
|
||||
//If other items specified add them above the standard ones
|
||||
var hasSpecialHelpLink = false;
|
||||
if (ctx.mainMenuItems) {
|
||||
that.appBar.mainMenuItems = ctx.mainMenuItems.concat(
|
||||
that.appBar.mainMenuItems
|
||||
);
|
||||
}
|
||||
that.appBar.menuItems = [];
|
||||
|
||||
//Now see if there is a help item already that is contextual or if not then add a generic link to the start of docs
|
||||
TODO: check here if there is already an item that has a key that starts with "app:help:" instead of using the specialHelpLInk
|
||||
if (!hasSpecialHelpLink) {
|
||||
that.appBar.mainMenuItems.push({
|
||||
title: this.$gzlocale.get("MenuHelp"),
|
||||
icon: "question-circle",
|
||||
key: "app:help:index.html"
|
||||
});
|
||||
}
|
||||
//CONTEXT TOP PORTION
|
||||
//populate the context portion of the menu so handle accordingly
|
||||
if (ctx.menuItems) {
|
||||
that.appBar.menuItems = ctx.menuItems;
|
||||
//DIVIDER
|
||||
//Insert the devider between context and global items
|
||||
that.appBar.menuItems.push({ divider: true, inset: true });
|
||||
}
|
||||
});
|
||||
|
||||
//GLOBAL BOTTOM PORTION
|
||||
|
||||
//Global sub-heading
|
||||
//Likely won't want this but here anyway to see
|
||||
that.appBar.menuItems.push({ header: "GLOBAL" });
|
||||
|
||||
//global menu items
|
||||
|
||||
//Logout
|
||||
that.appBar.menuItems.push({
|
||||
title: this.$gzlocale.get("Logout"),
|
||||
icon: "sign-out-alt",
|
||||
key: "app:logout"
|
||||
});
|
||||
|
||||
//Help
|
||||
//There may already be a context help so double check that first if not then add a generic link to the start of docs
|
||||
var helpItem = that.$_.find(that.appBar.menuItems, function(o) {
|
||||
if (!o.key) {
|
||||
return false;
|
||||
}
|
||||
return o.key.startsWith("app:help:");
|
||||
});
|
||||
|
||||
if (!helpItem) {
|
||||
that.appBar.menuItems.push({
|
||||
title: this.$gzlocale.get("MenuHelp"),
|
||||
icon: "question-circle",
|
||||
key: "app:help:index.html"
|
||||
});
|
||||
}
|
||||
}); //END OF EVENT
|
||||
|
||||
//////////////////////////////////
|
||||
//CLICK EVENT HANDLER
|
||||
//
|
||||
this.$gzevent.$on("menu-click", function(key) {
|
||||
if (key.startsWith("app:")) {
|
||||
if (key.startsWith("app:help:")) {
|
||||
|
||||
@@ -179,7 +179,7 @@ export default {
|
||||
isMain: false,
|
||||
icon: "fa-splotch",
|
||||
title: this.$gzlocale.get("Widget"),
|
||||
contextMenuItems: [
|
||||
menuItems: [
|
||||
{
|
||||
title: this.$gzlocale.get("Duplicate"),
|
||||
icon: "clone",
|
||||
|
||||
Reference in New Issue
Block a user