fork from bc4552c5a8

2024-03-01 20:28:14 +08:00
commit 076c21dc36
491 changed files with 84482 additions and 0 deletions
--- a/exts/yapi-plugin-statistics/statisticsClientPage/StatisChart.js
+++ b/exts/yapi-plugin-statistics/statisticsClientPage/StatisChart.js
@@ -0,0 +1,77 @@
+/**
+ * Created by gxl.gao on 2017/10/25.
+ */
+import React, { Component } from 'react';
+// import PropTypes from 'prop-types'
+import axios from 'axios';
+import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend } from 'recharts';
+import { Spin } from 'antd';
+class StatisChart extends Component {
+  static propTypes = {};
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      showLoading: true,
+      chartDate: {
+        mockCount: 0,
+        mockDateList: []
+      }
+    };
+  }
+
+  UNSAFE_componentWillMount() {
+    this.getMockData();
+  }
+
+  // 获取mock 请求次数信息
+  async getMockData() {
+    let result = await axios.get('/api/plugin/statismock/get');
+    if (result.data.errcode === 0) {
+      let mockStatisData = result.data.data;
+      this.setState({
+        showLoading: false,
+        chartDate: { ...mockStatisData }
+      });
+    }
+  }
+
+  render() {
+    const width = 1050;
+    const { mockCount, mockDateList } = this.state.chartDate;
+
+    return (
+      <div>
+        <Spin spinning={this.state.showLoading}>
+          <div className="statis-chart-content">
+            <h3 className="statis-title">mock 接口访问总数为：{mockCount.toLocaleString()}</h3>
+            <div className="statis-chart">
+              <LineChart
+                width={width}
+                height={300}
+                data={mockDateList}
+                margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
+              >
+                <XAxis dataKey="_id" />
+                <YAxis />
+                <CartesianGrid strokeDasharray="7 3" />
+                <Tooltip />
+                <Legend />
+                <Line
+                  name="mock统计值"
+                  type="monotone"
+                  dataKey="count"
+                  stroke="#8884d8"
+                  activeDot={{ r: 8 }}
+                />
+              </LineChart>
+            </div>
+            <div className="statis-footer">过去3个月mock接口调用情况</div>
+          </div>
+        </Spin>
+      </div>
+    );
+  }
+}
+
+export default StatisChart;