verify

src/common/pages/Vouchers/Verify/index.js

@@ -0,0 +1,122 @@
+import React from 'react';
+import {inject, observer} from 'mobx-react';
+import {
+    FlatButton
+} from 'material-ui';
+import { Affix, Card, Slider, Select, Row, Col, Icon, Tag,Rate, Button, Checkbox ,Divider, DatePicker, Alert, Input } from 'antd';
+import {startCase} from 'lodash';
+import LoadingDialog from "../../LoadingDialog";
+import Loader from 'react-loader-advanced';
+// import './style.scss';
+import {DIALOG} from "../../../stores/global_ui";
+import EmptyComponent from '../../EmptyComponent';
+import NavigationArrowBack from 'material-ui/svg-icons/navigation/arrow-back';
+import Search from 'material-ui/svg-icons/action/search';
+import Timer from 'react-compound-timer';
+
+@inject('appstate')
+@observer
+export default class VerifyVouchers extends React.Component {
+  constructor(props) {
+    super(props);
+    this.props = props;
+    this.state = {
+      value: 1,
+      valueMinimal: 0,
+      valueMaximal: 0,
+      changeSearch:false,
+    };
+    this.defaultState = Object.assign({}, this.state);
+    this.http = props.appstate.http;
+    this.authStore = props.appstate.auth;
+    this.globalUI = props.appstate.globalUI;
+  }
+
+  componentDidMount() {
+
+  }
+
+  handleChangeMinimal = (valueMinimal) => {
+    this.setState({ valueMinimal });
+  };
+
+  handleChangeMaximal = (valueMaximal) => {
+    this.setState({ valueMaximal });
+  };
+
+  handleBlur = () => {
+    console.log('blur');
+  }
+
+  handleFocus = () => {
+    console.log('focus');
+  }
+
+  handleChangeSearch = () => {
+    this.setState({
+        changeSearch : true
+    })
+  }
+
+  handleChangeSearchFalse = () => {
+    this.setState({
+        changeSearch : false
+    })
+  }
+
+  
+
+  render() {
+    const { valueMinimal, valueMaximal } = this.state;
+
+    return (
+    <div className="wallet containerMiddle">
+        <div className="row">
+            <div className="col s0 m2 l2" />
+            <div className="col s12 m8 l8">
+                <Card>
+                    <div className="row">
+                        <div style={{display:'flex',justifyContent:'center'}}>
+                            <h2 style={{color:'grey'}}>
+                                Verifikasi Keamanan
+                            </h2>
+                        </div>
+                    </div>
+                    <div className="row">
+                        <Alert message="Untuk melanjutkan transaksi, masukan 6-digit kode verifikasi yang telah dikirim." type="info" />
+                    </div>
+                    <div className="row">
+                        <p>Kode verifikasi telah dikirim ke ****.****.6523</p>
+                    </div>
+                    <div className="row">
+                        <Input placeholder="Masukan Kode Verifikasi" />
+                    </div>
+                    <div className="row">
+
+                    <Button style={{marginRight:10}}>Kirim ulang melalui SMS (<Timer
+                        initialTime={70000}
+                        lastUnit="s"
+                        direction="backward"
+                    >
+                        {() => (
+                            <React.Fragment>
+                                <Timer.Seconds />
+                            </React.Fragment>
+                        )}
+                    </Timer>)</Button>
+                    <Button>Telepon Saya</Button>
+                    </div>
+                    <div className="row">
+                        <div style={{display:'flex',justifyContent:'flex-end'}}>
+                            <Button type="danger">Batal</Button>
+                            <Button type="primary" style={{marginLeft:10}}>OK</Button>
+                        </div>
+                    </div>
+                </Card>
+            </div>
+            <div className="col s0 m2 l2" />
+        </div>
+    </div>
+    )
+  }
+}