diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/caseStatistic/components/caseTable.vue b/src/views/statistic/caseStatistic/components/caseTable.vue
new file mode 100644
index 0000000..1955c4c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTable.vue
@@ -0,0 +1,141 @@
+<template>
+  <div>
+    <div class="table-title">
+      事件综合分析
+    </div>
+    <normal-table
+      :data="data"
+      :head="tableOption.head"
+      :size="size"
+      :query="listQuery"
+      :need-page="false"
+      :total="total"
+      :columns="columns"
+      :list-loading="listLoading"
+      :options="tableOption.options"
+      :tools-option="tableOption.toolsOption"
+      @change="changePage"/>
+  </div>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+export default {
+  name: 'CaseTable',
+  components: { NormalTable },
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      columns: [
+        {
+          text: '话务量',
+          value: 'callNum'
+        },
+        {
+          text: '受理事件数',
+          value: 'caseNum'
+        },
+        {
+          text: '催办数',
+          value: 'urgeNum'
+        },
+        {
+          text: '督办数',
+          value: 'superviseNum'
+        },
+        {
+          text: '监察数',
+          value: 'monitorNum'
+        },
+        {
+          text: '延期数',
+          value: 'delayNum'
+        },
+        {
+          text: '已办结数及占比',
+          value: 'overCaseNum'
+        },
+        {
+          text: '未办结数及占比',
+          value: 'noOverCaseNum'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'callNum': 1,
+        'caseNum': 2,
+        'urgeNum': 3,
+        'superviseNum': 4,
+        'monitorNum': 5,
+        'delayNum': 6,
+        'overCaseNum': '0/0%',
+        'noOverCaseNum': '0/0%'
+      }]
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.table-title{
+  text-align: center;
+  line-height: 2;
+  font-size:18px;
+  font-weight: 700;
+  background-color: #f0f0f0;
+
+}
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/caseStatistic/components/caseTable.vue b/src/views/statistic/caseStatistic/components/caseTable.vue
new file mode 100644
index 0000000..1955c4c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTable.vue
@@ -0,0 +1,141 @@
+<template>
+  <div>
+    <div class="table-title">
+      事件综合分析
+    </div>
+    <normal-table
+      :data="data"
+      :head="tableOption.head"
+      :size="size"
+      :query="listQuery"
+      :need-page="false"
+      :total="total"
+      :columns="columns"
+      :list-loading="listLoading"
+      :options="tableOption.options"
+      :tools-option="tableOption.toolsOption"
+      @change="changePage"/>
+  </div>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+export default {
+  name: 'CaseTable',
+  components: { NormalTable },
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      columns: [
+        {
+          text: '话务量',
+          value: 'callNum'
+        },
+        {
+          text: '受理事件数',
+          value: 'caseNum'
+        },
+        {
+          text: '催办数',
+          value: 'urgeNum'
+        },
+        {
+          text: '督办数',
+          value: 'superviseNum'
+        },
+        {
+          text: '监察数',
+          value: 'monitorNum'
+        },
+        {
+          text: '延期数',
+          value: 'delayNum'
+        },
+        {
+          text: '已办结数及占比',
+          value: 'overCaseNum'
+        },
+        {
+          text: '未办结数及占比',
+          value: 'noOverCaseNum'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'callNum': 1,
+        'caseNum': 2,
+        'urgeNum': 3,
+        'superviseNum': 4,
+        'monitorNum': 5,
+        'delayNum': 6,
+        'overCaseNum': '0/0%',
+        'noOverCaseNum': '0/0%'
+      }]
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.table-title{
+  text-align: center;
+  line-height: 2;
+  font-size:18px;
+  font-weight: 700;
+  background-color: #f0f0f0;
+
+}
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseTypeSearch.vue b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
new file mode 100644
index 0000000..419b443
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
@@ -0,0 +1,106 @@
+<!--事件类型统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+      <search-item>
+        <span class="level-txt">事件等级：</span>
+        <el-radio-group v-model="listQuery.level" :size="size" class="level-radio">
+          <el-radio :label="1">一级</el-radio>
+          <el-radio :label="2">二级</el-radio>
+          <el-radio :label="3">三级</el-radio>
+        </el-radio-group>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseTypeSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        level: '1',
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/caseStatistic/components/caseTable.vue b/src/views/statistic/caseStatistic/components/caseTable.vue
new file mode 100644
index 0000000..1955c4c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTable.vue
@@ -0,0 +1,141 @@
+<template>
+  <div>
+    <div class="table-title">
+      事件综合分析
+    </div>
+    <normal-table
+      :data="data"
+      :head="tableOption.head"
+      :size="size"
+      :query="listQuery"
+      :need-page="false"
+      :total="total"
+      :columns="columns"
+      :list-loading="listLoading"
+      :options="tableOption.options"
+      :tools-option="tableOption.toolsOption"
+      @change="changePage"/>
+  </div>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+export default {
+  name: 'CaseTable',
+  components: { NormalTable },
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      columns: [
+        {
+          text: '话务量',
+          value: 'callNum'
+        },
+        {
+          text: '受理事件数',
+          value: 'caseNum'
+        },
+        {
+          text: '催办数',
+          value: 'urgeNum'
+        },
+        {
+          text: '督办数',
+          value: 'superviseNum'
+        },
+        {
+          text: '监察数',
+          value: 'monitorNum'
+        },
+        {
+          text: '延期数',
+          value: 'delayNum'
+        },
+        {
+          text: '已办结数及占比',
+          value: 'overCaseNum'
+        },
+        {
+          text: '未办结数及占比',
+          value: 'noOverCaseNum'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'callNum': 1,
+        'caseNum': 2,
+        'urgeNum': 3,
+        'superviseNum': 4,
+        'monitorNum': 5,
+        'delayNum': 6,
+        'overCaseNum': '0/0%',
+        'noOverCaseNum': '0/0%'
+      }]
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.table-title{
+  text-align: center;
+  line-height: 2;
+  font-size:18px;
+  font-weight: 700;
+  background-color: #f0f0f0;
+
+}
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseTypeSearch.vue b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
new file mode 100644
index 0000000..419b443
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
@@ -0,0 +1,106 @@
+<!--事件类型统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+      <search-item>
+        <span class="level-txt">事件等级：</span>
+        <el-radio-group v-model="listQuery.level" :size="size" class="level-radio">
+          <el-radio :label="1">一级</el-radio>
+          <el-radio :label="2">二级</el-radio>
+          <el-radio :label="3">三级</el-radio>
+        </el-radio-group>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseTypeSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        level: '1',
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/satisfiedPie.vue b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..10fbcb3
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: '事件回访满意程度统计'
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/caseStatistic/components/caseTable.vue b/src/views/statistic/caseStatistic/components/caseTable.vue
new file mode 100644
index 0000000..1955c4c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTable.vue
@@ -0,0 +1,141 @@
+<template>
+  <div>
+    <div class="table-title">
+      事件综合分析
+    </div>
+    <normal-table
+      :data="data"
+      :head="tableOption.head"
+      :size="size"
+      :query="listQuery"
+      :need-page="false"
+      :total="total"
+      :columns="columns"
+      :list-loading="listLoading"
+      :options="tableOption.options"
+      :tools-option="tableOption.toolsOption"
+      @change="changePage"/>
+  </div>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+export default {
+  name: 'CaseTable',
+  components: { NormalTable },
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      columns: [
+        {
+          text: '话务量',
+          value: 'callNum'
+        },
+        {
+          text: '受理事件数',
+          value: 'caseNum'
+        },
+        {
+          text: '催办数',
+          value: 'urgeNum'
+        },
+        {
+          text: '督办数',
+          value: 'superviseNum'
+        },
+        {
+          text: '监察数',
+          value: 'monitorNum'
+        },
+        {
+          text: '延期数',
+          value: 'delayNum'
+        },
+        {
+          text: '已办结数及占比',
+          value: 'overCaseNum'
+        },
+        {
+          text: '未办结数及占比',
+          value: 'noOverCaseNum'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'callNum': 1,
+        'caseNum': 2,
+        'urgeNum': 3,
+        'superviseNum': 4,
+        'monitorNum': 5,
+        'delayNum': 6,
+        'overCaseNum': '0/0%',
+        'noOverCaseNum': '0/0%'
+      }]
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.table-title{
+  text-align: center;
+  line-height: 2;
+  font-size:18px;
+  font-weight: 700;
+  background-color: #f0f0f0;
+
+}
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseTypeSearch.vue b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
new file mode 100644
index 0000000..419b443
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
@@ -0,0 +1,106 @@
+<!--事件类型统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+      <search-item>
+        <span class="level-txt">事件等级：</span>
+        <el-radio-group v-model="listQuery.level" :size="size" class="level-radio">
+          <el-radio :label="1">一级</el-radio>
+          <el-radio :label="2">二级</el-radio>
+          <el-radio :label="3">三级</el-radio>
+        </el-radio-group>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseTypeSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        level: '1',
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/satisfiedPie.vue b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..10fbcb3
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: '事件回访满意程度统计'
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/components/caseSearch.vue b/src/views/statistic/components/caseSearch.vue
deleted file mode 100644
index ea436e8..0000000
--- a/src/views/statistic/components/caseSearch.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template>
-  <div/>
-</template>
-
-<script>
-export default {
-  name: 'CaseSearch'
-}
-</script>
-
-<style scoped>
-
-</style>

diff --git a/src/router/modules/statistic.js b/src/router/modules/statistic.js
index 62bed4c..75fa739 100644
--- a/src/router/modules/statistic.js
+++ b/src/router/modules/statistic.js
@@ -25,5 +25,68 @@
       meta: { title: '实时监控', icon: '', permission: '/monitor/reatime' }
     }
   ]
+},
+{
+  path: 'statistics',
+  component: Layout,
+  redirect: '/statistics',
+  name: 'Statistics',
+  alwaysShow: true,
+  meta: {
+    title: '事件统计',
+    icon: 'icon-config', // 图标
+    permission: '/statistics'
+  },
+  children: [
+    {
+      path: '/caseStatisticsType',
+      name: 'CaseStatisticsType',
+      component: () => import('@/views/statistic/caseStatistic/caseTypeStatistic'),
+      meta: { title: '事件类型统计', icon: '', permission: '/caseStatistics/type' }
+    },
+    {
+      path: '/caseStatisticsAll',
+      name: 'CaseStatisticsAll',
+      component: () => import('@/views/statistic/caseStatistic/caseAllStatistic'),
+      meta: { title: '事件综合统计', icon: '', permission: '/caseStatistics/all' }
+    },
+    {
+      path: '/caseStatisticsYear',
+      name: 'CaseStatisticsYear',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticYear'),
+      meta: { title: '事件年统计', icon: '', permission: '/caseStatistics/year' }
+    },
+    {
+      path: '/caseStatisticsMonth',
+      name: 'CaseStatisticsMonth',
+      component: () => import('@/views/statistic/caseStatistic/caseStatisticMonth'),
+      meta: { title: '事件月统计', icon: '', permission: '/caseStatistics/month' }
+    }
+  ]
+}, {
+  path: '/callStatistics',
+  component: Layout,
+  redirect: '/logStatistics',
+  name: 'CallStatistics',
+  alwaysShow: true,
+  meta: {
+    title: '话务统计',
+    icon: 'icon-config', // 图标
+    permission: '/callStatistic'
+  },
+  children: [
+    {
+      path: '/logStatistics',
+      name: 'LogStatistics',
+      component: () => import('@/views/statistic/callStatistic/logStatistic'),
+      meta: { title: '签出置忙时间统计', icon: '', permission: '/logstatistic' }
+    },
+    {
+      path: '/callStatisticsAll',
+      name: 'CallStatisticsAll',
+      component: () => import('@/views/statistic/callStatistic/allStatistic'),
+      meta: { title: '话务综合统计', icon: '', permission: '/allCallStatistic' }
+    }
+  ]
 }
 ]
