|
|
@@ -1,14 +1,15 @@
|
|
|
<template>
|
|
|
<el-drawer
|
|
|
:modal="false"
|
|
|
- size="50%"
|
|
|
+ size="100%"
|
|
|
class="drawer-box"
|
|
|
destroy-on-close
|
|
|
:visible.sync="drawer"
|
|
|
:before-close="handleClose"
|
|
|
+ @click.stop
|
|
|
>
|
|
|
<template slot="title">
|
|
|
- <div>{{ title }}<span class="sub-title">{{ subTitle }}</span></div>
|
|
|
+ <div v-if="title">{{ title }}<span class="sub-title">{{ subTitle }}</span></div>
|
|
|
</template>
|
|
|
<!-- 时间线 -->
|
|
|
<div v-if="openDrawer && isTimeLine(1)" class="qz-drawer-padding qz-drawer-header">
|
|
|
@@ -21,9 +22,24 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 表格 -->
|
|
|
- <dmTable v-if="openDrawer" :table-list="tableList" :total="tableList" :column="column" :table-height="tableHeight" />
|
|
|
+ <dmTable v-if="openDrawer" v-loading="loading" :table-list="tableList" :total="tableList" :column="column" :table-height="tableHeight" @change="dmTableChange">
|
|
|
+ <template #bugStatusNameSlot="{scope}">
|
|
|
+ <div @click="print(scope)">自定义</div>
|
|
|
+ </template>
|
|
|
+ <!-- 报告名称 -->
|
|
|
+ <template #returnReasonSlot="{scope}">
|
|
|
+ <div v-if="scope.row.reportName">
|
|
|
+ <div class="drawer-name" @click.stop="jumper(scope.row,'提测')">{{ scope.row.reportName }}</div>
|
|
|
+ <div v-if="scope.row.returnReason" style="color: red">打开报告：{{ scope.row.returnReason }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <!-- 报告人 -->
|
|
|
+ <template #creatorObjectSlot="{scope}">
|
|
|
+ <div v-if="scope && scope.row && scope.row.creatorObject">{{ scope.row.creatorObject.name }}</div>
|
|
|
+ </template>
|
|
|
+ </dmTable>
|
|
|
<!-- 下拉 -->
|
|
|
- <div class="qz-footer-laout">
|
|
|
+ <div class="qz-footer-laout" @click.stop>
|
|
|
<div style="line-height: 60px;">
|
|
|
<!-- <el-button type="primary" size="mini" @click="exportTable">导 出</el-button>-->
|
|
|
</div>
|
|
|
@@ -41,11 +57,14 @@
|
|
|
</el-drawer>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { mapGetters } from 'vuex'
|
|
|
+// import { mapGetters } from 'vuex'
|
|
|
import { bugList } from '@/api/defectManage'
|
|
|
+import { getReportList } from '@/api/reportTemplate'
|
|
|
import dmTable from './components/table.vue'
|
|
|
import timeline from './components/timeline'
|
|
|
import { columns, timelineData } from './drawerModalData'
|
|
|
+import { EncryptId } from '@/utils/crypto-js'
|
|
|
+import Clickoutside from 'element-ui/src/utils/clickoutside'
|
|
|
|
|
|
Object.freeze(timelineData)
|
|
|
export default {
|
|
|
@@ -53,6 +72,7 @@ export default {
|
|
|
components: {
|
|
|
dmTable, timeline
|
|
|
},
|
|
|
+ directives: { Clickoutside },
|
|
|
props: {
|
|
|
// title: {
|
|
|
// type: String,
|
|
|
@@ -83,6 +103,9 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
drawer: false,
|
|
|
+ loading: false,
|
|
|
+ title: '',
|
|
|
+ headerTitle: '',
|
|
|
timelineData,
|
|
|
tableList: [],
|
|
|
tableHeight: 'auto',
|
|
|
@@ -97,16 +120,17 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- computed: {
|
|
|
- ...mapGetters(['bizId'])
|
|
|
- },
|
|
|
+
|
|
|
watch: {
|
|
|
+ drawerData() {
|
|
|
+ if (this.openDrawer) {
|
|
|
+ this.init()
|
|
|
+ }
|
|
|
+ },
|
|
|
openDrawer(value) {
|
|
|
+ this.drawer = false
|
|
|
if (value) {
|
|
|
this.init()
|
|
|
- this.setTitleHeight()
|
|
|
- this.setTimeLine()
|
|
|
- this.setColumn()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
@@ -117,34 +141,50 @@ export default {
|
|
|
this.drawer = false
|
|
|
},
|
|
|
methods: {
|
|
|
+ print(slotProp) {
|
|
|
+ console.log(slotProp)
|
|
|
+ },
|
|
|
init() {
|
|
|
+ console.log(this.drawerData)
|
|
|
+ this.pagingInit()
|
|
|
+ this.column = []
|
|
|
+ this.tableList = []
|
|
|
this.drawer = this.openDrawer
|
|
|
this.title = this.drawerData.label
|
|
|
- this.ids = this.drawerData.IdList.map(e => e)
|
|
|
+ this.headerTitle = this.drawerData.headerTitle
|
|
|
+ // this.ids = this.drawerData.IdList.map(e => e)
|
|
|
// this.ids = [14952, 15453, 15988, 16182, 17445, 17447, 17735, 18062, 18064, 18067, 19255, 19568, 19569, 19570, 19571, 19572, 19574, 19575, 19576, 19577, 19578, 19579, 19587, 19588, 19590, 19593, 19595, 19596, 19597, 19599, 19619, 19642, 19644, 19645, 19652, 19655, 19673, 19674, 19887, 19888, 19931, 19935, 19970, 20048, 20049, 20058, 20071, 20086, 20149, 20181, 20182, 20183, 20184, 20301, 20442, 20755, 20758, 20760, 20765, 20770, 20777, 20778, 20782, 20783, 20789, 20803, 20804, 20805, 20808, 20809, 20810, 20812, 20813, 20814, 20815, 20816, 20817, 20818, 20819, 20820, 20825, 20826, 20831, 20848, 20850, 20851]
|
|
|
- this.getBugStatisticData()
|
|
|
+ this.ids = [2049, 1662, 2050, 1644, 2051, 1657, 1670, 1715, 1728, 1692, 2048, 2052, 2047] // 提测报告
|
|
|
+ this.setTableList()
|
|
|
+ this.setTitleHeight()
|
|
|
+ this.setTimeLine()
|
|
|
+ this.setColumn()
|
|
|
},
|
|
|
handleClose() {
|
|
|
+ console.log(123)
|
|
|
this.drawer = false
|
|
|
this.$emit('update:openDrawer', this.drawer)
|
|
|
},
|
|
|
handleSizeChange(value) {
|
|
|
this.paging.pageSize = value
|
|
|
- this.getBugStatisticData()
|
|
|
+ this.setTableList()
|
|
|
},
|
|
|
handleCurrentChange(value) {
|
|
|
console.log(value)
|
|
|
this.paging.curIndex = value
|
|
|
- this.getBugStatisticData()
|
|
|
+ this.setTableList()
|
|
|
},
|
|
|
// 导出
|
|
|
exportTable() {
|
|
|
},
|
|
|
// 设置表格头
|
|
|
setColumn() {
|
|
|
- if (this.title.search(/新增缺陷|reopen缺陷|缺陷24小时修复率/) > -1) {
|
|
|
+ if (this.title.search(/新增缺陷|reopen|缺陷24小时修复率/) > -1) {
|
|
|
this.column = columns.bugColumn.map(e => e)
|
|
|
}
|
|
|
+ if (this.title.search(/提测打回率|准出不通过/) > -1) {
|
|
|
+ this.column = columns.deliverTestReportIdListColumns.map(e => e)
|
|
|
+ }
|
|
|
},
|
|
|
// 时间轴点击事件
|
|
|
timeLineClick({ value, name }, index) {
|
|
|
@@ -156,6 +196,17 @@ export default {
|
|
|
console.log(value, name, '第二条')
|
|
|
}
|
|
|
},
|
|
|
+ // 设置列表数据
|
|
|
+ setTableList() {
|
|
|
+ if (this.title.search(/新增缺陷|reopen/) > -1) {
|
|
|
+ this.loading = true
|
|
|
+ this.getBugStatisticData()
|
|
|
+ }
|
|
|
+ if (this.title.search(/提测打回率|准出不通过/) > -1) {
|
|
|
+ this.loading = true
|
|
|
+ this.setReportList()
|
|
|
+ }
|
|
|
+ },
|
|
|
// 累计新增缺陷
|
|
|
async getBugStatisticData() {
|
|
|
const paging = this.paging
|
|
|
@@ -165,9 +216,30 @@ export default {
|
|
|
curIndex: this.paging.curIndex,
|
|
|
pageSize: this.paging.pageSize
|
|
|
})
|
|
|
- this.tableList = res.data
|
|
|
- this.paging.pageTotal = res.total
|
|
|
- this.paging = { ...paging }
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.tableList = res.data
|
|
|
+ this.paging.pageTotal = res.total
|
|
|
+ this.paging = { ...paging }
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //
|
|
|
+ // 提测报告 deliverTestReportIdList 准出记录 releaseReportIdList
|
|
|
+ async setReportList() {
|
|
|
+ const key = this.title === '提测打回率' ? 'deliverTestReportIdList' : 'releaseReportIdList'
|
|
|
+ const paging = this.paging
|
|
|
+ const params = {
|
|
|
+ ...paging,
|
|
|
+ [key]: this.ids
|
|
|
+ }
|
|
|
+ delete params.pageTotal
|
|
|
+ const res = await getReportList(params)
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.tableList = res.data
|
|
|
+ this.paging.pageTotal = res.total
|
|
|
+ this.paging = { ...paging }
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
},
|
|
|
// 分页数据初始化
|
|
|
pagingInit() {
|
|
|
@@ -190,15 +262,19 @@ export default {
|
|
|
this.tableHeight = 'calc(100vh - 175px)'
|
|
|
} else if (this.title === '缺陷24小时修复率') {
|
|
|
this.tableHeight = 'calc(100vh - 416px)'
|
|
|
- } else if (this.title === '新增缺陷') {
|
|
|
+ } else if (this.title.search(/新增缺陷|提测打回率|reopen|准出不通过/) > -1) {
|
|
|
this.tableHeight = 'calc(100vh - 136px)'
|
|
|
} else {
|
|
|
- this.tableHeight = 'calc(100vh - 318px)'
|
|
|
+ this.tableHeight = 'calc(100vh - 136px)'
|
|
|
// this.tableHeight = 'calc(100vh - 10px)'
|
|
|
}
|
|
|
},
|
|
|
// 设置表头
|
|
|
-
|
|
|
+ // 表格跳转
|
|
|
+ dmTableChange({ column, row }) {
|
|
|
+ // console.log(column, row)
|
|
|
+ this.jumper(row, '缺陷')
|
|
|
+ },
|
|
|
// 设置时间轴自动滚动
|
|
|
setTimeLine() {
|
|
|
this.$nextTick(() => {
|
|
|
@@ -212,6 +288,12 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ jumper(val, name) { // 需求、任务、缺陷跳转
|
|
|
+ const { bizId = null } = this.$store.state.global || {}
|
|
|
+ const bizId_id = EncryptId(`${bizId}_${val.id}`)
|
|
|
+ const newTab = this.$router.resolve({ name: name + '详情', query: { bizId_id: bizId_id }})
|
|
|
+ window.open(newTab.href, '_blank')
|
|
|
+ },
|
|
|
// 设置时间轴自动滚动
|
|
|
isTimeLine(index = 1) {
|
|
|
// 是第一条
|
|
|
@@ -246,6 +328,27 @@ export default {
|
|
|
.drawer-box {
|
|
|
box-shadow: 0 8px 10px -5px rgba(0, 0, 0, .2), 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12);
|
|
|
}
|
|
|
+.el-drawer-fade-enter-active {
|
|
|
+ animation: el-drawer-fade-in 10ms;
|
|
|
+}
|
|
|
+.el-drawer-fade-leave-active {
|
|
|
+ animation: el-drawer-fade-in 10ms reverse;
|
|
|
+}
|
|
|
+.el-drawer__wrapper {
|
|
|
+ width: 100%;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ left: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+/deep/.el-drawer__container {
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 50%;
|
|
|
+}
|
|
|
/* S 时间轴 */
|
|
|
.qz-drawer-header {
|
|
|
text-align: center;
|
|
|
@@ -285,4 +388,8 @@ export default {
|
|
|
justify-content: space-between;
|
|
|
margin: 0 30px;
|
|
|
}
|
|
|
+.drawer-name:hover {
|
|
|
+ color: #409eff;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
</style>
|
洪海涛