统计分析整合

src/router/index.js

@@ -184,11 +184,11 @@ export const constantRoutes = [{
   path: '/quality',
   component: Layout,
   redirect: '/quality/qualityMeasurement',
-  name: '统计分析',
+  name: '老版统计',
   meta: { title: '统计分析', icon: '质量度量' },
   children: [{
     path: 'qualityMeasurement',
-    name: '老版统计',
+    name: '老版统计详情',
     component: (resolve) => require(['@/views/quality/qualityMeasurement.vue'], resolve),
     meta: { title: '老版统计' }
   },

src/router/newRouter.js

@@ -24,7 +24,7 @@ const layout = [
     children: [
       {
         path: 'teamDetail',
-        name: '个人工作台详情',
+        name: '团队工作台详情',
         component: () => import('@/views/workbench/team/index.vue'),
         meta: { title: '团队工作台' }
       }
@@ -212,22 +212,31 @@ const layout = [
         component: () => import('@/views/Platform/testPage.vue'),
         meta: { title: '测试计划' }
       },
+      {
+        path: 'allStatistics',
+        name: '统计分析',
+        cutOff: true,
+        component: () => import('@/views/quality/allStatistics.vue'),
+        meta: { title: '统计分析' }
+      },
       {
         path: 'requireStatistics',
         name: '需求统计',
-        cutOff: true,
+        hidden: true,
         component: () => import('@/views/quality/requireStatistics.vue'),
         meta: { title: '需求统计' }
       },
       {
         path: 'taskStatistics',
         name: '任务统计',
+        hidden: true,
         component: () => import('@/views/quality/taskStatistics.vue'),
         meta: { title: '任务统计' }
       },
       {
         path: 'defectStatistics',
         name: '缺陷统计',
+        hidden: true,
         component: () => import('@/views/quality/defectStatistics.vue'),
         meta: { title: '缺陷统计' }
       },

src/views/quality/allStatistics.vue

@@ -0,0 +1,58 @@
+<template>
+  <section class="all-statistics">
+    <div class="control-pages">
+      <span class="control-item" :class="{'is-active':isActive === 1}" @click="isActive=1">需求统计</span>
+      <span class="control-item" :class="{'is-active':isActive === 2}" @click="isActive=2">任务统计</span>
+      <span class="control-item" :class="{'is-active':isActive === 3}" @click="isActive=3">缺陷统计</span>
+    </div>
+    <require-statistics v-if="isActive === 1" />
+    <task-statistics v-if="isActive === 2" />
+    <defect-statistics v-if="isActive === 3" />
+  </section>
+</template>
+<script>
+import requireStatistics from './requireStatistics'
+import taskStatistics from './taskStatistics'
+import defectStatistics from './defectStatistics'
+export default {
+  components: {
+    requireStatistics, taskStatistics, defectStatistics
+  },
+  data() {
+    return {
+      isActive: 1
+    }
+  },
+  watch: {
+    isActive: {
+      handler(newV) {
+        newV > 0
+          ? this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, page: newV }})
+          : this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, page: 1 }})
+      }
+    }
+  },
+  created() {
+    this.$nextTick(() => {
+      this.isActive = this.$route.query.page ? Number(this.$route.query.page) : 1
+    })
+  }
+}
+</script>
+<style scoped lang="scss">
+.control-pages {
+  margin: 10px 10px 0 10px;
+  padding: 10px 20px 10px 20px;
+  border-radius: 4px;
+  background-color: #ffffff;
+  .control-item {
+    margin-right: 30px;
+    padding-bottom: 10px;
+    cursor: pointer;
+  }
+  .is-active {
+    color:#4099ff;
+    border-bottom: 1px solid #4099ff;
+  }
+}
+</style>