boniuApi/boniu/src/components/Overview/overview.jsx

import React, { Component } from "react";
import "./overview.css";
import { Typography, Table, Button, Card } from "antd";
const { Text, Paragraph, Title, Link } = Typography;

class Overview extends Component {
  render() {
    return (
      <div>
        <Title level={3}>总体说明</Title>

        <Text type="secondary" className='overview-text-block'>接口请求方式采用get方式</Text>
        <Text type="secondary" className='overview-text-block overview-footer'>接口采用模拟HTTP协议及JSON接口模式</Text>

        <Title className="overview-title" level={5}>
          校验方式说明：
          <Text type="secondary" code={{ fontSize: 16 }}>
            sign=md5(method=接口名称&time=时间戳)
          </Text>
        </Title>
        <Text type="secondary">
          http://boniu.xazhima.com/api/v1.0/api.php?sign=校验方式"&timestamp="时间戳"&method="方法名"&code="$code&"start_date="开始日期"&end_date="截止日期"&order="排序;
        </Text>

        <Title className="overview-title" level={5}>
          输出结果：
        </Title>
        <Table
          className="first-table"
          columns={columns}
          // expandable
          dataSource={columnsData}
          pagination={false}
          size="small"
        />

        <Title className="overview-title margin-top-20" level={5}>
          异常结果：
        </Title>
        <Table
          className="err-table second-table"
          columns={errColumns}
          dataSource={errColumnsData}
          pagination={false}
          size="small"
        />

        <Card
          title="输出结果格式："
          hoverable={true}
          style={{ width: 300, marginTop: 20 }}
        >
          <p>
            {"\u007B"}
            <br />
            （信息码区）
            <br />
            （输入参数呼应区）
            <br />
            （结果返回）
            <br />
            {"\u007d"}
          </p>
        </Card>

        <Title className="overview-title margin-top-20" level={5}>
          输出结果规则总体说明：
        </Title>
        <Text type="secondary" className='overview-text-block overview-footer'>
          1.所有交易日期格式均为8位整数，不传为当天数据
        </Text>
        <Text type="secondary" className='overview-text-block overview-footer'>
          2.5日线、10
          日线、20日线、30日线、60日线、233线以及开盘价、收盘价、最高价、最低价等价格参数均与输入参数复权方式一致
        </Text>
        <Text type="secondary" className='overview-text-block overview-footer'>
          3.所有输出的价格，均按照四舍五入保留小数点后两位的格式输出
        </Text>
        <Text type="secondary" className='overview-text-block overview-footer'>
          4.价格计算方式：①涨跌额：当天收盘价-前一天收盘价。②涨跌幅：涨跌额÷前一天收盘价*100%。③涨停价：科创板、创业板股为前一天收盘价*120%，ST为前一天收盘价*105%，其他股为前一天收盘价*110%。④跌停价：科创板、创业板股为前一天收盘价*80%，ST为前一天收盘价*95%，其他股为前一天收盘价*90%。⑤是否涨跌停标志：涨跌停标志按照收盘价计算，如果当天收盘价等于涨停价，则为涨停，如果收盘价等于跌停价，则为跌停。如果没有涨/跌停，涨跌停标志输出0/-1。（新股发行前5天没有涨跌停价格）
        </Text>
      </div>
    );
  }
}

export default Overview;
const columns = [
  {
    title: "名称",
    dataIndex: "name",
    key: "name"
  },
  {
    title: "说明",
    dataIndex: "desc",
    key: "desc"
  }
];
const columnsData = [
  {
    key: "1",
    name: "message_code",
    desc: 200
  },
  {
    key: "2",
    name: "message",
    desc: "success"
  },
  {
    key: "3",
    name: "data",
    desc: "接口对应字段"
  }
];
const errColumns = [
  {
    title: "错误类型",
    dataIndex: "type",
    key: "type"
  },
  {
    title: "message_code",
    dataIndex: "code",
    key: "code"
  },
  {
    title: "message",
    dataIndex: "message",
    key: "message"
  }
];
const errColumnsData = [
  {
    key: "1",
    type: "错误码300",
    code: "300...",
    message: "接口参数输入错误"
  },
  {
    key: "2",
    type: "错误码400",
    code: "400...",
    message: "对外输出错误"
  },
  {
    key: "3",
    type: "错误码500",
    code: "500...",
    message: "系统错误"
  },
  {
    key: "4",
    type: "例如：",
    code: "",
    message: "",
    children: [
      {
        key: "9",
        type: "股票代码错误",
        code: "301",
        message: " 股票/指数代码不存在/错误"
      },
      {
        key: "10",
        type: "交易板块错误",
        code: "302",
        message: "交易板块不存在/错误"
      },
      {
        key: "11",
        type: "所属市场错误",
        code: "303",
        message: "所属市场不存在/错误"
      },
      {
        key: "12",
        type: "签名错误",
        code: "304",
        message: "非法签名"
      },
      {
        key: "13",
        type: "时间/时间段输入错误",
        code: "305",
        message: "时间/时间段错误"
      },
      {
        key: "14",
        type: "复权码输入错误",
        code: "306",
        message: "复权码错误"
      },
      {
        key: "15",
        type: "code未输入，参数为空",
        code: "307",
        message: "code参数不能为空"
      },
      {
        key: "16",
        type: "方法名输入错误",
        code: "308",
        message: "方法名错误"
      },
      {
        key: "17",
        type: "order输入错误",
        code: "309",
        message: "order参数错误"
      },
      {
        key: "18",
        type: "traceback_days输入有误",
        code: "310",
        message: "traceback_days参数错误"
      },
      {
        key: "19",
        type: "返回数据为空",
        code: "401",
        message: " 股票/指数数据为空"
      },
      {
        key: "20",
        type: "服务器错误",
        code: "501",
        message: "服务器错误"
      }
    ]
  }
];