Skip to content

erp5
erp5
Commit f8987c41 authored by Tomáš Peterka's avatar Tomáš Peterka
Browse files
Options

[renderjs] LListBox column titles are clickable and issue sorting

parent 4820a37e
Hide whitespace changes
Inline Side-by-side
Showing with 79 additions and 65 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_html.html
View file @ f8987c41
......@@ -20,7 +20,7 @@
<!-- custom script -->
<script src="gadget_erp5_field_listbox.js" type="text/javascript"></script>
<script id="listbox-hidden-thead-template" type="text/x-handlebars-template">
<script id="listbox-thead-template" type="text/x-handlebars-template">
<table>
<thead class="ui-bar-inherit head">
<tr>
......@@ -28,7 +28,11 @@
<th data-i18n="Jump">Jump</th>
{{/if}}
{{#each head_value}}
<th data-i18n="{{data-i18n}}" class="{{class_value}}">{{text}}</th>
{{#if sort_link}}
<th data-i18n="{{data-i18n}}" class="{{class_value}}"><a href="{{sort_link}}">{{text}}</a></th>
{{else}}
<th data-i18n="{{data-i18n}}" class="{{class_value}}">{{text}}</th>
{{/if}}
{{/each}}
{{#if line_icon}}
<th></th>
......@@ -38,25 +42,6 @@
</table>
</script>
<script id="listbox-show-thead-template" type="text/x-handlebars-template">
<table>
<thead class="ui-bar-inherit head">
<tr>
{{#if show_anchor}}
<th data-i18n="Jump">Jump</th>
{{/if}}
<th></th>
{{#each head_value}}
<th data-i18n="{{data-i18n}}" class="{{class_value}}">{{text}}</th>
{{/each}}
{{#if line_icon}}
<th></th>
{{/if}}
</tr>
</thead>
</table>
</script>
<script id="listbox-hidden-tbody-template" type="text/x-handlebars-template">
<table>
<tbody class="tbody">
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_html.xml
View file @ f8987c41
......@@ -234,7 +234,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>958.1079.25051.23586</string> </value>
<value> <string>960.54476.25567.57719</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -252,7 +252,7 @@
</tuple>
<state>
<tuple>
<float>1489595378.88</float>
<float>1500472660.17</float>
<string>UTC</string>
</tuple>
</state>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js
View file @ f8987c41
......@@ -5,14 +5,10 @@
SimpleQuery, ComplexQuery, Query, Handlebars, console, QueryFactory) {
"use strict";
var gadget_klass = rJS(window),
listbox_hidden_thead_source = gadget_klass.__template_element
.getElementById("listbox-hidden-thead-template")
listbox_thead_source = gadget_klass.__template_element
.getElementById("listbox-thead-template")
.innerHTML,
listbox_hidden_thead_template = Handlebars.compile(listbox_hidden_thead_source),
listbox_show_thead_source = gadget_klass.__template_element
.getElementById("listbox-show-thead-template")
.innerHTML,
listbox_show_thead_template = Handlebars.compile(listbox_show_thead_source),
listbox_thead_template = Handlebars.compile(listbox_thead_source),
listbox_hidden_tbody_source = gadget_klass.__template_element
.getElementById("listbox-hidden-tbody-template")
......@@ -271,11 +267,11 @@
.onStateChange(function (modification_dict) {
var gadget = this,
head_value_list = [],
sort_key = gadget.state.key + "_sort_list:json",
class_value,
sort_list,
column_list,
tmp,
sort_column_list,
i,
j,
result_queue = new RSVP.Queue();
......@@ -294,7 +290,7 @@
return result_queue
.push(function () {
var options = {extended_search: undefined};
options[gadget.state.key + "_sort_list:json"] = undefined;
options[sort_key] = undefined;
return gadget.getUrlFor({
command: 'store_and_change',
options: options
......@@ -318,44 +314,69 @@
(modification_dict.hasOwnProperty('has_error')) ||
(modification_dict.hasOwnProperty('show_line_selector')) ||
(modification_dict.hasOwnProperty('hide_sort')) ||
(modification_dict.hasOwnProperty('hide_class'))) {
(modification_dict.hasOwnProperty('hide_class')) ||
(modification_dict.hasOwnProperty('extended_search'))) {
// display sorting arrow inside correct columns
sort_list = JSON.parse(gadget.state.sort_list_json);
column_list = JSON.parse(gadget.state.column_list_json);
for (i = 0; i < column_list.length; i += 1) {
class_value = "";
for (j = 0; j < sort_list.length; j += 1) {
tmp = sort_list[j];
if (tmp[0] === column_list[i][0]) {
if (tmp[1] === "ascending") {
class_value = "ui-icon ui-icon-arrow-up";
} else {
class_value = "ui-icon ui-icon-arrow-down";
}
break;
}
}
head_value_list.push({
"data-i18n": column_list[i][1],
"class_value": class_value,
"text": column_list[i][1]
});
}
sort_list = JSON.parse(gadget.state.sort_list_json); // current sort
column_list = JSON.parse(gadget.state.column_list_json); // shown columns
sort_column_list = JSON.parse(gadget.state.sort_column_list_json); // sortable columns
result_queue
.push(function () {
var listbox_thead_template,
hide_button_text,
hide_button_name;
// construct array of links for sortable columns, undefined otherwise
return RSVP.all(column_list.map(function (column) {
function is_current_column(item) {
return item[0] === column[0];
}
var is_sortable = sort_column_list.find(is_current_column) !== undefined,
current_sort = sort_list.find(is_current_column),
options = {};
if (is_sortable) {
options[sort_key] = [[column[0], 'ascending']]; // make it the only new sort (replace array instead of push)
if (current_sort !== undefined && current_sort[1] === 'ascending') {
options[sort_key] = [[column[0], 'descending']];
}
return gadget.getUrlFor({"command": 'store_and_change', "options": options});
}
return undefined;
}));
})
.push(function (column_sort_link_list) {
// here we obtain links for sorting by columns
// so we can construct array of header objects to be rendered in the header template
var hide_button_text,
hide_button_name,
current_sort,
head_value_list = [];
for (i = 0; i < column_list.length; i += 1) {
current_sort = sort_list.find((item) => item[0] === column_list[i][0]);
class_value = undefined;
if (current_sort !== undefined) {
if (current_sort[1] === 'ascending') {
class_value = "ui-icon ui-icon-arrow-up";
}
if (current_sort[1] === 'descending') {
class_value = "ui-icon ui-icon-arrow-down";
}
}
head_value_list.push({
"data-i18n": column_list[i][1],
"class_value": class_value,
"sort_link": column_sort_link_list[i],
"text": column_list[i][1]
});
}
if (gadget.state.show_line_selector) {
listbox_thead_template = listbox_show_thead_template;
hide_button_text = 'Submit';
hide_button_name = 'SelectRows';
} else {
listbox_thead_template = listbox_hidden_thead_template;
hide_button_text = 'Hide Rows';
hide_button_name = 'Hide';
}
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml
View file @ f8987c41
......@@ -236,7 +236,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>960.53125.56977.8192</string> </value>
<value> <string>960.56196.34799.43025</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -254,7 +254,7 @@
</tuple>
<state>
<tuple>
<float>1500458423.03</float>
<float>1500568728.83</float>
<string>UTC</string>
</tuple>
</state>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.css
View file @ f8987c41
......@@ -1216,6 +1216,10 @@ div[data-gadget-scope='erp5_searchfield'] button {
background-color: #0E81C2;
color: #FFFFFF;
}
.document_table table thead a {
color: #FFFFFF;
text-decoration: underline;
}
.document_table table thead tr th {
padding: 6pt 3pt;
}
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.xml
View file @ f8987c41
......@@ -242,7 +242,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>960.1037.21083.19336</string> </value>
<value> <string>960.55964.9157.39662</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -260,7 +260,7 @@
</tuple>
<state>
<tuple>
<float>1497443563.95</float>
<float>1500555425.98</float>
<string>UTC</string>
</tuple>
</state>
......
bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt
View file @ f8987c41
......@@ -1396,6 +1396,10 @@ div[data-gadget-scope='erp5_searchfield'] {
background-color: @colorsubheaderbackground;
color: @white;
a {
color: @white;
text-decoration: underline;
}
// XXX Same than cells
tr { th {
......
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