router bug fix

src/ts/@overflow/app/views/layout/ProbeDetailLayout.tsx

@@ -32,19 +32,19 @@ export class ProbeDetailLayout extends React.Component<Props, State> {
     const sub = [
       {
         'name': 'Info',
-        'path': this.state.currUrl,
+        'path': '/',
       },
       {
         'name': 'Host',
-        'path': this.state.currUrl + '/host',
+        'path': '/host',
       },
       {
         'name': 'History',
-        'path': this.state.currUrl + '/history',
+        'path': '/history',
       },
       {
         'name': 'Targets',
-        'path': this.state.currUrl + '/targets',
+        'path': '/targets',
       },
     ];
     return (
@@ -52,7 +52,7 @@ export class ProbeDetailLayout extends React.Component<Props, State> {
         <LeftMenu />
         <Segment basic style={{ margin: '0 0 0 210px', padding: '0' }}>
           <Header />
-          <TitleBarContainer sub={sub} location={this.props.location.pathname}/>
+          <TitleBarContainer sub={sub} location={this.props.location.pathname} />
           <Segment basic>
             <Switch>
               <Route exact={true} path={`${this.props.match.url}/:id`} component={ProbeDetail} />
@@ -68,5 +68,6 @@ export class ProbeDetailLayout extends React.Component<Props, State> {
   }
 }
 
+
 export default ProbeDetailLayout;
 

src/ts/@overflow/app/views/layout/SensorDetailLayout.tsx

@@ -30,19 +30,19 @@ class SensorDetailLayout extends React.Component<Props, State> {
     const sub = [
       {
         'name': 'Info',
-        'path': this.state.currUrl,
+        'path': '/',
       },
       {
         'name': 'Items',
-        'path': this.state.currUrl + '/items',
+        'path': '/items',
       },
       {
         'name': 'Setup',
-        'path': this.state.currUrl + '/setup',
+        'path': '/setup',
       },
       {
         'name': 'History',
-        'path': this.state.currUrl + '/history',
+        'path': '/history',
       },
     ];
     return (

src/ts/@overflow/app/views/layout/TargetDetailLayout.tsx

@@ -30,15 +30,15 @@ export class TargetDetailLayout extends React.Component<Props, State> {
     const sub = [
       {
         'name': 'Info',
-        'path': this.state.currUrl + '',
+        'path': '',
       },
       {
         'name': 'Sensor',
-        'path': this.state.currUrl + '/sensor',
+        'path': '/sensor',
       },
       {
         'name': 'History',
-        'path': this.state.currUrl + '/history',
+        'path': '/history',
       },
     ];
     return (

src/ts/@overflow/app/views/layout/TitleBar.tsx

@@ -26,12 +26,35 @@ export class TitleBar extends React.Component<Props, State> {
     };
   }
 
+  public componentWillMount(): void {
+    if (this.props.sub === undefined || this.props.sub === null) {
+      return;
+    }
+
+    let last = this.props.location.split('/').pop().toLowerCase();
+    for(let i = 0; i < this.props.sub.length; i++) {
+      if(this.props.sub[i].name.toLowerCase() === last) {
+        this.setState({selected: i});
+      }
+    }
+  }
+
   public handleMenu(menu: any, index: number): any {
     this.setState({
       selected: index,
     });
     if (this.state.selected !== index) {
-      this.props.onRedirect(menu.path);
+      let id = null;
+      let urlArr = this.props.location.split('/');
+      for (let u of urlArr) {
+        let reg = /^(?:[1-9]\d*|\d)$/;
+        if (reg.test(u)) {
+          id = u;
+        }
+      }
+      let url = '/' + urlArr[1] + '/' + id + menu.path;
+
+      this.props.onRedirect(url);
     }
   }
 
@@ -86,7 +109,7 @@ export class TitleBar extends React.Component<Props, State> {
         elems.push(
           <Breadcrumb.Section key={index++} onClick={this.handleBreadcrumb.bind(this, path)}>
             {this.capitalizeFirst(item)}
-             {/* <Dropdown inline options={options} defaultValue={this.capitalizeFirst(item)}/> */}
+            {/* <Dropdown inline options={options} defaultValue={this.capitalizeFirst(item)}/> */}
           </Breadcrumb.Section>);
         elems.push(<Breadcrumb.Divider key={index++} />);
       }
@@ -96,7 +119,7 @@ export class TitleBar extends React.Component<Props, State> {
 
   public render(): JSX.Element {
     return (
-      <Menu fluid style={{ borderLeft: '0px', borderRight: '0px', boxShadow: 'none', borderRadius: '0', marginTop:'0'}} pointing>
+      <Menu fluid style={{ borderLeft: '0px', borderRight: '0px', boxShadow: 'none', borderRadius: '0', marginTop: '0' }} pointing>
         <Menu.Item style={{ width: '250px' }} >
           <Header as='h3'>{this.showTitle()}
             <Header.Subheader>