Initial commit

src/common/pages/CustomerDetail/Wallet/index.js

@@ -0,0 +1,171 @@
+import React from 'react';
+import {observer, inject} from 'mobx-react';
+import bind from 'bind-decorator';
+import {
+  Card,
+  CardActions,
+  CardHeader,
+  CardMedia,
+  CardTitle,
+  AutoComplete,
+  CardText,
+  FlatButton,
+  Divider,
+  Tabs, Tab,
+  RaisedButton,
+  Toolbar,
+  DatePicker,
+  FontIcon,
+  Table,
+  TableBody,
+  TableHeader,
+  TableHeaderColumn,
+  TableRow,
+  TableRowColumn,
+  MenuItem,
+  ToolbarGroup,
+  FloatingActionButton,
+  ToolbarSeparator,
+  IconButton,
+  ToolbarTitle,
+  RadioButton,
+  TextField,
+  Paper,
+  RadioButtonGroup
+} from 'material-ui';
+import {LINKS} from "../../../routes";
+import {Link} from 'react-router-dom';
+import StarBorder from 'material-ui/svg-icons/toggle/star-border';
+import SwipeableViews from 'react-swipeable-views';
+import SearchIcon from 'material-ui/svg-icons/action/search';
+import AddIcon from 'material-ui/svg-icons/content/add';
+
+
+import '../style.scss';
+import {appConfig} from "../../../config/app";
+
+@inject('appstate')
+@observer
+export default class WalletCustomer extends React.Component {
+  constructor(props) {
+    super(props);
+    this.props = props;
+    this.state = {
+      value: 1,
+      searchText: '',
+      slideIndex: 0
+    };
+    this.defaultState = Object.assign({}, this.state);
+    this.http = props.appstate.http;
+    this.authStore = props.appstate.auth;
+  }
+
+  componentDidMount() {
+    console.log('Profile loaded!');
+
+  }
+
+  handleUpdateInput = (searchText) => {
+    this.setState({
+      searchText: searchText,
+    });
+  };
+
+  handleNewRequest = () => {
+    this.setState({
+      searchText: '',
+    });
+  };
+
+  tabsHandleChange = (value) => {
+    this.setState({
+      slideIndex: value,
+    });
+  };
+
+  handleChange = (event, index, value) => this.setState({value});
+
+  render() {
+    const styles = {
+
+      radioButton: {
+        marginBottom: 16,
+      },
+    };
+
+    const colors = [
+      'Jakarta - Soekarno - Hatta (CGK)',
+      'Bali',
+      'Surabaya',
+      'Yogyakarta',
+      'Aceh',
+      'Kalimantan',
+      'Medan',
+      'Papua',
+    ];
+
+    const items = [
+      <MenuItem key={1} value={1} primaryText="All Maskapai"/>,
+      <MenuItem key={2} value={2} primaryText="Air Asia"/>,
+      <MenuItem key={3} value={3} primaryText="Weeknights"/>,
+      <MenuItem key={4} value={4} primaryText="Weekends"/>,
+      <MenuItem key={5} value={5} primaryText="Weekly"/>,
+    ];
+
+    const count = [
+      <MenuItem key={1} value={1} primaryText="1"/>,
+      <MenuItem key={2} value={2} primaryText="2"/>,
+      <MenuItem key={3} value={3} primaryText="3"/>,
+      <MenuItem key={4} value={4} primaryText="4"/>,
+      <MenuItem key={5} value={5} primaryText="5"/>,
+    ];
+
+    return (
+      <div className="">
+        <Card>
+          <Toolbar className="toolbarCard" style={{backgroundColor: '#fff'}}>
+            <ToolbarGroup>
+              <SearchIcon style={{marginRight: 8, color: "#999"}}/>
+              <TextField
+                hintText="Search Transaction"
+                style={{fontSize: 14}}
+                hintStyle={{fontSize: 14}}
+                underlineShow={false}
+              />
+            </ToolbarGroup>
+          </Toolbar>
+          <Divider/>
+          <div>
+            <Table selectable={false}>
+              <TableHeader displaySelectAll={false}
+                           adjustForCheckbox={false}
+                           enableSelectAll={false}>
+                <TableRow style={{height: 38, background: '#f6f9fc'}}>
+                  <TableHeaderColumn className="TableHeaderColumnAkun" style={{height: 'auto'}}>Id</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun" style={{height: 'auto'}}>Date</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun" style={{height: 'auto'}}>Tyoe</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Status</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Amount</TableHeaderColumn>
+                </TableRow>
+              </TableHeader>
+              <TableBody displayRowCheckbox={false}>
+                <TableRow>
+                  <TableRowColumn><Link to={`${LINKS.CUSTOMER}/1827381/wallet/1827381`}
+                                           key={1827381}>#1827381</Link></TableRowColumn>
+                  <TableRowColumn>12/02/2017 20:10:30</TableRowColumn>
+                  <TableRowColumn>Package Down Payment</TableRowColumn>
+                  <TableRowColumn style={{color: "green"}}>Approved</TableRowColumn>
+                  <TableRowColumn>3.000.000</TableRowColumn>
+                </TableRow>
+              </TableBody>
+            </Table>
+
+
+          </div>
+        </Card>
+      </div>
+    )
+  }
+}