Commit f26b3400 authored by mzx's avatar mzx

测试矩阵接口对接

parent 56b4dc2c
import request from '@/utils/request'
export function listMatrix(data) {
return request({
url: '/usecase/matrix/getInfo',
method: 'post',
data: data
})
}
...@@ -3,27 +3,32 @@ ...@@ -3,27 +3,32 @@
<el-table <el-table
height="calc(100vh - 300px)" height="calc(100vh - 300px)"
:data="tableData" :data="tableData"
v-loading="loading"
border border
:header-cell-style="headerCellStyle" :header-cell-style="headerCellStyle"
:cell-style="tableCellStyle"
@cell-mouse-enter="cellMouseEnter" @cell-mouse-enter="cellMouseEnter"
@cell-mouse-leave="cellMouseLeave" @cell-mouse-leave="cellMouseLeave"
@cell-click="cellClick"
:cell-style="tableCellStyle"
> >
<el-table-column
label="测试场景\测试类型"
align="center"
width="160px"
prop="name"
></el-table-column>
<template v-for="(item, index) in echartsTabled"> <template v-for="(item, index) in echartsTabled">
<el-table-column <el-table-column
:key="index" :key="index"
:width="item.width ? item.width : ''" :width="item.width ? item.width : ''"
:fixed="item.width ? true : false" :fixed="item.width ? true : false"
:label="item.tableNmae" :label="item.title"
align="center" align="center"
> >
<template slot-scope="scope" height="calc(100vh - 350px)"> <template slot-scope="scope" height="calc(100vh - 350px)">
<span v-if="index === 0">{{ scope.row[item.tableCode] }}</span>
<div <div
v-if="scope.row[item.tableCode].status === '1'" v-if="scope.row[item.id].id !== ''"
class="table-span-style" class="table-span-style"
@click="viewDetail(scope.row[item.tableCode])" @click="viewDetail(scope.row[item.id].id)"
> >
{{ '√' }} {{ '√' }}
</div> </div>
...@@ -35,123 +40,151 @@ ...@@ -35,123 +40,151 @@
</template> </template>
<script> <script>
import { listMatrix } from '../../../api/setting/testMatrix'
export default { export default {
name: 'Index', name: 'Index',
data() { data() {
return { return {
// 遮罩层
loading: true,
// 表头信息 // 表头信息
echartsTabled: [ echartsTabled: [
{ // {
tableNmae: '测试场景\\测试类型', // tableNmae: '测试场景\\测试类型',
tableCode: 'test' // tableCode: 'test'
}, // },
{ // {
tableNmae: '文件审核', // tableNmae: '文件审核',
tableCode: 'file' // tableCode: 'file'
}, // },
{ // {
tableNmae: '系统服务漏扫', // tableNmae: '系统服务漏扫',
tableCode: 'missedScan' // tableCode: 'missedScan'
}, // },
{ // {
tableNmae: '固件代码漏扫', // tableNmae: '固件代码漏扫',
tableCode: 'codeScan' // tableCode: 'codeScan'
}, // },
{ // {
tableNmae: '端口扫描', // tableNmae: '端口扫描',
tableCode: 'portScanning' // tableCode: 'portScanning'
} // }
], ],
// 表格内容 // 表格内容
tableData: [ tableData: [
{ // {
test: 'TBOX-蜂窝以太网接口', // test: 'TBOX-蜂窝以太网接口',
file: { // file: {
id: 0, // id: 0,
status: '1' // status: '1'
}, // },
missedScan: { // missedScan: {
id: 0, // id: 0,
status: '1' // status: '1'
}, // },
codeScan: { // codeScan: {
id: 0, // id: 0,
status: '1' // status: '1'
}, // },
portScanning: { // portScanning: {
id: 0, // id: 0,
status: '1' // status: '1'
} // }
}, // },
{ // {
test: 'WiFi AP接口', // test: 'WiFi AP接口',
file: { // file: {
id: 1, // id: 1,
status: '1' // status: '1'
}, // },
missedScan: { // missedScan: {
id: 1, // id: 1,
status: '1' // status: '1'
}, // },
codeScan: { // codeScan: {
id: 1, // id: 1,
status: '1' // status: '1'
}, // },
portScanning: { // portScanning: {
id: 1, // id: 1,
status: '1' // status: '1'
} // }
}, // },
{ // {
test: 'WiFi Client接口', // test: 'WiFi Client接口',
file: { // file: {
id: 2, // id: 2,
status: '' // status: ''
}, // },
missedScan: { // missedScan: {
id: 2, // id: 2,
status: '' // status: ''
}, // },
codeScan: { // codeScan: {
id: 2, // id: 2,
status: '' // status: ''
}, // },
portScanning: { // portScanning: {
id: 2, // id: 2,
status: '' // status: ''
} // }
}, // },
{ // {
test: '充电以太网接口', // test: '充电以太网接口',
file: { // file: {
id: 3, // id: 3,
status: '1' // status: '1'
}, // },
missedScan: { // missedScan: {
id: 3, // id: 3,
status: '1' // status: '1'
}, // },
codeScan: { // codeScan: {
id: 3, // id: 3,
status: '1' // status: '1'
}, // },
portScanning: { // portScanning: {
id: 3, // id: 3,
status: '1' // status: '1'
} // }
} // }
], ],
formConfig: { formConfig: {
isNoHoverColor: '' isNoHoverColor: ''
} }
} }
}, },
mounted() {
this.getMatrix()
},
methods: { methods: {
/** 获取列表数据 */
getMatrix() {
listMatrix().then(res => {
this.loading = true
this.echartsTabled = res.data.header
this.tableData = res.data.rows
this.tableData.forEach((item, index) => {
const innerArray = this.tableData[index]
for (const key in innerArray) {
if (key !== 'name') {
if (innerArray[key] === '') {
innerArray[key] = { id: '' }
} else {
innerArray[key] = { id: innerArray[key] }
}
}
}
})
this.loading = false
})
},
/** 点击跳转详情 */
viewDetail(row) { viewDetail(row) {
// console.log('viewDetailrow', row) this.$message(row)
// console.log('表头信息', JSON.stringify(this.echartsTabled))
// console.log('表格内容', JSON.stringify(this.tableData))
}, },
// 表头样式
headerCellStyle(row, rowIndex) { headerCellStyle(row, rowIndex) {
if (row.columnIndex === 0) { if (row.columnIndex === 0) {
return { backgroundColor: '#1A6FD7' } return { backgroundColor: '#1A6FD7' }
...@@ -159,24 +192,16 @@ export default { ...@@ -159,24 +192,16 @@ export default {
return { backgroundColor: '#F2F2F2' } return { backgroundColor: '#F2F2F2' }
} }
}, },
// 列样式
tableCellStyle(row, column, rowIndex, columnIndex) { tableCellStyle(row, column, rowIndex, columnIndex) {
if (row.columnIndex === 0) { if (row.columnIndex === 0) {
return { backgroundColor: '#dde9f9' } return { backgroundColor: '#dde9f9' }
} }
}, },
cellClick(row, column, cell, event) {
// console.log('row', row)
// console.log('column', column)
// console.log('cell', cell)
// console.log('event', event)
},
/** 鼠标悬浮时的操作 */ /** 鼠标悬浮时的操作 */
cellMouseEnter(e, row, cell, column) { cellMouseEnter(e, row, cell, column) {
if (row.id !== 'el-table_1_column_1') { if (!row.width) {
var selrange = document.getElementsByClassName(row.id) var selrange = document.getElementsByClassName(row.id)
// console.log('row', row)
// console.log('cell', cell)
// console.log('selrange', selrange)
if (this.formConfig.isNoHoverColor) { if (this.formConfig.isNoHoverColor) {
cell.style.backgroundColor = '' cell.style.backgroundColor = ''
for (var i = 0; i < selrange.length; i++) { for (var i = 0; i < selrange.length; i++) {
...@@ -193,7 +218,7 @@ export default { ...@@ -193,7 +218,7 @@ export default {
}, },
/** 鼠标离开时的操作 */ /** 鼠标离开时的操作 */
cellMouseLeave(e, row, cell) { cellMouseLeave(e, row, cell) {
if (row.id !== 'el-table_1_column_1') { if (!row.width) {
var selrange = document.getElementsByClassName(row.id) var selrange = document.getElementsByClassName(row.id)
for (var i = 0; i < selrange.length; i++) { for (var i = 0; i < selrange.length; i++) {
selrange[i].style.backgroundColor = '' selrange[i].style.backgroundColor = ''
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment