@material-ui/icons#RemoveCircleOutlined JavaScript Examples

The following examples show how to use @material-ui/icons#RemoveCircleOutlined. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: LoanpurposePage.js    From SESTA-FMS with GNU Affero General Public License v3.0 5 votes vote down vote up 
// displays EMI installment part
  createUI() {
    const { classes } = this.props;
    // displays no of input field pairs as per the EMI entries present
    return this.state.users.map((el, i) => (
      <div key={i} class="emiTxtbox">
        <Grid container spacing={2}>
          <Grid item md={6} xs={12}>
            <span
              style={{
                "font-weight": "bolder",
                "font-size": "large",
                display: "inline-block",
                width: "25px",
                "vertical-align": "middle",
              }}
            >
              {i + 1}
            </span>

            <span
              style={{
                display: "inline-block",
                width: "calc(100% - 25px)",
                "vertical-align": "middle",
              }}
            >
              <Grid container spacing={2}>
                <Grid item xs={6}>
                  <Input
                    style={{ "margin-left": "2%" }}
                    label="Principal"
                    type="number"
                    name="principal"
                    value={el.principal}
                    onChange={this.handleUIChange.bind(this, i)}
                    variant="outlined"
                  />
                </Grid>
                <Grid item xs={6}>
                  <Input
                    style={{ "margin-left": "5%" }}
                    label="Interest"
                    type="number"
                    name="interest"
                    value={el.interest}
                    onChange={this.handleUIChange.bind(this, i)}
                    variant="outlined"
                  />
                </Grid>
              </Grid>
            </span>
          </Grid>

          <Grid item md={6} xs={12}>
            {this.state.users.length !== 1 && (
              <IconButton
                aria-label="remove"
                onClick={this.removeClick.bind(this, i)}
                style={{ "margin-left": "3%" }}
              >
                <RemoveCircleOutlined className={classes.Icon} />
                <span className={classes.labelHeader}>Remove</span>
              </IconButton>
            )}
          </Grid>
        </Grid>
      </div>
    ));
  }
Example #2
Source File: LoanpurposePage.js    From SESTA-FMS with GNU Affero General Public License v3.0 5 votes vote down vote up 
// displays loan tasks part
  createTaskUI() {
    const { classes } = this.props;
    let actTypeFilter = this.state.actTypeFilter;
    // displays no of input fields  as per the loan tasks present
    return this.state.task.map((el, i) => (
      <div key={i}>
        <Grid container spacing={2}>
          <Grid item md={6} xs={12}>
            <span
              style={{
                "font-weight": "bolder",
                "font-size": "large",
                display: "inline-block",
                width: "30px",
                "vertical-align": "middle",
              }}
            >
              {i + 1}
            </span>
            <span
              style={{
                display: "inline-block",
                width: "calc(100% - 30px)",
                "vertical-align": "middle",
              }}
            >
              <Autocomplete
                id="name"
                value={el.activitytype}
                options={actTypeFilter}
                variant="outlined"
                getOptionLabel={(option) => option.name}
                placeholder="Select Activity type"
                onChange={(event, value, i) => {
                  this.handleTaskUIChange({
                    target: { name: "activitytype", value: value },
                  });
                }}
                renderInput={(params) => (
                  <Input
                    {...params}
                    //fullWidth
                    label="Select Activity type"
                    name="name"
                    variant="outlined"
                  />
                )}
              />
            </span>
          </Grid>
          <Grid item md={6} xs={12}>
            {this.state.task.length !== 1 && (
              <IconButton
                aria-label="remove"
                onClick={this.removeTaskClick.bind(this, i)}
                style={{ "margin-left": "3%" }}
              >
                <RemoveCircleOutlined className={classes.Icon} />
                <span className={classes.labelHeader}>Remove</span>
              </IconButton>
            )}
          </Grid>
        </Grid>
      </div>
    ));
  }