๐Ÿ“ฆ juspay / purescript-presto

๐Ÿ“„ AskAmount.js ยท 74 lines
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74import React, { Component } from 'react';
import styles from './App.css';

class Header extends Component {
  render() {
    return (
      <div className={styles.operator}>
        <h1 className={styles.header}>{this.props.name}</h1>
      </div>
    );
  }
}




class AskAmount extends Component {
  constructor(state) {
    super(state);
    this.onAmountEntered = this.onAmountEntered.bind(this);
    this.onBackClick = this.onBackClick.bind(this);
  }

  onBackClick () {
    window.__runDuiCallback(JSON.stringify({tag:"AskAmountScreenAbort"}))
  }

  onAmountEntered() {
    if(Number(document.getElementsByName('amount')[0].value) > 0){
      window.__runDuiCallback(JSON.stringify({
        tag:"SubmitAmount",
        contents:Number(document.getElementsByName('amount')[0].value)
      }))
    }
  }

  render() {
    return (
      <div className = {styles.background}>
        <div className = {styles.AskMobileNumber}>
          <div className={styles.headerWithArrow}>
            <div className = {styles.operator}>
              <img className = {styles.backImage} 
                onClick = {this.onBackClick} 
                src={require("../dist/icon1.png")} 
                alt = {require("../dist/logo.svg")} 
                align = "left"/>
            </div>
            <Header name="Enter Amount"/>
          </div>
          <div className = {styles.body}>
            <h4>Enter your Amount</h4>
            <div className={styles.rows}>
              <div className = {styles.operator}>
                <img className = {styles.image} 
                  src={require("../dist/rupeeblack0.png")} 
                  alt = {require("../dist/logo.svg")}/>
              </div>
              <input type="tel" name = "amount" maxLength = "10" />
            </div>
          </div>
          <button className = {styles.button}
            onClick = {this.onAmountEntered} 
            type="button"> 
            Next
          </button>
        </div>
      </div>
    );
  }
}

export default AskAmount;