Feat(SQL, UI): 1. Dog Command Links page completed with get + set functionality. \n 2. Commands page and Command Categories page completed with get + set functionality.

This commit is contained in:
2025-07-09 17:42:43 +01:00
parent 660b15cb8f
commit 28158cb0c4
68 changed files with 3302 additions and 3926 deletions

View File

@@ -70,24 +70,32 @@ export default class API {
return await API.request(hashPageUserLogin, 'POST', callback);
}
/*
// store
// product categories
static async saveCategories(categories, formFilters, comment) {
// dog
// Command categories
static async saveCommandCategories(commandCategories, formFilters, comment) {
let dataRequest = {};
dataRequest[flagFormFilters] = DOM.convertForm2JSON(formFilters);
dataRequest[flagProductCategory] = categories;
dataRequest[flagCommandCategory] = commandCategories;
dataRequest[flagComment] = comment;
return await API.request(hashSaveStoreProductCategory, 'POST', dataRequest);
return await API.request(hashSaveDogCommandCategory, 'POST', dataRequest);
}
// products
static async saveProducts(products, formFilters, comment) {
// Commands
static async saveCommands(commands, formFilters, comment) {
let dataRequest = {};
dataRequest[flagFormFilters] = DOM.convertForm2JSON(formFilters);
dataRequest[flagProduct] = products;
dataRequest[flagCommand] = commands;
dataRequest[flagComment] = comment;
return await API.request(hashSaveStoreProduct, 'POST', dataRequest);
return await API.request(hashSaveDogCommand, 'POST', dataRequest);
}
*/
// Dog Command Links
static async saveDogCommandLinks(dogCommandLinks, formFilters, comment) {
let dataRequest = {};
dataRequest[flagFormFilters] = DOM.convertForm2JSON(formFilters);
dataRequest[flagDogCommandLink] = dogCommandLinks;
dataRequest[flagComment] = comment;
return await API.request(hashSaveDogDogCommandLink, 'POST', dataRequest);
}
}

View File

@@ -3,8 +3,8 @@ export default class Events {
static initialiseEventHandler(selectorElement, classInitialised, eventHandler) {
document.querySelectorAll(selectorElement).forEach(function(element) {
if (element.classList.contains(classInitialised)) return;
element.classList.add(classInitialised);
eventHandler(element);
element.classList.add(classInitialised);
});
}
}

View File

