react-sign-code

import React from 'react';
import { Link } from 'react-router-dom';
import { Button, Row, Col, Form, Card, Spinner, Container, Table } from 'react-bootstrap';
import AlarmAlert from '../common/alerts';
import { httpRequest } from '../../js/common';

class HomeSignUpdate extends React.Component {
  constructor(props) {
    super(props);
    this.mounted = false;
    this.state = {
      loading: false,
      message: 'test',
      mode: 'flash',
      alertVariant: null,
      alertMessage: null,

    };

    this.setMessage = this.setMessage.bind(this);
    this.setText = this.setText.bind(this);
  }

  componentDidMount() {}

  setText(e) {
    const { name, value } = e.target;
    this.setState({
      [name]: value,
    });
  }

  setAlert(alertMessage, alertVariant) {
    this.setState({
      alertVariant,
      alertMessage,
    });
  }

  setMessage() {
    const {
      message,
      mode,
    } = this.state;

    httpRequest('/sign', 'post', {
      message,
      mode,
    }, {
      headers: {
        'Content-Type': 'application/json',
      },
    }).then((results) => {
      this.setState({
        stats: results,
      });
    }, () => {
      this.state({
        stats: null,
      });
    });
  }

  render() {
    const {
      alertMessage,
      alertVariant,
      loading,
      mode,
      message,
    } = this.state;
    return (
      <React.Fragment>
        <Container>
          <Row>
            <Col lg={12}>
              <h2>
                Update the sign
              </h2>
            </Col>

            <Col lg={4}>
              <Form.Group controlId="exampleForm.ControlTextarea1">
                <Form.Label>Sign Text</Form.Label>
                <Form.Control name="message" as="textarea" rows="3" value={message} onChange={this.setText} />
              </Form.Group>
            </Col>
            <Col lg={4}>
              <Form.Group controlId="exampleForm.ControlSelect1">
                <Form.Label>Sign Mode</Form.Label>
                <Form.Control name="mode" as="select" value={mode} onChange={this.setText}>
                  <option value="hold">Hold</option>
                  <option value="rotate">Scroll</option>
                  <option value="flash">Flash</option>
                </Form.Control>
              </Form.Group>
            </Col>
            <Col lg={4}>
              <Button variant="primary" type="submit" onClick={this.setMessage}>
                Submit
              </Button>
            </Col>
          </Row>
        </Container>
      </React.Fragment>
    );
  }
}

export default HomeSignUpdate;