diff --git a/src/views/statistic/callStatistic/allStatistic.vue b/src/views/statistic/callStatistic/allStatistic.vue
new file mode 100644
index 0000000..2a0e51b
--- /dev/null
+++ b/src/views/statistic/callStatistic/allStatistic.vue
@@ -0,0 +1,34 @@
+<template>
+  <app-container>
+    <call-statics/>
+    <el-row>
+      <el-col :span="12">
+        <border-frame title="满意度统计">
+          <satisfied-pie/>
+        </border-frame>
+      </el-col>
+      <el-col :span="12">
+        <border-frame title="接通率统计">
+          <call-rate-pie/>
+        </border-frame>
+      </el-col>
+    </el-row>
+  </app-container>
+</template>
+
+<script>
+import CallStatics from '../../monitor/realtimeMonitor/components/callStatics'
+import AppContainer from '../../../components/layout/AppContainer'
+import SatisfiedPie from './components/satisfiedPie'
+import BorderFrame from '../../../components/frame/borderFrame'
+import CallRatePie from './components/callRatePie'
+export default {
+  name: 'AllStatistic',
+  components: { CallRatePie, BorderFrame, SatisfiedPie, AppContainer, CallStatics }
+}
+</script>
+
+<style scoped>
+
+
+</style>
diff --git a/src/views/statistic/callStatistic/components/callRatePie.vue b/src/views/statistic/callStatistic/components/callRatePie.vue
new file mode 100644
index 0000000..338add6
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/callRatePie.vue
@@ -0,0 +1,56 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'CallRatePie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '接通情况',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '10秒接通量', 'num': 0 },
+      { 'type': '20秒接通量', 'num': 0 },
+      { 'type': '30秒接通量', 'num': 0 },
+      { 'type': '30秒以上接通量', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/components/satisfiedPie.vue b/src/views/statistic/callStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..9e67eba
--- /dev/null
+++ b/src/views/statistic/callStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: ''
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/callStatistic/logStatistic.vue b/src/views/statistic/callStatistic/logStatistic.vue
new file mode 100644
index 0000000..1dd6f82
--- /dev/null
+++ b/src/views/statistic/callStatistic/logStatistic.vue
@@ -0,0 +1,193 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="timeRange"
+            :size="size"
+            type="daterange"
+            range-separator="至"
+            value-format="yyyy-MM-dd"
+            start-placeholder="查询开始日期"
+            end-placeholder="查询结束时间"/>
+        </search-item>
+        <search-item>
+          <el-select v-model="listQuery.sex" :size="size" placeholder="坐席" clearable>
+            <el-option v-for="item in userList" :label="item.name" :value="item.id"/>
+          </el-select>
+        </search-item>
+        <search-item>
+          <span class="level-txt">工作时间：</span>
+          <el-time-picker
+            v-model="workTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+        <search-item>
+          <span class="level-txt">休息时间：</span>
+          <el-time-picker
+            v-model="breakTime"
+            :size="size"
+            is-range
+            range-separator="至"
+            value-format="HH:mm"
+            format="HH:mm"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"/>
+        </search-item>
+      </search-area>
+      <normal-table
+        :data="data"
+        :head="tableOption.head"
+        :size="size"
+        :query="listQuery"
+        :need-page="false"
+        :total="total"
+        :columns="columns"
+        :list-loading="listLoading"
+        :options="tableOption.options"
+        :tools-option="tableOption.toolsOption"
+        @change="changePage"/>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+import { getUserSimpleList } from '@/api/system/user'
+
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      timeRange: [], // 查询日期范围
+      workTime: ['08:30', '17:30'], // 工作时间范围
+      breakTime: ['12:00', '14:00'], // 休息时间范围
+      columns: [
+        {
+          text: '日期',
+          value: 'date'
+        },
+        {
+          text: '签出时间段记录',
+          value: 'outRecords'
+        },
+        {
+          text: '置忙时间段记录',
+          value: 'busyRecords'
+        },
+        {
+          text: '总签出时长（分钟）',
+          value: 'outTime'
+        },
+        {
+          text: '总置忙时长（分钟）',
+          value: 'busyTime'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      userList: [] // 用户列表
+    }
+  },
+  created() {
+    this.fetchUserList()
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' },
+        { 'date': '2020-04-24', 'outRecords': '07:00-07:05;07:10-07:15;', 'busyRecords': '07:00-07:05;07:10-07:15;', 'outTime': '124', 'busyTime': '15' }
+      ]
+      this.listLoading = false
+    },
+    // 获取坐席列表
+    fetchUserList() {
+      const params = {
+        roleTips: 'receiver,monitor'
+      }
+      getUserSimpleList(params).then(response => {
+        if (response.code === 200) {
+          this.userList = response.data
+        }
+      })
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+  .level-txt{
+    margin-left:20px;
+    color: #909399;
+    font-size:15px;
+    line-height: 32px
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseAllStatistic.vue b/src/views/statistic/caseStatistic/caseAllStatistic.vue
new file mode 100644
index 0000000..d27160d
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseAllStatistic.vue
@@ -0,0 +1,46 @@
+<!--事件综合统计-->
+<template>
+  <app-container>
+    <case-handle-search :size="size" @search="search"/>
+    <case-table ref="table" :list-query="listQuery"/>
+    <el-row>
+      <el-col :span="12">
+        <case-source ref="source" :list-query="listQuery"/>
+      </el-col>
+      <el-col :span="12">
+        <satisfied-pie ref="satisfied" :list-query="listQuery"/>
+      </el-col>
+    </el-row>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import CaseHandleSearch from './components/caseHandleSearch'
+import CaseTable from './components/caseTable'
+import CaseSource from './components/caseSource'
+import SatisfiedPie from './components/satisfiedPie'
+export default {
+  name: 'CaseStatistic',
+  components: { SatisfiedPie, CaseSource, CaseTable, CaseHandleSearch, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {}
+    }
+  },
+  created() {
+  },
+  methods: {
+    search(listQuery) {
+      this.listQuery = listQuery
+      this.$refs.table.search()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticMonth.vue b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
new file mode 100644
index 0000000..8341559
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticMonth.vue
@@ -0,0 +1,197 @@
+<!--事件月统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticMonth',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '月份',
+          value: 'month'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '环比',
+          value: 'monthErlier'
+        },
+        {
+          text: '同比',
+          value: 'yearErlier'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理月统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'month': '月份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['month'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['month', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 5,
+        'month': '2020-01',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-02',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 15,
+        'month': '2020-03',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }, {
+        'caseNum': 10,
+        'month': '2020-04',
+        'monthErlier': '0%',
+        'yearErlier': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail() {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseStatisticYear.vue b/src/views/statistic/caseStatistic/caseStatisticYear.vue
new file mode 100644
index 0000000..644c87c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseStatisticYear.vue
@@ -0,0 +1,177 @@
+<!--事件年统计-->
+<template>
+  <app-container>
+    <div>
+      <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+        <!--一般查询条件-->
+        <search-item>
+          <el-date-picker
+            v-model="listQuery.year"
+            :size="size"
+            type="year"
+            value-format="yyyy"
+            placeholder="统计年份"/>
+        </search-item>
+      </search-area>
+      <el-row>
+        <el-col :span="12">
+          <ve-histogram :data="chartData" :grid="grid" :extend="extend" :title="title" :settings="chartSettings"/>
+        </el-col>
+        <el-col :span="12">
+          <normal-table
+            :data="data"
+            :head="tableOption.head"
+            :size="size"
+            :query="listQuery"
+            :need-page="false"
+            :total="total"
+            :columns="columns"
+            :list-loading="listLoading"
+            :options="tableOption.options"
+            :tools-option="tableOption.toolsOption"
+            @change="changePage">
+            <template slot="columns">
+              <el-table-column label="操作" align="center" width="100">
+                <template slot-scope="scope">
+                  <el-button type="text" size="small" @click="showDetail">查看详情</el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </div>
+  </app-container>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+import SearchArea from '../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../components/SearchArea/SearchItem'
+import AppContainer from '../../../components/layout/AppContainer'
+export default {
+  name: 'CaseStatisticYear',
+  components: { AppContainer, SearchItem, SearchArea, NormalTable },
+  data() {
+    return {
+      listQuery: {
+        year: ''
+      },
+      columns: [
+        {
+          text: '年份',
+          value: 'year'
+        },
+        {
+          text: '受理事件总数',
+          value: 'caseNum'
+        },
+        {
+          text: '增长率',
+          value: 'rate'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small',
+      extend: {
+        series: {
+          label: { show: true, position: 'top' },
+          barMaxWidth: 35 // 最大柱宽度
+        },
+        yAxis: {
+          max: 10 // y轴最大值
+        }
+      },
+      grid: { right: 60 },
+      title: { text: '事件受理年统计图' },
+      chartSettings: {
+        itemStyle: {
+          'barCategoryGap': 5
+        },
+        barWidth: 15,
+        labelMap: {
+          'year': '年份',
+          'caseNum': '受理事件数'
+        },
+        dimension: ['year'],
+        metrics: ['caseNum']
+      },
+      chartData: {
+        columns: ['year', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'caseNum': 1,
+        'year': '2020',
+        'rate': '0%'
+      }]
+      this.chartData.rows = this.data
+      const maxValue = Math.max.apply(Math, this.data.map(function(item) { return item.caseNum }))
+      if (maxValue < 10) {
+        this.extend.yAxis = { max: 10 }
+      } else {
+        this.extend.yAxis = {}
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    },
+    showDetail(){
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .table-title{
+    text-align: center;
+    line-height: 2;
+    font-size:18px;
+    font-weight: 700;
+    background-color: #f0f0f0;
+
+  }
+</style>
diff --git a/src/views/statistic/caseStatistic/caseTypeStatistic.vue b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
new file mode 100644
index 0000000..02f050e
--- /dev/null
+++ b/src/views/statistic/caseStatistic/caseTypeStatistic.vue
@@ -0,0 +1,118 @@
+<!--事件类型统计-->
+<template>
+  <app-container>
+    <case-type-search :size="size" @search="search"/>
+    <normal-table :data="data" :head="tableOption.head" :size="size" :query="listQuery" :need-page="false" :total="total" :columns="columns" :list-loading="listLoading" :options="tableOption.options" :tools-option="tableOption.toolsOption" @change="changePage"/>
+  </app-container>
+
+</template>
+
+<script>
+import AppContainer from '../../../components/layout/AppContainer'
+import CaseTypeSearch from './components/caseTypeSearch'
+import NormalTable from '../../../components/NomalTable/index'
+export default {
+  name: 'CaseStatistic',
+  components: { NormalTable, CaseTypeSearch, AppContainer },
+  data() {
+    return {
+      listQuery: {},
+      columns: [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ], // 显示列
+      timeRange: [], // 时间范围
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      showAddCase: false,
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData(false)
+    },
+    fetchData(isNowPage = true) {
+      this.listLoading = true
+      if (!isNowPage) { // 是否显示当前页，否则跳转第一页
+        this.listQuery.offset = 1
+      }
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      const data = [
+        { area: '潭口镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '谭东镇', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '高校园区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] },
+        { area: '新区管理处', data: [{ caseNum: 12, eorc: '咨询' }, { caseNum: 12, eorc: '建议' }, { caseNum: 12, eorc: '求助' }, { caseNum: 12, eorc: '投诉' }, { caseNum: 12, eorc: '感谢' }, { caseNum: 12, eorc: '其他' }] }
+      ]
+      this.columns = [
+        {
+          text: '区域',
+          value: 'area'
+        }
+      ]
+      // 先动态构建出列
+      if (data.length > 0) {
+        const line = data[0]
+        if (line.data.length > 0) {
+          for (const item of line.data) {
+            const column = { text: item.eorc, value: item.eorc }
+            this.columns.push(column)
+          }
+        }
+      }
+      // 处理数据格式
+      this.data = []
+      for (const line of data) {
+        const linedata = line.data
+        const newline = { area: line.area }
+        for (const item of linedata) {
+          newline[item.eorc] = item.caseNum
+        }
+        this.data.push(newline)
+      }
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseHandleSearch.vue b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
new file mode 100644
index 0000000..d93b8ca
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseHandleSearch.vue
@@ -0,0 +1,97 @@
+<!--事件处理统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseHandleSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseSource.vue b/src/views/statistic/caseStatistic/components/caseSource.vue
new file mode 100644
index 0000000..f5f1bbe
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseSource.vue
@@ -0,0 +1,72 @@
+<!--事件来源统计-->
+<template>
+  <ve-bar :data="chartData" :grid="grid" :title="title" :extend="extend" :settings="chartSettings"/>
+</template>
+
+<script>
+// 引入视觉映射组件
+import 'echarts/lib/component/visualMap'
+// import { deviceStaticsByType } from '@/api/dataStatics'
+
+export default {
+  name: 'CaseSource',
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'right' }
+      }
+    }
+    this.grid = {
+      right: 60
+    }
+    this.title = {
+      text: '事件来源统计'
+    }
+    this.chartSettings = {
+      itemStyle: {
+        'barCategoryGap': 5
+      },
+      barWidth: 15,
+      labelMap: {
+        'source': '事件来源',
+        'caseNum': '事件数量'
+      },
+      dimension: ['source'],
+      metrics: ['caseNum']
+    }
+    return {
+      chartData: {
+        columns: ['source', 'caseNum'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    // TODO:待调试真接口
+    // this.fetchData()
+    this.chartData.rows = [
+      { 'source': '热线电话', 'caseNum': 1393, '下单用户': 1093, '下单率': 0.32 },
+      { 'source': '微信', 'caseNum': 3530, '下单用户': 3230, '下单率': 0.26 },
+      { 'source': '微博', 'caseNum': 2923, '下单用户': 2623, '下单率': 0.76 },
+      { 'source': '邮箱', 'caseNum': 1723, '下单用户': 1423, '下单率': 0.49 },
+      { 'source': '短信', 'caseNum': 3792, '下单用户': 3492, '下单率': 0.323 },
+      { 'source': '其他平台', 'caseNum': 2, '下单用户': 4293, '下单率': 0.78 }
+    ]
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticsByType().then(response => {
+      //   this.chartData.rows = response.data
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/caseStatistic/components/caseTable.vue b/src/views/statistic/caseStatistic/components/caseTable.vue
new file mode 100644
index 0000000..1955c4c
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTable.vue
@@ -0,0 +1,141 @@
+<template>
+  <div>
+    <div class="table-title">
+      事件综合分析
+    </div>
+    <normal-table
+      :data="data"
+      :head="tableOption.head"
+      :size="size"
+      :query="listQuery"
+      :need-page="false"
+      :total="total"
+      :columns="columns"
+      :list-loading="listLoading"
+      :options="tableOption.options"
+      :tools-option="tableOption.toolsOption"
+      @change="changePage"/>
+  </div>
+</template>
+
+<script>
+import NormalTable from '@/components/NomalTable/index'
+export default {
+  name: 'CaseTable',
+  components: { NormalTable },
+  props: {
+    listQuery: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      columns: [
+        {
+          text: '话务量',
+          value: 'callNum'
+        },
+        {
+          text: '受理事件数',
+          value: 'caseNum'
+        },
+        {
+          text: '催办数',
+          value: 'urgeNum'
+        },
+        {
+          text: '督办数',
+          value: 'superviseNum'
+        },
+        {
+          text: '监察数',
+          value: 'monitorNum'
+        },
+        {
+          text: '延期数',
+          value: 'delayNum'
+        },
+        {
+          text: '已办结数及占比',
+          value: 'overCaseNum'
+        },
+        {
+          text: '未办结数及占比',
+          value: 'noOverCaseNum'
+        }
+      ], // 显示列
+      data: [], // 列表数据
+      total: 0, // 数据总数
+      listLoading: true, // 列表加载动画
+      tableOption: {
+        head: {
+          show: false, // 是否需要标题栏，
+          text: '数据列表' // 标题名称
+        },
+        options: {
+          needIndex: false // 是否需要序号列
+        },
+        toolsOption: {
+          selectColumns: false, // 是否需要筛选列
+          refresh: false // 是否需要刷新按钮
+        }
+      }, // 表格属性
+      size: 'small'
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    search() {
+      this.fetchData()
+    },
+    fetchData() {
+      this.listLoading = true
+      // getSoundList(this.listQuery).then(response => {
+      //   if (response.code === 200) {
+      //     this.listLoading = false
+      //     this.list = response.data.rows
+      //     this.total = response.data.total
+      //   }
+      // })
+      // const that = this
+      this.data = [{
+        'callNum': 1,
+        'caseNum': 2,
+        'urgeNum': 3,
+        'superviseNum': 4,
+        'monitorNum': 5,
+        'delayNum': 6,
+        'overCaseNum': '0/0%',
+        'noOverCaseNum': '0/0%'
+      }]
+      this.listLoading = false
+    },
+    // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+    changePage(val) {
+      if (val && val.size) {
+        this.listQuery.limit = val.size
+      }
+      if (val && val.page) {
+        this.listQuery.offset = val.page
+      }
+      this.fetchData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.table-title{
+  text-align: center;
+  line-height: 2;
+  font-size:18px;
+  font-weight: 700;
+  background-color: #f0f0f0;
+
+}
+</style>
diff --git a/src/views/statistic/caseStatistic/components/caseTypeSearch.vue b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
new file mode 100644
index 0000000..419b443
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/caseTypeSearch.vue
@@ -0,0 +1,106 @@
+<!--事件类型统计查询框-->
+<template>
+  <div>
+    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
+      <chart-tools v-model="timeRange"/>
+      <!--一般查询条件-->
+      <search-item>
+        <el-date-picker
+          v-model="timeRange"
+          :size="size"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="处理开始时间"
+          end-placeholder="处理结束时间"/>
+      </search-item>
+      <search-item>
+        <span class="level-txt">事件等级：</span>
+        <el-radio-group v-model="listQuery.level" :size="size" class="level-radio">
+          <el-radio :label="1">一级</el-radio>
+          <el-radio :label="2">二级</el-radio>
+          <el-radio :label="3">三级</el-radio>
+        </el-radio-group>
+      </search-item>
+    </search-area>
+  </div>
+</template>
+
+<script>
+import SearchArea from '../../../../components/SearchArea/SearchArea'
+import SearchItem from '../../../../components/SearchArea/SearchItem'
+import { getDayTime } from '@/utils/dateutils'
+import ChartTools from '../../components/chartTools'
+export default {
+  name: 'CaseTypeSearch',
+  components: { ChartTools, SearchItem, SearchArea },
+  props: {
+    size: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      listQuery: {
+        level: '1',
+        startTime: '',
+        endTime: ''
+      },
+      timeRange: []
+    }
+  },
+  watch: {
+    timeRange(val) {
+      if (this.timeRange && this.timeRange.length === 2) {
+        this.listQuery.startTime = this.timeRange[0]
+        this.listQuery.endTime = this.timeRange[1]
+      }
+    }
+  },
+  methods: {
+    search() {
+      this.$emit('search', this.listQuery)
+    },
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.listQuery.compare = false
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.level-txt{
+  margin-left:20px;
+  color: #909399;
+  font-size:15px;
+  line-height: 32px
+}
+.level-radio{
+  margin-right: 20px;
+  color: #909399;
+  line-height: 32px;
+}
+.level-radio label{
+  vertical-align: middle;
+}
+
+</style>
diff --git a/src/views/statistic/caseStatistic/components/satisfiedPie.vue b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
new file mode 100644
index 0000000..10fbcb3
--- /dev/null
+++ b/src/views/statistic/caseStatistic/components/satisfiedPie.vue
@@ -0,0 +1,57 @@
+<!--事件回访满意度统计-->
+<template>
+  <ve-pie :data="chartData" :extend="extend" :title="title"/>
+</template>
+
+<script>
+// import { deviceStaticByStatus } from '@/api/dataStatics'
+
+export default {
+  name: 'SatisfiedPie',
+  data() {
+    this.extend = {
+      series: {
+        label: { show: true, position: 'outside', formatter: '{b}:{c}' }
+      }
+    }
+    this.chartSettings = {
+      labelMap: {
+        'type': '满意度',
+        'num': '0'
+      },
+      dimension: 'type',
+      metrics: 'num'
+    }
+    this.title = {
+      text: '事件回访满意程度统计'
+    }
+    return {
+      chartData: {
+        columns: ['type', 'num'],
+        rows: []
+      }
+    }
+  },
+  mounted() {
+    this.chartData.rows = [
+      { 'type': '非常满意', 'num': 0 },
+      { 'type': '满意', 'num': 0 },
+      { 'type': '一般', 'num': 0 },
+      { 'type': '不满意', 'num': 0 },
+      { 'type': '未评价', 'num': 0 }
+    ]
+    // this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      // deviceStaticByStatus().then(response => {
+      //   const data = response.data
+      //   this.chartData.rows = [
+      //     { 'type': '在线', 'num': data.online },
+      //     { 'type': '离线', 'num': data.offline }
+      //   ]
+      // })
+    }
+  }
+}
+</script>
diff --git a/src/views/statistic/components/caseSearch.vue b/src/views/statistic/components/caseSearch.vue
deleted file mode 100644
index ea436e8..0000000
--- a/src/views/statistic/components/caseSearch.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template>
-  <div/>
-</template>
-
-<script>
-export default {
-  name: 'CaseSearch'
-}
-</script>
-
-<style scoped>
-
-</style>
diff --git a/src/views/statistic/components/chartTools.vue b/src/views/statistic/components/chartTools.vue
new file mode 100644
index 0000000..8e3ed3b
--- /dev/null
+++ b/src/views/statistic/components/chartTools.vue
@@ -0,0 +1,78 @@
+<template>
+  <div class="chart-tools">
+    <span class="chart-tool-button" @click="changeDate('today')">今日</span>
+    <span class="chart-tool-button" @click="changeDate('week')">最近7天</span>
+    <span class="chart-tool-button" @click="changeDate('month')">最近30天</span>
+    <span class="chart-tool-button" @click="changeDate('season')">最近一季</span>
+    <span class="chart-tool-button" @click="changeDate('year')">最近一年</span>
+  </div>
+</template>
+
+<script>
+import { getDayTime } from '@/utils/dateutils'
+
+export default {
+  name: 'ChartTools',
+  model: {
+    props: 'timeRange',
+    event: 'change'
+  },
+  props: {
+    timeRange: {
+      type: Array,
+      default: function() {
+        return []
+      }
+    }
+  },
+  methods: {
+    changeDate(date) {
+      let startDate, endDate
+      if (date === 'today') { // 选择今日
+        startDate = getDayTime(new Date().getTime())
+        endDate = startDate
+      } else if (date === 'week') {
+        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'month') {
+        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'season') {
+        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
+        endDate = new Date()
+      } else if (date === 'year') {
+        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
+        endDate = new Date()
+      }
+      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
+      this.$emit('change', this.timeRange)
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+  .chart-tools {
+    display: inline-block;
+    background-color: #f2f2f2;
+    line-height: 32px;
+    padding-left: 10px;
+    padding-right: 10px;
+    .chart-tool-button{
+      padding: 5px;
+      line-height: 16px;
+      margin-top:5px;
+      font-size:13px;
+    }
+    .chart-tool-button:hover{
+      background-color: #8cc5ff;
+      cursor: pointer;
+      color:white
+    }
+    .chart-tool-button:active{
+      background-color: #8cc5ff;
+      color:white
+    }
+  }
+
+</style>