RouteMeHome/get_my
1
0
Fork 0
mirror of https://gitlab.com/bmcgonag/get_my.git synced 2026-03-27 00:08:49 +00:00
Code Issues 1 Projects Releases Packages Wiki Activity Actions

Updated product management to use newer materialize libraries

Browse source
This commit is contained in:
Brian McGonagill 2024-07-23 12:01:33 -05:00
parent df3eb4ff08
commit 27b3c82faf
7 changed files with 65 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

28
client/AdminMgmt/ProductMgmt/prodMgmtForm.html
View file

@ -1,35 +1,30 @@
<template name="prodMgmtForm"> <template name="prodMgmtForm">
<h4>Product Management</h4> <h4>Product Management</h4>
<form action="submit" class="prodInputForm"> {{#if Template.subscriptionsReady}}
<div class="row"> <form action="submit" class="row prodInputForm" style="gap: 1em;">
<div class="col s12 m6 l6 input-field"> <div class="col s12 m6 l6 input-field outlined">
<input type="text" class="prodName" style="{{#if $eq prodNameErr true}}border: 2px solid red;{{/if}}" id="prodName" /> <input type="text" class="prodName" style="{{#if $eq prodNameErr true}}border: 2px solid red;{{/if}}" id="prodName" />
<label for="prodName">Name*</label> <label for="prodName">Name*</label>
</div> </div>
<div class="col s12 m6 l6 input-field"> <div class="col s12 m6 l6 input-field outlined">
<select name="prodStore" id="prodStore" class="prodStore"> <select name="prodStore" id="prodStore">
<option value="" disabled selected></option> <option value="" disabled selected></option>
<option id="addNewStore" value="addNewStore" class="modal-trigger" data-target="modalStore">+ Add New Store</option>
{{#each stores}} {{#each stores}}
<option value="{{storeName}}">{{storeName}}</option> <option value="{{storeName}}">{{storeName}}</option>
{{/each}} {{/each}}
<option id="addNewStore" value="addNewStore">Add New Store</option>
</select> </select>
<label for="prodStore">Store</label> <label for="prodStore">Store</label>
</div> </div>
</div> <div class="col s12 m12 l12">
<div class="row">
<div class="col s6 m6 l6">
<a class="waves-effect waves-light btn cancelProdMgmt orange">Cancel</a>
</div>
<div class="col s6 m6 l6">
{{#if $eq prodEditMode false}} {{#if $eq prodEditMode false}}
<a class="waves-effect waves-light btn saveProdMgmt green right">Add</a> <a class="waves-effect waves-light btn saveProdMgmt green white-text right">Add</a>
{{else}} {{else}}
<a class="waves-effect waves-light btn editProdMgmt blue right">Save Edits</a> <a class="waves-effect waves-light btn editProdMgmt blue white-text right">Save Edits</a>
{{/if}} {{/if}}
</div> </div>
</div>
</form> </form>
{{/if}}
<!-- Store Modal Structure --> <!-- Store Modal Structure -->
<div id="modalStore" class="modal"> <div id="modalStore" class="modal">
@ -38,7 +33,8 @@
{{> storeMgmtForm}} {{> storeMgmtForm}}
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Done</a> <a href="#!" class="modal-close waves-effect green white-text btn">Done</a>
</div> </div>
</div> </div>
{{> snackbar}}
</template> </template>

58
client/AdminMgmt/ProductMgmt/prodMgmtForm.js
View file

@ -1,5 +1,6 @@
import { Products } from '../../../imports/api/products.js'; import { Products } from '../../../imports/api/products.js';
import { Stores } from '../../../imports/api/stores.js'; import { Stores } from '../../../imports/api/stores.js';
import { M } from '../../lib/assets/materialize.js';
Template.prodMgmtForm.onCreated(function() { Template.prodMgmtForm.onCreated(function() {
this.subscribe("myProducts"); this.subscribe("myProducts");
@ -7,11 +8,14 @@ Template.prodMgmtForm.onCreated(function() {
}); });
Template.prodMgmtForm.onRendered(function() { Template.prodMgmtForm.onRendered(function() {
Meteor.setTimeout(function() { setTimeout(function() {
$('select').formSelect(); var elems = document.querySelectorAll('select');
var instances = M.FormSelect.init(elems, {});
}, 200); }, 200);
$('select').formSelect();
$('.modal').modal(); var elemm = document.querySelectorAll('.modal');
var instancem = M.Modal.init(elemm, {});
Session.set("prodEditMode", false); Session.set("prodEditMode", false);
}); });
@ -43,12 +47,12 @@ Template.prodMgmtForm.events({
} else { } else {
Meteor.call('add.product', name, store, function(err, result) { Meteor.call('add.product', name, store, function(err, result) {
if (err) { if (err) {
// console.log(" ERROR: can't add product: " + err); console.log(" ERROR: can't add product: " + err);
} else { } else {
// console.log(" SUCCESS adding product.");
$("#prodName").val(""); $("#prodName").val("");
$("#prodStore").val(""); let elemse = document.querySelectorAll('select');
$('select').formSelect(); let instancese = M.FormSelect.init(elemse, {});
showSnackbar("Succesffuly Added Product!", "green");
} }
}); });
} }
@ -71,11 +75,9 @@ Template.prodMgmtForm.events({
if (err) { if (err) {
// console.log(" ERROR: can't add product: " + err); // console.log(" ERROR: can't add product: " + err);
} else { } else {
// console.log(" SUCCESS adding product.");
$("#prodName").val(""); $("#prodName").val("");
$("#prodStore").val("");
$('select').formSelect();
Session.set("prodEditMode", false); Session.set("prodEditMode", false);
showSnackbar("Product Edited Successfully!", "green");
} }
}); });
} }
@ -87,7 +89,7 @@ Template.prodMgmtForm.events({
let store = $("#prodStore").val(); let store = $("#prodStore").val();
let prodId = Session.get("prodEditId"); let prodId = Session.get("prodEditId");
let prodEditMode = Session.get("prodEditMode"); let prodEditMode = Session.get("prodEditMode");
console.log(" ---- got the submit event for products."); // console.log(" ---- got the submit event for products.");
if (store == null) { if (store == null) {
store = ""; store = "";
@ -100,46 +102,38 @@ Template.prodMgmtForm.events({
if (prodEditMode == true) { if (prodEditMode == true) {
Meteor.call('edit.product', prodId, name, store, function(err, result) { Meteor.call('edit.product', prodId, name, store, function(err, result) {
if (err) { if (err) {
// console.log(" ERROR: can't add product: " + err); console.log(" ERROR: can't add product: " + err);
} else { } else {
// console.log(" SUCCESS adding product.");
$("#prodName").val(""); $("#prodName").val("");
$("#prodStore").val(""); showSnackbar("Successfully Edited Product!", "green");
$('select').formSelect();
} }
}); });
} else { } else {
Meteor.call('add.product', name, store, function(err, result) { Meteor.call('add.product', name, store, function(err, result) {
if (err) { if (err) {
// console.log(" ERROR: can't add product: " + err); console.log(" ERROR: can't add product: " + err);
} else { } else {
// console.log(" SUCCESS adding product.");
$("#prodName").val(""); $("#prodName").val("");
$("#prodStore").val(""); showSnackbar("Product Added Succssfully!", "green");
$('select').formSelect();
} }
}); });
} }
} }
} }
}, },
'click .cancelProdMgmt' (event) {
event.preventDefault();
$("#prodName").val("");
$("#prodStore").val("");
$('select').formSelect();
},
'change #prodStore' (event) { 'change #prodStore' (event) {
event.preventDefault(); // event.preventDefault();
console.log("detected event");
let val = $("#prodStore").val(); let val = $("#prodStore").val();
console.log("Value detected: " + val);
if (val == "addNewStore") { if (val == "addNewStore") {
console.log("got the request for modal.");
$("#prodStore").val(""); $("#prodStore").val("");
// open a modal to enter store information. // open modal to add a new store
$('#modalStore').modal('open'); let elemmm = document.getElementById('modalStore');
let storeModal = M.Modal.getInstance(elemmm);
storeModal.open();
} }
}, },
'click .modal-close' (event) {
$('select').formSelect();
}
}); });

