<template>
<div>
<center>
<table border="1">
<thead>
<tr>
<th>序号</th>
<th>项目</th>
<th>分类</th>
<th>分项</th>
<th>现场管理</th>
<th>重大隐患</th>
<th>汇总</th>
<th>备注</th>
</tr>
</thead>
<tbody>
<tr v-for="item in tableData" :key="item.id">
<td>{{ item.id }}</td>
<td :rowspan="item.projectspan" :class="{hidden: item.projectdis}">{{ item.project }}</td>
<td :rowspan="item.typespan" :class="{hidden: item.typedis}">{{ item.type }}</td>
<td>{{item.subentry}}</td>
<td>{{item.nowManage}}</td>
<td>{{item.Hidden}}</td>
<td>{{item.Total}}</td>
<td>{{item.remark}}</td>
</tr>
</tbody>
</table>
</center>
</div>
</template>
<script>
export default {
data () {
return {
title: '风险评估',
isShow: false,
isFinish: false,
tableData: [
{
id: 1,
project: '企业性质分类',
type: '针对企业类别',
subentry: '生产(危险化学品生产企业)Ⅰ类A、B、C、级',
nowManage: '3.2',
Hidden: '是',
Total: '',
remark: '备注备注'
},
{
id: 2,
project: '企业性质分类',
type: '针对企业类别',
subentry: '使用(兰炭及配套企业)Ⅱ类A、B、C、级',
nowManage: '3.2',
Hidden: '是',
Total: '',
remark: ''
},
{
id: 3,
project: '企业性质分类',
type: '针对企业类别',
subentry: '储存、经营(加油站)Ⅲ类A、B、C、级C、级',
nowManage: '3.2',
Hidden: '是',
Total: '',
remark: ''
},
{
id: 4,
project: '三同时执行情况',
type: '针对改扩',
subentry: '改扩建未执行',
nowManage: '3.2',
Hidden: '是',
Total: '',
remark: ''
}
]
}
},
created () {
this.getData(this.tableData)
},
methods: {
getData (list) {
console.log(list, '==============')
for (let item in list[0]) {
let k = 0
let i = 0
while (k < list.length) {
list[k][item + 'span'] = 1
list[k][item + 'dis'] = false
for (i = k + 1; i <= list.length - 1; i++) {
if (list[k][item] === list[i][item] && list[k][item] !== '') {
list[k][item + 'span']++
list[k][item + 'dis'] = false
list[i][item + 'span'] = 1
list[i][item + 'dis'] = true
} else {
break
}
}
k = i
}
}
return list
}
}
}
</script>
<style scoped>
.hidden{
display: none
}
</style>
我始终没有搞懂item.projectdis
和 item.typedis
还有
this.tableData
里面没有那么多数据,但是打印的时候就莫名其妙的跑出很多属性,这是为什么?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…