wcrisman/PetitTetonMeteor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added custom scroll bars and separated the table header from the tables for Sales and the Graphs tables.

Browse Source
This commit is contained in:
Wynne Crisman
2017-10-08 08:56:15 -07:00
parent 210517a5c2
commit b5ac9fd249
44 changed files with 4939 additions and 245 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
imports/ui/SalesSheetEditor.js
View File

@@ -83,11 +83,20 @@ Template.SalesSheetEditorProductSelection.onCreated(function() {
//Note: This is not reactive because we don't expect the sales sheet to change without closing the editor (re-editing would open a new template instance). Also, the sales sheet is a clone of the real one, so any changes will be lost if not saved.
this.salesSheet = this.data.salesSheet;
this.productNameFilter = new ReactiveVar("");
Session.set(PREFIX + "showHidden", false);
});
Template.SalesSheetEditorProductSelection.events({
'keyup input[name="productFilter"]': _.throttle(function(event, template) {
template.productNameFilter.set($(event.target).val());
})
}),
'click .clearFilter': function(event, template) {
template.$('input[name="productFilter"]').val('');
template.productNameFilter.set('');
},
'change input[name="showHidden"]': function(event, template) {
//console.log("changed " + $(event.target).prop('checked'));
Session.set(PREFIX + "showHidden", $(event.target).prop('checked'));
}
});
Template.SalesSheetEditorProductSelection.helpers({
products: function() {
@@ -95,7 +104,8 @@ Template.SalesSheetEditorProductSelection.helpers({
let filter = Template.instance().productNameFilter.get();
let products = salesSheet.products ? salesSheet.products : [];
let productMap = {};
let dbQuery;
let dbQuery = [];
let showHidden = Session.get(PREFIX + "showHidden");
//Map the products in the sales sheet by their id so we can later only add products to the list that are not on the sheet.
for(next of products) {
@@ -115,9 +125,17 @@ Template.SalesSheetEditorProductSelection.helpers({
}
regex += '.*';
dbQuery = {name: {$regex: regex, $options: 'i'}};
dbQuery.push({name: {$regex: regex, $options: 'i'}});
}
if(!showHidden) {
//Ignore any hidden elements by showing those not hidden, or those without the hidden field.
dbQuery.push({$or: [{hidden: false}, {hidden: {$exists:false}}]});
}
if(dbQuery.length > 0) dbQuery = {$and: dbQuery};
else dbQuery = {};
let allProducts = Meteor.collections.Products.find(dbQuery).fetch();
//Mark all the products that are currently included in the sheet and note the name they are included as.
@@ -145,18 +163,21 @@ Template.SalesSheetEditorProductSelectionRow.events({
let sheet = template.parentTemplate(1).salesSheet;
if(template.sheetProduct.get()) { //Remove the product from the sheet, or rename it (if the names don't match and the user clicked on the name instead of the checkbox).
// TODO: The commented code fails to detect newly added (to the sheet) products and instead of removing them, it seems to be changing the name when unchecking. This should also keep the element checked in the list instead of unchecking.
//If the click was on the product's name, and the product name is different from the name used for it in the sheet, then use the product name as the name in the sheet instead of removing it from the sheet.
if($(event.target).closest('.productName') && this.name != template.sheetProduct.get().name) {
template.sheetProduct.get().name = this.name;
}
else {
let index = sheet.products.indexOf(this.sheetProduct);
//if($(event.target).closest('.productName') && this.name !== template.sheetProduct.get().name) {
// template.sheetProduct.get().name = this.name;
//}
//else {
let index = sheet.products.indexOf(template.sheetProduct.get());
//Remove the product data from the sheet first. Template.parentData(1) is the sheet.
if(index >= 0) sheet.products.splice(index, 1);
//Clear the sheet product data from the actual product.
template.sheetProduct.set(undefined);
}
//}
}
else {
let sheetProduct = {name: this.name, productId: this._id, measureIds: this.measures.length > 2 ? this.measures.slice(0,2) : this.measures};
@@ -172,8 +193,19 @@ Template.SalesSheetEditorProductSelectionRow.helpers({
sheetProduct: function() {
return Template.instance().sheetProduct.get();
},
hidden: function() {
return this.hidden;
},
deactivated: function() {
return this.deactivated;
},
sheetProductName: function() {
return Template.instance().sheetProduct.get().name;
},
showAlternateName: function() {
let sheetProduct = Template.instance().sheetProduct.get();
return sheetProduct && sheetProduct.name !== this.name;
}
});
@@ -187,7 +219,7 @@ Template.SalesSheetEditorConfiguration.onCreated(function() {
//Note: This is not reactive because we don't expect the sales sheet to change without closing the editor (re-editing would open a new template instance). Also, the sales sheet is a clone of the real one, so any changes will be lost if not saved.
this.salesSheet = this.data.salesSheet;
this.measures = new ReactiveDict();
this.productsDependancy = new Tracker.Dependency;
this.productsDependency = new Tracker.Dependency;
Tracker.autorun(function() {
let measures = Meteor.collections.Measures.find({}).fetch();
@@ -197,12 +229,14 @@ Template.SalesSheetEditorConfiguration.onCreated(function() {
template.measures.set(measure._id, measure);
}
});
Session.set(PREFIX + "showMeasures", false);
});
Template.SalesSheetEditorConfiguration.onRendered(function() {
let template = this;
//Setup the drag and drop for the view.
this.drake = dragula([this.$('.configurationProductsListing')[0], this.$('.configurationControls')[0]], {
this.drake = dragula([this.$('.configurationProductsListing')[0], this.$('.tableControls')[0]], {
moves: function(el, container, handle, sibling) {
//Don't allow drag and drop of buttons - we want them to be clickable.
return !$(handle).hasClass("button");
@@ -212,7 +246,7 @@ Template.SalesSheetEditorConfiguration.onRendered(function() {
return (!sibling || !$(sibling).hasClass('newHeading'));
},
copy: function(el, source) {
return $(el).hasClass('heading') && $(source).hasClass('configurationControls');
return $(el).hasClass('heading') && $(source).hasClass('tableControls');
},
ignoreInputTextSelection: true
}).on('drop', function(el, target, source, sibling) {
@@ -225,7 +259,7 @@ Template.SalesSheetEditorConfiguration.onRendered(function() {
//Remove the element that was just added by the D&D. The element will be re-added by the template in just a moment. We need the template to add the element so that events will be properly handled for it by meteor.
el.parentNode.removeChild(el);
//Notify the template engine that the products list has changed so it can be re-rendered.
template.productsDependancy.changed();
template.productsDependency.changed();
}
}
else {
@@ -257,6 +291,9 @@ Template.SalesSheetEditorConfiguration.onDestroyed(function() {
this.drake.destroy();
});
Template.SalesSheetEditorConfiguration.events({
'change input[name="showMeasures"]': function(event, template) {
Session.set(PREFIX + "showMeasures", $(event.target).prop('checked'));
}
});
Template.SalesSheetEditorConfiguration.helpers({
products: function() {
@@ -264,7 +301,7 @@ Template.SalesSheetEditorConfiguration.helpers({
let products = template.salesSheet.products;
//Mark this call as depending on the products array. When we change the array later, we will call changed() on the dependency and it will trigger this function (and the calling template setup) to be re-run.
template.productsDependancy.depend();
template.productsDependency.depend();
return products;
}
@@ -295,7 +332,7 @@ Template.SalesSheetEditorConfigurationRow.onCreated(function() {
}
else {
template.parentTemplate(1).salesSheet.products.splice(index, 1);
template.parentTemplate(1).productsDependancy.changed();
template.parentTemplate(1).productsDependency.changed();
}
template.$('.heading .nameEditor, .heading .headingNameRow').removeClass('edit');
@@ -332,10 +369,13 @@ Template.SalesSheetEditorConfigurationRow.helpers({
},
isProduct: function() {
return !!this.productId;
},
showMeasures: function() {
return Session.get(PREFIX + "showMeasures");
}
});
Template.SalesSheetEditorConfigurationRow.events({
'click .heading .name': function(event, template) {
'dblclick .heading .name': function(event, template) {
template.$('.nameEditor, .headingNameRow').addClass('edit');
template.$('input[name="name"]').select();
},
@@ -360,7 +400,7 @@ Template.SalesSheetEditorConfigurationRow.events({
'click .heading .reject': function(event, template) {
template.handleHeaderEditorCancelAndClose();
},
'click .product .name': function(event, template) {
'dblclick .product .name': function(event, template) {
template.$('.nameEditor, .name').addClass('edit');
template.$('input[name="name"]').select();
},
@@ -414,6 +454,6 @@ Template.SalesSheetEditorConfigurationRow.events({
});
//Notify anything depending on the products list that they have been modified.
template.parentTemplate(1).productsDependancy.changed();
template.parentTemplate(1).productsDependency.changed();
}
});