2
client/AdminMgmt/ProductMgmt/prodMgmtTbl.html
View file

@ -23,7 +23,7 @@
<td>{{prodName}} </td> <td>{{prodName}} </td>
<td>{{prodStore}}</td> <td>{{prodStore}}</td>
<td> <td>
<i class="material-icons clickable deleteProduct">delete</i> <i class="material-icons clickable deleteProduct modal-trigger" data-target="modalDelete">delete</i>
<i class="material-icons clickable editProduct">edit</i> <i class="material-icons clickable editProduct">edit</i>
</td> </td>
</tr> </tr>

7
client/AdminMgmt/ProductMgmt/prodMgmtTbl.js
View file

@ -1,13 +1,11 @@
import { Products } from '../../../imports/api/products.js'; import { Products } from '../../../imports/api/products.js';
import { M } from '../../lib/assets/materialize.js';
Template.prodMgmtTbl.onCreated(function() { Template.prodMgmtTbl.onCreated(function() {
this.subscribe("myProducts"); this.subscribe("myProducts");
}); });
Template.prodMgmtTbl.onRendered(function() { Template.prodMgmtTbl.onRendered(function() {
Meteor.setTimeout(function() {
$('.tooltipped').tooltip();
}, 150);
Session.set("searchProds", false); Session.set("searchProds", false);
}); });
@ -32,7 +30,6 @@ Template.prodMgmtTbl.events({
Session.set("method", "delete.product"); Session.set("method", "delete.product");
Session.set("item", this.prodName); Session.set("item", this.prodName);
Session.set("view", "Products");; Session.set("view", "Products");;
$('#modalDelete').modal('open');
}, },
'click .editProduct' (event) { 'click .editProduct' (event) {
event.preventDefault(); event.preventDefault();
@ -41,7 +38,7 @@ Template.prodMgmtTbl.events({
let prodInfo = Products.findOne({ _id: this._id }); let prodInfo = Products.findOne({ _id: this._id });
$("#prodName").val(prodInfo.prodName); $("#prodName").val(prodInfo.prodName);
$("#prodStore").val(prodInfo.prodStore); $("#prodStore").val(prodInfo.prodStore);
$('select').formSelect(); // $('select').formSelect();
}, },
'click #filterProds' (event) { 'click #filterProds' (event) {
event.preventDefault(); event.preventDefault();

12
client/AdminMgmt/StoreMgmt/storeMgmtForm.html
View file

@ -1,17 +1,15 @@
<template name="storeMgmtForm"> <template name="storeMgmtForm">
<form id="storeForm" action="submit"> <form id="storeForm" action="submit" class="row" style="gap: 1em;">
<div class="row"> <div class="col s8 m10 l10 input-field outlined">
<div class="col s8 m10 l10 input-field">
<input type="text" class="storeName" id="storeName" /> <input type="text" class="storeName" id="storeName" />
<label for="storeName">Name</label> <label for="storeName">Name</label>
</div> </div>
<div class="col s4 m2 l2 input-field"> <div class="col s4 m2 l2">
{{#if $eq editModeStore false}} {{#if $eq editModeStore false}}
<a class="waves-effect waves-light btn saveStoreMgmt green right">Add</a> <a class="waves-effect waves-light btn saveStoreMgmt green white-text right">Add</a>
{{else}} {{else}}
<a class="waves-effect waves-light btn editStoreMgmt blue right">Rename</a> <a class="waves-effect waves-light btn editStoreMgmt blue white-text right">Rename</a>
{{/if}} {{/if}}
</div> </div>
</div>
</form> </form>
</template> </template>

2
client/General/DeleteConfModal/deleteConfirmationModal.js
View file

@ -26,7 +26,7 @@ Template.deleteConfirmationModal.events({
if (err) { if (err) {
console.log(" ERROR deleting item from modal: " + err); console.log(" ERROR deleting item from modal: " + err);
} else { } else {
// console.log(" SUCCESSFULLY deleted."); console.log(" SUCCESSFULLY deleted.");
// put the new modal open / close here // put the new modal open / close here
// $('#modalDelete').modal('close'); // $('#modalDelete').modal('close');
} }

3
client/ListItems/listItemsTbl.js
View file

@ -71,8 +71,5 @@ Template.listItemsTbl.events({
Session.set("method", "delete.listItem"); Session.set("method", "delete.listItem");
Session.set("item", this.itemName); Session.set("item", this.itemName);
Session.set("view", "List Items"); Session.set("view", "List Items");
// put the new modal js here
// $('#modalDelete').modal('open');
}, },
}); });