From 0f85a1a33ad5b2e937632612d636543f0218a98a Mon Sep 17 00:00:00 2001 From: eson Date: Wed, 2 Sep 2020 10:45:32 +0800 Subject: [PATCH] =?UTF-8?q?finish=20=E6=9C=89=E4=BA=9B=E5=BF=85=E9=A1=BB?= =?UTF-8?q?=E4=B8=A4=E6=AC=A1=E6=89=8D=E6=9C=89=E5=A5=BD=E4=BD=93=E9=AA=8C?= =?UTF-8?q?.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.js | 22 +++++------- src/ChartsCount.js | 6 ++-- src/ContentTabs.js | 85 +++++++++++++++++++++++----------------------- src/Router.js | 34 ++++++++----------- src/index.js | 4 +-- 5 files changed, 71 insertions(+), 80 deletions(-) diff --git a/src/App.js b/src/App.js index c2d0b4b..7647982 100644 --- a/src/App.js +++ b/src/App.js @@ -2,14 +2,13 @@ import { MenuFoldOutlined, MenuUnfoldOutlined, DatabaseFilled } from '@ant-design/icons'; -import { Button, Layout, Menu, Tabs } from 'antd'; +import { Button, Layout, Menu } from 'antd'; import 'antd/dist/antd.css'; -import React, {useRef} from 'react'; +import React from 'react'; import './App.less'; import ContentTabs from './ContentTabs' -import TabsRoute from './Router'; - + const { Header, Content, Footer, Sider } = Layout; class App extends React.Component { @@ -17,8 +16,6 @@ class App extends React.Component { constructor(props) { super(props) this.state = { - platform: "openrec", - tab: "tabledata", collapsed: false } } @@ -30,13 +27,12 @@ class App extends React.Component { }; changePlatform = (p) => { - this.setState({platform: p}) + // this.setState({c: p}) this.refs.ctabs.changePlatform(p) - } render() { - const {tab, platform } = this.state; + return ( @@ -65,13 +61,13 @@ class App extends React.Component { - +
- + - +
@@ -79,7 +75,7 @@ class App extends React.Component {
- + ); } } diff --git a/src/ChartsCount.js b/src/ChartsCount.js index d2b00cc..477ec9e 100644 --- a/src/ChartsCount.js +++ b/src/ChartsCount.js @@ -100,7 +100,6 @@ class ChartsCount extends React.Component { updateData = (params = {}) => { - // const {platform, countkey, title} = params const platform = params.platform?params.platform:this.state.platform const countkey = params.countkey?params.countkey:this.state.countkey const title = params.title?params.title:this.state.title @@ -119,12 +118,15 @@ class ChartsCount extends React.Component { var ins = this.echarts_react.getEchartsInstance(); ins.setOption(getOption(this.state)); }); - }); } ) }; + componentDidMount() { + this.updateData() + } + countMethod(countkey, title) { this.updateData({countkey: countkey, title: title}); } diff --git a/src/ContentTabs.js b/src/ContentTabs.js index 0a24afb..c672f2c 100644 --- a/src/ContentTabs.js +++ b/src/ContentTabs.js @@ -1,6 +1,6 @@ -import React from 'react'; -import { Button, Layout, Menu, Tabs } from 'antd'; +import React from 'react'; +import { Tabs } from 'antd'; import ChartsCount from './ChartsCount'; import TableData from './TableData'; @@ -11,66 +11,65 @@ class ContentTabs extends React.Component { constructor(props) { super(props) this.state = { - platform: this.props.platform, - tab: this.props.tab, + platform: "openrec", // default openrec + tab: "tabledata",// default tabledata } } count = 1 - componentDidMount() { - - } + componentDidMount() { - changeTab = (tab) => { - this.updateDate({tab: tab}) - } + } - updateDate(params = {}) { + changeTab = (tab) => { + this.updateDate({ tab: tab }) + } - const platform = params.platform?params.platform:this.state.platform - const tab = params.tab?params.tab:this.state.tab - this.setState({platform: platform, tab:tab}); - - switch(tab) { - case "tabledata": - if (this.refs.tabledata) { + updateDate(params = {}) { + + const platform = params.platform ? params.platform : this.state.platform; + const tab = params.tab ? params.tab : this.state.tab; + this.setState({ platform: platform, tab: tab }); + + switch (tab) { + case "tabledata": + if (this.refs.tabledata) { this.refs.tabledata.changePlatform(platform); } break; - case "chartscount": - if (this.refs.chartscount) { - this.refs.chartscount.changePlatform(platform); - } + case "chartscount": + if (this.refs.chartscount) { + this.refs.chartscount.changePlatform(platform); + } break; - default: - } + default: } - changePlatform = (platform) => { - this.updateDate({platform: platform}) - } + } - render() { - this.count ++ - return ( + changePlatform = (platform) => { + this.updateDate({ platform: platform }); + } - + render() { + return ( + - - - + + + - - - - - ) - } + + + + + ) + } } diff --git a/src/Router.js b/src/Router.js index a076eac..e4593f1 100644 --- a/src/Router.js +++ b/src/Router.js @@ -1,37 +1,33 @@ import React from 'react'; import App from './App'; -import { HashRouter, Route, Switch, BrowserRouter, Redirect } from 'react-router-dom'; -import TableData from "./TableData"; -import ChartsCount from "./ChartsCount"; -import { Link } from 'react-router-dom'; -import { Button, Layout, Menu, Tabs, Result } from 'antd'; - -const { TabPane } = Tabs; +import { Route, Switch, BrowserRouter } from 'react-router-dom'; +import { Button, Result } from 'antd'; -const MainRouter = () => { + +const MainRouter = () => { return ( - - { + + { return Back Home} - /> + status="404" + title="404" + subTitle="Sorry, the page you visited does not exist." + extra={} + /> }} /> - + - ) - + ) + }; diff --git a/src/index.js b/src/index.js index 8fa05ff..eb8e455 100644 --- a/src/index.js +++ b/src/index.js @@ -1,13 +1,11 @@ import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; -import App from './Router'; import MainRouter from './Router'; import * as serviceWorker from './serviceWorker'; -import { Route } from 'react-router-dom'; ReactDOM.render( - , + , // // // ,