template中
<el-dialog :visible.sync="dialogTableVisible">
<div slot="title" class="dialog-title">
<i class="el-icon-edit-outline"></i>
<span class="title-text">数据详情</span>
<div class="button-right">
<span class="title-close" @click="cancel"></span>
</div>
</div>
<el-table :data="gridData">
<el-table-column property="date" label="日期" width="150"></el-table-column>
<el-table-column property="name" label="姓名" width="200"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table>
</el-dialog>
data中
data () {
retrun: {
dialogTableVisible: false,
gridData: []
}
}
methods中:
methods: {
cancel () {
this.dialogTableVisible = false
}
}
style中:
<style>
.dialog-title {
text-align: left;
font-size: 14px;
font-weight: 700;
overflow: hidden;
}
.dialog-title i {
color: #45A4F9;
/* color: #0B2278; */
font-size: 16px;
line-height: 38px;
}
.dialog-footer {
text-align: left;
font-size: 14px;
font-weight: 700;
}
</style>