@@ -78,6 +78,7 @@ export default class BasePage {
// this.hookupButtonsNavStoreHome();
// this.hookupButtonsNavStoreManufacturingPurchaseOrders();
this.hookupButtonsNavDogHome();
this.hookupButtonsNavDogCommandCategories();
this.hookupButtonsNavDogCommands();
this.hookupButtonsNavDogDogCommandLinks();
this.hookupButtonsNavDogDogs();
@@ -129,6 +130,9 @@ export default class BasePage {
hookupButtonsNavDogHome() {
this.hookupButtonsNav('.' + flagNavDogHome, hashPageDogHome);
}
hookupButtonsNavDogCommandCategories() {
this.hookupButtonsNav('.' + flagNavDogCommandCategories, hashPageDogCommandCategories);
}
hookupButtonsNavDogCommands() {
this.hookupButtonsNav('.' + flagNavDogCommands, hashPageDogCommands);
}

View File

@@ -74,8 +74,8 @@ export default class TableBasePage extends BasePage {
if (isChecked) filterActiveNew.classList.add(flagIsChecked);
this.hookupEventHandler("click", filterSelector, (event, filterActive) => {
console.log({ filterActive });
console.log({ [filterActive.tagName]: filterActive.tagName });
Utils.consoleLogIfNotProductionEnvironment({ filterActive });
Utils.consoleLogIfNotProductionEnvironment({ [filterActive.tagName]: filterActive.tagName });
let svgElement = (filterActive.tagName.toUpperCase() == 'SVG') ? filterActive : filterActive.parentElement;
let wasChecked = svgElement.classList.contains(flagIsChecked);
if (wasChecked) {
@@ -120,6 +120,36 @@ export default class TableBasePage extends BasePage {
hookupSearchTextFilter() {
this.hookupFilter(flagSearch);
}
hookupFilterDog() {
this.hookupFilter(attrIdDog);
}
hookupFilterCommandCategory() {
this.hookupFilter(attrIdCommandCategory, (event, filterCommandCategory) => {
TableBasePage.isDirtyFilter(filterCommandCategory);
let isDirtyFilter = filterCommandCategory.classList.contains(flagDirty);
let idCommandCategory = DOM.getElementValueCurrent(filterCommandCategory);
console.log("filter commands unsorted");
console.log(Utils.getListFromDict(filterCommands));
let commandsInCategory = Utils.getListFromDict(filterCommands).filter(command => command[attrIdCommandCategory] == idCommandCategory);
let sortedCommands = commandsInCategory.sort((a, b) => a[flagName].localeCompare(b[flagName]));
let filterCommand = document.querySelector(idFormFilters + ' .' + flagCommand);
let idCommandPrevious = DOM.getElementAttributeValuePrevious(filterCommand);
filterCommand.innerHTML = '';
let optionJson, option;
option = DOM.createOption(null);
filterCommand.appendChild(option);
sortedCommands.forEach((command) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(command, idCommandPrevious);
option = DOM.createOption(optionJson);
filterCommand.appendChild(option);
});
filterCommand.dispatchEvent(new Event('change'));
return isDirtyFilter;
});
}
hookupFilterCommand() {
this.hookupFilter(attrIdCommand);
}
/*
getAndLoadFilteredTableContent = () => {
this.callFilterTableContent()
@@ -132,11 +162,11 @@ export default class TableBasePage extends BasePage {
callFilterTableContent() {
let formFilters = this.getFormFilters();
let filtersJson = DOM.convertForm2JSON(formFilters);
console.log("callFilterTableContent");
console.log("formFilters");
console.log(formFilters);
console.log("filtersJson");
console.log(filtersJson);
Utils.consoleLogIfNotProductionEnvironment("callFilterTableContent");
Utils.consoleLogIfNotProductionEnvironment("formFilters");
Utils.consoleLogIfNotProductionEnvironment(formFilters);
Utils.consoleLogIfNotProductionEnvironment("filtersJson");
Utils.consoleLogIfNotProductionEnvironment(filtersJson);
this.leave();
API.goToHash(this.constructor.hash, filtersJson);
}
@@ -178,6 +208,7 @@ export default class TableBasePage extends BasePage {
}
let formElement = this.getFormFilters();
let comment = DOM.getElementValueCurrent(document.querySelector(idTextareaConfirm));
Utils.consoleLogIfNotProductionEnvironment({ formElement, comment, records });
this.callSaveTableContent(records, formElement, comment)
.then(data => {
if (data[flagStatus] == flagSuccess) {
@@ -388,7 +419,7 @@ export default class TableBasePage extends BasePage {
let wasDirtyParentRows = this.getAllIsDirtyRowsInParentTree(element);
let wasDirtyElement = element.classList.contains(flagDirty);
let isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
Utils.consoleLogIfNotProductionEnvironment({isDirtyElement, wasDirtyElement, wasDirtyParentRows});
// Utils.consoleLogIfNotProductionEnvironment({isDirtyElement, wasDirtyElement, wasDirtyParentRows});
// let td = DOM.getCellFromElement(element);
// DOM.setElementAttributeValueCurrent(td, DOM.getElementAttributeValueCurrent(element));
if (isDirtyElement != wasDirtyElement) {
@@ -427,14 +458,17 @@ export default class TableBasePage extends BasePage {
}) {
this.hookupEventHandler("change", inputSelector, handler);
}
hookupTextareasCodeTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' tbody tr td.' + flagCode + ' textarea');
hookupFieldsCodeTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' > tbody > tr > td.' + flagCode + ' > .' + flagCode);
}
hookupTextareasNameTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' tbody tr td.' + flagName + ' textarea');
hookupFieldsNameTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' > tbody > tr > td.' + flagName + ' > .' + flagName);
}
hookupTextareasDescriptionTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' tbody tr td.' + flagDescription + ' textarea');
hookupFieldsDescriptionTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' > tbody > tr > td.' + flagDescription + ' > .' + flagDescription);
}
hookupFieldsNotesTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' > tbody > tr > td.' + flagNotes + ' > .' + flagNotes);
}
hookupFieldsActive(flagTable = '', handleClickRowNew = (event, element) => { this.handleClickAddRowTable(event, element); }) {
let selectorButton = 'table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody > tr > td.' + flagActive + ' .' + flagButton + '.' + flagActive;
@@ -494,39 +528,41 @@ export default class TableBasePage extends BasePage {
this.updateAndToggleShowButtonsSaveCancel();
}
hookupTdsAccessLevel() {
let cellSelector = idTableMain + ' tbody td.' + flagAccessLevel;
this.hookupTableCellDdlPreviews(cellSelector, Utils.getListFromDict(accessLevels));
this.hookupTableCellDdlPreviews(flagAccessLevel, Utils.getListFromDict(accessLevels));
}
hookupTableCellDdlPreviews(
cellSelector
fieldFlag
, optionList
, ddlHookup = (cellSelector) => { this.hookupTableCellDdls(cellSelector); }
, cellSelector = null
, ddlHookup = (ddlSelector) => { this.hookupTableCellDdls(ddlSelector); }
, changeHandler = (event, element) => { this.handleChangeNestedElementCellTable(event, element); }
) {
this.hookupEventHandler("click", cellSelector, (event, td) => {
if (cellSelector == null) cellSelector = idTableMain + ' > tbody > tr > td.' + fieldFlag;
this.hookupEventHandler("click", cellSelector + ' div.' + fieldFlag, (event, div) => {
this.handleClickTableCellDdlPreview(
event
, td
, div
, fieldFlag
, optionList
, cellSelector
, (cellSelector) => { ddlHookup(
cellSelector
, (ddlSelector) => { ddlHookup(
ddlSelector
, (event, element) => { changeHandler(event, element); }
); }
);
});
ddlHookup(cellSelector + ' select');
ddlHookup(cellSelector + ' select.' + fieldFlag);
}
hookupTableCellDdls(ddlSelector, changeHandler = (event, element) => { this.handleChangeNestedElementCellTable(event, element); }) {
this.hookupEventHandler("change", ddlSelector, (event, element) => { changeHandler(event, element); });
}
handleClickTableCellDdlPreview(event, td, optionObjectList, cellSelector, ddlHookup = (cellSelector) => { this.hookupTableCellDdls(cellSelector); }) {
if (td.querySelector('select')) return;
let tdNew = td.cloneNode(true);
td.parentNode.replaceChild(tdNew, td);
let idSelected = DOM.getElementAttributeValueCurrent(tdNew);
tdNew.innerHTML = '';
handleClickTableCellDdlPreview(event, div, fieldFlag, optionObjectList, cellSelector = null, ddlHookup = (cellSelector) => { this.hookupTableCellDdls(cellSelector); }) {
if (Validation.isEmpty(cellSelector)) cellSelector = idTableMain + ' > tbody > tr > td.' + fieldFlag;
let idSelected = DOM.getElementAttributeValueCurrent(div);
let td = DOM.getCellFromElement(div);
td.innerHTML = '';
let ddl = document.createElement('select');
ddl.classList.add(fieldFlag);
DOM.setElementValuesCurrentAndPrevious(ddl, idSelected);
let optionJson, option;
if (_verbose) {
@@ -540,17 +576,17 @@ export default class TableBasePage extends BasePage {
option = DOM.createOption(optionJson);
ddl.appendChild(option);
});
tdNew.appendChild(ddl);
let ddlSelector = cellSelector + ' select';
td.appendChild(ddl);
let ddlSelector = cellSelector + ' select.' + fieldFlag;
ddlHookup(ddlSelector);
}
/*
hookupTableCellDDlPreviewsWhenNotCollapsed(cellSelector, optionList, ddlHookup = (event, element) => { this.hookupTableCellDdls(event, element); }) {
this.hookupEventHandler("click", cellSelector, (event, td) => {
let div = td.querySelector('div');
if (!div || div.classList.contains(flagCollapsed)) return;
this.handleClickTableCellDdlPreview(event, td, optionList, cellSelector, (event, element) => { ddlHookup(event, element); });
this.hookupEventHandler("click", cellSelector + ' div', (event, div) => {
this.handleClickTableCellDdlPreview(event, div, optionList, cellSelector, (event, element) => { ddlHookup(event, element); });
});
}
*/
toggleColumnCollapsed(flagColumn, isCollapsed) {
this.toggleColumnHasClassnameFlag(flagColumn, isCollapsed, flagCollapsed);
}
@@ -560,8 +596,9 @@ export default class TableBasePage extends BasePage {
hookupFieldsCommandCategory() {
this.hookupTableCellDdlPreviews(
idTableMain + ' td.' + flagCommandCategory
, Utils.getListFromDict(filterCommandCategories)
flagCommandCategory
, Utils.getListFromDict(filterCommandCategories).sort((a, b) => a[flagName].localeCompare(b[flagName]))
, null
, (cellSelector) => { this.hookupCommandCategoryDdls(cellSelector); }
);
}
@@ -569,19 +606,30 @@ export default class TableBasePage extends BasePage {
this.hookupChangeHandlerTableCells(ddlSelector, (event, element) => { this.handleChangeCommandCategoryDdl(event, element); });
}
handleChangeCommandCategoryDdl(event, ddlCategory) {
let idCommandCategoryOld = DOM.getElementAttributeValueCurrent(ddlCategory);
this.handleChangeNestedElementCellTable(event, ddlCategory);
let idCommandCategoryNew = DOM.getElementAttributeValueCurrent(ddlCategory);
if (idCommandCategoryOld == idCommandCategoryNew) return;
let row = DOM.getRowFromElement(ddlCategory);
let idCommandCategoryRowOld = this.getIdCommandCategoryRow(row); // DOM.getElementAttributeValueCurrent(ddlCategory);
this.handleChangeNestedElementCellTable(event, ddlCategory);
let idCommandCategoryRowNew = this.getIdCommandCategoryRow(row); // DOM.getElementAttributeValueCurrent(ddlCategory);
if (idCommandCategoryRowOld == idCommandCategoryRowNew) return;
let idCommandCategoryFilter = this.getIdCommandCategoryFilter();
let tdCommand = row.querySelector('td.' + flagCommand);
tdCommand.dispatchEvent(new Event('click'));
let ddlCommand = row.querySelector('td.' + flagCommand + ' select');
let ddlCommand = row.querySelector('td.' + flagCommand + ' select.' + flagCommand);
ddlCommand.innerHTML = '';
ddlCommand.appendChild(DOM.createOption(null));
let optionJson, option;
Utils.getListFromDict(filterCommands).forEach((command) => {
if (idCommandCategoryNew != '0' && command[attrIdCommandCategory] != idCommandCategoryNew) return;
let commandsInCategory = Utils.getListFromDict(filterCommands).filter(command =>
(
command[attrIdCommandCategory] == idCommandCategoryRowNew
|| idCommandCategoryRowNew == 0
)
&& (
command[attrIdCommandCategory] == idCommandCategoryFilter
|| idCommandCategoryFilter == 0
)
);
let sortedCommands = commandsInCategory.sort((a, b) => a[flagName].localeCompare(b[flagName]));
sortedCommands.forEach((command) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(command);
option = DOM.createOption(optionJson);
ddlCommand.appendChild(option);
@@ -589,36 +637,44 @@ export default class TableBasePage extends BasePage {
this.handleChangeNestedElementCellTable(event, ddlCommand);
}
hookupFieldsCommand() {
let cellSelector = idTableMain + ' td.' + flagCommand;
this.hookupEventHandler("click", cellSelector, (event, td) => {
let parentTr = td.parentElement;
this.hookupEventHandler("click", idTableMain + ' td.' + flagCommand + ' .' + flagCommand, (event, div) => {
Utils.consoleLogIfNotProductionEnvironment(div);
let parentTr = DOM.getRowFromElement(div);
Utils.consoleLogIfNotProductionEnvironment({ div, parentTr });
let tdCommandCategory = parentTr.querySelector('td.' + flagCommandCategory);
let idCommandCategoryRow = DOM.getElementAttributeValueCurrent(tdCommandCategory);
let idCommandCategoryRow = this.getIdCommandCategoryRow(parentTr); // DOM.getElementAttributeValueCurrent(tdCommandCategory);
let idCommandCategoryFilter = this.getIdCommandCategoryFilter();
let filterCommandList = Utils.getListFromDict(filterCommands);
let commandsInCategory = filterCommandList.filter(command =>
(
command[attrIdCommandCategory] == idCommandCategoryRow
|| idCommandCategoryRow == 0
)
&& (
command[attrIdCommandCategory] == idCommandCategoryFilter
|| idCommandCategoryFilter == 0
)
);
console.log({ tdCommandCategory, idCommandCategoryRow, filterCommandList, commandsInCategory });
console.log(filterCommandList);
let sortedCommands = commandsInCategory.sort((a, b) => a[flagName].localeCompare(b[flagName]));
Utils.consoleLogIfNotProductionEnvironment({ tdCommandCategory, idCommandCategoryRow, idCommandCategoryFilter, filterCommandList, commandsInCategory });
Utils.consoleLogIfNotProductionEnvironment(filterCommandList);
this.handleClickTableCellDdlPreview(
event
, td
, commandsInCategory
, cellSelector
, div
, flagCommand
, sortedCommands
, null
, (cellSelector) => { this.hookupTableCellDdls(
cellSelector
, (event, element) => { this.handleChangeNestedElementCellTable(event, element); }
); }
);
});
this.hookupTableCellDdls(cellSelector + ' select');
this.hookupTableCellDdls(idTableMain + ' td.' + flagCommand + ' select.' + flagCommand);
}
getIdCommandCategoryRow(tr) {
let elementCommandCategory = tr.querySelector('td.' + flagCommandCategory + ' .' + flagCommandCategory);
return DOM.getElementAttributeValueCurrent(elementCommandCategory);
}
getIdCommandCategoryFilter() {
let formFilters = this.getFormFilters();
@@ -626,9 +682,10 @@ export default class TableBasePage extends BasePage {
let commandFilter = formFilters.querySelector('#' + attrIdCommand);
let idCommandCategory = 0;
let valueCurrentCommandCategoryFilter = DOM.getElementAttributeValueCurrent(commandCategoryFilter);
console.log({ valueCurrentCommandCategoryFilter });
Utils.consoleLogIfNotProductionEnvironment({ valueCurrentCommandCategoryFilter });
if (valueCurrentCommandCategoryFilter == "") {
let valueCurrentCommandFilter = DOM.getElementAttributeValueCurrent(commandFilter);
Utils.consoleLogIfNotProductionEnvironment({ valueCurrentCommandFilter });
if (valueCurrentCommandFilter != "") {
let command = filterCommands[valueCurrentCommandFilter];
idCommandCategory = command[attrIdCommandCategory];
@@ -642,6 +699,10 @@ export default class TableBasePage extends BasePage {
let idCommandCategoryFilter = this.getIdCommandCategoryFilter();
return !(Validation.isEmpty(idCommandCategoryFilter) || idCommandCategoryFilter == 0);
}
getIdCommandRow(tr) {
let elementCommand = tr.querySelector('td.' + flagCommand + ' .' + flagCommand);
return DOM.getElementAttributeValueCurrent(elementCommand);
}
getIdCommandFilter() {
let formFilters = this.getFormFilters();
let commandFilter = formFilters.querySelector('#' + attrIdCommand);
@@ -654,7 +715,11 @@ export default class TableBasePage extends BasePage {
return !(Validation.isEmpty(idCommandFilter) || idCommandFilter == 0);
}
hookupFieldsDog() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagDog, Utils.getListFromDict(filterDogs));
this.hookupTableCellDdlPreviews(flagDog, Utils.getListFromDict(filterDogs));
}
getIdDogRow(tr) {
let elementDog = tr.querySelector('td.' + flagDog + ' .' + flagDog);
return DOM.getElementAttributeValueCurrent(elementDog);
}
createTdActive(isActive) {

View File

@@ -1,198 +0,0 @@
import Events from "../../lib/events.js";
import LocalStorage from "../../lib/local_storage.js";
import BasePage from "../base.js";
export default class PageDogBasket extends BasePage {
static hash = hashPageDogBasket;
constructor(router) {
super(router);
}
initialize() {
this.sharedInitialize();
this.hookupDogCardsInfo();
this.hookupOverlaysDogBasketInfo();
this.hookupButtonCheckoutSession();
}
hookupDogCardsInfo() {
document.querySelectorAll(idContainerInfoDelivery).addEventListener("click", function(event) {
if (_verbose) { console.log("delivery modal display method"); }
document.querySelectorAll(idOverlayInfoDelivery).css('display', 'block');
});
document.querySelectorAll(idContainerInfoBilling).addEventListener("click", function(event) {
if (_verbose) { console.log("billing modal display method"); }
document.querySelectorAll(idOverlayInfoBilling).css('display', 'block');
});
}
hookupOverlaysDogBasketInfo() {
let elOverlay, elForm;
// Delivery
elOverlay = document.querySelectorAll(idOverlayInfoDelivery);
elForm = elOverlay.querySelector('form');
hookupOverlay(elOverlay);
Events.initialiseEventHandler(elForm, flagInitialised, function() {
elForm.submit(function(event) {
elForm = document.querySelectorAll(elForm);
event.preventDefault();
if (_verbose) { console.log("delivery submit method"); }
ajaxData = {};
ajaxData[keyInfoType] = keyInfoDelivery;
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoDelivery);
ajaxJSONData('info delivery', mapHashToController(hashDogBasketInfo), ajaxData, loadInfoAddress, false);
// document.querySelectorAll(idOverlayInfoDelivery).css('display', 'none');
});
});
// Billing
elOverlay = document.querySelectorAll(idOverlayInfoBilling);
elForm = elOverlay.querySelector('form');
hookupOverlay(elOverlay);
Events.initialiseEventHandler(elForm, flagInitialised, function() {
elForm.submit(function(event) {
event.preventDefault();
if (_verbose) { console.log("billing submit method"); }
ajaxData = {};
ajaxData[keyInfoType] = keyInfoBilling;
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoBilling); // formData; // form.serialize();
ajaxJSONData('info billing', mapHashToController(hashDogBasketInfo), ajaxData, loadInfoAddress, false);
// document.querySelectorAll(idOverlayInfoBilling).css('display', 'none');
});
});
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyCity, keyCounty];
for (var k in keys) {
elForm.querySelector('#' + keys[k]).removeAttr('required');
}
}
loadInfoAddress(response) {
if (_verbose) { console.log('response:'); console.log(response.data); }
let infoType = response.data[keyInfoType];
let infoAddress = response.data[infoType];
LocalStorage.setLocalStorage(infoType, infoAddress);
// update webpage elements in background
if (infoType == keyInfoBilling) {
let container = document.querySelectorAll(idContainerInfoBilling);
if (infoAddress[keyInfoIdentical]) {
container.querySelector('div').innerHTML = "Same as delivery address";
} else {
container.querySelector('div').innerHTML = "<strong>" + infoAddress[keyNameFull] + '</strong> at <strong>' + infoAddress[keyPostcode] + "</strong>";
}
document.querySelectorAll(idOverlayInfoBilling).css('display', 'none');
document.querySelectorAll(idOverlayInfoBilling).querySelector('form').classList.add(flagSubmitted);
} else {
let container = document.querySelectorAll(idContainerInfoDelivery);
container.querySelector('div').innerHTML = "<strong>" + infoAddress[keyNameFull] + '</strong> at <strong>' + infoAddress[keyPostcode] + "</strong>";
document.querySelectorAll(idOverlayInfoDelivery).css('display', 'none');
document.querySelectorAll(idOverlayInfoDelivery).querySelector('form').classList.add(flagSubmitted);
}
}
convertFormBilling2JSON(ajaxData, idOverlayInfo) {
let elOverlay, elForm, elOverlayDelivery, elFormDelivery;
elOverlay = document.querySelectorAll(idOverlayInfo);
elForm = elOverlay.querySelector('form');
elOverlay = document.querySelectorAll(idOverlayInfoDelivery);
elForm = elOverlay.querySelector('form');
ajaxData[flagForm] = convertForm2JSON(elForm); // formData; // form.serialize();
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyAddress2, keyCity, keyCounty];
if (_verbose) {
console.log('converting billing form to json\nform ID: ' + elForm.id);
console.log('ajaxData:');
console.log(ajaxData);
}
ajaxData[flagForm][keyInfoIdentical] = getElementValueCurrent(elForm.querySelector('#' + keyInfoIdentical));
for (var k in keys) {
if (idOverlayInfo == idOverlayInfoBilling && ajaxData[flagForm][keyInfoIdentical]) {
ajaxData[flagForm][keys[k]] = getElementValueCurrent(elFormDelivery.querySelector('#' + keys[k]));
} else {
ajaxData[flagForm][keys[k]] = getElementValueCurrent(elForm.querySelector('#' + keys[k]));
}
}
if (_verbose) {
console.log('ajaxData:');
console.log(ajaxData);
}
return ajaxData;
}
hookupButtonCheckoutSession() {
let btnCheckout = document.querySelectorAll(idButtonCheckout);
btnCheckout.classList.remove(flagInitialised);
Events.initialiseEventHandler(idButtonCheckout, flagInitialised, function() {
btnCheckout.removeEventListener("click");
btnCheckout.addEventListener("click", function(event) {
//setupPageLocalStorageNext(hashPageDogBasket);
let basket = LocalStorage.getLocalStorage(keyBasket);
// goToPage(hashPageDogBasket);
let ajaxData = {};
ajaxData[keyBasket] = basket;
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoDelivery);
ajaxData = convertFormBilling2JSON(ajaxData, idOverlayInfoBilling);
ajaxData[key_code_currency] = getCurrencySelected();
// ajaxData[keyIsSubscription] = false; // only checkout one-time payment items for now
ajaxJSONData('checkout session', mapHashToController(hashPageDogCheckout), ajaxData, handleResponseCheckout, false);
});
});
}
handleResponseCheckout(response) {
// let tmpData = {};
// tmpData[keyIdCheckout] = response.data[keyIdCheckout]
// goToPage(hashPageDogCheckoutSession, tmpData);
window.location.href = response.data[keyUrlCheckout]
}
hookupButtonFormBillingCopy() {
// let elButton = document.querySelectorAll(idButtonFormBillingCopy);
Events.initialiseEventHandler(idButtonFormBillingCopy, flagInitialised, function() {
document.querySelectorAll(idButtonFormBillingCopy).addEventListener("click", function (event) {
let keys = [keyNameFull, keyPhoneNumber, keyPostcode, keyAddress1, keyAddress2, keyCity, keyCounty];
let elFormBilling = document.querySelectorAll(idOverlayInfoBilling).querySelector('form');
let elFormDelivery = document.querySelectorAll(idOverlayInfoDelivery).querySelector('form');
for (var k in keys) {
elFormBilling.querySelector('#' + keys[k]).value = getElementValueCurrent(elFormDelivery.querySelector('#' + keys[k]));
}
});
});
}
leave() {
super.leave();
}
}

View File

@@ -0,0 +1,70 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogCommandCategories extends TableBasePage {
static hash = hashPageDogCommandCategories;
static attrIdRowObject = attrIdCommandCategory;
callSaveTableContent = API.saveCommandCategories;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterActive();
}
loadRowTable(rowJson) {
if (rowJson == null) return;
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("applying data row: ", rowJson); }
}
getJsonRow(row) {
if (row == null) return;
let inputCode = row.querySelector('td.' + flagCode + ' .' + flagCode);
let inputName = row.querySelector('td.' + flagName + ' .' + flagName);
let buttonActive = row.querySelector('td.' + flagActive + ' .' + flagActive);
/*
console.log("inputName");
console.log(inputName);
*/
let jsonRow = {};
jsonRow[attrIdCommandCategory] = row.getAttribute(attrIdCommandCategory);
jsonRow[flagCode] = DOM.getElementAttributeValueCurrent(inputCode);
jsonRow[flagName] = DOM.getElementAttributeValueCurrent(inputName);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
}
postInitialiseRowNewCallback(tbody) {
// let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupFieldsCodeTable();
this.hookupFieldsNameTable();
this.hookupFieldsActive();
}
leave() {
super.leave();
}
}

View File

@@ -1,10 +1,12 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import API from "../../api.js";
import DOM from "../../dom.js";
import DogTableMixinPage from "./mixin_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogCommands extends TableBasePage {
static hash = hashPageDogCommands;
@@ -22,122 +24,75 @@ export default class PageDogCommands extends TableBasePage {
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterDog();
this.hookupFilterIsNotEmpty();
this.hookupFilterCommandCategory();
this.hookupFilterActive();
}
hookupFilterDog() {
this.hookupFilter(flagDog);
hookupFilterCommandCategory() {
this.hookupFilter(attrIdCommandCategory);
}
loadRowTable(rowJson) {
return;
if (rowJson == null) return;
let row = _rowBlank.cloneNode(true);
row.classList.remove(flagRowNew);
row.classList.remove(flagInitialised);
row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
element.classList.remove(flagInitialised);
});
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
let tdDog = row.querySelector('td.' + flagDog);
let divDog = tdDog.querySelector('div.' + flagDog);
let textareaName = row.querySelector('td.' + flagName + ' textarea');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let divAccessLevel = tdAccessLevel.querySelector('div.' + flagAccessLevel);
let inputActive = row.querySelector('td.' + flagActive + ' input[type="checkbox"]');
DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, rowJson[flagDisplayOrder]);
DOM.setElementValuesCurrentAndPrevious(textareaCode, rowJson[flagCode]);
DOM.setElementValuesCurrentAndPrevious(textareaName, rowJson[flagName]);
DOM.setElementValuesCurrentAndPrevious(textareaDescription, rowJson[flagDescription]);
tdAccessLevel.setAttribute(attrIdAccessLevel, rowJson[attrIdAccessLevel]);
tdAccessLevel.setAttribute(flagAccessLevelRequired, rowJson[flagAccessLevelRequired]);
divAccessLevel.setAttribute(attrIdAccessLevel, rowJson[attrIdAccessLevel]);
DOM.setElementValuesCurrentAndPrevious(divAccessLevel, rowJson[attrIdAccessLevel]);
divAccessLevel.textContent = rowJson[flagAccessLevelRequired];
DOM.setElementValuesCurrentAndPrevious(inputActive, rowJson[flagActive]);
row.setAttribute(rowJson[flagKeyPrimary], rowJson[rowJson[flagKeyPrimary]]);
let table = TableBasePage.getTableMain();
let bodyTable = table.querySelector('tbody');
bodyTable.appendChild(row);
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("applying data row: ", rowJson); }
}
getJsonRow(row) {
if (row == null) return;
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
let tdDog = row.querySelector('td.' + flagDog);
let textareaName = row.querySelector('td.' + flagName + ' textarea');
// let tdCommandVariations = row.querySelector('td.' + flagCommandVariations);
let inputHasVariations = row.querySelector('td.' + flagHasVariations + ' input[type="checkbox"]');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let inputName = row.querySelector('td.' + flagName + ' textarea');
let inputHandSignalDefaultDescription = row.querySelector('td.' + flagHandSignalDefaultDescription + ' textarea');
let inputCanHaveButton = row.querySelector('td.' + flagCanHaveButton + ' input');
let inputNotes = row.querySelector('td.' + flagNotes + ' textarea');
let buttonActive = row.querySelector('td.' + flagActive + ' .' + flagActive);
let jsonCommand = {};
jsonCommand[attrIdCommand] = row.getAttribute(attrIdCommand);
jsonCommand[attrIdDog] = DOM.getElementAttributeValueCurrent(tdDog);
jsonCommand[flagName] = DOM.getElementAttributeValueCurrent(textareaName);
// jsonRow[flagCommandVariations] = DOM.getElementAttributeValueCurrent(tdCommandVariations);
// jsonRow[flagHasVariations] = jsonRow[flagCommandVariations] != '';
jsonCommand[flagHasVariations] = DOM.getElementAttributeValueCurrent(inputHasVariations);
// jsonCommand[flagAccessLevelRequired] = tdAccessLevel.getAttribute(flagAccessLevelRequired);
jsonCommand[attrIdAccessLevel] = DOM.getElementAttributeValueCurrent(tdAccessLevel);
jsonCommand[flagActive] = buttonActive.classList.contains(flagDelete);
jsonCommand[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(sliderDisplayOrder);
return jsonCommand;
let jsonRow = {};
jsonRow[attrIdCommand] = row.getAttribute(attrIdCommand);
jsonRow[attrIdCommandCategory] = this.getIdCommandCategoryRow(row);
jsonRow[flagName] = DOM.getElementAttributeValueCurrent(inputName);
jsonRow[flagHandSignalDefaultDescription] = DOM.getElementAttributeValueCurrent(inputHandSignalDefaultDescription);
jsonRow[flagCanHaveButton] = (DOM.getElementAttributeValueCurrent(inputCanHaveButton) == "true");
jsonRow[flagNotes] = DOM.getElementAttributeValueCurrent(inputNotes);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
if (row == null) return;
this.initialiseSliderDisplayOrderRowNew(tbody, row);
}
postInitialiseRowNewCallback(tbody) {
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
let newestRow = newRows[newRows.length - 1];
let clickableElementsSelector = [
'td.' + flagDog + ' div.' + flagDog
, ',td.' + flagCommandCategory + ' div.' + flagCommandCategory
, ',td.' + flagCommand + ' div.' + flagCommand
].join('');
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
clickableElement.click();
});
}
hookupTableMain() {
super.hookupTableMain();
this.hookupSlidersDisplayOrderTable();
this.hookupTdsDog();
this.hookupTextareasNameTable();
this.hookupInputsHasVariationsTable();
this.hookupTdsAccessLevel();
this.hookupFieldsCommandCategory();
this.hookupFieldsNameTable();
this.hookupTextareasHandSignalDefaultDescription();
this.hookupFieldsCanHaveButton();
this.hookupFieldsNotesTable();
this.hookupFieldsActive();
}
hookupTdsDog() {
let cellSelector = idTableMain + ' tbody td.' + flagDog;
this.hookupTableCellDdlPreviews(cellSelector, Utils.getListFromDict(filterDogs));
hookupFieldsCommandCategory() {
this.hookupTableCellDdlPreviews(
flagCommandCategory
, Utils.getListFromDict(filterCommandCategories)
);
}
hookupInputsHasVariationsTable() {
let cellSelector = idTableMain + ' tbody td.' + flagHasVariations + ' input[type="checkbox"]';
this.hookupChangeHandlerTableCells(cellSelector);
hookupTextareasHandSignalDefaultDescription() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagHandSignalDefaultDescription + ' textarea');
}
/*
isDirtyRow(row) {
if (row == null) return false;
console.log("Command Command isDirtyRow");
console.log("row: ", row);
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder);
let inputCode = row.querySelector('td.' + flagCode + ' textarea');
let inputName = row.querySelector('td.' + flagName + ' textarea');
let inputDescription = row.querySelector('td.' + flagDescription + ' textarea');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let inputActive = row.querySelector('td.' + flagActive + ' input[type="checkbox"]');
let isDirty = sliderDisplayOrder.classList.contains(flagDirty) || inputCode.classList.contains(flagDirty) || inputName.classList.contains(flagDirty) ||
inputDescription.classList.contains(flagDirty) || tdAccessLevel.classList.contains(flagDirty) || inputActive.classList.contains(flagDirty);
DOM.handleDirtyElement(row, isDirty);
return isDirty;
hookupFieldsCanHaveButton() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCanHaveButton + ' input');
}
*/
leave() {
super.leave();
}
/*
getFiltersDefaults() {
filters = {};
filters.flagIsNotEmpty = true;
filters.flagActive = true;
return filters;
}
*/
}

View File

@@ -29,157 +29,28 @@ export default class PageDogDogCommandLinks extends TableBasePage {
this.hookupFilterCommand();
this.hookupFilterActive();
}
hookupFilterDog() {
this.hookupFilter(attrIdDog);
}
hookupFilterCommandCategory() {
this.hookupFilter(attrIdCommandCategory, (event, filterCommandCategory) => {
// loadDogCommandLinks();
// let wasDirtyFilter = filterCommandCategory.classList.contains(flagDirty);
PageDogDogCommandLinks.isDirtyFilter(filterCommandCategory);
let isDirtyFilter = filterCommandCategory.classList.contains(flagDirty);
let idCommandCategory = DOM.getElementValueCurrent(filterCommandCategory);
let commands = filterCommands.filter(command => command[attrIdCommandCategory] == idCommandCategory);
let filterCommand = document.querySelector(idFormFilters + ' .' + flagCommand);
let idCommandPrevious = filterCommand.getAttribute(attrValuePrevious);
filterCommand.innerHTML = '';
let optionJson, option;
option = DOM.createOption(null);
filterCommand.appendChild(option);
commands.forEach((command) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(command, idCommandPrevious);
option = DOM.createOption(optionJson);
filterCommand.appendChild(option);
});
filterCommand.dispatchEvent(new Event('change'));
return isDirtyFilter;
});
}
hookupFilterCommand() {
this.hookupFilter(attrIdCommand);
}
loadRowTable(rowJson) {
if (rowJson == null) return;
if (_verbose) { console.log("applying data row: ", rowJson); }
/*
let tableMain = TableBasePage.getTableMain();
let row = _rowBlank.cloneNode(true);
row.classList.remove(flagRowNew);
let dllDog = row.querySelector('td.' + flagDog + ' select');
dllDog.value = rowJson[attrIdDog];
let ddlCommand = row.querySelector('td.' + flagCommand + ' select');
let optionJson, option;
listCommands.forEach(function(command) {
if (command[attrIdDog] != rowJson[attrIdDog]) return;
optionJson = BusinessObjects.getOptionJsonFromObjectJson(command);
option = DOM.createOption(optionJson, rowJson[attrIdCommand]);
ddlCommand.appendChild(option);
});
ddlCommand.value = rowJson[attrIdCommand];
row.querySelector('td.' + flagCommandVariations + ' textarea').value = rowJson[flagCommandVariations];
let tdCommandVariations = row.querySelector('td.' + flagCommandVariations);
let textareaCommandVariations = tdCommandVariations.querySelector('textarea');
DOM.setElementValuesCurrentAndPrevious(textareaCommandVariations, rowJson[flagCommandVariations]);
let thCommandVariations = row.querySelector('td.' + flagCommandVariations);
if (!thCommandVariations.classList.contains(flagCollapsed)) tdCommandVariations.classList.remove(flagCollapsed);
let inputDescription = row.querySelector('td.' + flagDescription + ' textarea');
DOM.setElementValuesCurrentAndPrevious(inputDescription, rowJson[flagDescription]);
let inputCostLocal = row.querySelector('td.' + flagCostLocal + ' input');
DOM.setElementValuesCurrentAndPrevious(inputCostLocal, rowJson[flagCostLocal]);
let tdCurrencyCost = row.querySelector('td.' + flagCurrencyCost);
DOM.setElementAttributesValuesCurrentAndPrevious(tdCurrencyCost, rowJson[flagCurrencyCost]);
let ddlCurrencyCost = tdCurrencyCost.querySelector('select');
DOM.setElementValuesCurrentAndPrevious(ddlCurrencyCost, rowJson[flagCurrencyCost]);
let inputProfitLocalMin = row.querySelector('td.' + flagProfitLocalMin + ' input');
DOM.setElementValuesCurrentAndPrevious(inputProfitLocalMin, rowJson[flagProfitLocalMin]);
let inputLatencyManufactureDays = row.querySelector('td.' + flagLatencyManufacture + ' input');
DOM.setElementValuesCurrentAndPrevious(inputLatencyManufactureDays, rowJson[flagLatencyManufacture]);
let inputQuantityStock = row.querySelector('td.' + flagQuantityStock + ' input');
DOM.setElementValuesCurrentAndPrevious(inputQuantityStock, rowJson[flagQuantityStock]);
let inputQuantityMin = row.querySelector('td.' + flagQuantityMin + ' input');
DOM.setElementValuesCurrentAndPrevious(inputQuantityMin, rowJson[flagQuantityMin]);
let inputQuantityMax = row.querySelector('td.' + flagQuantityMax + ' input');
DOM.setElementValuesCurrentAndPrevious(inputQuantityMax, rowJson[flagQuantityMax]);
let inputQuantityStep = row.querySelector('td.' + flagCountUnitMeasurementPerQuantityStep + ' input');
DOM.setElementValuesCurrentAndPrevious(inputQuantityStep, rowJson[flagCountUnitMeasurementPerQuantityStep]);
row.querySelector('td.' + flagQuantityStock + ' input').value = rowJson[flagQuantityStock];
row.querySelector('td.' + flagQuantityMin + ' input').value = rowJson[flagQuantityMin];
row.querySelector('td.' + flagQuantityMax + ' input').value = rowJson[flagQuantityMax];
row.querySelector('td.' + flagCostLocal).innerHTML = rowJson[flagCostLocal];
row.setAttribute(attrIdDog, rowJson[flagDog]);
row.setAttribute(attrIdCommand, rowJson[flagCommand]);
row.setAttribute(attrIdDogCommandLink, rowJson[attrIdDogCommandLink]);
let tbody = tableMain.querySelector('tbody');
tbody.appendChild(row);
*/
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("applying data row: ", rowJson); }
}
getJsonRow(row) {
if (row == null) return;
let tdDog = row.querySelector('td.' + flagDog);
let tdCommand = row.querySelector('td.' + flagCommand);
let inputHandSignalDescription = row.querySelector('td.' + flagHandSignalDescription + ' textarea');
let inputNotes = row.querySelector('td.' + flagNotes + ' textarea');
let buttonActive = row.querySelector('td.' + flagActive + ' .' + flagActive);
let jsonRow = {};
jsonRow[attrIdDogCommandLink] = row.getAttribute(attrIdDogCommandLink);
jsonRow[attrIdDog] = tdDog.getAttribute(attrValueCurrent);
jsonRow[attrIdCommand] = tdCommand.getAttribute(attrValueCurrent);
jsonRow[flagHandSignalDescription] = inputHandSignalDescription.getAttribute(attrValueCurrent);
jsonRow[flagNotes] = inputNotes.getAttribute(attrValueCurrent);
jsonRow[attrIdDog] = this.getIdDogRow(row);
jsonRow[attrIdCommand] = this.getIdCommandRow(row);
jsonRow[flagHandSignalDescription] = DOM.getElementAttributeValueCurrent(inputHandSignalDescription);
jsonRow[flagNotes] = DOM.getElementAttributeValueCurrent(inputNotes);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
/*
this.initialiseRowNewDdlsDog(row);
this.initialiseRowNewDdlsCommandCategory(row);
this.initialiseRowNewDdlsCommand(row);
this.initialiseRowNewDdlsDogAndCommand(row);
let checkboxIsSubscription = row.querySelector('td.' + flagIsSubscription + ' input');
let checkboxDoesExpireFasterOnceUnsealed = row.querySelector('td.' + flagDoesExpireFasterOnceUnsealed + ' input');
this.handleChangeCheckboxDoesExpireFasterOnceUnsealed(null, checkboxDoesExpireFasterOnceUnsealed);
this.handleChangeCheckboxIsSubscription(null, checkboxIsSubscription);
*/
}
initialiseRowNewDdlsDog(row) {
let ddlDogFilter = document.querySelector(idFormFilters + ' #' + attrIdDog);
let idDogFilter = DOM.getElementValueCurrent(ddlDogFilter);
let hasDogFilter = !(Validation.isEmpty(idDogFilter) || idDogFilter == '0');
if (_verbose) {
console.log("initialiseRowNew: ", row);
console.log({ ddlDogFilter, idDogFilter, hasDogFilter });
}
if (!hasDogFilter) return;
let ddlDog = row.querySelector('td.' + flagDog + ' select');
DOM.setElementValuesCurrentAndPrevious(ddlDog, idDogFilter);
this.handleChangeDogDdl(null, ddlDog);
}
initialiseRowNewDdlsCommandCategory(row) {
let idCommandCategoryFilter = this.getIdCommandCategoryFilter();
let hasCommandCategoryFilter = this.getHasCommandCategoryFilter();
if (_verbose) {
console.log("initialiseRowNew: ", row);
console.log({ddlDogFilter, idDogFilter, hasDogFilter, idCommandCategoryFilter, hasCommandCategoryFilter});
}
if (!hasCommandCategoryFilter) return;
let ddlCommandCategory = row.querySelector('td.' + flagCommandCategory + ' select');
DOM.setElementValuesCurrentAndPrevious(ddlCommandCategory, idCommandCategoryFilter);
}
initialiseRowNewDdlsCommand(row) {
let idCommandFilter = this.getIdCommandFilter();
let hasCommandFilter = this.getHasCommandFilter();
if (_verbose) {
console.log("initialiseRowNew: ", row);
console.log({ddlDogFilter, idDogFilter, hasDogFilter, ddlCommandFilter, idCommandFilter, hasCommandFilter});
}
if (!hasCommandFilter) return;
let ddlCommand = row.querySelector('td.' + flagCommand + ' select');
DOM.setElementValuesCurrentAndPrevious(ddlCommand, idCommandFilter);
}
postInitialiseRowNewCallback(tbody) {
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
@@ -200,15 +71,12 @@ export default class PageDogDogCommandLinks extends TableBasePage {
this.hookupFieldsCommandCategory();
this.hookupFieldsCommand();
this.hookupTextareasHandSignalDescription();
this.hookupTextareasNotes();
this.hookupFieldsNotesTable();
this.hookupFieldsActive();
}
hookupTextareasHandSignalDescription() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagHandSignalDescription + ' textarea');
}
hookupTextareasNotes() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagNotes + ' textarea');
}
leave() {
super.leave();

View File

@@ -1,132 +0,0 @@
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import API from "../../api.js";
import DOM from "../../dom.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogDogs extends TableBasePage {
static hash = hashPageDogDogs;
static attrIdRowObject = attrIdDog;
callSaveTableContent = API.saveDogs;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterIsNotEmpty();
this.hookupFilterActive();
}
hookupFilterIsNotEmpty() {
this.hookupEventHandler("change", idFormFilters + ' .' + flagIsNotEmpty, (event, filter) => {
PageDogDogs.isDirtyFilter(filter);
});
}
loadRowTable(rowJson) {
if (rowJson == null) return;
if (_verbose) { console.log("applying data row: ", rowJson); }
let row = _rowBlank.cloneNode(true);
row.classList.remove(flagRowNew);
row.classList.remove(flagInitialised);
row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
element.classList.remove(flagInitialised);
});
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
let textareaCode = row.querySelector('td.' + flagCode + ' textarea');
let textareaName = row.querySelector('td.' + flagName + ' textarea');
let textareaDescription = row.querySelector('td.' + flagDescription + ' textarea');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let divAccessLevel = tdAccessLevel.querySelector('div.' + flagAccessLevel);
let inputActive = row.querySelector('td.' + flagActive + ' input[type="checkbox"]');
DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, rowJson[flagDisplayOrder]);
DOM.setElementValuesCurrentAndPrevious(textareaCode, rowJson[flagCode]);
DOM.setElementValuesCurrentAndPrevious(textareaName, rowJson[flagName]);
DOM.setElementValuesCurrentAndPrevious(textareaDescription, rowJson[flagDescription]);
tdAccessLevel.setAttribute(attrIdAccessLevel, rowJson[attrIdAccessLevel]);
tdAccessLevel.setAttribute(flagAccessLevelRequired, rowJson[flagAccessLevelRequired]);
divAccessLevel.setAttribute(attrIdAccessLevel, rowJson[attrIdAccessLevel]);
DOM.setElementValuesCurrentAndPrevious(divAccessLevel, rowJson[attrIdAccessLevel]);
divAccessLevel.textContent = rowJson[flagAccessLevelRequired];
DOM.setElementValuesCurrentAndPrevious(inputActive, rowJson[flagActive]);
row.setAttribute(rowJson[flagKeyPrimary], rowJson[rowJson[flagKeyPrimary]]);
let table = TableBasePage.getTableMain();
let bodyTable = table.querySelector('tbody');
bodyTable.appendChild(row);
}
getJsonRow(row) {
if (row == null) return;
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
let textareaCode = row.querySelector('td.' + flagCode + ' textarea');
let textareaName = row.querySelector('td.' + flagName + ' textarea');
let textareaDescription = row.querySelector('td.' + flagDescription + ' textarea');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let jsonDog = {};
jsonDog[attrIdDog] = row.getAttribute(attrIdDog);
jsonDog[flagCode] = DOM.getElementAttributeValueCurrent(textareaCode);
jsonDog[flagName] = DOM.getElementAttributeValueCurrent(textareaName);
jsonDog[flagDescription] = DOM.getElementAttributeValueCurrent(textareaDescription);
// jsonDog[flagAccessLevelRequired] = tdAccessLevel.getAttribute(flagAccessLevelRequired);
jsonDog[attrIdAccessLevel] = DOM.getElementAttributeValueCurrent(tdAccessLevel);
jsonDog[flagActive] = buttonActive.classList.contains(flagDelete);
jsonDog[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(sliderDisplayOrder);
return jsonDog;
}
initialiseRowNew(tbody, row) {
if (row == null) return;
this.initialiseSliderDisplayOrderRowNew(tbody, row);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupSlidersDisplayOrderTable();
this.hookupTextareasCodeTable();
this.hookupTextareasNameTable();
this.hookupTextareasDescriptionTable();
this.hookupTdsAccessLevel();
this.hookupFieldsActive();
}
/*
isDirtyRow(row) {
if (row == null) return false;
console.log("Product Dog isDirtyRow");
console.log("row: ", row);
let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder);
let inputCode = row.querySelector('td.' + flagCode + ' textarea');
let inputName = row.querySelector('td.' + flagName + ' textarea');
let inputDescription = row.querySelector('td.' + flagDescription + ' textarea');
let tdAccessLevel = row.querySelector('td.' + flagAccessLevel);
let inputActive = row.querySelector('td.' + flagActive + ' input[type="checkbox"]');
let isDirty = sliderDisplayOrder.classList.contains(flagDirty) || inputCode.classList.contains(flagDirty) || inputName.classList.contains(flagDirty) ||
inputDescription.classList.contains(flagDirty) || tdAccessLevel.classList.contains(flagDirty) || inputActive.classList.contains(flagDirty);
DOM.handleDirtyElement(row, isDirty);
return isDirty;
}
*/
leave() {
super.leave();
}
/*
getFiltersDefaults() {
filters = {};
filters.flagIsNotEmpty = true;
filters.flagActive = true;
return filters;
}
*/
}

