静态页面,数据都是写死的
<template>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column type="expand">
<template slot-scope="props">
<el-table
:data="dataList"
align="center"
stripe>
<el-table-column
align="center"
prop="duty">
</el-table-column>
<el-table-column
align="center"
prop="guard">
</el-table-column>
<el-table-column
align="center"
prop="accident">
</el-table-column>
<el-table-column
align="center"
prop="base">
</el-table-column>
<el-table-column
align="center"
prop="import">
</el-table-column>
</el-table>
</template>
</el-table-column>
<el-table-column
label="报号"
prop="id">
</el-table-column>
<el-table-column
label="号"
prop="pigeonhole">
</el-table-column>
<el-table-column
label="日期"
prop="date">
</el-table-column>
<el-table-column
label="事期"
prop="scene">
</el-table-column>
<el-table-column
label="地点"
prop="scenePlace">
</el-table-column>
<el-table-column
label="姓名"
prop="name">
</el-table-column>
<el-table-column
label="诊断"
prop="clinic">
</el-table-column>
<el-table-column
label="状态"
prop="legal">
</el-table-column>
<el-table-column
label="方式"
prop="pay">
</el-table-column>
<el-table-column
label="有无"
prop="survey">
</el-table-column>
</el-table>
</template>
js里data里:
data(){
return{
tableData: [
{
id: 'P201900001',
pigeonhole: 'GD123456789',
date: '2019-1-31',
scene: '2019-1-31',
scenePlace: '中国',
name: '鲜花',
clinic: '临床',
legal: '已支付',
pay: '转账',
survey: '2019-02-23'
},
{
id: 'P201900002',
pigeonhole: 'GD123456789',
date: '2019-1-31',
scene: '2019-1-31',
scenePlace: '中国',
name: '鲜花',
clinic: 'hjgrf', //
legal: '已支付',
pay: '转账',
survey: '2019-02-23'
},
{
id: 'P201900003',
pigeonhole: 'GD123456789',
date: '2019-1-31',
scene: '2019-1-31',
scenePlace: '中国',
name: '鲜花',
clinic: 'hjgrf', /
legal: '已支付',
pay: '内部转账',
survey: '2019-02-23'
}
],
dataList: [
{
duty: '责任',
guard: '预防',
accident: '意外',
base: '基础',
import: '重大'
},
{
duty: '金额',
guard: '3000',
accident: '1000',
base: '2000',
import: '4000'
}
] }
}
效果图如上