Feat: \n 1. Contact Us page form submission success page created. \n 2. Contact Us page styling and CAPTCHA text content. \n 3. Removal of ERP, Google CAPTCHA, and ALTCHA API code and left over comments in JavaScript, Python.

This commit is contained in:
2025-03-16 16:56:15 +00:00
parent 4add7e626e
commit dd608022cd
68 changed files with 597 additions and 3921 deletions

View File

@@ -122,7 +122,7 @@ export default class TableBasePage extends BasePage {
getAndLoadFilteredTableContentSinglePageApp() {
this.callFilterTableContent()
.then(data => {
if (_verbose) { console.log('Table data received:', data); }
Utils.consoleLogIfNotProductionEnvironment('Table data received:', data);
this.callbackLoadTableContent(data);
})
.catch(error => console.error('Error:', error));
@@ -144,13 +144,13 @@ export default class TableBasePage extends BasePage {
.then(data => {
if (data[flagStatus] == flagSuccess) {
if (_verbose) {
console.log('Records saved!');
console.log('Data received:', data);
Utils.consoleLogIfNotProductionEnvironment('Records saved!');
Utils.consoleLogIfNotProductionEnvironment('Data received:', data);
}
this.callFilterTableContent();
}
else {
if (_verbose) { console.log("error: ", data[flagMessage]); }
Utils.consoleLogIfNotProductionEnvironment("error: ", data[flagMessage]);
OverlayError.show(data[flagMessage]);
}
})
@@ -181,13 +181,13 @@ export default class TableBasePage extends BasePage {
.then(data => {
if (data[flagStatus] == flagSuccess) {
if (_verbose) {
console.log('Records saved!');
console.log('Data received:', data);
Utils.consoleLogIfNotProductionEnvironment('Records saved!');
Utils.consoleLogIfNotProductionEnvironment('Data received:', data);
}
this.callbackLoadTableContent(data);
}
else {
if (_verbose) { console.log("error: ", data[flagMessage]); }
Utils.consoleLogIfNotProductionEnvironment("error: ", data[flagMessage]);
OverlayError.show(data[flagMessage]);
}
})
@@ -236,7 +236,7 @@ export default class TableBasePage extends BasePage {
cacheRowBlank() {
let selectorRowNew = idTableMain + ' tbody tr.' + flagRowNew;
let rowBlankTemp = document.querySelector(selectorRowNew);
if (_verbose) { console.log("row blank temp: ", rowBlankTemp); }
Utils.consoleLogIfNotProductionEnvironment("row blank temp: ", rowBlankTemp);
let countRows = document.querySelectorAll(idTableMain + ' > tbody > tr').length;
_rowBlank = rowBlankTemp.cloneNode(true);
document.querySelectorAll(selectorRowNew).forEach(function(row) {
@@ -257,23 +257,6 @@ export default class TableBasePage extends BasePage {
}
hookupSlidersDisplayOrderTable() {
let selectorDisplayOrder = idTableMain + ' tbody tr td.' + flagDisplayOrder + ' input.' + flagSlider + '.' + flagDisplayOrder;
/*
Events.initialiseEventHandler(selectorDisplayOrder, flagInitialised, (sliderDisplayOrder) => {
/*
sliderDisplayOrder.setAttribute('draggable', true);
sliderDisplayOrder.addEventListener('dragstart', this.handleDragSliderStart.bind(this), false);
sliderDisplayOrder.addEventListener('dragenter', this.handleDragSliderEnter.bind(this), false);
sliderDisplayOrder.addEventListener('dragover', this.handleDragSliderOver.bind(this), false);
sliderDisplayOrder.addEventListener('dragleave', this.handleDragSliderLeave.bind(this), false);
sliderDisplayOrder.addEventListener('drop', this.handleDropSlider.bind(this), false);
sliderDisplayOrder.addEventListener('dragend', this.handleDragSliderEnd.bind(this), false);
*
sliderDisplayOrder.addEventListener('change', (event) => {
console.log("slider change event");
this.handleChangeNestedElementCellTable(sliderDisplayOrder);
});
});
*/
this.hookupChangeHandlerTableCells(selectorDisplayOrder);
}
hookupChangeHandlerTableCells(inputSelector, handler = (event, element) => { this.handleChangeNestedElementCellTable(event, element); }) {
@@ -283,7 +266,6 @@ export default class TableBasePage extends BasePage {
});
handler(null, input);
});
// this.hookupEventHandler("change", inputSelector, handler);
}
/*
handleChangeElementCellTable(event, element) {
@@ -339,15 +321,15 @@ export default class TableBasePage extends BasePage {
let wasDirtyRowTable = DOM.hasDirtyChildrenContainer(rowTable);
let wasDirtyElement = element.classList.contains(flagDirty);
let isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
console.log({isDirtyElement, wasDirtyElement});
Utils.consoleLogIfNotProductionEnvironment({isDirtyElement, wasDirtyElement});
if (isDirtyElement != wasDirtyElement) {
DOM.handleDirtyElement(td, isDirtyElement);
let isNowDirtyRowSubtable = DOM.hasDirtyChildrenContainer(rowSubtable);
console.log({isNowDirtyRowSubtable, wasDirtyRowSubtable});
Utils.consoleLogIfNotProductionEnvironment({isNowDirtyRowSubtable, wasDirtyRowSubtable});
if (isNowDirtyRowSubtable != wasDirtyRowSubtable) {
DOM.handleDirtyElement(rowSubtable, isNowDirtyRowSubtable);
let isNowDirtyRowTable = DOM.hasDirtyChildrenContainer(rowTable);
console.log({isNowDirtyRowTable, wasDirtyRowTable});
Utils.consoleLogIfNotProductionEnvironment({isNowDirtyRowTable, wasDirtyRowTable});
if (isNowDirtyRowTable != wasDirtyRowTable) {
DOM.handleDirtyElement(rowTable, isNowDirtyRowTable);
let rows = this.getTableRecords(true);
@@ -362,7 +344,7 @@ export default class TableBasePage extends BasePage {
let wasDirtyParentRows = this.getAllIsDirtyRowsInParentTree(element);
let wasDirtyElement = element.classList.contains(flagDirty);
let isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
if (_verbose) { console.log({isDirtyElement, wasDirtyElement, wasDirtyParentRows}); }
Utils.consoleLogIfNotProductionEnvironment({isDirtyElement, wasDirtyElement, wasDirtyParentRows});
let td = DOM.getCellFromElement(element);
DOM.setElementAttributeValueCurrent(td, DOM.getElementAttributeValueCurrent(element));
if (isDirtyElement != wasDirtyElement) {
@@ -392,7 +374,7 @@ export default class TableBasePage extends BasePage {
let tr = DOM.getRowFromElement(td);
let isDirtyRow = isDirtyTd || DOM.hasDirtyChildrenContainer(tr);
let wasDirtyRow = wasDirtyParentRows.shift();
if (_verbose) { console.log({isDirtyRow, wasDirtyRow}); }
Utils.consoleLogIfNotProductionEnvironment({isDirtyRow, wasDirtyRow});
if (isDirtyRow != wasDirtyRow) {
DOM.handleDirtyElement(tr, isDirtyRow);
this.updateAndToggleShowButtonsSaveCancel();
@@ -404,64 +386,6 @@ export default class TableBasePage extends BasePage {
}) {
this.hookupEventHandler("change", inputSelector, handler);
}
/* ToDo: Fix this slider drag and drop functionality
handleDragSliderStart(event) {
this.dragSrcEl = event.target;
event.dataTransfer.effectAllowed = flagMove;
/*
console.log("setting outer html: ", this.dragSrcEl.outerHTML);
event.dataTransfer.setData('text/html', this.dragSrcEl.outerHTML);
*
this.dragSrcRow = DOM.getRowFromElement(this.dragSrcEl);
this.dragSrcEl.classList.add(flagDragging);
}
handleDragSliderOver(event) {
if (event.preventDefault) {
event.preventDefault();
}
event.dataTransfer.dropEffect = flagMove;
return false;
}
handleDragSliderEnter(event) {
event.target.closest('tr').classList.add(flagDragOver);
}
handleDragSliderLeave(event) {
event.target.closest('tr').classList.remove(flagDragOver);
}
handleDropSlider(event) {
event.stopPropagation();
let targetRow = DOM.getRowFromElement(event.target);
if (this.dragSourceRow != targetRow) {
targetRow.classList.remove(flagDragOver);
this.dragSrcEl.classList.remove(flagDragging);
let sourceRowClone = this.dragSrcRow.cloneNode(true);
let targetRowClone = targetRow.cloneNode(true);
console.log("sourceRowClone: ", sourceRowClone);
console.log("targetRowClone: ", targetRowClone);
let tbody = targetRow.closest('tbody');
tbody.replaceChild(sourceRowClone, targetRow);
tbody.replaceChild(targetRowClone, this.dragSrcRow);
this.refreshDisplayOrders();
}
return false;
}
handleDragSliderEnd(event) {
let table = TableBasePage.getTableMain();
let rows = table.querySelectorAll('tr');
rows.forEach(row => {
row.classList.remove(flagDragOver);
row.classList.remove(flagDragging);
});
}
refreshDisplayOrders() {
console.log("updating display order values");
let rows = document.querySelectorAll(idTableMain + 'tbody tr.' + flagRow);
rows.forEach((row, indexRow) => {
sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
sliderDisplayOrder.setAttribute(attrValueCurrent, indexRow);
});
}
*/
hookupTextareasCodeTable() {
this.hookupChangeHandlerTableCells(idTableMain + ' tbody tr td.' + flagCode + ' textarea');
}
@@ -475,7 +399,7 @@ export default class TableBasePage extends BasePage {
let selectorButton = 'table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody > tr > td.' + flagActive + ' button';
let selectorButtonDelete = selectorButton + '.' + flagDelete;
let selectorButtonUndelete = selectorButton + ':not(.' + flagDelete + ')';
console.log("hookupFieldsActive: ", selectorButtonDelete, selectorButtonUndelete);
Utils.consoleLogIfNotProductionEnvironment("hookupFieldsActive: ", selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
this.hookupEventHandler(
@@ -549,7 +473,6 @@ export default class TableBasePage extends BasePage {
}
handleClickTableCellDdlPreview(event, td, optionObjectList, cellSelector, ddlHookup = (cellSelector) => { this.hookupTableCellDdls(cellSelector); }) {
if (td.querySelector('select')) return;
// td.removeEventListener("click", ddlHookup);
let tdNew = td.cloneNode(true);
td.parentNode.replaceChild(tdNew, td);
let idSelected = DOM.getElementAttributeValueCurrent(tdNew);
@@ -558,8 +481,8 @@ export default class TableBasePage extends BasePage {
DOM.setElementValuesCurrentAndPrevious(ddl, idSelected);
let optionJson, option;
if (_verbose) {
console.log("click table cell ddl preview");
console.log({optionObjectList, cellSelector});
Utils.consoleLogIfNotProductionEnvironment("click table cell ddl preview");
Utils.consoleLogIfNotProductionEnvironment({optionObjectList, cellSelector});
}
option = DOM.createOption(null);
ddl.appendChild(option);
@@ -572,34 +495,6 @@ export default class TableBasePage extends BasePage {
let ddlSelector = cellSelector + ' select';
ddlHookup(ddlSelector);
}
/*
handleChangeTableCellDdl(event, ddl) {
let row = DOM.getRowFromElement(ddl);
let td = DOM.getCellFromElement(ddl);
console.log("td: ", td);
let wasDirtyRow = DOM.hasDirtyChildrenContainer(row);
let wasDirtyElement = ddl.classList.contains(flagDirty);
let isDirtyElement = DOM.updateAndCheckIsElementDirty(ddl);
console.log("isDirtyElement: ", isDirtyElement);
console.log("wasDirtyElement: ", wasDirtyElement);
if (isDirtyElement != wasDirtyElement) {
DOM.handleDirtyElement(td, isDirtyElement);
let optionSelected = ddl.options[ddl.selectedIndex];
DOM.setElementAttributeValueCurrent(td, optionSelected.value);
let isNowDirtyRow = DOM.hasDirtyChildrenContainer(row);
console.log("isNowDirtyRow: ", isNowDirtyRow);
console.log("wasDirtyRow: ", wasDirtyRow);
if (isNowDirtyRow != wasDirtyRow) {
DOM.handleDirtyElement(row, isNowDirtyRow);
let rows = this.getTableRecords(true);
let existsDirtyRecord = rows.length > 0;
console.log("dirty records:", rows);
console.log("existsDirtyRecord:", existsDirtyRecord);
this.toggleShowButtonsSaveCancel(existsDirtyRecord);
}
}
}
*/
hookupTableCellDDlPreviewsWhenNotCollapsed(cellSelector, optionList, ddlHookup = (event, element) => { this.hookupTableCellDdls(event, element); }) {
this.hookupEventHandler("click", cellSelector, (event, td) => {
let div = td.querySelector('div');
@@ -607,299 +502,13 @@ export default class TableBasePage extends BasePage {
this.handleClickTableCellDdlPreview(event, td, optionList, cellSelector, (event, element) => { ddlHookup(event, element); });
});
}
hookupProductCategoryDdls(ddlSelector) {
this.hookupChangeHandlerTableCells(ddlSelector, (event, element) => { this.handleChangeProductCategoryDdl(event, element); });
}
handleChangeProductCategoryDdl(event, ddlCategory) {
this.handleChangeNestedElementCellTable(event, ddlCategory);
let idProductCategorySelected = DOM.getElementAttributeValueCurrent(ddlCategory);
let row = DOM.getRowFromElement(ddlCategory);
let tdProduct = row.querySelector('td.' + flagProduct);
tdProduct.dispatchEvent(new Event('click'));
let ddlProduct = row.querySelector('td.' + flagProduct + ' select');
ddlProduct.innerHTML = '';
ddlProduct.appendChild(DOM.createOption(null));
let optionJson, option;
Utils.getListFromDict(products).forEach((product) => {
if (idProductCategorySelected != '0' && product[attrIdProductCategory] != idProductCategorySelected) return;
optionJson = BusinessObjects.getOptionJsonFromObjectJson(product);
option = DOM.createOption(optionJson);
ddlProduct.appendChild(option);
});
this.handleChangeNestedElementCellTable(event, ddlProduct);
}
hookupFieldsProductPermutationVariation() {
this.hookupPreviewsProductPermutationVariation();
this.hookupDdlsProductPermutationVariationType();
this.hookupDdlsProductPermutationVariation();
this.hookupButtonsProductPermutationVariationAddDelete();
}
hookupPreviewsProductPermutationVariation() {
this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations, (event, element) => this.handleClickProductPermutationVariationsPreview(event, element));
}
handleClickProductPermutationVariationsPreview(event, element) {
let tblVariations = element.querySelector('table.' + flagProductVariations);
if (!Validation.isEmpty(tblVariations)) return;
this.toggleColumnCollapsed(flagProductVariations, false);
let permutationVariations = this.getElementProductVariations(element);
tblVariations = document.createElement("table");
tblVariations.classList.add(flagProductVariations);
let thead = document.createElement("thead");
let tr = document.createElement("tr");
let thVariationType = document.createElement("th");
thVariationType.classList.add(flagProductVariationType);
thVariationType.textContent = 'Type';
let thNameVariation = document.createElement("th");
thNameVariation.classList.add(flagProductVariation);
thNameVariation.textContent = 'Name';
let buttonAdd = document.createElement("button");
buttonAdd.classList.add(flagAdd);
buttonAdd.textContent = '+';
let thAddDelete = document.createElement("th");
thAddDelete.classList.add(flagAdd);
thAddDelete.appendChild(buttonAdd);
tr.appendChild(thVariationType);
tr.appendChild(thNameVariation);
tr.appendChild(thAddDelete);
thead.appendChild(tr);
tblVariations.appendChild(thead);
let tbody = document.createElement("tbody");
if (!Validation.isEmpty(permutationVariations)) {
permutationVariations.forEach((permutationVariation, index) => {
this.addProductPermutationVariationRow(tbody, permutationVariation);
});
}
tblVariations.appendChild(tbody);
if (_verbose) {
console.log("click product permutation variations preview");
console.log('variations:', permutationVariations);
console.log("tblVariations: ", tblVariations);
}
let cellParent = element.closest(idTableMain + ' tbody tr td.' + flagProductVariations);
cellParent.innerHTML = '';
cellParent.appendChild(tblVariations);
this.hookupFieldsProductPermutationVariation();
}
toggleColumnCollapsed(flagColumn, isCollapsed) {
this.toggleColumnHasClassnameFlag(flagColumn, isCollapsed, flagCollapsed);
}
toggleColumnHeaderCollapsed(flagColumn, isCollapsed) {
this.toggleColumnHasClassnameFlag(flagColumn, isCollapsed, flagCollapsed);
}
getElementProductVariations(element) {
let permutationVariations = element.getAttribute(attrValueCurrent);
let objVariations = [];
let parts, new_variation, new_variation_type;
if (!Validation.isEmpty(permutationVariations)) {
permutationVariations = permutationVariations.split(',');
permutationVariations.forEach((variation) => {
parts = variation.split(':');
if (parts.length == 2) {
if (_verbose) { console.log("parts: ", parts); }
new_variation_type = productVariationTypes[parts[0].trim()];
new_variation = productVariations[parts[1].trim()];
objVariations.push({
[flagProductVariationType]: new_variation_type,
[flagProductVariation]: new_variation,
});
}
else {
if (_verbose) { console.log("error: invalid variation: ", variation); }
}
});
}
return objVariations;
}
static createOptionUnselectedProductVariation() {
return {
[flagProductVariationType]: {
[flagNameAttrOptionText]: [flagName],
[flagNameAttrOptionValue]: [attrIdProductVariationType],
[flagName]: 'Select Variation Type',
[attrIdProductVariationType]: 0,
},
[flagProductVariation]: {
[flagNameAttrOptionText]: [flagName],
[flagNameAttrOptionValue]: [attrIdProductVariation],
[flagName]: 'Select Variation',
[attrIdProductVariation]: 0,
},
};
}
addProductPermutationVariationRow(tbody, permutationVariation) {
if (_verbose) { console.log("permutationVariation: ", permutationVariation); }
let productVariationType, optionProductVariationTypeJson, optionProductVariationType, productVariation, optionProductVariationJson, optionProductVariation;
/*
if (Validation.isEmpty(variations)) {
return;
}
*/
let productVariationKeys = Object.keys(productVariations);
let productVariationTypeKeys = Object.keys(productVariationTypes);
let ddlsProductVariationType = tbody.querySelectorAll('select.' + flagProductVariationType);
let productVariationTypeKeysSelected = new Set();
let valueSelected;
let doFilterProductVariationKeys = permutationVariation[attrIdProductVariationType] != 0;
ddlsProductVariationType.forEach((ddlProductVariationType) => {
valueSelected = DOM.getElementValueCurrent(ddlProductVariationType);
productVariationTypeKeysSelected.add(valueSelected);
});
productVariationTypeKeys = productVariationTypeKeys.filter(typeKey => !productVariationTypeKeysSelected.has(typeKey));
if (productVariationTypeKeys.length == 0) return;
if (doFilterProductVariationKeys) {
productVariationKeys = productVariationKeys.filter(variationKey => !productVariationTypeKeysSelected.has(productVariations[variationKey][attrIdProductVariationType]));
}
let permutationVariationJson = permutationVariation[flagProductVariation];
let permutationVariationTypeJson = permutationVariation[flagProductVariationType];
let tdVariationType = document.createElement("td");
tdVariationType.classList.add(flagProductVariationType);
DOM.setElementAttributesValuesCurrentAndPrevious(tdVariationType, permutationVariationTypeJson[attrIdProductVariationType]);
let ddlVariationType = document.createElement("select");
ddlVariationType.classList.add(flagProductVariationType);
DOM.setElementAttributesValuesCurrentAndPrevious(ddlVariationType, permutationVariationTypeJson[attrIdProductVariationType]);
optionProductVariationType = DOM.createOption(null);
if (_verbose) { console.log("optionProductVariationType: ", optionProductVariationType); }
ddlVariationType.appendChild(optionProductVariationType);
productVariationTypeKeys.forEach((productVariationTypeKey) => {
/*
optionProductVariationType = document.createElement('option');
optionProductVariationType.value = optionVariationType.value;
optionProductVariationType.text = optionVariationType.text;
*/
productVariationType = productVariationTypes[productVariationTypeKey];
optionProductVariationTypeJson = BusinessObjects.getOptionJsonFromObjectJson(productVariationType, permutationVariationTypeJson[attrIdProductVariationType]);
optionProductVariationType = DOM.createOption(optionProductVariationTypeJson);
if (_verbose) { console.log("optionProductVariationType: ", optionProductVariationType); }
ddlVariationType.appendChild(optionProductVariationType);
});
let tdVariation = document.createElement("td");
tdVariation.classList.add(flagProductVariation);
DOM.setElementAttributesValuesCurrentAndPrevious(tdVariation, permutationVariationJson[attrIdProductVariation]);
let ddlVariation = document.createElement("select");
ddlVariation.classList.add(flagProductVariation);
DOM.setElementAttributesValuesCurrentAndPrevious(ddlVariation, permutationVariationJson[attrIdProductVariation]);
optionProductVariation = DOM.createOption(null);
if (_verbose) { console.log("optionProductVariation: ", optionProductVariation); }
ddlVariation.appendChild(optionProductVariation);
productVariationKeys.forEach((productVariationKey) => {
productVariation = productVariations[productVariationKey];
optionProductVariationJson = BusinessObjects.getOptionJsonFromObjectJson(productVariation, permutationVariationJson[attrIdProductVariation]);
optionProductVariation = DOM.createOption(optionProductVariationJson);
if (_verbose) { console.log("optionProductVariation: ", optionProductVariation); }
ddlVariation.appendChild(optionProductVariation);
});
let tdDelete = document.createElement("td");
tdDelete.classList.add(flagDelete);
let buttonDelete = document.createElement("button");
buttonDelete.classList.add(flagActive);
buttonDelete.classList.add(flagDelete);
buttonDelete.textContent = 'x';
DOM.setElementAttributesValuesCurrentAndPrevious(buttonDelete, true);
let tr = document.createElement("tr");
tr.classList.add(flagProductVariation);
tdVariationType.appendChild(ddlVariationType);
tr.appendChild(tdVariationType);
tdVariation.appendChild(ddlVariation);
tr.appendChild(tdVariation);
tdDelete.appendChild(buttonDelete);
tr.appendChild(tdDelete);
tbody.appendChild(tr);
}
hookupDdlsProductPermutationVariationType() {
this.hookupTableCellDdls(
idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType + ' select'
, (event, ddlVariationType) => {
this.handleChangeProductVariationInput(event, ddlVariationType);
let idVariationTypeSelected = DOM.getElementValueCurrent(ddlVariationType);
let row = DOM.getRowFromElement(ddlVariationType);
let tdVariation = row.querySelector('td.' + flagProductVariation);
tdVariation.dispatchEvent(new Event('click'));
let ddlVariation = row.querySelector('td.' + flagProductVariation + ' select');
ddlVariation.innerHTML = '';
ddlVariation.appendChild(DOM.createOption(null));
let optionJson, option;
let variationType = productVariationTypes[idVariationTypeSelected];
if (variationType == null) variationType = {
[flagProductVariations]: [],
};
variationType[flagProductVariations].forEach((variation) => {
optionJson = BusinessObjects.getOptionJsonFromObjectJson(variation);
option = DOM.createOption(optionJson);
ddlVariation.appendChild(option);
});
this.handleChangeProductVariationInput(event, ddlVariation);
}
);
}
handleChangeProductVariationInput(event, element) {
this.handleChangeNestedElementCellTable(event, element);
this.updateProductPermutationVariations(element);
}
hookupDdlsProductPermutationVariation() {
this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation + ' select', (event, ddlVariation) => { this.handleChangeProductVariationInput(event, ddlVariation); });
}
hookupButtonsProductPermutationVariationAddDelete() {
let selectorButton = idTableMain + ' td.' + flagProductVariations + ' tr.' + flagProductVariation + ' button';
let selectorButtonDelete = selectorButton + '.' + flagDelete;
let selectorButtonUndelete = selectorButton + '.' + flagAdd;
this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete, (event, element) => { this.handleChangeProductVariationInput(event, element); });
this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete, (event, element) => { this.handleChangeProductVariationInput(event, element); });
this.hookupButtonsProductPermutationVariationAdd();
}
hookupButtonsProductPermutationVariationAdd() {
this.hookupEventHandler(
"click"
, idTableMain + ' td.' + flagProductVariations + ' button.' + flagAdd
, (event, element) => { this.handleClickButtonProductPermutationVariationAdd(event, element); }
);
}
handleClickButtonProductPermutationVariationAdd(event, element) {
let variationsCell = element.closest('td.' + flagProductVariations);
let tbody = variationsCell.querySelector('tbody');
let permutationVariation = TableBasePage.createOptionUnselectedProductVariation();
this.addProductPermutationVariationRow(tbody, permutationVariation);
this.hookupFieldsProductPermutationVariation();
}
updateProductPermutationVariations(element) {
let variationsCell = element.closest('td.' + flagProductVariations);
let variationPairsString = this.getProductPermutationVariationsText(variationsCell);
DOM.setElementAttributeValueCurrent(variationsCell, variationPairsString);
this.handleChangeNestedElementCellTable(null, variationsCell);
}
getProductPermutationVariationsText(variationsTd) {
let rows = variationsTd.querySelectorAll(':scope tbody tr:has(button.' + flagDelete + ')');
let variationPairsString = '';
let ddlVariationType, ddlVariation, idVariationType, idVariation;
rows.forEach((row, index) => {
ddlVariationType = row.querySelector(':scope td select.' + flagProductVariationType);
ddlVariation = row.querySelector(':scope td select.' + flagProductVariation);
idVariationType = DOM.getElementValueCurrent(ddlVariationType);
idVariation = DOM.getElementValueCurrent(ddlVariation);
if (variationPairsString != '') variationPairsString += ',';
variationPairsString += idVariationType + ':' + idVariation;
});
return variationPairsString;
}
hookupCurrencyFields() {
this.hookupTableCellDdlPreviews(idTableMain + ' td.' + flagCurrency, Utils.getListFromDict(currencies));
}
createTdActive(isActive) {
let tdActive = document.createElement("td");
tdActive.classList.add(flagActive);
@@ -921,7 +530,6 @@ export default class TableBasePage extends BasePage {
let dataPage = {};
dataPage[flagFormFilters] = DOM.convertForm2JSON(formFilters);
this.setLocalStoragePage(dataPage);
// _rowBlank = null;
}
toggleColumnHasClassnameFlag(columnFlag, isRequiredFlag, classnameFlag) {
@@ -930,12 +538,6 @@ export default class TableBasePage extends BasePage {
let columnThHasFlag = columnTh.classList.contains(classnameFlag);
if (isRequiredFlag == columnThHasFlag) return;
DOM.toggleElementHasClassnameFlag(columnTh, isRequiredFlag, classnameFlag);
/*
let columnTds = table.querySelectorAll('td.' + columnFlag);
columnTds.forEach((columnTd) => {
DOM.toggleElementHasClassnameFlag(columnTd, isRequiredFlag, classnameFlag);
});
*/
}
toggleColumnHeaderHasClassnameFlag(columnFlag, isRequiredFlag, classnameFlag) {
let table = TableBasePage.getTableMain();
@@ -949,26 +551,3 @@ export default class TableBasePage extends BasePage {
this.toggleShowButtonsSaveCancel(existsDirtyRecord);
}
}
/* Example of a subclass of TableBasePage
import { TableBasePage } from "./page_table_base.js";
import API from "../api.js";
import DOM from "../dom.js";
export class PageStoreProductCategories extends TableBasePage {
static hash = hashPageStoreProductCategories;
static attrIdRowObject = attrIdProductCategory;
callSaveTableContent = API.saveCategories;
constructor() {}
initialize() {}
hookupFilters() {}
loadRowTable(rowJson) {}
getJsonRow(row) {}
initialiseRowNew(tbody, row) {}
hookupTableMain() {}
isDirtyRow(row) {}
leave() {}
}
*/