render()

in src/routes/Plugin/PluginRuleHandle/GeneralContextRuleHandle.js [100:209]
109 lines of code
2 McCabe index (conditional complexity)

  render() {
    const { handleData } = this;
    const { currentType } = this.state;
    const { form } = this.props;
    const { getFieldDecorator, getFieldValue } = form;
    getFieldDecorator("keys", {
      initialValue: this.keys
    });
    const keys = getFieldValue("keys");

    return (
      <div className={styles.handleWrap} style={{ padding: "0px 40px" }}>
        <div className={styles.header}>
          <h3 style={{ width: 60, marginTop: 10 }}>
            {getIntlContent("SHENYU.COMMON.DEAL")}:{" "}
          </h3>
        </div>
        <Tabs
          style={{ marginLeft: 10, width: "100%" }}
          defaultActiveKey={currentType}
          onChange={this.handleTabChange}
        >
          {handlers.map(handler => (
            <TabPane tab={titleCase(handler)} key={handler}>
              {keys[handler].map((key, keyIndex) => (
                <Row gutter={16} key={key}>
                  <Col span={7}>
                    <FormItem>
                      {getFieldDecorator(
                        `handle['${handler}']['${key}']['generalContextType']`,
                        {
                          initialValue:
                            handleData?.[handler]?.[key]?.generalContextType
                        }
                      )(
                        <Select
                          placeholder={titleCase(
                            `Select ${handler} Context Type`
                          )}
                        >
                          {contextType.map(v => (
                            <Option value={v} key={v} title={v}>
                              {v}
                            </Option>
                          ))}
                        </Select>
                      )}
                    </FormItem>
                  </Col>
                  <Col span={6}>
                    <FormItem>
                      {getFieldDecorator(
                        `handle['${handler}']['${key}']['generalContextKey']`,
                        {
                          initialValue:
                            handleData?.[handler]?.[key]?.generalContextKey
                        }
                      )(
                        <Input
                          placeholder={titleCase(
                            `Set ${handler} Context Key`
                          )}
                        />
                      )}
                    </FormItem>
                  </Col>
                  <Col span={6}>
                    <FormItem>
                      {getFieldDecorator(
                        `handle['${handler}']['${key}']['generalContextValue']`,
                        {
                          initialValue:
                            handleData?.[handler]?.[key]?.generalContextValue
                        }
                      )(
                        <Input
                          placeholder={titleCase(
                            `Set ${handler} Context Value`
                          )}
                        />
                      )}
                    </FormItem>
                  </Col>
                  <Col span={5}>
                    <FormItem>
                      <Button
                        type="danger"
                        style={{ marginRight: 16 }}
                        onClick={() => this.handleDeleteRow(handler, key)}
                      >
                        {getIntlContent("SHENYU.COMMON.DELETE.NAME")}
                      </Button>
                      {keyIndex === 0 && (
                        <Button
                          onClick={() => this.handleAddRow(handler)}
                          type="primary"
                        >
                          {getIntlContent("SHENYU.COMMON.ADD")}
                        </Button>
                      )}
                    </FormItem>
                  </Col>
                </Row>
              ))}
            </TabPane>
          ))}
        </Tabs>
      </div>
    );
  }