Initial commit

2019-01-02 18:39:53 +07:00
commit 1a000700e6
781 changed files with 95892 additions and 0 deletions
--- a/src/common/pages/CustomerDetail/Order/index.js
+++ b/src/common/pages/CustomerDetail/Order/index.js
@@ -0,0 +1,197 @@
+import React from 'react';
+import {inject, observer} from 'mobx-react';
+import {
+  Card,
+  Divider,
+  MenuItem,
+  RaisedButton,
+  Table,
+  TableBody,
+  TableHeader,
+  TableHeaderColumn,
+  TableRow,
+  TableRowColumn,
+  TextField,
+  Toolbar,
+  ToolbarGroup,
+  ToolbarSeparator
+} from 'material-ui';
+import SearchIcon from 'material-ui/svg-icons/action/search';
+import AddIcon from 'material-ui/svg-icons/content/add';
+import moment from "moment";
+import {Link} from 'react-router-dom';
+import {LINKS} from "../../../routes";
+import get from 'lodash.get';
+import EmptyComponent from "../../EmptyComponent/index";
+
+// import './style.scss';
+
+@inject('appstate')
+@observer
+export default class CustomerOrder extends React.Component {
+  constructor(props) {
+    super(props);
+    this.props = props;
+    this.state = {
+      value: 1,
+      searchText: '',
+      slideIndex: 0,
+      customers: [
+        {
+          id: 'ATT001',
+          package: 'The Exoticsm Of Minang',
+          registered: moment(),
+          status: 'active'
+        },
+        {
+          id: 'ATT002',
+          package: 'Weh Island Wonderful Adventure',
+          registered: moment(),
+          status: 'blocked'
+        },
+        {
+          id: 'ATT003',
+          package: 'Holy Land',
+          registered: moment(),
+          status: 'pending'
+        },
+        {
+          id: 'ATT004',
+          package: 'Legoland & Gardens By The Bay 4D',
+          registered: moment(),
+          status: 'clear'
+        },
+      ]
+    };
+    this.defaultState = Object.assign({}, this.state);
+    this.http = props.appstate.http;
+    this.authStore = props.appstate.auth;
+    this.customer = props.appstate.customer;
+    this.order = props.appstate.order;
+  }
+
+  componentDidMount() {
+    console.log('Profile loaded!', this.props);
+    this.customer.getOrder()
+
+  }
+
+  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="animated fadeIn">
+        <Card>
+          <Toolbar className="toolbarCard" style={{backgroundColor: '#fff'}}>
+            <ToolbarGroup>
+              <SearchIcon style={{marginRight: 8, color: "#999"}}/>
+              <TextField
+                hintText="Search Order"
+                style={{fontSize: 14}}
+                hintStyle={{fontSize: 14}}
+                underlineShow={false}
+              />
+            </ToolbarGroup>
+            {/*<ToolbarGroup className="ToolbarGroupLast">*/}
+            {/*<ToolbarSeparator/>*/}
+            {/*<RaisedButton className="ToolbarGroupLastButton" icon={<AddIcon/>} label="New Customer" primary={true} />*/}
+            {/*</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'}}>Order
+                    Id</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Type</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Name</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Ordered</TableHeaderColumn>
+                  <TableHeaderColumn className="TableHeaderColumnAkun"
+                                     style={{height: 'auto'}}>Status</TableHeaderColumn>
+                </TableRow>
+              </TableHeader>
+              <TableBody displayRowCheckbox={false}>
+                {(this.customer.orders.length > 0) ?
+                  this.customer.orders.map(cust => {
+                    return (
+                      <TableRow key={cust.id}>
+                        <TableRowColumn><Link to={(cust.type === 'airline') ? `${LINKS.ORDER_DETAIL_AIRLINES_WO_ID}/${cust.id}` : `${LINKS.ORDER}/${cust.id}`} key={cust.id} onClick={() => {
+                          this.order.setOrderDetail(cust);
+                          // this.props.history.push();
+                        }}>{cust.id}</Link></TableRowColumn>
+                        <TableRowColumn>{cust.type}</TableRowColumn>
+                        <TableRowColumn>{cust.name}</TableRowColumn>
+                        <TableRowColumn>{moment(cust.created_at).format("DD MMMM YYYY, HH:mm:ss")}</TableRowColumn>
+                        <TableRowColumn>{cust.status}</TableRowColumn>
+                      </TableRow>
+                    )
+                  }) : <EmptyComponent type="empty" header="" content="There is no data in sight"/>
+                }
+              </TableBody>
+            </Table>
+
+
+          </div>
+        </Card>
+      </div>
+    )
+  }
+}