diff --git a/src/Config.js b/src/Config.js
index 1a9ae03..67b9830 100644
--- a/src/Config.js
+++ b/src/Config.js
@@ -6,7 +6,8 @@ var config = {
 
     trend_all : `${host}/api/data`,
     trend_online: `${host}/api/data/online`, // 在线人数api
-    count_player: `${host}/api/count/player`, // 在线人数api
+    count_player: `${host}/api/count/current/player`, // 总人数api
+    count_playerstatus: `${host}/api/count/current/playerstatus`, // 总陪玩者现在状态api
     count_statement: `${host}/api/count/statement`, // 在线人数api
 }
 
diff --git a/src/Home.js b/src/Home.js
index dba4393..92e0477 100644
--- a/src/Home.js
+++ b/src/Home.js
@@ -1,27 +1,18 @@
 
-import React from 'react';
-import { Button, Image, Layout, Menu } from 'antd';
 // import Icon from '@ant-design/compatible';
-import Icon from '@ant-design/icons';
 import {
-  MenuUnfoldOutlined,
-  MenuFoldOutlined,
-  UserOutlined,
-  
-  VideoCameraOutlined,
-  UploadOutlined,
+  MenuFoldOutlined, MenuUnfoldOutlined
 } from '@ant-design/icons';
+import { Anchor, Button, Image, Layout, Menu } from 'antd';
+import React from 'react';
 import { HashRouter, Link, Route, Switch } from 'react-router-dom';
-
-import config from './Config.js';
-import Trend from './charts/Trend';
-import { ConfigConsumer } from 'antd/lib/config-provider';
 import Playerduo from './pages/playerduo.js';
 import playerduo_logo from "./pages/playerduo_logo.svg";
-import { IconMap } from 'antd/lib/result';
+
 
 
 const { Header, Sider, Content } = Layout;
