Skip to content

E
ecommerce-ui
Commit 5cc16464 authored by Sven Franck's avatar Sven Franck
Browse files
Options

added single/all visible/all row selecting

parent d6fa3a1d
Hide whitespace changes
Inline Side-by-side
Showing with 166 additions and 81 deletions
js/erp5_loader.js
View file @ 5cc16464
......@@ -143,44 +143,54 @@
/**
* selecting single checkbox
* @method sort
* @method check
* @param {object} e Event
*/
check: function (e) {
init.check(e, undefined);
},
/**
* select all visible rows (default)
* @method check_all_visible
* @param {object} e Event
*/
check_all_visible: function (e) {
init.check(e, false);
},
/**
* select all rows
* @method sort
* select ALL rows (visible and not visible)
* @method check_all
* @param {object} e Event
*/
// NOTE: checkbox has 3 states (this hijacks indeterminate state!!!)
check_all: function (e) {
// // check all 3-state (none|all visible|all)
// if (config.checkbox.show) {
// $parent.on("change", ".tick_all", function (e) {
// var checkbox = e.target,
// label = checkbox.previousSibling;
//
// if (checkbox.checked) {
// if (checkbox.indeterminate === false) {
// checkbox.setAttribute("flag", true);
// }
// } else {
// if (checkbox.getAttribute("flag")) {
// checkbox.removeAttribute("flag");
// checkbox.indeterminate = true;
// checkbox.checked = true;
// label.className = label.className.replace(priv.filterForClass("ui-icon-checkbox-on"), ' ui-icon-globe');
// e.preventDefault();
// return false;
// } else {
// checkbox.indeterminate = false;
// label.className = label.className.replace(priv.filterForClass("ui-icon-globe") , '');
// }
// }
// });
// }
var checkbox = e.target,
label = checkbox.previousSibling;
if (checkbox.checked) {
if (checkbox.indeterminate === false) {
checkbox.setAttribute("flag", true);
}
} else {
if (checkbox.getAttribute("flag")) {
checkbox.removeAttribute("flag");
checkbox.indeterminate = true;
checkbox.checked = true;
label.className = label.className.replace(
util.filterForClass("ui-checkbox-on"), " ui-icon-globe"
);
} else {
checkbox.indeterminate = false;
label.className = label.className.replace(
util.filterForClass("ui-icon-globe") , ""
);
}
}
// create visual and state
init.check(e, true);
}
};
......@@ -417,6 +427,7 @@
title,
set,
text,
action,
temp = {},
link = undefined,
check = settings.configuration.table.checkbox_rows,
......@@ -427,6 +438,10 @@
// tickbox - all
if (check) {
// allow to select all records (not only visible)
action = settings.configuration.table.select_all ?
"check_all" : "check_all_visible";
cell = factory.generateElement("th",{},{},{});
config = {
"type":"input",
......@@ -439,7 +454,7 @@
"value": "Select All/Unselect All",
"data-iconpos":"notext",
"data-reference": settings.base_element.direct.id,
"data-action":"check_all"
"data-action": action
},
"logic": {}
}
......@@ -2078,6 +2093,72 @@
// always return shortcut to cache of active page
return ram_cache[active][type];
};
/**
* Generate an action object (vs duplicate in every action call
* @method generateActionObject
* @param {object} e Event triggering an action
* @return {object} action object
*/
init.generateActionObject = function (e) {
var element, id;
element = e.target
id = element.getAttribute("data-reference");
return {
"element": element,
"id": id,
"gadget": document.getElementById(id),
"state": ram_cache[init.getActivePageId()].gadgets[id]
};
};
/**
* Highlight checkboxes and set a state on items selected
* @method check
* @param {object} e Event triggering the check action
* @param {boolean} all Boolean determining whether to check all records
*/
init.check = function (e, all) {
var i, j, config, rows, checks, check, checked;
// need to update info_field and status
// all can be true/false or undefined
// TODO: how to get the number of records selected?
// should we check a status of selected records, which must be
// updated whenever a checkbox is clicked, for selected, this would
// be good, but for accessing elements this would be bad...
// when storing in ram_cache is good, because no need to pass around
// during pagechange, however we can't store on the gadget, because
// that would make sense, but would be difficult to handle?
// console.log(ram_cache);
config = init.generateActionObject(e);
rows = config.gadget.getElementsByTagName("TBODY")[0].getElementsByTagName("TR");
checked = config.element.checked;
if (all !== undefined) {
for (i = 0; i < rows.length; i += 1) {
// assume there is only one checkbox in a first cell
checks = rows[i].childNodes[0].getElementsByTagName("INPUT");
if (checks.length > 0) {
check = checks[0];
if (check.type === "checkbox") {
// status is communicated via e
check.checked = checked;
// need to JQM refresh...
$(check).checkboxradio("refresh");
}
}
}
} else {
// single checkbox
}
};
/**
* Sort a selection of elements
* @sort
......@@ -2087,18 +2168,15 @@
* @param {string} next Next icon
*/
init.sort = function (e, direction, prev, next) {
var element, gadget, state, id, column, i, in_array;
var config, column, i, in_array;
element = e.target;
id = element.getAttribute("data-reference");
gadget = document.getElementById(id);
state = ram_cache[init.getActivePageId()].gadgets[id];
column = e.target.getAttribute("data-column-title");
config = init.generateActionObject(e);
column = config.element.getAttribute("data-column-title");
// change button right away
element.setAttribute("data-direction", direction);
element.setAttribute("data-icon", next);
element.className = element.className.replace(
config.element.setAttribute("data-direction", direction);
config.element.setAttribute("data-icon", next);
config.element.className = config.element.className.replace(
util.filterForClass("ui-icon-" + prev), " ui-icon-" + next
);
......@@ -2108,9 +2186,10 @@
init.timer = 0;
}
for (i = 0; i < state.query.sort_on.length; i += 1) {
if (state.query.sort_on[i][0] === column) {
for (i = 0; i < config.state.query.sort_on.length; i += 1) {
if (config.state.query.sort_on[i][0] === column) {
in_array = true;
current = config.state.query.sort_on[i][1];
break;
}
}
......@@ -2120,30 +2199,40 @@
switch (direction) {
case "desc_123":
case "desc_abc":
if (column && in_array === undefined) {
state.query.sort_on.push([column, "descending"]);
if (column) {
if (in_array === undefined) {
config.state.query.sort_on.push([column, "descending"]);
} else {
config.state.query.sort_on.splice(i, 1)
.push([column, "descending"]);
}
}
break;
case "asc_123":
case "asc_abc":
if (column && in_array === undefined) {
state.query.sort_on.push([column, "ascending"]);
if (column) {
if(in_array === undefined) {
config.state.query.sort_on.push([column, "ascending"]);
} else {
config.state.query.sort_on.splice(i, 1)
.push([column, "ascending"]);
}
}
break;
default:
// need to remove a column from sorting when set to undefined
if (column && in_array) {
state.query.sort_on.splice(i, 1);
config.state.query.sort_on.splice(i, 1);
}
break;
}
// give user half second to pick his state
init.timer = window.setTimeout(function () {
// update gadget
init.updatePageElement(element, id, gadget, state);
init.updatePageElement(
config.element, config.id, config.gadget, config.state
);
init.timer = 0;
}, 500);
};
......@@ -2156,47 +2245,46 @@
* @param {string} value New limit when changing number of records
*/
init.paginate = function (e, type, value) {
var element, gadget, state, id, start, records;
var config, start, records;
element = e.target;
id = element.getAttribute("data-reference");
gadget = document.getElementById(id);
state = ram_cache[init.getActivePageId()].gadgets[id];
config = init.generateActionObject(e);
if (gadget) {
if (state) {
if (config.gadget) {
if (config.state) {
switch (type) {
case "first":
start = 0;
records = state.query.limit[1];
records = config.state.query.limit[1];
break;
case "next":
start = state.query.limit[0] + state.query.limit[1];
records = state.query.limit[1];
start = config.state.query.limit[0] + config.state.query.limit[1];
records = config.state.query.limit[1];
break;
case "prev":
start = state.query.limit[0] - state.query.limit[1];
records = state.query.limit[1];
start = config.state.query.limit[0] - config.state.query.limit[1];
records = config.state.query.limit[1];
break;
case "last":
start = state.total - state.query.limit[1];
records = state.query.limit[1];
start = config.state.total - config.state.query.limit[1];
records = config.state.query.limit[1];
break;
case "limit":
start = state.query.limit[0];
start = config.state.query.limit[0];
records = parseInt(value);
break;
};
if (start > state.total || start < 0 ) {
if (start > config.state.total || start < 0 ) {
return;
}
// set new limits
state.query.limit = [start, records];
config.state.query.limit = [start, records];
// update gadget
init.updatePageElement(element, id, gadget, state);
init.updatePageElement(
config.element, config.id, config.gadget, config.state
);
} else {
// error
throw "No state information stored for this gadget";
......@@ -2211,22 +2299,20 @@
* Store a gadget's state in cache
* @method cacheGadgetState
* @param {string} id Gadget id
* @param {string} item ID of item currently being displayed
* @param {object} items JIO response with items being displayed
* @param {object} query JIO query parameters to get above item(s)
* @param {string} method Method to generate gadget
* @param {integer} total Total records for this query
* @param {array} selected Array of records currently selected
*/
init.cacheGadgetState = function (id, item, items, query, total, method) {
init.cacheGadgetState = function (id, query, total, method, selected) {
var cache = init.cacheSetup("gadgets");
// keep status of gadget in cache
cache[id] = {
"item": item,
"items": items,
"query": query,
"total": total,
"method": method
"method": method,
"selected": selected
}
};
......@@ -2270,19 +2356,18 @@
items = query_items;
init.cacheGadgetState(
id,
undefined,
query_items,
state.query,
state.total,
state.method
state.method,
state.selected
);
})
.then(function () {
// TODO: bad, but how to get the updateable element in gadget?
$(gadget.querySelectorAll("[data-update]")[0])
.replaceWith(factory.map_gadgets[state.method](
config, items, undefined, state.query, state.total, true
))
// TODO: bad selector, bad handler
$(factory.map_gadgets[state.method](
config, items, undefined, state.query, state.total, true
))
.replaceAll(gadget.querySelectorAll("[data-update]")[0])
.enhanceWithin();
})
.then(function () {
......@@ -2434,7 +2519,7 @@
})
.then(function (query_result) {
items = query_result;
init.cacheGadgetState(gadget_id, item, items, options, total, method);
init.cacheGadgetState(gadget_id, options, total, method, undefined);
})
.then(function() {
// generate gadget contents
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7