View File

@@ -10,9 +10,11 @@ export default class PageDogHome extends BasePage {
initialize() {
this.sharedInitialize();
this.hookupFiltersDog();
this.hookupDogHome();
}
hookupDogHome() {
}
leave() {
super.leave();

View File

@@ -1,509 +0,0 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import ProductPermutation from "../../lib/business_objects/dog/product_permutation.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogManufacturingPurchaseOrders extends TableBasePage {
static hash = hashPageDogManufacturingPurchaseOrders;
static attrIdRowObject = attrIdManufacturingPurchaseOrder;
callSaveTableContent = API.saveManufacturingPurchaseOrders;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterActive();
}
loadRowTable(rowJson) {
}
getJsonRow(row) {
if (row == null) return;
let tdCurrency = row.querySelector('td.' + flagCurrency);
let inputCostTotalLocalVatExcl = row.querySelector('td.' + flagCostTotalLocalVatExcl + ' input');
let inputCostTotalLocalVatIncl = row.querySelector('td.' + flagCostTotalLocalVatIncl + ' input');
let inputPriceTotalLocalVatExcl = row.querySelector('td.' + flagPriceTotalLocalVatExcl + ' input');
let inputPriceTotalLocalVatIncl = row.querySelector('td.' + flagPriceTotalLocalVatIncl + ' input');
let trsPurchaseOrderItem = row.querySelectorAll('tr.' + flagOrderItems);
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdManufacturingPurchaseOrder] = row.getAttribute(attrIdManufacturingPurchaseOrder);
jsonRow[attrIdCurrency] = DOM.getElementAttributeValueCurrent(tdCurrency);
jsonRow[flagCostTotalLocalVatExcl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatExcl);
jsonRow[flagCostTotalLocalVatIncl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatIncl);
jsonRow[flagPriceTotalLocalVatExcl] = DOM.getElementAttributeValueCurrent(inputPriceTotalLocalVatExcl);
jsonRow[flagPriceTotalLocalVatIncl] = DOM.getElementAttributeValueCurrent(inputPriceTotalLocalVatIncl);
let orderItems = [];
if (trsPurchaseOrderItem != null) {
trsPurchaseOrderItem.forEach((tr) => {
orderItems.push(this.getJsonRowOrderItem(tr));
});
}
jsonRow[flagOrderItems] = orderItems;
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
getJsonRowOrderItem(tr) {
let inputDisplayOrder = tr.querySelector('td.' + flagDisplayOrder + ' input');
let tdCategory = tr.querySelector('td.' + flagProductCategory);
let tdProduct = tr.querySelector('td.' + flagProduct);
let tdVariations = tr.querySelector('td.' + flagProductVariations);
let tdUnitQuantity = tr.querySelector('td.' + flagUnitMeasurementQuantity);
let inputQuantityUsed = tr.querySelector('td.' + flagQuantityUsed + ' input');
let inputQuantityProduced = tr.querySelector('td.' + flagQuantityProduced + ' input');
let tdUnitMeasurementLatencyManufacture = tr.querySelector('td.' + flagUnitMeasurementLatencyManufacture);
let inputLatencyManufacture = tr.querySelector('td.' + flagLatencyManufacture + ' input');
let buttonActive = tr.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdManufacturingPurchaseOrder] = tr.getAttribute(attrIdManufacturingPurchaseOrder);
jsonRow[attrIdManufacturingPurchaseOrderProductLink] = tr.getAttribute(attrIdManufacturingPurchaseOrderProductLink);
jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
jsonRow[attrIdProductCategory] = DOM.getElementAttributeValueCurrent(tdCategory);
jsonRow[attrIdProduct] = DOM.getElementAttributeValueCurrent(tdProduct);
jsonRow[flagProductVariations] = DOM.getElementAttributeValueCurrent(tdVariations);
jsonRow[attrIdUnitMeasurementQuantity] = DOM.getElementAttributeValueCurrent(tdUnitQuantity);
jsonRow[flagQuantityUsed] = DOM.getElementAttributeValueCurrent(inputQuantityUsed);
jsonRow[flagQuantityProduced] = DOM.getElementAttributeValueCurrent(inputQuantityProduced);
jsonRow[attrIdUnitMeasurementLatencyManufacture] = DOM.getElementAttributeValueCurrent(tdUnitMeasurementLatencyManufacture);
jsonRow[flagLatencyManufacture] = DOM.getElementAttributeValueCurrent(inputLatencyManufacture);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
super.initialiseRowNew(tbody, row);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupCurrencyFields();
this.hookupCostAndPriceInputs();
this.hookupOrderItemsFields();
this.hookupFieldsActive();
}
hookupCostAndPriceInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostTotalLocalVatExcl + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostTotalLocalVatIncl + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagPriceTotalLocalVatExcl + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagPriceTotalLocalVatIncl + ' input');
}
hookupOrderItemsFields() {
this.hookupOrderItemsPreviews();
this.hookupFieldsOrderItemDisplayOrder();
this.hookupFieldsOrderItemProductCategory();
this.hookupFieldsOrderItemProduct();
this.hookupFieldsOrderItemProductVariations();
this.hookupFieldsOrderItemUnitQuantity();
this.hookupFieldsOrderItemQuantityUsed();
this.hookupFieldsOrderItemQuantityProduced();
this.hookupFieldsOrderItemUnitMeasurementLatencyManufacture();
this.hookupFieldsOrderItemLatencyManufacture();
this.hookupFieldsOrderItemActive();
this.hookupFieldsOrderItemAddDelete();
this.hookupButtonsOrderItemAdd();
}
hookupOrderItemsPreviews() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems, (event, td) => {
if (!td.classList.contains(flagCollapsed)) return;
this.handleClickOrderItemsPreview(event, td);
});
}
handleClickOrderItemsPreview(event, element) {
if (_verbose) { console.log("click order items preview"); }
this.toggleColumnHeaderCollapsed(flagOrderItems, false);
element.classList.remove(flagCollapsed);
let row = DOM.getRowFromElement(element);
let idManufacturingPurchaseOrder = row.getAttribute(attrIdManufacturingPurchaseOrder);
let manufacturingPurchaseOrder = idManufacturingPurchaseOrder > 0 ? manufacturingPurchaseOrders[idManufacturingPurchaseOrder] : {
[flagOrderItems]: [],
};
let tblOrderItems = document.createElement("table");
tblOrderItems.classList.add(flagOrderItems);
let thead = document.createElement("thead");
let tr = document.createElement("tr");
let thDisplayOrder = document.createElement("th");
thDisplayOrder.classList.add(flagDisplayOrder);
thDisplayOrder.textContent = 'Display Order';
let thCategory = document.createElement("th");
thCategory.classList.add(flagProductCategory);
thCategory.textContent = 'Category';
let thProduct = document.createElement("th");
thProduct.classList.add(flagProduct);
thProduct.textContent = 'Product';
let thVariations = document.createElement("th");
thVariations.classList.add(flagProductVariations);
thVariations.classList.add(flagCollapsed);
thVariations.textContent = 'Variations';
let thUnitQuantity = document.createElement("th");
thUnitQuantity.classList.add(flagUnitMeasurementQuantity);
thUnitQuantity.textContent = 'Unit Quantity';
let thQuantityUsed = document.createElement("th");
thQuantityUsed.classList.add(flagQuantityUsed);
thQuantityUsed.textContent = 'Quantity Used';
let thQuantityProduced = document.createElement("th");
thQuantityProduced.classList.add(flagQuantityProduced);
thQuantityProduced.textContent = 'Quantity Produced';
/*
let thCostTotalLocalVatExcl = document.createElement("th");
thCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
thCostTotalLocalVatExcl.textContent = 'Cost Total Local VAT Excl';
let thCostTotalLocalVatIncl = document.createElement("th");
thCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
thCostTotalLocalVatIncl.textContent = 'Cost Total Local VAT Incl';
let thCostUnitLocalVatExcl = document.createElement("th");
thCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
thCostUnitLocalVatExcl.textContent = 'Cost Unit Local VAT Excl';
let thCostUnitLocalVatIncl = document.createElement("th");
thCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
thCostUnitLocalVatIncl.textContent = 'Cost Unit Local VAT Incl';
*/
let thUnitMeasurementLatencyManufacture = document.createElement("th");
thUnitMeasurementLatencyManufacture.classList.add(flagUnitMeasurementLatencyManufacture);
thUnitMeasurementLatencyManufacture.textContent = 'Unit Measurement Latency Manufacture';
let thLatencyManufacture = document.createElement("th");
thLatencyManufacture.classList.add(flagLatencyManufacture);
thLatencyManufacture.textContent = 'Latency Manufacture';
let thActive = document.createElement("th");
thActive.classList.add(flagActive);
thActive.textContent = 'Active';
let thAddDelete = document.createElement("th");
thAddDelete.classList.add(flagAdd);
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
thAddDelete.appendChild(buttonAdd);
tr.appendChild(thDisplayOrder);
tr.appendChild(thCategory);
tr.appendChild(thProduct);
tr.appendChild(thVariations);
tr.appendChild(thUnitQuantity);
tr.appendChild(thQuantityUsed);
tr.appendChild(thQuantityProduced);
/*
tr.appendChild(thCostTotalLocalVatExcl);
tr.appendChild(thCostTotalLocalVatIncl);
tr.appendChild(thCostUnitLocalVatExcl);
tr.appendChild(thCostUnitLocalVatIncl);
*/
tr.appendChild(thUnitMeasurementLatencyManufacture);
tr.appendChild(thLatencyManufacture);
tr.appendChild(thActive);
tr.appendChild(thAddDelete);
thead.appendChild(tr);
tblOrderItems.appendChild(thead);
let tbody = document.createElement("tbody");
manufacturingPurchaseOrder[flagOrderItems].forEach((orderItem, index) => {
this.addRowManufacturingPurchaseOrderItem(tbody, orderItem);
});
tblOrderItems.appendChild(tbody);
let cell = DOM.getCellFromElement(element);
let cellNew = cell.cloneNode(false);
cellNew.appendChild(tblOrderItems);
row.replaceChild(cellNew, cell);
if (_verbose) { console.log("tblOrderItems: ", tblOrderItems); }
this.hookupOrderItemsFields();
}
addRowManufacturingPurchaseOrderItem(tbody, orderItem) { // productVariationTypeOptions, productVariationOptions, productCategoryOptions, productOptions, unitMeasurementOptions,
if (_verbose) { console.log("addRowManufacturingPurchaseOrderItem: ", orderItem); }
let tdDisplayOrder = document.createElement("td");
tdDisplayOrder.classList.add(flagDisplayOrder);
let inputDisplayOrder = document.createElement("input");
inputDisplayOrder.classList.add(flagDisplayOrder);
inputDisplayOrder.type = 'number';
inputDisplayOrder.step = 1;
DOM.setElementValuesCurrentAndPrevious(inputDisplayOrder, orderItem[flagDisplayOrder]);
tdDisplayOrder.appendChild(inputDisplayOrder);
let tdCategory = document.createElement("td");
tdCategory.classList.add(flagProductCategory);
DOM.setElementAttributesValuesCurrentAndPrevious(tdCategory, orderItem[attrIdProductCategory]);
let divCategory = document.createElement("div");
divCategory.classList.add(flagProductCategory);
// DOM.setElementAttributesValuesCurrentAndPrevious(divCategory, orderItem[attrIdProductCategory]);
let productCategory = productCategories[orderItem[attrIdProductCategory]];
divCategory.textContent = BusinessObjects.getObjectText(productCategory);
tdCategory.appendChild(divCategory);
let tdProduct = document.createElement("td");
tdProduct.classList.add(flagProduct);
DOM.setElementAttributesValuesCurrentAndPrevious(tdProduct, orderItem[attrIdProductCategory]);
let divProduct = document.createElement("div");
divProduct.classList.add(flagProduct);
// DOM.setElementAttributesValuesCurrentAndPrevious(divProduct, orderItem[attrIdProduct]);
let product = products[orderItem[attrIdProduct]];
divProduct.textContent = BusinessObjects.getObjectText(product);
tdProduct.appendChild(divProduct);
let tdVariations = document.createElement("td");
tdVariations.classList.add(flagProductVariations);
tdVariations.classList.add(flagCollapsed);
DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[attrIdProductCategory]);
let divVariations = document.createElement("div");
divVariations.classList.add(flagProductVariations);
// DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[attrIdProductVariation]);
let variationsText = ProductPermutation.getProductVariationsPreviewFromIdCsv(orderItem[flagProductVariations]);
divVariations.textContent = variationsText;
tdVariations.appendChild(divVariations);
let tdUnitQuantity = document.createElement("td");
tdUnitQuantity.classList.add(flagUnitMeasurementQuantity);
DOM.setElementAttributesValuesCurrentAndPrevious(tdUnitQuantity, orderItem[attrIdProductCategory]);
let divUnitQuantity = document.createElement("div");
divUnitQuantity.classList.add(flagUnitMeasurementQuantity);
// DOM.setElementValuesCurrentAndPrevious(divUnitQuantity, orderItem[flagUnitMeasurementQuantity]);
let unitQuantity = unitMeasurements[orderItem[attrIdUnitMeasurementQuantity]];
divUnitQuantity.textContent = BusinessObjects.getObjectText(unitQuantity);
tdUnitQuantity.appendChild(divUnitQuantity);
let tdQuantityUsed = document.createElement("td");
tdQuantityUsed.classList.add(flagQuantityUsed);
let inputQuantityUsed = document.createElement("input");
inputQuantityUsed.classList.add(flagQuantityUsed);
inputQuantityUsed.type = 'number';
DOM.setElementValuesCurrentAndPrevious(inputQuantityUsed, orderItem[flagQuantityUsed]);
tdQuantityUsed.appendChild(inputQuantityUsed);
let tdQuantityProduced = document.createElement("td");
tdQuantityProduced.classList.add(flagQuantityProduced);
let inputQuantityProduced = document.createElement("input");
inputQuantityProduced.classList.add(flagQuantityProduced);
inputQuantityProduced.type = 'number';
DOM.setElementValuesCurrentAndPrevious(inputQuantityProduced, orderItem[flagQuantityProduced]);
tdQuantityProduced.appendChild(inputQuantityProduced);
/*
let tdCostTotalLocalVatExcl = document.createElement("td");
tdCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
let inputCostTotalLocalVatExcl = document.createElement("input");
inputCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
inputCostTotalLocalVatExcl.type = 'number';
inputCostTotalLocalVatExcl.step = 0.01;
DOM.setElementAttributesValuesCurrentAndPrevious(inputCostTotalLocalVatExcl, orderItem[flagCostTotalLocalVatExcl]);
tdCostTotalLocalVatExcl.appendChild(inputCostTotalLocalVatExcl);
let tdCostTotalLocalVatIncl = document.createElement("td");
tdCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
let inputCostTotalLocalVatIncl = document.createElement("input");
inputCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
inputCostTotalLocalVatIncl.type = 'number';
inputCostTotalLocalVatIncl.step = 0.01;
DOM.setElementAttributesValuesCurrentAndPrevious(inputCostTotalLocalVatIncl, orderItem[flagCostTotalLocalVatIncl]);
tdCostTotalLocalVatIncl.appendChild(inputCostTotalLocalVatIncl);
let tdCostUnitLocalVatExcl = document.createElement("td");
tdCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
let divCostUnitLocalVatExcl = document.createElement("div");
divCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, orderItem[flagCostUnitLocalVatExcl]);
tdCostUnitLocalVatExcl.appendChild(divCostUnitLocalVatExcl);
let tdCostUnitLocalVatIncl = document.createElement("td");
tdCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
let divCostUnitLocalVatIncl = document.createElement("div");
divCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, orderItem[flagCostUnitLocalVatIncl]);
tdCostUnitLocalVatIncl.appendChild(divCostUnitLocalVatIncl);
*/
let tdUnitMeasurementLatencyManufacture = document.createElement("td");
tdUnitMeasurementLatencyManufacture.classList.add(flagUnitMeasurementLatencyManufacture);
DOM.setElementAttributesValuesCurrentAndPrevious(tdUnitMeasurementLatencyManufacture, orderItem[attrIdUnitMeasurementLatencyManufacture]);
let divUnitMeasurementLatencyManufacture = document.createElement("div");
divUnitMeasurementLatencyManufacture.classList.add(flagUnitMeasurementLatencyManufacture);
// DOM.setElementValuesCurrentAndPrevious(divUnitMeasurementLatencyManufacture, orderItem[flagUnitMeasurementLatencyManufacture]);
let unitMeasurementLatencyManufacture = unitMeasurementsTime[orderItem[attrIdUnitMeasurementLatencyManufacture]];
divUnitMeasurementLatencyManufacture.textContent = BusinessObjects.getObjectText(unitMeasurementLatencyManufacture);
tdUnitMeasurementLatencyManufacture.appendChild(divUnitMeasurementLatencyManufacture);
let tdLatencyManufacture = document.createElement("td");
tdLatencyManufacture.classList.add(flagLatencyManufacture);
let inputLatencyManufacture = document.createElement("input");
inputLatencyManufacture.classList.add(flagLatencyManufacture);
inputLatencyManufacture.type = 'number';
inputLatencyManufacture.step = 1;
DOM.setElementValuesCurrentAndPrevious(inputLatencyManufacture, orderItem[flagLatencyManufacture]);
tdLatencyManufacture.appendChild(inputLatencyManufacture);
let tdActive = this.createTdActive(orderItem[flagActive]);
let tr = document.createElement("tr");
tr.classList.add(flagOrderItems);
tr.setAttribute(attrIdManufacturingPurchaseOrder, orderItem[attrIdManufacturingPurchaseOrder]);
tr.setAttribute(attrIdManufacturingPurchaseOrderProductLink, orderItem[attrIdManufacturingPurchaseOrderProductLink]);
tr.appendChild(tdDisplayOrder);
tr.appendChild(tdCategory);
tr.appendChild(tdProduct);
tr.appendChild(tdVariations);
tr.appendChild(tdUnitQuantity);
tr.appendChild(tdQuantityUsed);
tr.appendChild(tdQuantityProduced);
/*
tr.appendChild(tdCostTotalLocalVatExcl);
tr.appendChild(tdCostTotalLocalVatIncl);
tr.appendChild(tdCostUnitLocalVatExcl);
tr.appendChild(tdCostUnitLocalVatIncl);
*/
tr.appendChild(tdUnitMeasurementLatencyManufacture);
tr.appendChild(tdLatencyManufacture);
tr.appendChild(tdActive);
tbody.appendChild(tr);
}
hookupFieldsOrderItemDisplayOrder() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagDisplayOrder + ' input');
}
hookupFieldsOrderItemProductCategory() {
this.hookupTableCellDdlPreviews(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductCategory
, Utils.getListFromDict(productCategories)
, (cellSelector) => { this.hookupProductCategoryDdls(cellSelector); }
);
}
hookupFieldsOrderItemProduct() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagOrderItems + ' td.' + flagProduct, Utils.getListFromDict(products));
}
hookupFieldsOrderItemProductVariations() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductVariations, (event, element) => this.handleClickProductPermutationVariationsPreview(event, element));
}
hookupFieldsOrderItemUnitQuantity() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagOrderItems + ' td.' + flagUnitMeasurementQuantity, Utils.getListFromDict(unitMeasurements));
}
hookupFieldsOrderItemQuantityUsed() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagQuantityUsed + ' input');
}
hookupFieldsOrderItemQuantityProduced() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagQuantityProduced + ' input');
}
/*
hookupFieldsOrderItemPriceTotalLocalVatExcl() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagPriceTotalLocalVatExcl + ' input'
, (event, element) => {
this.handleChangeNestedElementCellTable(event, element);
this.updateFieldsPriceUnitLocalVatExcl(element);
}
);
}
hookupFieldsOrderItemPriceTotalLocalVatIncl() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagPriceTotalLocalVatIncl + ' input'
, (event, element) => {
this.handleChangeNestedElementCellTable(event, element);
this.updateFieldsPriceUnitLocalVatIncl(element);
}
);
}
updateFieldsPriceUnitLocalVatExcl(elementChanged) {
let row = elementChanged.closest('tr.' + flagOrderItems);
let inputPriceTotalLocalVatExcl = row.querySelector('td.' + flagPriceTotalLocalVatExcl + ' input');
let priceTotalLocalVatExcl = DOM.getElementValueCurrent(inputPriceTotalLocalVatExcl);
let inputQuantityUsed = row.querySelector('td.' + flagQuantityUsed + ' input');
let quantityUsed = DOM.getElementValueCurrent(inputQuantityUsed);
let divPriceUnitLocalVatExcl = row.querySelector('td.' + flagPriceUnitLocalVatExcl + ' div');
let priceUnitLocalVatExcl = quantityUsed == 0 ? 0 : priceTotalLocalVatExcl / quantityUsed;
DOM.setElementValuesCurrentAndPrevious(divPriceUnitLocalVatExcl, priceUnitLocalVatExcl);
let rowManufacturingPurchaseOrder = row.closest(idTableMain + ' > tbody > tr');
let divPriceGrandTotalLocalVatExcl = rowManufacturingPurchaseOrder.querySelector('td.' + flagPriceTotalLocalVatExcl + ' div');
let inputsPriceTotalLocalVatExcl = rowManufacturingPurchaseOrder.querySelectorAll('td.' + flagOrderItems + ' td.' + flagPriceTotalLocalVatExcl + ' input');
let priceGrandTotalLocalVatExcl = Array.from(inputsPriceTotalLocalVatExcl).reduce((acc, input) => acc + Number(DOM.getElementValueCurrent(input)), 0);
DOM.setElementValueCurrent(divPriceGrandTotalLocalVatExcl, priceGrandTotalLocalVatExcl);
}
updateFieldsPriceUnitLocalVatIncl(elementChanged) {
let row = elementChanged.closest('tr.' + flagOrderItems);
let inputPriceTotalLocalVatIncl = row.querySelector('td.' + flagPriceTotalLocalVatIncl + ' input');
let priceTotalLocalVatIncl = DOM.getElementValueCurrent(inputPriceTotalLocalVatIncl);
let inputQuantityUsed = row.querySelector('td.' + flagQuantityUsed + ' input');
let quantityUsed = DOM.getElementValueCurrent(inputQuantityUsed);
let divPriceUnitLocalVatIncl = row.querySelector('td.' + flagPriceUnitLocalVatIncl + ' div');
let priceUnitLocalVatIncl = quantityUsed == 0 ? 0 : priceTotalLocalVatIncl / quantityUsed;
DOM.setElementValuesCurrentAndPrevious(divPriceUnitLocalVatIncl, priceUnitLocalVatIncl);
let rowManufacturingPurchaseOrder = row.closest(idTableMain + ' > tbody > tr');
let divPriceGrandTotalLocalVatIncl = rowManufacturingPurchaseOrder.querySelector('td.' + flagPriceTotalLocalVatIncl + ' div');
let inputsPriceTotalLocalVatIncl = rowManufacturingPurchaseOrder.querySelectorAll('td.' + flagOrderItems + ' td.' + flagPriceTotalLocalVatIncl + ' input');
let priceGrandTotalLocalVatIncl = Array.from(inputsPriceTotalLocalVatIncl).reduce((acc, input) => acc + Number(DOM.getElementValueCurrent(input)), 0);
DOM.setElementValueCurrent(divPriceGrandTotalLocalVatIncl, priceGrandTotalLocalVatIncl);
}
hookupFieldsOrderItemPriceUnitLocalVatExcl() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagPriceUnitLocalVatExcl + ' input');
}
hookupFieldsOrderItemPriceUnitLocalVatIncl() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagPriceUnitLocalVatIncl + ' input');
}
*/
hookupFieldsOrderItemUnitMeasurementLatencyManufacture() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagOrderItems + ' td.' + flagUnitMeasurementLatencyManufacture, Utils.getListFromDict(unitMeasurementsTime));
}
hookupFieldsOrderItemLatencyManufacture() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagLatencyManufacture + ' input');
}
hookupFieldsOrderItemActive() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' input.' + flagActive);
}
hookupFieldsOrderItemAddDelete() {
let selectorButton = idTableMain + ' td.' + flagOrderItems + ' td.' + flagOrderItems + ' button';
let selectorButtonDelete = selectorButton + '.' + flagDelete;
let selectorButtonUndelete = selectorButton + '.' + flagAdd;
this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsOrderItemAdd();
}
hookupButtonsOrderItemAdd() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' th button.' + flagAdd, (event, element) => {
let row = element.closest(idTableMain + ' > tbody > tr');
let idManufacturingPurchaseOrder = row.getAttribute(attrIdManufacturingPurchaseOrder);
// let hasActiveOrderItem = row.querySelectorAll('td.' + flagOrderItems + ' input.' + flagActive + ':checked').length > 0;
let countManufacturingOrderItems = row.querySelectorAll('td.' + flagOrderItems + ' td.' + flagManufacturingPurchaseOrder).length;
let manufacturingPurchaseOrderItem = {
[attrIdManufacturingPurchaseOrder]: idManufacturingPurchaseOrder,
[attrIdManufacturingPurchaseOrderProductLink]: -1 - countManufacturingOrderItems,
[attrIdProductCategory]: 0,
[attrIdProduct]: 0,
[flagProductVariations]: '',
[attrIdUnitMeasurementQuantity]: 0,
[flagQuantityUsed]: '',
[flagQuantityProduced]: '',
[attrIdUnitMeasurementLatencyManufacture]: 0,
[flagLatencyManufacture]: '',
[flagDisplayOrder]: countManufacturingOrderItems + 1,
[flagActive]: true, // !hasActiveOrderItem,
};
let tbody = row.querySelector('td.' + flagOrderItems + ' table tbody');
this.addRowManufacturingPurchaseOrderItem(tbody, manufacturingPurchaseOrderItem);
/*
if (!hasActiveOrderItem) {
let tdOrderItem = row.querySelector('td.' + flagOrderItems);
// tdOrderItem.setAttribute(attrIdManufacturingOrderItem, manufacturingPurchaseOrderItem[attrIdManufacturingOrderItem]);
DOM.setElementAttributeValueCurrent(tdOrderItem, manufacturingPurchaseOrderItem[attrIdManufacturingOrderItem]);
}
*/
this.hookupOrderItemsFields();
});
}
leave() {
super.leave();
}
}