+ 
 
 class Home extends React.Component {
   state = {
@@ -53,8 +44,8 @@ class Home extends React.Component {
                 <Link to="/"></Link>
               </HashRouter>
             </Menu.Item> */}
-            <Menu.Item key="#/playerduo" title="playerduo" icon={ <Image width={32} height={32}  src={playerduo_logo}></Image>  }>
-          
+            <Menu.Item key="#/playerduo" title="playerduo" icon={<Image width={32} height={32} src={playerduo_logo}></Image>}>
+
               <HashRouter>
                 <Link to={{ pathname: "/playerduo" }}></Link>
               </HashRouter>
@@ -67,8 +58,27 @@ class Home extends React.Component {
 
         </Sider>
         <Layout  >
-          <Header style={{ background: "#e7e7e7",   height: "42px" }}>
-          </Header>
+          <HashRouter>
+            <Switch>
+              <Route exact path="/playerduo" render={()=>{return  <Header style={{ background: "#e7e7e7", height: "48px" }}>
+                  <Anchor onClick={(e,link)=>{
+                    window.location.hash = "playerduo";
+                    console.log(e, link);
+                  }} onChange={(e)=>{
+                    e = window.location.hash;
+                    console.log(e, window.location.hash);
+                  }} style={{width:"100%"}}>
+                    <Anchor.Link    title="player-monery"></Anchor.Link>
+                  </Anchor>
+                </Header>}}   >
+              </Route>
+              <Route exact path="/"   >
+                < Header style={{ background: "#e7e7e7", height: "42px" }}>
+                </Header>
+              </Route>
+            </Switch>
+          </HashRouter>
+
           <Content
             style={{
               background: "#e7e7e7",
@@ -79,7 +89,7 @@ class Home extends React.Component {
 
             <HashRouter>
               <Switch>
-                <Route exact path="/playerduo" component={ Playerduo } />
+                <Route exact path="/playerduo" component={Playerduo} />
               </Switch>
             </HashRouter>
           </Content>
diff --git a/src/Router.js b/src/Router.js
index 0bba5b1..89b309a 100644
--- a/src/Router.js
+++ b/src/Router.js
@@ -9,7 +9,6 @@ class HomeRouter extends React.Component {
         <BrowserRouter>
             <Switch>
                 <Route exact path="/" component={Home}/>
-
             </Switch>
         </BrowserRouter>
         )
diff --git a/src/charts/Base.js b/src/charts/Base.js
index 179d9d8..9146f90 100644
--- a/src/charts/Base.js
+++ b/src/charts/Base.js
@@ -30,5 +30,5 @@ const TrendType = {
     RangeDate: 2,
 }
 
-export {TrendType, dateFormat, defaultDateFormat};
+export { TrendType, dateFormat, defaultDateFormat };
 
diff --git a/src/charts/Trend.js b/src/charts/Trend.js
index b7007fb..6d5badd 100644
--- a/src/charts/Trend.js
+++ b/src/charts/Trend.js
@@ -1,12 +1,8 @@
 
 import ReactEcharts from 'echarts-for-react';
-import echarts from 'echarts';
 import React from 'react';
 import { Button, DatePicker, Row } from 'antd';
-import zhCN from 'antd/es/locale/zh_CN';  // 引入中文包
-import {dateFormat, defaultDateFormat, TrendType} from './Base.js';
-import config from '../Config.js';
-import { convertLegacyProps } from 'antd/lib/button/button';
+import {defaultDateFormat, TrendType} from './Base.js';
 
 const { RangePicker } = DatePicker;
 
@@ -31,7 +27,7 @@ class Trend extends React.Component {
     };
 
     componentDidMount() {
-        console.log(this.props);
+        // console.log(this.props);
         if(this.props.datetype) {
             var now = new Date()
             this.selectDate( defaultDateFormat(now) )
@@ -46,18 +42,20 @@ class Trend extends React.Component {
         var fm ;
         if(trendtype.current === TrendType.OneDate) {
             interval = 3600 * 1000;
-            fm = function (value, index) {
+            fm = function (value) {
                 var tp = new Date(value)
                 return  tp.getHours()
             };        
         } else {
             interval = 3600 * 1000 * 24;
-            fm = function (value, index) {
+            fm = function (value) {
                 var tp = new Date(value)
                 return  (tp.getMonth() + 1) + "-" + tp.getDate()
             };
         }
 
+        var title = "趋势";
+        var title_concat = [];
         var option = {
             tooltip: {
                 trigger: 'axis',
@@ -68,7 +66,7 @@ class Trend extends React.Component {
             },
             title: {
                 left: 'center',
-                text: '趋势数据',
+                text: title,
             },
             legend: {
                 orient: 'vertical',
@@ -102,7 +100,7 @@ class Trend extends React.Component {
                 padding: [10,0,0,0],
                 boundaryGap: [0, '100%'],
                 axisLabel: {
-                    formatter: function (value, index) { 
+                    formatter: function (value) { 
                         if( typeof value == "number") {
                             if(value >= 100000000) {
                                 return (value / 100000000).toFixed(4) + "亿"
@@ -159,7 +157,6 @@ class Trend extends React.Component {
             tvalues.sort();
             if(trendtype.current === TrendType.OneDate) { 
 
-                
                 var last = new Date(tvalues[tvalues.length-1][0]);
                 last.setMinutes(0);
                 last.setSeconds(0);
@@ -178,6 +175,7 @@ class Trend extends React.Component {
 
             }
 
+            title_concat.push(d.name);
             option.legend.data.push(d.name);
             option.yAxis.name = unit;
 
@@ -194,6 +192,7 @@ class Trend extends React.Component {
             option.series.push(sdata)
         }
 
+        option.title.text = title + `(${title_concat.join(",")})`
         return option;
     }
 
@@ -222,8 +221,8 @@ class Trend extends React.Component {
     }
 
     selectRangeDate(start, end) {
+        
         if(this.props.trendurl) {
-
             var qstart, qend;
             if(this.props.query) {
                 qstart = this.props.query.start?this.props.query.start:"start";
@@ -271,7 +270,7 @@ class Trend extends React.Component {
                 notMerge={true}
                 lazyUpdate={true}
                 option={this.getOption(type, data)}
-                style={{ width: "100%", minHeight: "90vh" }}
+                style={{ width: "100%", minHeight: "90vh", marginBottom: "50px" }}
             />
    
             </ div>
diff --git a/src/pages/playerduo.js b/src/pages/playerduo.js
index 5c1f2e8..25fbca1 100644
--- a/src/pages/playerduo.js
+++ b/src/pages/playerduo.js
@@ -1,40 +1,24 @@
-import ReactEcharts from 'echarts-for-react';
-import echarts from 'echarts';
-import React from 'react';
-import { Button, Card, Col, DatePicker, Row, Statistic } from 'antd';
- 
- 
-import config from '../Config.js';
+import { Card, Col, Row, Statistic } from 'antd';
 import Layout from 'antd/lib/layout/layout';
+import React from 'react';
 import Trend from '../charts/Trend.js';
+import config from '../Config.js';
+
+
+
 
-const SimpleCard = (title, value) => {
-    return (
-        <Col span={4}>
-            <Card style={{width: 200, height: 100, scale: 0.8}}>
-                <Statistic   title={title} value={value} suffix="人"></Statistic>
-            </Card>
-        </Col>
-    )
-}
 
 // Playerduo 陪玩者
 class Playerduo extends React.Component {
     state = {
-
     }
-
     render() {
 
         return (
             <Layout>
                 <StatisticBoard></StatisticBoard>
-                <div style={{marginBottom: 100}}>
-                <Trend datetype={false} trendurl={config.count_statement}></Trend>
-                </div >
-                <div style={{marginBottom: 100}}>
-                <Trend   trendurl={config.trend_online}></Trend>
-                </div>
+                    <Trend id="player-monery" datetype={false} trendurl={config.count_statement}></Trend>
+                    <Trend trendurl={config.trend_online}></Trend>
             </Layout>
         )
     }
@@ -43,19 +27,38 @@ class Playerduo extends React.Component {
 class StatisticBoard extends React.Component {
 
     state = {
-        player_count: 0
+        player_count: 0,
+        player_status: {
+            ready: 0,
+            busy: 0,
+            stop: 0,
+            none: 0,
+        }
     }
 
     componentDidMount() {
         this.getPlayerCount();
+        this.getPlayerStatus();
     }
 
-    getPlayerCount() {
-        fetch(config.count_player).then((response)=>{
+    getPlayerStatus() {
+        fetch(config.count_playerstatus).then((response) => {
             if (response.ok) {
                 response.json().then((response) => {
                     if (response.code === 0) {
-                        this.setState({  player_count: response.data.count  })
+                        this.setState({ player_status: response.data.status })
+                    }
+                })
+            }
+        })
+    }
+
+    getPlayerCount() {
+        fetch(config.count_player).then((response) => {
+            if (response.ok) {
+                response.json().then((response) => {
+                    if (response.code === 0) {
+                        this.setState({ player_count: response.data.count })
                     }
                 })
             }
@@ -64,15 +67,31 @@ class StatisticBoard extends React.Component {
 
     render() {
         return (
-            <Layout style={{padding: 8,   width:"100%"}}>
-                <Row justify="center"  gutter={[24,16]} >
-                        {SimpleCard("陪玩者总数", this.state.player_count)}
-                        {/* {SimpleCard("陪玩", 1)} */}
+            <Layout style={{ padding: 8, width: "100%" }}>
+                <Row justify="center" gutter={[24, 16]} >
+                    {SimpleCard("陪玩者总数", this.state.player_count, "人")}
+
+                </Row>
+                <Row justify="center" gutter={[24, 16]} >
+                    {SimpleCard("陪玩者(ready)", this.state.player_status.ready, "人")}
+                    {SimpleCard("陪玩者(busy)", this.state.player_status.busy, "人")}
+                    {SimpleCard("陪玩者(stop)", this.state.player_status.stop, "人")}
+                    {SimpleCard("陪玩者(none)", this.state.player_status.none, "人")}
                 </Row>
             </Layout>
         )
     }
 }
 
+const SimpleCard = (title, value, suffix) => {
+    return (
+        <Col span={4}>
+            <Card style={{ width: 150, height: 100 }}>
+                <Statistic title={title} value={value} suffix={suffix}></Statistic>
+            </Card>
+        </Col>
+    )
+}
+
 
 export default Playerduo;
\ No newline at end of file