@/utils/utils#isJson JavaScript Examples

The following examples show how to use @/utils/utils#isJson. 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: index.js    From online-test-platform with Apache License 2.0 4 votes vote down vote up
render() {
    const {
      caseDetail: { data },
      loading,
    } = this.props;

    const { drawerVisible, verifyRuleList, traceVisible, traceInfo } = this.state;

    const columns = [
      {
        title: '任务id',
        dataIndex: 'taskid',
        width: '10%',
      },
      {
        title: '用例id',
        dataIndex: 'caseid',
        width: '10%',
      },
      {
        title: '请求',
        dataIndex: 'request',
      },
      {
        title: '结果',
        dataIndex: 'response',
        render: val => isJson(val) ? <ReactJson collapsed={true} src={JSON.parse(val)} /> : <span>{val}</span>
      },
      {
        title: '规则结果',
        width: '10%',
        render: (text, record) => <a onClick={() => this.handleDrawerVisible(true, record.ruleResult && record.ruleResult !== '' ? JSON.parse(record.ruleResult) : {})}>详情</a>,
      },
      {
        title: '操作',
        width: '12%',
        render: (text, record) => (
          <Fragment>
            <a onClick={() => this.handleTraceVisible(true, record.ruleResult && record.ruleResult !== '' ? JSON.parse(record.ruleResult) : {})}>trace</a>
            <Divider type="vertical" />
            <Link to={{pathname: '/ruleDebug',query: { request: record.request }}}>debug</Link>
          </Fragment>
        ),
      },
    ];

    const drawerColumns =[
      {
        title: '规则名称',
        dataIndex: 'name',
        width: '20%',
      },
      {
        title: '状态',
        dataIndex: 'state',
        width: '15%',
        render: val => <Badge status={val === 'FAIL' ? 'error' : val === 'PASS' ? 'success' : 'default'} text={val} />,

      },
      {
        title: '规则类型',
        dataIndex: 'category',
        width: '20%',
      },
      {
        title: '错误信息',
        dataIndex: 'message',
      },
    ];

    return (
      <PageHeaderWrapper>
        <div className={styles.standardList}>
          <Card title="命中请求" bordered={false} bodyStyle={{ padding: '0 24px 24px 24px' }}>
            <div className={styles.tableList}>
              <Table
                rowKey="id"
                loading={loading}
                dataSource={data.list}
                bordered
                columns={columns}
                pagination={{ showSizeChanger: true, showQuickJumper: true, ...data.pagination }}
                onChange={this.handleStandardTableChange}
              />
            </div>
          </Card>
        </div>

        <Drawer
          title="规则验证结果"
          placement="right"
          width={800}
          closable={false}
          onClose={() => this.handleDrawerVisible()}
          visible={drawerVisible}
        >
          <Table
            rowKey="id"
            dataSource={verifyRuleList}
            bordered
            columns={drawerColumns}
            pagination={{ showSizeChanger: true, showQuickJumper: true }}
          />
        </Drawer>

        <Drawer
          title="trace信息"
          placement="right"
          width={800}
          closable={false}
          onClose={() => this.handleTraceVisible()}
          visible={traceVisible}
        >
          <ReactJson src={traceInfo} />
        </Drawer>
      </PageHeaderWrapper>
    );
  }
Example #2
Source File: Debug.js    From online-test-platform with Apache License 2.0 4 votes vote down vote up
render() {
    const {
      rule: { response, ruleResponse },
      form: { getFieldDecorator },
    } = this.props;
    const { formValues } = this.state;

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
        md: { span: 12 },
      },
    };

    const submitFormLayout = {
      wrapperCol: {
        xs: { span: 24, offset: 0 },
        sm: { span: 10, offset: 7 },
      },
    };

    return (
      <PageHeaderWrapper>
        <Card bordered={false}>
          <Form hideRequiredMark style={{ marginTop: 8 }}>
            <FormItem {...formItemLayout} label='请求'>
              {getFieldDecorator('request', {
                initialValue: formValues.request,
                rules: [{required: true, message: '请输入请求串!'}],
              })(
                <TextArea
                  style={{ minHeight: 32 }}
                  placeholder='请输入'
                  rows={6}
                />
              )}
            </FormItem>
            <FormItem {...submitFormLayout}>
              <Button type="primary" onClick={this.handleRequest}>发送请求</Button>
            </FormItem>
            <FormItem {...formItemLayout} label='请求结果'>
              {getFieldDecorator('response', {
                initialValue: response,
              })(
                <TextArea
                  style={{ minHeight: 32 }}
                  rows={6}
                />
              )}
            </FormItem>
            <FormItem {...formItemLayout} label='应用'>
              {getFieldDecorator('type')(<Input placeholder='请输入' />)}
            </FormItem>
            <FormItem {...submitFormLayout}>
              <Button type="primary" onClick={this.handleBuildRequest}>构建规则请求</Button>
            </FormItem>
            <FormItem {...formItemLayout} label='规则请求'>
              <ReactJson
                collapsed={2}
                displayDataTypes={false}
                src={formValues.ruleRequest}
                style={{minWidth: '300px'}}
                onEdit={
                  e => {
                    this.setState({ formValues: {...formValues, ruleRequest: e.updated_src}});
                  }
                }
                onDelete={
                  e => {
                    this.setState({ formValues: {...formValues, ruleRequest: e.updated_src}});
                  }
                }
                onAdd={
                  e => {
                    this.setState({ formValues: {...formValues, ruleRequest: e.updated_src}});
                  }
                }
              />
            </FormItem>
            <FormItem {...formItemLayout} label='规则引擎'>
              {getFieldDecorator('ruleServer', {
                initialValue: "http://127.0.0.1:9191/testruleengine/smoke",
              })(<Input placeholder='请输入' />)}
            </FormItem>
            <FormItem {...submitFormLayout}>
              <Button type="primary" onClick={this.handleSendRuleRequest}>规则验证</Button>
            </FormItem>
            <FormItem {...formItemLayout} label='验证结果'>
              {
                isJson(ruleResponse) ?
                  <ReactJson collapsed={2} src={JSON.parse(ruleResponse)} /> :
                  <TextArea
                    style={{ minHeight: 32 }}
                    rows={6}
                    value={ruleResponse}
                  />
              }
            </FormItem>
          </Form>
        </Card>
      </PageHeaderWrapper>
    );
  }