diff --git a/web/config/router.config.js b/web/config/router.config.js
index 52608058..4b932992 100644
--- a/web/config/router.config.js
+++ b/web/config/router.config.js
@@ -36,22 +36,13 @@ export default [
             }, {
               path: '/platform/tasks',
               name: 'tasks',
-              component: './Dashboard/Workplace',
+              component: './Dashboard/TaskMonitor',
             }, {
               path: '/platform/search',
               name: 'search',
               component: './Dashboard/SearchMonitor',
             },
-            // {
-            //     path: '/platform/analysis',
-            //     name: 'analysis',
-            //     component: './Dashboard/Analysis',
-            // },
-            // {
-            //     path: '/platform/monitor',
-            //     name: 'monitor',
-            //     component: './Dashboard/Monitor',
-            // },
+
         ]
       },
 
diff --git a/web/src/pages/Dashboard/TaskMonitor.js b/web/src/pages/Dashboard/TaskMonitor.js
index cbda8986..5ee39a22 100644
--- a/web/src/pages/Dashboard/TaskMonitor.js
+++ b/web/src/pages/Dashboard/TaskMonitor.js
@@ -1,13 +1,28 @@
 import React, { PureComponent } from 'react';
 import { connect } from 'dva';
 import { formatMessage, FormattedMessage } from 'umi/locale';
-import { Row, Col, Card, Tooltip } from 'antd';
+import { Row, Col, Card } from 'antd';
 import numeral from 'numeral';
 import { Pie, WaterWave, Gauge, TagCloud } from '@/components/Charts';
 import NumberInfo from '@/components/NumberInfo';
 import CountDown from '@/components/CountDown';
 import ActiveChart from '@/components/ActiveChart';
 import GridContent from '@/components/PageHeaderWrapper/GridContent';
+import {
+  G2,
+  Chart,
+  Geom,
+  Axis,
+  Tooltip,
+  Coord,
+  Label,
+  Legend,
+  View,
+  Guide,
+  Shape,
+  Facet,
+  Util
+} from "bizcharts";
 
 import Authorized from '@/utils/Authorized';
 import styles from './Monitor.less';
@@ -39,8 +54,208 @@ class TaskMonitor extends PureComponent {
     const { monitor, loading } = this.props;
     const { tags } = monitor;
 
+    const taskTimedDta = [
+      {
+        name: "node1-23",
+        value: 3
+      },
+      {
+        name: "node1-24",
+        value: 4
+      },
+      {
+        name: "node1-25",
+        value: 5
+      },
+      {
+        name: "node2-101",
+        value: 5.3
+      },
+      {
+        name: "node2-102",
+        value: 5.9
+      },
+      {
+        name: "node2-103",
+        value: 6
+      },
+      {
+        name: "node3-121",
+        value: 7
+      },
+      {
+        name: "node3-122",
+        value: 9
+      },
+      {
+        name: "node3-123",
+        value: 15
+      }
+    ];
+    const cols = {
+      value: {
+        min: 0,
+        alias:'Time(min)'
+      },
+      name: {
+        range: [0.05, 0.95],
+        alias:'Task'
+      }
+    };
+    const taskCategorydDta = [
+      {
+        name: "索引重建任务",
+        value: 16
+      },
+      {
+        name: "数据导入任务",
+        value: 4
+      },
+      {
+        name: "数据导出任务",
+        value: 2
+      },
+      {
+        name: "备份任务",
+        value: 10
+      },
+      {
+        name: "恢复任务",
+        value: 6
+      },
+      {
+        name: "其他",
+        value: 1
+      }
+    ];
+
     return (
-      <h1>task monitor</h1>
+        <GridContent>
+          <Row gutter={24}>
+            <Col xl={12} lg={24} sm={24} xs={24}>
+              <Card
+                  title="集群健康检查任务"
+                  bordered={false}
+                  className={styles.pieCard}
+              >
+                <Row style={{ padding: '16px 0' }}>
+                  <Col span={8}>
+                    <Pie
+                        animate={false}
+                        color="#FFFF00"
+                        percent={50}
+                        subTitle="存活状态"
+                        total="50%"
+                        height={128}
+                        lineWidth={2}
+                    />
+                  </Col>
+                  <Col span={8}>
+                    <Pie
+                        animate={false}
+                        color="#2FC25B"
+                        percent={100}
+                        subTitle="可读状态"
+                        total="100%"
+                        height={128}
+                        lineWidth={2}
+                    />
+                  </Col>
+                  <Col span={8}>
+                    <Pie
+                        animate={false}
+                        color="#FF0000"
+                        percent={50}
+                        subTitle="可写状态"
+                        total="50%"
+                        height={128}
+                        lineWidth={2}
+                    />
+                  </Col>
+                </Row>
+              </Card>
+            </Col>
+            <Col xl={12} lg={24} sm={24} xs={24}>
+              <Card
+                  title="数据重建任务"
+                  bodyStyle={{ textAlign: 'center', fontSize: 0 }}
+                  bordered={false}
+              >
+                <Row style={{ padding: '16px 0' }}>
+                  <Col span={8}>
+                    <WaterWave
+                        height={128}
+                        title="数据重建任务"
+                        percent={90}
+                    />
+                  </Col>
+                  <Col span={8}>
+                    <WaterWave
+                        height={128}
+                        title="备份任务"
+                        percent={50}
+                        color="#FFA500"
+                    />
+                  </Col>
+                  <Col span={8}>
+                    <WaterWave
+                        height={128}
+                        title="恢复任务"
+                        percent={28}
+                        color="#FFE4B5"
+                    />
+                  </Col>
+                </Row>
+              </Card>
+            </Col>
+          </Row>
+          <Row gutter={24}>
+            <Col xl={12} lg={24} sm={24} xs={24}>
+              <Card
+                  title="任务执行时间统计"
+                  bordered={false}
+                  style={{ marginTop: 24 }}
+              >
+                <Chart height={300} data={taskTimedDta} scale={cols} forceFit>
+                  <Axis name="name"  title/>
+                  <Axis name="value" title/>
+                  <Tooltip
+                      // crosshairs用于设置 tooltip 的辅助线或者辅助框
+                      // crosshairs={{
+                      //  type: "y"
+                      // }}
+                  />
+                  <Geom type="interval" position="name*value" />
+                </Chart>
+              </Card>
+            </Col>
+            <Col xl={12} lg={24} sm={24} xs={24}>
+              <Card
+                  title="任务分类统计"
+                  bodyStyle={{ textAlign: 'center', fontSize: 0 }}
+                  bordered={false}
+                  style={{ marginTop: 24 }}
+              >
+                <Chart
+                    height={300}
+                    data={taskCategorydDta}
+                    forceFit
+                >
+                  <Coord type="theta"/>
+                  <Tooltip showTitle={false} />
+                  <Geom
+                      type="intervalStack"
+                      position="value"
+                      color="name"
+                  >
+                    <Label content="value" />
+                  </Geom>
+                  <Legend/>
+                </Chart>
+              </Card>
+            </Col>
+          </Row>
+        </GridContent>
     );
   }
 }