#140654507 #13 Change VacancyPage logic flow

assets/js/VacancyPage.jsx

 import React from 'react';
-import { Segment, Input, Menu } from 'semantic-ui-react'
 import Tabs from './components/Tabs';
 import Pane from './components/Pane';
 import VacancyList from './components/VacancyList';
+import Server from './lib/Server';
 
 export default class VacancyPage extends React.Component {
 
   constructor(props) {
     super(props);
     /* istanbul ignore next */
-    this.state = { email: '', password: '', errorFlag: false };
+    this.state = {
+      email: '',
+      password: '',
+      errorFlag: false,
+      vacancies: []
+    };
     this.handleItemClick = this.handleItemClick.bind(this);
   }
 
   handleItemClick = (e, { name }) => this.setState({ activeItem: name });
 
+  fetchVacancies(url) {
+    Server.get(url).then((data) => {
+      this.setState({ vacancies: data });
+    }, () => {
+    });
+  }
+
   render() {
     const data = [{ data1: 'val1' }, { data1: 'val2' }];
 
-    const {activeItem} = this.state;
-
     return (<div>
-    <Tabs selected={0}>
-      <Pane label="Semua Lowongan">
-        <VacancyList vacancies={data} />
-      </Pane>
-      <Pane label="Lamaran saya">
-        <div>This is my tab 2 contents!</div>
-      </Pane>
-    </Tabs>
-  </div>
+      <Tabs selected={0}>
+        <Pane label="Semua Lowongan" >
+          <VacancyList vacancies={data} />
+          { this.fetchVacancies('/api') }
+        </Pane>
+        <Pane label="Lamaran saya" >
+          <VacancyList vacancies={data} />
+          { this.fetchVacancies('/api') }
+        </Pane>
+        <Pane label="Lamaran Ditandai" >
+          <VacancyList vacancies={data} />
+          { this.fetchVacancies('/api') }
+        </Pane>
+      </Tabs>
+    </div>
 
     );
-  };
+  }
 }