View File

@@ -13,7 +13,7 @@ export default class DogMixinPage {
}
initialize() {
console.log('hookup dog start for ', this.page.hash);
Utils.consoleLogIfNotProductionEnvironment('hookup dog start for ', this.page.hash);
this.hookupFilters();
this.hookupLocalStorageDog();
}
@@ -29,14 +29,14 @@ export default class DogMixinPage {
let d; // , lsShared;
let selectorCardProduct = '.card.subcard';
Events.initialiseEventHandler(selectorCardProduct, flagInitialised, function(cardProduct) {
if (_verbose) { console.log("initialising product card: ", cardProduct); }
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("initialising product card: ", cardProduct); }
cardProduct.addEventListener("click", function(event) {
// d = { keyIdProduct: product.getAttribute(attrIdProduct) }
var elemClicked = event.target;
if (elemClicked.id != 'submit') { // disable for submit buttons
if (_verbose) {
console.log("product click: " + cardProduct.getAttribute(attrIdProduct));
console.log("permutation click: " + cardProduct.getAttribute(attrIdPermutation));
Utils.consoleLogIfNotProductionEnvironment("product click: " + cardProduct.getAttribute(attrIdProduct));
Utils.consoleLogIfNotProductionEnvironment("permutation click: " + cardProduct.getAttribute(attrIdPermutation));
}
var d = {}
d[keyIdProduct] = cardProduct.getAttribute(attrIdProduct)
@@ -45,7 +45,7 @@ export default class DogMixinPage {
goToPage(hashPageDogProduct, d);
}
});
if (_verbose) { console.log("click method added for product ID: " + cardProduct.getAttribute(attrIdProduct) + ', permutation ID: ', cardProduct.getAttribute(attrIdPermutation)); }
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("click method added for product ID: " + cardProduct.getAttribute(attrIdProduct) + ', permutation ID: ', cardProduct.getAttribute(attrIdPermutation)); }
});
}
*/

