<div>
<el-table
:data="tableData1"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
:tree-props="{children: 'children'}"
>
<el-table-column
v-for="(item,index) in tableList"
:key="index"
:label="item.label"
:prop="item.prop"
></el-table-column>
<el-table-column label="操作" width="200">
<template slot-scope="scope">
<!-- Form -->
<el-dialog
title="添加部门"
:visible.sync="dialogFormVisible"
append-to-body
width="30%"
>
<el-form :model="form">
<el-form-item label="部门名称" :label-width="formLabelWidth">
<el-input v-model="form.name" autocomplete="off"></el-input>
</el-form-item>
<!-- <el-form-item label="活动区域" :label-width="formLabelWidth">
<el-select v-model="form.region" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
</div>
</el-dialog>`在这里插入代码片`
<el-button
type="primary"
@click="dialogFormVisible = true"
size="mini"
>添加</el-button>
<el-button @click="handleClick(scope.row)" type="primary" size="mini">编辑</el-button>
<el-button @click="downloadImg(scope.row)" type="danger" size="mini">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
tableData1: [
{
date: '宝鸡分段',
id: 11,
name: '1',
alias: 'admin',
operator: '2020-10-01 12:12:12',
children: [
{
date: '宝鸡一部',
id: 111,
name: '2',
alias: 'admin',
operator: '2020-10-01 12:12:12',
children: [
{
date: '宝鸡二部',
id: 1111,
name: '3',
alias: 'admin',
operator: '2020-10-01 12:12:12'
}
]
}
]
},
{
date: '河南分段',
id: 22,
name: '1',
alias: 'admin',
operator: '2020-10-01 12:12:12',
children: [
{
date: '河南一部',
id: 222,
name: '2',
alias: 'admin',
operator: '2020-10-01 12:12:12',
children: [
{
date: '河南二部',
id: 2222,
name: '3',
alias: 'admin',
operator: '2020-10-01 12:12:12'
}
]
}
]
}
],