fix: expanded node group interactions and visibility

This commit is contained in:
Rucha Mahabal 2021-06-29 15:06:09 +05:30
parent 5046cb09d8
commit 25c5cff3de
2 changed files with 26 additions and 6 deletions

View File

@ -486,6 +486,13 @@ class OrgChartMobile {
if (company.get_value() && me.company != company.get_value()) {
me.company = company.get_value();
if (me.$sibling_group)
me.$sibling_group.remove();
// setup sibling group wrapper
me.$sibling_group = $(`<div class="sibling-group mt-4 mb-4"></div>`);
me.page.main.append(me.$sibling_group);
if (me.$hierarchy)
me.$hierarchy.remove();
@ -541,6 +548,12 @@ class OrgChartMobile {
this.set_selected_node(node);
this.show_active_path(node);
if (this.$sibling_group) {
const sibling_parent = this.$sibling_group.find('.node-group').attr('data-parent');
if (node.parent_id !== sibling_parent)
this.$sibling_group.empty();
}
if (node.expandable && !node.expanded) {
return this.load_children(node);
}
@ -719,8 +732,6 @@ class OrgChartMobile {
if (collapsed)
$node_group.addClass('collapsed');
else
$node_group.addClass('mb-4');
return $node_group;
}
@ -746,13 +757,15 @@ class OrgChartMobile {
() => this.get_child_nodes(node_object.parent_id, node_object.id),
(child_nodes) => this.get_node_group(child_nodes, node_object.parent_id, false),
(node_group) => {
this.$hierarchy.empty().append(node_group) },
if (node_group)
this.$sibling_group.empty().append(node_group);
},
() => this.setup_node_group_action(),
() => {
this.$hierarchy.append(`
this.$hierarchy.empty().append(`
<li class="level"></li>
`);
this.$hierarchy.append(node);
this.$hierarchy.find('.level').append(node);
this.expand_node(node_object);
}
]);

View File

@ -215,7 +215,7 @@
display: flex;
flex-direction: column;
align-items: center;
padding-top: 30px;
padding-top: 10px;
padding-left: 0px;
}
@ -250,6 +250,7 @@
.collapsed-level {
margin-bottom: 16px;
width: 18rem;
}
.node-group {
@ -281,4 +282,10 @@
.node-group.collapsed {
width: 5rem;
margin-left: 12px;
}
.sibling-group {
display: flex;
flex-direction: column;
align-items: center;
}