View File

@@ -1,240 +0,0 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogProductVariations extends TableBasePage {
static hash = hashPageDogProductVariations;
static attrIdRowObject = attrIdProductVariationType;
callSaveTableContent = API.saveProductVariations;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterActive();
this.hookupFilterIsNotEmpty();
}
loadRowTable(rowJson) {
}
getJsonRow(row) {
if (row == null) return;
let inputDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' input');
let textareaCode = row.querySelector('td.' + flagCode + ' textarea');
let textareaName = row.querySelector('td.' + flagName + ' textarea');
let textareaNamePlural = row.querySelector('td.' + flagNamePlural + ' textarea');
let tdProductVariations = row.querySelector('td.' + flagProductVariations);
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdProductVariationType] = row.getAttribute(attrIdProductVariationType);
if (Validation.isEmpty(jsonRow[attrIdProductVariationType])) jsonRow[attrIdProductVariationType] = -1;
jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
jsonRow[flagCode] = DOM.getElementAttributeValueCurrent(textareaCode);
jsonRow[flagName] = DOM.getElementAttributeValueCurrent(textareaName);
jsonRow[flagNamePlural] = DOM.getElementAttributeValueCurrent(textareaNamePlural);
let variations = [];
if (tdProductVariations.classList.contains(flagDirty)) {
let trsProductVariation = tdProductVariations.querySelectorAll('tr.' + flagProductVariation + '.' + flagDirty);
if (trsProductVariation != null) {
trsProductVariation.forEach((tr, indexRow) => {
variations.push(this.getJsonRowProductVariation(tr, indexRow));
});
}
}
else {
// variations = BusinessObjects.getListObjectsFromIdDictAndCsv(productVariationTypes, DOM.getElementAttributeValueCurrent(tdProductVariations));
}
jsonRow[flagProductVariations] = variations;
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
getJsonRowProductVariation(tr, indexRow) {
let inputDisplayOrder = tr.querySelector('td.' + flagDisplayOrder + ' input');
let textareaCode = tr.querySelector('td.' + flagCode + ' textarea');
let textareaName = tr.querySelector('td.' + flagName + ' textarea');
// let checkboxActive = tr.querySelector('td.' + flagActive + ' input');
let buttonActive = tr.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdProductVariation] = tr.getAttribute(attrIdProductVariation);
if (Validation.isEmpty(jsonRow[attrIdProductVariation])) jsonRow[attrIdProductVariation] = -1 - indexRow;
jsonRow[attrIdProductVariationType] = tr.getAttribute(attrIdProductVariationType);
jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
jsonRow[flagCode] = DOM.getElementAttributeValueCurrent(textareaCode);
jsonRow[flagName] = DOM.getElementAttributeValueCurrent(textareaName);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
super.initialiseRowNew(tbody, row);
this.initialiseSliderDisplayOrderRowNew(tbody, row);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupSlidersDisplayOrderTable();
this.hookupTextareasCodeTable();
this.hookupTextareasNameTable();
this.hookupTextareasNamePluralTable();
this.hookupFieldsProductVariation();
this.hookupFieldsActive();
}
hookupTextareasNamePluralTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' tbody tr td.' + flagNamePlural + ' textarea');
}
hookupFieldsProductVariation() {
this.hookupProductVariationsPreviews();
this.hookupFieldsProductVariationDisplayOrder();
this.hookupFieldsProductVariationCode();
this.hookupFieldsProductVariationName();
this.hookupFieldsProductVariationActive();
}
hookupProductVariationsPreviews() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations + ' div', (event, element) => {
let td = DOM.getCellFromElement(element);
if (!td.classList.contains(flagCollapsed)) return;
this.handleClickProductVariationsPreview(event, element);
});
}
handleClickProductVariationsPreview(event, element) {
if (_verbose) { console.log("click order items preview"); }
let row = DOM.getRowFromElement(element);
let idProductVariationType = row.getAttribute(attrIdProductVariationType);
let productVariationType = productVariationTypes[idProductVariationType];
if (productVariationType == null) productVariationType = {
[flagProductVariations]: [],
};
let tblProductVariations = document.createElement("table");
tblProductVariations.classList.add(flagProductVariations);
let thead = document.createElement("thead");
let tr = document.createElement("tr");
let thDisplayOrder = document.createElement("th");
thDisplayOrder.classList.add(flagDisplayOrder);
thDisplayOrder.textContent = 'Display Order';
let thCode = document.createElement("th");
thCode.classList.add(flagCode);
thCode.textContent = 'Code';
let thName = document.createElement("th");
thName.classList.add(flagName);
thName.textContent = 'Name';
let thActive = document.createElement("th");
thActive.classList.add(flagActive);
// thActive.textContent = 'Active';
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagActive);
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
thActive.appendChild(buttonAdd);
tr.appendChild(thDisplayOrder);
tr.appendChild(thCode);
tr.appendChild(thName);
tr.appendChild(thActive);
thead.appendChild(tr);
tblProductVariations.appendChild(thead);
let tbody = document.createElement("tbody");
productVariationType[flagProductVariations].forEach((productVariation, index) => {
this.addRowProductVariation(tbody, productVariation);
});
tblProductVariations.appendChild(tbody);
let cell = DOM.getCellFromElement(element);
let cellNew = cell.cloneNode(false);
cellNew.appendChild(tblProductVariations);
cellNew.classList.remove(flagCollapsed);
row.replaceChild(cellNew, cell);
if (_verbose) { console.log("tblProductVariations: ", tblProductVariations); }
this.toggleColumnHeaderCollapsed(flagProductVariations, false);
this.hookupFieldsProductVariation();
}
addRowProductVariation(tbody, productVariation) {
if (_verbose) { console.log("addRowProductVariation: ", productVariation); }
let tdDisplayOrder = document.createElement("td");
tdDisplayOrder.classList.add(flagDisplayOrder);
let inputDisplayOrder = document.createElement("input");
inputDisplayOrder.classList.add(flagDisplayOrder);
inputDisplayOrder.type = 'number';
inputDisplayOrder.step = 1;
DOM.setElementValuesCurrentAndPrevious(inputDisplayOrder, productVariation[flagDisplayOrder]);
tdDisplayOrder.appendChild(inputDisplayOrder);
let tdCode = document.createElement("td");
tdCode.classList.add(flagCode);
let textareaCode = document.createElement("textarea");
textareaCode.classList.add(flagCode);
DOM.setElementValuesCurrentAndPrevious(textareaCode, productVariation[flagCode]);
tdCode.appendChild(textareaCode);
let tdName = document.createElement("td");
tdName.classList.add(flagName);
let textareaName = document.createElement("textarea");
textareaName.classList.add(flagName);
DOM.setElementValuesCurrentAndPrevious(textareaName, productVariation[flagName]);
tdName.appendChild(textareaName);
let tdActive = this.createTdActive(productVariation[flagActive]);
let tr = document.createElement("tr");
tr.classList.add(flagProductVariation);
tr.setAttribute(attrIdProductVariationType, productVariation[attrIdProductVariationType]);
tr.setAttribute(attrIdProductVariation, productVariation[attrIdProductVariation]);
tr.appendChild(tdDisplayOrder);
tr.appendChild(tdCode);
tr.appendChild(tdName);
tr.appendChild(tdActive);
tbody.appendChild(tr);
}
hookupFieldsProductVariationDisplayOrder() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagProductVariations + ' td.' + flagDisplayOrder + ' input');
}
hookupFieldsProductVariationCode() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagProductVariations + ' textarea.' + flagCode);
}
hookupFieldsProductVariationName() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagProductVariations + ' textarea.' + flagName);
}
hookupFieldsProductVariationActive() {
this.hookupFieldsActive(flagProductVariations, (event, element) => { this.hookupButtonsProductVariationAdd(event, element); });
}
hookupButtonsProductVariationAdd(event, element) {
let row = element.closest(idTableMain + ' > tbody > tr');
let idProductVariationType = row.getAttribute(attrIdProductVariationType);
let idProductVariation = row.getAttribute(attrIdProductVariation);
let countProductVariations = row.querySelectorAll('td.' + flagProductVariations + ' tr').length;
let productVariation = {
[attrIdProductVariationType]: idProductVariationType,
[attrIdProductVariation]: idProductVariation,
[flagCode]: '',
[flagName]: '',
[flagDisplayOrder]: countProductVariations,
[flagActive]: true,
};
let tbody = row.querySelector('td.' + flagProductVariations + ' table tbody');
this.addRowProductVariation(tbody, productVariation);
this.hookupFieldsProductVariation();
}
leave() {
super.leave();
}
}

View File

