update odlux stage 3

PerformanceApp: Add filter to chart view

add scrolling header to tables, add basic validation to editNetworkElementDialog

bugfixes

Issue-ID: SDNC-1087
Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com>
Change-Id: I585bd6cfeb11b867cd630e96e6479170d2f92fe8

1 files changed, 41 insertions, 3 deletions

diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
index bd182ed5d..b63f628a3 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
@@ -16,14 +16,33 @@
  * ============LICENSE_END==========================================================================
  */
 import * as React from "react";
+import { withStyles, WithStyles, createStyles, Theme } from '@material-ui/core/styles';
 
 import { Connect, connect, IDispatcher } from '../../../../framework/src/flux/connect';
 import { MaterialTable, MaterialTableCtorType } from '../../../../framework/src/components/material-table';
+import { TreeView, TreeItem, TreeViewCtorType } from '../../../../framework/src/components/material-ui/treeView';
 
 import { InventoryType } from '../models/inventory';
 import { IApplicationStoreState } from "../../../../framework/src/store/applicationStore";
 import { createInventoryElementsProperties, createInventoryElementsActions } from "../handlers/inventoryElementsHandler";
 
+const styles = (theme: Theme) => createStyles({
+  root: {
+    flex: "1 0 0%",
+    display: "flex",
+    flexDirection: "row",
+  },
+  tree: {
+    flex: "1 0 0%",
+    minWidth: "250px",
+    padding: `0px ${theme.spacing(1)}px`
+  },
+  details: {
+    flex: "5 0 0%",
+    padding: `0px ${theme.spacing(1)}px`
+  }
+});
+
 const InventoryTable = MaterialTable as MaterialTableCtorType<InventoryType & {_id: string}>;
 
 const mapProps = (state: IApplicationStoreState) => ({
@@ -35,9 +54,28 @@ const mapDispatch = (dispatcher: IDispatcher) => ({
   inventoryElementsActions: createInventoryElementsActions(dispatcher.dispatch)
 });
 
-class DashboardComponent extends React.Component<Connect<typeof mapProps, typeof mapDispatch>> {
+const SampleTree = TreeView as any as TreeViewCtorType<string>;
+
+
+type TreeDemoItem = TreeItem<string>;
+
+const treeData: TreeDemoItem[] = [
+  {
+    content: "Erste Ebene", children: [
+      {
+        content: "Zweite Ebene", children: [
+          { content: "Dritte Ebene" },
+        ]
+      },
+      { content: "Zweite Ebene 2" },
+    ]
+  },
+  { content: "Erste Ebene 3" },
+];
+
+class DashboardComponent extends React.Component<& WithStyles<typeof styles> & Connect<typeof mapProps, typeof mapDispatch>> {
   render() {
-    return <InventoryTable title="Inventory" idProperty="_id" columns={[
+    return <InventoryTable stickyHeader title="Inventory" idProperty="_id" columns={[
       { property: "nodeId", title: "Node Name" },
       { property: "manufacturerIdentifier", title: "Manufacturer" },
       { property: "parentUuid", title: "Parent" },
@@ -60,5 +98,5 @@ class DashboardComponent extends React.Component<Connect<typeof mapProps, typeof
   }
 }
 
-export const Dashboard = connect(mapProps, mapDispatch)(DashboardComponent);
+export const Dashboard = connect(mapProps, mapDispatch)(withStyles(styles)(DashboardComponent));
 export default Dashboard;
\ No newline at end of file