Added Menu List and the Menu Table view.

This commit is contained in:
Brian McGonagill 2022-08-26 17:10:05 -05:00
parent 25ce44d9cf
commit 3290b3086a
16 changed files with 401 additions and 0 deletions

View file

@ -9,6 +9,7 @@
<ul class="right hide-on-med-and-down"> <ul class="right hide-on-med-and-down">
{{#if currentUser}} {{#if currentUser}}
<li><a href="#" id="mylists" class="navBtn">My Lists</a></li> <li><a href="#" id="mylists" class="navBtn">My Lists</a></li>
<li><a href="#" id="mymenus" class="navBtn">My Menus</a></li>
{{#if isInRole 'systemadmin'}} {{#if isInRole 'systemadmin'}}
<li><a href="#" id="manage" class="navBtn">Manage</a></li> <li><a href="#" id="manage" class="navBtn">Manage</a></li>
{{/if}} {{/if}}
@ -22,6 +23,7 @@
<ul class="sidenav" id="mobile-demo"> <ul class="sidenav" id="mobile-demo">
{{#if currentUser}} {{#if currentUser}}
<li><a href="#!" id="mylists" class="navBtn">My Lists</a></li> <li><a href="#!" id="mylists" class="navBtn">My Lists</a></li>
<li><a href="#!" id="mymenus" class="navBtn">My Menus</a></li>
{{#if isInRole 'systemadmin'}} {{#if isInRole 'systemadmin'}}
<li><a href="#!" id="manage" class="navBtn">Manage</a></li> <li><a href="#!" id="manage" class="navBtn">Manage</a></li>
{{/if}} {{/if}}

View file

@ -0,0 +1,5 @@
<template name="menuItems">
{{> menuItemsForm}}
<hr>
{{> menuItemsTbl}}
</template>

View file

@ -0,0 +1,15 @@
Template.menuItems.onCreated(function() {
});
Template.menuItems.onRendered(function() {
});
Template.menuItems.helpers({
});
Template.menuItems.events({
});

View file

@ -0,0 +1,47 @@
import { MenuItems } from '../../imports/api/menuItems.js';
import { Menus } from '../../imports/api/menu.js';
Template.menuItemsForm.onCreated(function() {
this.subscribe("myMenus");
this.subscribe("myMenuItems", Session.get("menuId"));
});
Template.menuItemsForm.onRendered(function() {
$('.datepicker').datepicker();
Session.set("menuItemErr", false);
});
Template.menuItemsForm.helpers({
menuItemErr: function() {
return Session.get("menuItemErr");
},
menuName: function() {
let menuId = Session.get("menuId");
let menuInfo = Menus.findOne({ _id: menuId });
let menuName = menuInfo.menuName;
return menuName;
}
});
Template.menuItemsForm.events({
'click .saveMenuItem' (event) {
event.preventDefault();
let menuItem = $("#menuItemInp").val();
let dateSrv = $("#dateServed").val();
let menuId = Session.get("menuId");
if (menuItem == null || menuItem == "") {
Session.set("menuItemErr", true);
} else {
Meteor.call('add.menuItem', menuItem, dateSrv, menuId, function(err, result) {
if (err) {
console.log(" ERROR adding menu item: " + err);
} else {
console.log(" SUCCESS adding menu item.");
$("#menuItemInp").val("");
$("#dateServed").val("");
}
});
}
}
});

View file

@ -0,0 +1,28 @@
<template name="menuItemsTbl">
<div class="row">
<div class="col s12">
<table>
{{#each thisMenuItems}}
<tr class="clickable">
<td>
<span>
{{#if $eq itemMade true}}
<strike>{{itemName}}</strike>
{{else}}
{{itemName}}
{{/if}}
</span>
</td>
<td>
{{serveDate}}
</td>
<td>
<i class="material-icons clickable deleteMenuItem right">delete</i>
</td>
</tr>
{{/each}}
</table>
</div>
</div>
{{> deleteConfirmationModal}}
</template>

View file

@ -0,0 +1,21 @@
import { MenuItems } from '../../imports/api/menuItems.js';
Template.menuItemsTbl.onCreated(function() {
this.autorun( () => {
this.subscribe("myMenuItems", Session.get("menuId"));
});
});
Template.menuItemsTbl.onRendered(function() {
});
Template.menuItemsTbl.helpers({
thisMenuItems: function() {
return MenuItems.find({});
}
});
Template.menuItemsTbl.events({
});

View file

@ -0,0 +1,20 @@
<template name="menuItemsForm">
<h5>{{menuName}}</h5>
<form action="" class="menuItemFrm" id="menuItemFrm">
<div class="row">
<div class="col s8 input-field">
<input type="text" class="menuItemInp" style="{{#if $eq menuItemErr true}}border: 2px solid red{{/if}}" id="menuItemInp" />
<label for="menuItemInp">Add Menu Item</label>
</div>
<div class="col s4 input-field">
<input type="text" class="datepicker" id="dateServed" />
<label for="dateserved">Date to Serve</label>
</div>
</div>
<div class="row">
<div class="col s12">
<a class="waves-effect waves-light btn saveMenuItem green right">Add</a>
</div>
</div>
</form>
</template>

View file

@ -0,0 +1,26 @@
<template name="addMenuModal">
<div id="modalMenu" class="modal">
<div class="modal-content">
<h4>Add New Menu</h4>
<form action="submit" class="menuAdd">
<div class="row">
<div class="col s12 input-field">
<input type="text" class="menuNameInp" style="{{#if $eq menuNameErr true}}border: 2px solid red{{/if}}" id="menuNameInp" />
<label for="menuNameInp">Menu Name</label>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<div class="row">
<div class="col s12">
{{#if $eq editMode false}}
<a class="modal-close waves-effect waves-light btn saveMenu green right">Add</a>
{{else}}
<a class="modal-close waves-effect waves-light btn renameMenu blue right">Rename</a>
{{/if}}
</div>
</div>
</div>
</div>
</template>

View file

@ -0,0 +1,42 @@
import { Menus } from '../../imports/api/menu.js';
Template.addMenuModal.onCreated(function() {
this.subscribe("myMenus");
});
Template.addMenuModal.onRendered(function() {
Session.set("menuNameErr", false);
$('.modal').modal();
});
Template.addMenuModal.helpers({
menuNameErr: function() {
return Session.get("menuNameErr");
},
editMode: function() {
return Session.get("menuEditMode");
}
});
Template.addMenuModal.events({
'click .saveMenu' (event) {
event.preventDefault();
let menuName = $("#menuNameInp").val();
if (menuName == "" || menuName == null) {
Session.set("menuNameErr", true);
} else {
Meteor.call("add.menu", menuName, function(err, result) {
if (err) {
console.log(" ERROR adding menu: " + err);
} else {
console.log(" SUCCESS adding menu.");
$("#menuNameInp").val("");
}
});
}
},
'click .renameMenu' (event) {
event.preventDefault();
},
});

View file

@ -0,0 +1,3 @@
<template name="mainMenu">
{{> mainMenuTbl}}
</template>

15
client/Menus/mainMenu.js Normal file
View file

@ -0,0 +1,15 @@
Template.mainMenu.onCreated(function() {
});
Template.mainMenu.onRendered(function() {
});
Template.mainMenu.helpers({
});
Template.mainMenu.events({
});

View file

@ -0,0 +1,18 @@
<template name="mainMenuTbl">
<div class="row">
<div class="col s12">
<ul class="collection">
{{#each myMenus}}
<li class="collection-item clickable" id="{{this._id}}">
{{menuName}}
<i class="material-icons clickable markComplete right" id="check_{{this._id}}">check</i>
</li>
{{/each}}
<li class="collection-item clickable addNew" id="addMenu"> + Add New Menu</li>
</ul>
</div>
</div>
{{> addMenuModal}}
{{> snackbar}}
</template>

View file

@ -0,0 +1,40 @@
import { Menus } from '../../imports/api/menu.js';
Template.mainMenuTbl.onCreated(function() {
this.subscribe("myMenus");
});
Template.mainMenuTbl.onRendered(function() {
Session.set("menuEditMode", false);
});
Template.mainMenuTbl.helpers({
myMenus: function() {
return Menus.find({});
}
});
Template.mainMenuTbl.events({
// 'click #addMenu' (event) {
// event.preventDefault();
// $('#modalMenu').modal('open');
// },
'click li.collection-item' (event) {
event.preventDefault();
let sender = event.target;
// console.log("Sender origination from: ");
// console.log(sender.localName);
if (sender.localName == "li") {
let menuId = event.currentTarget.id;
if (menuId == "addMenu") {
$('#modalMenu').modal('open');
} else {
console.log("menuId is: " + menuId);
Session.set("menuId", menuId);
Meteor.setTimeout(function() {
FlowRouter.go('/menuitems');
}, 100);
}
}
},
});

87
imports/api/menuItems.js Normal file
View file

@ -0,0 +1,87 @@
import { Meteor } from 'meteor/meteor';
import { Mongo } from 'meteor/mongo';
import { check } from 'meteor/check';
export const MenuItems = new Mongo.Collection('menuitems');
MenuItems.allow({
insert: function(userId, doc){
// if use id exists, allow insert
return !!userId;
},
});
Meteor.methods({
'add.menuItem' (itemName, serveDate, menuId) {
check(itemName, String);
check(serveDate, String);
check(menuId, String);
if (!this.userId) {
throw new Meteor.Error('You are not allowed to add items. Make sure you are logged in with valid user credentials.');
}
return MenuItems.insert({
itemName: itemName,
serveDate: serveDate,
menuId: menuId,
addedBy: this.userId,
itemMade: false,
dateAddedtoMenu: new Date(),
});
},
'setMade.menuItem' (itemId) {
check(itemId, String);
if (!this.userId) {
throw new Meteor.Error('You are not allowed to set items as made. Make sure you are logged in with valid user credentials.');
}
return MenuItems.update({ _id: itemId }, {
$set: {
itemMade: true,
dateMade: new Date(),
}
});
},
'setNotMade.menuItem' (itemId) {
check(itemId, String);
if (!this.userId) {
throw new Meteor.Error('You are not allowed to set items as not made. Make sure you are logged in with valid user credentials.');
}
return MenuItems.update({ _id: itemId }, {
$set: {
itemMade: false,
dateUnMade: new Date(),
}
});
},
'edit.madeItem' (itemId, itemName, serveDate) {
check(itemId, String);
check(itemName, String);
check(serveDate, String);
if (!this.userId) {
throw new Meteor.Error('You are not allowed to edit menu items. Make sure you are logged in with valid user credentials.');
}
return MenuItems.update({ _id: itemId }, {
$set: {
itemName: itemName,
serveDate: serveDate,
}
});
},
'delete.menuItem' (itemId) {
check(itemId, String);
if (!this.userId) {
throw new Meteor.Error('You are not allowed to delete menu items. Make sure you are logged in with valid user credentials.');
}
return MenuItems.remove({ _id: itemId });
}
});

View file

@ -94,4 +94,18 @@ FlowRouter.route('/listItems', {
action() { action() {
BlazeLayout.render('MainLayout', { main: 'listItemsMain' }); BlazeLayout.render('MainLayout', { main: 'listItemsMain' });
} }
});
FlowRouter.route('/mymenus', {
name: 'mymenus',
action() {
BlazeLayout.render('MainLayout', { main: 'mainMenu' });
}
});
FlowRouter.route('/menuItems', {
name: 'menuItems',
action() {
BlazeLayout.render('MainLayout', { main: 'menuItems' });
}
}); });

View file

@ -6,6 +6,8 @@ import { Categories } from '../imports/api/category.js';
import { Locations } from '../imports/api/location.js'; import { Locations } from '../imports/api/location.js';
import { Lists } from '../imports/api/lists.js'; import { Lists } from '../imports/api/lists.js';
import { ListItems } from '../imports/api/listItems.js'; import { ListItems } from '../imports/api/listItems.js';
import { Menus } from '../imports/api/menu.js';
import { MenuItems } from '../imports/api/menuItems.js';
Meteor.publish("SystemConfig", function() { Meteor.publish("SystemConfig", function() {
try { try {
@ -66,4 +68,20 @@ Meteor.publish("myListItems", function(listId) {
} catch (error) { } catch (error) {
console.log(" ERROR pulling list items for this list: " + error); console.log(" ERROR pulling list items for this list: " + error);
} }
});
Meteor.publish("myMenus", function() {
try {
return Menus.find({ menuComplete: false });
} catch (error) {
console.log(" ERROR pulling menu info: " + error);
}
});
Meteor.publish("myMenuItems", function(menuId) {
try {
return MenuItems.find({ menuId: menuId });
} catch (error) {
console.log(" ERROR pulling list items for this list: " + error);
}
}); });