@@ -1,355 +0,0 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogStockItems extends TableBasePage {
static hash = hashPageDogStockItems;
static attrIdRowObject = attrIdStockItem;
callSaveTableContent = API.saveStockItems;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterProductCategory();
this.hookupFilterProduct();
this.hookupFilterOutOfStock();
this.hookupFilterMinStock();
this.hookupFilterMaxStock();
}
hookupFilterProductCategory() {
this.hookupFilter(flagProductCategory, (event, filterCategory) => {
// loadPermutations();
// let wasDirtyFilter = filterCategory.classList.contains(flagDirty);
PageDogStockItems.isDirtyFilter(filterCategory);
let isDirtyFilter = filterCategory.classList.contains(flagDirty);
let idProductCategory = DOM.getElementValueCurrent(filterCategory);
let products = productCategories[idProductCategory];
let filterProduct = document.querySelector(idFormFilters + ' .' + flagProduct);
let idProductPrevious = filterProduct.getAttribute(attrValuePrevious);
filterProduct.innerHTML = '';
let optionJson, option;
option = DOM.createOption(null);
filterProduct.appendChild(option);
products.forEach((product) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(product, idProductPrevious);
option = DOM.createOption(optionJson);
filterProduct.appendChild(option);
});
filterProduct.dispatchEvent(new Event('change'));
});
}
hookupFilterProduct() {
this.hookupFilter(flagProduct);
}
hookupFilterOutOfStock() {
this.hookupFilter(flagIsOutOfStock);
}
hookupFilterMinStock() {
this.hookupFilter(flagQuantityMin);
}
hookupFilterMaxStock() {
this.hookupFilter(flagQuantityMax);
}
loadRowTable(rowJson) {
}
getJsonRow(row) {
if (row == null) return;
let tdProductCategory = row.querySelector('td.' + flagProductCategory);
let tdProduct = row.querySelector('td.' + flagProduct);
let tdProductVariations = row.querySelector('td.' + flagProductVariations);
let tdCurrencyCost = row.querySelector('td.' + flagCurrencyCost);
let inputCostLocalVatExcl = row.querySelector('td.' + flagCostUnitLocalVatExcl + ' input');
let inputCostLocalVatIncl = row.querySelector('td.' + flagCostUnitLocalVatIncl + ' input');
let inputDatePurchased = row.querySelector('td.' + flagDatePurchased + ' input');
let inputDateReceived = row.querySelector('td.' + flagDateReceived + ' input');
let tdStorageLocation = row.querySelector('td.' + flagStorageLocation);
let inputIsSealed = row.querySelector('td.' + flagIsSealed + ' input');
let inputDateUnsealed = row.querySelector('td.' + flagDateUnsealed + ' input');
let inputDateExpiration = row.querySelector('td.' + flagDateExpiration + ' input');
let inputIsConsumed = row.querySelector('td.' + flagIsConsumed + ' input');
let inputDateConsumed = row.querySelector('td.' + flagDateConsumed + ' input');
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdStockItem] = row.getAttribute(attrIdStockItem);
jsonRow[attrIdProductPermutation] = tdProductVariations.getAttribute(attrIdProductPermutation);
jsonRow[attrIdProductCategory] = DOM.getElementAttributeValueCurrent(tdProductCategory);
jsonRow[attrIdProduct] = DOM.getElementAttributeValueCurrent(tdProduct);
jsonRow[flagProductVariations] = DOM.getElementAttributeValueCurrent(tdProductVariations);
jsonRow[flagHasVariations] = jsonRow[flagProductVariations] != '';
jsonRow[flagCurrencyCost] = DOM.getElementAttributeValueCurrent(tdCurrencyCost);
jsonRow[flagCostUnitLocalVatExcl] = DOM.getElementAttributeValueCurrent(inputCostLocalVatExcl);
jsonRow[flagCostUnitLocalVatIncl] = DOM.getElementAttributeValueCurrent(inputCostLocalVatIncl);
jsonRow[flagDatePurchased] = DOM.getElementAttributeValueCurrent(inputDatePurchased);
jsonRow[flagDateReceived] = DOM.getElementAttributeValueCurrent(inputDateReceived);
jsonRow[attrIdStorageLocation] = DOM.getElementAttributeValueCurrent(tdStorageLocation);
jsonRow[flagIsSealed] = DOM.getElementAttributeValueCurrent(inputIsSealed);
jsonRow[flagDateUnsealed] = DOM.getElementAttributeValueCurrent(inputDateUnsealed);
jsonRow[flagDateExpiration] = DOM.getElementAttributeValueCurrent(inputDateExpiration);
jsonRow[flagIsConsumed] = DOM.getElementAttributeValueCurrent(inputIsConsumed);
jsonRow[flagDateConsumed] = DOM.getElementAttributeValueCurrent(inputDateConsumed);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
super.initialiseRowNew(tbody, row);
let ddlCategoryFilter = document.querySelector(idFormFilters + ' #' + attrIdProductCategory);
let idProductCategoryFilter = DOM.getElementValueCurrent(ddlCategoryFilter);
let hasCategoryFilter = !(Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');
let ddlProductFilter = document.querySelector(idFormFilters + ' #' + attrIdProduct);
let idProductFilter = DOM.getElementValueCurrent(ddlProductFilter);
let hasProductFilter = !(Validation.isEmpty(idProductFilter) || idProductFilter == '0');
if (_verbose) {
console.log("initialiseRowNew: ", row);
console.log({ddlCategoryFilter, idProductCategoryFilter, hasCategoryFilter, ddlProductFilter, idProductFilter, hasProductFilter});
}
if (!hasCategoryFilter && !hasProductFilter) return;
if (hasCategoryFilter) {
let ddlCategory = row.querySelector('td.' + flagProductCategory + ' select');
DOM.setElementValuesCurrentAndPrevious(ddlCategory, idProductCategoryFilter);
this.handleChangeProductCategoryDdl(null, ddlCategory);
}
if (hasProductFilter) {
let ddlProduct = row.querySelector('td.' + flagProduct + ' select');
DOM.setElementValuesCurrentAndPrevious(ddlProduct, idProductFilter);
}
}
hookupTableMain() {
super.hookupTableMain();
this.hookupProductCategoryFields();
this.hookupProductFields();
this.hookupFieldsProductPermutationVariation();
this.hookupCurrencyCostFields();
this.hookupCostInputs();
this.hookupOrderDateInputs();
this.hookupStorageLocationFields();
this.hookupSealingInputs();
this.hookupExpirationDateInputs();
this.hookupConsumationInputs();
this.hookupFieldsActive();
}
hookupProductCategoryFields() {
this.hookupTableCellDdlPreviews(
idTableMain + ' td.' + flagProductCategory
, Utils.getListFromDict(productCategories)
, (event, element) => { this.hookupProductCategoryDdls(event, element); }
);
}
hookupProductFields() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagProduct, Utils.getListFromDict(products));
}
/*
handleClickProductPermutationVariationsPreview(event, element) {
let row = DOM.getRowFromElement(element);
let tdProduct = row.querySelector('td.' + flagProduct);
let idProduct = DOM.getElementValueCurrent(tdProduct);
let product = products[idProduct];
if (!product[flagHasVariations]) return;
super.handleClickProductPermutationVariationsPreview(event, element);
}
*/
handleClickButtonProductPermutationVariationsAdd(event, element) {
let row = DOM.getRowFromElement(element);
let tbody = row.querySelector('tbody');
let permutationVariation = PageDogStockItems.createOptionUnselectedProductVariation();
this.addProductPermutationVariationRow(tbody, permutationVariation);
}
hookupCurrencyCostFields(){
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagCurrencyCost, Utils.getListFromDict(currencies));
}
hookupCostInputs(){
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostUnitLocalVatExcl + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostUnitLocalVatIncl + ' input');
}
hookupOrderDateInputs(){
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagDatePurchased + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagDateReceived + ' input');
}
hookupStorageLocationFields(){
this.hookupEventHandler(
"click",
idTableMain + ' td.' + flagStorageLocation + ' div',
(event, element) => this.handleClickStorageLocationPreview(event, element)
);
}
handleClickStorageLocationPreview(event, element) {
this.toggleColumnCollapsed(flagStorageLocation, false);
let idPlant = element.getAttribute(attrIdPlant);
let idStorageLocation = element.getAttribute(attrIdStorageLocation);
let tblStorageLocation = document.createElement("table");
tblStorageLocation.classList.add(flagStorageLocation);
let thead = document.createElement("thead");
let thPlant = document.createElement("th");
thPlant.textContent = 'Plant';
let thLocation = document.createElement("th");
thLocation.textContent = 'Location';
let trHead = document.createElement("tr");
trHead.appendChild(thPlant);
trHead.appendChild(thLocation);
thead.appendChild(trHead);
tblStorageLocation.appendChild(thead);
let tbody = document.createElement("tbody");
let plant, optionPlantJson, optionPlant, storageLocation, optionStorageLocationJson, optionStorageLocation;
let plantKeys = Object.keys(plants);
let storageLocationKeys = Object.keys(storageLocations);
debugger;
let plantJson = idPlant != null ? plants[idPlant] : {
[attrIdPlant]: null,
};
let storageLocationJson = idStorageLocation != null ? storageLocations[idStorageLocation] : {
[attrIdStorageLocation]: null,
};
let tdPlant = document.createElement("td");
tdPlant.classList.add(flagPlant);
DOM.setElementAttributesValuesCurrentAndPrevious(tdPlant, plantJson[attrIdPlant]);
let ddlPlant = document.createElement("select");
ddlPlant.classList.add(flagPlant);
DOM.setElementAttributesValuesCurrentAndPrevious(ddlPlant, plantJson[attrIdPlant]);
optionPlant = DOM.createOption(null);
if (_verbose) { console.log("optionPlant: ", optionPlant); }
ddlPlant.appendChild(optionPlant);
plantKeys.forEach((plantKey) => {
plant = plants[plantKey];
optionPlantJson = BusinessObjects.getOptionJsonFromObjectJson(
plant, // objectJson
plantJson[attrIdPlant] // valueSelected
);
optionPlant = DOM.createOption(optionPlantJson);
if (_verbose) { console.log("optionPlant: ", optionPlant); }
ddlPlant.appendChild(optionPlant);
});
let tdStorageLocation = document.createElement("td");
tdStorageLocation.classList.add(flagStorageLocation);
DOM.setElementAttributesValuesCurrentAndPrevious(tdStorageLocation, storageLocationJson[attrIdStorageLocation]);
let ddlStorageLocation = document.createElement("select");
ddlStorageLocation.classList.add(flagStorageLocation);
DOM.setElementAttributesValuesCurrentAndPrevious(ddlStorageLocation, storageLocationJson[attrIdStorageLocation]);
optionStorageLocation = DOM.createOption(null);
if (_verbose) { console.log("optionStorageLocation: ", optionStorageLocation); }
ddlStorageLocation.appendChild(optionStorageLocation);
storageLocationKeys.forEach((StorageLocationKey) => {
storageLocation = storageLocations[StorageLocationKey];
optionStorageLocationJson = BusinessObjects.getOptionJsonFromObjectJson(
storageLocation, // objectJson
storageLocationJson[attrIdStorageLocation] // valueSelected
);
optionStorageLocation = DOM.createOption(optionStorageLocationJson);
if (_verbose) { console.log("optionStorageLocation: ", optionStorageLocation); }
ddlStorageLocation.appendChild(optionStorageLocation);
});
let trBody = document.createElement("tr");
tdPlant.appendChild(ddlPlant);
trBody.appendChild(tdPlant);
tdStorageLocation.appendChild(ddlStorageLocation);
trBody.appendChild(tdStorageLocation);
tbody.appendChild(trBody);
tblStorageLocation.appendChild(tbody);
let tdParent = DOM.getCellFromElement(element);
tdParent.innerHTML = '';
tdParent.appendChild(tblStorageLocation);
if (_verbose) { console.log("tblStorageLocation: ", tblStorageLocation); }
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagPlant + ' select', (event, element) => { this.handleChangeStoragePlantDdl(event, element); });
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagStorageLocation + ' select', (event, element) => { this.handleChangeStorageLocationDdl(event, element); });
}
handleChangeStoragePlantDdl(event, ddlPlant) {
this.handleChangeNestedElementCellTable(event, ddlPlant);
let row = DOM.getRowFromElement(ddlPlant);
let ddlStorageLocation = row.querySelector('td.' + flagStorageLocation + ' select');
ddlStorageLocation.innerHTML = '';
ddlStorageLocation.appendChild(DOM.createOption(null));
let idPlant = DOM.getElementValueCurrent(ddlPlant);
let storageLocations = plants[idPlant][flagStorageLocations];
let optionJson, option;
storageLocations.forEach((storageLocation) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(storageLocation);
option = DOM.createOption(optionJson);
ddlStorageLocation.appendChild(option);
});
this.handleChangeNestedElementCellTable(event, ddlStorageLocation);
}
handleChangeStorageLocationDdl(event, ddlStorageLocation) {
this.handleChangeNestedElementCellTable(event, ddlStorageLocation);
}
hookupSealingInputs() {
this.hookupIsSealedFields();
this.hookupDateUnsealedInputs();
}
hookupIsSealedFields(){
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagIsSealed + ' input', (event, element) => {
this.handleChangeNestedElementCellTable(event, element);
let isSealed = DOM.getElementValueCurrent(element);
let row = DOM.getRowFromElement(element);
let inputDateUnsealed = row.querySelector('td.' + flagDateUnsealed + ' input');
if (isSealed) {
inputDateUnsealed.classList.add(flagCollapsed);
} else {
inputDateUnsealed.classList.remove(flagCollapsed);
}
});
}
hookupDateUnsealedInputs(){
this.hookupChangeHandlerTableCellsWhenNotCollapsed("change", idTableMain + ' td.' + flagDateUnsealed + ' input');
}
hookupExpirationDateInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagDateExpiration + ' input');
}
hookupConsumationInputs() {
this.hookupIsConsumedFields();
this.hookupDateConsumedInputs();
}
hookupIsConsumedFields(){
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagIsConsumed + ' input', (event, element) => {
this.handleChangeNestedElementCellTable(event, element);
let isConsumed = DOM.getElementValueCurrent(element);
let row = DOM.getRowFromElement(element);
let inputDateConsumed = row.querySelector('td.' + flagDateConsumed + ' input');
if (isConsumed) {
inputDateConsumed.classList.remove(flagCollapsed);
} else {
inputDateConsumed.classList.add(flagCollapsed);
}
});
}
hookupDateConsumedInputs(){
this.hookupChangeHandlerTableCellsWhenNotCollapsed("change", idTableMain + ' td.' + flagDateConsumed + ' input');
}
leave() {
super.leave();
}
}

View File

