LP1884950 Org Unit Admin Scrolling

Admin -> Server Admin -> Organizational Units now displays the tree of
org units in a vertical-scrollable div which occupies 80% of the
vertical window space.

Tree is opened to the first level of child nodes.  Deeper child nodes
are collapsed.

Signed-off-by: Bill Erickson <berickxx@gmail.com>
Signed-off-by: Dawn Dale <ddale@georgialibraries.org>
Signed-off-by: Chris Sharp <csharp@georgialibraries.org>

diff --git a/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.html b/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.html
index 294d62c..0955e98 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.html
@@ -22,7 +22,9 @@
 <div class="row">
   <div class="col-lg-4">
     <h3 i18n>Org Units</h3>
-    <eg-tree [tree]="tree" (nodeClicked)="nodeClicked($event)"></eg-tree>
+    <div class="border rounded p-1" style="height:{{winHeight}}px;overflow-y:auto">
+      <eg-tree [tree]="tree" (nodeClicked)="nodeClicked($event)"></eg-tree>
+    </div>
   </div>
   <div class="col-lg-8">
     <div class="alert alert-info">

diff --git a/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.ts b/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.ts
index ff5a184..160e972 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/admin/server/org-unit.component.ts
@@ -19,6 +19,8 @@ export class OrgUnitComponent implements OnInit {
 
     tree: Tree;
     selected: TreeNode;
+    winHeight = 500;
+
     @ViewChild('editString', { static: true }) editString: StringComponent;
     @ViewChild('errorString', { static: true }) errorString: StringComponent;
     @ViewChild('delConfirm', { static: true }) delConfirm: ConfirmDialogComponent;
@@ -72,13 +74,16 @@ export class OrgUnitComponent implements OnInit {
             const node = this.tree.findNode(selectNodeId);
             this.selected = node;
             this.tree.selectNode(node);
+
+            // Subtract out the menu bar plus a bit more.
+            this.winHeight = window.innerHeight * 0.8;
         });
     }
 
     // Translate the org unt type tree into a structure EgTree can use.
     ingestAouTree(aouTree) {
 
-        const handleNode = (orgNode: IdlObject): TreeNode => {
+        const handleNode = (orgNode: IdlObject, expand?: boolean): TreeNode => {
             if (!orgNode) { return; }
 
             if (!orgNode.hours_of_operation()) {
@@ -88,7 +93,8 @@ export class OrgUnitComponent implements OnInit {
             const treeNode = new TreeNode({
                 id: orgNode.id(),
                 label: orgNode.name(),
-                callerData: {orgUnit: orgNode}
+                callerData: {orgUnit: orgNode},
+                expanded: expand
             });
 
             // Apply the compiled label asynchronously
@@ -108,7 +114,7 @@ export class OrgUnitComponent implements OnInit {
             return treeNode;
         };
 
-        const rootNode = handleNode(aouTree);
+        const rootNode = handleNode(aouTree, true);
         this.tree = new Tree(rootNode);
     }