diff --git a/frappe/public/js/frappe/ui/page.html b/frappe/public/js/frappe/ui/page.html index 55083e1b9a..fc98f8d33e 100644 --- a/frappe/public/js/frappe/ui/page.html +++ b/frappe/public/js/frappe/ui/page.html @@ -1,6 +1,6 @@
-
+
@@ -33,6 +33,7 @@
+
diff --git a/frappe/public/js/frappe/ui/page.js b/frappe/public/js/frappe/ui/page.js index 8c53111bbd..e2ac9f7963 100644 --- a/frappe/public/js/frappe/ui/page.js +++ b/frappe/public/js/frappe/ui/page.js @@ -135,6 +135,7 @@ frappe.ui.Page = class Page { this.indicator = this.wrapper.find(".indicator-pill"); this.page_actions = this.wrapper.find(".page-actions"); + this.filters = this.wrapper.find(".filters"); this.btn_primary = this.page_actions.find(".primary-action"); this.btn_secondary = this.page_actions.find(".btn-secondary"); @@ -592,7 +593,7 @@ frappe.ui.Page = class Page { return $('').appendTo(this.menu); } - get_or_add_inner_group_button(label) { + get_or_add_inner_group_button(label, align_right) { var $group = this.inner_toolbar.find( `.inner-group-button[data-label="${encodeURIComponent(label)}"]` ); @@ -603,7 +604,7 @@ frappe.ui.Page = class Page { ${label} ${frappe.utils.icon("select", "xs")} - +
` ).appendTo(this.inner_toolbar); } @@ -636,7 +637,10 @@ frappe.ui.Page = class Page { }); } } - + add_divider_to_button_group(group) { + var $group = this.get_or_add_inner_group_button(group); + $('').appendTo($group.find(".dropdown-menu")); + } /* * Add button to button group. If there exists another button with the same label, * `add_inner_button` will not add the new button to the button group even if the callback @@ -646,7 +650,7 @@ frappe.ui.Page = class Page { * @param {object} action - function to be called when button is clicked * @param {string} group - Label of the group button */ - add_inner_button(label, action, group, type = "default") { + add_inner_button(label, action, group, type = "default", align_right = false) { var me = this; let _action = function () { let btn = $(this); @@ -663,7 +667,7 @@ frappe.ui.Page = class Page { } if (group) { - var $group = this.get_or_add_inner_group_button(group); + var $group = this.get_or_add_inner_group_button(group, align_right); $(this.inner_toolbar).removeClass("hide"); if (!this.is_in_group_button_dropdown($group.find(".dropdown-menu"), "a", label)) { @@ -887,6 +891,9 @@ frappe.ui.Page = class Page { delay: { show: 600, hide: 100 }, trigger: "hover", }); + if (parent == this.filters) { + this.restyle_field(f); + } // html fields in toolbar are only for display if (df.fieldtype == "HTML") { @@ -911,6 +918,12 @@ frappe.ui.Page = class Page { this.fields_dict[df.fieldname || df.label] = f; return f; } + restyle_field(f) { + $(f.wrapper).removeClass("col-md-2").css("margin", "0px"); + + $(f.wrapper).find("select").css("width", "140px"); + $(f.wrapper).find(".select-icon").css("top", "2px"); + } clear_fields() { this.page_form.empty(); } diff --git a/frappe/public/js/frappe/views/treeview.js b/frappe/public/js/frappe/views/treeview.js index 2be0ab49f3..b98f6557bd 100644 --- a/frappe/public/js/frappe/views/treeview.js +++ b/frappe/public/js/frappe/views/treeview.js @@ -1,6 +1,5 @@ // Copyright (c) 2015, Frappe Technologies Pvt. Ltd. and Contributors // MIT License. See license.txt - frappe.provide("frappe.treeview_settings"); frappe.provide("frappe.views.trees"); window.cur_tree = null; @@ -61,7 +60,6 @@ frappe.views.TreeView = class TreeView { this.make_page(); this.make_filters(); this.root_value = null; - if (me.opts.get_tree_root) { this.get_root(); } @@ -108,24 +106,38 @@ frappe.views.TreeView = class TreeView { } if (frappe.meta.has_field(me.doctype, "disabled")) { - $( - "
" - ).appendTo(this.page.inner_toolbar); - this.page.inner_toolbar - .addClass("flex align-center") - .on("click", "input[type='checkbox']", function () { - me.rebuild_tree(); - }); + this.page.add_inner_button( + __("Include Disabled"), + function () { + me.toggle_disable(event.target); + me.make_tree(); + }, + __("Expand"), + "default", + true + ); } if (this.opts.show_expand_all) { - this.page.add_inner_button(__("Collapse All"), function () { - me.tree.load_children(me.tree.root_node, false); - }); + this.page.add_inner_button( + __("Collapse All"), + function () { + me.tree.load_children(me.tree.root_node, false); + }, + __("Expand"), + "default", + true + ); - this.page.add_inner_button(__("Expand All"), function () { - me.tree.load_children(me.tree.root_node, true); - }); + this.page.add_inner_button( + __("Expand All"), + function () { + me.tree.load_children(me.tree.root_node, true); + }, + __("Expand"), + "default", + true + ); } if (this.opts.view_template) { @@ -166,7 +178,11 @@ frappe.views.TreeView = class TreeView { }; } - me.page.add_field(filter); + if (filter.render_on_toolbar) { + me.page.add_field(filter, me.page.filters); + } else { + me.page.add_field(filter); + } if (filter.default) { $("[data-fieldname='" + filter.fieldname + "']").trigger("change"); @@ -175,7 +191,6 @@ frappe.views.TreeView = class TreeView { } get_root() { var me = this; - frappe.call({ method: me.get_tree_nodes, args: me.args, @@ -188,6 +203,16 @@ frappe.views.TreeView = class TreeView { }, }); } + toggle_disable(el) { + if (this.args["include_disabled"]) { + this.args["include_disabled"] = false; + el.innerText = el.innerText.replace("Exclude", "Include"); + } else { + this.args["include_disabled"] = true; + console.log(el); + el.innerText = el.innerText.replace("Include", "Exclude"); + } + } make_tree() { $(this.parent).find(".tree").remove(); @@ -197,12 +222,6 @@ frappe.views.TreeView = class TreeView { use_value = use_label; } - if (this.page?.inner_toolbar) { - this.args["include_disabled"] = this.page.inner_toolbar - .find("input[type='checkbox']") - .prop("checked"); - } - this.tree = new frappe.ui.Tree({ parent: this.body, label: use_label, @@ -227,10 +246,11 @@ frappe.views.TreeView = class TreeView { cur_tree.view_name = "Tree"; this.post_render(); } - + toggle_label() { + console.log("hello"); + } rebuild_tree() { let me = this; - frappe.call({ method: "frappe.utils.nestedset.rebuild_tree", args: { diff --git a/frappe/public/scss/common/flex.scss b/frappe/public/scss/common/flex.scss index 1d1917d17c..37331342b8 100644 --- a/frappe/public/scss/common/flex.scss +++ b/frappe/public/scss/common/flex.scss @@ -7,6 +7,11 @@ flex-direction: column; } +.flex-nowrap { + @extend .flex; + flex-wrap: nowrap; +} + .justify-center { justify-content: center; }