@@ -1,509 +0,0 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import ProductPermutation from "../../lib/business_objects/dog/product_permutation.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogSupplierPurchaseOrders extends TableBasePage {
static hash = hashPageDogSupplierPurchaseOrders;
static attrIdRowObject = attrIdSupplierPurchaseOrder;
callSaveTableContent = API.saveSupplierPurchaseOrders;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterActive();
}
loadRowTable(rowJson) {
}
getJsonRow(row) {
if (row == null) return;
let tdSupplier = row.querySelector('td.' + flagSupplier);
let tdCurrency = row.querySelector('td.' + flagCurrency);
let inputCostTotalLocalVatExcl = row.querySelector('td.' + flagCostTotalLocalVatExcl + ' input');
let inputCostTotalLocalVatIncl = row.querySelector('td.' + flagCostTotalLocalVatIncl + ' input');
let trsPurchaseOrderItem = row.querySelectorAll('tr.' + flagOrderItems);
let buttonActive = tr.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdSupplierPurchaseOrder] = row.getAttribute(attrIdSupplierPurchaseOrder);
jsonRow[attrIdSupplier] = DOM.getElementAttributeValueCurrent(tdSupplier);
jsonRow[attrIdCurrency] = DOM.getElementAttributeValueCurrent(tdCurrency);
jsonRow[flagCostTotalLocalVatExcl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatExcl);
jsonRow[flagCostTotalLocalVatIncl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatIncl);
// jsonRow[flagOrderItems] = DOM.getElementAttributeValueCurrent(tdItems);
let orderItems = [];
if (trsPurchaseOrderItem != null) {
trsPurchaseOrderItem.forEach((tr) => {
orderItems.push(this.getJsonRowOrderItem(tr));
});
}
jsonRow[flagOrderItems] = orderItems;
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
getJsonRowOrderItem(tr) {
let inputDisplayOrder = tr.querySelector('td.' + flagDisplayOrder + ' input');
let tdCategory = tr.querySelector('td.' + flagProductCategory);
let tdProduct = tr.querySelector('td.' + flagProduct);
let tdVariations = tr.querySelector('td.' + flagProductVariations);
let tdUnitQuantity = tr.querySelector('td.' + flagUnitMeasurementQuantity);
let inputQuantityOrdered = tr.querySelector('td.' + flagQuantityOrdered + ' input');
let inputQuantityReceived = tr.querySelector('td.' + flagQuantityReceived + ' input');
let inputCostTotalLocalVatExcl = tr.querySelector('td.' + flagCostTotalLocalVatExcl + ' input');
let inputCostTotalLocalVatIncl = tr.querySelector('td.' + flagCostTotalLocalVatIncl + ' input');
let inputLatencyDeliveryDays = tr.querySelector('td.' + flagLatencyDeliveryDays + ' input');
let buttonActive = tr.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdSupplierPurchaseOrder] = tr.getAttribute(attrIdSupplierPurchaseOrder);
jsonRow[attrIdSupplierPurchaseOrderProductLink] = tr.getAttribute(attrIdSupplierPurchaseOrderProductLink);
jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
jsonRow[attrIdProductCategory] = DOM.getElementAttributeValueCurrent(tdCategory);
jsonRow[attrIdProduct] = DOM.getElementAttributeValueCurrent(tdProduct);
jsonRow[flagProductVariations] = DOM.getElementAttributeValueCurrent(tdVariations);
jsonRow[attrIdUnitMeasurementQuantity] = DOM.getElementAttributeValueCurrent(tdUnitQuantity);
jsonRow[flagQuantityOrdered] = DOM.getElementAttributeValueCurrent(inputQuantityOrdered);
jsonRow[flagQuantityReceived] = DOM.getElementAttributeValueCurrent(inputQuantityReceived);
jsonRow[flagCostTotalLocalVatExcl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatExcl);
jsonRow[flagCostTotalLocalVatIncl] = DOM.getElementAttributeValueCurrent(inputCostTotalLocalVatIncl);
jsonRow[flagLatencyDeliveryDays] = DOM.getElementAttributeValueCurrent(inputLatencyDeliveryDays);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
initialiseRowNew(tbody, row) {
super.initialiseRowNew(tbody, row);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupSupplierFields();
this.hookupCurrencyFields();
this.hookupCostInputs();
this.hookupOrderItemsFields();
this.hookupFieldsActive();
}
hookupSupplierFields() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagSupplier, Utils.getListFromDict(suppliers));
}
hookupCostInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostTotalLocalVatExcl + ' input');
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagCostTotalLocalVatIncl + ' input');
}
hookupOrderItemsFields() {
this.hookupOrderItemsPreviews();
this.hookupFieldsOrderItemDisplayOrder();
this.hookupFieldsOrderItemProductCategory();
this.hookupFieldsOrderItemProduct();
// this.hookupFieldsOrderItemProductVariations();
this.hookupFieldsProductPermutationVariation();
this.hookupFieldsOrderItemUnitQuantity();
this.hookupFieldsOrderItemQuantityOrdered();
this.hookupFieldsOrderItemQuantityReceived();
this.hookupFieldsOrderItemCostTotalLocalVatExcl();
this.hookupFieldsOrderItemCostTotalLocalVatIncl();
this.hookupFieldsOrderItemLatencyDeliveryDays();
this.hookupFieldsOrderItemActive();
this.hookupFieldsOrderItemAddDelete();
}
hookupOrderItemsPreviews() {
this.hookupEventHandler("click", idTableMain + ' > tbody > tr > td.' + flagOrderItems + ' > div', (event, div) => {
let td = DOM.getCellFromElement(div);
if (!td.classList.contains(flagCollapsed)) return;
this.handleClickOrderItemsPreview(event, div);
});
}
handleClickOrderItemsPreview(event, element) {
if (_verbose) { console.log("click order items preview"); }
this.toggleColumnHeaderCollapsed(flagOrderItems, false);
/*
let td = DOM.getCellFromElement(element);
td.classList.remove(flagCollapsed);
*/
let row = DOM.getRowFromElement(element);
let idSupplierPurchaseOrder = row.getAttribute(attrIdSupplierPurchaseOrder);
// if (idSupplierPurchaseOrder == null || idSupplierPurchaseOrder < 1) return;
let supplierPurchaseOrder = supplierPurchaseOrders[idSupplierPurchaseOrder];
if (supplierPurchaseOrder == null) supplierPurchaseOrder = {
[flagOrderItems]: [],
};
let tblOrderItems = document.createElement("table");
tblOrderItems.classList.add(flagOrderItems);
let thead = document.createElement("thead");
let tr = document.createElement("tr");
let thDisplayOrder = document.createElement("th");
thDisplayOrder.classList.add(flagDisplayOrder);
thDisplayOrder.textContent = 'Display Order';
let thCategory = document.createElement("th");
thCategory.classList.add(flagProductCategory);
thCategory.textContent = 'Category';
let thProduct = document.createElement("th");
thProduct.classList.add(flagProduct);
thProduct.textContent = 'Product';
let thVariations = document.createElement("th");
thVariations.classList.add(flagProductVariations);
thVariations.classList.add(flagCollapsed);
thVariations.textContent = 'Variations';
let thUnitQuantity = document.createElement("th");
thUnitQuantity.classList.add(flagUnitMeasurementQuantity);
thUnitQuantity.textContent = 'Unit Quantity';
let thQuantityOrdered = document.createElement("th");
thQuantityOrdered.classList.add(flagQuantityOrdered);
thQuantityOrdered.textContent = 'Quantity Ordered';
let thQuantityReceived = document.createElement("th");
thQuantityReceived.classList.add(flagQuantityReceived);
thQuantityReceived.textContent = 'Quantity Received';
let thCostTotalLocalVatExcl = document.createElement("th");
thCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
thCostTotalLocalVatExcl.textContent = 'Cost Total Local VAT Excl';
let thCostTotalLocalVatIncl = document.createElement("th");
thCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
thCostTotalLocalVatIncl.textContent = 'Cost Total Local VAT Incl';
let thCostUnitLocalVatExcl = document.createElement("th");
thCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
thCostUnitLocalVatExcl.textContent = 'Cost Unit Local VAT Excl';
let thCostUnitLocalVatIncl = document.createElement("th");
thCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
thCostUnitLocalVatIncl.textContent = 'Cost Unit Local VAT Incl';
let thLatencyDeliveryDays = document.createElement("th");
thLatencyDeliveryDays.classList.add(flagLatencyDeliveryDays);
thLatencyDeliveryDays.textContent = 'Latency Delivery (Days)';
let thActive = document.createElement("th");
thActive.classList.add(flagActive);
thActive.textContent = 'Active';
let thAddDelete = document.createElement("th");
thAddDelete.classList.add(flagAdd);
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
thAddDelete.appendChild(buttonAdd);
tr.appendChild(thDisplayOrder);
tr.appendChild(thCategory);
tr.appendChild(thProduct);
tr.appendChild(thVariations);
tr.appendChild(thUnitQuantity);
tr.appendChild(thQuantityOrdered);
tr.appendChild(thQuantityReceived);
tr.appendChild(thCostTotalLocalVatExcl);
tr.appendChild(thCostTotalLocalVatIncl);
tr.appendChild(thCostUnitLocalVatExcl);
tr.appendChild(thCostUnitLocalVatIncl);
tr.appendChild(thLatencyDeliveryDays);
tr.appendChild(thActive);
tr.appendChild(thAddDelete);
thead.appendChild(tr);
tblOrderItems.appendChild(thead);
let tbody = document.createElement("tbody");
supplierPurchaseOrder[flagOrderItems].forEach((orderItem, index) => {
this.addRowSupplierPurchaseOrderItem(tbody, orderItem);
});
tblOrderItems.appendChild(tbody);
let cell = DOM.getCellFromElement(element);
let cellNew = cell.cloneNode(false);
cellNew.appendChild(tblOrderItems);
cellNew.classList.remove(flagCollapsed);
row.replaceChild(cellNew, cell);
if (_verbose) { console.log("tblOrderItems: ", tblOrderItems); }
this.hookupOrderItemsFields();
}
addRowSupplierPurchaseOrderItem(tbody, orderItem) { // productVariationTypeOptions, productVariationOptions, productCategoryOptions, productOptions, unitMeasurementOptions,
if (_verbose) { console.log("addRowSupplierPurchaseOrderItem: ", orderItem); }
let tdDisplayOrder = document.createElement("td");
tdDisplayOrder.classList.add(flagDisplayOrder);
let inputDisplayOrder = document.createElement("input");
inputDisplayOrder.classList.add(flagDisplayOrder);
inputDisplayOrder.type = 'number';
inputDisplayOrder.step = 1;
DOM.setElementValuesCurrentAndPrevious(inputDisplayOrder, orderItem[flagDisplayOrder]);
tdDisplayOrder.appendChild(inputDisplayOrder);
let tdCategory = document.createElement("td");
tdCategory.classList.add(flagProductCategory);
DOM.setElementAttributesValuesCurrentAndPrevious(tdCategory, orderItem[attrIdProductCategory]);
let divCategory = document.createElement("div");
divCategory.classList.add(flagProductCategory);
DOM.setElementAttributesValuesCurrentAndPrevious(divCategory, orderItem[attrIdProductCategory]);
// divCategory.textContent = orderItem[flagProductCategory];
let productCategory = productCategories[orderItem[attrIdProductCategory]];
divCategory.textContent = BusinessObjects.getObjectText(productCategory);
tdCategory.appendChild(divCategory);
let tdProduct = document.createElement("td");
tdProduct.classList.add(flagProduct);
DOM.setElementAttributesValuesCurrentAndPrevious(tdProduct, orderItem[attrIdProduct]);
let divProduct = document.createElement("div");
divProduct.classList.add(flagProduct);
DOM.setElementAttributesValuesCurrentAndPrevious(divProduct, orderItem[attrIdProduct]);
// divProduct.textContent = orderItem[flagProduct];
let product = products[orderItem[attrIdProduct]];
divProduct.textContent = BusinessObjects.getObjectText(product);
tdProduct.appendChild(divProduct);
let tdVariations = document.createElement("td");
tdVariations.classList.add(flagProductVariations);
tdVariations.classList.add(flagCollapsed);
DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[flagProductVariations]);
let divVariations = document.createElement("div");
divVariations.classList.add(flagProductVariations);
DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[flagProductVariations]);
// divVariations.textContent = orderItem[flagProductVariations];
let variationsText = ProductPermutation.getProductVariationsPreviewFromIdCsv(orderItem[flagProductVariations]);
divVariations.textContent = variationsText;
tdVariations.appendChild(divVariations);
let tdUnitQuantity = document.createElement("td");
tdUnitQuantity.classList.add(flagUnitMeasurementQuantity);
DOM.setElementAttributesValuesCurrentAndPrevious(tdUnitQuantity, orderItem[attrIdUnitMeasurementQuantity]);
let divUnitQuantity = document.createElement("div");
divUnitQuantity.classList.add(flagUnitMeasurementQuantity);
DOM.setElementAttributesValuesCurrentAndPrevious(divUnitQuantity, orderItem[attrIdUnitMeasurementQuantity]);
let unitQuantity = unitMeasurements[orderItem[attrIdUnitMeasurementQuantity]];
divUnitQuantity.textContent = BusinessObjects.getObjectText(unitQuantity);
tdUnitQuantity.appendChild(divUnitQuantity);
let tdQuantityOrdered = document.createElement("td");
tdQuantityOrdered.classList.add(flagQuantityOrdered);
let inputQuantityOrdered = document.createElement("input");
inputQuantityOrdered.classList.add(flagQuantityOrdered);
inputQuantityOrdered.type = 'number';
DOM.setElementValuesCurrentAndPrevious(inputQuantityOrdered, orderItem[flagQuantityOrdered]);
tdQuantityOrdered.appendChild(inputQuantityOrdered);
let tdQuantityReceived = document.createElement("td");
tdQuantityReceived.classList.add(flagQuantityReceived);
let inputQuantityReceived = document.createElement("input");
inputQuantityReceived.classList.add(flagQuantityReceived);
inputQuantityReceived.type = 'number';
DOM.setElementValuesCurrentAndPrevious(inputQuantityReceived, orderItem[flagQuantityReceived]);
tdQuantityReceived.appendChild(inputQuantityReceived);
let tdCostTotalLocalVatExcl = document.createElement("td");
tdCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
let inputCostTotalLocalVatExcl = document.createElement("input");
inputCostTotalLocalVatExcl.classList.add(flagCostTotalLocalVatExcl);
inputCostTotalLocalVatExcl.type = 'number';
inputCostTotalLocalVatExcl.step = 0.01;
DOM.setElementValuesCurrentAndPrevious(inputCostTotalLocalVatExcl, orderItem[flagCostTotalLocalVatExcl]);
tdCostTotalLocalVatExcl.appendChild(inputCostTotalLocalVatExcl);
let tdCostTotalLocalVatIncl = document.createElement("td");
tdCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
let inputCostTotalLocalVatIncl = document.createElement("input");
inputCostTotalLocalVatIncl.classList.add(flagCostTotalLocalVatIncl);
inputCostTotalLocalVatIncl.type = 'number';
inputCostTotalLocalVatIncl.step = 0.01;
DOM.setElementValuesCurrentAndPrevious(inputCostTotalLocalVatIncl, orderItem[flagCostTotalLocalVatIncl]);
tdCostTotalLocalVatIncl.appendChild(inputCostTotalLocalVatIncl);
let tdCostUnitLocalVatExcl = document.createElement("td");
tdCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
let divCostUnitLocalVatExcl = document.createElement("div");
divCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatExcl], 3, null));
tdCostUnitLocalVatExcl.appendChild(divCostUnitLocalVatExcl);
let tdCostUnitLocalVatIncl = document.createElement("td");
tdCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
let divCostUnitLocalVatIncl = document.createElement("div");
divCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatIncl], 3, null));
tdCostUnitLocalVatIncl.appendChild(divCostUnitLocalVatIncl);
let tdLatencyDeliveryDays = document.createElement("td");
tdLatencyDeliveryDays.classList.add(flagLatencyDeliveryDays);
let inputLatencyDeliveryDays = document.createElement("input");
inputLatencyDeliveryDays.classList.add(flagLatencyDeliveryDays);
inputLatencyDeliveryDays.type = 'number';
inputLatencyDeliveryDays.step = 1;
DOM.setElementValuesCurrentAndPrevious(inputLatencyDeliveryDays, orderItem[flagLatencyDeliveryDays]);
tdLatencyDeliveryDays.appendChild(inputLatencyDeliveryDays);
let tdActive = this.createTdActive(orderItem[flagActive]);
let tr = document.createElement("tr");
tr.classList.add(flagOrderItems);
tr.setAttribute(attrIdSupplierPurchaseOrder, orderItem[attrIdSupplierPurchaseOrder]);
tr.setAttribute(attrIdSupplierPurchaseOrderProductLink, orderItem[attrIdSupplierPurchaseOrderProductLink]);
tr.appendChild(tdDisplayOrder);
tr.appendChild(tdCategory);
tr.appendChild(tdProduct);
tr.appendChild(tdVariations);
tr.appendChild(tdUnitQuantity);
tr.appendChild(tdQuantityOrdered);
tr.appendChild(tdQuantityReceived);
tr.appendChild(tdCostTotalLocalVatExcl);
tr.appendChild(tdCostTotalLocalVatIncl);
tr.appendChild(tdCostUnitLocalVatExcl);
tr.appendChild(tdCostUnitLocalVatIncl);
tr.appendChild(tdLatencyDeliveryDays);
tr.appendChild(tdActive);
tbody.appendChild(tr);
}
hookupFieldsOrderItemDisplayOrder() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagDisplayOrder + ' input');
}
hookupFieldsOrderItemProductCategory() {
this.hookupTableCellDdlPreviews(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductCategory
, Utils.getListFromDict(productCategories)
, (cellSelector) => { this.hookupProductCategoryDdls(cellSelector); }
);
}
hookupFieldsOrderItemProduct() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagOrderItems + ' td.' + flagProduct, Utils.getListFromDict(products));
}
/*
hookupFieldsOrderItemProductVariations() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductVariations, (event, element) => this.handleClickProductPermutationVariationsPreview(event, element));
}
hookupDdlsProductPermutationVariation() {
this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
}
hookupDdlsProductPermutationVariationType() {
this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
}
*/
hookupFieldsOrderItemUnitQuantity() {
this.hookupTableCellDdlPreviews(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagUnitMeasurementQuantity
, Utils.getListFromDict(unitMeasurements)
);
}
hookupFieldsOrderItemQuantityOrdered() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagQuantityOrdered + ' input'
);
}
hookupFieldsOrderItemQuantityReceived() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagQuantityReceived + ' input'
);
}
hookupFieldsOrderItemCostTotalLocalVatExcl() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagCostTotalLocalVatExcl + ' input'
, (event, element) => {
this.handleChangeNestedElementCellTable(event, element); // flagCostTotalLocalVatExcl);
this.updateFieldsCostUnitLocalVatExcl(element);
}
);
}
hookupFieldsOrderItemCostTotalLocalVatIncl() {
this.hookupChangeHandlerTableCells(
idTableMain + ' td.' + flagOrderItems + ' td.' + flagCostTotalLocalVatIncl + ' input'
, (event, element) => {
this.handleChangeNestedElementCellTable(event, element); // flagCostTotalLocalVatIncl);
this.updateFieldsCostUnitLocalVatIncl(element);
}
);
}
updateFieldsCostUnitLocalVatExcl(elementChanged) {
let row = elementChanged.closest('tr.' + flagOrderItems);
let inputCostTotalLocalVatExcl = row.querySelector('td.' + flagCostTotalLocalVatExcl + ' input');
let costTotalLocalVatExcl = DOM.getElementValueCurrent(inputCostTotalLocalVatExcl);
let inputQuantityOrdered = row.querySelector('td.' + flagQuantityOrdered + ' input');
let quantityOrdered = DOM.getElementValueCurrent(inputQuantityOrdered);
let divCostUnitLocalVatExcl = row.querySelector('td.' + flagCostUnitLocalVatExcl + ' div');
let costUnitLocalVatExcl = quantityOrdered == 0 ? 0 : costTotalLocalVatExcl / quantityOrdered;
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, costUnitLocalVatExcl.toFixed(3));
let rowSupplierPurchaseOrder = row.closest(idTableMain + ' > tbody > tr');
let divCostGrandTotalLocalVatExcl = rowSupplierPurchaseOrder.querySelector('td.' + flagCostTotalLocalVatExcl + ' div');
let inputsCostTotalLocalVatExcl = rowSupplierPurchaseOrder.querySelectorAll('td.' + flagOrderItems + ' td.' + flagCostTotalLocalVatExcl + ' input');
let costGrandTotalLocalVatExcl = Array.from(inputsCostTotalLocalVatExcl).reduce((acc, input) => acc + Number(DOM.getElementValueCurrent(input)), 0);
DOM.setElementValueCurrent(divCostGrandTotalLocalVatExcl, costGrandTotalLocalVatExcl);
}
updateFieldsCostUnitLocalVatIncl(elementChanged) {
let row = elementChanged.closest('tr.' + flagOrderItems);
let inputCostTotalLocalVatIncl = row.querySelector('td.' + flagCostTotalLocalVatIncl + ' input');
let costTotalLocalVatIncl = DOM.getElementValueCurrent(inputCostTotalLocalVatIncl);
let inputQuantityOrdered = row.querySelector('td.' + flagQuantityOrdered + ' input');
let quantityOrdered = DOM.getElementValueCurrent(inputQuantityOrdered);
let divCostUnitLocalVatIncl = row.querySelector('td.' + flagCostUnitLocalVatIncl + ' div');
let costUnitLocalVatIncl = quantityOrdered == 0 ? 0 : costTotalLocalVatIncl / quantityOrdered;
DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, costUnitLocalVatIncl.toFixed(3));
let rowSupplierPurchaseOrder = row.closest(idTableMain + ' > tbody > tr');
let divCostGrandTotalLocalVatIncl = rowSupplierPurchaseOrder.querySelector('td.' + flagCostTotalLocalVatIncl + ' div');
let inputsCostTotalLocalVatIncl = rowSupplierPurchaseOrder.querySelectorAll('td.' + flagOrderItems + ' td.' + flagCostTotalLocalVatIncl + ' input');
let costGrandTotalLocalVatIncl = Array.from(inputsCostTotalLocalVatIncl).reduce((acc, input) => acc + Number(DOM.getElementValueCurrent(input)), 0);
DOM.setElementValueCurrent(divCostGrandTotalLocalVatIncl, costGrandTotalLocalVatIncl);
}
hookupFieldsOrderItemLatencyDeliveryDays() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' td.' + flagLatencyDeliveryDays + ' input');
}
hookupFieldsOrderItemActive() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagOrderItems + ' input.' + flagActive);
}
hookupFieldsOrderItemAddDelete() {
let selectorButton = idTableMain + ' td.' + flagOrderItems + ' td.' + flagOrderItems + ' button';
let selectorButtonDelete = selectorButton + '.' + flagDelete;
let selectorButtonUndelete = selectorButton + '.' + flagAdd;
this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsOrderItemAdd();
}
hookupButtonsOrderItemAdd() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' th button.' + flagAdd, (event, element) => {
let row = element.closest(idTableMain + ' > tbody > tr');
let idSupplierPurchaseOrder = row.getAttribute(attrIdSupplierPurchaseOrder);
// let hasActiveOrderItem = row.querySelectorAll('td.' + flagOrderItems + ' input.' + flagActive + ':checked').length > 0;
let countSupplierOrderItems = row.querySelectorAll('td.' + flagOrderItems + ' td.' + flagSupplierPurchaseOrder).length;
let supplierOrderItem = {
[attrIdSupplierPurchaseOrder]: idSupplierPurchaseOrder,
[attrIdSupplierPurchaseOrderProductLink]: -1 - countSupplierOrderItems,
[attrIdProductCategory]: 0,
[attrIdProduct]: 0,
[flagProductVariations]: '',
[attrIdUnitMeasurementQuantity]: 0,
[flagQuantityOrdered]: '',
[flagQuantityReceived]: '',
[flagCostTotalLocalVatExcl]: '',
[flagCostTotalLocalVatIncl]: '',
[flagCostUnitLocalVatExcl]: '',
[flagCostUnitLocalVatIncl]: '',
[flagLatencyDeliveryDays]: '',
[flagDisplayOrder]: countSupplierOrderItems + 1,
[flagActive]: true, // !hasActiveOrderItem,
};
let tbody = row.querySelector('td.' + flagOrderItems + ' table tbody');
this.addRowSupplierPurchaseOrderItem(tbody, supplierOrderItem);
/*
if (!hasActiveOrderItem) {
let tdOrderItem = row.querySelector('td.' + flagOrderItems);
// tdOrderItem.setAttribute(attrIdSupplierOrderItem, supplierOrderItem[attrIdSupplierOrderItem]);
DOM.setElementAttributeValueCurrent(tdOrderItem, supplierOrderItem[attrIdSupplierPurchaseOrderProductLink]);
}
*/
this.hookupOrderItemsFields();
});
}
leave() {
super.leave();
}
}

View File

