优化

src/views/quality/components/requireDrawer.vue

@@ -1,17 +1,43 @@
 <template>
-  <el-drawer :title="Statistics.label" :visible.sync="drawer_" :direction="direction" :modal="false" :before-close="handleClose">
-    <div class="integration-num">{{ Statistics.total }}</div>
+  <el-drawer :title="Statistics.label" :visible.sync="drawer_" :direction="direction" :modal="false" size="50%" :before-close="handleClose">
+    <div class=" _font">{{ Statistics.total }}</div>
     <el-table :data="tableData" style="width: 100%" class="integration-num">
-      <el-table-column prop="date" label="日期" min-width="180">
+      <el-table-column label="优先级" min-width="180">
         <template slot-scope="scope">
-          {{ scope.row.date }}
+          <div class="div_priority" :style="{background: priorityColors[scope.row.priority % priorityColors.length]}">{{ 'P'+scope.row.priority }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column :label="Statistics.typeStr + '名称'" min-width="250">
+        <template slot-scope="scope">
+          <div v-if="Statistics.typeStr === '需求' || Statistics.typeStr === '任务'">{{ scope.row.name }}</div>
+          <div v-if="Statistics.typeStr === '缺陷'">{{ scope.row.bugName }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" min-width="180">
+        <template slot-scope="scope">
+          <div v-if="Statistics.typeStr === '需求'">{{ scope.row.statusName }}</div>
+          <div v-if="Statistics.typeStr === '任务'">{{ scope.row.statusString }}</div>
+          <div v-if="Statistics.typeStr === '缺陷'">{{ querySatus(scope.row.status) }}</div>
         </template>
       </el-table-column>
     </el-table>
+    <el-pagination
+      style="text-align: center;"
+      :current-page="currentPage"
+      :page-sizes="[10, 20, 30, 40]"
+      :page-size="10"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="total"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    />
   </el-drawer>
 </template>
 
 <script>
+import { getRequirement } from '@/api/requirement.js'
+import { taskList } from '@/api/taskIndex'
+import { bugList, bugGetEnum } from '@/api/defectManage'
 export default {
   props: {
     data: { type: Object, required: true },
@@ -19,8 +45,16 @@ export default {
   },
   data() {
     return {
+      priorityColors: ['#F56C6C', '#FF8952', '#F5E300', '#7ED321', '#61D3B8', '#69B3FF', '#BDBDBD'],
       Statistics: {}, // title
       direction: 'rtl',
+      bugList: [],
+      currentPage: 1,
+      total: 0,
+      paging: {
+        curIndex: 1, // 分页
+        pageSize: 15 // 分页
+      },
       tableData: [{
         date: '2016-05-02',
         name: '王小虎',
@@ -41,13 +75,65 @@ export default {
     data: {
       handler(newV, oldV) {
         this.Statistics = newV
+        this.getTableData()
       },
       immediate: true
     }
   },
+  created() {
+    this.bugGetEnum()
+  },
   methods: {
+    async getTableData() {
+      if (this.Statistics.idList !== undefined && this.Statistics.idList.length > 0) {
+        this.paging.ids = this.Statistics.idList
+        if (this.Statistics.typeStr === '需求') {
+          const res = await getRequirement(this.paging)
+          if (res.code === 200) {
+            this.tableData = res.data.list
+            this.total = res.data.total
+          }
+        } else if (this.Statistics.typeStr === '任务') {
+          const res = await taskList(this.paging)
+          if (res.code === 200) {
+            this.tableData = res.data
+            this.total = res.total
+          }
+        } else if (this.Statistics.typeStr === '缺陷') {
+          const res = await bugList(this.paging)
+          if (res.code === 200) {
+            this.tableData = res.data
+            this.total = res.total
+          }
+        }
+      } else {
+        this.tableData = []
+      }
+    },
+    querySatus(val) {
+      let data = ''
+      this.bugList.map(item => {
+        if (val === item.code) {
+          data = item.name
+        }
+      })
+      return data
+    },
+    async bugGetEnum() {
+      const res = await bugGetEnum()
+      if (res.code === 200) {
+        this.bugList = res.data.bugEnumList
+      }
+    },
+    handleSizeChange(val) {
+      this.paging.pageSize = val
+      this.getTableData()
+    },
+    handleCurrentChange(val) {
+      this.paging.curIndex = val
+      this.getTableData()
+    },
     handleClose(done) {
-      this.drawer = false
       this.$emit('clone')
     }
   }
@@ -56,6 +142,22 @@ export default {
 
 <style lang="scss" scoped>
 .integration-num {
-  margin: 0 20px;
+  margin: 20px;
+}
+.div_priority {
+  color: #ffffff;
+  width:fit-content;
+  padding: 0 12px;
+  border-radius: 4px;
+  margin-left: 4px;
+}
+._font {
+  font-size: 16px;
+  color: #409eff;
+}
+>>>.el-drawer__header {
+    color: #444;
+    font-size: 20px;
+    font-weight: 500;
 }
 </style>

src/views/quality/defectStatistics.vue

@@ -83,7 +83,7 @@
                 <i class="el-icon-info" />
               </el-tooltip>
             </div>
-            <div class="item-title">{{ item.total }}</div>
+            <div class="item-title" @click="getRequiredNum(item)">{{ item.total }}</div>
             <div class="item-line" />
             <div v-show="Number(item.relativeRatio)>=0" class="item-up">环比：<i class="el-icon-caret-top" />{{ item.relativeRatio }}%</div>
             <div v-show="Number(item.relativeRatio)<0" class="item-down">环比：<i class="el-icon-caret-bottom" />{{ item.relativeRatio.substring(1,item.relativeRatio.length) }}%</div>
@@ -301,12 +301,14 @@
         </el-table>
       </div>
     </el-main>
+    <require-drawer :drawer="drawer" :data="requireList" @clone="clone" />
   </el-container>
 </template>
 <script>
 import moment from 'moment'
 moment.locale('zh-cn')
 import { mapGetters } from 'vuex'
+import requireDrawer from './components/requireDrawer'
 import { settingQueryBizModuleList } from '@/api/defectManage'
 import { teamQueryTeamInfoList } from '@/api/configure'
 import {
@@ -323,9 +325,11 @@ import {
 import normalEchart from '@/components/chart/normalEchart'
 import childChart from './components/childCharts'
 export default {
-  components: { normalEchart, childChart },
+  components: { normalEchart, childChart, requireDrawer },
   data() {
     return {
+      drawer: false,
+      requireList: {},
       echartsOption1: null,
       echartsOption2: null,
       echartsOption3: null, // 趋势图
@@ -737,6 +741,15 @@ export default {
         column.order === 'ascending' ? this.memberSort = 7 : this.memberSort = 8
       }
       this.getMemberDistributeData()
+    },
+    getRequiredNum(value) {
+      console.log(value, 'cdcsdcd')
+      this.drawer = true
+      value.typeStr = '缺陷'
+      this.requireList = value
+    },
+    clone(v) {
+      this.drawer = v
     }
   }
 }
@@ -825,6 +838,7 @@ export default {
       .item-title {
         font-size: 40px;
         padding: 5% 20px;
+        cursor: pointer;
       }
       .item-up,.item-down {
         font-size: 13px;

src/views/quality/requireStatistics.vue

@@ -482,6 +482,7 @@ export default {
     },
     getRequiredNum(value) {
       this.drawer = true
+      value.typeStr = '需求'
       this.requireList = value
     },
     clone(v) {

src/views/quality/taskStatistics.vue

@@ -83,7 +83,7 @@
                 <i class="el-icon-info" />
               </el-tooltip>
             </div>
-            <div class="item-title">{{ item.total }}</div>
+            <div class="item-title" @click="getRequiredNum(item)">{{ item.total }}</div>
             <div class="item-line" />
             <div v-show="Number(item.relativeRatio)>=0" class="item-up">环比：<i class="el-icon-caret-top" />{{ item.relativeRatio }}%</div>
             <div v-show="Number(item.relativeRatio)<0" class="item-down">环比：<i class="el-icon-caret-bottom" />{{ item.relativeRatio.substring(1,item.relativeRatio.length) }}%</div>
@@ -167,12 +167,14 @@
         <bug-list :chart-data="bugListData" />
       </div>
     </el-main>
+    <require-drawer :drawer="drawer" :data="requireList" @clone="clone" />
   </el-container>
 </template>
 <script>
 import moment from 'moment'
 moment.locale('zh-cn')
 import { mapGetters } from 'vuex'
+import requireDrawer from './components/requireDrawer'
 import { settingQueryBizModuleList } from '@/api/defectManage'
 import { teamQueryTeamInfoList } from '@/api/configure'
 import {
@@ -210,10 +212,13 @@ export default {
     statusStayChart,
     belongChart,
     changeRequireChart,
-    bugList
+    bugList,
+    requireDrawer
   },
   data() {
     return {
+      drawer: false,
+      requireList: {},
       bugCountTimeType: 1, // 获取趋缺陷势图数据接口入参：1本周 2本月 3本年
       timeTypeList: [ // 日期选择
         { code: 1, label: '周' },
@@ -491,6 +496,14 @@ export default {
       }
       const res = await getBugStatisticData(params)
       if (res.code === 200) this.bugListData = res.data
+    },
+    getRequiredNum(value) {
+      this.drawer = true
+      value.typeStr = '任务'
+      this.requireList = value
+    },
+    clone(v) {
+      this.drawer = v
     }
   }
 }
@@ -586,6 +599,7 @@ export default {
     .item-title {
       font-size: 40px;
       padding: 5% 20px;
+      cursor: pointer;
     }
     .item-up,.item-down {
       font-size: 13px;