diff --git a/package.json b/package.json
index 1712b68..190772b 100644
--- a/package.json
+++ b/package.json
@@ -19,7 +19,7 @@
     "axios": "^0.19.0",
     "core-js": "^3.6.4",
     "crypto-js": "^4.0.0",
-    "echarts": "^5.1.1",
+    "echarts": "^5.5.1",
     "enquire.js": "^2.1.6",
     "js-cookie": "^2.2.0",
     "lodash.clonedeep": "^4.5.0",
diff --git a/src/views/admin/repair/RepairStatistics.vue b/src/views/admin/repair/RepairStatistics.vue
index ce753e8..3ec1bea 100644
--- a/src/views/admin/repair/RepairStatistics.vue
+++ b/src/views/admin/repair/RepairStatistics.vue
@@ -1,13 +1,397 @@
 <template>
+  <div class='container'>
 
+    <div class='topHeadView'>
+      <div class='itemView' v-for='item in 4'>
+        <div class='imgView'></div>
+        <div class='label'>待派单</div>
+        <div class='num'>10</div>
+      </div>
+    </div>
+
+    <div class='caseStatisticsView'>
+      <div class='headView'>
+        <div class='titleView'>工单统计</div>
+        <div class='typeView'>
+          <div class='type activity'>本周</div>
+          <div class='type'>本月</div>
+          <div class='type'>本年</div>
+        </div>
+      </div>
+
+      <div class='contentView'>
+        <div class='itemView' v-for='item in 6'>
+          <div class='label'>维修工单</div>
+          <div class='value'>100</div>
+        </div>
+      </div>
+    </div>
+
+    <div class='statusView'>
+      <div class='caseStatusView'>
+        <div class='headView'>
+          <div class='titleView'>工单完成情况</div>
+          <div class='typeView'>
+            <div class='type activity'>本周</div>
+            <div class='type'>本年</div>
+          </div>
+        </div>
+        <div class='contentView'>
+          <div class='circularView'>
+            <div id='echart1' style='width: 400px; height: 300px'></div>
+          </div>
+          <div class='centerLine'></div>
+          <div class='circularView'>
+            <div id='echart2' style='width: 400px; height: 300px'></div>
+          </div>
+        </div>
+      </div>
+      <div class='evaluateView'>
+        <div class='headView'>
+          <div class='titleView'>评价情况</div>
+        </div>
+        <div class='contentView'>
+          <div id='echart3' style='width: 400px; height: 300px'></div>
+        </div>
+      </div>
+    </div>
+
+
+    <div class='faultView'>
+      <div class='floorView'>
+        <div class='headView'>
+          <div class='titleView'>工单完成情况</div>
+          <div class='conditionView'>
+            <a-select default-value="week" style="width: 120px;margin-right: 10px">
+              <a-select-option value="week">
+                按周
+              </a-select-option>
+              <a-select-option value="month">
+                按月
+              </a-select-option>
+              <a-select-option value="year">
+                按年
+              </a-select-option>
+            </a-select>
+            <a-date-picker placeholder="请选择时间" />
+          </div>
+        </div>
+      </div>
+      <div class='rightView'>
+
+      </div>
+    </div>
+
+
+  </div>
 </template>
 
 <script>