@@ -1,381 +0,0 @@
import API from "../../api.js";
import BusinessObjects from "../../lib/business_objects/business_objects.js";
import DOM from "../../dom.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
import Validation from "../../lib/validation.js";
import DogTableMixinPage from "./mixin_table.js";
export default class PageDogSuppliers extends TableBasePage {
static hash = hashPageDogSuppliers;
static attrIdRowObject = attrIdSupplier;
callSaveTableContent = API.saveSuppliers;
constructor(router) {
super(router);
this.dogMixin = new DogTableMixinPage(this);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
this.sharedHookupFilters();
this.hookupFilterActive();
}
loadRowTable(rowJson) {
}
getJsonRow(row) {
if (row == null) return;
let textareaNameCompany = row.querySelector('td.' + flagNameCompany + ' textarea');
let textareaNameContact = row.querySelector('td.' + flagNameContact + ' textarea');
let textareaDepartmentContact = row.querySelector('td.' + flagDepartmentContact + ' textarea');
let tdAddress = row.querySelector('td.' + flagAddress);
let textareaPhoneNumber = row.querySelector('td.' + flagPhoneNumber + ' textarea');
let textareaFax = row.querySelector('td.' + flagFax + ' textarea');
let textareaEmail = row.querySelector('td.' + flagEmail + ' textarea');
let textareaWebsite = row.querySelector('td.' + flagWebsite + ' textarea');
let tdCurrency = row.querySelector('td.' + flagCurrency);
let buttonActive = row.querySelector(':scope > td.' + flagActive + ' button');
let jsonRow = {};
jsonRow[attrIdSupplier] = row.getAttribute(attrIdSupplier);
jsonRow[flagNameCompany] = DOM.getElementAttributeValueCurrent(textareaNameCompany);
jsonRow[flagNameContact] = DOM.getElementAttributeValueCurrent(textareaNameContact);
jsonRow[flagDepartmentContact] = DOM.getElementAttributeValueCurrent(textareaDepartmentContact);
jsonRow[attrIdSupplierAddress] = DOM.getElementAttributeValueCurrent(tdAddress);
jsonRow[flagSupplierAddress] = this.getSupplierAddressesFromRow(row);
jsonRow[flagPhoneNumber] = DOM.getElementAttributeValueCurrent(textareaPhoneNumber);
jsonRow[flagFax] = DOM.getElementAttributeValueCurrent(textareaFax);
jsonRow[flagEmail] = DOM.getElementAttributeValueCurrent(textareaEmail);
jsonRow[flagWebsite] = DOM.getElementAttributeValueCurrent(textareaWebsite);
jsonRow[attrIdCurrency] = DOM.getElementAttributeValueCurrent(tdCurrency);
jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
return jsonRow;
}
getSupplierAddressesFromRow(row) {
let supplierAddresses = [];
let trs = row.querySelectorAll('td.' + flagAddress + ' tbody tr');
let address, inputPostcode, inputAddressLine1, inputAddressLine2, inputCity, inputCounty, ddlRegion, inputActive;
trs.forEach((tr) => {
inputPostcode = tr.querySelector('td.' + flagPostcode + ' textarea');
inputAddressLine1 = tr.querySelector('td.' + flagAddressLine1 + ' textarea');
inputAddressLine2 = tr.querySelector('td.' + flagAddressLine2 + ' textarea');
inputCity = tr.querySelector('td.' + flagCity + ' textarea');
inputCounty = tr.querySelector('td.' + flagCounty + ' textarea');
ddlRegion = tr.querySelector('td.' + flagRegion + ' select');
inputActive = tr.querySelector('td.' + flagActive + ' input');
address = {
[attrIdSupplierAddress]: tr.getAttribute(attrIdSupplierAddress),
[attrIdSupplier]: row.getAttribute(attrIdSupplier),
[flagPostcode]: DOM.getElementAttributeValueCurrent(inputPostcode),
[flagAddressLine1]: DOM.getElementAttributeValueCurrent(inputAddressLine1),
[flagAddressLine2]: DOM.getElementAttributeValueCurrent(inputAddressLine2),
[flagCity]: DOM.getElementAttributeValueCurrent(inputCity),
[flagCounty]: DOM.getElementAttributeValueCurrent(inputCounty),
[attrIdRegion]: DOM.getElementAttributeValueCurrent(ddlRegion),
[flagActive]: DOM.getElementAttributeValueCurrent(inputActive),
};
supplierAddresses.push(address);
});
return supplierAddresses;
}
initialiseRowNew(tbody, row) {
super.initialiseRowNew(tbody, row);
}
hookupTableMain() {
super.hookupTableMain();
this.hookupNameCompanyInputs();
this.hookupNameContactInputs();
this.hookupDepartmentContactInputs();
this.hookupAddressFields();
this.hookupPhoneNumberInputs();
this.hookupFaxInputs();
this.hookupEmailInputs();
this.hookupWebsiteInputs();
this.hookupCurrencyFields();
this.hookupFieldsActive();
}
hookupNameCompanyInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagNameCompany + ' textarea');
}
hookupNameContactInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagNameContact + ' textarea');
}
hookupDepartmentContactInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagDepartmentContact + ' textarea');
}
hookupAddressFields() {
this.hookupAddressPreviews();
this.hookupAddressPostcodeInputs();
this.hookupAddressLine1Inputs();
this.hookupAddressLine2Inputs();
this.hookupAddressCityInputs();
this.hookupAddressCountyInputs();
this.hookupAddressRegionDdls();
this.hookupAddressActiveCheckboxes();
this.hookupAddressDeleteButtons();
this.hookupAddressUndeleteButtons();
this.hookupAddressAddButtons();
}
hookupAddressPreviews() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagAddress, (event, td) => {
if (!td.classList.contains(flagCollapsed)) return;
this.handleClickAddressPreview(event, td);
});
}
handleClickAddressPreview(event, element) {
if (_verbose) { console.log("click address preview"); }
this.toggleColumnHeaderCollapsed(flagAddress, false);
element.classList.remove(flagCollapsed);
let row = DOM.getRowFromElement(element);
let idSupplier = row.getAttribute(attrIdSupplier);
let supplierAddressList = idSupplier > 0 ? supplierAddresses[idSupplier] : [];
let tblAddresses = document.createElement("table");
tblAddresses.classList.add(flagAddress);
let thead = document.createElement("thead");
let tr = document.createElement("tr");
let thPostcode = document.createElement("th");
thPostcode.classList.add(flagPostcode);
thPostcode.textContent = 'Postcode';
let thAddressLine1 = document.createElement("th");
thAddressLine1.classList.add(flagAddressLine1);
thAddressLine1.textContent = 'Address Line 1';
let thAddressLine2 = document.createElement("th");
thAddressLine2.classList.add(flagAddressLine2);
thAddressLine2.textContent = 'Address Line 2';
let thCity = document.createElement("th");
thCity.classList.add(flagCity);
thCity.textContent = 'City';
let thCounty = document.createElement("th");
thCounty.classList.add(flagCounty);
thCounty.textContent = 'County';
let thRegion = document.createElement("th");
thRegion.classList.add(flagRegion);
thRegion.textContent = 'Region';
let thActive = document.createElement("th");
thActive.classList.add(flagActive);
thActive.textContent = 'Active';
let thAddDelete = document.createElement("th");
thAddDelete.classList.add(flagAdd);
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
thAddDelete.appendChild(buttonAdd);
tr.appendChild(thPostcode);
tr.appendChild(thAddressLine1);
tr.appendChild(thAddressLine2);
tr.appendChild(thCity);
tr.appendChild(thCounty);
tr.appendChild(thRegion);
tr.appendChild(thActive);
tr.appendChild(thAddDelete);
thead.appendChild(tr);
tblAddresses.appendChild(thead);
let tbody = document.createElement("tbody");
let regionOptions = Utils.getListFromDict(regions);
supplierAddressList.forEach((supplierAddress, index) => {
this.addRowSupplierAddress(tbody, supplierAddress, regionOptions);
});
tblAddresses.appendChild(tbody);
let cell = DOM.getCellFromElement(element);
let cellNew = cell.cloneNode(false);
cellNew.appendChild(tblAddresses);
row.replaceChild(cellNew, cell);
if (_verbose) { console.log("tblAddresses: ", tblAddresses); }
this.hookupAddressFields();
}
addRowSupplierAddress(tbody, supplierAddress, regionOptions) {
if (_verbose) { console.log("addRowSupplierAddress: ", supplierAddress); }
let tdPostcode = document.createElement("td");
tdPostcode.classList.add(flagPostcode);
let textareaPostcode = document.createElement("textarea");
textareaPostcode.classList.add(flagPostcode);
DOM.setElementValuesCurrentAndPrevious(textareaPostcode, supplierAddress[flagPostcode]);
tdPostcode.appendChild(textareaPostcode);
let tdAddressLine1 = document.createElement("td");
tdAddressLine1.classList.add(flagAddressLine1);
let textareaAddressLine1 = document.createElement("textarea");
textareaAddressLine1.classList.add(flagAddressLine1);
DOM.setElementValuesCurrentAndPrevious(textareaAddressLine1, supplierAddress[flagAddressLine1]);
tdAddressLine1.appendChild(textareaAddressLine1);
let tdAddressLine2 = document.createElement("td");
tdAddressLine2.classList.add(flagAddressLine2);
let textareaAddressLine2 = document.createElement("textarea");
textareaAddressLine2.classList.add(flagAddressLine2);
DOM.setElementValuesCurrentAndPrevious(textareaAddressLine2, supplierAddress[flagAddressLine2]);
tdAddressLine2.appendChild(textareaAddressLine2);
let tdCity = document.createElement("td");
tdCity.classList.add(flagCity);
let textareaCity = document.createElement("textarea");
textareaCity.classList.add(flagCity);
DOM.setElementValuesCurrentAndPrevious(textareaCity, supplierAddress[flagCity]);
tdCity.appendChild(textareaCity);
let tdCounty = document.createElement("td");
tdCounty.classList.add(flagCounty);
let textareaCounty = document.createElement("textarea");
textareaCounty.classList.add(flagCounty);
DOM.setElementValuesCurrentAndPrevious(textareaCounty, supplierAddress[flagCounty]);
tdCounty.appendChild(textareaCounty);
let region = supplierAddress[flagRegion];
if (!region) region = {[attrIdRegion]: ''};
let tdRegion = document.createElement("td");
tdRegion.classList.add(flagRegion);
DOM.setElementAttributesValuesCurrentAndPrevious(tdRegion, region[attrIdRegion]);
let ddlRegion = document.createElement("select");
ddlRegion.classList.add(flagRegion);
let optionJson, option;
option = DOM.createOption(null);
ddlRegion.appendChild(option);
regionOptions.forEach((regionOption) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(regionOption);
option = DOM.createOption(optionJson);
ddlRegion.appendChild(option);
});
DOM.setElementValuesCurrentAndPrevious(ddlRegion, region[attrIdRegion]);
tdRegion.appendChild(ddlRegion);
let tdActive = this.createTdActive(supplierAddress[flagActive]);
let tr = document.createElement("tr");
tr.setAttribute(attrIdSupplierAddress, supplierAddress[attrIdSupplierAddress]);
tr.setAttribute(attrIdSupplier, supplierAddress[attrIdSupplier]);
tr.appendChild(tdPostcode);
tr.appendChild(tdAddressLine1);
tr.appendChild(tdAddressLine2);
tr.appendChild(tdCity);
tr.appendChild(tdCounty);
tr.appendChild(tdRegion);
tr.appendChild(tdActive);
tbody.appendChild(tr);
}
hookupAddressPostcodeInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' textarea.' + flagPostcode);
}
hookupAddressLine1Inputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' textarea.' + flagAddressLine1);
}
hookupAddressLine2Inputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' textarea.' + flagAddressLine2);
}
hookupAddressCityInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' textarea.' + flagCity);
}
hookupAddressCountyInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' textarea.' + flagCounty);
}
hookupAddressRegionDdls() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' select.' + flagRegion);
}
hookupAddressActiveCheckboxes() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagAddress + ' input.' + flagActive, (event, element) => {
let rowSupplierAddress = element.closest('tr');
let idAddress = rowSupplierAddress.getAttribute(attrIdSupplierAddress);
DOM.setElementAttributeValueCurrent(rowSupplierAddress, idAddress);
let rowSupplier = rowSupplierAddress.closest(idTableMain + ' > tbody > tr');
let checkboxesActive = rowSupplier.querySelectorAll('td.' + flagAddress + ' input.' + flagActive);
let isActive = element.checked;
if (isActive) {
checkboxesActive.forEach((checkbox) => {
if (checkbox == element) return;
DOM.setElementValueCurrent(checkbox, false);
});
}
/*
else if (checkboxesActive.length > 0) {
DOM.setElementValueCurrent(checkboxesActive[0], false);
}
*/
});
}
hookupFieldsAddressAddDelete() {
let selectorButton = idTableMain + ' td.' + flagAddress + ' button';
let selectorButtonDelete = selectorButton + '.' + flagDelete;
let selectorButtonUndelete = selectorButton + '.' + flagAdd;
this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
}
hookupAddressDeleteButtons() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagAddress + ' button.' + flagDelete, (event, element) => {
let row = DOM.getRowFromElement(element);
row.classList.add(flagDelete);
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
element.replaceWith(buttonAdd);
this.hookupAddressUndeleteButtons();
});
}
hookupAddressUndeleteButtons() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagAddress + ' td button.' + flagAdd, (event, element) => {
let row = DOM.getRowFromElement(element);
row.classList.remove(flagDelete);
let buttonDelete = document.createElement("button");
buttonDelete.classList.add(flagDelete);
buttonDelete.textContent = 'x';
element.replaceWith(buttonDelete);
this.hookupAddressDeleteButtons();
});
}
hookupAddressAddButtons() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagAddress + ' th button.' + flagAdd, (event, element) => {
let row = element.closest(idTableMain + ' > tbody > tr');
let idSupplier = row.getAttribute(attrIdSupplier);
let hasActiveAddress = row.querySelectorAll('td.' + flagAddress + ' input.' + flagActive + ':checked').length > 0;
let countSupplierAddresses = row.querySelectorAll('td.' + flagAddress + ' td.' + flagAddress).length;
let supplierAddress = {
[attrIdSupplier]: idSupplier,
[attrIdSupplierAddress]: -1 - countSupplierAddresses,
[flagPostcode]: '',
[flagAddressLine1]: '',
[flagAddressLine2]: '',
[flagCity]: '',
[flagCounty]: '',
[attrIdRegion]: '',
[flagActive]: !hasActiveAddress,
};
let tbody = row.querySelector('td.' + flagAddress + ' table tbody');
this.addRowSupplierAddress(tbody, supplierAddress, Utils.getListFromDict(regions));
if (!hasActiveAddress) {
let tdAddress = row.querySelector('td.' + flagAddress);
// tdAddress.setAttribute(attrIdSupplierAddress, supplierAddress[attrIdSupplierAddress]);
DOM.setElementAttributeValueCurrent(tdAddress, supplierAddress[attrIdSupplierAddress]);
}
this.hookupAddressFields();
});
}
hookupPhoneNumberInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagPhoneNumber + ' textarea');
}
hookupFaxInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagFax + ' textarea');
}
hookupEmailInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagEmail + ' textarea');
}
hookupWebsiteInputs() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagWebsite + ' textarea');
}
leave() {
super.leave();
}
}

View File

@@ -4,9 +4,10 @@
import PageHome from './pages/core/home.js';
// Dog
import PageDogHome from './pages/dog/home.js';
import PageDogCommandCategories from './pages/dog/command_categories.js';
import PageDogCommands from './pages/dog/commands.js';
import PageDogDogCommandLinks from './pages/dog/dog_command_links.js';
import PageDogDogs from './pages/dog/dogs.js';
// import PageDogDogs from './pages/dog/dogs.js';
// Legal
import PageAccessibilityReport from './pages/legal/accessibility_report.js';
import PageAccessibilityStatement from './pages/legal/accessibility_statement.js';
@@ -31,9 +32,10 @@ export default class Router {
this.pages[hashPageHome] = { name: 'PageHome', module: PageHome };
// Dog
this.pages[hashPageDogHome] = { name: 'PageDogHome', module: PageDogHome };
this.pages[hashPageDogCommandCategories] = { name: 'PageDogCommands', module: PageDogCommandCategories };
this.pages[hashPageDogCommands] = { name: 'PageDogCommands', module: PageDogCommands };
this.pages[hashPageDogDogCommandLinks] = { name: 'PageDogDogCommandLinks', module: PageDogDogCommandLinks };
this.pages[hashPageDogDogs] = { name: 'PageDogDogs', module: PageDogDogs };
// this.pages[hashPageDogDogs] = { name: 'PageDogDogs', module: PageDogDogs };
// Legal
this.pages[hashPageAccessibilityStatement] = { name: 'PageAccessibilityStatement', module: PageAccessibilityStatement };
this.pages[hashPageDataRetentionSchedule] = { name: 'PageDataRetentionSchedule', module: PageRetentionSchedule };
@@ -49,9 +51,10 @@ export default class Router {
this.routes[hashPageHome] = (isPopState = false) => this.navigateToHash(hashPageHome, isPopState);
// Dog
this.routes[hashPageDogHome] = (isPopState = false) => this.navigateToHash(hashPageDogHome, isPopState);
this.routes[hashPageDogCommandCategories] = (isPopState = false) => this.navigateToHash(hashPageDogCommandCategories, isPopState);
this.routes[hashPageDogCommands] = (isPopState = false) => this.navigateToHash(hashPageDogCommands, isPopState);
this.routes[hashPageDogDogCommandLinks] = (isPopState = false) => this.navigateToHash(hashPageDogDogCommandLinks, isPopState);
this.routes[hashPageDogDogs] = (isPopState = false) => this.navigateToHash(hashPageDogDogs, isPopState);
// this.routes[hashPageDogDogs] = (isPopState = false) => this.navigateToHash(hashPageDogDogs, isPopState);
// Legal
this.routes[hashPageAccessibilityStatement] = (isPopState = false) => this.navigateToHash(hashPageAccessibilityStatement, isPopState);
this.routes[hashPageDataRetentionSchedule] = (isPopState = false) => this.navigateToHash(hashPageDataRetentionSchedule, isPopState);