+import * as echarts from 'echarts'
+
 export default {
-  name: 'RepairStatistics'
+  name: 'RepairStatistics',
+  mounted() {
+    this.createEchart('echart1')
+    this.createEchart('echart2')
+    this.createEchart('echart3')
+  },
+  methods: {
+    createEchart(id) {
+      // 基于准备好的dom，初始化echarts实例
+      let myChart = echarts.init(document.getElementById(id))
+      // 指定图表的配置项和数据
+      let option = {
+        tooltip: {
+          trigger: 'item'
+        },
+        legend: {
+          bottom: 10,
+          left: 'right',
+          orient: 'vertical'
+        },
+        series: [
+          {
+            name: 'Access From',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 2,
+              borderColor: '#fff',
+              borderWidth: 2
+            },
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: 40,
+                fontWeight: 'bold'
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: [
+              { value: 1048, name: 'Search ' },
+              { value: 735, name: 'Direct' },
+              { value: 580, name: 'Email' },
+              { value: 484, name: 'Union ' },
+              { value: 300, name: 'Video ' }
+            ]
+          }
+        ]
+      }
+      // 使用刚指定的配置项和数据显示图表。
+      myChart.setOption(option)
+    }
+  }
 }
 </script>
 
 <style scoped>
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  word-break: break-all;
+  line-height: 1;
+}
+
+.topHeadView {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  padding: 40px 0;
+  background: #4093f7;
+  border-radius: 10px;
+}
+
+.topHeadView .itemView {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+
+.topHeadView .itemView .imgView {
+  width: 80px;
+  height: 80px;
+  background: white;
+  border-radius: 80px;
+}
+
+.topHeadView .itemView .label {
+  margin-top: 10px;
+  color: white;
+}
+
+
+.topHeadView .itemView .num {
+  position: absolute;
+  left: calc(100% + 10px);
+  top: 50%;
+  transform: translateY(-100%);
+  width: 90px;
+  color: white;
+  font-size: 28px;
+}
+
+.caseStatisticsView {
+  margin-top: 10px;
+  padding: 0 20px;
+  border-radius: 10px;
+  background: white;
+}
+
+.caseStatisticsView .headView {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.caseStatisticsView .headView .titleView {
+  font-size: 14px;
+  color: #4093f7;
+  font-weight: bold;
+  padding: 14px 30px;
+  border-bottom: 2px solid #4093f7;
+}
+
+
+.caseStatisticsView .headView .typeView {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.caseStatisticsView .headView .typeView .type {
+  margin-right: 40px;
+  font-weight: bold;
+}
+
+.caseStatisticsView .headView .typeView .activity {
+  color: #4093f7;
+}
+
+.caseStatisticsView .contentView {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 30px 50px;
+}
+
+
+.caseStatisticsView .contentView .itemView {
+  flex: 1;
+  border: 1px solid #4093f7;
+  border-radius: 4px;
+  padding: 14px 20px;
+  margin-left: 20px;
+
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+
+.caseStatisticsView .contentView .itemView:first-of-type {
+  margin-left: 0;
+}
+
+.caseStatisticsView .contentView .itemView .label {
+  font-size: 12px;
+  font-weight: bold;
+  color: #4093f7;
+}
+
+.caseStatisticsView .contentView .itemView .value {
+  font-size: 12px;
+}
+
+.statusView {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  margin-top: 10px;
+}
+
+.statusView .caseStatusView, .statusView .evaluateView {
+  background: white;
+  border-radius: 10px;
+}
+
+
+.statusView .caseStatusView {
+  flex: 2;
+}
+
+.statusView .evaluateView {
+  flex: 1;
+  margin-left: 6px;
+}
+
+
+.statusView .caseStatusView .headView, .statusView .evaluateView .headView {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  padding: 0 20px;
+  height: 40px;
+}
+
+.statusView .caseStatusView .headView .titleView, .statusView .evaluateView .headView .titleView {
+  font-size: 14px;
+  color: gray;
+}
+
+
+.statusView .caseStatusView .headView .typeView {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+
+.statusView .caseStatusView .headView .typeView .type {
+  font-size: 12px;
+  color: #4093f7;
+  margin-left: 20px;
+  padding: 4px 8px;
+  border-radius: 4px;
+}
+
+.statusView .caseStatusView .headView .typeView .type.activity {
+  border: 1px solid #4093f7;
+}
+
+.statusView .caseStatusView .contentView {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+
+.statusView .caseStatusView .contentView .circularView {
+  flex: 1;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.statusView .caseStatusView .contentView .centerLine {
+  width: 1px;
+  height: 200px;
+  background: rgba(0, 0, 0, 0.1);
+}
+
+.statusView .evaluateView .contentView {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+
+.faultView {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  margin-top: 10px;
+}
+
+.faultView .floorView{
+  background: white;
+  border-radius: 10px;
+  width: 600px;
+}
+
+
+.faultView .floorView .headView {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  padding: 0 20px;
+  height: 40px;
+}
+
+.faultView .floorView .headView .titleView {
+  font-size: 14px;
+  color: gray;
+}
+
+
+.faultView .floorView .headView .conditionView {
+ display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
 
 </style>
\ No newline at end of file
diff --git a/vue.config.js b/vue.config.js
index e855b26..a2a63a7 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -108,7 +108,7 @@ const vueConfig = {
     port: 8000,
     proxy: {
       '/api': {
-        target: 'http://localhost:9227',
+        target: 'http://192.168.0.30:9227',
         pathRewrite: { '^/api': '' },
         ws: false,
         changeOrigin: true
diff --git a/yarn.lock b/yarn.lock
index 29f0b70..6250636 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5539,13 +5539,13 @@ ecc-jsbn@~0.1.1:
     jsbn "~0.1.0"
     safer-buffer "^2.1.0"
 
-echarts@^5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/echarts/-/echarts-5.1.1.tgz#b186f162f017c555cfd67b12ede6762bdc3ddfda"
-  integrity sha512-b3nP8M9XwZM2jISuA+fP0EuJv8lcfgWrinel185Npy8bE/UhXTDIPJcqgQOCWdvk0c5CeT6Dsm1xBjmJXAGlxQ==
+echarts@^5.5.1:
+  version "5.5.1"
+  resolved "https://registry.yarnpkg.com/echarts/-/echarts-5.5.1.tgz#8dc9c68d0c548934bedcb5f633db07ed1dd2101c"
+  integrity sha512-Fce8upazaAXUVUVsjgV6mBnGuqgO+JNDlcgF79Dksy4+wgGpQB2lmYoO4TSweFg/mZITdpGHomw/cNBJZj1icA==
   dependencies:
-    tslib "2.0.3"
-    zrender "5.1.0"
+    tslib "2.3.0"
+    zrender "5.6.0"
 
 editorconfig@^0.15.2:
   version "0.15.2"
@@ -12391,10 +12391,10 @@ tsconfig@^7.0.0:
     strip-bom "^3.0.0"
     strip-json-comments "^2.0.0"
 
-tslib@2.0.3:
-  version "2.0.3"
-  resolved "https://registry.npm.taobao.org/tslib/download/tslib-2.0.3.tgz?cache=0&sync_timestamp=1617647074515&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftslib%2Fdownload%2Ftslib-2.0.3.tgz#8e0741ac45fc0c226e58a17bfc3e64b9bc6ca61c"
-  integrity sha1-jgdBrEX8DCJuWKF7/D5kubxsphw=
+tslib@2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
+  integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==
 
 tslib@^1.10.0:
   version "1.11.1"
@@ -13456,9 +13456,9 @@ yorkie@^2.0.0:
     normalize-path "^1.0.0"
     strip-indent "^2.0.0"
 
-zrender@5.1.0:
-  version "5.1.0"
-  resolved "https://registry.npm.taobao.org/zrender/download/zrender-5.1.0.tgz?cache=0&sync_timestamp=1618215776804&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fzrender%2Fdownload%2Fzrender-5.1.0.tgz#b6a84c3aa7ccc6642ee0519901ca4c0835c4d85e"
-  integrity sha1-tqhMOqfMxmQu4FGZAcpMCDXE2F4=
+zrender@5.6.0:
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/zrender/-/zrender-5.6.0.tgz#01325b0bb38332dd5e87a8dbee7336cafc0f4a5b"
+  integrity sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==
   dependencies:
-    tslib "2.0.3"
+    tslib "2.3.0"